Skip to content

M
myAppraisal
Commit 90670dcd by Nattana Chaiyamat
Options

Merge branch 'DEV' of https://mygit.myhr.co.th/angular/myAppraisal into DEV 

# Conflicts:
#	src/app/components/company-registration/branch-business-unit/department-register/department-register.component.html
parents 67e6377e 4d8342ef
Showing with 538 additions and 185 deletions
src/app/components/account-settings/account-settings.component.html
......@@ -2,10 +2,10 @@
<div class="bg-card-white">
</div>
<div class="block-main-content">
<div class="head-title">
ตั้งค่าชื่อผู้ใช้งาน
<div>
<p class="text-xxl font-bold py-2 px-4 text-primary ltr:ml-5" style="margin-bottom: 15px;">ตั้งค่าผู้ใช้งาน</p>
</div>
<div class="body-content">
<div class="body-content" style="margin-left: 10px;">
<ul class="nav-tabs">
<li class="nav-item" *ngFor="let item of [{id:'tab1',text:'สร้างชื่อผู้ใช้งาน'},
{id:'tab2',text:'กำหนดรหัสผ่าน'},
......
src/app/components/account-settings/set-a-password/set-a-password.component.scss
.button-clear {
position: absolute;
top: 96px;
z-index: 1;
right: 41vw;
}
.button-help {
position: absolute;
top: 0;
right: 0; /* ย้ายไปที่มุมขวาบน */
margin: 4.2rem; /* เพิ่มระยะห่างจากขอบบนและขวา */
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
/* สไตล์ของแถบเมนู */
.nav-tabs {
display: flex;
width: 100%;
cursor: pointer;
margin-bottom: 10px;
}
.nav-item {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link {
text-decoration: none;
padding: 10px 20px;
display: inline-block;
font-size: large;
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: #ccc;
border-radius: 5px 5px 0px 0px;
}
.nav-link:hover {
background-color: #f0f0f0; /* เปลี่ยนสีเมื่อ hover */
}
.nav-link.active {
color: #ffffff; /* สีตัวอักษรในสถานะ active */
font-size: large;
border-bottom: 3.5px solid rgb(var(--color-primary)); /* เส้นใต้ */
background-color: rgb(var(--color-primary));
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: rgb(var(--color-primary));
border-radius: 5px 5px 0px 0px;
}
.tab-content {
margin-top: 20px;
}
.tab-pane.active {
display: block;
}
.nav-item-text {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link-text {
text-decoration: none;
display: inline-block;
font-size: large;
color: #569bf5;
border-bottom: 2px solid #569bf5;
line-height: 0.8;
}
.ti-pagination .page-link.active {
background-color: #569bf5;
color: white;
border-radius: 50%;
padding: 8px 12px;
}
\ No newline at end of file
display: flex;
width: 100%;
cursor: pointer;
margin-bottom: 10px;
}
.nav-item {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link {
text-decoration: none;
padding: 10px 20px;
display: inline-block;
font-size: large;
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: #ccc;
border-radius: 5px 5px 0px 0px;
}
.nav-link:hover {
background-color: #f0f0f0; /* เปลี่ยนสีเมื่อ hover */
}
.nav-link.active {
color: #ffffff; /* สีตัวอักษรในสถานะ active */
font-size: large;
border-bottom: 3.5px solid rgb(var(--color-primary)); /* เส้นใต้ */
background-color: rgb(var(--color-primary));
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: rgb(var(--color-primary));
border-radius: 5px 5px 0px 0px;
}
.tab-content {
margin-top: 20px;
}
.tab-pane.active {
display: block;
}
.nav-item-text {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link-text {
text-decoration: none;
display: inline-block;
font-size: large;
color: #569bf5;
border-bottom: 2px solid #569bf5;
line-height: 0.8;
}
.ti-pagination .page-link.active {
background-color: #569bf5;
color: white;
border-radius: 50%;
padding: 8px 12px;
}
.box-body {
padding: 0rem;
}
.page{
min-height: 0vh;
}
.ti-modal-content {
width: 50%; /* ความกว้างที่คุณต้องการ */
height: 80%;
position: absolute; /* ทำให้สามารถจัดตำแหน่งได้ */
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
}
.ti-modal-body {
display: flex; /* ใช้ flexbox เพื่อจัดตำแหน่ง */
justify-content: center; /* จัดฟอร์มให้อยู่กลางในแนวนอน */
flex-direction: column; /* ทำให้ฟอร์มแสดงผลในรูปแบบคอลัมน์ */
height: calc(100% - 50px); /* ให้ความสูงเป็น 100% ลบด้วยระยะห่างข้างบน */
margin-left: 100px;
}
src/app/components/account-settings/set-a-password/set-a-password.component.ts
......@@ -15,4 +15,43 @@ export class SetAPasswordComponent {
this.sendPathTitle.emit(['การจัดการข้อมูลองค์กร', 'ตั้งค่าผู้ใช้งาน', tab.text])
this.activeTab = tab.id;
}
modalOptions: {
[nameModal: string]: { // ชื่อตรวจสอบการเปิดปิด
isModalOpen: boolean; // เปิด/ปิด
modalSize: string; // ขนาดของ Modal (s,m,l,vw10-vw100 )
backdropClose: boolean; // (คลิก Backdrop แล้ว true ปิด false ไม่ปิด )
}
} = {
"add": {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
},
"edit": {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
}
}
openModal(name: string, size: string, closeOnBackdrop?: boolean) {
this.modalOptions[name].modalSize = size;
this.modalOptions[name].backdropClose = closeOnBackdrop || false;
this.modalOptions[name].isModalOpen = true;
document.body.style.overflow = 'hidden'; // ล็อก Scroll
}
closeModal(name: string) {
this.modalOptions[name].isModalOpen = false;
// ตรวจสอบว่ามี Modal อื่นเปิดอยู่หรือไม่
if (!this.isAnyModalOpen()) {
document.body.style.overflow = ''; // คืนค่าการ Scroll เฉพาะเมื่อ Modal ทั้งหมดปิดแล้ว
}
}
isAnyModalOpen(): boolean {
// Logic ตรวจสอบว่า Modal อื่นยังเปิดอยู่หรือไม่
return Object.values(this.modalOptions).some(modal => modal.isModalOpen); // หากไม่มี Modal อื่นเปิด
}
}
src/app/components/account-settings/user-settings/user-settings.component.scss
.button-clear {
position: absolute;
top: 96px;
z-index: 1;
right: 41vw;
}
.button-help {
position: absolute;
top: 0px;
z-index: 1;
right: 0vw;
margin: 4.2rem;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
/* สไตล์ของแถบเมนู */
.nav-tabs {
display: flex;
width: 100%;
cursor: pointer;
margin-bottom: 10px;
}
.nav-item {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link {
text-decoration: none;
padding: 10px 20px;
display: inline-block;
font-size: large;
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: #ccc;
border-radius: 5px 5px 0px 0px;
}
.nav-link:hover {
background-color: #f0f0f0; /* เปลี่ยนสีเมื่อ hover */
}
.nav-link.active {
color: #ffffff; /* สีตัวอักษรในสถานะ active */
font-size: large;
border-bottom: 3.5px solid rgb(var(--color-primary)); /* เส้นใต้ */
background-color: rgb(var(--color-primary));
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: rgb(var(--color-primary));
border-radius: 5px 5px 0px 0px;
}
.tab-content {
margin-top: 20px;
}
.tab-pane.active {
display: block;
}
.nav-item-text {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link-text {
text-decoration: none;
display: inline-block;
font-size: large;
color: #569bf5;
border-bottom: 2px solid #569bf5;
line-height: 0.8;
}
.ti-pagination .page-link.active {
background-color: #569bf5;
color: white;
border-radius: 50%;
padding: 8px 12px;
display: flex;
width: 100%;
cursor: pointer;
margin-bottom: 10px;
height: 20%;
}
.nav-item {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link {
text-decoration: none;
padding: 10px 20px;
display: inline-block;
font-size: large;
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: #ccc;
border-radius: 5px 5px 0px 0px;
}
.nav-link:hover {
background-color: #f0f0f0; /* เปลี่ยนสีเมื่อ hover */
}
.nav-link.active {
color: #ffffff; /* สีตัวอักษรในสถานะ active */
font-size: large;
border-bottom: 3.5px solid rgb(var(--color-primary)); /* เส้นใต้ */
background-color: rgb(var(--color-primary));
border-width: 2px 2px 0px 2px;
border-style: solid;
border-color: rgb(var(--color-primary));
border-radius: 5px 5px 0px 0px;
}
.tab-content {
margin-top: 20px;
}
.tab-pane.active {
display: block;
}
.nav-item-text {
list-style: none;
margin-right: 10px; /* ช่องว่างระหว่างเมนู */
}
.nav-link-text {
text-decoration: none;
display: inline-block;
font-size: large;
color: #569bf5;
border-bottom: 2px solid #569bf5;
line-height: 0.8;
}
.ti-pagination .page-link.active {
background-color: #569bf5;
color: white;
border-radius: 50%;
padding: 8px 12px;
}
.box-body{
padding: 0rem;
}
.page{
min-height: 0vh;
}
.ti-modal-content{
width: 70%; /* ความกว้างที่คุณต้องการ */
position: absolute; /* ทำให้สามารถจัดตำแหน่งได้ */
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
}
.ti-modal-body {
display: flex; /* ใช้ flexbox เพื่อจัดตำแหน่ง */
justify-content: center; /* จัดฟอร์มให้อยู่กลางในแนวนอน */
flex-direction: column; /* ทำให้ฟอร์มแสดงผลในรูปแบบคอลัมน์ */
height: calc(100% - 50px); /* ให้ความสูงเป็น 100% ลบด้วยระยะห่างข้างบน */
margin-left: 100px;
margin-right: 50px;
}
\ No newline at end of file
src/app/components/account-settings/user-settings/user-settings.component.ts
......@@ -15,4 +15,42 @@ export class UserSettingsComponent {
this.sendPathTitle.emit(['การจัดการข้อมูลองค์กร', 'ตั้งค่าผู้ใช้งาน', tab.text])
this.activeTab = tab.id;
}
modalOptions: {
[nameModal: string]: { // ชื่อตรวจสอบการเปิดปิด
isModalOpen: boolean; // เปิด/ปิด
modalSize: string; // ขนาดของ Modal (s,m,l,vw10-vw100 )
backdropClose: boolean; // (คลิก Backdrop แล้ว true ปิด false ไม่ปิด )
}
} = {
"add": {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
},
"edit": {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
}
}
openModal(name: string, size: string, closeOnBackdrop?: boolean) {
this.modalOptions[name].modalSize = size;
this.modalOptions[name].backdropClose = closeOnBackdrop || false;
this.modalOptions[name].isModalOpen = true;
document.body.style.overflow = 'hidden'; // ล็อก Scroll
}
closeModal(name: string) {
this.modalOptions[name].isModalOpen = false;
// ตรวจสอบว่ามี Modal อื่นเปิดอยู่หรือไม่
if (!this.isAnyModalOpen()) {
document.body.style.overflow = ''; // คืนค่าการ Scroll เฉพาะเมื่อ Modal ทั้งหมดปิดแล้ว
}
}
isAnyModalOpen(): boolean {
// Logic ตรวจสอบว่า Modal อื่นยังเปิดอยู่หรือไม่
return Object.values(this.modalOptions).some(modal => modal.isModalOpen); // หากไม่มี Modal อื่นเปิด
}
}
src/app/components/company-registration/branch-business-unit/department-list/department-list.component.html
......@@ -49,12 +49,12 @@
<thead>
<tr>
<ng-container
*ngFor="let item of ['ลำดับ','รหัสฝ่าย','รายละเอียดฝ่าย (ไทย)','รายละเอียดฝ่าย (อังกฤษ)','การจัดการ']; let f = first; let l = last">
*ngFor="let item of ['ลำดับ','รหัสแผนก','รายละเอียดแผนก (ไทย)','รายละเอียดแผนก (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-xl"></i>
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
......@@ -67,10 +67,10 @@
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance']];let i = index">
<td class="flex justify-center">{{0+""+(i+1)}}</td>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
<td>{{item[2]}}</td>
<td class="flex justify-center" style="font-size: 12px;">{{0+""+(i+1)}}</td>
<td style="font-size: 12px;">{{item[0]}}</td>
<td style="font-size: 12px;">{{item[1]}}</td>
<td style="font-size: 12px;">{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#department-list-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
......
src/app/components/company-registration/branch-business-unit/department-list/department-list.component.scss
......@@ -9,4 +9,11 @@
top: 96px;
z-index: 1;
right: 35vw;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
\ No newline at end of file
src/app/components/company-registration/branch-business-unit/department-register/department-register.component.html
......@@ -55,7 +55,7 @@
[class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-xl"></i>
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
......
src/app/components/company-registration/branch-business-unit/department-register/department-register.component.scss
......@@ -10,3 +10,10 @@
z-index: 1;
right: 35vw;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
\ No newline at end of file
src/app/components/company-registration/branch-business-unit/section-registration/section-registration.component.html
......@@ -54,7 +54,7 @@
[class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-xl"></i>
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
......@@ -67,10 +67,10 @@
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance']];let i = index">
<td class="flex justify-center">{{0+""+(i+1)}}</td>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
<td>{{item[2]}}</td>
<td class="flex justify-center" style="font-size: 12px;">{{0+""+(i+1)}}</td>
<td style="font-size: 12px;">{{item[0]}}</td>
<td style="font-size: 12px;">{{item[1]}}</td>
<td style="font-size: 12px;">{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#section-registration-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
......
src/app/components/company-registration/branch-business-unit/section-registration/section-registration.component.scss
......@@ -10,3 +10,10 @@
z-index: 1;
right: 35vw;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
\ No newline at end of file
src/app/components/company-registration/branch-business-unit/sub-department-four/sub-department-four.component.html
......@@ -54,7 +54,7 @@
[class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-xl"></i>
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
......@@ -67,10 +67,10 @@
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance']];let i = index">
<td class="flex justify-center">{{0+""+(i+1)}}</td>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
<td>{{item[2]}}</td>
<td class="flex justify-center" style="font-size: 12px;">{{0+""+(i+1)}}</td>
<td style="font-size: 12px;">{{item[0]}}</td>
<td style="font-size: 12px;">{{item[1]}}</td>
<td style="font-size: 12px;">{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#sub-department-four-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
......
src/app/components/company-registration/branch-business-unit/sub-department-four/sub-department-four.component.scss
......@@ -10,3 +10,10 @@
z-index: 1;
right: 35vw;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
\ No newline at end of file
src/app/components/company-registration/branch-business-unit/sub-department-one/sub-department-one.component.html
......@@ -49,12 +49,12 @@
<thead>
<tr>
<ng-container
*ngFor="let item of ['ลำดับ','รหัสฝ่าย','รายละเอียดฝ่าย (ไทย)','รายละเอียดฝ่าย (อังกฤษ)','การจัดการ']; let f = first; let l = last">
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อยที่1','รายละเอียดส่วนย่อยที่1 (ไทย)','รายละเอียดส่วนย่อยที่1 (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-xl"></i>
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
......@@ -67,10 +67,10 @@
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance']];let i = index">
<td class="flex justify-center">{{0+""+(i+1)}}</td>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
<td>{{item[2]}}</td>
<td class="flex justify-center" style="font-size: 12px;">{{0+""+(i+1)}}</td>
<td style="font-size: 12px;">{{item[0]}}</td>
<td style="font-size: 12px;">{{item[1]}}</td>
<td style="font-size: 12px;">{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#sub-department-one-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
......
src/app/components/company-registration/branch-business-unit/sub-department-one/sub-department-one.component.scss
......@@ -9,4 +9,11 @@
top: 96px;
z-index: 1;
right: 35vw;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
\ No newline at end of file
src/app/components/company-registration/branch-business-unit/sub-department-three/sub-department-three.component.html
......@@ -49,12 +49,12 @@
<thead>
<tr>
<ng-container
*ngFor="let item of ['ลำดับ','รหัสฝ่าย','รายละเอียดฝ่าย (ไทย)','รายละเอียดฝ่าย (อังกฤษ)','การจัดการ']; let f = first; let l = last">
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อยที่3','รายละเอียดส่วนย่อยที่3 (ไทย)','รายละเอียดส่วนย่อยที่3 (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-xl"></i>
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
......@@ -67,10 +67,10 @@
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance']];let i = index">
<td class="flex justify-center">{{0+""+(i+1)}}</td>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
<td>{{item[2]}}</td>
<td class="flex justify-center" style="font-size: 12px;">{{0+""+(i+1)}}</td>
<td style="font-size: 12px;">{{item[0]}}</td>
<td style="font-size: 12px;">{{item[1]}}</td>
<td style="font-size: 12px;">{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#sub-department-three-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
......
src/app/components/company-registration/branch-business-unit/sub-department-three/sub-department-three.component.scss
......@@ -9,4 +9,11 @@
top: 96px;
z-index: 1;
right: 35vw;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
\ No newline at end of file
src/app/components/company-registration/branch-business-unit/sub-department-two/sub-department-two.component.html
......@@ -54,7 +54,7 @@
[class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-xl"></i>
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
......@@ -67,10 +67,10 @@
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance'],
['ACC', 'งานบัญชีเเละการเงิน', 'Accounting and Finance']];let i = index">
<td class="flex justify-center">{{0+""+(i+1)}}</td>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
<td>{{item[2]}}</td>
<td class="flex justify-center" style="font-size: 12px;">{{0+""+(i+1)}}</td>
<td style="font-size: 12px;">{{item[0]}}</td>
<td style="font-size: 12px;">{{item[1]}}</td>
<td style="font-size: 12px;">{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#sub-department-two-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
......
src/app/components/company-registration/branch-business-unit/sub-department-two/sub-department-two.component.scss
......@@ -10,3 +10,10 @@
z-index: 1;
right: 35vw;
}
table.ti-custom-table thead {
height: 50px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
\ No newline at end of file
src/app/components/job-description/employee-group-unit/employee-group-unit.component.html
......@@ -11,7 +11,7 @@
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
data-hs-overlay="#department-register-modal-add">
data-hs-overlay="#employee-group-unit-component-modal-add">
<i class="ri-add-line"></i>
Add
</button>
......@@ -38,7 +38,7 @@
นำเข้าข้อมูล
</a>
<a class="justify-center -mb-px inline-flex items-center gap-2 text-sm font-medium text-center text-secondary border-secondary border-b-2 dark:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-gray-300 align-items-end"
href="javascript:void(0);">
href="javascript:void(0);" data-hs-overlay="#employee-group-unit-component-modal-upload">
ดาวโหลดตัวอย่างไฟล์
</a>
</nav>
......@@ -81,7 +81,7 @@
<td style="text-align: center; font-size: 12px;" >{{item[1]}}</td>
<td style="text-align: center; font-size: 12px;" >{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#department-register-modal-edit"></i>
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#employee-group-unit-component-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
</td>
</tr>
......@@ -93,7 +93,7 @@
</div>
<div id="department-register-modal-add" class="hs-overlay hidden ti-modal">
<div id="employee-group-unit-component-modal-add" 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">
......@@ -125,7 +125,7 @@
</button>
</div>
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#department-register-modal-add">
data-hs-overlay="#employee-group-unit-component-modal-add">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
......@@ -141,7 +141,7 @@
<div class="flex justify-end mt-2rem mb-1rem space-x-2">
<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="#department-register-modal-add">
data-hs-overlay="#employee-group-unit-component-modal-add">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);">
......@@ -153,7 +153,7 @@
</div>
</div>
<div id="department-register-modal-edit" class="hs-overlay hidden ti-modal">
<div id="employee-group-unit-component-modal-edit" 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">
......@@ -185,7 +185,7 @@
</button>
</div>
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#department-register-modal-edit">
data-hs-overlay="#employee-group-unit-component-modal-edit">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
......@@ -201,7 +201,7 @@
<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="#department-register-modal-edit">
data-hs-overlay="#employee-group-unit-component-modal-edit">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);">
......@@ -211,4 +211,31 @@
</div>
</div>
</div>
</div>
\ No newline at end of file
</div>
<div id="employee-group-unit-component-modal-upload" 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-upload">
<div class="modal-headerupload bg-primary">
<h5 class="text-xxl font-bold text-white">
นำเข้าข้อมูลบริษัท
</h5>
</div>
<h1 class="mt-2" style="text-align: center;">ไฟล์</h1>
<div class="mt-2 px-2">
<div class="flex rounded-md">
<input type="text" id="hs-trailing-button-add-on-with-icon" name="hs-trailing-button-add-on-with-icon"
class="ti-form-input rounded-none ltr:rounded-l-md rtl:rounded-r-md focus:z-10">
<button aria-label="button" type="button"
class="inline-flex flex-shrink-0 justify-center items-center h-[2.875rem] w-[2.875rem] ltr:rounded-r-md rtl:rounded-l-md border border-transparent font-semibold bg-primary text-white hover:bg-primary focus:z-10 focus:outline-none focus:ring-0 focus:ring-primary transition-all text-sm">
<i class="ti ti-upload"></i>
</button>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4">
<a class="ti-btn ti-btn-primary" href="javascript:void(0);">
อัปโหลด
</a>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/components/job-description/employee-group-unit/employee-group-unit.component.scss
......@@ -20,4 +20,23 @@ table.ti-custom-table thead th span {
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
.ti-modal-content-upload{
background-color: white;
width: 25%; /* ความกว้างที่คุณต้องการ */
height: 80%;
position: absolute; /* ทำให้สามารถจัดตำแหน่งได้ */
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
}
.modal-headerupload{
display: flex;
align-items: center;
justify-content: center;
border-bottom-width: 1px;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
padding-left: 1rem;
padding-right: 1rem;
}
\ No newline at end of file
src/app/components/job-description/employee-group-unit/employee-group-unit.component.ts
......@@ -31,6 +31,11 @@ export class EmployeeGroupUnit {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
},
"upload":{
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
}
}
......
src/app/components/job-description/employee-level/employee-level.component.scss
......@@ -19,4 +19,23 @@ table.ti-custom-table thead th span {
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
.ti-modal .ti-modal-header-upload{
display: flex;
align-items: center;
justify-content: center;
border-bottom-width: 1px;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
padding-left: 1rem;
padding-right: 1rem;
}
.ti-modal-content-upload{
background-color: white;
width: 25%; /* ความกว้างที่คุณต้องการ */
height: 80%;
position: absolute; /* ทำให้สามารถจัดตำแหน่งได้ */
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
}
\ No newline at end of file
src/app/components/job-description/employee-level/employee-level.component.ts
......@@ -31,6 +31,11 @@ export class EmployeeLevel {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
},
"upload": {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
}
}
......
src/app/components/job-description/position/position-unit.component.html
......@@ -11,7 +11,7 @@
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
data-hs-overlay="#department-register-modal-add">
data-hs-overlay="#position-unit-component-modal-add">
<i class="ri-add-line"></i>
Add
</button>
......@@ -38,7 +38,7 @@
นำเข้าข้อมูล
</a>
<a class="justify-center -mb-px inline-flex items-center gap-2 text-sm font-medium text-center text-secondary border-secondary border-b-2 dark:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-gray-300 align-items-end"
href="javascript:void(0);">
href="javascript:void(0);" data-hs-overlay="#position-unit-component-modal-upload">
ดาวโหลดตัวอย่างไฟล์
</a>
</nav>
......@@ -81,7 +81,7 @@
<td style="text-align: center; font-size: 12px;" >{{item[1]}}</td>
<td style="text-align: center; font-size: 12px;" >{{item[2]}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#department-register-modal-edit"></i>
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" data-hs-overlay="#position-unit-component-modal-edit"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1"></i>
</td>
</tr>
......@@ -93,7 +93,7 @@
</div>
<div id="department-register-modal-add" class="hs-overlay hidden ti-modal">
<div id="position-unit-component-modal-add" 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">
......@@ -125,7 +125,7 @@
</button>
</div>
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#department-register-modal-add">
data-hs-overlay="#position-unit-component-modal-add">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
......@@ -141,7 +141,7 @@
<div class="flex justify-end mt-2rem mb-1rem space-x-2">
<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="#department-register-modal-add">
data-hs-overlay="#position-unit-component-modal-add">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);">
......@@ -153,7 +153,7 @@
</div>
</div>
<div id="department-register-modal-edit" class="hs-overlay hidden ti-modal">
<div id="position-unit-component-modal-edit" 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">
......@@ -185,7 +185,7 @@
</button>
</div>
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#department-register-modal-edit">
data-hs-overlay="#position-unit-component-modal-edit">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
......@@ -201,7 +201,7 @@
<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="#department-register-modal-edit">
data-hs-overlay="#position-unit-component-modal-edit">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);">
......@@ -211,4 +211,31 @@
</div>
</div>
</div>
</div>
\ No newline at end of file
</div>
<div id="position-unit-component-modal-upload" 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-upload">
<div class="modal-headerupload bg-primary">
<h5 class="text-xxl font-bold text-white">
นำเข้าข้อมูลบริษัท
</h5>
</div>
<h1 class="mt-2" style="text-align: center;">ไฟล์</h1>
<div class="mt-2" style="margin-left: 10px;">
<div class="flex rounded-md">
<input type="text" id="hs-trailing-button-add-on-with-icon" name="hs-trailing-button-add-on-with-icon"
class="ti-form-input rounded-none ltr:rounded-l-md rtl:rounded-r-md focus:z-10">
<button aria-label="button" type="button"
class="inline-flex flex-shrink-0 justify-center items-center h-[2.875rem] w-[2.875rem] ltr:rounded-r-md rtl:rounded-l-md border border-transparent font-semibold bg-primary text-white hover:bg-primary focus:z-10 focus:outline-none focus:ring-0 focus:ring-primary transition-all text-sm">
<i class="ti ti-upload"></i>
</button>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4">
<a class="ti-btn ti-btn-primary" href="javascript:void(0);">
อัปโหลด
</a>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/components/job-description/position/position-unit.component.scss
......@@ -19,4 +19,23 @@ table.ti-custom-table thead th span {
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
.ti-modal-content-upload{
background-color: white;
width: 25%; /* ความกว้างที่คุณต้องการ */
height: 80%;
position: absolute; /* ทำให้สามารถจัดตำแหน่งได้ */
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
}
.modal-headerupload{
display: flex;
align-items: center;
justify-content: center;
border-bottom-width: 1px;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
padding-left: 1rem;
padding-right: 1rem;
}
\ No newline at end of file
src/app/components/job-description/position/position-unit.component.ts
......@@ -31,6 +31,11 @@ export class PositionUnitComponent {
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
},
"upload":{
isModalOpen: false,
modalSize: 'm',
backdropClose: true,
}
}
......
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