Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
M
myAppraisal
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
myAppraisal
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
Hide 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