Skip to content

M
myhr-portal
Commit ab7fc0c4 by Nattana Chaiyamat
Options

เพิ่มหน้า datasource table

parent 1de8e77f
Showing with 457 additions and 92 deletions
src/app/apps/apps.module.ts
......@@ -105,6 +105,7 @@ import { ExcelListComponent } from './excel-list/excel-list.component';
import { ExcelReportToggleComponent } from './excel-report-toggle/excel-report-toggle.component';
import { ExcelReportEmpviewComponent } from './excel-report-empview/excel-report-empview.component';
import { SafeUrlPipe } from 'src/pipe/safe-url.pipe';
import { DatasourceTableComponent } from './datasource-table/datasource-table.component';
@NgModule({
imports: [
......@@ -186,7 +187,8 @@ import { SafeUrlPipe } from 'src/pipe/safe-url.pipe';
ExcelListComponent,
ExcelReportToggleComponent,
ExcelReportEmpviewComponent,
SafeUrlPipe
SafeUrlPipe,
DatasourceTableComponent
],
providers: [
ContactService,
......
src/app/apps/apps.routing.ts
......@@ -53,6 +53,7 @@ import { ExcelReportComponent } from "./excel-report/excel-report.component";
import { ExcelListComponent } from "./excel-list/excel-list.component";
import { ExcelReportEmpviewComponent } from "./excel-report-empview/excel-report-empview.component";
import { ExcelReportToggleComponent } from "./excel-report-toggle/excel-report-toggle.component";
import { DatasourceTableComponent } from "./datasource-table/datasource-table.component";
export const AppsRoutes: Routes = [
{
path: "",
......@@ -555,6 +556,14 @@ export const AppsRoutes: Routes = [
urls: [],
},
},
{
path: "datasource-table",
component: DatasourceTableComponent,
data: {
title: "Datasource Table",
urls: [],
},
},
],
},
];
src/app/apps/datasource-table/datasource-table.component.html 0 → 100644
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">Datasorce Table</h4>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Company ID
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [(ngModel)]="datasourceTable.select.companyId">
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Company Name
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [(ngModel)]="datasourceTable.select.companyName">
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Database Name
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [(ngModel)]="datasourceTable.select.databaseName">
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Database Type
</div>
<div class="col-8 col-lg-3">
<select class="custom-select" [(ngModel)]="datasourceTable.select.dbType">
<option style="color: red" [class.d-none]="datasourceTable.select.dbType==''" [value]="''">
{{datasourceTable.select.dbType!=''?'ยกเลิก':''}}</option>
<option value="MSSQL">MSSQL</option>
<option value="PGSQL">PGSQL</option>
</select>
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Port Number
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [(ngModel)]="datasourceTable.select.portNumber">
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Server Name
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [(ngModel)]="datasourceTable.select.serverName">
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Status
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [(ngModel)]="datasourceTable.select.status">
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
User Name
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [(ngModel)]="datasourceTable.select.userName">
</div>
</div>
<div class="row align-items-center mb-2">
<div class="col-4 col-lg-3 text-right">
Password
</div>
<div class="col-8 col-lg-3">
<input type="text" class="form-control" [class.secure-input]="!showPassword"
[(ngModel)]="datasourceTable.select.password">
</div>
<i class="fa fa-eye cursor-pointer" *ngIf="showPassword" (click)="showPassword=false"></i>
<i class="fa fa-eye-slash cursor-pointer" *ngIf="!showPassword" (click)="showPassword=true"></i>
</div>
<div class="row justify-content-center align-items-center mb-2">
<button type="button" class="btn btn-info" (click)="postData()">บันทึก</button>
&nbsp;
<button type="button" class="btn btn-danger" (click)="deleteData()">ลบ</button>
</div>
<div class="row justify-content-end mr-0 mb-2">
<input type="text" class="col-5 form-control" [(ngModel)]="datasourceTable.search">
</div>
<div class="table-responsive">
<table class="table mb-0 no-wrap v-middle ">
<thead class="bg-info text-white">
<tr>
<th class="text-center" scope="col">Company ID</th>
<th class="text-center" scope="col">Company Name</th>
<th class="text-center" scope="col">Database Type</th>
<th class="text-center" scope="col">Port Number</th>
<th class="text-center" scope="col">Database Name</th>
<th class="text-center" scope="col">Server Name</th>
<th class="text-center" scope="col">Status</th>
<th class="text-center" scope="col">User Name</th>
<th class="text-center" scope="col">Password</th>
</tr>
</thead>
<tbody *ngIf="!datasourceTableFilter().length">
<tr style="background-color:#ebf2f6">
<td colspan="7" class="text-center">ไม่พบข้อมูล</td>
</tr>
</tbody>
<tbody *ngIf="datasourceTableFilter().length">
<ng-container
*ngFor="let item of datasourceTableFilter() | slice: (page-1) * pageSize : (page-1) * pageSize + pageSize ; let i = index">
<tr (mouseenter)="tableHover.set(item.userName,!tableHover.get(item.userName))"
(mouseleave)="tableHover.clear()"
[ngStyle]="{'background-color':tableHover.get(item.userName)?'rgb(201 223 235)':'#ebf2f6'}">
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.companyId}}
</td>
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.companyName}}
</td>
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.databaseName}}
</td>
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.dbType}}
</td>
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.portNumber}}
</td>
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.serverName}}
</td>
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.status}}
</td>
<td (click)="selectData(item)" class="cursor-pointer text-center"
style="white-space: normal !important;word-break: break-word;">
{{item.userName}}
</td>
<td class="text-center" style="white-space: normal !important;word-break: break-word;">
<span class="cursor-pointer" (click)="selectData(item)">
{{tableShowPassword.get(item.userName)?item.password :
'*'.repeat(item.password?.length || 0) }}
</span>
&nbsp;
<i class="cursor-pointer fa fa-eye" *ngIf="tableShowPassword.get(item.userName)"
(click)="tableShowPassword.set(item.userName,false)"></i>
<i class="cursor-pointer fa fa-eye-slash" *ngIf="!tableShowPassword.get(item.userName)"
(click)="tableShowPassword.set(item.userName,true)"></i>
</td>
</tr>
</ng-container>
</tbody>
</table>
</div>
<div class="d-flex justify-content-end py-2">
<select class="custom-select m-r-5" style="width: auto" [(ngModel)]="pageSize" (ngModelChange)="page">
<option [ngValue]="10">รายการต่อหน้า: 10</option>
<option [ngValue]="50">รายการต่อหน้า: 50</option>
<option [ngValue]="100">รายการต่อหน้า: 100</option>
</select>
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="datasourceTableFilter().length"
[maxSize]="3" [rotate]="true">
<ng-template ngbPaginationPrevious>ก่อนหน้า</ng-template>
<ng-template ngbPaginationNext>ถัดไป</ng-template>
</ngb-pagination>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/apps/datasource-table/datasource-table.component.scss 0 → 100644
.secure-input {
-webkit-text-security: disc;
text-security: disc;
}
\ No newline at end of file
src/app/apps/datasource-table/datasource-table.component.ts 0 → 100644
import { ChangeDetectorRef, Component, ElementRef, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { DatasourceTableModel, MyDatasourceTableModel } from 'src/app/model/datasource-table.model';
import { DatasourseTableService } from 'src/app/service/datasourse-table.service';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
export interface ModalDetail {
text: { cardHead: string, search: string[], tableHead: string[] }
}
@Component({
selector: 'app-datasource-table',
templateUrl: './datasource-table.component.html',
styleUrls: ['./datasource-table.component.scss']
})
export class DatasourceTableComponent implements OnInit {
datasourceTable: { data: DatasourceTableModel[], select: DatasourceTableModel, loading: boolean, search: string } = { data: [], select: new MyDatasourceTableModel(), loading: false, search: '' }
page = 1
pageSize = 10
tableHover: Map<string, boolean> = new Map<string, boolean>()
showPassword = false
tableShowPassword: Map<string, boolean> = new Map<string, boolean>()
constructor(private datasourseTableService: DatasourseTableService,
private modalService: NgbModal,
private cdr: ChangeDetectorRef) {
}
ngOnInit(): void {
this.getList()
}
getList() {
this.datasourceTable.loading = true
this.datasourceTable.data = []
this.datasourseTableService.getList().subscribe(response => {
this.datasourceTable.data = response.map(e => new MyDatasourceTableModel(e))
this.datasourceTable.loading = false
}, error => {
this.datasourceTable.loading = false
})
}
postData() {
const modalConfirmRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalConfirmRef.componentInstance.message = 'คุณต้องการบันทึกข้อมูลหรือไม่'
modalConfirmRef.result.then(result => {
this.datasourceTable.loading = true
this.datasourseTableService.post(this.datasourceTable.select).subscribe(response => {
if (response.success) {
this.getList()
} else {
this.openAlertModal(response.message)
this.datasourceTable.loading = false
}
}, error => {
this.openAlertModal(error.message)
this.datasourceTable.loading = false
})
}, reject => { })
}
deleteData() {
const modalConfirmRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalConfirmRef.componentInstance.message = 'คุณต้องการบันทึกข้อมูลหรือไม่'
modalConfirmRef.result.then(result => {
this.datasourceTable.loading = true
this.datasourseTableService.post(this.datasourceTable.select).subscribe(response => {
if (response.success) {
this.getList()
} else {
this.openAlertModal(response.message)
this.datasourceTable.loading = false
}
}, error => {
this.openAlertModal(error.message)
this.datasourceTable.loading = false
})
}, reject => { })
}
selectData(data: DatasourceTableModel) {
this.datasourceTable.select = new MyDatasourceTableModel(data)
this.scrollTop()
}
datasourceTableFilter() {
return this.datasourceTable.data.filter(e => e.companyId.includes(this.datasourceTable.search) ||
e.companyName.includes(this.datasourceTable.search) ||
e.serverName.includes(this.datasourceTable.search) ||
e.databaseName.includes(this.datasourceTable.search))
}
scrollTop() {
window.scrollTo({ top: 0, behavior: 'smooth' });
}
openAlertModal(message?: string) {
const modalRef = this.modalService.open(AlertModalComponent, {
centered: true,
backdrop: 'static'
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
}, reason => {
})
}
}
\ No newline at end of file
src/app/apps/excel-list/excel-list.component.html
......@@ -56,7 +56,7 @@
<table class="table mb-0 no-wrap v-middle ">
<thead class="bg-info text-white">
<tr>
<th class="text-center" scope="col">ชื่อกลุ่มรายงาน(Thai)</th>
<th class="text-center" scope="col">ชื่อกลุ่มรายงาน (ภาษาไทย)</th>
<th class="text-center" scope="col">ชื่อกลุ่มรายงาน (ภาษาอังกฤษ)</th>
<th class="text-center" scope="col" style="min-width: 200px">สร้างโดย</th>
<th class="text-center" scope="col" style="min-width:120px">วันที่สร้าง</th>
......@@ -82,7 +82,7 @@
{{items.tname}}
</span>
<span>
-{{items.ename}}
-{{items.tdesc}}
</span>
</td>
<td class="text-center">
......
src/app/apps/excel-report-toggle/excel-report-toggle.component.html
......@@ -74,7 +74,7 @@
(mouseleave)="tableHover.clear()"
[ngStyle]="{'background-color':tableHover.get(items.templateId)?'rgb(201 223 235)':'#ebf2f6'}">
<td colspan="6" class="font-16 font-medium">
{{items.tname}}-{{items.ename}}
{{items.tname}}-{{items.tdesc}}
</td>
<td class="text-center">
<ng-container *ngIf="items.templateFile.length">
......
src/app/apps/excel-report/excel-report.component.html
<h2>🔹 Syncfusion Grid</h2>
<ejs-grid [dataSource]="gridData" [allowPaging]="true" [pageSettings]="{ pageSize: 5 }">
<e-columns>
<e-column field="id" headerText="ID" width="100"></e-column>
<e-column field="name" headerText="Name" width="150"></e-column>
<e-column field="age" headerText="Age" width="100"></e-column>
</e-columns>
</ejs-grid>
<hr />
<h2>🔹 Syncfusion PivotView</h2>
<ejs-pivotview [dataSourceSettings]="pivotDataSource" height="300"></ejs-pivotview>
<div class="card">
<div class="card-header bg-myhr">
<h4>{{"Excel Report"}}</h4>
</div>
<div class="card-body">
<h4 class="card-title">Excel Report</h4>
<div class="row">
<div class="d-flex col-12 justify-content-center" *ngIf="loading">
<div *ngFor="let item of [1,2,3]" class="spinner-grow text-info mx-1" role="status">
......
src/app/apps/excel-report/excel-report.component.ts
......@@ -14,30 +14,6 @@ export interface ModalDetail {
styleUrls: ['./excel-report.component.scss']
})
export class ExcelReportComponent implements OnInit {
// สำหรับ Grid
public gridData = [
{ id: 1, name: 'Alice', age: 28 },
{ id: 2, name: 'Bob', age: 32 },
{ id: 3, name: 'Charlie', age: 25 },
{ id: 4, name: 'David', age: 45 },
{ id: 5, name: 'Eva', age: 38 },
{ id: 6, name: 'Frank', age: 40 }
];
// สำหรับ Pivot
public pivotDataSource: IDataOptions = {
dataSource: [
{ Product: 'Laptop', Region: 'North', Sales: 100 },
{ Product: 'Tablet', Region: 'South', Sales: 200 },
{ Product: 'Phone', Region: 'North', Sales: 150 },
{ Product: 'Laptop', Region: 'South', Sales: 120 },
],
values: [{ name: 'Sales', caption: 'Sales Amount' }],
rows: [{ name: 'Product' }],
columns: [{ name: 'Region' }],
};
changeDate = new Date();
select: any = {}
excelReport?: any
......@@ -56,6 +32,7 @@ export class ExcelReportComponent implements OnInit {
searchModal = ""
page = 1
pageSize = 10
constructor(private route: ActivatedRoute,
private ngbModal: NgbModal,
private excelReportService: ExcelReportService,
......@@ -65,16 +42,23 @@ export class ExcelReportComponent implements OnInit {
}
ngOnInit(): void {
this.route.params.subscribe(params => {
this.getDataExcelReport(params['id'])
})
}
getDataExcelReport(itemId: string) {
this.route.paramMap.subscribe(params => {
const rawId = params.get('id');
if (rawId) {
const [id, queryString] = rawId.split('?');
const params = new URLSearchParams(queryString);
const template = params.get('template');
const name = params.get('name');
this.getDataExcelReport(template || '', name || '')
}
});
}
getDataExcelReport(templateId: string, fileName: string) {
this.loading = true
this.excelReport = undefined
this.variableSheet = []
this.valueDetail = []
this.excelReportService.getExcelReport(itemId).subscribe((res: any) => {
this.excelReportService.getTemplateFile(templateId, fileName).subscribe((res: any) => {
this.excelReport = res
if (this.excelReport.param) {
Object.entries(this.excelReport.param.variableSheet).forEach(([key, value]) => {
......@@ -168,7 +152,7 @@ export class ExcelReportComponent implements OnInit {
}
return ""
}).join('|')
this.excelReportService.dowloadExcelReport(fileName, param, data).subscribe((res: any) => {
this.excelReportService.downloadTemplateFile(fileName).subscribe((res: any) => {
const blob = new Blob([res], { type: 'application/octet-stream' });
FileSaver.saveAs(blob, fileName);
this.loadingExcel = false
......
src/app/model/datasource-table.model.ts 0 → 100644
export interface DatasourceTableModel {
companyId: string
companyName: string
databaseName: string
dbType: string
password: string
portNumber: string
serverName: string
status: string
userName: string
}
export class MyDatasourceTableModel implements DatasourceTableModel {
companyId: string
companyName: string
databaseName: string
dbType: string
password: string
portNumber: string
serverName: string
status: string
userName: string
constructor(data?: Partial<DatasourceTableModel>) {
this.companyId = data?.companyId || ''
this.companyName = data?.companyName || ''
this.databaseName = data?.databaseName || ''
this.dbType = data?.dbType || ''
this.password = data?.password || ''
this.portNumber = data?.portNumber || ''
this.serverName = data?.serverName || ''
this.status = data?.status || ''
this.userName = data?.userName || ''
}
}
\ No newline at end of file
src/app/model/template-file-mini.model.ts 0 → 100644
export interface TemplateFileMiniModel {
edesc: string
fileName: string
itemId: string
module: string
tdesc: string
templateId: string
}
export class MyTemplateFileMiniModel implements TemplateFileMiniModel {
edesc: string
fileName: string
itemId: string
module: string
tdesc: string
templateId: string
constructor(data?: Partial<TemplateFileMiniModel>) {
this.edesc = data?.edesc || ''
this.fileName = data?.fileName || ''
this.itemId = data?.itemId || ''
this.module = data?.module || ''
this.tdesc = data?.tdesc || ''
this.templateId = data?.templateId || ''
}
}
src/app/service/datasourse-table.service.ts 0 → 100644
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { TranslateService } from '@ngx-translate/core';
import { Observable } from 'rxjs';
import { environment } from '../../environments/environment';
import { TemplateFileModel, TemplateModel } from '../model/template.model';
import { ModuleModel } from '../model/module.model';
import { ExcelPortalModel, ExcelPortalGroupModel, ExcelPortalTagsModel } from '../model/excel-portal.model';
import { AlertModel } from '../model/alert.model';
import { TemplateFileMiniModel } from '../model/template-file-mini.model';
import { DatasourceTableModel } from '../model/datasource-table.model';
@Injectable({
providedIn: 'root'
})
export class DatasourseTableService {
constructor(private http: HttpClient,
private translateService: TranslateService
) { }
getid(companyid: string): Observable<DatasourceTableModel> {
return this.http.get<DatasourceTableModel>(environment.url + "datasource/" + companyid)
}
getList(): Observable<DatasourceTableModel[]> {
return this.http.get<DatasourceTableModel[]>(environment.url + "datasource/lists")
}
post(body: DatasourceTableModel): Observable<AlertModel> {
return this.http.post<AlertModel>(environment.url + "datasource", body)
}
delete(body: DatasourceTableModel): Observable<AlertModel> {
let option = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
}
return this.http.delete<AlertModel>(environment.url + "datasource", option)
}
}
\ No newline at end of file
src/app/service/excel-report.service.ts
......@@ -7,6 +7,7 @@ import { TemplateFileModel, TemplateModel } from '../model/template.model';
import { ModuleModel } from '../model/module.model';
import { ExcelPortalModel, ExcelPortalGroupModel, ExcelPortalTagsModel } from '../model/excel-portal.model';
import { AlertModel } from '../model/alert.model';
import { TemplateFileMiniModel } from '../model/template-file-mini.model';
@Injectable({
providedIn: 'root'
......@@ -16,13 +17,6 @@ export class ExcelReportService {
constructor(private http: HttpClient,
private translateService: TranslateService
) { }
getExcelReport(itemId: string): Observable<any> {
return this.http.get(environment.url + "irapi/menuitem/" + itemId + '?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47')
}
dowloadExcelReport(fileName: string, varname: string, data: string): Observable<any> {
return this.http.get(environment.url + "irapi/excel/export-to-excel?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47&fileName=" + fileName + "&param=__varname=" + varname + "|__screen=XLSOPTION|" + data, { responseType: 'blob' })
}
getExcelList(): Observable<TemplateModel[]> {
return this.http.get<TemplateModel[]>(environment.url + "template/lists?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47")
}
......@@ -82,4 +76,8 @@ export class ExcelReportService {
getTemplateFile(templateid: string, filename: string): Observable<AlertModel> {
return this.http.get<AlertModel>(environment.url + "template-file/" + templateid + "/" + filename + "?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47",)
}
getTemplateFileLists(): Observable<TemplateFileMiniModel[]> {
return this.http.get<TemplateFileMiniModel[]>(environment.url + "template-file/menuitem/mini/lists?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47",)
}
}
\ No newline at end of file
src/app/shared/vertical-sidebar/vertical-menu-items.ts
......@@ -123,6 +123,16 @@ export const ROUTES: RouteInfo[] = [
// },
]
},
{
path: '/apps/datasource-table',
title: 'Datasource Table',
icon: 'mdi mdi-adjust',
class: '',
label: "",
labelClass: "",
extralink: false,
submenu: []
},
//
// {
......
src/app/shared/vertical-sidebar/vertical-sidebar.component.html
......@@ -70,7 +70,7 @@
[ngClass]="[sidebarnavSubItem.class]" *ngIf="!sidebarnavSubItem.extralink;"
(click)="addActiveClass(sidebarnavSubItem.title)">
<i [ngClass]="[sidebarnavSubItem.icon]"></i>
<span class="hide-menu">{{sidebarnavSubItem.title| translate}}</span>
<span class="hide-menu mr-0">{{sidebarnavSubItem.title| translate}}</span>
</a>
<!-- Third level menu -->
<ul aria-expanded="false" class="collapse Second-level" *ngIf="sidebarnavSubItem.submenu.length > 0"
......
src/app/shared/vertical-sidebar/vertical-sidebar.component.ts
......@@ -2,6 +2,8 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
import { Router } from '@angular/router';
import { RouteInfo } from './vertical-sidebar.metadata';
import { VerticalSidebarService } from './vertical-sidebar.service';
import { ExcelReportService } from 'src/app/service/excel-report.service';
import { MyTemplateFileMiniModel, TemplateFileMiniModel } from 'src/app/model/template-file-mini.model';
@Component({
......@@ -15,9 +17,12 @@ export class VerticalSidebarComponent {
showSubMenu = '';
public sidebarnavItems: RouteInfo[] = [];
path = '';
submenuExcel: TemplateFileMiniModel[] = []
constructor(private menuServise: VerticalSidebarService, private router: Router, private excelReportService: ExcelReportService) {
this.excelReportService.getTemplateFileLists().subscribe(response => {
this.submenuExcel = response.map(e => new MyTemplateFileMiniModel(e))
constructor(private menuServise: VerticalSidebarService, private router: Router) {
if (this.menuServise.submenu.length > 0) {
if (this.submenuExcel.length) {
const currentValue = this.menuServise.items.value;
const updated = [...currentValue, {
path: '',
......@@ -31,13 +36,20 @@ export class VerticalSidebarComponent {
}];
this.menuServise.items.next(updated);
}
this.addMenu()
}, error => {
this.addMenu()
})
}
addMenu() {
this.menuServise.items.subscribe(menuItems => {
this.sidebarnavItems = menuItems.map(e => {
if (e.title == 'รายงาน Excel') {
this.menuServise.submenu.map(e2 => {
this.submenuExcel.map(e2 => {
e.submenu.push({
path: '/apps/excel-export/' + e2.itemId,
title: e2.tdesc,
path: '/apps/excel-export/' + e2.itemId + "?template=" + e2.templateId + "&name=" + e2.fileName,
title: e2.itemId + '.' + e2.tdesc,
icon: "",
class: "",
label: "",
......@@ -60,7 +72,6 @@ export class VerticalSidebarComponent {
this.addExpandClass(this.path);
});
}
addExpandClass(element: any) {
if (element === this.showMenu) {
this.showMenu = '0';
......
src/app/shared/vertical-sidebar/vertical-sidebar.service.ts
......@@ -16,32 +16,6 @@ export class VerticalSidebarService {
MENUITEMS: RouteInfo[] = ROUTES;
items = new BehaviorSubject<RouteInfo[]>(this.MENUITEMS);
submenu: {
"itemId": string,
"templateId": string,
"fileName": string,
"tdesc": string,
"edesc": string,
"module": string,
}[] = [
// {
// "itemId": "3459",
// "templateId": "3011",
// "fileName": "BFET6T4QJ.xlsx",
// "tdesc": "FOR TEST OPTION ESS",
// "edesc": "FOR TEST OPTION ESS",
// "module": "EMPVIEW"
// },
// {
// "itemId": "3462",
// "templateId": "3011",
// "fileName": "F5QTI20MBJ.xls",
// "tdesc": "REPORT WORKING HOURS_BU3",
// "edesc": "REPORT WORKING HOURS_BU3",
// "module": "EMPVIEW"
// }
]
constructor() {
}
}
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