Skip to content

M
myAppraisal
Commit 0757df91 by Nakarin Luankla
Options

UPDATE การจัดการรายละเอียดงาน

parent 68749359
Showing with 112 additions and 742 deletions
src/app/components/basicui/tables/edittables/edittables.component.ts
...@@ -62,7 +62,7 @@ const COLUMNS_SCHEMA = [ ...@@ -62,7 +62,7 @@ const COLUMNS_SCHEMA = [
{ {
key: 'isEdit', key: 'isEdit',
type: 'isEdit', type: 'isEdit',
label: 'Action', label: 'การจัดการ',
}, },
]; ];
......
src/app/components/company-components/company-registration/company-registration.component.html
...@@ -22,8 +22,8 @@ ...@@ -22,8 +22,8 @@
</a> </a>
</nav> </nav>
</div> </div>
<div class="mt-3 px-2rem"> <div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1" class="!-mt-3 pt-50px"> <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<app-company-registration-page></app-company-registration-page> <app-company-registration-page></app-company-registration-page>
</div> </div>
<div id="underline-2" class="hidden" role="tabpanel" aria-labelledby="underline-item-2"> <div id="underline-2" class="hidden" role="tabpanel" aria-labelledby="underline-item-2">
......
src/app/components/competency-assessment/competency-management/group-competencies/edit-group-competencies/edit-group-competencies.component.html
...@@ -120,7 +120,7 @@ ...@@ -120,7 +120,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัสสมรรถนะ','ชื่อสมรรถนะ','ระดับความหวัง','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f || l || item === 'ระดับความหวัง'"> [class.!text-center]="f || l || item === 'ระดับความหวัง'">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
...@@ -231,7 +231,7 @@ ...@@ -231,7 +231,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ระดับความหวัง','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/competency-management/group-competencies/group-competencies.component.html
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อระดับพนักงาน (ไทย)','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/competency-management/indicators-and-curriculum/edit-group-indicators/edit-group-indicators.html
...@@ -305,7 +305,7 @@ ...@@ -305,7 +305,7 @@
<thead class="height-50px"> <thead class="height-50px">
<tr class="font-size-12px"> <tr class="font-size-12px">
<ng-container <ng-container
*ngFor="let item of assessmentToolsSelect==-1 ? ['รหัส','ชื่อเครื่องมือประเมิน','ชื่อที่เเสดง','Action'] : ['รหัส','ชื่อเครื่องมือประเมิน','ชื่อที่เเสดง'] ; let f = first; let l = last"> *ngFor="let item of assessmentToolsSelect==-1 ? ['รหัส','ชื่อเครื่องมือประเมิน','ชื่อที่เเสดง','การจัดการ'] : ['รหัส','ชื่อเครื่องมือประเมิน','ชื่อที่เเสดง'] ; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l&&item!='ชื่อที่เเสดง'"> [class.!text-center]="f||l&&item!='ชื่อที่เเสดง'">
<span class="font-size-12px font-weight-700">{{ item }}</span> <span class="font-size-12px font-weight-700">{{ item }}</span>
...@@ -437,7 +437,7 @@ ...@@ -437,7 +437,7 @@
<thead class="height-50px"> <thead class="height-50px">
<tr class="font-size-12px"> <tr class="font-size-12px">
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อหลักสูตร','Action'] ; 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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="font-size-12px font-weight-700">{{ item }}</span> <span class="font-size-12px font-weight-700">{{ item }}</span>
......
src/app/components/competency-assessment/competency-management/indicators-and-curriculum/indicators-and-curriculum.component.html
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<thead class="height-50px"> <thead class="height-50px">
<tr class="font-size-12px"> <tr class="font-size-12px">
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อหัวข้อ','ประเมิน','Action']; 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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="font-size-12px font-weight-700">{{ item }}</span> <span class="font-size-12px font-weight-700">{{ item }}</span>
......
src/app/components/competency-assessment/competency-management/set-approvers/set-approvers.component.html
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['พนักงาน','ระดับ 1','ระดับ 2','ระดับ 3','ระดับ 4','ระดับ 5','Action']; let f = first; let l = last; let i = index"> *ngFor="let item of ['พนักงาน','ระดับ 1','ระดับ 2','ระดับ 3','ระดับ 4','ระดับ 5','การจัดการ']; let f = first; let l = last; let i = index">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
...@@ -303,7 +303,7 @@ ...@@ -303,7 +303,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อ','นามสกุล','ตำเเหน่ง','หน่วยงาน','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/course-registration/development-course/development-course.component.html
...@@ -68,7 +68,7 @@ ...@@ -68,7 +68,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อหัวข้อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
...@@ -331,7 +331,7 @@ ...@@ -331,7 +331,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
...@@ -456,7 +456,7 @@ ...@@ -456,7 +456,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/evaluation-cycle-manager/define-document-form/define-document-form.component.html
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
<thead class="height-50px"> <thead class="height-50px">
<tr class="font-size-12px"> <tr class="font-size-12px">
<ng-container <ng-container
*ngFor="let item of ['รหัส','รายละเอียด','รอบปีการประเมิน','วันที่เริ่มต้น','วันที่สิ้นสุด','สถานะ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="font-size-12px font-weight-700">{{ item }}</span> <span class="font-size-12px font-weight-700">{{ item }}</span>
......
src/app/components/competency-assessment/evaluation-cycle-manager/define-document-form/edit-define-document-form/edit-define-document-form.component.html
...@@ -92,7 +92,7 @@ ...@@ -92,7 +92,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัสแบบฟอร์ม','ชื่อพนักงาน','ตำแหน่ง','ระดับพนักงาน','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f || l || item === 'รหัสแบบฟอร์ม'" [class.!text-center]="f || l || item === 'รหัสแบบฟอร์ม'"
[style.width]="item === 'รหัสแบบฟอร์ม' ? '20%' : 'auto'"> [style.width]="item === 'รหัสแบบฟอร์ม' ? '20%' : 'auto'">
...@@ -269,7 +269,7 @@ ...@@ -269,7 +269,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัสสมรรถนะ','ชื่อสมรรถนะ','ระดับความหวัง','Action']; let f = first; let l = last; let i = index"> *ngFor="let item of ['รหัสสมรรถนะ','ชื่อสมรรถนะ','ระดับความหวัง','การจัดการ']; let f = first; let l = last; let i = index">
<th scope="col" <th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f || l || item === 'ระดับความหวัง'"> [class.!text-center]="f || l || item === 'ระดับความหวัง'">
...@@ -395,7 +395,7 @@ ...@@ -395,7 +395,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/evaluation-cycle-manager/evaluation-cycle/evaluation-cycle.component.html
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
<thead class="height-50px"> <thead class="height-50px">
<tr class="font-size-12px"> <tr class="font-size-12px">
<ng-container <ng-container
*ngFor="let item of ['รหัส','รายละเอียด','รอบปีการประเมิน','วันที่เริ่มต้น','วันที่สิ้นสุด','สถานะ','Action']; 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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="font-size-12px font-weight-700">{{ item }}</span> <span class="font-size-12px font-weight-700">{{ item }}</span>
......
src/app/components/competency-assessment/grade-registration/grade-management/grade-management.component.html
...@@ -200,7 +200,7 @@ ...@@ -200,7 +200,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อเครื่องมือประเมิน','ชื่อที่เเสดง','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/grade-registration/grade-management/sub-grade-registration/sub-grade-registration.component.html
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
<thead class="height-50px"> <thead class="height-50px">
<tr class="font-size-12px"> <tr class="font-size-12px">
<ng-container <ng-container
*ngFor="let item of ['รหัสเกรด','รายละเอียดเอกสาร','เกรด','คะแนนสูงสุด','คะแนนต่ำสุด','น้ำหนัก','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="item === 'รหัสเกรด' || item === 'เกรด' || item === 'คะแนนสูงสุด' || item === 'คะแนนต่ำสุด' || item === 'น้ำหนัก'" [class.!text-center]="item === 'รหัสเกรด' || item === 'เกรด' || item === 'คะแนนสูงสุด' || item === 'คะแนนต่ำสุด' || item === 'น้ำหนัก'"
[class.text-center]="!(item === 'รายละเอียดเอกสาร')"> [class.text-center]="!(item === 'รายละเอียดเอกสาร')">
......
src/app/components/competency-assessment/idp-development-plan/set-idp-development-plan/set-idp-development-plan.component.html
...@@ -331,7 +331,7 @@ ...@@ -331,7 +331,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
...@@ -459,7 +459,7 @@ ...@@ -459,7 +459,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/name-registration/competency-topic/competency-topic.component.html
...@@ -375,7 +375,7 @@ ...@@ -375,7 +375,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
...@@ -500,7 +500,7 @@ ...@@ -500,7 +500,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/competency-assessment/tool-register/assessment-tool/assessment-tool.component.html
...@@ -67,7 +67,7 @@ ...@@ -67,7 +67,7 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['รหัส','ชื่อเครื่องมือประเมิน','ชื่อที่เเสดง','Action']; let f = first; let l = last; let i = index"> *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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f||l"> [class.!text-center]="f||l">
<span class="text-sm">{{ item }}</span> <span class="text-sm">{{ item }}</span>
......
src/app/components/job-detail-components/command-structure/command-structure.component.html
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</a> </a>
</nav> </nav>
</div> </div>
<div class="mt-3 px-2rem"> <div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1"> <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<app-sub-command-structure></app-sub-command-structure> <app-sub-command-structure></app-sub-command-structure>
</div> </div>
......
src/app/components/job-detail-components/command-structure/sub-command-structure/sub-command-structure.component.html
<div class="text-lg font-sm pt-2rem pb-1rem text-primary"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<!-- รายละเอียดสาขาและหน่วยธุรกิจ --> <div class="flex justify-between">
</div> <div class="flex pr-2">
<div class="page"> <div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"
<div id="card-type-1" role="tabpanel" aria-labelledby="card-type-item-1"> data-hs-overlay="#company-registration-page-upload-modal">
<div class="w-full min-height-50px mb-10px justify-between items-center"> <i class="ri-add-line"></i>
<div class="flex justify-between"> นำเข้าข้อมูล
<div class="flex pr-2"> </button>
<!-- Content ของ div แรก --> <a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
<div class="px-1"> href="javascript:void(0);">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"> ดาวน์โหลดตัวอย่างไฟล์
<i class="ri-add-line"></i> </a>
นำเข้าข้อมูล </div>
</button> </div>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
href="javascript:void(0);">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div>
</div>
<div class="flex justify-end"> <div class="flex justify-end">
<div class="px-1"> <div class="px-1">
<div class="relative shadow-md"> <div class="relative shadow-md">
...@@ -60,9 +53,8 @@ ...@@ -60,9 +53,8 @@
<tr> <tr>
<ng-container <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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
[class.!text-center]="f||l"> <span class="font-size-12px font-weight-700">{{ item }}</span>
<span class="!text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
...@@ -77,10 +69,10 @@ ...@@ -77,10 +69,10 @@
['03','003', 'Department 1-HRD','Department 1-HRD'], ['03','003', 'Department 1-HRD','Department 1-HRD'],
['04','004', 'Department Manager 3','Department Manager 3'], ['04','004', 'Department Manager 3','Department Manager 3'],
['05','005', 'Department Manager 4','Department Manager 4']];let i = index"> ['05','005', 'Department Manager 4','Department Manager 4']];let i = index">
<td class="flex justify-center"> <td class="text-center">
{{item[0]}} {{i+1}}
</td> </td>
<td>{{item[1]}}</td> <td class="text-center">{{item[1]}}</td>
<td>{{item[2]}}</td> <td>{{item[2]}}</td>
<td>{{item[3]}}</td> <td>{{item[3]}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
...@@ -179,7 +171,7 @@ ...@@ -179,7 +171,7 @@
<div class="ti-modal-body mt-1"> <div class="ti-modal-body mt-1">
<label for="input-label" class="ti-form-label">รหัสงาน*</label> <label for="input-label" class="ti-form-label">รหัสงาน*</label>
<input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001"> <input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)*</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
...@@ -286,7 +278,7 @@ ...@@ -286,7 +278,7 @@
<div class="ti-modal-body mt-1"> <div class="ti-modal-body mt-1">
<label for="input-label" class="ti-form-label">รหัสงาน*</label> <label for="input-label" class="ti-form-label">รหัสงาน*</label>
<input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001"> <input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)*</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
...@@ -417,6 +409,3 @@ ...@@ -417,6 +409,3 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
\ No newline at end of file
src/app/components/job-detail-components/command-structure/sub-command-structure/sub-command-structure.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;
margin-right: 10px; /* เพิ่มใหม่ 12/16*/
}
table.ti-custom-table th {
height: 60px;
}
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;
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 {
overflow: hidden;
}
.header-title-type {
width: 100%;
min-height: 50px; /* ใช้ min-height เพื่อให้มีความยืดหยุ่น */
// margin-top: 50px;
// margin-bottom: 16px;
justify-content: space-between; /* จัดเรียงองค์ประกอบภายใน */
align-items: center; /* จัดกลางแนวตั้ง */
padding-top: 50px;
padding-bottom: 1rem;
}
// .icon-container {
// display: inline-flex;
// align-items: center;
// justify-content: center;
// width: 20px; /* ปรับขนาดตามต้องการ */
// height: 20px; /* ปรับขนาดตามต้องการ */
// border: 2px solid #2196F3; /* กรอบสีน้ำเงิน */
// border-radius: 5px; /* มุมโค้งมนเล็กน้อย */
// background-color: #E3F2FD; /* พื้นหลังสีฟ้าอ่อน */
// margin-bottom: 10px; /* เว้นระยะห่างจาก textarea */
// }
// .icon-container i {
// font-size: 10px; /* ขนาดไอคอน */
// color: #2196F3; /* สีไอคอน */
// }
.icon-container {
display: flex;
gap: 1px; /* ระยะห่างระหว่างไอคอน */
}
.icon-container i {
display: flex;
align-items: center;
justify-content: center;
width: 20px; /* ขนาดกรอบ */
height: 20px;
border: 2px solid #2196F3; /* สีกรอบ */
border-radius: 4px; /* มุมโค้งมน */
background-color: #E3F2FD; /* พื้นหลังสีฟ้าอ่อน */
color: #2196F3; /* สีไอคอน */
font-size: 10px; /* ขนาดไอคอน */
}
src/app/components/job-detail-components/job-competency/job-competency.component.html
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</a> </a>
</nav> </nav>
</div> </div>
<div class="mt-3 px-2rem"> <div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1"> <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<app-sub-job-competency></app-sub-job-competency> <app-sub-job-competency></app-sub-job-competency>
</div> </div>
......
src/app/components/job-detail-components/job-competency/sub-job-competency/sub-job-competency.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;
margin-right: 10px; /* เพิ่มใหม่ 12/16*/
}
table.ti-custom-table thead {
height: 60px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
.ti-custom-table td{
padding-left: 0.9rem;
padding-right: 1rem;
}
.ti-custom-table thead th:first-child {
width: 125px; /* ปรับความกว้างตามที่ต้องการ */
text-align: left; /* จัดตำแหน่งข้อความถ้าต้องการ */
}
.ti-custom-table thead th:last-child {
width: 150px; /* ปรับความกว้างตามที่ต้องการ */
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
/* สไตล์ของแถบเมนู */
.nav-tabs {
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-alert{
width: 35%; /* ความกว้างที่คุณต้องการ */
position: absolute; /* ทำให้สามารถจัดตำแหน่งได้ */
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
background-color: #ffffff;
}
.header-title-type {
width: 100%;
min-height: 50px; /* ใช้ min-height เพื่อให้มีความยืดหยุ่น */
justify-content: space-between; /* จัดเรียงองค์ประกอบภายใน */
align-items: center; /* จัดกลางแนวตั้ง */
padding-top: 50px;
padding-bottom: 1rem;
}
\ No newline at end of file
src/app/components/job-detail-components/job-detail-management/import-data/import-data.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex pr-2">
<!-- Content ของ div แรก -->
<div class="px-1"> <div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"> <button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"
data-hs-overlay="#company-registration-page-upload-modal">
<i class="ri-add-line"></i> <i class="ri-add-line"></i>
นำเข้าข้อมูล นำเข้าข้อมูล
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
href="javascript:void(0);"> href="javascript:void(0);">
ดาวน์โหลดตัวอย่างไฟล์ ดาวน์โหลดตัวอย่างไฟล์
...@@ -49,18 +48,15 @@ ...@@ -49,18 +48,15 @@
</div> </div>
</div> </div>
</div> </div>
<div class="page px-rem">
<div class="overflow-auto shadow-md rounded-t-md">
<div class="page px-rem"> <table class="ti-custom-table ti-custom-table-head ti-custom-table-hover table-bordered">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead> <thead>
<tr> <tr>
<ng-container <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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
[class.!text-center]="f||l"> <span class="font-size-12px font-weight-700">{{ item }}</span>
<span class="!text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
...@@ -78,10 +74,10 @@ ...@@ -78,10 +74,10 @@
<tbody *ngIf="jobListFilter().length"> <tbody *ngIf="jobListFilter().length">
<tr <tr
*ngFor="let item of jobListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of jobListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index">
<td class="flex justify-center"> <td class="text-center">
{{((currentPage-1) * 10)+(i+1)}} {{((currentPage-1) * 10)+(i+1)}}
</td> </td>
<td>{{item.jobid}}</td> <td class="text-center">{{item.jobid}}</td>
<td>{{item.tdesc}}</td> <td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td> <td>{{item.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
......
src/app/components/job-detail-components/job-detail-management/job-detail-management.component.html
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
</a> </a>
</nav> </nav>
</div> </div>
<div class="mt-3 px-2rem"> <div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1"> <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<app-import-data ></app-import-data> <app-import-data ></app-import-data>
</div> </div>
......
src/app/components/job-detail-components/job-detail/job-detail.component.html
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</a> </a>
</nav> </nav>
</div> </div>
<div class="mt-3 px-2rem"> <div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1"> <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<app-work-detail></app-work-detail> <app-work-detail></app-work-detail>
</div> </div>
......
src/app/components/job-detail-components/job-detail/work-detail/work-detail.component.html
<div class="text-lg font-sm pt-2rem pb-1rem text-primary"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<!-- รายละเอียดสาขาและหน่วยธุรกิจ --> <div class="flex justify-between">
</div> <div class="flex pr-2">
<div class="page"> <div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"
<div id="card-type-1" role="tabpanel" aria-labelledby="card-type-item-1"> data-hs-overlay="#company-registration-page-upload-modal">
<div class="w-full min-height-50px mb-10px justify-between items-center"> <i class="ri-add-line"></i>
<div class="flex justify-between"> นำเข้าข้อมูล
<div class="flex pr-2"> </button>
<!-- Content ของ div แรก --> <a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
<div class="px-1"> href="javascript:void(0);">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"> ดาวน์โหลดตัวอย่างไฟล์
<i class="ri-add-line"></i> </a>
นำเข้าข้อมูล </div>
</button> </div>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
href="javascript:void(0);">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div>
</div>
<div class="flex justify-end"> <div class="flex justify-end">
<div class="px-1"> <div class="px-1">
<div class="relative shadow-md"> <div class="relative shadow-md">
...@@ -52,17 +45,14 @@ ...@@ -52,17 +45,14 @@
</div> </div>
<div class="page px-rem"> <div class="page px-rem">
<div class="overflow-auto table-bordered rounded-t-md"> <div class="overflow-auto shadow-md rounded-t-md">
<div id="card-type-1" role="tabpanel" aria-labelledby="card-type-item-1"> <table class="ti-custom-table ti-custom-table-head ti-custom-table-hover table-bordered">
<div class="overflow-auto shadow-md">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead> <thead>
<tr> <tr>
<ng-container <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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
[class.!text-center]="f||l"> <span class="font-size-12px font-weight-700">{{ item }}</span>
<span class="!text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
...@@ -77,10 +67,10 @@ ...@@ -77,10 +67,10 @@
['03','003', 'Department 1-HRD','Department 1-HRD'], ['03','003', 'Department 1-HRD','Department 1-HRD'],
['04','004', 'Department Manager 3','Department Manager 3'], ['04','004', 'Department Manager 3','Department Manager 3'],
['05','005', 'Department Manager 4','Department Manager 4']];let i = index"> ['05','005', 'Department Manager 4','Department Manager 4']];let i = index">
<td class="flex justify-center"> <td class="text-center">
{{item[0]}} {{i+1}}
</td> </td>
<td>{{item[1]}}</td> <td class="text-center">{{item[1]}}</td>
<td>{{item[2]}}</td> <td>{{item[2]}}</td>
<td>{{item[3]}}</td> <td>{{item[3]}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
...@@ -93,8 +83,6 @@ ...@@ -93,8 +83,6 @@
</tbody> </tbody>
</table> </table>
</div> </div>
</div>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length"> <nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length">
<ul class="ti-pagination"> <ul class="ti-pagination">
<li> <li>
...@@ -247,7 +235,7 @@ ...@@ -247,7 +235,7 @@
<label for="input-label" class="ti-form-label">รหัสงาน*</label> <label for="input-label" class="ti-form-label">รหัสงาน*</label>
<input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly <input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly
value="001"> value="001">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)*</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly
value="Department Manager 1"> value="Department Manager 1">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label>
...@@ -407,6 +395,3 @@ ...@@ -407,6 +395,3 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
\ No newline at end of file
src/app/components/job-detail-components/job-detail/work-detail/work-detail.component.scss
.ti-modal-content-new {
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
position: relative; /* ทำให้สามารถจัดตำแหน่งได้ */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
background-color: white;
overflow: hidden; /* ป้องกันการเลื่อนในโมดอล */
}
.ti-modal-body-new {
height: 50vh;
display: flex;
justify-content: center; /* จัดแนวนอนให้ตรงกลาง */
align-items: center; /* จัดแนวตั้งให้ตรงกลาง */
padding: 1rem;
}
\ No newline at end of file
src/app/components/job-detail-components/job-position-indicators/job-position-indicators.component.html
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</a> </a>
</nav> </nav>
</div> </div>
<div class="mt-3 px-2rem"> <div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1"> <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<app-sub-job-position-indicators></app-sub-job-position-indicators> <app-sub-job-position-indicators></app-sub-job-position-indicators>
</div> </div>
......
src/app/components/job-detail-components/job-position-indicators/sub-job-position-indicators/sub-job-position-indicators.component.html
<div class="text-lg font-sm pt-2rem pb-1rem text-primary"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<!-- รายละเอียดสาขาและหน่วยธุรกิจ --> <div class="flex justify-between">
</div> <div class="flex pr-2">
<div class="page"> <div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"
<div id="card-type-1" role="tabpanel" aria-labelledby="card-type-item-1"> data-hs-overlay="#company-registration-page-upload-modal">
<div class="w-full min-height-50px mb-10px justify-between items-center"> <i class="ri-add-line"></i>
<div class="flex justify-between"> นำเข้าข้อมูล
<div class="flex pr-2"> </button>
<!-- Content ของ div แรก --> <a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
<div class="px-1"> href="javascript:void(0);">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"> ดาวน์โหลดตัวอย่างไฟล์
<i class="ri-add-line"></i> </a>
นำเข้าข้อมูล </div>
</button> </div>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
href="javascript:void(0);">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div>
</div>
<div class="flex justify-end"> <div class="flex justify-end">
<div class="px-1"> <div class="px-1">
<div class="relative shadow-md"> <div class="relative shadow-md">
...@@ -52,17 +45,14 @@ ...@@ -52,17 +45,14 @@
</div> </div>
<div class="page px-rem"> <div class="page px-rem">
<div class="overflow-auto table-bordered rounded-t-md"> <div class="overflow-auto shadow-md rounded-t-md">
<div id="card-type-1" role="tabpanel" aria-labelledby="card-type-item-1"> <table class="ti-custom-table ti-custom-table-head ti-custom-table-hover table-bordered">
<div class="overflow-auto shadow-md">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead> <thead>
<tr> <tr>
<ng-container <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" <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
[class.!text-center]="f||l"> <span class="font-size-12px font-weight-700">{{ item }}</span>
<span class="!text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
...@@ -77,10 +67,10 @@ ...@@ -77,10 +67,10 @@
['03','003', 'Department 1-HRD','Department 1-HRD'], ['03','003', 'Department 1-HRD','Department 1-HRD'],
['04','004', 'Department Manager 3','Department Manager 3'], ['04','004', 'Department Manager 3','Department Manager 3'],
['05','005', 'Department Manager 4','Department Manager 4']];let i = index"> ['05','005', 'Department Manager 4','Department Manager 4']];let i = index">
<td class="flex justify-center"> <td class="text-center">
{{item[0]}} {{item[0]}}
</td> </td>
<td>{{item[1]}}</td> <td class="text-center">{{item[1]}}</td>
<td>{{item[2]}}</td> <td>{{item[2]}}</td>
<td>{{item[3]}}</td> <td>{{item[3]}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
...@@ -94,7 +84,6 @@ ...@@ -94,7 +84,6 @@
</table> </table>
</div> </div>
</div> </div>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length"> <nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length">
<ul class="ti-pagination"> <ul class="ti-pagination">
<li> <li>
...@@ -129,7 +118,6 @@ ...@@ -129,7 +118,6 @@
</li> </li>
</ul> </ul>
</nav> </nav>
</div>
<div id="sub-job-position-indicators-modal-add" class="hs-overlay hidden ti-modal"> <div id="sub-job-position-indicators-modal-add" class="hs-overlay hidden ti-modal">
...@@ -179,7 +167,7 @@ ...@@ -179,7 +167,7 @@
<div class="ti-modal-body mt-1"> <div class="ti-modal-body mt-1">
<label for="input-label" class="ti-form-label">รหัสงาน</label> <label for="input-label" class="ti-form-label">รหัสงาน</label>
<input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001"> <input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)*</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
...@@ -254,7 +242,7 @@ ...@@ -254,7 +242,7 @@
<div class="ti-modal-body mt-1"> <div class="ti-modal-body mt-1">
<label for="input-label" class="ti-form-label">รหัสงาน</label> <label for="input-label" class="ti-form-label">รหัสงาน</label>
<input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001"> <input type="text" id="input-label" class="ti-form-input w-1/2 bg-input-readonly" readonly value="001">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)*</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (ไทย)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
<label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label> <label for="input-label" class="ti-form-label mt-2rem">ชื่อลักษณะงาน (อังกฤษ)</label>
<input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1"> <input type="text" id="input-label" class="ti-form-input h-10 bg-input-readonly" readonly value="Department Manager 1">
...@@ -353,6 +341,3 @@ ...@@ -353,6 +341,3 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
\ No newline at end of file
src/app/components/job-detail-components/job-position-indicators/sub-job-position-indicators/sub-job-position-indicators.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;
margin-right: 10px; /* เพิ่มใหม่ 12/16*/
}
table.ti-custom-table th {
height: 60px;
}
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;
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 {
overflow: hidden;
}
.header-title-type {
width: 100%;
min-height: 50px; /* ใช้ min-height เพื่อให้มีความยืดหยุ่น */
// margin-top: 50px;
// margin-bottom: 16px;
justify-content: space-between; /* จัดเรียงองค์ประกอบภายใน */
align-items: center; /* จัดกลางแนวตั้ง */
padding-top: 50px;
padding-bottom: 1rem;
}
// .icon-container {
// display: inline-flex;
// align-items: center;
// justify-content: center;
// width: 20px; /* ปรับขนาดตามต้องการ */
// height: 20px; /* ปรับขนาดตามต้องการ */
// border: 2px solid #2196F3; /* กรอบสีน้ำเงิน */
// border-radius: 5px; /* มุมโค้งมนเล็กน้อย */
// background-color: #E3F2FD; /* พื้นหลังสีฟ้าอ่อน */
// margin-bottom: 10px; /* เว้นระยะห่างจาก textarea */
// }
// .icon-container i {
// font-size: 10px; /* ขนาดไอคอน */
// color: #2196F3; /* สีไอคอน */
// }
.icon-container {
display: flex;
gap: 1px; /* ระยะห่างระหว่างไอคอน */
}
.icon-container i {
display: flex;
align-items: center;
justify-content: center;
width: 20px; /* ขนาดกรอบ */
height: 20px;
border: 2px solid #2196F3; /* สีกรอบ */
border-radius: 4px; /* มุมโค้งมน */
background-color: #E3F2FD; /* พื้นหลังสีฟ้าอ่อน */
color: #2196F3; /* สีไอคอน */
font-size: 10px; /* ขนาดไอคอน */
}
src/app/components/job-detail-components/job-qualifications/job-qualifications.component.html
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</a> </a>
</nav> </nav>
</div> </div>
<div class="mt-3 px-2rem"> <div class="mt-3 px-2rem !-mt-3 pt-50px">
<div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1"> <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
<app-sub-job-qualifications></app-sub-job-qualifications> <app-sub-job-qualifications></app-sub-job-qualifications>
</div> </div>
......
src/app/components/job-detail-components/job-qualifications/sub-job-qualifications/sub-job-qualifications.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;
margin-right: 10px; /* เพิ่มใหม่ 12/16*/
}
table.ti-custom-table thead {
height: 60px;
}
table.ti-custom-table thead th span {
font-size: 12px;
font-weight: bold;
}
.ti-custom-table td{
padding-left: 0.9rem;
padding-right: 1rem;
}
.ti-custom-table thead th:first-child {
width: 125px; /* ปรับความกว้างตามที่ต้องการ */
text-align: left; /* จัดตำแหน่งข้อความถ้าต้องการ */
}
.ti-custom-table thead th:last-child {
width: 150px; /* ปรับความกว้างตามที่ต้องการ */
}
a.custom-link {
padding: 10px 40px; /* ปรับ padding ให้เพิ่มขนาด */
}
/* สไตล์ของแถบเมนู */
.nav-tabs {
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-alert{
width: 35%; /* ความกว้างที่คุณต้องการ */
position: absolute; /* ทำให้สามารถจัดตำแหน่งได้ */
top: 50%; /* ให้อยู่กลางในแนวตั้ง */
left: 50%; /* ให้อยู่กลางในแนวนอน */
transform: translate(-50%, -50%); /* เคลื่อนที่ modal กลับมาให้ตรงกลาง */
background-color: #ffffff;
}
.header-title-type {
width: 100%;
min-height: 50px; /* ใช้ min-height เพื่อให้มีความยืดหยุ่น */
justify-content: space-between; /* จัดเรียงองค์ประกอบภายใน */
align-items: center; /* จัดกลางแนวตั้ง */
padding-top: 50px;
padding-bottom: 1rem;
}
\ 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