Skip to content

M
myAppraisal
Commit 2176326e by Natthaphat Pankiang
Options

แก้ฟอนต์ ทะเบียนฝ่าย/แผนก/ส่วน/ส่วนย่อย1/ส่วนย่อย2/ส่วนย่อย3/ส่วนย่อย4, set a… 

แก้ฟอนต์ ทะเบียนฝ่าย/แผนก/ส่วน/ส่วนย่อย1/ส่วนย่อย2/ส่วนย่อย3/ส่วนย่อย4, set a password , employee level
parent 946e081a
Showing with 259 additions and 102 deletions
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/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
......@@ -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 @@
['310101', 'งานบัญชี', 'Accounting'],
['70711', 'โลจิสติกส์', 'Logistics'],
['40408', 'เทคโนโลยีสารสนเทศ', 'IT']];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-register-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-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-level/employee-level.component.scss
......@@ -19,4 +19,16 @@ table.ti-custom-table thead th span {
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
.ti-modal-header{
justify-content: center;
}
.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,
}
}
......
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