Skip to content

M
myAppraisal
Commit 1cc60d4b by Nattana Chaiyamat
Options

การจัดการข้อมูลองค์กร 

ทะเบียนกำหนดสิทธิการเข้าใช้งาน
parent 7ec9f7e1
Showing with 910 additions and 55 deletions
src/app/components/company-components/account-settings/role-permission-config/role-permission-config.component.html 0 → 100644
<app-page-header [pathTitle]="pathTitle"></app-page-header>
<div class="bg-card-white">
</div>
<div class="block-main-content">
<div class="text-lg font-bold py-2 px-8 text-primary">
ทะเบียนกำหนดสิทธิการเข้าใช้งาน
</div>
<div class="page">
<div class="border-b border-gray-200 dark:border-white/10 px-8">
<nav class="-mb-0.5 flex space-x-6 rtl:space-x-reverse">
<a class="text-base font-medium hs-tab-active:text-lg hs-tab-active:font-bold hs-tab-active:border-secondary hs-tab-active:text-secondary pb-3 inline-flex items-center gap-2 border-b-[3px] border-transparent whitespace-nowrap text-gray-500 dark:text-white/70 hover:text-secondary active"
href="javascript:void(0);" id="underline-item-1" data-hs-tab="#underline-1"
aria-controls="underline-1">
ทะเบียนกำหนดสิทธิการเข้าใช้งาน
</a>
</nav>
</div>
<div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<ng-container
*ngTemplateOutlet="setMenuPage?rolePermissionConfigSetMenu:rolePermissionConfig"></ng-container>
</div>
</div>
</div>
</div>
<ng-template #rolePermissionConfig>
<div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between">
<div class="flex">
<div class="flex items-center">
<input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
[(ngModel)]="isDataListChecked">
<label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
{{numDataListChecked}} Selected</label>
</div>
<div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button>
<label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
</div>
</div>
<div class="flex justify-end">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="search" (ngModelChange)="searchChange()">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
<i class="ri-search-line text-gray"></i>
</div>
</div>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
data-hs-overlay="#role-permission-config-modal"
(click)="currentModal='add';selectConfigPermission()">
<i class="ri-add-line"></i>
Add
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
data-hs-overlay="#role-permission-config-alert-modal" (click)="currentModal='delete'">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div>
<!-- <div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
<i class="ti ti-book fs-l"></i>
Help
</button>
</div> -->
</div>
</div>
</div>
<div class="page px-rem">
<div class="overflow-auto shadow-md rounded-t-md">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover table-bordered">
<thead>
<tr>
<ng-container
*ngFor="let item of ['','ระดับ','รายละเอียด(ไทย)','รายละเอียด(อังกฤษ)','การจัดการ']; let f = first; let l = last; let i = index">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l&&!f">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="configPermission.loading">
<tr>
<td class="text-center" colspan="100%">
<div *ngFor="let item of [1,2,3]" class="ti-spinner w-8 h-8 text-secondary mx-1"
role="status" aria-label="loading">
<span class="sr-only">Loading...</span>
</div>
</td>
</tr>
</tbody>
<tbody *ngIf="!configPermission.loading&&!configPermissionListFilter().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="!configPermission.loading&&configPermissionListFilter().length">
<tr
*ngFor="let item of configPermissionListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index">
<td class="text-center">
<input type="checkbox" class="ti-form-checkbox cursor-pointer"
id="checkbox-{{item.data.userLevel}}" [(ngModel)]="item.check"
(ngModelChange)="dataListCheck()">
</td>
<td class="text-center">
<label for="checkbox-{{item.data.userLevel}}">&nbsp;{{item.data.userLevel}}</label>
</td>
<td class="text-center">{{item.data.tdesc}}</td>
<td class="text-center">{{item.data.edesc}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="currentModal='edit';selectConfigPermission(item.data)"
data-hs-overlay="#role-permission-config-modal"></i>
<i class="ti ti-menu-2 cursor-pointer i-gray fs-l px-1"
(click)="currentModal = 'updateMenu';selectConfigPermission(item.data);setMenuPage=true"></i>
</td>
</tr>
</tbody>
</table>
</div>
<app-pagination [totalItems]="configPermissionListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event" (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</div>
<div id="role-permission-config-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)]">
<div class="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
{{currentModal=='add'?'เพิ่มข้อมูลระดับ':'แก้ไขข้อมูลระดับ'}}
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#role-permission-config-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="w-full flex justify-end">
<div class="absolute flex">
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-indigo h-45px m-0 shadow-md"
(click)="clearData()">
<svg class="svg-indigo" width="16" height="16" viewBox="0 0 64.00 64.00"
xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#595BEA" stroke-width="3.84"
transform="rotate(45)matrix(-1, 0, 0, 1, 0, 0)">
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g>
<g id="SVGRepo_iconCarrier">
<path d="M15 49A24 24 0 0 1 32 8"></path>
<path d="M49 15a24 24 0 0 1-17 41"></path>
<polyline points="15.03 40 15.03 48.97 8 48.97"></polyline>
<polyline points="48.97 24 48.97 15.03 56 15.03"></polyline>
</g>
</svg>
Clear
</button>
</div>
<!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
<i class="ti ti-book fs-l"></i>
Help
</button>
</div> -->
</div>
</div>
<div class="ti-modal-body padding-16px pt-0 overflow-y-0">
<label for="input-label" class="ti-form-label mt-2rem">รหัสระดับ<span
class="text-danger">*</span></label>
<input type="text" id="input-label" class="ti-form-input w-1/2"
[ngClass]="{'!bg-input-readonly':currentModal=='edit'}" [readonly]="currentModal=='edit'"
[(ngModel)]="configPermission.select.userLevel">
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16"
[(ngModel)]="configPermission.select.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16"
[(ngModel)]="configPermission.select.edesc">
<div class="flex justify-end mt-2rem mb-1rem">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#role-permission-config-modal">
ย้อนกลับ
</button>
<button type="button" class="ti-btn ti-btn-success"
data-hs-overlay="#role-permission-config-alert-modal"
[class.ti-btn-disabled]="!configPermission.select.userLevel||!configPermission.select.tdesc"
[disabled]="!configPermission.select.userLevel||!configPermission.select.tdesc">
บันทึกข้อมูล
</button>
</div>
</div>
</div>
</div>
</div>
<div id="role-permission-config-alert-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center">
<div class="max-h-full overflow-hidden ti-modal-content w-full">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
แจ้งเตือน
</h3>
<div class="flex justify-end">
<ng-container *ngIf="currentModal == 'add'||currentModal == 'edit'">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#role-permission-config-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</ng-container>
<ng-container *ngIf="currentModal == 'delete'">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#role-permission-config-alert-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</ng-container>
</div>
</div>
<div class="ti-modal-body ">
<p class="mt-1 text-gray-800 dark:text-white/70">
<ng-container *ngIf="currentModal == 'add'||currentModal == 'edit'">
ยืนยันการบันทึกข้อมูลหรือไม่!
</ng-container>
<ng-container *ngIf="currentModal == 'delete'">
ยืนยันการลบข้อมูลหรือไม่!
</ng-container>
</p>
<div class="flex justify-end mt-2rem mb-1rem">
<ng-container *ngIf="currentModal == 'add'||currentModal == 'edit'">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#role-permission-config-modal">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);"
data-hs-overlay="#role-permission-config-alert-modal"
(click)="updateConfigPermission('post')">
บันทึกข้อมูล
</a>
</ng-container>
<ng-container *ngIf="currentModal == 'delete'">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#role-permission-config-alert-modal">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-danger" href="javascript:void(0);"
data-hs-overlay="#role-permission-config-alert-modal"
(click)="updateConfigPermission('delete')">
ลบข้อมูล
</a>
</ng-container>
</div>
</div>
</div>
</div>
</div>
</ng-template>
<ng-template #rolePermissionConfigSetMenu>
<div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between">
<div class="flex">
<button type="button"
class="ti-btn ti-btn-outline ti-btn-outline-light h-20px m-0 shadow-md text-blue-500"
(click)="setMenuPage=false;currentPage=1;search=''">
<i class="ti ti-chevron-left"></i>
ย้อนกลับ
</button>
<div class="font-size-18px font-weight-700 align-center text-primary pl-1rem">
ทะเบียนกำหนดสิทธิการเข้าใช้งาน
</div>
</div>
<div class="flex justify-end">
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-success h-45px m-0 shadow-md"
data-hs-overlay="#role-permission-config-set-menu-alert-modal">
<i class="ri-save-3-line"></i>
Save
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-indigo h-45px m-0 shadow-md"
(click)="clearDataMenu()">
<svg class="svg-indigo" width="16" height="16" viewBox="0 0 64.00 64.00"
xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#595BEA" stroke-width="3.84"
transform="rotate(45)matrix(-1, 0, 0, 1, 0, 0)">
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g>
<g id="SVGRepo_iconCarrier">
<path d="M15 49A24 24 0 0 1 32 8"></path>
<path d="M49 15a24 24 0 0 1-17 41"></path>
<polyline points="15.03 40 15.03 48.97 8 48.97"></polyline>
<polyline points="48.97 24 48.97 15.03 56 15.03"></polyline>
</g>
</svg>
Clear
</button>
</div>
<!-- <div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
<i class="ti ti-book fs-l"></i>
Help
</button>
</div> -->
</div>
</div>
</div>
<div class="body-content">
<div class="border-t border-gray-200 py-5 grid grid-cols-1 space-y-6">
<div class="grid grid-cols-11">
<div class="space-y-2 col-span-2">
<label class="ti-form-label">รหัสระดับ</label>
<input type="text" class="ti-form-input !bg-input-readonly" readonly
[(ngModel)]="configPermission.select.userLevel">
</div>
<div class="col-span-1"></div>
<div class="space-y-2 col-span-2">
<label class="ti-form-label">รายละเอียด (ไทย)</label>
<input type="text" class="ti-form-input !bg-input-readonly" readonly
[(ngModel)]="configPermission.select.tdesc">
</div>
<div class="col-span-1"></div>
<div class="space-y-2 col-span-2">
<label class="ti-form-label">รายละเอียด (อังกฤษ)</label>
<input type="text" class="ti-form-input !bg-input-readonly" readonly
[(ngModel)]="configPermission.select.edesc">
</div>
</div>
</div>
</div>
<div class="page px-rem border-t border-gray-200 py-5">
<ng-container *ngFor="let menuBody of configPermission.select.menuBody; let i=index; let f = first">
<div class="flex" [class.mt-1rem]="!f">
<input type="checkbox" class="ti-form-checkbox align-self-center mr-10px cursor-pointer"
[id]="'checkbox'+menuBody.path+menuBody.title" [(ngModel)]="menuBody.show">
<label (click)="toggleMenuItemsShow(menuBody.path)" class="text-xl cursor-pointer user-select-none">
{{menuBody.title}}
</label>
<i [class.ti-chevron-down]="menuItemsShow.get(menuBody.path+menuBody.title)"
[class.ti-chevron-up]="!menuItemsShow.get(menuBody.path+menuBody.title)"
class="ti cursor-pointer i-gray fs-l px-1 align-self-center"
(click)="toggleMenuItemsShow(menuBody.path+menuBody.title)"></i>
</div>
<ng-container *ngIf="menuItemsShow.get(menuBody.path+menuBody.title)">
<div class="ml-5rem flex" *ngFor="let children of menuBody.children; let i=index">
<input type="checkbox" class="ti-form-checkbox align-self-center mr-10px cursor-pointer"
[id]="'checkbox'+children.path+children.title" [(ngModel)]="children.show">
<label class="text-xl user-select-none">
{{children.title}}
</label>
</div>
</ng-container>
</ng-container>
</div>
<div id="role-permission-config-set-menu-alert-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center">
<div class="max-h-full overflow-hidden ti-modal-content w-full">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
แจ้งเตือน
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#role-permission-config-set-menu-alert-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body ">
<p class="mt-1 text-gray-800 dark:text-white/70">
ยืนยันการบันทึกข้อมูลหรือไม่!
<ng-container *ngIf="configPermission.select.userLevel == user_level">
(หน้าจอจะรีโหลดและอัปเดตข้อมูลเมนูใหม่)
</ng-container>
</p>
<div class="flex justify-end mt-2rem mb-1rem">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#role-permission-config-set-menu-alert-modal">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);"
data-hs-overlay="#role-permission-config-set-menu-alert-modal"
(click)="updateConfigPermission('post')">
บันทึกข้อมูล
</a>
</div>
</div>
</div>
</div>
</div>
</ng-template>
\ No newline at end of file
src/app/components/company-components/account-settings/role-permission-config/role-permission-config.component.ts 0 → 100644
import { ChangeDetectorRef, Component } from '@angular/core';
import { ConfigService } from '@ks89/angular-modal-gallery/lib/services/config.service';
import { ToastrService } from 'ngx-toastr';
import { ConfigPermissionModel, MenuBodyModel, MyConfigPermissionModel, MyMenuBodyModel } from 'src/app/shared/model/config-permission.model';
import { ConfigPermissionService } from 'src/app/shared/services/config-permission.service';
import { NavService } from 'src/app/shared/services/navservice';
@Component({
selector: 'app-role-permission-config',
templateUrl: './role-permission-config.component.html',
styleUrls: ['./role-permission-config.component.scss']
})
export class RolePermissionConfigComponent {
pathTitle = ['การจัดการข้อมูลองค์กร', 'ทะเบียนกำหนดสิทธิการเข้าใช้งาน']
pageSize = 10
currentPage = 1
page = Array.from({ length: 1 }, (_, i) => i + 1);
search = ""
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
currentModal: 'add' | 'edit' | 'delete' | 'updateMenu' = "add"
setMenuPage = false
configPermission: { loading: boolean, select: ConfigPermissionModel, dataList: { check: boolean, data: ConfigPermissionModel }[] } = { loading: false, select: new MyConfigPermissionModel(), dataList: [] }
menuItems: MenuBodyModel[] = []
menuItemsShow: Map<string, boolean> = new Map();
companyId = ""
user_level = ""
constructor(private toastr: ToastrService,
private cdr: ChangeDetectorRef,
private navServices: NavService,
private configPermissionService: ConfigPermissionService) {
this.navServices.items.subscribe((items) => {
this.menuItems = items.map(x => new MyMenuBodyModel(x as any))
});
this.companyId = this.decodeJWT(sessionStorage.getItem("accessToken") || '').companyid
this.user_level = this.decodeJWT(sessionStorage.getItem("accessToken") || '').user_level
}
ngOnInit(): void {
this.getConfigList()
}
decodeJWT(token: string) {
let base64Url = token.split('.')[1]; // ดึงส่วนที่เป็น Payload
let base64 = base64Url.replace('-', '+').replace('_', '/'); // แก้ไข base64 ให้ถูกต้อง
let jsonPayload = decodeURIComponent(atob(base64).split('').map(function (c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
return JSON.parse(jsonPayload);
}
getConfigList() {
this.configPermission.loading = true
this.configPermission.dataList = []
this.configPermissionService.getList().subscribe({
next: response => {
this.configPermission.dataList = response.map(x => ({ check: false, data: new MyConfigPermissionModel(x) }))
this.configPermission.loading = false
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.searchChange()
if (this.currentModal == 'updateMenu' && (this.configPermission.select.userLevel == this.user_level)) {
window.location.reload();
}
this.cdr.detectChanges()
}, error: error => {
this.configPermission.loading = false
this.cdr.detectChanges()
}
})
}
configPermissionListFilter() {
return this.configPermission.dataList.filter(x => {
const data = x.data
return data.userLevel.toLowerCase().includes(this.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.search.toLowerCase())
})
}
selectConfigPermission(data?: ConfigPermissionModel) {
this.configPermission.select = new MyConfigPermissionModel(data)
const menuBody: MenuBodyModel[] = JSON.parse(JSON.stringify(this.configPermission.select.menuBody))
this.configPermission.select.menuBody = this.menuItems.map(x => new MyMenuBodyModel(x))
this.clearDataMenu()
this.configPermission.select.menuBody.forEach(x => {
const configMenu = menuBody.find(y => (y.path + y.title) == ((x.path || '') + x.title))
if (configMenu) {
x.show = configMenu.show
x.children?.forEach(y => {
const configChildren = configMenu.children.find(z => (z.path + z.title) == ((y.path || '') + y.title))
if (configChildren) {
y.show = configChildren.show
}
})
}
})
this.configPermission.select.menuBody.forEach(x => {
this.menuItemsShow.set(x.path + x.title, true)
})
this.cdr.detectChanges()
}
toggleMenuItemsShow(key: string) {
const currentValue = this.menuItemsShow.get(key) || false;
this.menuItemsShow.set(key, !currentValue);
this.cdr.detectChanges()
}
searchChange() {
this.currentPage = 1
this.page = Array.from({ length: Math.ceil(this.configPermissionListFilter().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
}
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.configPermissionListFilter().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.configPermissionListFilter();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.configPermission.dataList.filter(x => x.check).length;
this.isDataListChecked = Boolean(this.numDataListChecked)
}
clearData() {
if (this.currentModal == 'add') {
this.selectConfigPermission()
} else {
this.selectConfigPermission(new MyConfigPermissionModel({ userLevel: this.configPermission.select.userLevel }))
}
}
updateConfigPermission(typeApi: 'post' | 'delete') {
this.configPermission.loading = true
let postBody: ConfigPermissionModel = new MyConfigPermissionModel()
let deleteBody: ConfigPermissionModel[] = []
switch (this.currentModal) {
case ('delete'): {
deleteBody = this.configPermission.dataList.filter(x => x.check).map(x => new MyConfigPermissionModel(x.data))
break;
}
default: {
postBody = new MyConfigPermissionModel(this.configPermission.select)
}
}
const api = {
post: this.configPermissionService.post(postBody),
delete: this.configPermissionService.delete(deleteBody)
}
api[typeApi].subscribe({
next: response => {
if (response.success) {
this.showAlert(response.message, 'success')
this.getConfigList()
} else {
this.showAlert(response.message, 'error')
this.configPermission.loading = false
}
this.cdr.detectChanges()
}, error: error => {
this.showAlert(error.message, 'error')
this.configPermission.loading = false
this.cdr.detectChanges()
}
})
}
showAlert(text: string, type: 'success' | 'error') {
this.toastr[type](text, 'แจ้งเตือน', {
timeOut: 3000,
positionClass: 'toast-top-right',
})
}
clearDataMenu() {
this.configPermission.select.menuBody.forEach(x => {
x.show = true
x.children?.forEach(y => {
y.show = false
})
this.cdr.detectChanges()
})
}
}
src/app/components/dashboard/dashboard-routing.module.ts
...@@ -42,6 +42,7 @@ import { IdpEvalutionComponent } from '../performance-evaluation/idp-evaluation/ ...@@ -42,6 +42,7 @@ import { IdpEvalutionComponent } from '../performance-evaluation/idp-evaluation/
import { PmsGradeRegistrationComponent } from '../performance-management-evaluation/pms-grade-registration/pms-pms-grade-registration.component'; import { PmsGradeRegistrationComponent } from '../performance-management-evaluation/pms-grade-registration/pms-pms-grade-registration.component';
import { DayTypeRegistryComponent } from '../company-components/day-type-registry/day-type-registry.component'; import { DayTypeRegistryComponent } from '../company-components/day-type-registry/day-type-registry.component';
import { TimeAttendanceComponent } from '../performance-management-evaluation/time-attendance/time-attendance.component'; import { TimeAttendanceComponent } from '../performance-management-evaluation/time-attendance/time-attendance.component';
import { RolePermissionConfigComponent } from '../company-components/account-settings/role-permission-config/role-permission-config.component';
...@@ -91,7 +92,8 @@ const routes: Routes = [ ...@@ -91,7 +92,8 @@ const routes: Routes = [
{ path: "setting-performance-evalution", title: 'การตั้งค่า', component: SettingPerformanceEvalutionComponent }, { path: "setting-performance-evalution", title: 'การตั้งค่า', component: SettingPerformanceEvalutionComponent },
{ path: "self-evaluation", title: 'ประเมินตนเอง', component: SelfEvaluationComponent }, { path: "self-evaluation", title: 'ประเมินตนเอง', component: SelfEvaluationComponent },
{ path: "day-type-registry", title: 'ประเมินตนเอง', component: DayTypeRegistryComponent }, { path: "day-type-registry", title: 'ประเมินตนเอง', component: DayTypeRegistryComponent },
{ path: "time-attendance", title: 'ทะเบียนการประเมินเวลาทำงาน', component: TimeAttendanceComponent } { path: "time-attendance", title: 'ทะเบียนการประเมินเวลาทำงาน', component: TimeAttendanceComponent },
{ path: "role-permission-config", title: 'ทะเบียนกำหนดสิทธิการเข้าใช้งาน', component: RolePermissionConfigComponent },
] ]
} }
]; ];
......
src/app/components/dashboard/dashboard.module.ts
...@@ -160,6 +160,8 @@ import { PmsWorkingTimeService } from 'src/app/shared/services/pms-working-time. ...@@ -160,6 +160,8 @@ import { PmsWorkingTimeService } from 'src/app/shared/services/pms-working-time.
import { EvaluationIdpService } from 'src/app/shared/services/evaluation-Idp.service'; import { EvaluationIdpService } from 'src/app/shared/services/evaluation-Idp.service';
import { EmpStatusService } from 'src/app/shared/services/emp-status.service'; import { EmpStatusService } from 'src/app/shared/services/emp-status.service';
import { PaginationComponent } from '../pagination/pagination.component'; import { PaginationComponent } from '../pagination/pagination.component';
import { RolePermissionConfigComponent } from '../company-components/account-settings/role-permission-config/role-permission-config.component';
import { ConfigPermissionService } from 'src/app/shared/services/config-permission.service';
export const MY_DATE_FORMATS = { export const MY_DATE_FORMATS = {
...@@ -286,7 +288,8 @@ export class CustomDateAdapter extends NativeDateAdapter { ...@@ -286,7 +288,8 @@ export class CustomDateAdapter extends NativeDateAdapter {
PmsSubGradeRegistrationComponent, PmsSubGradeRegistrationComponent,
DayTypeRegistryComponent, DayTypeRegistryComponent,
TimeAttendanceComponent, TimeAttendanceComponent,
PaginationComponent PaginationComponent,
RolePermissionConfigComponent,
], ],
imports: [ imports: [
CommonModule, CommonModule,
...@@ -351,6 +354,7 @@ export class CustomDateAdapter extends NativeDateAdapter { ...@@ -351,6 +354,7 @@ export class CustomDateAdapter extends NativeDateAdapter {
PmsWorkingTimeService, PmsWorkingTimeService,
EvaluationIdpService, EvaluationIdpService,
EmpStatusService, EmpStatusService,
ConfigPermissionService,
{ {
provide: HTTP_INTERCEPTORS, provide: HTTP_INTERCEPTORS,
useClass: HttpRequestInterceptor, useClass: HttpRequestInterceptor,
......
src/app/shared/components/sidebar/sidebar.component.html
<!-- Start::app-sidebar --> <!-- Start::app-sidebar -->
<aside class="app-sidebar" [ngClass]="{ 'sticky-pin': scrolled }" id="sidebar" style="padding-top: 0;border-width: 0;"> <aside class="app-sidebar" [ngClass]="{ 'sticky-pin': scrolled }" id="sidebar" style="padding-top: 0;border-width: 0;">
<!-- Start::main-sidebar-header --> <!-- Start::main-sidebar-header -->
<div class="main-sidebar-header" style="background-color: white;padding-top: 0px;padding-bottom: 0px;padding-left: 5px;padding-right: 5px;"> <div class="main-sidebar-header"
style="background-color: white;padding-top: 0px;padding-bottom: 0px;padding-left: 5px;padding-right: 5px;">
<a routerLink="/dashboard/sales" class="header-logo"> <a routerLink="/dashboard/sales" class="header-logo">
<img src="./assets/img/brand-logos/mySkill-x.png" alt="logo" class="main-logo desktop-logo" <img src="./assets/img/brand-logos/mySkill-x.png" alt="logo" class="main-logo desktop-logo"
style="height: 100%;object-fit: contain;" /> style="height: 100%;object-fit: contain;" />
...@@ -28,7 +29,7 @@ ...@@ -28,7 +29,7 @@
<ul class="main-menu"> <ul class="main-menu">
<!-- 1st Level Menu --> <!-- 1st Level Menu -->
<ng-container *ngFor="let menuItem of menuItems"> <ng-container *ngFor="let menuItem of menuItems">
<li class="slide" #activeMenuItems [ngClass]="{'slide__category':menuItem.headTitle, <li *ngIf="menuItem.show" class="slide" #activeMenuItems [ngClass]="{'slide__category':menuItem.headTitle,
'slide has-sub':menuItem.title, 'slide has-sub':menuItem.title,
'open': menuItem.active, 'open': menuItem.active,
'active': menuItem.selected,}"> 'active': menuItem.selected,}">
...@@ -47,7 +48,7 @@ ...@@ -47,7 +48,7 @@
<span class="side-menu__label">{{menuItem.title}}</span> <span class="side-menu__label">{{menuItem.title}}</span>
</a> </a>
<!-- has-Sub --> <!-- has-Sub -->
<a class="side-menu__item with-sub" [routerLink]="menuItem.type ? null: [menuItem.path]" <a class="side-menu__item with-sub cursor-pointer" [routerLink]="menuItem.type ? null: [menuItem.path]"
[ngClass]="{active: menuItem.selected}" *ngIf="menuItem.type === 'sub'" [ngClass]="{active: menuItem.selected}" *ngIf="menuItem.type === 'sub'"
(click)="toggleNavActive(menuItem)"> (click)="toggleNavActive(menuItem)">
<i *ngIf="menuItem.icon" class="side-menu__icon demoicon ri-{{menuItem.icon}}"></i> <i *ngIf="menuItem.icon" class="side-menu__icon demoicon ri-{{menuItem.icon}}"></i>
...@@ -64,21 +65,22 @@ ...@@ -64,21 +65,22 @@
[ngStyle]="{ display: menuItem.active ? 'block' : 'none' }"> [ngStyle]="{ display: menuItem.active ? 'block' : 'none' }">
<li class="slide side-menu__label1"><a href="javascript:void(0)">{{menuItem.title}}</a></li> <li class="slide side-menu__label1"><a href="javascript:void(0)">{{menuItem.title}}</a></li>
<ng-container *ngFor="let childrenItem of menuItem.children"> <ng-container *ngFor="let childrenItem of menuItem.children">
<li class="slide" activeMenuItems <li *ngIf="childrenItem.show" class="slide" activeMenuItems
[ngClass]="{'is-expanded': childrenItem.active, active: childrenItem.active, 'sub-slide': childrenItem.type === 'sub'}"> [ngClass]="{'is-expanded': childrenItem.active, active: childrenItem.active, 'sub-slide': childrenItem.type === 'sub'}">
<!-- link --> <!-- link -->
<a class="side-menu__item" [routerLink]="!childrenItem.type ? null : [childrenItem.path] " <a class="side-menu__item !white-space-normal"
routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" [routerLink]="!childrenItem.type ? null : [childrenItem.path] " routerLinkActive="active"
*ngIf="childrenItem.type === 'link'" (click)="setNavActive(childrenItem)"> [routerLinkActiveOptions]="{exact: true}" *ngIf="childrenItem.type === 'link'"
(click)="setNavActive(childrenItem)">
{{childrenItem.title}} {{childrenItem.title}}
</a> </a>
<!-- empty --> <!-- empty -->
<a class="side-menu__item" href="javascript:;" *ngIf="childrenItem.type === 'empty' " <a class="side-menu__item !white-space-normal" href="javascript:;"
(click)="setNavActive(childrenItem)"> *ngIf="childrenItem.type === 'empty' " (click)="setNavActive(childrenItem)">
{{childrenItem.title }} {{childrenItem.title }}
</a> </a>
<!-- sub --> <!-- sub -->
<a class="side-menu__item" [ngClass]="{active: childrenItem.selected}" <a class="side-menu__item !white-space-normal" [ngClass]="{active: childrenItem.selected}"
[routerLink]="childrenItem.type ? null : [childrenItem.path]" *ngIf="childrenItem.type === 'sub'" [routerLink]="childrenItem.type ? null : [childrenItem.path]" *ngIf="childrenItem.type === 'sub'"
(click)="toggleNavActive(childrenItem)"> (click)="toggleNavActive(childrenItem)">
<span class="">{{childrenItem.title}}</span> <span class="">{{childrenItem.title}}</span>
......
src/app/shared/components/sidebar/sidebar.component.ts
import { Component, ViewChild, ElementRef, Renderer2, HostListener } from '@angular/core'; import { Component, ViewChild, ElementRef, Renderer2, HostListener, ChangeDetectorRef } from '@angular/core';
import { Menu, NavService } from '../../services/navservice'; import { Menu, NavService } from '../../services/navservice';
import { Subscription, fromEvent } from 'rxjs'; import { Subscription, fromEvent } from 'rxjs';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser'; import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
import { NavigationEnd, Router } from '@angular/router'; import { NavigationEnd, Router } from '@angular/router';
import { checkHoriMenu, switcherArrowFn } from './sidebar'; import { checkHoriMenu, switcherArrowFn } from './sidebar';
import { ConfigPermissionService } from '../../services/config-permission.service';
import { ConfigPermissionModel, MenuBodyModel, MyConfigPermissionModel } from '../../model/config-permission.model';
@Component({ @Component({
selector: 'app-sidebar', selector: 'app-sidebar',
...@@ -58,31 +60,36 @@ export class SidebarComponent { ...@@ -58,31 +60,36 @@ export class SidebarComponent {
options = { autoHide: false, scrollbarMinSize: 100 }; options = { autoHide: false, scrollbarMinSize: 100 };
icon!: SafeHtml; icon!: SafeHtml;
public menuItems!: Menu[]; public menuItems: Menu[] = [];
public menuitemsSubscribe$!: Subscription; public menuitemsSubscribe$!: Subscription;
user_level = ""
configPermission: { loading: boolean, data: ConfigPermissionModel } = { loading: false, data: new MyConfigPermissionModel() }
constructor( constructor(
private navServices: NavService, private navServices: NavService,
private sanitizer: DomSanitizer, private sanitizer: DomSanitizer,
public router: Router, public router: Router,
public renderer: Renderer2, public renderer: Renderer2,
private elementRef: ElementRef private elementRef: ElementRef,
private configPermissionService: ConfigPermissionService,
private cdr: ChangeDetectorRef,
) { ) {
this.screenWidth = window.innerWidth; this.screenWidth = window.innerWidth;
this.user_level = this.decodeJWT(sessionStorage.getItem("accessToken") || '').user_level
} }
ngOnInit() { ngOnInit() {
this.menuitemsSubscribe$ = this.navServices.items.subscribe((items) => { this.menuitemsSubscribe$ = this.navServices.items.subscribe((items) => {
this.menuItems = items; this.menuItems = items;
}); });
this.getConfigPermissionByUserLevel()
this.ParentActive(); this.ParentActive();
this.router.events.subscribe((event) => { this.router.events.subscribe((event) => {
if (event instanceof NavigationEnd) { if (event instanceof NavigationEnd) {
this.ParentActive(); this.ParentActive();
} }
}); });
if(window.innerWidth <= 992){ if (window.innerWidth <= 992) {
document.documentElement?.setAttribute('toggled', 'close'); document.documentElement?.setAttribute('toggled', 'close');
} }
const WindowResize = fromEvent(window, 'resize'); const WindowResize = fromEvent(window, 'resize');
...@@ -98,11 +105,68 @@ export class SidebarComponent { ...@@ -98,11 +105,68 @@ export class SidebarComponent {
if (document.documentElement.getAttribute('data-nav-layout') == 'horizontal' && window.innerWidth > 992) { if (document.documentElement.getAttribute('data-nav-layout') == 'horizontal' && window.innerWidth > 992) {
this.closeNavActive() this.closeNavActive()
} }
}
public getConfigPermissionByUserLevel() {
this.configPermission.loading = true
this.configPermissionService.getByUserLevel(this.user_level).subscribe({
next: response => {
this.configPermission.data = new MyConfigPermissionModel(response)
this.menuItems.forEach(x => {
// เปิดทุกเมนู
// x.show = true
// x.children?.forEach(y => {
// y.show = true
// })
// เปิดตาม config
const configMenu = this.configPermission.data.menuBody.find(y => (y.path + y.title) == ((x.path || '') + x.title))
if (configMenu) {
x.show = configMenu.show
x.children?.forEach(y => {
const configChildren = configMenu.children.find(z => (z.path + z.title) == ((y.path || '') + y.title))
if (configChildren) {
y.show = configChildren.show
}
})
}
})
let path404check = '/404page'
this.menuItems.forEach(x => {
if (x.show && path404check == '/404page') {
x.children?.forEach(y => {
if (y.show) {
path404check = y.path || '404page'
}
})
}
})
this.router.navigate([path404check]);
this.configPermission.loading = false
this.cdr.detectChanges()
}, error: error => {
this.configPermission.loading = false
this.cdr.detectChanges()
}
})
}
decodeJWT(token: string) {
let base64Url = token.split('.')[1]; // ดึงส่วนที่เป็น Payload
let base64 = base64Url.replace('-', '+').replace('_', '/'); // แก้ไข base64 ให้ถูกต้อง
let jsonPayload = decodeURIComponent(atob(base64).split('').map(function (c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
return JSON.parse(jsonPayload);
} }
//Active Nav State //Active Nav State
setNavActive(item: any) { setNavActive(item: any) {
this.menuItems?.filter((menuItem) => { this.menuItems?.filter((menuItem: Menu) => {
if (menuItem !== item) { if (menuItem !== item) {
menuItem.active = false; menuItem.active = false;
this.navServices.collapseSidebar = false; this.navServices.collapseSidebar = false;
...@@ -241,7 +305,7 @@ export class SidebarComponent { ...@@ -241,7 +305,7 @@ export class SidebarComponent {
if (!this.eventTriggered && this.screenWidth <= 992) { if (!this.eventTriggered && this.screenWidth <= 992) {
document.documentElement?.setAttribute('toggled', 'close') document.documentElement?.setAttribute('toggled', 'close')
// Trigger your event or perform any action here // Trigger your event or perform any action here
this.eventTriggered = true; // Set the flag to true to prevent further triggering this.eventTriggered = true; // Set the flag to true to prevent further triggering
} else if (this.screenWidth > 992) { } else if (this.screenWidth > 992) {
......
src/app/shared/model/config-permission.model.ts 0 → 100644
export interface ConfigPermissionModel {
userLevel: string
tdesc: string
edesc: string
companyId: string
menuBody: MenuBodyModel[]
}
export class MyConfigPermissionModel implements ConfigPermissionModel {
userLevel: string
tdesc: string
edesc: string
companyId: string
menuBody: MenuBodyModel[]
constructor(data?: Partial<ConfigPermissionModel>) {
this.userLevel = data?.userLevel || ""
this.tdesc = data?.tdesc || ""
this.edesc = data?.edesc || ""
this.companyId = data?.companyId || ""
this.menuBody = data?.menuBody?.map(x => new MyMenuBodyModel(x)) || []
}
}
export interface MenuBodyModel {
path: string
show: boolean
type: string
title: string
active: boolean
children: {
path: string
show: boolean
type: string
title: string
}[]
selected: boolean
headTitle?: string;
headTitle2?: string;
icon?: string;
badgeValue?: string;
badgeClass?: string;
bookmark?: boolean;
children2?: {
path: string
show: boolean
type: string
title: string
}[];
Menusub?: boolean;
target?: boolean;
}
export class MyMenuBodyModel implements MenuBodyModel {
path: string
show: boolean
type: string
title: string
active: boolean
children: {
path: string
show: boolean
type: string
title: string
}[]
selected: boolean
headTitle?: string;
headTitle2?: string;
icon?: string;
badgeValue?: string;
badgeClass?: string;
bookmark?: boolean;
children2?: {
path: string
show: boolean
type: string
title: string
}[];
Menusub?: boolean;
target?: boolean;
constructor(data?: Partial<MenuBodyModel>) {
this.path = data?.path || ''
this.show = data?.show ?? false
this.type = data?.type || ""
this.title = data?.title || ""
this.active = data?.active ?? false
this.children = data?.children?.map(x => ({
path: x.path || '',
show: x.show ?? false,
type: x.type || '',
title: x.title || ''
})) || []
this.selected = data?.selected ?? false
// this.headTitle = data?.headTitle || ""
// this.headTitle2 = data?.headTitle2 || ""
// this.icon = data?.icon || ""
// this.badgeValue = data?.badgeValue || ""
// this.badgeClass = data?.badgeClass || ""
// this.bookmark = data?.bookmark ?? false
// this.children2 = data?.children2?.map(x => ({
// path: x.path || '',
// show: x.show ?? false,
// type: x.type || '',
// title: x.title || ''
// })) || []
// this.Menusub = data?.Menusub ?? false
// this.target = data?.target ?? false
}
}
src/app/shared/services/config-permission.service.ts 0 → 100644
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { environment } from 'src/environments/environment';
import { AlertModel } from '../model/alert.model';
import { ConfigPermissionModel } from '../model/config-permission.model';
@Injectable({
providedIn: 'root'
})
export class ConfigPermissionService {
api = "/config"
urlApi = environment.baseUrl + this.api
constructor(private http: HttpClient) {
}
getByUserLevel(userLevel: string): Observable<ConfigPermissionModel> {
return this.http.get<ConfigPermissionModel>(this.urlApi + "/permission-view-screen/" + userLevel)
}
getList(): Observable<ConfigPermissionModel[]> {
return this.http.get<ConfigPermissionModel[]>(this.urlApi + "/permission-view-screen/lists")
}
post(body: ConfigPermissionModel): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi + '/permission-view-screen', body)
}
delete(body: ConfigPermissionModel[]): Observable<AlertModel> {
const options = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
};
return this.http.delete<AlertModel>(this.urlApi + "/permission-view-screen", options)
}
}
\ No newline at end of file
src/app/shared/services/navservice.ts
...@@ -2,6 +2,7 @@ import { Injectable, OnDestroy } from '@angular/core'; ...@@ -2,6 +2,7 @@ import { Injectable, OnDestroy } from '@angular/core';
import { Subject, BehaviorSubject, fromEvent } from 'rxjs'; import { Subject, BehaviorSubject, fromEvent } from 'rxjs';
import { takeUntil, debounceTime } from 'rxjs/operators'; import { takeUntil, debounceTime } from 'rxjs/operators';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { MenuBodyModel, MyMenuBodyModel } from '../model/config-permission.model';
// Menu // Menu
export interface Menu { export interface Menu {
headTitle?: string; headTitle?: string;
...@@ -19,6 +20,7 @@ export interface Menu { ...@@ -19,6 +20,7 @@ export interface Menu {
children2?: Menu[]; children2?: Menu[];
Menusub?: boolean; Menusub?: boolean;
target?: boolean; target?: boolean;
show?: boolean
} }
@Injectable({ @Injectable({
...@@ -91,10 +93,11 @@ export class NavService implements OnDestroy { ...@@ -91,10 +93,11 @@ export class NavService implements OnDestroy {
type: 'sub', type: 'sub',
selected: false, selected: false,
active: false, active: false,
path: '/supervisor-evaluation', path: '',
show: false,
children: [ children: [
{ path: '/self-evaluation', title: 'ประเมินตนเอง', type: 'link' }, { path: '/self-evaluation', title: 'ประเมินตนเอง', type: 'link', show: false },
{ path: '/supervisor-evaluation', title: 'ประเมินโดยหัวหน้า', type: 'link' }, { path: '/supervisor-evaluation', title: 'ประเมินโดยหัวหน้า', type: 'link', show: false },
], ],
}, },
{ {
...@@ -102,12 +105,15 @@ export class NavService implements OnDestroy { ...@@ -102,12 +105,15 @@ export class NavService implements OnDestroy {
type: 'sub', type: 'sub',
selected: false, selected: false,
active: false, active: false,
path: '',
show: false,
children: [ children: [
{ path: '/company-registration', title: 'ทะเบียนบริษัท', type: 'link' }, { path: '/company-registration', title: 'ทะเบียนบริษัท', type: 'link', show: false },
{ path: '/job-description', title: 'ข้อมูลลักษณะงาน', type: 'link' }, { path: '/job-description', title: 'ข้อมูลลักษณะงาน', type: 'link', show: false },
{ path: '/employee-registration', title: 'ทะเบียนพนักงาน', type: 'link' }, { path: '/employee-registration', title: 'ทะเบียนพนักงาน', type: 'link', show: false },
{ path: '/day-type-registry', title: 'ทะเบียนประเภทวัน', type: 'link' }, { path: '/day-type-registry', title: 'ทะเบียนประเภทวัน', type: 'link', show: false },
{ path: '/account-settings', title: 'ตั้งค่าชื่อผู้ใช้', type: 'link' }, { path: '/account-settings', title: 'ตั้งค่าชื่อผู้ใช้', type: 'link', show: false },
{ path: '/role-permission-config', title: 'ทะเบียนกำหนดสิทธิการเข้าใช้งาน', type: 'link', show: false },
], ],
}, },
{ {
...@@ -115,13 +121,15 @@ export class NavService implements OnDestroy { ...@@ -115,13 +121,15 @@ export class NavService implements OnDestroy {
type: 'sub', type: 'sub',
selected: false, selected: false,
active: false, active: false,
path: '',
show: false,
children: [ children: [
{ path: '/job-detail-management', title: 'ข้อมูลทั่วไป', type: 'link' }, { path: '/job-detail-management', title: 'ข้อมูลทั่วไป', type: 'link', show: false },
{ path: '/command-structure', title: 'โครงสร้างสายการบังคับบัญชา', type: 'link' }, { path: '/command-structure', title: 'โครงสร้างสายการบังคับบัญชา', type: 'link', show: false },
{ path: '/job-detail', title: 'รายละเอียดของงาน', type: 'link' }, { path: '/job-detail', title: 'รายละเอียดของงาน', type: 'link', show: false },
{ path: '/job-qualifications', title: 'คุณสมบัติที่จำเป็น', type: 'link' }, { path: '/job-qualifications', title: 'คุณสมบัติที่จำเป็น', type: 'link', show: false },
{ path: '/job-competency', title: 'ความสามารถในตำเเหน่งงาน', type: 'link' }, { path: '/job-competency', title: 'ความสามารถในตำเเหน่งงาน', type: 'link', show: false },
{ path: '/job-position-indicators', title: 'ตัวชี้วัดของตำแหน่งงาน', type: 'link' }, { path: '/job-position-indicators', title: 'ตัวชี้วัดของตำแหน่งงาน', type: 'link', show: false },
], ],
}, },
...@@ -130,16 +138,17 @@ export class NavService implements OnDestroy { ...@@ -130,16 +138,17 @@ export class NavService implements OnDestroy {
type: 'sub', type: 'sub',
selected: false, selected: false,
active: false, active: false,
path: '/name-registration', path: '',
show: false,
children: [ children: [
{ path: '/name-registration', title: 'ทะเบียนกำหนดชื่อ', type: 'link' }, { path: '/name-registration', title: 'ทะเบียนกำหนดชื่อ', type: 'link', show: false },
{ path: '/grade-registration', title: 'ทะเบียนเกรด', type: 'link' }, { path: '/grade-registration', title: 'ทะเบียนเกรด', type: 'link', show: false },
{ path: '/tool-register', title: 'ทะเบียนเครื่องมือ', type: 'link' }, { path: '/tool-register', title: 'ทะเบียนเครื่องมือ', type: 'link', show: false },
{ path: '/course-registration', title: 'ทะเบียนหลักสูตร', type: 'link' }, { path: '/course-registration', title: 'ทะเบียนหลักสูตร', type: 'link', show: false },
{ path: '/idp-development-plan', title: 'แผนพัฒนา IDP', type: 'link' }, { path: '/idp-development-plan', title: 'แผนพัฒนา IDP', type: 'link', show: false },
{ path: '/competency-management', title: 'การจัดการสมรรถนะ', type: 'link' }, { path: '/competency-management', title: 'การจัดการสมรรถนะ', type: 'link', show: false },
{ path: '/evaluation-cycle-manager', title: 'การจัดการรอบการประเมิน', type: 'link' }, { path: '/evaluation-cycle-manager', title: 'การจัดการรอบการประเมิน', type: 'link', show: false },
{ path: '/setting-competency', title: 'การตั้งค่า', type: 'link' } { path: '/setting-competency', title: 'การตั้งค่า', type: 'link', show: false }
], ],
}, },
{ {
...@@ -147,19 +156,18 @@ export class NavService implements OnDestroy { ...@@ -147,19 +156,18 @@ export class NavService implements OnDestroy {
type: 'sub', type: 'sub',
selected: false, selected: false,
active: false, active: false,
path: '/name-registration-perfomance', path: '',
show: false,
children: [ children: [
{ path: '/name-registration-perfomance', title: 'ทะเบียนกำหนดชื่อ', type: 'link' }, { path: '/name-registration-perfomance', title: 'ทะเบียนกำหนดชื่อ', type: 'link', show: false },
{ path: '/grade-registration-sub', title: 'ทะเบียนเกรด', type: 'link' }, { path: '/grade-registration-sub', title: 'ทะเบียนเกรด', type: 'link', show: false },
{ path: '/time-attendance', title: 'ทะเบียนการประเมินเวลาทำงาน', type: 'link' }, { path: '/time-attendance', title: 'ทะเบียนการประเมินเวลาทำงาน', type: 'link', show: false },
{ path: '/evaluation-factors', title: 'ปัจจัยการประเมินผล', type: 'link' }, { path: '/evaluation-factors', title: 'ปัจจัยการประเมินผล', type: 'link', show: false },
{ path: '/assessment-management', title: 'การจัดการการประเมิน', type: 'link' }, { path: '/assessment-management', title: 'การจัดการการประเมิน', type: 'link', show: false },
{ path: '/evaluation-cycle-performance', title: 'รอบการประเมิน', type: 'link' }, { path: '/evaluation-cycle-performance', title: 'รอบการประเมิน', type: 'link', show: false },
{ path: '/setting-performance-evalution', title: 'การตั้งค่า', type: 'link' } { path: '/setting-performance-evalution', title: 'การตั้งค่า', type: 'link', show: false }
], ],
}, },
]; ];
// Array // Array
items = new BehaviorSubject<Menu[]>(this.MENUITEMS); items = new BehaviorSubject<Menu[]>(this.MENUITEMS);
......
src/app/shared/sharedmodule.ts
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { SidebarComponent } from './components/sidebar/sidebar.component'; import { SidebarComponent } from './components/sidebar/sidebar.component';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { FullLayoutComponent } from './layout-components/full-layout/full-layout.component'; import { FullLayoutComponent } from './layout-components/full-layout/full-layout.component';
import { HeaderComponent } from './components/header/header.component'; import { HeaderComponent } from './components/header/header.component';
import { SimplebarAngularModule } from 'simplebar-angular'; import { SimplebarAngularModule } from 'simplebar-angular';
...@@ -16,6 +16,9 @@ import { HoverEffectSidebarDirective } from './directives/hover-effect-sidebar.d ...@@ -16,6 +16,9 @@ import { HoverEffectSidebarDirective } from './directives/hover-effect-sidebar.d
import { SidemenuToggleDirective } from './directives/sidemenuToggle'; import { SidemenuToggleDirective } from './directives/sidemenuToggle';
import { AuthService } from './services/auth.service'; import { AuthService } from './services/auth.service';
import { ToggleThemeDirective } from './directives/toggle-theme.directive'; import { ToggleThemeDirective } from './directives/toggle-theme.directive';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { ConfigPermissionService } from './services/config-permission.service';
import { HttpRequestInterceptor } from './services/http-request.interceptor';
@NgModule({ @NgModule({
declarations: [ declarations: [
...@@ -48,6 +51,13 @@ import { ToggleThemeDirective } from './directives/toggle-theme.directive'; ...@@ -48,6 +51,13 @@ import { ToggleThemeDirective } from './directives/toggle-theme.directive';
FooterComponent, FooterComponent,
SidemenuToggleDirective, SidemenuToggleDirective,
], ],
providers: [AuthService], providers: [AuthService,
ConfigPermissionService,
{
provide: HTTP_INTERCEPTORS,
useClass: HttpRequestInterceptor,
multi: true,
},
],
}) })
export class SharedModule {} export class SharedModule { }
src/assets/css/style.css
...@@ -25008,4 +25008,12 @@ div:where(.swal2-container) div:where(.swal2-validation-message) { ...@@ -25008,4 +25008,12 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
} }
\!.bg-white { \!.bg-white {
background-color: white !important; background-color: white !important;
}
.align-self-center{
align-self: center
}
.user-select-none{
user-select: none;
} }
\ 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