Skip to content

M
myjob-manage
Commit ce6154cd by Natthaphat
Options

เพิ่ม modal Excel Report, Table memployee

parent 8d6cbd3d
Showing with 296 additions and 211 deletions
src/app/DPU/common/myportal/set-excel-reports/excel-list/excel-list.component.html
...@@ -194,7 +194,7 @@ ...@@ -194,7 +194,7 @@
<a aria-label="anchor" title="Print" <a aria-label="anchor" title="Print"
(mouseenter)="buttonHover.set(item.fileName+'print',!buttonHover.get(item.fileName))" (mouseenter)="buttonHover.set(item.fileName+'print',!buttonHover.get(item.fileName))"
(mouseleave)="buttonHover.clear()" (mouseleave)="buttonHover.clear()"
(click)="openPrintModal(printModal,item);" (click)="openPrintModal(item);"
class="ti-btn ti-btn-wave product-btn !gap-0 !m-0 bg-warning/10 text-warning hover:bg-warning hover:text-white hover:border-warning"><i class="ti-btn ti-btn-wave product-btn !gap-0 !m-0 bg-warning/10 text-warning hover:bg-warning hover:text-white hover:border-warning"><i
class="ri-printer-line"></i></a> class="ri-printer-line"></i></a>
&nbsp; &nbsp;
...@@ -396,7 +396,7 @@ ...@@ -396,7 +396,7 @@
id="excelFileUpload" [checked]="templateFileType=='upload'" id="excelFileUpload" [checked]="templateFileType=='upload'"
(click)="templateFileTypeChange()"> (click)="templateFileTypeChange()">
<label class="custom-control-label cursor-pointer" for="excelFileUpload"> <label class="custom-control-label cursor-pointer font-bold" for="excelFileUpload">
อัพโหลดเอ็กเซลล์ไฟล์ อัพโหลดเอ็กเซลล์ไฟล์
<span *ngIf="templateFileType=='upload'" style="color: red">*</span> <span *ngIf="templateFileType=='upload'" style="color: red">*</span>
</label> </label>
...@@ -704,106 +704,120 @@ ...@@ -704,106 +704,120 @@
<ng-template #videoModal let-modal> <ng-template #videoModal let-modal>
<div style="width: 100%; height: 100%;"> <div style="width: 100%; height: 100%;">
<iframe style="width: 100%; height: 100%;" [src]="videoLink | safeUrl" frameborder="0" allow="autoplay; encrypted-media" <iframe style="width: 100%; height: 100%;" [src]="videoLink | safeUrl" frameborder="0"
allowfullscreen> allow="autoplay; encrypted-media" allowfullscreen>
</iframe> </iframe>
</div> </div>
</ng-template> </ng-template>
<ng-template #printModal let-modal> <ng-template #printModal let-modal>
<div class="modal-header"> <div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out">
<h5 class="modal-title" id="edittemplateLabel">Excel Report</h5> <div class="ti-modal-content">
<button type="button" class="close" (click)="modal.dismiss()" aria-label="Close"> <div class="ti-modal-header flex justify-between items-center p-5">
<span aria-hidden="true">&times;</span> <h6 class="ti-modal-title text-[1rem] font-semibold text-defaulttextcolor" id="mail-ComposeLabel">
</button> Excel Report
</div> </h6>
<div class="modal-body">
<div class="row"> <button type="button" class="hs-dropdown-toggle !text-[1rem] !font-semibold !text-defaulttextcolor"
<div class="d-flex col-12 justify-content-center" *ngIf="loading||loadingExcel"> (click)="closeModalprintModal()" #closeModal>
<div *ngFor="let item of [1,2,3]" class="spinner-grow text-info mx-1" role="status"> <span class="sr-only">{{'Close' | translate}}</span>
<span class="sr-only">Loading...</span> <i class="ri-close-line"></i>
</div> </button>
</div> </div>
<ng-container *ngIf="!loading&&!loadingExcel"> <div class="ti-modal-body px-4 mt-3">
<ng-container *ngFor="let item of variableSheet; let i=index"> <div class="row">
<div class="col-12 row"> <div class="d-flex col-12 justify-content-center" *ngIf="loading||loadingExcel">
<div class="col-3 form-group justify-content-center font-weight-bold control-label col-form-label font-14" <div *ngFor="let item of [1,2,3]" class="spinner-grow text-info mx-1" role="status">
style="text-align: end;"> <span class="sr-only">Loading...</span>
{{item.label}}
</div> </div>
<div class="col-3 d-flex form-group align-items-center"> </div>
<ng-container *ngIf="item.type=='text'"> <ng-container *ngIf="!loading&&!loadingExcel">
<input type="text" class="form-control" [(ngModel)]="item.value"> <ng-container *ngFor="let item of variableSheet; let i=index">
</ng-container> <div class="flex items-center mb-4">
<ng-container *ngIf="item.type=='list'"> <!-- Label -->
<select class="custom-select" [(ngModel)]="item.value"> <label class="w-1/4 text-right pr-4 font-semibold text-sm">
<option *ngFor="let list of item.option" [value]="list.value"> {{ item.label }}
{{list.text}} </label>
</option>
</select> <!-- Input -->
</ng-container> <div class="w-3/4">
<ng-container *ngIf="item.type=='radio'"> <ng-container [ngSwitch]="item.type">
<div class="row m-0">
<ng-container *ngFor="let radioItem of item.option"> <!-- Text -->
<div class="col-auto custom-control custom-radio"> <input *ngSwitchCase="'text'" type="text" class="form-input w-full"
<input type="radio" class="custom-control-input" [(ngModel)]="item.value" />
[name]="'group-' + item.label" [id]="radioItem.text+radioItem.value"
[value]="radioItem.value" [(ngModel)]="item.value"> <!-- List -->
<label class="custom-control-label" <select *ngSwitchCase="'list'" class="form-select w-full"
[for]="radioItem.text+radioItem.value">{{radioItem.text}}</label> [(ngModel)]="item.value">
<option *ngFor="let list of item.option" [value]="list.value">
{{ list.text }}
</option>
</select>
<!-- Radio -->
<div *ngSwitchCase="'radio'" class="flex flex-wrap gap-4">
<label *ngFor="let radioItem of item.option"
class="inline-flex items-center">
<input type="radio" class="form-radio mr-2"
[name]="'group-' + item.label" [id]="radioItem.text+radioItem.value"
[value]="radioItem.value" [(ngModel)]="item.value" />
{{ radioItem.text }}
</label>
</div>
<!-- Help -->
<div *ngSwitchCase="'help'" class="flex items-stretch">
<input type="text" readonly class="form-input w-1/2 bg-white cursor-pointer"
[value]="item.value.tdesc" (click)="openModalData(item)" />
<button
class="bg-primary hover:bg-primary text-white px-3 flex items-center justify-center rounded-none border"
type="button" (click)="openModalData(item)">
<i class="ri-search-line font-semibold align-middle"></i>
</button>
<button type="button"
class="bg-red hover:bg-red text-white text-sm ml-5 w-10 h-10 flex items-center justify-center rounded-full"
(click)="item.value={id:'',tdesc:'',edesc:''}">
<i class="fa fa-times text-xs"></i>
</button>
</div>
<!-- Calendar -->
<div *ngSwitchCase="'calendar'" class="flex items-stretch">
<!-- Input -->
<input class="form-input w-1/2 bg-white cursor-pointer rounded-r-none"
style="border-color: #e9edf6;" placeholder="dd.mm.yyyy" name="dp1"
ngbDatepicker #d1="ngbDatepicker" [(ngModel)]="select[item.key]"
readonly (click)="d1.toggle()"
(ngModelChange)="formatNgbDate(item.key, select[item.key])"
#c1="ngModel" (change)="validateDate(c1)">
<!-- Calendar Button -->
<button type="button"
class="bg-white hover:bg-primary text-primary hover:text-white px-3 flex items-center justify-center rounded-none border"
style="border-color: #154c9c;" (click)="d1.toggle()">
<i class="ri-calendar-2-line"></i>
</button>
<!-- Clear Button -->
<button type="button"
class="bg-red hover:bg-red text-white text-sm ml-5 w-10 h-10 flex items-center justify-center rounded-full"
(click)="select[item.key]=null ;formatNgbDate(item.key)">
<i class="fa fa-times text-xs"></i>
</button>
</div> </div>
</ng-container> </ng-container>
</div> </div>
</ng-container> </div>
<ng-container *ngIf="item.type=='help'"> </ng-container>
<div class="input-group">
<input type="text" readonly class="form-control bg-white cursor-pointer" <!-- <div *ngIf="variableSheet.length&&!loadingExcel"
[value]="item.value.tdesc" (click)="openModalData(item,modalData)">
<div class="input-group-append">
<button class="btn mr-0 btn-info" type="button"
(click)="openModalData(item,modalData)">
<i class="fa fa-search"></i>
</button>
</div>
</div>
</ng-container>
<ng-container *ngIf="item.type=='calendar'">
<div class="input-group">
<input class="form-control bg-white cursor-pointer"
placeholder="{{ 'dd.mm.yyyy' }}" name="dp1" ngbDatepicker #d1="ngbDatepicker"
[(ngModel)]="select[item.key]" readonly (click)="d1.toggle()"
(ngModelChange)="formatNgbDate(item.key,select[item.key])" #c1="ngModel"
(change)="validateDate(c1)">
<div class="input-group-append">
<button class="btn btn-outline-info no-shadow" (click)="d1.toggle()"
type="button">
<i class="far fa-calendar-alt"></i>
</button>
</div>
</div>
</ng-container>
</div>
<div class="col">
<ng-container *ngIf="item.type=='help'">
<button type="button" class="btn btn-danger btn-sm btn-circle"
(click)="item.value={id:'',tdesc:'',edesc:''}"><i class="fa fa-times"></i>
</button>
</ng-container>
<ng-container *ngIf="item.type=='calendar'">
<button type="button" class="btn btn-danger btn-sm btn-circle"
(click)="select[item.key]=null ;formatNgbDate(item.key)"><i class="fa fa-times"></i>
</button>
</ng-container>
<ng-container *ngIf="item.type=='list'">
<button type="button" class="btn btn-danger btn-sm btn-circle"
(click)="item.value=''"><i class="fa fa-times"></i>
</button>
</ng-container>
</div>
</div>
</ng-container>
<!-- <div *ngIf="variableSheet.length&&!loadingExcel"
class="col-12 justify-content-center align-content-center d-flex" style="margin-bottom: 1rem;"> class="col-12 justify-content-center align-content-center d-flex" style="margin-bottom: 1rem;">
<button type="submit" class="btn btn-info waves-effect waves-light btn-w-100" <button type="submit" class="btn btn-info waves-effect waves-light btn-w-100"
(click)="dowloadExcelReport()"> (click)="dowloadExcelReport()">
...@@ -816,111 +830,173 @@ ...@@ -816,111 +830,173 @@
<span class="sr-only">Loading...</span> <span class="sr-only">Loading...</span>
</div> </div>
</div> --> </div> -->
<div *ngIf="!variableSheet.length" class="col-12 justify-content-center align-content-center d-flex" <div *ngIf="!variableSheet.length"
style="margin-bottom: 1rem;margin-top: 1rem;"> class="col-12 justify-content-center align-content-center d-flex"
<div style="margin-bottom: 1rem;margin-top: 1rem;">
class="col-3 justify-content-center text-center font-weight-bold control-label col-form-label font-14"> <div
{{'No Data Found' }} class="col-3 justify-content-center text-center font-weight-bold control-label col-form-label font-14">
</div> {{'No Data Found' }}
</div>
</div>
<div class="row col-12 flex justify-center"
*ngIf="variableSheet.length&&(excelReport.isDataGrid=='1'||excelReport.isPivot=='1')">
<div class="col-12 d-flex justify-content-center align-content-center">
<button type="button" *ngIf="excelReport.isDataGrid=='1'"
class="ti-btn ti-btn-primary-full"
(click)="getExcelData(gridModal,'grid')">Datagrid</button>
<ng-container *ngIf="excelReport.isDataGrid=='1'&&excelReport.isPivot=='1'">
&nbsp;
</ng-container>
<button type="button" *ngIf="excelReport.isPivot=='1'"
class="ti-btn ti-btn-primary-full"
(click)="getExcelData(pivotModal,'pivot')">Pivot</button>
</div>
</div>
</ng-container>
</div> </div>
<div class="row col-12" </div>
*ngIf="variableSheet.length&&(excelReport.isDataGrid=='1'||excelReport.isPivot=='1')">
<div class="col-12 d-flex justify-content-center align-content-center"> <div class="border-t mt-3">
<button type="button" *ngIf="excelReport.isDataGrid=='1'" class="btn btn-info" <div class="ti-modal-footer flex justify-end gap-1 mb-3 mt-3 mr-3">
(click)="getExcelData(gridModal,'grid')">Datagrid</button> <ng-container *ngIf="variableSheet.length">
<ng-container *ngIf="excelReport.isDataGrid=='1'&&excelReport.isPivot=='1'"> <button type="submit" class="ti-btn ti-btn-info-full waves-effect waves-light btn-w-100"
&nbsp; [disabled]="loadingExcel" (click)="dowloadExcelReport()">
</ng-container> {{"Print" }}
<button type="button" *ngIf="excelReport.isPivot=='1'" class="btn btn-info" </button>
(click)="getExcelData(pivotModal,'pivot')">Pivot</button> </ng-container>
</div> <button type="button" class="ti-btn bg-danger text-white !font-medium"
(click)="closeModalprintModal()">
ปิด
</button>
</div> </div>
</ng-container> </div>
</div> </div>
</div> </div>
<div class="modal-footer ">
<ng-container *ngIf="variableSheet.length">
<button type="submit" class="btn btn-info waves-effect waves-light btn-w-100" [disabled]="loadingExcel"
(click)="dowloadExcelReport()">
{{"Print" }}
</button>
</ng-container>
<button type="button" class="btn btn-danger" (click)="modal.dismiss()">ปิด</button>
</div>
</ng-template> </ng-template>
<ng-template #modalData let-modal> <ng-template #modalData let-modal>
<div class="modal-header"> <div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out">
<h5 class="modal-title" id="edittemplateLabel"> {{modalDetail.text.cardHead }}</h5> <div class="ti-modal-content">
<button type="button" class="close" (click)="modal.dismiss()" aria-label="Close"> <div class="ti-modal-header flex justify-between items-center p-5">
<span aria-hidden="true">&times;</span> <h6 class="ti-modal-title text-[1rem] font-semibold text-defaulttextcolor" id="mail-ComposeLabel">
</button> {{modalDetail.text.cardHead }}
</div> </h6>
<div class="modal-body">
<div class="d-flex mb-1"> <button type="button" class="hs-dropdown-toggle !text-[1rem] !font-semibold !text-defaulttextcolor"
<input type="text" placeholder="{{'systemcode.search' }} {{modalDetail.text.search[0]}}" (click)="closeModalmodalData()" #closeModal>
class=" form-control w-75 border-color-gray-full-focus" [(ngModel)]='searchModal'> <span class="sr-only">{{'Close' | translate}}</span>
</div> <i class="ri-close-line"></i>
<div class="table-responsive"> </button>
<table class="table table-hover table-striped-myhr table-sm mb-0 no-wrap v-middle "> </div>
<thead class="bg-info "> <div class="ti-modal-body px-4 mt-3">
<tr class="text-white font-weight-normal"> <div class="d-flex mb-1">
<th class="font-weight-normal text-center" scope="col" <input type="text" placeholder="{{'systemcode.search' }} {{modalDetail.text.search[0]}}"
*ngFor="let item of modalDetail.text.tableHead"> class=" form-control w-75 border-color-gray-full-focus" [(ngModel)]='searchModal'>
{{item}} </div>
</th> <div class="table-responsive">
</tr> <table class="table table-hover table-striped-myhr table-sm mb-0 no-wrap v-middle "
</thead> style="width: 100%">
<tbody *ngIf="!valueDetailFilter().length"> <thead class="bg-info ">
<tr> <tr class="text-white font-weight-normal">
<td colspan="9" class="font-weight-normal text-center"> <th class="font-weight-normal text-center" scope="col"
{{"No Data Found" }} *ngFor="let item of modalDetail.text.tableHead">
</td> {{item}}
</tr> </th>
</tbody> </tr>
<tbody *ngIf="valueDetailFilter().length"> </thead>
<tr class="cursor-pointer" <tbody *ngIf="!valueDetailFilter().length">
*ngFor="let item of valueDetailFilter() | slice: (pageModal-1) * pageSizeModal : (pageModal-1) * pageSizeModal + pageSizeModal; let i=index" <tr>
(click)="selectData(item);modal.dismiss()" <td colspan="9" class="font-weight-normal text-center">
(mouseenter)="tableHover.set(item.id,!tableHover.get(item.id))" {{"No Data Found" }}
(mouseleave)="tableHover.clear()" </td>
[ngStyle]="{'background-color':tableHover.get(item.id)?'rgb(201 223 235)':'#ffffff'}"> </tr>
<td class="align-middle text-center"> </tbody>
{{item.id}} <tbody *ngIf="valueDetailFilter().length">
</td> <tr class="cursor-pointer"
<td class="align-middle text-center"> *ngFor="let item of valueDetailFilter() | slice: (pageModal-1) * pageSizeModal : (pageModal-1) * pageSizeModal + pageSizeModal; let i=index"
{{item.tdesc}} (click)="selectData(item);closeModalmodalData()"
</td> (mouseenter)="tableHover.set(item.id,!tableHover.get(item.id))"
<td class="align-middle text-center"> (mouseleave)="tableHover.clear()"
{{item.edesc}} [ngStyle]="{'background-color':tableHover.get(item.id)?'rgb(201 223 235)':'#ffffff'}">
</td> <td class="align-middle text-center">
</tr> {{item.id}}
</tbody> </td>
</table> <td class="align-middle text-center">
</div> {{item.tdesc}}
<div class="d-flex justify-content-end p-2"> </td>
<select class="custom-select m-r-5 border-color-gray-full-focus" style="width: auto" <td class="align-middle text-center">
[(ngModel)]="pageSizeModal" (ngModelChange)="pageModal=1"> {{item.edesc}}
<option *ngFor="let item of [10,50,100]" [ngValue]="item"> </td>
{{"Items per page"}}: {{item}} </tr>
</option> </tbody>
</select> </table>
<ngb-pagination [collectionSize]="valueDetailFilter().length" [(page)]="pageModal" </div>
[pageSize]="pageSizeModal" [maxSize]="3" [rotate]="true"> </div>
<ng-template ngbPaginationPrevious>{{"Prev"}}</ng-template>
<ng-template ngbPaginationNext>{{"Next"}}</ng-template> <div class="box-footer !border-t-0">
</ngb-pagination> <div class="flex items-center flex-wrap overflow-auto" *ngIf="valueDetailFilter().length > 0">
<div class="d-flex justify-content-end p-2">
<select class="custom-select m-r-5 border-color-gray-full-focus" style="width: auto"
[(ngModel)]="pageSizeModal" (ngModelChange)="pageModal=1">
<option *ngFor="let item of [10,50,100]" [ngValue]="item">
{{"Items per page"}}: {{item}}
</option>
</select>
</div>
<div class="mb-2 sm:mb-0">
<div>
{{'Showing' | translate}} {{valueDetailFilter().length}} {{'entries'
| translate}} <i class="bi bi-arrow-right ms-2 font-semibold"></i>
</div>
</div>
<div class="ms-auto">
<nav aria-label="Page navigation">
<ul class="ti-pagination mb-0">
<li *ngIf="pageIndex>0" class="page-item {{pageModal==0 ? 'disabled' : ''}}"><a
class="page-link px-3 py-[0.375rem] cursor-pointer"
(click)="pageModal = pageModal-1;updatePagedItems()">{{'Previous' |
translate}}</a></li>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="pageModal-1>0"
(click)="pageModal = pageModal-2;updatePagedItems()">{{pageModal-1}}</a>
</li>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="pageModal>0 && ((pageModal-1)*10 < (searchText == '' ? valueDetailFilter().length : valueDetailFilter().length))"
(click)="pageModal = pageModal-1;updatePagedItems()">{{pageModal}}</a></li>
<li class="page-item"><a class="page-link active px-3 py-[0.375rem]"
href="javascript:void(0);">{{pageModal +1}}</a>
</li>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="(pageModal+1)*10 < (searchText == '' ? valueDetailFilter().length : valueDetailFilter().length)"
(click)="pageModal = pageModal+1;updatePagedItems()">{{pageModal +2}}</a></li>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="(pageModal+2)*10 < (searchText == '' ? valueDetailFilter().length : valueDetailFilter().length)"
(click)="pageModal = pageModal+2;updatePagedItems()">{{pageModal +3}}</a></li>
<li *ngIf="(pageModal+1)*10 < (searchText == '' ? valueDetailFilter().length : valueDetailFilter().length)"
class="page-item"><a class="page-link px-3 py-[0.375rem] cursor-pointer"
(click)="pageModal = pageModal+1;updatePagedItems()">{{'Next' |
translate}}</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="border-t">
<div class="ti-modal-footer flex justify-end gap-3 mb-3 mt-3 mr-3">
<button type="button" class="ti-btn bg-danger text-white !font-medium"
(click)="closeModalmodalData()">
ปิด
</button>
</div>
</div>
</div> </div>
</div> </div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" (click)="modal.close()">
{{"ปิด"}}
</button>
</div>
</ng-template> </ng-template>
<ng-template #gridModal let-modal> <ng-template #gridModal let-modal>
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="edittemplateLabel">GridData</h5> <h5 class="modal-title" id="edittemplateLabel">GridData</h5>
......
src/app/DPU/common/myportal/set-excel-reports/excel-list/excel-list.component.ts
...@@ -148,12 +148,16 @@ export class ExcelListComponent implements OnInit { ...@@ -148,12 +148,16 @@ export class ExcelListComponent implements OnInit {
modalRefaddChild: any; modalRefaddChild: any;
modalRefexcel_portal: MatDialogRef<any>; modalRefexcel_portal: MatDialogRef<any>;
modalRefvideoModal: any; modalRefvideoModal: any;
modalRefprintModal: any;
modalRefmodalData: any;
searchText: string = ''; searchText: string = '';
@ViewChild('addGroupModal') addGroupModal!: TemplateRef<any>; @ViewChild('addGroupModal') addGroupModal!: TemplateRef<any>;
@ViewChild('addChildModal') addChildModal!: TemplateRef<any>; @ViewChild('addChildModal') addChildModal!: TemplateRef<any>;
@ViewChild('excel_portalModal') excel_portalModal!: TemplateRef<any>; @ViewChild('excel_portalModal') excel_portalModal!: TemplateRef<any>;
@ViewChild('videoModal') videoModal!: TemplateRef<any>; @ViewChild('videoModal') videoModal!: TemplateRef<any>;
@ViewChild('printModal') printModal!: TemplateRef<any>;
@ViewChild('modalData') modalData!: TemplateRef<any>;
constructor(private excelReportService: ExcelReportService, constructor(private excelReportService: ExcelReportService,
private modalService: NgbModal, private modalService: NgbModal,
private customCubeService: CustomCubeService, private customCubeService: CustomCubeService,
...@@ -352,13 +356,6 @@ export class ExcelListComponent implements OnInit { ...@@ -352,13 +356,6 @@ export class ExcelListComponent implements OnInit {
} }
}); });
} }
// openVideoModal(targetModal: TemplateRef<any>, videoLink: string) {
// this.videoLink = this.convertToEmbedUrl(videoLink)
// this.modalService.open(targetModal, {
// centered: true,
// windowClass: 'my-dialog-video-preview'
// })
// }
openVideoModal(videoLink: string) { openVideoModal(videoLink: string) {
this.videoLink = this.convertToEmbedUrl(videoLink); this.videoLink = this.convertToEmbedUrl(videoLink);
this.modalRefvideoModal = this.modal.open(this.videoModal, { this.modalRefvideoModal = this.modal.open(this.videoModal, {
...@@ -368,14 +365,6 @@ export class ExcelListComponent implements OnInit { ...@@ -368,14 +365,6 @@ export class ExcelListComponent implements OnInit {
backdropClass: 'video-backdrop' backdropClass: 'video-backdrop'
}); });
} }
// openVideoModal(videoLink: string) {
// this.videoLink = this.convertToEmbedUrl(videoLink);
// this.modalRefvideoModal = this.modal.open(this.videoModal, {
// width: '100%',
// height: '100%',
// panelClass: 'video-dialog-custom'
// });
// }
convertToEmbedUrl(youtubeUrl: string): string { convertToEmbedUrl(youtubeUrl: string): string {
try { try {
const url = new URL(youtubeUrl); const url = new URL(youtubeUrl);
...@@ -559,12 +548,9 @@ export class ExcelListComponent implements OnInit { ...@@ -559,12 +548,9 @@ export class ExcelListComponent implements OnInit {
this.openAlertModal(error.message) this.openAlertModal(error.message)
}) })
} }
openPrintModal(targetModal: TemplateRef<any>, templateFile: TemplateFileModel) { openPrintModal(templateFile: TemplateFileModel) {
this.getTemplateFile(templateFile) this.getTemplateFile(templateFile)
this.modalService.open(targetModal, { this.openModalprintModal()
centered: true,
size: 'lg'
})
} }
getTemplateFile(templateFile: TemplateFileModel) { getTemplateFile(templateFile: TemplateFileModel) {
this.loading = true this.loading = true
...@@ -611,7 +597,7 @@ export class ExcelListComponent implements OnInit { ...@@ -611,7 +597,7 @@ export class ExcelListComponent implements OnInit {
}) })
} }
openModalData(data: any, modal: any) { openModalData(data: any) {
this.searchModal = '' this.searchModal = ''
this.page = 1 this.page = 1
this.pageSize = 10 this.pageSize = 10
...@@ -624,7 +610,7 @@ export class ExcelListComponent implements OnInit { ...@@ -624,7 +610,7 @@ export class ExcelListComponent implements OnInit {
tableHead: ['ID', 'detailTH', 'detailENG'] tableHead: ['ID', 'detailTH', 'detailENG']
} }
} }
this.modalService.open(modal, { centered: true, size: 'lg' }) this.openModalmodalData()
} }
valueDetailFilter(): ValueDetailItem[] { valueDetailFilter(): ValueDetailItem[] {
...@@ -894,15 +880,37 @@ export class ExcelListComponent implements OnInit { ...@@ -894,15 +880,37 @@ export class ExcelListComponent implements OnInit {
this.modalRefexcel_portal?.close() this.modalRefexcel_portal?.close()
} }
openModvideoModal() { openModalvideoModal() {
this.modalRefvideoModal = this.modal.open(this.videoModal, { this.modalRefvideoModal = this.modal.open(this.videoModal, {
width: '1500px', width: '1500px',
height: '700px' height: '700px'
}) })
} }
closeModvideoModal() { closeModalvideoModal() {
this.modalRefexcel_portal?.close() this.modalRefvideoModal?.close()
}
openModalprintModal() {
this.modalRefprintModal = this.modal.open(this.printModal, {
width: '700px',
height: '300px'
})
}
closeModalprintModal() {
this.modalRefprintModal?.close()
}
openModalmodalData() {
this.modalRefmodalData = this.modal.open(this.modalData, {
width: '800px',
height: '580px'
})
}
closeModalmodalData() {
this.modalRefmodalData?.close()
} }
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment