add worklist new design
parent
5b7e435a31
commit
ece6e45d97
@ -0,0 +1,44 @@
|
|||||||
|
<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> -->
|
||||||
|
|
||||||
|
|
||||||
|
<ion-list>
|
||||||
|
<ion-radio-group>
|
||||||
|
<ion-list-header style="margin-bottom: 22px !important;">
|
||||||
|
<p class="Header">More Action</p>
|
||||||
|
</ion-list-header>
|
||||||
|
<div *ngFor="let button of actionBtns ">
|
||||||
|
|
||||||
|
<ion-item *ngIf="button.BUTTON_ACTION !='APPROVED' && button.BUTTON_ACTION !='REJECTED' && button.BUTTON_ACTION !='REQUEST_INFO' " >
|
||||||
|
<ion-label class="labelRadio"> {{button.BUTTON_LABEL}}</ion-label>
|
||||||
|
<ion-radio color="secondary" mode="md" value="{{button.BUTTON_ACTION}}" (ionSelect)="radioSelect(button)"></ion-radio>
|
||||||
|
|
||||||
|
<!-- </div> -->
|
||||||
|
</ion-item>
|
||||||
|
</div>
|
||||||
|
</ion-radio-group>
|
||||||
|
|
||||||
|
</ion-list>
|
||||||
|
|
||||||
|
|
||||||
|
<ion-footer>
|
||||||
|
<ion-row class="rowBtn">
|
||||||
|
<ion-button style="width:200px !important" class="confirmBtn" (click)="OkBtnModal()"> {{ts.trPK('general','ok')}}
|
||||||
|
</ion-button>
|
||||||
|
</ion-row>
|
||||||
|
|
||||||
|
<ion-row class="rowBtn">
|
||||||
|
<ion-button style="width:200px !important" class="cancelBtn" (click)="closeModal()"> {{ts.trPK('general','cancel')}}
|
||||||
|
</ion-button>
|
||||||
|
|
||||||
|
</ion-row>
|
||||||
|
</ion-footer>
|
||||||
|
</ion-content>
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
.rowBtn{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Header{
|
||||||
|
color: black !important;
|
||||||
|
font-size: 16px !important;
|
||||||
|
font-weight: bold !important;;
|
||||||
|
margin: 0;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
transform: translate(-58px, 2px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.labelRadio{
|
||||||
|
color: black !important;
|
||||||
|
font-weight: bold !important;
|
||||||
|
}
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { MoreActionModalComponent } from './more-action-modal.component';
|
||||||
|
|
||||||
|
describe('MoreActionModalComponent', () => {
|
||||||
|
let component: MoreActionModalComponent;
|
||||||
|
let fixture: ComponentFixture<MoreActionModalComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ MoreActionModalComponent ],
|
||||||
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(MoreActionModalComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,44 @@
|
|||||||
|
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-more-action-modal',
|
||||||
|
templateUrl: './more-action-modal.component.html',
|
||||||
|
styleUrls: ['./more-action-modal.component.scss'],
|
||||||
|
})
|
||||||
|
export class MoreActionModalComponent implements OnInit {
|
||||||
|
actionBtns :any =[];
|
||||||
|
radioButtonValue: any;
|
||||||
|
constructor( private ts: TranslatorService,private modalCtrl: ModalController, private cs: CommonService){}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
console.log("modal");
|
||||||
|
this.actionBtns = this.cs.sharedService.getSharedData("passActionMore" , false);
|
||||||
|
console.log("modal");
|
||||||
|
|
||||||
|
}
|
||||||
|
closeModal() {
|
||||||
|
this.modalCtrl.dismiss();
|
||||||
|
}
|
||||||
|
|
||||||
|
radioSelect(v) {
|
||||||
|
this.radioButtonValue = v;
|
||||||
|
console.log("radio selected"+v);
|
||||||
|
}
|
||||||
|
|
||||||
|
OkBtnModal() {
|
||||||
|
if (!this.radioButtonValue) {
|
||||||
|
let msg: string = this.ts.trPK("replacementRoll", "msg");
|
||||||
|
this.cs.presentAlert(msg);
|
||||||
|
return;
|
||||||
|
} else {
|
||||||
|
let data = this.radioButtonValue;
|
||||||
|
this.modalCtrl.dismiss(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
@ -1,8 +1,107 @@
|
|||||||
.itemHISBtn{
|
// .itemHISBtn{
|
||||||
padding: 5px;
|
// padding: 5px;
|
||||||
color: var(--light);
|
// color: var(--light);
|
||||||
background: var(--darkgray);
|
// background: var(--darkgray);
|
||||||
border-radius: 3px;
|
// border-radius: 3px;
|
||||||
width: 85%;
|
// width: 85%;
|
||||||
height: 40px;
|
// height: 40px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBtn{
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: row;
|
||||||
|
// justify-content: center;
|
||||||
|
// align-items: center;
|
||||||
|
// background: white;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBorder{
|
||||||
|
// border-bottom: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
// .colBorder{
|
||||||
|
// border-right: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .dateActionHistory{
|
||||||
|
// text-align: end;
|
||||||
|
// // margin-top: -25px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .actionBtn{
|
||||||
|
// --border-radius: 50% !important;
|
||||||
|
// height: 55px;
|
||||||
|
// width: 55px;
|
||||||
|
// --background: var(--newgreen); // will be dynamic
|
||||||
|
// background: transparent;
|
||||||
|
// margin:10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .itemAttch{
|
||||||
|
// border-radius: 11px;
|
||||||
|
// margin: 8px;
|
||||||
|
// --min-height: 60px;
|
||||||
|
// --max-height: 60px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .less {
|
||||||
|
// max-height: 54px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .noDataDiv{
|
||||||
|
// background: #ffffff;
|
||||||
|
// height: 11%;
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 1px;
|
||||||
|
// border-radius: 10px;
|
||||||
|
// margin: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .container {
|
||||||
|
// font-size: 14px;
|
||||||
|
// line-height: 14px;
|
||||||
|
// height: 15px;
|
||||||
|
// overflow: hidden;
|
||||||
|
// text-align: justify;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .show {
|
||||||
|
// overflow: visible;
|
||||||
|
// height: auto;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .showMore{
|
||||||
|
// padding: 0px;
|
||||||
|
// background: transparent;
|
||||||
|
// color: blue;
|
||||||
|
// text-decoration: underline;
|
||||||
|
// font-size: 14px;
|
||||||
|
// }
|
||||||
|
// .succssfullMSG{
|
||||||
|
// height: 100%;
|
||||||
|
// width: 100%;
|
||||||
|
// background: var(--newgreen);
|
||||||
|
// color: white;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 20px;
|
||||||
|
// text-align: center;
|
||||||
|
// vertical-align: middle;
|
||||||
|
// padding-top: 30px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullIcon{
|
||||||
|
// width: 60%;
|
||||||
|
// text-align: center;
|
||||||
|
// height: 60%;
|
||||||
|
// }
|
||||||
|
// .subjectNotification{
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 10px;
|
||||||
|
// font-weight: bold;
|
||||||
|
// }
|
||||||
|
|
||||||
@ -1,8 +1,110 @@
|
|||||||
.itemHISBtn{
|
// .itemHISBtn{
|
||||||
padding: 5px;
|
// padding: 5px;
|
||||||
color: var(--light);
|
// color: var(--light);
|
||||||
background: var(--darkgray);
|
// background: var(--darkgray);
|
||||||
border-radius: 3px;
|
// border-radius: 3px;
|
||||||
width: 85%;
|
// width: 85%;
|
||||||
height: 40px;
|
// height: 40px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBtn{
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: row;
|
||||||
|
// justify-content: center;
|
||||||
|
// align-items: center;
|
||||||
|
// background: white;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBorder{
|
||||||
|
// border-bottom: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
// .colBorder{
|
||||||
|
// border-right: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .dateActionHistory{
|
||||||
|
// text-align: end;
|
||||||
|
// // margin-top: -25px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .actionBtn{
|
||||||
|
// --border-radius: 50% !important;
|
||||||
|
// height: 55px;
|
||||||
|
// width: 55px;
|
||||||
|
// --background: var(--newgreen); // will be dynamic
|
||||||
|
// background: transparent;
|
||||||
|
// margin:10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .itemAttch{
|
||||||
|
// border-radius: 11px;
|
||||||
|
// margin: 8px;
|
||||||
|
// --min-height: 60px;
|
||||||
|
// --max-height: 60px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .less {
|
||||||
|
// max-height: 54px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .noDataDiv{
|
||||||
|
// background: #ffffff;
|
||||||
|
// height: 11%;
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 1px;
|
||||||
|
// border-radius: 10px;
|
||||||
|
// margin: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .container {
|
||||||
|
// font-size: 14px;
|
||||||
|
// line-height: 14px;
|
||||||
|
// height: 16px;
|
||||||
|
// overflow: hidden;
|
||||||
|
// text-align: justify;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .show {
|
||||||
|
// overflow: visible;
|
||||||
|
// height: auto;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .showMore{
|
||||||
|
// padding: 0px;
|
||||||
|
// background: transparent;
|
||||||
|
// color: blue;
|
||||||
|
// text-decoration: underline;
|
||||||
|
// font-size: 14px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullMSG{
|
||||||
|
// height: 100%;
|
||||||
|
// width: 100%;
|
||||||
|
// background: var(--newgreen);
|
||||||
|
// color: white;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 20px;
|
||||||
|
// text-align: center;
|
||||||
|
// vertical-align: middle;
|
||||||
|
// padding-top: 30px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullIcon{
|
||||||
|
// width: 60%;
|
||||||
|
// text-align: center;
|
||||||
|
// height: 60%;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .subjectNotification{
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 10px;
|
||||||
|
// font-weight: bold;
|
||||||
|
// }
|
||||||
|
|
||||||
@ -1,8 +1,106 @@
|
|||||||
.itemHISBtn{
|
// .itemHISBtn{
|
||||||
padding: 5px;
|
// padding: 5px;
|
||||||
color: var(--light);
|
// color: var(--light);
|
||||||
background: var(--darkgray);
|
// background: var(--darkgray);
|
||||||
border-radius: 3px;
|
// border-radius: 3px;
|
||||||
width: 85%;
|
// width: 85%;
|
||||||
height: 40px;
|
// height: 40px;
|
||||||
}
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBtn{
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: row;
|
||||||
|
// justify-content: center;
|
||||||
|
// align-items: center;
|
||||||
|
// background: white;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// .rowBorder{
|
||||||
|
// border-bottom: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
// .colBorder{
|
||||||
|
// border-right: solid 0.03cm var(--grayBG);
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .dateActionHistory{
|
||||||
|
// text-align: end;
|
||||||
|
// // margin-top: -25px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// .actionBtn{
|
||||||
|
// --border-radius: 50% !important;
|
||||||
|
// height: 55px;
|
||||||
|
// width: 55px;
|
||||||
|
// --background: var(--newgreen); // will be dynamic
|
||||||
|
// background: transparent;
|
||||||
|
// margin:10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .itemAttch{
|
||||||
|
// border-radius: 11px;
|
||||||
|
// margin: 8px;
|
||||||
|
// --min-height: 60px;
|
||||||
|
// --max-height: 60px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .less {
|
||||||
|
// max-height: 54px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .noDataDiv{
|
||||||
|
// background: #ffffff;
|
||||||
|
// height: 11%;
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 1px;
|
||||||
|
// border-radius: 10px;
|
||||||
|
// margin: 10px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .container {
|
||||||
|
// font-size: 14px;
|
||||||
|
// line-height: 14px;
|
||||||
|
// height: 16px;
|
||||||
|
// overflow: hidden;
|
||||||
|
// text-align: justify;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .show {
|
||||||
|
// overflow: visible;
|
||||||
|
// height: auto;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .showMore{
|
||||||
|
// padding: 0px;
|
||||||
|
// background: transparent;
|
||||||
|
// color: blue;
|
||||||
|
// text-decoration: underline;
|
||||||
|
// font-size: 14px;
|
||||||
|
// }
|
||||||
|
// .succssfullMSG{
|
||||||
|
// height: 100%;
|
||||||
|
// width: 100%;
|
||||||
|
// background: var(--newgreen);
|
||||||
|
// color: white;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 20px;
|
||||||
|
// text-align: center;
|
||||||
|
// vertical-align: middle;
|
||||||
|
// padding-top: 30px;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .succssfullIcon{
|
||||||
|
// width: 60%;
|
||||||
|
// text-align: center;
|
||||||
|
// height: 60%;
|
||||||
|
// }
|
||||||
|
// .subjectNotification{
|
||||||
|
// text-align: center;
|
||||||
|
// padding-top: 10px;
|
||||||
|
// font-weight: bold;
|
||||||
|
// }
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
import { Pipe, PipeTransform } from '@angular/core';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Generated class for the JsonDatePipe pipe.
|
||||||
|
*
|
||||||
|
* See https://angular.io/api/core/Pipe for more info on Angular Pipes.
|
||||||
|
*/
|
||||||
|
@Pipe({
|
||||||
|
name: 'jsonDate',
|
||||||
|
})
|
||||||
|
export class JsonDatePipe implements PipeTransform {
|
||||||
|
/**
|
||||||
|
* Takes a value and makes it lowercase.
|
||||||
|
*/
|
||||||
|
transform(value: string): any {
|
||||||
|
if(value)
|
||||||
|
return new Date(parseInt(value.substr(6)));
|
||||||
|
else
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,11 +1,13 @@
|
|||||||
import { NgModule } from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import { DateStringPipe } from './date-string/date-string';
|
import { DateStringPipe } from './date-string/date-string';
|
||||||
import { FilterLangPipe } from './filter-lang/filter-lang';
|
import { FilterLangPipe } from './filter-lang/filter-lang';
|
||||||
|
import { TurncatePipe } from './turncate/turncate.pipe';
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [DateStringPipe,
|
declarations: [DateStringPipe,
|
||||||
FilterLangPipe],
|
FilterLangPipe,
|
||||||
|
TurncatePipe],
|
||||||
imports: [],
|
imports: [],
|
||||||
exports: [DateStringPipe,
|
exports: [DateStringPipe,
|
||||||
FilterLangPipe]
|
FilterLangPipe,TurncatePipe]
|
||||||
})
|
})
|
||||||
export class PipesModule {}
|
export class PipesModule {}
|
||||||
|
|||||||
@ -0,0 +1,8 @@
|
|||||||
|
import { TurncatePipe } from './turncate.pipe';
|
||||||
|
|
||||||
|
describe('TurncatePipe', () => {
|
||||||
|
it('create an instance', () => {
|
||||||
|
const pipe = new TurncatePipe();
|
||||||
|
expect(pipe).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,27 @@
|
|||||||
|
import { Pipe, PipeTransform } from '@angular/core';
|
||||||
|
|
||||||
|
@Pipe({
|
||||||
|
name: 'turncate'
|
||||||
|
})
|
||||||
|
export class TurncatePipe implements PipeTransform {
|
||||||
|
|
||||||
|
transform(value: any, args?: any): any {
|
||||||
|
console.log("args" + args);
|
||||||
|
|
||||||
|
let limit = args.length > 0 ? parseInt(args[0], 10) : 10;
|
||||||
|
let trail = args.length > 1 ? args[1] : '...';
|
||||||
|
|
||||||
|
console.log("limit" + limit);
|
||||||
|
|
||||||
|
console.log("parseInt(args[0], 10)" + parseInt(args[0], 10));
|
||||||
|
console.log("trail" + trail);
|
||||||
|
console.log("limit" + limit);
|
||||||
|
console.log("parseInt(args[0], 10)" + parseInt(args[0], 10));
|
||||||
|
|
||||||
|
return value.length > limit ? value.substring(0, limit) + trail : value; }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 977 B |
Binary file not shown.
|
After Width: | Height: | Size: 971 B |
Binary file not shown.
|
After Width: | Height: | Size: 801 B |
Binary file not shown.
|
After Width: | Height: | Size: 970 B |
Binary file not shown.
|
After Width: | Height: | Size: 958 B |
Binary file not shown.
|
After Width: | Height: | Size: 8.1 KiB |
Loading…
Reference in New Issue