Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
M
mySkill-x
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Registry
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
angular
mySkill-x
Commits
6f9dad8f
Commit
6f9dad8f
authored
Mar 05, 2025
by
Nakarin Luankla
Browse files
Options
Browse Files
Download
Plain Diff
Merge branch 'DEV' of
https://mygit.myhr.co.th/angular/myAppraisal
into DEV
parents
deaf15f9
029fca9c
Show whitespace changes
Inline
Side-by-side
Showing
13 changed files
with
711 additions
and
82 deletions
+711
-82
evaluation-cycle.component.html
...-manager/evaluation-cycle/evaluation-cycle.component.html
+9
-9
evaluation-cycle.component.ts
...le-manager/evaluation-cycle/evaluation-cycle.component.ts
+18
-45
dashboard-routing.module.ts
src/app/components/dashboard/dashboard-routing.module.ts
+3
-1
dashboard.module.ts
src/app/components/dashboard/dashboard.module.ts
+3
-1
management-evaluation-cycle.component.html
...aluation-cycle/management-evaluation-cycle.component.html
+10
-9
management-evaluation-cycle.component.ts
...evaluation-cycle/management-evaluation-cycle.component.ts
+16
-14
time-attendance.component.html
...evaluation/time-attendance/time-attendance.component.html
+510
-0
time-attendance.component.scss
...evaluation/time-attendance/time-attendance.component.scss
+0
-0
time-attendance.component.ts
...t-evaluation/time-attendance/time-attendance.component.ts
+124
-0
evaluation-cycle.model.ts
src/app/shared/model/evaluation-cycle.model.ts
+4
-0
pms-masfrom-evaluation.model.ts
src/app/shared/model/pms-masfrom-evaluation.model.ts
+4
-0
navservice.ts
src/app/shared/services/navservice.ts
+1
-0
style.css
src/assets/css/style.css
+9
-3
No files found.
src/app/components/competency-assessment/evaluation-cycle-manager/evaluation-cycle/evaluation-cycle.component.html
View file @
6f9dad8f
...
...
@@ -254,27 +254,27 @@
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
id=
"input-label"
class=
"ti-form-input w-1/2"
[
ngClass
]="{'
bg-input-readonly
'
:modalStatus=
='edit'}"
[
readonly
]="
modalStatus=
='edit'"
[(
ngModel
)]="
dataSelect
.
evaluationRoundId
"
>
[(
ngModel
)]="
evaluation_cycle
.
evaluationRoundId
"
>
<label
for=
"detail_th"
class=
"ti-form-label mt-2rem"
>
รายละเอียดฝ่าย (ไทย)
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
id=
"detail_th"
class=
"ti-form-input h-16"
[(
ngModel
)]="
dataSelect
.
tdesc
"
>
<input
type=
"text"
id=
"detail_th"
class=
"ti-form-input h-16"
[(
ngModel
)]="
evaluation_cycle
.
tdesc
"
>
<label
for=
"detail_eng"
class=
"ti-form-label mt-2rem"
>
รายละเอียดฝ่าย (อังกฤษ)
</label>
<input
type=
"text"
id=
"detail_eng"
class=
"ti-form-input h-16"
[(
ngModel
)]="
dataSelect
.
edesc
"
>
<input
type=
"text"
id=
"detail_eng"
class=
"ti-form-input h-16"
[(
ngModel
)]="
evaluation_cycle
.
edesc
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
ปีการประเมิน
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
id=
"input-label"
class=
"ti-form-input w-1/2"
oninput=
"this.value = this.value.replace(/\D/g, '')"
[(
ngModel
)]="
dataSelect
.
apsyear
"
>
oninput=
"this.value = this.value.replace(/\D/g, '')"
[(
ngModel
)]="
evaluation_cycle
.
apsyear
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
เริ่มวันที่
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
dataSelect
.
apsPeriodStart
"
>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
evaluation_cycle
.
apsPeriodStart
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
สิ้นสุดวันที่
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
dataSelect
.
apsPeriodEnd
"
>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
evaluation_cycle
.
apsPeriodEnd
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
ระดับพนักงาน (JL)
</label>
<div
*
ngFor=
"let item of
pl.selectList
;let i = index;let f=first"
[
class
.
mt-2
]="!
f
"
<div
*
ngFor=
"let item of
evaluation_cycle.personalLevel
;let i = index;let f=first"
[
class
.
mt-2
]="!
f
"
class=
"col-span-6 sm:col-span-6 "
>
<div
class=
"flex"
>
<div
class=
"relative flex rounded-md"
>
...
...
@@ -302,8 +302,8 @@
ย้อนกลับ
</button>
<button
type=
"button"
class=
"ti-btn ti-btn-success"
data-hs-overlay=
"#evaluation-cycle-page-alert-modal"
[
class
.
ti-btn-disabled
]="!
dataSelect
.
evaluationRoundId
||!
dataSelect
.
tdesc
||!
dataSelect
.
apsyear
||!
dataSelect
.
apsPeriodStart
||!
dataSelect
.
apsPeriodEnd
"
[
disabled
]="!
dataSelect
.
evaluationRoundId
||!
dataSelect
.
tdesc
||!
dataSelect
.
apsyear
||!
dataSelect
.
apsPeriodStart
||!
dataSelect
.
apsPeriodEnd
"
>
[
class
.
ti-btn-disabled
]="!
evaluation_cycle
.
evaluationRoundId
||!
evaluation_cycle
.
tdesc
||!
evaluation_cycle
.
apsyear
||!
evaluation_cycle
.
apsPeriodStart
||!
evaluation_cycle
.
apsPeriodEnd
"
[
disabled
]="!
evaluation_cycle
.
evaluationRoundId
||!
evaluation_cycle
.
tdesc
||!
evaluation_cycle
.
apsyear
||!
evaluation_cycle
.
apsPeriodStart
||!
evaluation_cycle
.
apsPeriodEnd
"
>
บันทึกข้อมูล
</button>
</div>
...
...
src/app/components/competency-assessment/evaluation-cycle-manager/evaluation-cycle/evaluation-cycle.component.ts
View file @
6f9dad8f
...
...
@@ -11,17 +11,6 @@ export interface DataModal {
currentPage
:
number
,
page
:
number
[]
}
export
interface
DataModel
{
evaluationRoundId
:
string
;
tdesc
:
string
;
edesc
:
string
;
apsyear
:
string
;
apsPeriodStart
:
string
;
apsPeriodEnd
:
string
;
statusCode
:
StatusCodeModel
;
}
@
Component
({
selector
:
'app-evaluation-cycle'
,
templateUrl
:
'./evaluation-cycle.component.html'
,
...
...
@@ -36,10 +25,9 @@ export class EvaluationCycleComponent {
page
=
Array
.
from
({
length
:
1
},
(
_
,
i
)
=>
i
+
1
);
search
=
""
modalStatus
=
'add'
evaluation_cyclelist
:
{
check
:
boolean
,
data
:
Data
Model
}[]
=
[]
evaluation_cyclelist
:
{
check
:
boolean
,
data
:
EvaluationCycle
Model
}[]
=
[]
evaluation_cycle
:
EvaluationCycleModel
=
new
MyEvaluationCycleModel
({})
dataLoading
=
false
dataSelect
:
DataModel
=
{
evaluationRoundId
:
""
,
tdesc
:
""
,
edesc
:
""
,
apsyear
:
""
,
apsPeriodStart
:
""
,
apsPeriodEnd
:
""
,
statusCode
:
new
MyStatusCodeModel
({})
}
itemToDelete
:
EvaluationCycleModel
|
null
=
null
;
isDataListChecked
=
false
isDataListCheckedAll
=
false
...
...
@@ -52,7 +40,7 @@ export class EvaluationCycleComponent {
currentPage
:
1
,
page
:
Array
.
from
({
length
:
1
},
(
_
,
i
)
=>
i
+
1
)
}
pl
:
{
loading
:
boolean
,
select
List
:
PLModel
[],
selectIndex
:
number
,
dataList
:
PLModel
[]
}
=
{
loading
:
false
,
selectList
:
[
new
MyPLModel
()]
,
selectIndex
:
-
1
,
dataList
:
[]
}
pl
:
{
loading
:
boolean
,
select
Index
:
number
,
dataList
:
PLModel
[]
}
=
{
loading
:
false
,
selectIndex
:
-
1
,
dataList
:
[]
}
constructor
(
private
evaluationCycleService
:
EvaluationCycleService
,
...
...
@@ -96,18 +84,18 @@ export class EvaluationCycleComponent {
(
x
.
plId
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
())
||
x
.
tdesc
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
())
||
x
.
edesc
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
()))
&&
!
this
.
pl
.
selectList
.
some
(
y
=>
y
.
plId
==
x
.
plId
)
!
this
.
evaluation_cycle
.
personalLevel
.
some
(
y
=>
y
.
plId
==
x
.
plId
)
);
}
selectPl
(
data
?:
PLModel
)
{
if
(
!
data
)
{
this
.
pl
.
selectList
.
splice
(
this
.
pl
.
selectIndex
,
1
);
this
.
evaluation_cycle
.
personalLevel
.
splice
(
this
.
pl
.
selectIndex
,
1
);
return
;
}
this
.
pl
.
selectList
[
this
.
pl
.
selectIndex
]
=
new
MyPLModel
(
data
);
if
(
this
.
pl
.
selectIndex
===
this
.
pl
.
selectList
.
length
-
1
)
{
this
.
pl
.
selectList
.
push
(
new
MyPLModel
());
this
.
evaluation_cycle
.
personalLevel
[
this
.
pl
.
selectIndex
]
=
new
MyPLModel
(
data
);
if
(
this
.
pl
.
selectIndex
===
this
.
evaluation_cycle
.
personalLevel
.
length
-
1
)
{
this
.
evaluation_cycle
.
personalLevel
.
push
(
new
MyPLModel
());
}
}
...
...
@@ -117,17 +105,8 @@ export class EvaluationCycleComponent {
next
:
response
=>
{
this
.
evaluation_cyclelist
=
response
.
map
(
x
=>
({
check
:
false
,
data
:
{
evaluationRoundId
:
x
.
evaluationRoundId
,
tdesc
:
x
.
tdesc
,
edesc
:
x
.
edesc
,
apsyear
:
x
.
apsyear
,
apsPeriodStart
:
x
.
apsPeriodStart
,
apsPeriodEnd
:
x
.
apsPeriodEnd
,
statusCode
:
new
MyStatusCodeModel
(
x
.
statusCode
||
{})
}
data
:
new
MyEvaluationCycleModel
(
x
)
}));
this
.
dataLoading
=
false
this
.
isDataListCheckedAll
=
false
this
.
dataListCheckAll
()
...
...
@@ -164,19 +143,13 @@ export class EvaluationCycleComponent {
return
match
;
});
}
setData
(
data
?:
DataModel
)
{
this
.
dataSelect
=
JSON
.
parse
(
JSON
.
stringify
(
data
||
{
evaluationRoundId
:
""
,
tdesc
:
""
,
edesc
:
""
,
apsyear
:
""
,
apsPeriodStart
:
""
,
apsPeriodEnd
:
""
,
statusCode
:
new
MyStatusCodeModel
({})
}));
setData
(
data
?:
EvaluationCycleModel
)
{
this
.
evaluation_cycle
=
new
MyEvaluationCycleModel
(
data
)
this
.
evaluation_cycle
.
personalLevel
.
push
(
new
MyPLModel
())
}
addevaluation_cycle
()
{
const
body
=
new
MyEvaluationCycleModel
({
evaluationRoundId
:
this
.
dataSelect
.
evaluationRoundId
,
tdesc
:
this
.
dataSelect
.
tdesc
,
edesc
:
this
.
dataSelect
.
edesc
,
apsyear
:
this
.
dataSelect
.
apsyear
,
apsPeriodStart
:
this
.
dataSelect
.
apsPeriodStart
,
apsPeriodEnd
:
this
.
dataSelect
.
apsPeriodEnd
,
statusCode
:
this
.
dataSelect
.
statusCode
})
this
.
evaluation_cycle
.
personalLevel
.
pop
()
const
body
=
new
MyEvaluationCycleModel
(
this
.
evaluation_cycle
)
this
.
dataLoading
=
true
this
.
evaluationCycleService
.
post
(
body
).
subscribe
({
next
:
response
=>
{
...
...
@@ -198,10 +171,11 @@ export class EvaluationCycleComponent {
deleteevaluation_cycle
()
{
let
body
:
EvaluationCycleModel
|
EvaluationCycleModel
[]
=
[]
if
(
this
.
dataSelect
.
evaluationRoundId
)
{
body
=
new
MyEvaluationCycleModel
({
evaluationRoundId
:
this
.
dataSelect
.
evaluationRoundId
,
tdesc
:
this
.
dataSelect
.
tdesc
,
edesc
:
this
.
dataSelect
.
edesc
,
apsyear
:
this
.
dataSelect
.
apsyear
,
apsPeriodStart
:
this
.
dataSelect
.
apsPeriodStart
,
apsPeriodEnd
:
this
.
dataSelect
.
apsPeriodEnd
,
statusCode
:
this
.
dataSelect
.
statusCode
})
if
(
this
.
evaluation_cycle
.
evaluationRoundId
)
{
this
.
evaluation_cycle
.
personalLevel
.
pop
()
body
=
new
MyEvaluationCycleModel
(
this
.
evaluation_cycle
)
}
else
{
body
=
this
.
evaluation_cyclelist
.
filter
(
x
=>
x
.
check
).
map
(
x
=>
new
MyEvaluationCycleModel
(
{
evaluationRoundId
:
x
.
data
.
evaluationRoundId
,
tdesc
:
x
.
data
.
tdesc
,
edesc
:
x
.
data
.
edesc
,
apsyear
:
x
.
data
.
apsyear
,
apsPeriodStart
:
x
.
data
.
apsPeriodStart
,
apsPeriodEnd
:
x
.
data
.
apsPeriodEnd
,
statusCode
:
x
.
data
.
statusCode
}
))
body
=
this
.
evaluation_cyclelist
.
filter
(
x
=>
x
.
check
).
map
(
x
=>
new
MyEvaluationCycleModel
(
x
.
data
))
}
this
.
dataLoading
=
true
this
.
evaluationCycleService
.
delete
(
body
).
subscribe
({
...
...
@@ -234,9 +208,8 @@ export class EvaluationCycleComponent {
if
(
this
.
modalStatus
==
'add'
)
{
this
.
setData
()
}
else
if
(
this
.
modalStatus
==
'edit'
)
{
this
.
setData
(
new
MyEvaluationCycleModel
({
evaluationRoundId
:
this
.
dataSelect
.
evaluationRoundId
}))
this
.
setData
(
new
MyEvaluationCycleModel
({
evaluationRoundId
:
this
.
evaluation_cycle
.
evaluationRoundId
}))
}
this
.
pl
.
selectList
=
[
new
MyPLModel
()]
}
openModal
(
id
:
string
,
evaluationRoundId
:
string
)
{
...
...
src/app/components/dashboard/dashboard-routing.module.ts
View file @
6f9dad8f
...
...
@@ -41,6 +41,7 @@ import { SelfEvaluationComponent } from '../performance-evaluation/self-evaluati
import
{
IdpEvalutionComponent
}
from
'../performance-evaluation/idp-evaluation/idp-evalution.component'
;
import
{
PmsGradeRegistrationComponent
}
from
'../performance-management-evaluation/pms-grade-registration/pms-pms-grade-registration.component'
;
import
{
DayTypeRegistryComponent
}
from
'../company-components/day-type-registry/day-type-registry.component'
;
import
{
TimeAttendanceComponent
}
from
'../performance-management-evaluation/time-attendance/time-attendance.component'
;
...
...
@@ -89,7 +90,8 @@ const routes: Routes = [
{
path
:
"grade-registration-sub"
,
title
:
'ทะเบียนเกรด'
,
component
:
PmsGradeRegistrationComponent
},
{
path
:
"setting-performance-evalution"
,
title
:
'การตั้งค่า'
,
component
:
SettingPerformanceEvalutionComponent
},
{
path
:
"self-evaluation"
,
title
:
'ประเมินตนเอง'
,
component
:
SelfEvaluationComponent
},
{
path
:
"day-type-registry"
,
title
:
'ประเมินตนเอง'
,
component
:
DayTypeRegistryComponent
}
{
path
:
"day-type-registry"
,
title
:
'ประเมินตนเอง'
,
component
:
DayTypeRegistryComponent
},
{
path
:
"time-attendance"
,
title
:
'ทะเบียนการประเมินเวลาทำงาน'
,
component
:
TimeAttendanceComponent
}
]
}
];
...
...
src/app/components/dashboard/dashboard.module.ts
View file @
6f9dad8f
...
...
@@ -155,6 +155,7 @@ import { DayTypeRegistryComponent } from '../company-components/day-type-registr
import
{
EventgrpService
}
from
'src/app/shared/services/eventgrp.service'
;
import
{
PmsEvaluationCycleService
}
from
'src/app/shared/services/pms-evaluation-cycle.service'
;
import
{
PmsEvaluationAssessmentService
}
from
'src/app/shared/services/pms-evaluation-assessment.service'
;
import
{
TimeAttendanceComponent
}
from
'../performance-management-evaluation/time-attendance/time-attendance.component'
;
export
const
MY_DATE_FORMATS
=
{
parse
:
{
...
...
@@ -278,7 +279,8 @@ export class CustomDateAdapter extends NativeDateAdapter {
PmsGradeManagementComponent
,
PmsGroupGradeComponent
,
PmsSubGradeRegistrationComponent
,
DayTypeRegistryComponent
DayTypeRegistryComponent
,
TimeAttendanceComponent
],
imports
:
[
CommonModule
,
...
...
src/app/components/performance-management-evaluation/evaluation-cycle-performance/management-evaluation-cycle/management-evaluation-cycle.component.html
View file @
6f9dad8f
...
...
@@ -254,27 +254,28 @@
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
id=
"input-label"
class=
"ti-form-input w-1/2"
[
ngClass
]="{'
bg-input-readonly
'
:modalStatus=
='edit'}"
[
readonly
]="
modalStatus=
='edit'"
[(
ngModel
)]="
dataSelect
.
pmsEvaluationRoundId
"
>
[(
ngModel
)]="
pmsMasfromEvaluation
.
pmsEvaluationRoundId
"
>
<label
for=
"detail_th"
class=
"ti-form-label mt-2rem"
>
รายละเอียดฝ่าย (ไทย)
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
id=
"detail_th"
class=
"ti-form-input h-16"
[(
ngModel
)]="
dataSelect
.
tdesc
"
>
<input
type=
"text"
id=
"detail_th"
class=
"ti-form-input h-16"
[(
ngModel
)]="
pmsMasfromEvaluation
.
tdesc
"
>
<label
for=
"detail_eng"
class=
"ti-form-label mt-2rem"
>
รายละเอียดฝ่าย (อังกฤษ)
</label>
<input
type=
"text"
id=
"detail_eng"
class=
"ti-form-input h-16"
[(
ngModel
)]="
dataSelect
.
edesc
"
>
<input
type=
"text"
id=
"detail_eng"
class=
"ti-form-input h-16"
[(
ngModel
)]="
pmsMasfromEvaluation
.
edesc
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
ปีการประเมิน
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
id=
"input-label"
class=
"ti-form-input w-1/2"
oninput=
"this.value = this.value.replace(/\D/g, '')"
[(
ngModel
)]="
dataSelect
.
apsyear
"
>
oninput=
"this.value = this.value.replace(/\D/g, '')"
[(
ngModel
)]="
pmsMasfromEvaluation
.
apsyear
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
เริ่มวันที่
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
dataSelect
.
apsPeriodStart
"
>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
pmsMasfromEvaluation
.
apsPeriodStart
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
สิ้นสุดวันที่
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
dataSelect
.
apsPeriodEnd
"
>
<input
type=
"date"
id=
"input-label"
class=
"ti-form-input w-1/2"
[(
ngModel
)]="
pmsMasfromEvaluation
.
apsPeriodEnd
"
>
<label
for=
"input-label"
class=
"ti-form-label mt-2rem"
>
ระดับพนักงาน (JL)
</label>
<div
*
ngFor=
"let item of p
l.selectList
;let i = index;let f=first"
[
class
.
mt-2
]="!
f
"
<div
*
ngFor=
"let item of p
msMasfromEvaluation.personalLevel
;let i = index;let f=first"
[
class
.
mt-2
]="!
f
"
class=
"col-span-6 sm:col-span-6 "
>
<div
class=
"flex"
>
<div
class=
"relative flex rounded-md"
>
...
...
@@ -303,8 +304,8 @@
</button>
<button
type=
"button"
class=
"ti-btn ti-btn-success"
data-hs-overlay=
"#management-evaluation-cycle-page-alert-modal"
[
class
.
ti-btn-disabled
]="!
dataSelect
.
pmsEvaluationRoundId
||!
dataSelect
.
tdesc
||!
dataSelect
.
apsyear
||!
dataSelect
.
apsPeriodStart
||!
dataSelect
.
apsPeriodEnd
"
[
disabled
]="!
dataSelect
.
pmsEvaluationRoundId
||!
dataSelect
.
tdesc
||!
dataSelect
.
apsyear
||!
dataSelect
.
apsPeriodStart
||!
dataSelect
.
apsPeriodEnd
"
>
[
class
.
ti-btn-disabled
]="!
pmsMasfromEvaluation
.
pmsEvaluationRoundId
||!
pmsMasfromEvaluation
.
tdesc
||!
pmsMasfromEvaluation
.
apsyear
||!
pmsMasfromEvaluation
.
apsPeriodStart
||!
pmsMasfromEvaluation
.
apsPeriodEnd
"
[
disabled
]="!
pmsMasfromEvaluation
.
pmsEvaluationRoundId
||!
pmsMasfromEvaluation
.
tdesc
||!
pmsMasfromEvaluation
.
apsyear
||!
pmsMasfromEvaluation
.
apsPeriodStart
||!
pmsMasfromEvaluation
.
apsPeriodEnd
"
>
บันทึกข้อมูล
</button>
</div>
...
...
src/app/components/performance-management-evaluation/evaluation-cycle-performance/management-evaluation-cycle/management-evaluation-cycle.component.ts
View file @
6f9dad8f
...
...
@@ -27,7 +27,6 @@ export class ManagementCycleComponent {
pmsMasfromEvaluationlist
:
{
check
:
boolean
,
data
:
PmsMasfromEvaluationModel
}[]
=
[]
pmsMasfromEvaluation
:
PmsMasfromEvaluationModel
=
new
MyPmsMasfromEvaluationModel
({})
dataLoading
=
false
dataSelect
:
PmsMasfromEvaluationModel
=
new
MyPmsMasfromEvaluationModel
()
itemToDelete
:
PmsMasfromEvaluationModel
|
null
=
null
;
isDataListChecked
=
false
isDataListCheckedAll
=
false
...
...
@@ -40,7 +39,7 @@ export class ManagementCycleComponent {
currentPage
:
1
,
page
:
Array
.
from
({
length
:
1
},
(
_
,
i
)
=>
i
+
1
)
}
pl
:
{
loading
:
boolean
,
select
List
:
PLModel
[],
selectIndex
:
number
,
dataList
:
PLModel
[]
}
=
{
loading
:
false
,
selectList
:
[
new
MyPLModel
()]
,
selectIndex
:
-
1
,
dataList
:
[]
}
pl
:
{
loading
:
boolean
,
select
Index
:
number
,
dataList
:
PLModel
[]
}
=
{
loading
:
false
,
selectIndex
:
-
1
,
dataList
:
[]
}
constructor
(
private
pmsMasfromEvaluationCycleService
:
PmsMasfromEvaluationCycleService
,
...
...
@@ -84,18 +83,18 @@ export class ManagementCycleComponent {
(
x
.
plId
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
())
||
x
.
tdesc
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
())
||
x
.
edesc
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
()))
&&
!
this
.
p
l
.
selectList
.
some
(
y
=>
y
.
plId
==
x
.
plId
)
!
this
.
p
msMasfromEvaluation
.
personalLevel
.
some
(
y
=>
y
.
plId
==
x
.
plId
)
);
}
selectPl
(
data
?:
PLModel
)
{
if
(
!
data
)
{
this
.
p
l
.
selectList
.
splice
(
this
.
pl
.
selectIndex
,
1
);
this
.
p
msMasfromEvaluation
.
personalLevel
.
splice
(
this
.
pl
.
selectIndex
,
1
);
return
;
}
this
.
p
l
.
selectList
[
this
.
pl
.
selectIndex
]
=
new
MyPLModel
(
data
);
if
(
this
.
pl
.
selectIndex
===
this
.
p
l
.
selectList
.
length
-
1
)
{
this
.
p
l
.
selectList
.
push
(
new
MyPLModel
());
this
.
p
msMasfromEvaluation
.
personalLevel
[
this
.
pl
.
selectIndex
]
=
new
MyPLModel
(
data
);
if
(
this
.
pl
.
selectIndex
===
this
.
p
msMasfromEvaluation
.
personalLevel
.
length
-
1
)
{
this
.
p
msMasfromEvaluation
.
personalLevel
.
push
(
new
MyPLModel
());
}
}
...
...
@@ -145,11 +144,14 @@ export class ManagementCycleComponent {
return
match
;
});
}
setData
(
data
?:
PmsMasfromEvaluationModel
)
{
this
.
dataSelect
=
new
MyPmsMasfromEvaluationModel
(
data
)
this
.
pmsMasfromEvaluation
=
new
MyPmsMasfromEvaluationModel
(
data
)
this
.
pmsMasfromEvaluation
.
personalLevel
.
push
(
new
MyPLModel
())
}
addPmsMasfromEvaluation
()
{
const
body
=
new
MyPmsMasfromEvaluationModel
(
this
.
dataSelect
)
this
.
pmsMasfromEvaluation
.
personalLevel
.
pop
()
const
body
=
new
MyPmsMasfromEvaluationModel
(
this
.
pmsMasfromEvaluation
)
this
.
dataLoading
=
true
this
.
pmsMasfromEvaluationCycleService
.
post
(
body
).
subscribe
({
next
:
response
=>
{
...
...
@@ -170,9 +172,10 @@ export class ManagementCycleComponent {
}
deletePmsMasfromEvaluation
()
{
let
body
:
PmsMasfromEvaluationModel
|
PmsMasfromEvaluationModel
[]
=
[]
if
(
this
.
dataSelect
.
pmsEvaluationRoundId
)
{
body
=
new
MyPmsMasfromEvaluationModel
(
this
.
dataSelect
)
let
body
:
PmsMasfromEvaluationModel
[]
=
[]
if
(
this
.
pmsMasfromEvaluation
.
pmsEvaluationRoundId
)
{
this
.
pmsMasfromEvaluation
.
personalLevel
.
pop
()
body
=
[
new
MyPmsMasfromEvaluationModel
(
this
.
pmsMasfromEvaluation
)]
}
else
{
body
=
this
.
pmsMasfromEvaluationlist
.
filter
(
x
=>
x
.
check
).
map
(
x
=>
new
MyPmsMasfromEvaluationModel
(
x
.
data
))
}
...
...
@@ -206,9 +209,8 @@ export class ManagementCycleComponent {
if
(
this
.
modalStatus
==
'add'
)
{
this
.
setData
()
}
else
if
(
this
.
modalStatus
==
'edit'
)
{
this
.
setData
(
new
MyPmsMasfromEvaluationModel
({
pmsEvaluationRoundId
:
this
.
dataSelect
.
pmsEvaluationRoundId
}))
this
.
setData
(
new
MyPmsMasfromEvaluationModel
({
pmsEvaluationRoundId
:
this
.
pmsMasfromEvaluation
.
pmsEvaluationRoundId
}))
}
this
.
pl
.
selectList
=
[
new
MyPLModel
()]
}
openModal
(
id
:
string
,
evaluationRoundId
:
string
)
{
...
...
src/app/components/performance-management-evaluation/time-attendance/time-attendance.component.html
0 → 100644
View file @
6f9dad8f
<app-page-header
[
pathTitle
]="
pathTitle
"
></app-page-header>
<div
class=
"bg-card-white"
>
</div>
<div
class=
"block-main-content"
>
<div
class=
"font-size-18px font-weight-700 pt-1.5rem text-primary px-2rem"
>
ทะเบียนการประเมินเวลาทำงาน
</div>
<div
class=
"page pt-0.75rem"
>
<div
class=
"border-b border-gray-200 dark:border-white/10 px-8"
>
<nav
class=
"-mb-0.5 flex space-x-6 rtl:space-x-reverse"
>
<a
class=
"font-size-16px font-weight-500 hs-tab-active:font-weight-700 hs-tab-active:border-secondary hs-tab-active:text-secondary pb-3 inline-flex items-center gap-2 border-b-[3px] border-transparent whitespace-nowrap text-gray-500 hover:text-secondary active"
href=
"javascript:void(0);"
id=
"underline-item-1"
data-hs-tab=
"#underline-1"
aria-controls=
"underline-1"
(
click
)="
pathTitle =
['การประเมินจัดการประสิทธิภาพ','ทะเบียนการประเมินเวลาทำงาน','การจัดการหัวข้อการประเมินเวลาทำงาน']"
>
การจัดการหัวข้อการประเมินเวลาทำงาน
</a>
</nav>
</div>
<div
class=
"px-2rem pt-50px !-mt-3 pt-50px"
>
<div
id=
"underline-1"
role=
"tabpanel"
aria-labelledby=
"underline-item-1"
>
<ng-container
*
ngTemplateOutlet=
"timeAttendance"
></ng-container>
</div>
</div>
</div>
</div>
<ng-template
#
timeAttendance
>
<div
class=
"w-full min-height-50px mb-10px justify-between items-center"
>
<div
class=
"flex justify-between"
>
<div
class=
"flex"
>
<div
class=
"flex items-center"
>
<input
type=
"checkbox"
class=
"ti-form-checkbox pointer-events-none"
id=
"hs-default-checkbox"
[(
ngModel
)]="
isDataListChecked
"
>
<label
for=
"hs-default-checkbox"
class=
"text-sm text-gray-500 mx-2 pointer-events-none"
>
{{numDataListChecked}} Selected
</label>
</div>
<div
class=
"mx-1 flex items-center"
>
<button
(
click
)="
isDataListCheckedAll =
!isDataListCheckedAll;dataListCheckAll()"
id=
"checkbox"
class=
"focus:ring-2 focus:ring-primary rounded-sm flex item-center"
>
<i
class=
"fs-l transition-all duration-200"
[
ngClass
]="{'
ri-checkbox-multiple-line
text-gray-500
'
:
!
isDataListCheckedAll
,
'
ri-checkbox-multiple-fill
text-primary
'
:
isDataListCheckedAll
}"
></i>
</button>
<label
class=
"text-sm text-gray-500 ml-2"
for=
"checkbox"
>
Select All
</label>
</div>
</div>
<div
class=
"flex justify-end"
>
<div
class=
"px-1"
>
<div
class=
"relative shadow-md"
>
<input
type=
"text"
class=
"ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder=
"Search by No. or Name"
style=
"height: 40px;"
[(
ngModel
)]="
search
"
(
ngModelChange
)="
searchChange
()"
>
<div
class=
"absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4"
>
<i
class=
"ri-search-line text-gray"
></i>
</div>
</div>
</div>
<div
class=
"px-1"
>
<button
type=
"button"
class=
"ti-btn ti-btn-soft-secondary h-10 m-0 shadow-md"
(
click
)="
modalStatus=
'add'
;
selectData
()"
data-hs-overlay=
"#time-attendance-modal"
>
<i
class=
"ri-add-line"
></i>
Add
</button>
</div>
<div
class=
"px-1"
>
<button
href=
"javascript:void(0);"
class=
"ti-btn ti-btn-soft-danger h-10 m-0 shadow-md"
(
click
)="
modalStatus=
'deleteGroup'
;
selectData
()"
data-hs-overlay=
"#time-attendance-alert-modal"
>
<i
class=
"ri-delete-bin-6-line"
></i>
Delete
</button>
</div>
<div
class=
"px-1"
>
<button
href=
"javascript:void(0);"
class=
"ti-btn ti-btn-soft-warning h-10 m-0 shadow-md"
>
<i
class=
"ti ti-book fs-l"
></i>
Help
</button>
</div>
</div>
</div>
</div>
<div
class=
"page px-rem"
>
<div
class=
"overflow-auto table-bordered rounded-top-0.65rem"
>
<table
class=
"ti-custom-table ti-custom-table-head ti-custom-table-hover"
>
<thead
class=
"height-50px"
>
<tr
class=
"font-size-12px"
>
<ng-container
*
ngFor=
"let item of ['','รหัส','ชื่อหัวข้อ','หน่วยนับ','น้ำหนัก','Action']; 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=
"font-size-12px font-weight-700"
>
{{ item }}
</span>
<div
class=
"absolute top-1/2 transform -translate-y-1/2 right-0"
*
ngIf=
"!f && !l"
>
<i
class=
"ti ti-dots-vertical fs-l"
></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody
*
ngIf=
"!dataListFilter().length"
>
<tr>
<td
class=
"text-center"
colspan=
"100%"
>
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody
*
ngIf=
"dataListFilter().length"
>
<tr
*
ngFor=
"let item of dataListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index"
>
<!-- <td class="text-center">
<input type="checkbox" class="ti-form-checkbox cursor-pointer" [(ngModel)]="item.check"
(ngModelChange)="dataListCheck()" id="checkbox-{{item.code}}">
</td>
<td class="text-center">
<label for="checkbox-{{item.code}}"> {{item.code}}</label>
</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
<td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" (click)="modalStatus='edit';selectData(item)"></i>
<i class="ti ti-trash cursor-pointer i-gray fs-l px-1" (click)="modalStatus='delete';selectData(item)"></i>
</td> -->
</tr>
</tbody>
</table>
</div>
<nav
class=
"pagination-style-3 overflow-auto my-5"
*
ngIf=
"page.length"
>
<ul
class=
"ti-pagination"
>
<li>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
(
click
)="
currentPage =
(currentPage-1
||
1
)"
>
<i
class=
"ri-arrow-left-s-line align-middle rtl:rotate-180"
></i>
</a>
</li>
<li
*
ngFor=
"let item of page;let f = first;let l = last"
>
<ng-container
*
ngIf=
"item==3&¤tPage!=1&¤tPage!=2&¤tPage!=3"
>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
><i
class=
"ri-more-line"
></i>
</a>
</ng-container>
<ng-container
*
ngIf=
"(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)"
>
<a
class=
"page-link"
href=
"javascript:void(0);"
[
class
.
active
]="
item=
=currentPage"
(
click
)="
currentPage=
item"
>
{{item}}
</a>
</ng-container>
<ng-container
*
ngIf=
"item==page.length-2&¤tPage!=page.length&¤tPage!=page.length-1&¤tPage!=page.length-2"
>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
><i
class=
"ri-more-line"
></i>
</a>
</ng-container>
</li>
<li>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
(
click
)="
currentPage =
(currentPage
>
page.length-1 ? currentPage: currentPage+1 )">
<i
class=
"ri-arrow-right-s-line align-middle rtl:rotate-180"
></i>
</a>
</li>
</ul>
<ul
class=
"nav-tabs mt-3"
>
<span>
Show {{((currentPage-1) * 10)+1}} to {{dataListFilter().length
<10
?
dataListFilter
().
length:
(
currentPage=
=page.length
?
((
currentPage
*
10
)
-
((
currentPage
*
10
)
-
dataListFilter
().
length
)
)
:
(
currentPage
*
10
)
)
}}
of
{{
dataListFilter
().
length
}}
items
</
span
>
</ul>
</nav>
</div>
</ng-template>
<div
id=
"time-attendance-modal"
class=
"hs-overlay hidden ti-modal"
>
<div
class=
"hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] !max-w-1/2"
>
<div
class=
"max-h-full overflow-hidden ti-modal-content"
>
<div
class=
"ti-modal-header"
>
<h3
class=
"text-xxl font-bold text-primary"
>
{{modalStatus=='add'?'เพิ่มข้อมูลประเภทวัน':'แก้ไขข้อมูลประเภทวัน'}}
</h3>
<div
class=
"flex justify-end"
>
<button
type=
"button"
class=
"hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay=
"#time-attendance-modal"
>
<span
class=
"sr-only"
>
Close
</span>
<i
class=
"ti ti-circle-x fs-xxl"
></i>
</button>
</div>
</div>
<div
class=
"w-full flex justify-end"
>
<div
class=
"absolute flex"
>
<div
class=
"px-1"
>
<button
type=
"button"
class=
"ti-btn ti-btn-soft-indigo h-45px m-0 shadow-md"
(
click
)="
clearData
(
modalStatus
)"
>
<svg
class=
"svg-indigo"
width=
"16"
height=
"16"
viewBox=
"0 0 64.00 64.00"
xmlns=
"http://www.w3.org/2000/svg"
fill=
"none"
stroke=
"#595BEA"
stroke-width=
"3.84"
transform=
"rotate(45)matrix(-1, 0, 0, 1, 0, 0)"
>
<g
id=
"SVGRepo_bgCarrier"
stroke-width=
"0"
></g>
<g
id=
"SVGRepo_tracerCarrier"
stroke-linecap=
"round"
stroke-linejoin=
"round"
></g>
<g
id=
"SVGRepo_iconCarrier"
>
<path
d=
"M15 49A24 24 0 0 1 32 8"
></path>
<path
d=
"M49 15a24 24 0 0 1-17 41"
></path>
<polyline
points=
"15.03 40 15.03 48.97 8 48.97"
></polyline>
<polyline
points=
"48.97 24 48.97 15.03 56 15.03"
></polyline>
</g>
</svg>
Clear
</button>
</div>
<div
class=
"px-1"
>
<button
href=
"javascript:void(0);"
class=
"ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"
>
<i
class=
"ti ti-book fs-l"
></i>
Help
</button>
</div>
</div>
</div>
<div
class=
"ti-modal-body padding-16px pt-0 overflow-y-0"
>
<label
class=
"ti-form-label mt-2rem"
>
รหัสประเภทวัน
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
class=
"ti-form-input w-1/2"
[
ngClass
]="{'
bg-input-readonly
'
:modalStatus=
='edit'}"
[
readonly
]="
modalStatus=
='edit'"
>
<label
class=
"ti-form-label mt-2rem"
>
รหัสประเภทวัน
<span
class=
"text-danger"
>
*
</span></label>
<div
*
ngFor=
"let item of eventgrp.selectList; let i=index;let f=first"
[
class
.
mt-2
]="!
f
"
class=
"col-span-6 sm:col-span-6 "
>
<div
class=
"flex"
>
<div
class=
"relative flex rounded-sm w-2/3"
>
<input
type=
"text"
name=
"hs-leading-button-add-on-with-icon-and-button"
class=
"ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10"
readonly
style=
"padding-right: 2.5rem;"
[(
ngModel
)]="
item
.
tdesc
"
>
<div
class=
"absolute inset-y-0 ltr:right-0 rtl:left-0 flex items-center z-20 ltr:pr-4 rtl:pl-4 space-x-2"
>
<button
type=
"button"
class=
"flex items-center text-red-500"
(
click
)="
eventgrp
.
selectIndex=
i;selectEventgrp()"
>
<i
class=
"ti ti-circle-x cursor-pointer"
></i>
</button>
<button
type=
"button"
class=
"flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay=
"#time-attendance-eventgrp-table-modal"
(
click
)="
eventgrp
.
selectIndex=
i"
>
<i
class=
"ri-search-line cursor-pointer text-gray"
></i>
</button>
</div>
</div>
</div>
</div>
<label
class=
"ti-form-label mt-2rem"
>
ชื่อหัวข้อ (ไทย)
<span
class=
"text-danger"
>
*
</span></label>
<input
type=
"text"
class=
"ti-form-input"
>
<label
class=
"ti-form-label mt-2rem"
>
ชื่อหัวข้อ (อังกฤษ)
</label>
<input
type=
"text"
class=
"ti-form-input"
>
<label
class=
"ti-form-label mt-2rem"
>
เป้าหมายผลงาน
</label>
<input
type=
"text"
class=
"ti-form-input"
>
<label
class=
"ti-form-label mt-2rem"
>
น้ำหนัก
</label>
<input
type=
"text"
class=
"ti-form-input"
>
<label
class=
"ti-form-label mt-2rem"
>
ค่าเป้าหมาย
</label>
<div
class=
"grid grid-cols-1 gap-y-2"
>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
A (5 คะแนน) ชื่อ
</label>
<input
type=
"text"
class=
"ti-form-input col-span-10"
>
</div>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
เงื่อนไข ช่วงระหว่าง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
<label
class=
"ti-form-label col-span-1 align-center text-center m-0"
>
ถึง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
</div>
</div>
<div
class=
"grid grid-cols-1 gap-y-2 mt-2rem"
>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
B (4 คะแนน) ชื่อ
</label>
<input
type=
"text"
class=
"ti-form-input col-span-10"
>
</div>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
เงื่อนไข ช่วงระหว่าง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
<label
class=
"ti-form-label col-span-1 align-center text-center m-0"
>
ถึง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
</div>
</div>
<div
class=
"grid grid-cols-1 gap-y-2 mt-2rem"
>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
C (3 คะแนน) ชื่อ
</label>
<input
type=
"text"
class=
"ti-form-input col-span-10"
>
</div>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
เงื่อนไข ช่วงระหว่าง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
<label
class=
"ti-form-label col-span-1 align-center text-center m-0"
>
ถึง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
</div>
</div>
<div
class=
"grid grid-cols-1 gap-y-2 mt-2rem"
>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
D (2 คะแนน) ชื่อ
</label>
<input
type=
"text"
class=
"ti-form-input col-span-10"
>
</div>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
เงื่อนไข ช่วงระหว่าง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
<label
class=
"ti-form-label col-span-1 align-center text-center m-0"
>
ถึง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
</div>
</div>
<div
class=
"grid grid-cols-1 gap-y-2 mt-2rem"
>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
E (1 คะแนน) ชื่อ
</label>
<input
type=
"text"
class=
"ti-form-input col-span-10"
>
</div>
<div
class=
"col-span-1 grid grid-cols-12 gap-x-2"
>
<label
class=
"ti-form-label col-span-2 align-center m-0"
>
เงื่อนไข ช่วงระหว่าง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
<label
class=
"ti-form-label col-span-1 align-center text-center m-0"
>
ถึง
</label>
<input
type=
"text"
class=
"ti-form-input col-span-2"
>
</div>
</div>
<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=
"#time-attendance-modal"
>
ย้อนกลับ
</button>
<button
type=
"button"
class=
"ti-btn ti-btn-success"
data-hs-overlay=
"#time-attendance-alert-modal"
[
class
.
ti-btn-disabled
]="
false
"
[
disabled
]="
false
"
>
บันทึกข้อมูล
</button>
</div>
</div>
</div>
</div>
</div>
<div
id=
"time-attendance-alert-modal"
class=
"hs-overlay hidden ti-modal"
>
<div
class=
"hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center"
>
<div
class=
"max-h-full overflow-hidden ti-modal-content w-full"
>
<div
class=
"ti-modal-header"
>
<h3
class=
"text-xxl font-bold text-primary"
>
แจ้งเตือน
</h3>
<div
class=
"flex justify-end"
>
<ng-container
*
ngIf=
"modalStatus=='add'||modalStatus=='edit'"
>
<button
type=
"button"
class=
"hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay=
"#time-attendance-modal"
>
<span
class=
"sr-only"
>
Close
</span>
<i
class=
"ti ti-circle-x fs-xxl"
></i>
</button>
</ng-container>
<ng-container
*
ngIf=
"modalStatus=='delete'||modalStatus=='deleteGroup'"
>
<button
type=
"button"
class=
"hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay=
"#time-attendance-alert-modal"
>
<span
class=
"sr-only"
>
Close
</span>
<i
class=
"ti ti-circle-x fs-xxl"
></i>
</button>
</ng-container>
</div>
</div>
<div
class=
"ti-modal-body "
>
<p
class=
"mt-1 text-gray-800 dark:text-white/70"
>
<ng-container
*
ngIf=
"modalStatus=='add'||modalStatus=='edit'"
>
ยืนยันการบันทึกข้อมูลหรือไม่
</ng-container>
<ng-container
*
ngIf=
"modalStatus=='delete'||modalStatus=='deleteGroup'"
>
ยืนยันการลบข้อมูลหรือไม่
</ng-container>
</p>
<div
class=
"flex justify-end mt-2rem mb-1rem"
>
<ng-container
*
ngIf=
"modalStatus=='add'||modalStatus=='edit'"
>
<button
type=
"button"
class=
"hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay=
"#time-attendance-modal"
>
ย้อนกลับ
</button>
<a
class=
"ti-btn ti-btn-success"
href=
"javascript:void(0);"
data-hs-overlay=
"#time-attendance-alert-modal"
>
บันทึกข้อมูล
</a>
</ng-container>
<ng-container
*
ngIf=
"modalStatus=='delete'||modalStatus=='deleteGroup'"
>
<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=
"#time-attendance-alert-modal"
>
ย้อนกลับ
</button>
<a
class=
"ti-btn ti-btn-danger"
href=
"javascript:void(0);"
data-hs-overlay=
"#time-attendance-alert-modal"
>
ลบข้อมูล
</a>
</ng-container>
</div>
</div>
</div>
</div>
</div>
<div
id=
"time-attendance-eventgrp-table-modal"
class=
"hs-overlay hidden ti-modal"
>
<div
class=
"hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out lg:!max-w-4xl lg:w-full m-3 lg:!mx-auto"
>
<div
class=
"max-h-full overflow-hidden ti-modal-content"
>
<div
class=
"ti-modal-header"
>
<h3
class=
"text-xxl font-bold text-primary"
>
รายการทะเบียนประเภทวัน
</h3>
<div
class=
"flex justify-end"
>
<button
type=
"button"
class=
"hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay=
"#time-attendance-modal"
>
<span
class=
"sr-only"
>
Close
</span>
<i
class=
"ti ti-circle-x fs-xxl"
></i>
</button>
</div>
</div>
<div
class=
"ti-modal-body"
>
<div
class=
"flex justify-end pb-1rem"
>
<div
class=
"px-1"
>
<div
class=
"relative shadow-md"
>
<input
type=
"text"
class=
"ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder=
"Search by No. or Name"
[(
ngModel
)]="
modal
.
search
"
(
ngModelChange
)="
modalSearchChange
(
eventgrpListFilter
())"
>
<div
class=
"absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4"
>
<i
class=
"ri-search-line text-gray"
></i>
</div>
</div>
</div>
</div>
<div
class=
"overflow-auto border"
>
<table
class=
"ti-custom-table ti-custom-table-head ti-custom-table-hover"
>
<thead>
<tr>
<ng-container
*
ngFor=
"let item of ['ประเภทวัน','รายละเอียด(ไทย) ','รายละเอียด(อังกฤษ)']; let f = first; let l = last"
>
<th
scope=
"col"
class=
"relative px-10px py-10px bg-soft-secondary text-primary"
>
<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-l"
></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody
*
ngIf=
"eventgrp.loading"
>
<tr>
<td
class=
"text-center"
colspan=
"100%"
>
<div
*
ngFor=
"let item of [1,2,3]"
class=
"ti-spinner w-8 h-8 text-secondary mx-1"
role=
"status"
aria-label=
"loading"
>
<span
class=
"sr-only"
>
Loading...
</span>
</div>
</td>
</tr>
</tbody>
<tbody
*
ngIf=
"!eventgrp.loading&&!eventgrpListFilter().length"
>
<tr>
<td
class=
"text-center"
colspan=
"100%"
>
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody
*
ngIf=
"!eventgrp.loading&&eventgrpListFilter().length"
>
<tr
*
ngFor=
"let item of eventgrpListFilter() | slice:((modal.currentPage-1) * 10) : (((modal.currentPage-1) * 10) + 10);let i = index"
class=
"cursor-pointer"
(
click
)="
selectEventgrp
(
item
.
data
)"
data-hs-overlay=
"#time-attendance-modal"
>
<td>
{{item.data.eventgrpId}}
</td>
<td>
{{item.data.tdesc}}
</td>
<td>
{{item.data.edesc}}
</td>
</tr>
</tbody>
</table>
</div>
<nav
class=
"pagination-style-3 my-5"
*
ngIf=
"modal.page.length"
>
<ul
class=
"ti-pagination"
>
<li>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
(
click
)="
modal
.
currentPage =
(modal.currentPage-1
||
1
)"
>
<i
class=
"ri-arrow-left-s-line align-middle rtl:rotate-180"
></i>
</a>
</li>
<li
*
ngFor=
"let item of modal.page;let f = first;let l = last"
>
<ng-container
*
ngIf=
"item==3&&modal.currentPage!=1&&modal.currentPage!=2&&modal.currentPage!=3"
>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
><i
class=
"ri-more-line"
></i>
</a>
</ng-container>
<ng-container
*
ngIf=
"(f||l)||(item==modal.currentPage-1||item==modal.currentPage||item==modal.currentPage+1)"
>
<a
class=
"page-link"
href=
"javascript:void(0);"
[
class
.
active
]="
item=
=modal.currentPage"
(
click
)="
modal
.
currentPage=
item"
>
{{item}}
</a>
</ng-container>
<ng-container
*
ngIf=
"item==modal.page.length-2&&modal.currentPage!=modal.page.length&&modal.currentPage!=modal.page.length-1&&modal.currentPage!=modal.page.length-2"
>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
><i
class=
"ri-more-line"
></i>
</a>
</ng-container>
</li>
<li>
<a
aria-label=
"anchor"
class=
"page-link"
href=
"javascript:void(0);"
(
click
)="
modal
.
currentPage =
(modal.currentPage
>
modal.page.length-1 ? modal.currentPage: modal.currentPage+1 )">
<i
class=
"ri-arrow-right-s-line align-middle rtl:rotate-180"
></i>
</a>
</li>
</ul>
<ul
class=
"nav-tabs mt-3"
>
<span>
Show {{((modal.currentPage-1) * 10)+1}} to {{eventgrpListFilter().length
<10
?
eventgrpListFilter
().
length:
(
modal
.
currentPage=
=modal.page.length
?
((
modal
.
currentPage
*
10
)
-
((
modal
.
currentPage
*
10
)
-
eventgrpListFilter
().
length
)
)
:
(
modal
.
currentPage
*
10
)
)
}}
of
{{
eventgrpListFilter
().
length
}}
items
</
span
>
</ul>
</nav>
<div
class=
"flex justify-end mt-2rem mb-1rem space-x-4"
>
<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=
"#time-attendance-modal"
>
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/components/performance-management-evaluation/time-attendance/time-attendance.component.scss
0 → 100644
View file @
6f9dad8f
src/app/components/performance-management-evaluation/time-attendance/time-attendance.component.ts
0 → 100644
View file @
6f9dad8f
import
{
ChangeDetectorRef
,
Component
}
from
'@angular/core'
;
import
{
ToastrService
}
from
'ngx-toastr'
;
import
{
EventgrpModel
,
MyEventgrpModel
}
from
'src/app/shared/model/eventgrp.model'
;
import
{
EventgrpService
}
from
'src/app/shared/services/eventgrp.service'
;
import
{
FileService
}
from
'src/app/shared/services/file.service'
;
interface
table
{
currentPage
:
number
,
page
:
number
[],
search
:
string
}
@
Component
({
selector
:
'app-time-attendance'
,
templateUrl
:
'./time-attendance.component.html'
,
styleUrls
:
[
'./time-attendance.component.scss'
]
})
export
class
TimeAttendanceComponent
{
pathTitle
=
[
'การประเมินจัดการประสิทธิภาพ'
,
'ทะเบียนการประเมินเวลาทำงาน'
,
'การจัดการหัวข้อการประเมินเวลาทำงาน'
]
numDataListChecked
=
0
isDataListChecked
=
false
isDataListCheckedAll
=
false
currentPage
=
1
;
page
=
Array
.
from
({
length
:
1
},
(
_
,
i
)
=>
i
+
1
);
search
=
''
;
modalStatus
:
"add"
|
"edit"
|
"delete"
|
"deleteGroup"
=
"add"
modal
:
table
=
{
currentPage
:
1
,
page
:
Array
.
from
({
length
:
1
},
(
_
,
i
)
=>
i
+
1
),
search
:
""
}
eventgrp
:
{
loading
:
boolean
,
selectIndex
:
number
,
selectList
:
EventgrpModel
[],
dataList
:
{
check
:
boolean
,
data
:
EventgrpModel
}[]
}
=
{
loading
:
false
,
selectIndex
:
-
1
,
selectList
:
[
new
MyEventgrpModel
()],
dataList
:
[]
}
constructor
(
private
toastr
:
ToastrService
,
private
cdr
:
ChangeDetectorRef
,
private
fileService
:
FileService
,
private
eventgrpService
:
EventgrpService
)
{
}
ngOnInit
():
void
{
this
.
getEventgrpList
()
}
getEventgrpList
()
{
this
.
eventgrp
.
loading
=
true
this
.
eventgrpService
.
getList
().
subscribe
({
next
:
response
=>
{
this
.
eventgrp
.
dataList
=
response
.
map
(
x
=>
({
check
:
false
,
data
:
new
MyEventgrpModel
(
x
)
}))
this
.
eventgrp
.
loading
=
false
this
.
isDataListCheckedAll
=
false
this
.
dataListCheckAll
()
this
.
searchChange
()
this
.
cdr
.
detectChanges
();
},
error
:
error
=>
{
this
.
eventgrp
.
loading
=
false
this
.
cdr
.
detectChanges
()
}
})
}
eventgrpListFilter
()
{
return
this
.
eventgrp
.
dataList
.
filter
(
x
=>
{
const
data
=
x
.
data
const
match
=
data
.
eventgrpId
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
())
||
data
.
tdesc
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
())
||
data
.
edesc
.
toLowerCase
().
includes
(
this
.
modal
.
search
.
toLowerCase
());
return
match
;
})
}
selectEventgrp
(
data
?:
EventgrpModel
)
{
if
(
!
data
)
{
this
.
eventgrp
.
selectList
.
splice
(
this
.
eventgrp
.
selectIndex
,
1
);
return
;
}
this
.
eventgrp
.
selectList
[
this
.
eventgrp
.
selectIndex
]
=
new
MyEventgrpModel
(
data
);
if
(
this
.
eventgrp
.
selectIndex
===
this
.
eventgrp
.
selectList
.
length
-
1
)
{
this
.
eventgrp
.
selectList
.
push
(
new
MyEventgrpModel
());
}
}
dataListFilter
()
{
// return this.pmsGrade.dataList.filter((x) => {
// const data = x.data
// const match = data.gradeId.toLowerCase().includes(this.search.toLowerCase()) || data.tdesc.toLowerCase().includes(this.search.toLowerCase()) || data.edesc.toLowerCase().includes(this.search.toLowerCase());
// return match;
// });
return
[]
}
dataListCheckAll
()
{
// const selectAll = this.isDataListCheckedAll;
// this.dataListFilter().forEach(x => x.check = selectAll);
// this.dataListCheck();
}
dataListCheck
()
{
// const dataCheck = this.dataListFilter();
// this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
// this.numDataListChecked = this.pmsGrade.dataList.filter(x => x.check).length;
// this.isDataListChecked = Boolean(this.numDataListChecked)
}
searchChange
()
{
this
.
currentPage
=
1
;
const
filteredData
=
this
.
dataListFilter
();
this
.
page
=
Array
.
from
({
length
:
Math
.
ceil
(
filteredData
.
length
/
10
)
},
(
_
,
i
)
=>
i
+
1
);
this
.
dataListCheck
();
}
selectData
()
{
}
clearData
(
modalStatus
:
string
)
{
if
(
modalStatus
==
'add'
)
{
}
else
if
(
modalStatus
==
'edit'
)
{
}
this
.
eventgrp
.
selectList
=
[
new
MyEventgrpModel
()]
}
modalSearchChange
(
dataList
:
any
)
{
this
.
modal
.
currentPage
=
1
this
.
modal
.
page
=
Array
.
from
({
length
:
Math
.
ceil
(
dataList
.
length
/
10
)
},
(
_
,
i
)
=>
i
+
1
);
}
}
src/app/shared/model/evaluation-cycle.model.ts
View file @
6f9dad8f
import
{
MyPLModel
,
PLModel
}
from
"./pl.model"
;
import
{
MyStatusCodeModel
,
StatusCodeModel
}
from
"./status-code.model"
;
export
interface
EvaluationCycleModel
{
...
...
@@ -9,6 +10,7 @@ export interface EvaluationCycleModel {
apsPeriodStart
:
string
apsPeriodEnd
:
string
statusCode
:
StatusCodeModel
personalLevel
:
PLModel
[]
}
...
...
@@ -21,6 +23,7 @@ export class MyEvaluationCycleModel implements EvaluationCycleModel {
apsPeriodStart
:
string
apsPeriodEnd
:
string
statusCode
:
StatusCodeModel
personalLevel
:
PLModel
[]
constructor
(
data
?:
Partial
<
EvaluationCycleModel
>
)
{
this
.
evaluationRoundId
=
data
?.
evaluationRoundId
||
""
;
this
.
companyId
=
data
?.
companyId
||
""
;
...
...
@@ -30,6 +33,7 @@ export class MyEvaluationCycleModel implements EvaluationCycleModel {
this
.
apsPeriodStart
=
data
?.
apsPeriodStart
||
""
;
this
.
apsPeriodEnd
=
data
?.
apsPeriodEnd
||
""
;
this
.
statusCode
=
new
MyStatusCodeModel
(
data
?.
statusCode
||
{})
this
.
personalLevel
=
data
?.
personalLevel
?.
map
(
x
=>
new
MyPLModel
(
x
))
||
[]
}
}
src/app/shared/model/pms-masfrom-evaluation.model.ts
View file @
6f9dad8f
import
{
PLModel
,
MyPLModel
}
from
"./pl.model"
;
import
{
MyStatusCodeModel
,
StatusCodeModel
}
from
"./status-code.model"
;
export
interface
PmsMasfromEvaluationModel
{
...
...
@@ -10,6 +11,7 @@ export interface PmsMasfromEvaluationModel {
apsPeriodEnd
:
string
statusCode
:
StatusCodeModel
active
:
boolean
personalLevel
:
PLModel
[]
}
export
class
MyPmsMasfromEvaluationModel
implements
PmsMasfromEvaluationModel
{
...
...
@@ -22,6 +24,7 @@ export class MyPmsMasfromEvaluationModel implements PmsMasfromEvaluationModel {
apsPeriodEnd
:
string
statusCode
:
StatusCodeModel
active
:
boolean
personalLevel
:
PLModel
[]
constructor
(
data
?:
Partial
<
PmsMasfromEvaluationModel
>
)
{
this
.
pmsEvaluationRoundId
=
data
?.
pmsEvaluationRoundId
||
""
;
this
.
companyId
=
data
?.
companyId
||
""
;
...
...
@@ -32,6 +35,7 @@ export class MyPmsMasfromEvaluationModel implements PmsMasfromEvaluationModel {
this
.
apsPeriodEnd
=
data
?.
apsPeriodEnd
||
""
;
this
.
active
=
data
?.
active
||
false
this
.
statusCode
=
new
MyStatusCodeModel
(
data
?.
statusCode
)
this
.
personalLevel
=
data
?.
personalLevel
?.
map
(
x
=>
new
MyPLModel
(
x
))
||
[]
}
}
src/app/shared/services/navservice.ts
View file @
6f9dad8f
...
...
@@ -151,6 +151,7 @@ export class NavService implements OnDestroy {
children
:
[
{
path
:
'/name-registration-perfomance'
,
title
:
'ทะเบียนกำหนดชื่อ'
,
type
:
'link'
},
{
path
:
'/grade-registration-sub'
,
title
:
'ทะเบียนเกรด'
,
type
:
'link'
},
{
path
:
'/time-attendance'
,
title
:
'ทะเบียนการประเมินเวลาทำงาน'
,
type
:
'link'
},
{
path
:
'/evaluation-factors'
,
title
:
'ปัจจัยการประเมินผล'
,
type
:
'link'
},
{
path
:
'/assessment-management'
,
title
:
'การจัดการการประเมิน'
,
type
:
'link'
},
{
path
:
'/evaluation-cycle-performance'
,
title
:
'รอบการประเมิน'
,
type
:
'link'
},
...
...
src/assets/css/style.css
View file @
6f9dad8f
...
...
@@ -24923,11 +24923,17 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
-webkit-text-security
:
disc
;
/* Safari, Chrome */
}
.cursor-not-allowed
{
cursor
:
not-allowed
.cursor-not-allowed
{
cursor
:
not-allowed
;
}
.
\
!
max-w-3
\
/
4
{
max-width
:
75%
!important
;
}
.
\
!
max-w-1
\
/
2
{
max-width
:
50%
!important
;
}
.max-w-1
\
/
2
{
max-width
:
50%
!important
;
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment