finish Eit new design

accural-balance
Mohamed Mekawy 6 years ago
parent 4d6167d6e8
commit 2ee9d51f7e

@ -1,5 +1,5 @@
<ion-header> <ion-header>
<ion-toolbar class="header-toolbar"> <ion-toolbar class="header-toolbar-new">
<ion-buttons slot="start"> <ion-buttons slot="start">
<nav-buttons backLink=""></nav-buttons> <nav-buttons backLink=""></nav-buttons>
<!-- <ion-back-button color="light" class="btnBack" defaultHref="/eit/eit-list/" ></ion-back-button> --> <!-- <ion-back-button color="light" class="btnBack" defaultHref="/eit/eit-list/" ></ion-back-button> -->
@ -22,7 +22,7 @@
<ion-footer> <ion-footer>
<div class="centerDiv"> <div class="centerDiv">
<ion-button class="footer-button" color="customnavy" ion-button (click)="validateEITTransaction()"> <ion-button class="addEitOkButton" color="customnavy" ion-button (click)="validateEITTransaction()">
{{'vacation-rule, next-label' | translate}}</ion-button> {{'vacation-rule, next-label' | translate}}</ion-button>
</div> </div>
</ion-footer> </ion-footer>

@ -11,7 +11,7 @@ ion-label {
.daynamicForm-Label { .daynamicForm-Label {
font-size: 16px; font-size: 16px;
color: var(--customnavy) !important; color: #a2a5a6 !important;
display: block; display: block;
overflow: hidden; overflow: hidden;
-webkit-flex: 1; -webkit-flex: 1;
@ -20,4 +20,20 @@ ion-label {
white-space: normal; white-space: normal;
padding: 5px 0px; padding: 5px 0px;
margin: 10px auto; margin: 10px auto;
padding-left: 10px;
}
.header-toolbar-new{
--background: #22c6b3;
}
.addEitOkButton{
white-space: normal !important;
text-transform: capitalize !important;
min-height: 45px !important;
min-width: 5px !important;
margin: 8px !important;
background-color: #22c6b3;
width: 80% !important;
color: white!important;
border-radius: 16px !important;
} }

@ -1,5 +1,5 @@
<ion-header> <ion-header>
<ion-toolbar class="header-toolbar"> <ion-toolbar class="header-toolbar-new">
<nav-buttons></nav-buttons> <nav-buttons></nav-buttons>
<ion-title color="light">{{headerTitle}}</ion-title> <ion-title color="light">{{headerTitle}}</ion-title>
</ion-toolbar> </ion-toolbar>
@ -115,7 +115,7 @@
{{employee.APPROVER}} {{employee.APPROVER}}
</ion-label> </ion-label>
<ion-label style="color:black !important ;padding-top: 4%;"> <ion-label style="color:black !important ;padding-top: 4%;">
{{employee.APPROVER_TYPE}} {{employee.POSITION_TITLE}}
</ion-label> </ion-label>
</ion-col> </ion-col>
@ -260,7 +260,7 @@
<ion-footer> <ion-footer>
<div class="centerDiv"> <div class="centerDiv">
<ion-button class="footer-button" color="customnavy" ion-button (click)="startEitApproval()"> <ion-button class="confirmEitOkButton" color="customnavy" ion-button (click)="openSubmitModal()">
{{ (isDelete ? 'general, delete' : 'general, submit') | translate }}</ion-button> {{ (isDelete ? 'general, delete' : 'general, submit') | translate }}</ion-button>
</div> </div>
</ion-footer> </ion-footer>

@ -211,3 +211,33 @@
text-align: center; text-align: center;
font-size: 5px; font-size: 5px;
} }
.note-modal {
// width: 90%;
// height: 50%;
// top: 20%;
// left: 5%;
// right: 5%;
// bottom: 5%;
background: rgba(0, 0, 0, 0.5) !important;
padding: 30% 10% !important;
--height: 12cm !important;
// --width: 80% !important;
--border-radius:20px;
}
.header-toolbar-new{
--background: #22c6b3;
}
.confirmEitOkButton{
white-space: normal !important;
text-transform: capitalize !important;
min-height: 45px !important;
min-width: 5px !important;
margin: 8px !important;
background-color: #22c6b3;
width: 80% !important;
color: white!important;
border-radius: 16px !important;
}

@ -13,6 +13,7 @@ import { TranslatorService } from 'src/app/hmg-common/services/translator/transl
import { EitService } from '../services/eit.service'; import { EitService } from '../services/eit.service';
import { AddEitResponse } from '../models/add.eit.response'; import { AddEitResponse } from '../models/add.eit.response';
import { FileUploader } from 'ng2-file-upload'; import { FileUploader } from 'ng2-file-upload';
import { SubmitEitModalComponent } from '../submit-eit-modal/submit-eit-modal.component';
@Component({ @Component({
selector: 'app-confirm-add-eit', selector: 'app-confirm-add-eit',
@ -292,6 +293,37 @@ export class ConfirmAddEitComponent implements OnInit {
return await modal.present(); return await modal.present();
} }
/*****submit modal********/
async openSubmitModal() {
this.cs.sharedService.setSharedData( this.attachListOver, 'submitAttachmentList');
this.cs.sharedService.setSharedData(this.eitComments, 'eitComments');
const modal = await this.modalController.create({
component: SubmitEitModalComponent,
backdropDismiss: false,
});
modal.cssClass = 'note-modal';
modal.onDidDismiss()
.then((data) => {
console.log(data.data);
if (data.data == "cancel" || data.data == undefined) {
return;
} else {
this.startEitApproval();
}
});
return await modal.present();
}
removeFile(objectitem) { removeFile(objectitem) {
@ -500,7 +532,7 @@ export class ConfirmAddEitComponent implements OnInit {
P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1], P_FILE_CONTENT_TYPE: attachType,//type.split('/')[1],
P_FILE_DATA: fileData.split(',')[1], P_FILE_DATA: fileData.split(',')[1],
P_FILE_NAME: name,//.split('.')[0], P_FILE_NAME: name,//.split('.')[0],
P_TRANSACTION_ID: this.TransactionID P_TRANSACTION_ID: this.P_TransactionID
}) })
} catch (e) { } catch (e) {

@ -334,7 +334,7 @@ export class EitListComponent implements OnInit {
// this.P_TransactionID=result.SubmitEITTransactionList.P_TRANSACTION_ID; // this.P_TransactionID=result.SubmitEITTransactionList.P_TRANSACTION_ID;
// this.sharedData.setSharedData(result,AddEitResponse.SHARED_DATA); // this.sharedData.setSharedData(result,AddEitResponse.SHARED_DATA);
// // this.sharedData.setSharedData(result.SubmitEITTransactionList.P_TRANSACTION_ID,"TransactionIDResubmit"); // //this.cs.sharedService.setSharedData(result.SubmitEITTransactionList.P_TRANSACTION_ID,"TransactionIDResubmit");
// // this.sharedData.setSharedData(this.eitRequest,EitRequest.SHARED_DATA); // // this.sharedData.setSharedData(this.eitRequest,EitRequest.SHARED_DATA);
this.cs.sharedService.setSharedData({ isResubmit: false, isDelete: this.isDelete }, 'confirmAddEITData') this.cs.sharedService.setSharedData({ isResubmit: false, isDelete: this.isDelete }, 'confirmAddEITData')
this.cs.openConfirmEitPage(); this.cs.openConfirmEitPage();

@ -13,6 +13,7 @@ import { EitListComponent } from './eit-list/eit-list.component';
import { DatePicker } from '@ionic-native/date-picker/ngx'; import { DatePicker } from '@ionic-native/date-picker/ngx';
import { WorkListAttachViewComponent } from '../notification/work-list-attach-view/work-list-attach-view.component'; import { WorkListAttachViewComponent } from '../notification/work-list-attach-view/work-list-attach-view.component';
import { EitUpdateListComponent } from './eit-update-list/eit-update-list.component'; import { EitUpdateListComponent } from './eit-update-list/eit-update-list.component';
import { SubmitEitModalComponent } from './submit-eit-modal/submit-eit-modal.component';
const routes: Routes = [ const routes: Routes = [
@ -43,6 +44,10 @@ const routes: Routes = [
{ {
path: 'eit-update-list', path: 'eit-update-list',
component: EitUpdateListComponent component: EitUpdateListComponent
},
{
path: 'eit-submit-modal',
component: SubmitEitModalComponent
} }
] ]
} }
@ -63,7 +68,8 @@ const routes: Routes = [
AddEitComponent, AddEitComponent,
ConfirmAddEitComponent, ConfirmAddEitComponent,
AddAttachComponent, AddAttachComponent,
EitUpdateListComponent EitUpdateListComponent,
SubmitEitModalComponent
], ],
entryComponents: [ entryComponents: [
WorkListAttachViewComponent WorkListAttachViewComponent

@ -0,0 +1,39 @@
<ion-content padding>
<!--
<ion-col col-1
style="margin-right: -22px;margin-top: -10px;">
<ion-button class="closeIcon" (click)="closeModal()">
<img src="../assets/imgs/close.png">
</ion-button>
</ion-col> -->
<h2><div class="Header">Confirmation</div></h2>
<div>
<div *ngIf="submitAttachmentList.length==0" class="labelcheck" lines="none" style="text-align: center;">
No Attachment
</div>
<div *ngIf="eitComments==''" class="labelcheck" style="text-align: center;margin-bottom: 5px;padding-bottom: 16px;">
No Note
</div>
</div>
<ion-footer style="border-top: 1px solid grey !important;">
<ion-row class="rowBtn">
<ion-label class="labelRadio">Are you sure you want to submit</ion-label>
<ion-button class="submitOkButton" (click)="OkBtnModal()"> {{ts.trPK('general','ok')}}
</ion-button>
</ion-row>
<ion-row class="rowBtn">
<ion-button class="submitCancelButton" (click)="closeModal()"> {{ts.trPK('general','cancel')}}
</ion-button>
</ion-row>
</ion-footer>
</ion-content>

@ -0,0 +1,53 @@
.rowBtn{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.Header{
color: black !important;
font-size: 25px !important;
font-weight: bold !important;;
margin: 0;
text-align: center;
margin-bottom: 20px;
}
.labelRadio{
color: black !important;
font-weight: bold !important;
padding-bottom: 20px;
}
.labelcheck{
color: red !important;
font-weight: bold !important;
margin-bottom: 10px;
}
.submitOkButton{
white-space: normal !important;
text-transform: capitalize !important;
min-height: 45px !important;
min-width: 5px !important;
margin: 8px !important;
--background:: #22c6b3;
width: 100% !important;
color: white!important;
border-radius: 16px !important;
}
.submitCancelButton{
white-space: normal !important;
text-transform: capitalize !important;
min-height: 45px !important;
min-width: 5px !important;
margin: 8px !important;
--background:: #094875;
width: 100% !important;
color: white!important;
border-radius: 16px !important;
}

@ -0,0 +1,27 @@
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { SubmitEitModalComponent } from './submit-eit-modal.component';
describe('SubmitEitModalComponent', () => {
let component: SubmitEitModalComponent;
let fixture: ComponentFixture<SubmitEitModalComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ SubmitEitModalComponent ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SubmitEitModalComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,36 @@
import { Component, OnInit } from '@angular/core';
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
import { ModalController } from '@ionic/angular';
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
@Component({
selector: 'app-submit-eit-modal',
templateUrl: './submit-eit-modal.component.html',
styleUrls: ['./submit-eit-modal.component.scss'],
})
export class SubmitEitModalComponent implements OnInit {
submitAttachmentList :any =[];
eitComments: string;
constructor( private ts: TranslatorService,private modalCtrl: ModalController, private cs: CommonService){
this.submitAttachmentList = this.cs.sharedService.getSharedData('submitAttachmentList', false);
this.eitComments = this.cs.sharedService.getSharedData('eitComments', false);
}
ngOnInit() {
console.log("modal");
//this.actionBtns = this.cs.sharedService.getSharedData("passActionMore" , false);
console.log("modal");
}
closeModal() {
this.modalCtrl.dismiss();
}
OkBtnModal() {
let data = "ok";
this.modalCtrl.dismiss(data);
}
}

@ -23,7 +23,7 @@ export class SelectInput extends UiElement {
if (this.disabled == "N") { this.disabled = "disabled" } else { this.disabled = "" } if (this.disabled == "N") { this.disabled = "disabled" } else { this.disabled = "" }
if (this.hidden == "N") { this.hidden = "display:none;" } else { this.hidden = "" } if (this.hidden == "N") { this.hidden = "display:none;" } else { this.hidden = "" }
const template = const template =
"<div class='custom-text-area-element' style='"+this.hidden+"'>" + "<div class='custom-text-area-element dynamicField' style='"+this.hidden+"'>" +
" <label class='daynamicForm-Label "+requiredClass+"' id='title' >" + this.label + "</label>" + " <label class='daynamicForm-Label "+requiredClass+"' id='title' >" + this.label + "</label>" +
" <select class='daynamicForm-Select' id='" + this.elementId + "' "+this.disabled+">"+ " <select class='daynamicForm-Select' id='" + this.elementId + "' "+this.disabled+">"+
"<option value='"+this.value+"' >"+this.value+"</option>"+ "<option value='"+this.value+"' >"+this.value+"</option>"+

@ -544,7 +544,7 @@ ion-col.colBold,ion-col.colBold>label{
/*****************dynamic form*******************/ /*****************dynamic form*******************/
.dynamicField{ .dynamicField{
border-radius: 30px; border-radius: 30px;
border: 1px solid grey!important; border: 1px solid #a2a5a6!important;
margin-bottom: 20px; margin-bottom: 20px;
} }
@ -552,7 +552,7 @@ ion-col.colBold,ion-col.colBold>label{
.daynamicForm-Label{ .daynamicForm-Label{
font-size: 16px; font-size: 16px;
// margin-left: 15px; // margin-left: 15px;
color: var(--customnavy); color: #a2a5a6 !important;
display: block; display: block;
overflow: hidden; overflow: hidden;
-webkit-box-flex: 1; -webkit-box-flex: 1;
@ -565,6 +565,7 @@ ion-col.colBold,ion-col.colBold>label{
white-space: normal; white-space: normal;
// padding-top: 10px; // padding-top: 10px;
padding: 5px 0px; padding: 5px 0px;
padding-left: 10px !important;
margin: 10px auto; margin: 10px auto;
:root[dir="ltr"]{ :root[dir="ltr"]{
font-family: var(--fontFamilySemiBoldEN) !important; font-family: var(--fontFamilySemiBoldEN) !important;
@ -677,11 +678,13 @@ img.flipImg{
font-weight: 400; font-weight: 400;
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
width: 100%; width: 80%;
padding: 6px 0px; padding: 6px 0px;
background-color: var(--light); background-color: var(--light);
border-bottom: var(--cusgray) solid 1px; border-bottom: var(--cusgray) solid 1px;
border-radius: 0px; border-radius: 0px;
margin-left: 20px;
margin-top: -10px;
// -webkit-appearance: none; // -webkit-appearance: none;
// -moz-appearance: none; // -moz-appearance: none;
text-indent: 1px; text-indent: 1px;
@ -1147,3 +1150,7 @@ border:0px
justify-content: center !important; justify-content: center !important;
} }
.modal-wrapper{
border-radius: 20px !important;
}

Loading…
Cancel
Save