From bcf84431577544d7dde8389f982fdd8007128b23 Mon Sep 17 00:00:00 2001 From: umasoodch Date: Tue, 17 Mar 2020 14:45:03 +0300 Subject: [PATCH] fixed header issue in application --- .../src/app/absence/home/home.component.html | 13 ++++-- .../confirm-login.component.html | 13 +++--- .../sms-page/sms-page.page.html | 12 ++---- .../app/eit/eit-list/eit-list.component.html | 11 ++--- Mohem/src/app/eit/home/home.component.html | 15 ++----- Mohem/src/app/hmg-common/hmg-common.module.ts | 8 +++- .../generic-header.component.html | 17 ++++++++ .../generic-header.component.scss | 26 ++++++++++++ .../generic-header.component.spec.ts | 27 ++++++++++++ .../generic-header.component.ts | 27 ++++++++++++ .../ui/nav-buttons/nav-buttons.component.html | 42 +------------------ .../ui/nav-buttons/nav-buttons.component.scss | 1 + Mohem/src/app/home/home.page.html | 18 ++++---- Mohem/src/app/home/home.page.scss | 34 --------------- Mohem/src/app/home/home.page.ts | 15 ++----- .../src/app/my-team/home/home.component.html | 10 +++-- .../app/notification/home/home.component.html | 13 +++--- .../src/app/payslip/home/home.component.html | 21 ++-------- .../time-card-details.component.html | 14 ++----- .../vacation-rule/home/home.component.html | 15 ++----- Mohem/src/theme/styles.scss | 1 - 21 files changed, 165 insertions(+), 188 deletions(-) create mode 100644 Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html create mode 100644 Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss create mode 100644 Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.spec.ts create mode 100644 Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts diff --git a/Mohem/src/app/absence/home/home.component.html b/Mohem/src/app/absence/home/home.component.html index 9d2845aa..061fa1e6 100644 --- a/Mohem/src/app/absence/home/home.component.html +++ b/Mohem/src/app/absence/home/home.component.html @@ -1,16 +1,21 @@ - + - - + + + + diff --git a/Mohem/src/app/authentication/confirm-login/confirm-login.component.html b/Mohem/src/app/authentication/confirm-login/confirm-login.component.html index a4a934f8..f5eef814 100644 --- a/Mohem/src/app/authentication/confirm-login/confirm-login.component.html +++ b/Mohem/src/app/authentication/confirm-login/confirm-login.component.html @@ -1,11 +1,8 @@ - - - - - - {{'login,verify-login' | translate}} - - + + diff --git a/Mohem/src/app/authentication/sms-page/sms-page.page.html b/Mohem/src/app/authentication/sms-page/sms-page.page.html index 0f83c9d6..654adc99 100644 --- a/Mohem/src/app/authentication/sms-page/sms-page.page.html +++ b/Mohem/src/app/authentication/sms-page/sms-page.page.html @@ -1,11 +1,7 @@ - - - - - - {{'verificationcode,verificationcode' | translate}} - - + + 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 ddf3476d..be446609 100644 --- a/Mohem/src/app/eit/eit-list/eit-list.component.html +++ b/Mohem/src/app/eit/eit-list/eit-list.component.html @@ -1,10 +1,7 @@ - - - {{headerTitle}} - - - - + +
diff --git a/Mohem/src/app/eit/home/home.component.html b/Mohem/src/app/eit/home/home.component.html index 5aa222c7..93b4716b 100644 --- a/Mohem/src/app/eit/home/home.component.html +++ b/Mohem/src/app/eit/home/home.component.html @@ -1,14 +1,7 @@ - - - {{headerTitle}} - - - - - - - - + + diff --git a/Mohem/src/app/hmg-common/hmg-common.module.ts b/Mohem/src/app/hmg-common/hmg-common.module.ts index 78c49b25..53ca12a2 100644 --- a/Mohem/src/app/hmg-common/hmg-common.module.ts +++ b/Mohem/src/app/hmg-common/hmg-common.module.ts @@ -117,6 +117,8 @@ import { CircleCalendarComponent } from './ui/circle-calendar/circle-calendar.co import { NgCalendarModule } from 'ionic2-calendar'; import { DateInfoModalComponent } from './ui/circle-calendar/date-info-modal/date-info-modal.component'; import { ChartModule } from 'primeng/chart'; +import { GenericHeaderComponent } from './ui/generic-header/generic-header.component'; + @NgModule({ imports: [ CommonModule, @@ -198,7 +200,8 @@ import { ChartModule } from 'primeng/chart'; ConfirmLoginComponent, CircleCalendarComponent, DateInfoModalComponent, - Modal + Modal, + GenericHeaderComponent ], exports: [ FabButtonComponent, @@ -268,7 +271,8 @@ import { ChartModule } from 'primeng/chart'; NgCalendarModule, ChartModule, FileUploadModule, - Modal + Modal, + GenericHeaderComponent ], providers: [ AttendScanService, diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html new file mode 100644 index 00000000..3d7b8fa8 --- /dev/null +++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.html @@ -0,0 +1,17 @@ + + + + + + + + {{headerText}} + + +
+ +
+
+
+
+
\ No newline at end of file diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss new file mode 100644 index 00000000..dabb931c --- /dev/null +++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss @@ -0,0 +1,26 @@ +.profile-image-container{ + display: block; + margin: 7px auto 0; + width: 32px; + height: 32px; + border-radius: 100%; + overflow: hidden; + text-align: center; + img{ + display: block; + margin: 0 auto; + max-width: 100%; + } +} +.ion-title{ + color: white; + font-size: 0.5cm; + font-weight: bold; + font-family: WorkSans-Regular; + display: block; + text-align: center; + line-height: 46px; +} +.header-toolbar-new { + --background: #22c6b3; +} \ No newline at end of file diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.spec.ts b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.spec.ts new file mode 100644 index 00000000..df85bb0f --- /dev/null +++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.spec.ts @@ -0,0 +1,27 @@ +import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { GenericHeaderComponent } from './generic-header.component'; + +describe('GenericHeaderComponent', () => { + let component: GenericHeaderComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ GenericHeaderComponent ], + schemas: [CUSTOM_ELEMENTS_SCHEMA], + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(GenericHeaderComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts new file mode 100644 index 00000000..737c6191 --- /dev/null +++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.ts @@ -0,0 +1,27 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { CommonService } from '../../services/common/common.service'; + +@Component({ + selector: 'app-generic-header', + templateUrl: './generic-header.component.html', + styleUrls: ['./generic-header.component.scss'], +}) +export class GenericHeaderComponent implements OnInit { + @Input() userImage = ''; + @Input() showImage = false; + @Input() showMenu = false; + @Input() showBack = false; + @Input() navigate = true; + @Input() headerText = ''; + @Input() backLink: string; + + + constructor(public common: CommonService) { } + + ngOnInit() {} + + openProfilePage() { + this.common.openEditProfile(); + } + +} diff --git a/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.html b/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.html index bfedc08a..e5e3e404 100644 --- a/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.html +++ b/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.html @@ -1,48 +1,8 @@ - - - - - - - - - - - - - - - - \ No newline at end of file + \ No newline at end of file diff --git a/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss b/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss index ab0299d1..d6361074 100644 --- a/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss +++ b/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss @@ -5,4 +5,5 @@ ion-menu-button { font-size: 0.8cm; color: white; background: #22c6b3; + margin: 0 auto; } \ No newline at end of file diff --git a/Mohem/src/app/home/home.page.html b/Mohem/src/app/home/home.page.html index dcb05139..636c6033 100644 --- a/Mohem/src/app/home/home.page.html +++ b/Mohem/src/app/home/home.page.html @@ -1,14 +1,10 @@ - - - - {{'home,dashboard' | translate}} -
-
-
- -
-
-
+ + diff --git a/Mohem/src/app/home/home.page.scss b/Mohem/src/app/home/home.page.scss index 29efd377..8d0bbe50 100644 --- a/Mohem/src/app/home/home.page.scss +++ b/Mohem/src/app/home/home.page.scss @@ -3,40 +3,6 @@ ion-row { margin-top: 10px; } -.header-toolbar-new{ - --background: #22c6b3; -} -.profile-image-container{ - position: relative; - z-index: 999; - // img { - // width: 32px; - // float: right; - // // margin-top: -42px; - // border-radius: 20px; - // height: 32px; - // // margin-right: 4px; - // } -} -.profile-image{ - width: 32px; - float: right; - // margin-top: -42px; - border-radius: 20px; - height: 32px; - // margin-right: 4px; -} -ion-title{ - color: white; - position: absolute; - top: 0; - text-align: center; - left: 4%; - right: 4%; - font-size: 0.42cm; - font-weight: bold; - height: 100%; -} ion-label{ display: block; color: black !important; diff --git a/Mohem/src/app/home/home.page.ts b/Mohem/src/app/home/home.page.ts index f0be12f4..e4d952e5 100644 --- a/Mohem/src/app/home/home.page.ts +++ b/Mohem/src/app/home/home.page.ts @@ -151,20 +151,16 @@ export class HomePage implements OnInit { } ngOnInit() { - this.direction = TranslatorService.getCurrentLanguageName(); // this.getUserDetails(); // this.getCount(); // this.events.subscribe('getNotCount', badge => { // this.notBadge = badge; // }); - this.myTeamTitle= this.ts.trPK('myTeam','myTeam-header'); - this.vacationRuleTitle = this.ts.trPK('vacation-rule','vacationRule'); - // this.myTeamIcon="assets/icon/new-design/leave_balance.png"; - // this.vacationRuleIcon="assets/icon/new-design/vacation_rules_icon.png" + this.direction = TranslatorService.getCurrentLanguageName(); + this.myTeamTitle = this.ts.trPK('myTeam', 'myTeam-header'); + this.vacationRuleTitle = this.ts.trPK('vacation-rule', 'vacationRule'); this.common.startLoading(); this.menu.enable(true); - // this.getUserDetails(); - // this.getCount(); this.events.subscribe('getNotCount', badge => { this.notBadge = badge; }); @@ -685,11 +681,6 @@ openattentracking() { this.common.openAttenTrackingpage(); } -openProfilePage() { - this.common.openEditProfile(); - } - - openStatsButton(link: any) { // tslint:disable-next-line: triple-equals if (link == '1') { diff --git a/Mohem/src/app/my-team/home/home.component.html b/Mohem/src/app/my-team/home/home.component.html index 73b200a7..18ea1529 100644 --- a/Mohem/src/app/my-team/home/home.component.html +++ b/Mohem/src/app/my-team/home/home.component.html @@ -1,12 +1,16 @@ - + - + --> + +
diff --git a/Mohem/src/app/notification/home/home.component.html b/Mohem/src/app/notification/home/home.component.html index e2a26be5..0694ffe2 100644 --- a/Mohem/src/app/notification/home/home.component.html +++ b/Mohem/src/app/notification/home/home.component.html @@ -1,11 +1,8 @@ - - - - - - {{ts.trPK('home','worklist')}} - - + +
diff --git a/Mohem/src/app/payslip/home/home.component.html b/Mohem/src/app/payslip/home/home.component.html index da4642cd..04c9d63a 100644 --- a/Mohem/src/app/payslip/home/home.component.html +++ b/Mohem/src/app/payslip/home/home.component.html @@ -1,20 +1,7 @@ - - - - - - - - {{ts.trPK('payslip','monthly-payslip')}} - - + + diff --git a/Mohem/src/app/time-card/time-card-details/time-card-details.component.html b/Mohem/src/app/time-card/time-card-details/time-card-details.component.html index 6e355081..67c7f422 100644 --- a/Mohem/src/app/time-card/time-card-details/time-card-details.component.html +++ b/Mohem/src/app/time-card/time-card-details/time-card-details.component.html @@ -1,13 +1,7 @@ - - - {{ts.trPK('home','monthly-attendance')}} - - - - - - - + +
diff --git a/Mohem/src/app/vacation-rule/home/home.component.html b/Mohem/src/app/vacation-rule/home/home.component.html index 9de43239..826d21d7 100644 --- a/Mohem/src/app/vacation-rule/home/home.component.html +++ b/Mohem/src/app/vacation-rule/home/home.component.html @@ -1,14 +1,7 @@ - - - - {{ 'vacation-rule, vacationRule' | translate}} - - - - - - - + + diff --git a/Mohem/src/theme/styles.scss b/Mohem/src/theme/styles.scss index 4436582d..a92d9b85 100644 --- a/Mohem/src/theme/styles.scss +++ b/Mohem/src/theme/styles.scss @@ -1319,7 +1319,6 @@ border:0px } .header-toolbar-new { --background: #22c6b3; - background: #22c6b3; }