From 79feab44e3d8ba3960744b00788beb0e72d90f20 Mon Sep 17 00:00:00 2001 From: "Fatimah.Alshammari" Date: Thu, 27 Feb 2020 12:35:25 +0300 Subject: [PATCH 1/2] design dynamic form and translate --- .../app/eit/add-eit/add-eit.component.scss | 1 + .../app/eit/eit-list/eit-list.component.html | 6 +- .../app/eit/eit-list/eit-list.component.scss | 7 +- Mohem/src/app/eit/home/home.component.html | 1 + Mohem/src/app/eit/home/home.component.scss | 7 ++ Mohem/src/app/uI-elements/select.input.ts | 41 +++++++-- Mohem/src/app/uI-elements/time.input.ts | 33 ++++++-- Mohem/src/theme/styles.scss | 83 ++++++++++++++++++- 8 files changed, 163 insertions(+), 16 deletions(-) diff --git a/Mohem/src/app/eit/add-eit/add-eit.component.scss b/Mohem/src/app/eit/add-eit/add-eit.component.scss index 08f5fd5c..22988b18 100644 --- a/Mohem/src/app/eit/add-eit/add-eit.component.scss +++ b/Mohem/src/app/eit/add-eit/add-eit.component.scss @@ -23,6 +23,7 @@ ion-label { padding-left: 10px; } + .header-toolbar-new{ --background: #22c6b3; } diff --git a/Mohem/src/app/eit/eit-list/eit-list.component.html b/Mohem/src/app/eit/eit-list/eit-list.component.html index b8be6804..7cf67ff5 100644 --- a/Mohem/src/app/eit/eit-list/eit-list.component.html +++ b/Mohem/src/app/eit/eit-list/eit-list.component.html @@ -1,6 +1,8 @@ - + + + {{headerTitle}} @@ -130,7 +132,7 @@
- + diff --git a/Mohem/src/app/eit/eit-list/eit-list.component.scss b/Mohem/src/app/eit/eit-list/eit-list.component.scss index ed9b1079..05395d61 100644 --- a/Mohem/src/app/eit/eit-list/eit-list.component.scss +++ b/Mohem/src/app/eit/eit-list/eit-list.component.scss @@ -235,4 +235,9 @@ h4 { margin-right: 5px; // margin-bottom: 6px; } - \ No newline at end of file +// .icon-left{ +// margin-left: 10px; +// } +// .icon-right{ +// margin-left: 3px; +// } \ No newline at end of file diff --git a/Mohem/src/app/eit/home/home.component.html b/Mohem/src/app/eit/home/home.component.html index 761904cc..16d38ae6 100644 --- a/Mohem/src/app/eit/home/home.component.html +++ b/Mohem/src/app/eit/home/home.component.html @@ -2,6 +2,7 @@ {{headerTitle}} + diff --git a/Mohem/src/app/eit/home/home.component.scss b/Mohem/src/app/eit/home/home.component.scss index cc7f2852..8149a654 100644 --- a/Mohem/src/app/eit/home/home.component.scss +++ b/Mohem/src/app/eit/home/home.component.scss @@ -66,3 +66,10 @@ ion-icon::before { // border-bottom: 1px solid #dedede; // } + +// .icon-left{ +// margin-left: 10px; +// } +// .icon-right{ +// margin-left: 3px; +// } diff --git a/Mohem/src/app/uI-elements/select.input.ts b/Mohem/src/app/uI-elements/select.input.ts index f2797d44..d1cf8bf9 100644 --- a/Mohem/src/app/uI-elements/select.input.ts +++ b/Mohem/src/app/uI-elements/select.input.ts @@ -1,7 +1,9 @@ import { UiElement } from "./ui-element"; +import { TranslatorService } from '../hmg-common/services/translator/translator.service'; export class SelectInput extends UiElement { + public direction: string; constructor( private label: string, private elementId: string, @@ -11,25 +13,50 @@ export class SelectInput extends UiElement { private hidden: string, private required: string) { super(elementId, containerId, ''); + this.direction = TranslatorService.getCurrentLanguageName(); + console.log(this.direction); this.createElement(this.getTemplate()); } public getTemplate() { + let template :string = ""; let requiredClass: string = ""; if (this.required == 'Y') requiredClass = "requiredClass" if (this.disabled == "N") { this.disabled = "disabled" } else { this.disabled = "" } if (this.hidden == "N") { this.hidden = "display:none;" } else { this.hidden = "" } - const template = - "
" + - " " + - " "+ - "
"; + // const template = + // "
" + + // " " + + // " "+ + // "
"; + if(this.direction == 'en'){ + template = + "
" + + " " + + " "+ + "
"; + } + else{ + template = + "
" + + " " + + " "+ + "
"; + } +//[ngClass]=\"{\'daynamicForm-Select\': !ar,\'daynamicForm-Selects\':ar}\ + // [ngClass]= direction == 'en'? 'daynamicForm-Select' : 'daynamicForm-Selects' + // [ngClass]=" direction === 'rtl' ? 'daynamicForm-Selects' : 'daynamicForm-Select'" + // class='daynamicForm-Select' id='" + this.elementId + "' // "" + diff --git a/Mohem/src/app/uI-elements/time.input.ts b/Mohem/src/app/uI-elements/time.input.ts index 001589f0..7f148729 100644 --- a/Mohem/src/app/uI-elements/time.input.ts +++ b/Mohem/src/app/uI-elements/time.input.ts @@ -1,6 +1,8 @@ import { UiElement } from "./ui-element"; +import { TranslatorService } from '../hmg-common/services/translator/translator.service'; export class TimeInput extends UiElement { + public direction: string; constructor( private label: string, private elementId: string, @@ -10,6 +12,7 @@ export class TimeInput extends UiElement { private hidden: string, private required: string) { super(elementId, containerId, ''); + this.direction = TranslatorService.getCurrentLanguageName(); this.createElement(this.getTemplate()); } @@ -21,6 +24,7 @@ export class TimeInput extends UiElement { public getTemplate() { + let template :string = ""; let requiredClass: string = ""; let disaledClass = ""; if (this.required == 'Y') @@ -30,12 +34,31 @@ export class TimeInput extends UiElement { if (this.value == "currentTime") { this.formatDate(); } - const template = - "
" + - " " + + // const template = + // "
" + + // " " + // " "+ - "
"+this.value+"
"+ - "
"; + // "
"+this.value+"
"+ + // "
"; + + + if(this.direction == 'en'){ + template = + "
" + + " " + + // " "+ + "
"+this.value+"
"+ + "
"; + } + else{ + template = + "
" + this.label + "" + + // " "+ + "
" + this.elementId + "' data-dtvalue='" + this.value + "' "+this.disabled+">"+this.value+"
"+ + "
"; + + } // "" + // " " + this.label + "" + diff --git a/Mohem/src/theme/styles.scss b/Mohem/src/theme/styles.scss index 82603f96..277824d9 100644 --- a/Mohem/src/theme/styles.scss +++ b/Mohem/src/theme/styles.scss @@ -576,6 +576,37 @@ ion-col.colBold,ion-col.colBold>label{ } } + + +.ardaynamicForm-Label{ + font-size: 16px; + // margin-left: 15px; + color: #a2a5a6 !important; + display: block; + overflow: hidden; + -webkit-box-flex: 1; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + /* font-size: inherit; */ + // text-overflow: ellipsis; + // white-space: nowrap; + white-space: normal; + // padding-top: 10px; + padding: 5px 0px; + padding-left: 10px !important; + margin: 10px auto; + margin-right: 12px !important; + :root[dir="ltr"]{ + font-family: var(--fontFamilySemiBoldEN) !important; + } + :root[dir="rtl"]{ + font-family: var(--fontFamilyIOSAR) !important; + font-weight: bold; + } + +} + img.flipImg{ :root[dir="rtl"]{ -webkit-transform: scaleX(-1); @@ -646,6 +677,7 @@ img.flipImg{ box-shadow: none; -webkit-box-shadow:none; -moz-box-shadow: none; + margin-bottom: 8px; } .daynamicForm-DateTime:after{ width: 0; @@ -683,7 +715,8 @@ img.flipImg{ background-color: var(--light); border-bottom: var(--cusgray) solid 1px; border-radius: 0px; - margin-left: 20px; + // margin-left: 20px; + margin-left: 34px; margin-top: -10px; // -webkit-appearance: none; // -moz-appearance: none; @@ -712,6 +745,54 @@ img.flipImg{ } } + +.ardaynamicForm-Select{ + color: var(--dark); + font-size: 15px; + // background: url(http://i62.tinypic.com/15xvbd5.png) no-repeat 96% 0; + // background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiP…AgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=), -webkit-gradient(linear, left bottom, left top, color-stop(50%, rgba(0, 0, 0, 0.12)), color-stop(50%, rgba(0, 0, 0, 0.12))); + // background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiP…AgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=), linear-gradient(to top, rgba(0, 0, 0, 0.12) 50%, rgba(0, 0, 0, 0.12) 50%); + // background-size: 96% 0; + // background-repeat: no-repeat; + border: none; + font-weight: 400; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + width: 80%; + padding: 6px 0px; + background-color: var(--light); + border-bottom: var(--cusgray) solid 1px; + border-radius: 0px; + margin-right: 34px; + margin-top: -10px; + // -webkit-appearance: none; + // -moz-appearance: none; + text-indent: 1px; + // text-overflow: ''; + box-shadow: none; + -webkit-box-shadow:none; + -moz-box-shadow: none; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + + :root[dir="ltr"]{ + background-image: linear-gradient(45deg, transparent 50%, #999 50%), linear-gradient(135deg, #999 50%, transparent 50%), linear-gradient(to right, #ffffff, #ffffff); + background-position: calc(100% - 14px) calc(1em + 2px), calc(100% - 8px) calc(1em + 2px), 100% 0; + background-size: 6px 6px, 6px 6px, 2.9em 2.9em; + background-repeat: no-repeat; + padding-right: 20px; + } + :root[dir="rtl"]{ + background-image: linear-gradient(-135deg, #999 50%, transparent 50%),linear-gradient(-45deg, transparent 50%, #999 50%), linear-gradient(to right, #ffffff, #ffffff); + background-position: calc(1em - 10px) calc(100% - 8px), calc(1em - 4px) calc(100% - 8px), 0 100%; + background-size: 6px 6px, 6px 6px, 2.9em 2.9em; + background-repeat: no-repeat; + padding-left: 20px; + } +} + + .daynamicForm-Select:after{ width: 0; height: 0; From 43bc72b9b8dd0dc67fae06e180cd3301aaa5aa64 Mon Sep 17 00:00:00 2001 From: "Fatimah.Alshammari" Date: Thu, 27 Feb 2020 14:55:54 +0300 Subject: [PATCH 2/2] update translate and fix design --- .../models/attendanceSwipe.Request.ts | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) create mode 100644 Mohem/src/app/attendance/models/attendanceSwipe.Request.ts diff --git a/Mohem/src/app/attendance/models/attendanceSwipe.Request.ts b/Mohem/src/app/attendance/models/attendanceSwipe.Request.ts new file mode 100644 index 00000000..b08ad177 --- /dev/null +++ b/Mohem/src/app/attendance/models/attendanceSwipe.Request.ts @@ -0,0 +1,25 @@ +import { Request } from 'src/app/hmg-common/services/models/request'; + +export class attendanceSwipeScannerRequest extends Request{ + public static SHARED_DATA = 'attendanceSwipeScanner-request'; + public P_USER_NAME:string; + public P_PASSWORD: string; + public UserName: string; + public CompanyID:number; + public BranchID: number; + public UID:string; + public Latitude:number; + public Longitude:number; + public QRValue: string; + public MemberID:number; + public EmployeeID: number; + public IPAdress: string; + public UserID: string; +} + + + + + + +