Commit b2561485 by Natthaphat

ยก model myProtal มาใส่ ติดตั้ง package เพิ่ม ## npm i --force ด้วย

parent b67a3eb0
...@@ -30,9 +30,17 @@ ...@@ -30,9 +30,17 @@
"@fortawesome/angular-fontawesome": "^0.14.1", "@fortawesome/angular-fontawesome": "^0.14.1",
"@kolkov/angular-editor": "^3.0.0-beta.0", "@kolkov/angular-editor": "^3.0.0-beta.0",
"@ks89/angular-modal-gallery": "^11.1.1", "@ks89/angular-modal-gallery": "^11.1.1",
"@ng-bootstrap/ng-bootstrap": "^15.1.1",
"@ng-select/ng-select": "^12.0.6", "@ng-select/ng-select": "^12.0.6",
"@ngx-translate/core": "^15.0.0", "@ngx-translate/core": "^15.0.0",
"@ngx-translate/http-loader": "^8.0.0", "@ngx-translate/http-loader": "^8.0.0",
"@syncfusion/ej2-angular-base": "^29.2.4",
"@syncfusion/ej2-angular-dropdowns": "^29.2.4",
"@syncfusion/ej2-angular-grids": "^29.2.4",
"@syncfusion/ej2-angular-inputs": "^29.2.4",
"@syncfusion/ej2-angular-pivotview": "^29.2.4",
"@syncfusion/ej2-angular-charts": "^29.2.4",
"@syncfusion/ej2-grids": "^30.1.39",
"@tailwindcss/forms": "^0.5.7", "@tailwindcss/forms": "^0.5.7",
"@types/google.maps": "^3.58.1", "@types/google.maps": "^3.58.1",
"@types/googlemaps": "^3.43.3", "@types/googlemaps": "^3.43.3",
...@@ -44,9 +52,11 @@ ...@@ -44,9 +52,11 @@
"date-fns": "^3.3.1", "date-fns": "^3.3.1",
"echarts": "^5.4.3", "echarts": "^5.4.3",
"face-api.js": "^0.22.2", "face-api.js": "^0.22.2",
"file-saver": "^2.0.5",
"filepond": "^4.30.6", "filepond": "^4.30.6",
"filepond-plugin-get-file": "^1.1.0", "filepond-plugin-get-file": "^1.1.0",
"firebase": "^10.7.1", "firebase": "^10.7.1",
"flatpickr": "^4.6.13",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"i": "^0.3.7", "i": "^0.3.7",
"jwt-decode": "^4.0.0", "jwt-decode": "^4.0.0",
...@@ -91,6 +101,7 @@ ...@@ -91,6 +101,7 @@
"@angular-devkit/build-angular": "^17.0.5", "@angular-devkit/build-angular": "^17.0.5",
"@angular/cli": "^17.1.1", "@angular/cli": "^17.1.1",
"@angular/compiler-cli": "^17.0.0", "@angular/compiler-cli": "^17.0.0",
"@types/file-saver": "^2.0.7",
"@types/jasmine": "~5.1.0", "@types/jasmine": "~5.1.0",
"@types/react": "^18.2.46", "@types/react": "^18.2.46",
"jasmine-core": "~5.1.0", "jasmine-core": "~5.1.0",
...@@ -103,4 +114,4 @@ ...@@ -103,4 +114,4 @@
"tailwindcss": "^3.3.2", "tailwindcss": "^3.3.2",
"typescript": "~5.2.2" "typescript": "~5.2.2"
} }
} }
\ No newline at end of file
...@@ -7,6 +7,7 @@ import { QuillModule } from 'ngx-quill'; ...@@ -7,6 +7,7 @@ import { QuillModule } from 'ngx-quill';
export const admin: Routes = [ export const admin: Routes = [
{ {
path: 'admin', children: [{ path: 'admin', children: [{
//////////////MyJob/////////////////
path: 'home', path: 'home',
loadComponent: () => loadComponent: () =>
import('./home-common/home-common.component').then((m) => m.HomeCommonComponent), import('./home-common/home-common.component').then((m) => m.HomeCommonComponent),
...@@ -81,6 +82,12 @@ export const admin: Routes = [ ...@@ -81,6 +82,12 @@ export const admin: Routes = [
loadComponent: () => loadComponent: () =>
import('./company-department/career-cluster/career-cluster.component').then((m) => m.CareerClusterComponent), import('./company-department/career-cluster/career-cluster.component').then((m) => m.CareerClusterComponent),
}, },
//////////////MyPortal/////////////////
{
path: 'excel-list',
loadComponent: () =>
import('./myportal/set-excel-reports/excel-list/excel-list.component').then((m) => m.ExcelListComponent),
},
//////////////emp///////////////// //////////////emp/////////////////
{ {
path: 'emp/department', path: 'emp/department',
......
/* tslint:disable:no-unused-variable */
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { SetExcelReportsComponent } from './set-excel-reports.component';
describe('SetExcelReportsComponent', () => {
let component: SetExcelReportsComponent;
let fixture: ComponentFixture<SetExcelReportsComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ SetExcelReportsComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SetExcelReportsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-set-excel-reports',
templateUrl: './set-excel-reports.component.html',
styleUrls: ['./set-excel-reports.component.css']
})
export class SetExcelReportsComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
export interface AlertModel {
actionStatus: string
fail: boolean
memberId: any
message: string
none: boolean
resultObject: any
state: string
statusCode: number
success: boolean
}
\ No newline at end of file
import { environment } from "../../../environments/environment"
export interface ExcelPortalModel {
getImg: any
approveBy: string
approveDate: string
approveTime: string
dbSupport: string
downloadDate: string
downloadTime: string
dwTime: number
engDesc: string
engName: string
excelId: string
fileData: string
fileType: string
group: ExcelPortalGroupModel
isDataGrid: number
isPivot: number
link1: string
referId: string
remark: string
tags: ExcelPortalTagsModel[]
thDesc: string
thName: string
thumbnail: string
uploadBy: string
uploadDate: string
uploadTime: string
}
export class MyExcelPortalModel implements ExcelPortalModel {
approveBy: string
approveDate: string
approveTime: string
dbSupport: string
downloadDate: string
downloadTime: string
dwTime: number
engDesc: string
engName: string
excelId: string
fileData: string
fileType: string
group: ExcelPortalGroupModel
isDataGrid: number
isPivot: number
link1: string
referId: string
remark: string
tags: ExcelPortalTagsModel[]
thDesc: string
thName: string
thumbnail: string
uploadBy: string
uploadDate: string
uploadTime: string
constructor(data?: Partial<ExcelPortalModel>) {
this.approveBy = data?.approveBy || ''
this.approveDate = data?.approveDate || ''
this.approveTime = data?.approveTime || ''
this.dbSupport = data?.dbSupport || ''
this.downloadDate = data?.downloadDate || ''
this.downloadTime = data?.downloadTime || ''
this.dwTime = data?.dwTime ?? 0
this.engDesc = data?.engDesc || ''
this.engName = data?.engName || ''
this.excelId = data?.excelId || ''
this.fileData = data?.fileData || ''
this.fileType = data?.fileType || ''
this.group = new MyExcelPortalGroupModel(data?.group || {})
this.isDataGrid = data?.isDataGrid ?? 0
this.isPivot = data?.isPivot ?? 0
this.link1 = data?.link1 || ''
this.referId = data?.referId || ''
this.remark = data?.remark || ''
this.tags = data?.tags?.map(e => new MyExcelPortalTagsModel(e)) || []
this.thDesc = data?.thDesc || ''
this.thName = data?.thName || ''
this.thumbnail = data?.thumbnail || ''
this.uploadBy = data?.uploadBy || ''
this.uploadDate = data?.uploadDate || ''
this.uploadTime = data?.uploadTime || ''
}
getImg() {
return this.thumbnail ? environment.baseUrl + "files/image/" + this.thumbnail : ''
}
}
export interface ExcelPortalGroupModel {
engName: string
groupId: string
groupType: number
thName: string
}
export class MyExcelPortalGroupModel implements ExcelPortalGroupModel {
engName: string
groupId: string
groupType: number
thName: string
constructor(data?: Partial<ExcelPortalGroupModel>) {
this.engName = data?.engName || ''
this.groupId = data?.groupId || ''
this.groupType = data?.groupType ?? 0
this.thName = data?.thName || ''
}
}
export interface ExcelPortalTagsModel {
display: string
value: string
}
export class MyExcelPortalTagsModel implements ExcelPortalTagsModel {
display: string
value: string
constructor(data?: Partial<ExcelPortalTagsModel>) {
this.display = data?.display || ''
this.value = data?.value || ''
}
}
\ No newline at end of file
export interface ModuleModel {
code: string
tdesc: string
edesc: string
}
export class MyModuleModel implements ModuleModel {
code: string
tdesc: string
edesc: string
constructor(data: Partial<ModuleModel>) {
this.code = data?.code || ''
this.tdesc = data?.tdesc || ''
this.edesc = data?.edesc || ''
}
}
\ No newline at end of file
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 || ''
}
}
export interface PrefixModel {
edesc: string
prefixId: string
tdesc: string
}
export class MyPrefixModel implements PrefixModel {
edesc: string
prefixId: string
tdesc: string
constructor(data?: Partial<PrefixModel>) {
this.edesc = data?.edesc || ''
this.prefixId = data?.prefixId || ''
this.tdesc = data?.tdesc || ''
}
}
export interface CreateByModel {
efname: string
elname: string
email: string
employeeId: string
engFullName: string
fname: string
lname: string
picture: string
prefix: PrefixModel
sex: string
thFullName: string
}
export class MyCreateByModel implements CreateByModel {
efname: string
elname: string
email: string
employeeId: string
engFullName: string
fname: string
lname: string
picture: string
prefix: PrefixModel
sex: string
thFullName: string
constructor(data?: Partial<CreateByModel>) {
this.efname = data?.efname || ''
this.elname = data?.elname || ''
this.email = data?.email || ''
this.employeeId = data?.employeeId || ''
this.engFullName = data?.engFullName || ''
this.fname = data?.fname || ''
this.lname = data?.lname || ''
this.picture = data?.picture || ''
this.prefix = new MyPrefixModel(data?.prefix)
this.sex = data?.sex || ''
this.thFullName = data?.thFullName || ''
}
}
export interface TemplateFileModel {
createDate: string
edesc: string
fileName: string
isDataGrid: string
isPivot: string
isShare: string
itemId: string
menuActive: string
module: string
page: string
param: any | null
portalId: string
realFileName: string
realFileNameOld: string
tdesc: string
templateId: string
uponMenu: string
fileData: string
fileType: string
}
export class MyTemplateFileModel implements TemplateFileModel {
createDate: string
edesc: string
fileName: string
isDataGrid: string
isPivot: string
isShare: string
itemId: string
menuActive: string
module: string
page: string
param: any | null
portalId: string
realFileName: string
realFileNameOld: string
tdesc: string
templateId: string
uponMenu: string
fileData: string
fileType: string
constructor(data?: Partial<TemplateFileModel>) {
this.createDate = data?.createDate || ''
this.edesc = data?.edesc || ''
this.fileName = data?.fileName || ''
this.isDataGrid = data?.isDataGrid || '0'
this.isPivot = data?.isPivot || '0'
this.isShare = data?.isShare || '0'
this.itemId = data?.itemId || ''
this.menuActive = data?.menuActive || ''
this.module = data?.module || ''
this.page = data?.page || ''
this.param = data?.param
this.portalId = data?.portalId || ''
this.realFileName = data?.realFileName || ''
this.realFileNameOld = data?.realFileNameOld || ''
this.tdesc = data?.tdesc || ''
this.templateId = data?.templateId || ''
this.uponMenu = data?.uponMenu || ''
this.fileData = data?.fileData || ''
this.fileType = data?.fileType || ''
}
}
export interface TemplateModel {
templateId: string
tname: string
ename: string
tdesc: string
edesc: string
module: string
templateFile: TemplateFileModel[]
}
export class MyTemplateModel implements TemplateModel {
templateId: string
tname: string
ename: string
tdesc: string
edesc: string
module: string
templateFile: TemplateFileModel[]
constructor(data?: Partial<TemplateModel>) {
this.templateId = data?.templateId || ''
this.tname = data?.tname || ''
this.ename = data?.ename || ''
this.tdesc = data?.tdesc || ''
this.edesc = data?.edesc || ''
this.module = data?.module || ''
this.templateFile = data?.templateFile?.map(x => new MyTemplateFileModel(x)) || []
}
}
\ No newline at end of file
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { QuillModule } from 'ngx-quill';
import { MyportalComponent } from './myportal.component';
import { CommonModule } from '@angular/common';
export const admin: Routes = [
{
path: 'admin', children: [{
path: 'home',
loadComponent: () =>
import('./home-common/home-common.component').then((m) => m.HomeCommonComponent),
},
]
}
];
@NgModule({
imports: [
CommonModule,
RouterModule.forChild(admin),
QuillModule.forRoot(),
],
exports: [RouterModule],
declarations: [MyportalComponent]
})
export class MyPortalModule {
static routes = admin;
}
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 { AlertModel } from '../models/alert.model';
@Injectable({
providedIn: 'root'
})
export class CustomCubeService {
constructor(private http: HttpClient,
private translateService: TranslateService
) { }
getExcelColumn(body: {
templateId: string,
fileName: string,
}) {
return this.http.post(environment.baseUrl + "customcube/get-excel-column?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", body)
}
getExcelData(body: any) {
return this.http.post(environment.baseUrl + "customcube/get-excel-data?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", body)
}
saveExcelPerspective(body: {
templateId: string,
fileName: string,
dataGridStr: string,
pivotStr: string,
}): Observable<AlertModel> {
return this.http.post<AlertModel>(environment.baseUrl + "customcube/save-excel-perspective?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", body)
}
getExcelPerspective(body: {
templateId: string,
fileName: string,
}) {
return this.http.post(environment.baseUrl + "customcube/get-excel-perspective?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", body)
}
}
\ No newline at end of file
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { TranslateService } from '@ngx-translate/core';
import { Observable } from 'rxjs';
import { TemplateFileModel, TemplateModel } from '../models/template.model';
import { environment } from '../../../environments/environment';
import { ModuleModel } from '../models/module.model';
import { ExcelPortalGroupModel, ExcelPortalModel, ExcelPortalTagsModel } from '../models/excel-portal.model';
import { AlertModel } from '../models/alert.model';
import { TemplateFileMiniModel } from '../models/template-file-mini.model';
@Injectable({
providedIn: 'root'
})
export class ExcelReportService {
constructor(private http: HttpClient,
private translateService: TranslateService
) { }
getExcelList(): Observable<TemplateModel[]> {
return this.http.get<TemplateModel[]>(environment.baseUrl + "/template/lists?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47")
}
getModuleList(): Observable<ModuleModel[]> {
return this.http.get<ModuleModel[]>(environment.baseUrl + "/template/lists/module?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47")
}
getExcelPortalList(): Observable<ExcelPortalModel[]> {
return this.http.get<ExcelPortalModel[]>(environment.baseUrl + "/excel-center/content/lists")
}
getExcelPortalgGroupList(): Observable<ExcelPortalGroupModel[]> {
return this.http.get<ExcelPortalGroupModel[]>(environment.baseUrl + "/portal-group/lists")
}
getExcelPortalTagsList(): Observable<ExcelPortalTagsModel[]> {
return this.http.get<ExcelPortalTagsModel[]>(environment.baseUrl + "/tag/lists")
}
postTemplate(body: {
templateId: string,
tname: string,
ename: string,
tdesc: string,
edesc: string,
module: string
}) {
return this.http.post(environment.baseUrl + "/template?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", body)
}
deleteTemplate(body: TemplateModel): Observable<AlertModel> {
let option = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
}
return this.http.delete<AlertModel>(environment.baseUrl + "/template?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", option)
}
postTemplateFile(body: TemplateFileModel): Observable<AlertModel> {
return this.http.post<AlertModel>(environment.baseUrl + "/template-file?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", body)
}
deleteTemplateFile(body: TemplateFileModel): Observable<AlertModel> {
let option = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
}
return this.http.delete<AlertModel>(environment.baseUrl + "/template-file?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", option)
}
downloadTemplateFile(fileName: string) {
return this.http.get(environment.baseUrl + "/template-file/download/excel/" + fileName + "?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", { responseType: 'blob' })
}
printExcelReport(body: {
fileName: string,
paramObj: string
}) {
return this.http.post(environment.baseUrl + "/template-file/export-to-excel?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47", body, { responseType: 'blob' })
}
getTemplateFile(templateid: string, filename: string): Observable<AlertModel> {
return this.http.get<AlertModel>(environment.baseUrl + "/template-file/" + templateid + "/" + filename + "?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47",)
}
getTemplateFileLists(): Observable<TemplateFileMiniModel[]> {
return this.http.get<TemplateFileMiniModel[]>(environment.baseUrl + "/template-file/menuitem/mini/lists?companyid=eb2f4f30-edaf-11ee-a69a-c7680edc0e47",)
}
}
\ No newline at end of file
<div class="modal-header">
<h5 class="modal-title" id="editLabel">ข้อความแจ้งเตือน</h5>
<button type="button" class="close" (click)="activeModal.dismiss('dismiss')" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<ng-container *ngIf="innerHTML!=undefined then InnerHTML else Message"></ng-container>
<ng-template #Message>
<div class="modal-body">
{{message}}
</div>
</ng-template>
<ng-template #InnerHTML>
<div class="modal-body" [innerHTML]="innerHTML">
</div>
</ng-template>
\ No newline at end of file
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AlertModalComponent } from './alert-modal.component';
describe('AlertModalComponent', () => {
let component: AlertModalComponent;
let fixture: ComponentFixture<AlertModalComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ AlertModalComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(AlertModalComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, Input, OnInit } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'app-alert-modal',
templateUrl: './alert-modal.component.html',
styleUrls: ['./alert-modal.component.scss']
})
export class AlertModalComponent implements OnInit {
@Input() message: string = ""
@Input() innerHTML?: string
constructor(public activeModal: NgbActiveModal) { }
ngOnInit(): void {
}
}
<div class="modal-header">
<h5 class="modal-title" id="editLabel">ข้อความแจ้งเตือน</h5>
<button type="button" class="close" (click)="activeModal.dismiss('dismiss')" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
{{message}}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-info" (click)="activeModal.close('close')">
ยืนยัน
</button>
<button type="button" class="btn btn-danger" (click)="activeModal.dismiss('dismiss')">
ยกเลิก
</button>
</div>
\ No newline at end of file
import { Component, Input, OnInit } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'app-confirm-modal',
templateUrl: './confirm-modal.component.html',
styleUrls: ['./confirm-modal.component.scss']
})
export class ConfirmModalComponent implements OnInit {
@Input() message: string = "";
constructor(public activeModal: NgbActiveModal) { }
ngOnInit(): void {
}
}
<ejs-grid #grid id='Grid' [dataSource]="dataSourceSearch" [allowFiltering]="allowFiltering"
[filterSettings]="filterSettings" (actionComplete)="actionComplete($event)" [searchSettings]="searchSettings"
[groupSettings]="groupSettings" [toolbar]='toolbarOptions' [editSettings]="editSettings" allowPaging='true'
allowGrouping='true' allowSorting='true' [showColumnMenu]="true" (columnMenuClick)="onColumnMenuClick($event)"
allowFiltering='true' [allowPdfExport]='true' (toolbarClick)='toolbarClick($event)' [allowExcelExport]='true'
[selectionSettings]="selectionOptions" (detailDataBound)='detailDataBound($event)' width="auto" allowReordering='true'
[loadingIndicator]='loadingIndicator' [query]="query" rowHeight='60' allowEditing='false' [pageSettings]='initialPage'
[allowMultiSorting]='true' [columnMenuItems]="columnMenuItems">
<e-columns>
<e-column *ngFor="let col of columns" [field]="col.field" [headerText]="col.headerText" [width]="col.width"
[format]="col.format" [textAlign]="'center'" [isPrimaryKey]="col.isPrimaryKey" [editType]="false"
[validationRules]="col.validationRules" [allowEditing]="false" [allowSorting]="'true'" [allowFiltering]="true"
[visible]="col.visible" [type]="col.type">
<ng-template #headerTemplate let-data>
<span class="font-size-12px font-weight-700">{{ col.headerText }}</span>
</ng-template>
</e-column>
</e-columns>
<e-aggregates>
<e-aggregate>
<e-columns>
<e-column *ngFor="let col of aggregatesSum" [field]="col.field" [type]="'Sum'" [footerTemplate]="'Sum: ${Sum}'"
[groupFooterTemplate]="'Sum: ${Sum}'" [groupCaptionTemplate]="col.groupCaptionTemplate" [format]="col.format">
</e-column>
</e-columns>
</e-aggregate>
<e-aggregate>
<e-columns>
<e-column *ngFor="let col of aggregatesCount" [field]="col.field" [type]="'Count'"
[footerTemplate]="'Count: ${Count}'" [groupFooterTemplate]="'Count: ${Count}'"
[groupCaptionTemplate]="col.groupCaptionTemplate" [format]="col.format">
</e-column>
</e-columns>
</e-aggregate>
<e-aggregate>
<e-columns>
<e-column *ngFor="let col of aggregatesAvg" [field]="col.field" [type]="'Average'"
[footerTemplate]="'Average: ${Average}'" [groupFooterTemplate]="'Average: ${Average}'"
[groupCaptionTemplate]="col.groupCaptionTemplate" [format]="col.format">
</e-column>
</e-columns>
</e-aggregate>
<e-aggregate>
<e-columns>
<e-column *ngFor="let col of aggregatesMin" [field]="col.field" [type]="'Min'" [footerTemplate]="'Min: ${Min}'"
[groupFooterTemplate]="'Min: ${Min}'" [groupCaptionTemplate]="col.groupCaptionTemplate" [format]="col.format">
</e-column>
</e-columns>
</e-aggregate>
<e-aggregate>
<e-columns>
<e-column *ngFor="let col of aggregatesMax" [field]="col.field" [type]="'Max'" [footerTemplate]="'Max: ${Max}'"
[groupFooterTemplate]="'Max: ${Max}'" [groupCaptionTemplate]="col.groupCaptionTemplate" [format]="col.format">
</e-column>
</e-columns>
</e-aggregate>
</e-aggregates>
</ejs-grid>
\ No newline at end of file
// th{
// position: relative; // เทียบเท่า class "relative"
// padding: 10px; // เทียบเท่า class "px-10px py-10px" (อาจเปลี่ยนตามต้องการ)
// background-color: rgb(96 165 250 / 0.1); // ตัวอย่างแทน "bg-soft-secondary"
// color: #2b2b2b; // ตัวอย่างแทน "text-primary"
// text-align: center !important; // เทียบเท่า "!text-center"
// // หากต้องการดีไซน์อื่น ๆ เพิ่มเติมก็ใส่ในนี้ได้เลย เช่น:
// font-weight: 600;
// border-bottom: 1px solid #eee;
// }
.e-headercell,
.e-detailheadercell {
background-color: rgb(96 165 250 / 0.1) !important;
}
.e-pager .e-currentitem, .e-pager .e-currentitem:hover {
background: rgb(96 165 250) !important;
color: #fff;
opacity: 1 !important;
}
.e-checkbox-wrapper .e-frame.e-check, .e-css.e-checkbox-wrapper .e-frame.e-check {
background-color: rgb(96 165 250) !important;
border-color: transparent;
color: #fff;
}
.e-checkbox-wrapper .e-frame, .e-css.e-checkbox-wrapper .e-frame {
border: 1px solid !important;
border-radius: 2px;
box-sizing: border-box;
cursor: pointer;
display: inline-block;
font-family: "e-icons";
height: 18px;
line-height: 10px;
padding: 2px 0;
text-align: center;
vertical-align: middle;
width: 1rem !important;
border-color: #64748b !important;
}
.e-grid td.e-selectionbackground {
background-color: #aec2ec !important;
}
<ejs-pivotview #pivotview id='PivotView' [dataSourceSettings]="dataSourceSettings" [displayOption]='displayOption'
[toolbar]='toolbarOptions' [allowExcelExport]='true' [allowNumberFormatting]='true'
[allowConditionalFormatting]='true' [allowPdfExport]='true' [showToolbar]='true' [allowCalculatedField]='true'
[showFieldList]='true' width='100%' height='550'></ejs-pivotview>
\ No newline at end of file
// th{
// position: relative; // เทียบเท่า class "relative"
// padding: 10px; // เทียบเท่า class "px-10px py-10px" (อาจเปลี่ยนตามต้องการ)
// background-color: rgb(96 165 250 / 0.1); // ตัวอย่างแทน "bg-soft-secondary"
// color: #2b2b2b; // ตัวอย่างแทน "text-primary"
// text-align: center !important; // เทียบเท่า "!text-center"
// // หากต้องการดีไซน์อื่น ๆ เพิ่มเติมก็ใส่ในนี้ได้เลย เช่น:
// font-weight: 600;
// border-bottom: 1px solid #eee;
// }
.e-headercell,
.e-detailheadercell {
background-color: rgb(96 165 250 / 0.1) !important;
}
.e-pager .e-currentitem, .e-pager .e-currentitem:hover {
background: rgb(96 165 250) !important;
color: #fff;
opacity: 1 !important;
}
.e-checkbox-wrapper .e-frame.e-check, .e-css.e-checkbox-wrapper .e-frame.e-check {
background-color: rgb(96 165 250) !important;
border-color: transparent;
color: #fff;
}
.e-checkbox-wrapper .e-frame, .e-css.e-checkbox-wrapper .e-frame {
border: 1px solid !important;
border-radius: 2px;
box-sizing: border-box;
cursor: pointer;
display: inline-block;
font-family: "e-icons";
height: 18px;
line-height: 10px;
padding: 2px 0;
text-align: center;
vertical-align: middle;
width: 1rem !important;
border-color: #64748b !important;
}
.e-grid td.e-selectionbackground {
background-color: #aec2ec !important;
}
import { CommonModule } from "@angular/common";
import { ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output, SimpleChanges, ViewChild } from "@angular/core";
import {
IDataOptions,
PivotView,
ToolbarItems,
GroupingBarService,
ToolbarService,
PDFExportService,
ExcelExportService,
DisplayOption,
IDataSet,
DataSourceSettings,
PivotViewComponent,
FieldList,
PivotViewModule
} from '@syncfusion/ej2-angular-pivotview';
import { DataSourceSettingsModel } from '@syncfusion/ej2-pivotview/src/model/datasourcesettings-model';
import { SharedModule } from "../shared/shared.module";
@Component({
standalone: true,
imports: [
CommonModule,
SharedModule,
PivotViewModule
],
selector: 'app-pivot-syncfution',
templateUrl: './pivot-syncfution.component.html',
styleUrls: ['./pivot-syncfution.component.scss'],
providers: [
GroupingBarService,
ToolbarService,
PDFExportService,
ExcelExportService
]
})
export class PivotSyncfutionComponent implements OnInit {
dataSourceSettings: DataSourceSettingsModel = {
dataSource: [],
expandAll: false,
enableSorting: true,
drilledMembers: [],
columns: [],
values: [],
rows: [],
formatSettings: [],
filters: []
};
@Input() dataSource: any
@Input() columns: any
@Input() templateId!: string;
@Input() fileName!: string;
toolbarOptions: ToolbarItems[] = ['Grid', 'Chart', 'Export', 'SubTotal', 'GrandTotal', 'Formatting', 'FieldList']
displayOption: DisplayOption = { view: 'Both' } as DisplayOption;
@ViewChild('pivotview') public pivotview?: PivotViewComponent;
@Input() sendLayout = false
@Input() pivotLayout = ''
@Output() layout = new EventEmitter<any>();
constructor(private cdr: ChangeDetectorRef) { }
ngOnInit(): void {
}
ngOnChanges(changes: SimpleChanges): void {
if (changes['dataSource']?.currentValue || changes['columns']?.currentValue) {
this.dataSourceSettings = {
dataSource: this.dataSource,
columns: this.columns,
values: [],
rows: [],
expandAll: true,
enableSorting: true,
drilledMembers: [],
filters: [],
formatSettings: []
};
}
if (changes['pivotLayout']) {
if (changes['pivotLayout'].currentValue) {
const layout = JSON.parse(changes['pivotLayout'].currentValue)
this.pivotview?.setProperties(layout)
}
}
if (changes['sendLayout']) {
if (this.pivotview) {
const layout = this.pivotview?.getPersistData();
if (layout) {
this.layout.emit(layout)
}
}
}
}
}
\ No newline at end of file
...@@ -93,7 +93,7 @@ export class NavService implements OnDestroy { ...@@ -93,7 +93,7 @@ export class NavService implements OnDestroy {
getCommonMenu() { getCommonMenu() {
return [ return [
// Dashboard // Dashboard
{ headTitle: 'ผู้ดูแลระบบ' }, { headTitle: 'MyJob' },
{ {
icon: 'news', icon: 'news',
path: '/admin/pdpa-manage', path: '/admin/pdpa-manage',
...@@ -131,30 +131,24 @@ export class NavService implements OnDestroy { ...@@ -131,30 +131,24 @@ export class NavService implements OnDestroy {
{ path: '/admin/provinces', title: 'จัดการจังหวัด', type: 'link' }, { path: '/admin/provinces', title: 'จัดการจังหวัด', type: 'link' },
], ],
}, },
{ headTitle: 'Myportal' }, { headTitle: 'MyPortal' },
{ {
icon: 'news', icon: 'user',
path: '/admin/pdpa-manage', path: '/admin/set-excel-reports',
title: 'จัดการ PDPA', title: 'ตั้งรายงานเอ็กเซล',
type: 'link', type: 'sub',
children: [
{ path: '/admin/excel-list', title: 'เพิ่มรายงาน Excel', type: 'link' },
{ path: '/admin/member-manage', title: 'เปิด-ปิด การใช้รายงาน Excel', type: 'link' }
],
}, },
{ {
icon: 'receipt', icon: 'receipt',
path: '/admin/manage-articles', path: '/admin/manage-articles',
title: 'จัดการบทความ', title: 'DataSource Tabel',
type: 'link', type: 'link',
}, },
{ {
icon: 'user',
path: '/admin/company-departments',
title: 'จัดการผู้ใช้',
type: 'sub',
children: [
{ path: '/admin/manage-companys', title: 'จัดการบริษัท', type: 'link' },
{ path: '/admin/member-manage', title: 'จัดการผู้สมัครงาน', type: 'link' }
],
},
{
icon: 'buildings', icon: 'buildings',
path: '/admin/company-departments', path: '/admin/company-departments',
title: 'ทะเบียนบริษัท', title: 'ทะเบียนบริษัท',
......
import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
@Pipe({
name: 'safeUrl',
standalone: true
})
export class SafeUrlPipe implements PipeTransform {
constructor(private sanitizer: DomSanitizer) { }
transform(url: string): SafeResourceUrl {
return this.sanitizer.bypassSecurityTrustResourceUrl(url);
}
}
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