Merge branch 'develop' into devTee
This commit is contained in:
STW_TTTY\stwtt
commit
0c4b8072a1
74 changed files with 5842 additions and 2116 deletions
|
|
@ -1,3 +1,4 @@
|
|||
divdivdivdivdivdivdiv
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { QForm, useQuasar } from "quasar";
|
||||
|
|
@ -264,407 +265,411 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<q-form @submit.prevent greedy @validation-success="onSubmit()">
|
||||
<div>
|
||||
<div class="row q-col-gutter-md q-pa-md">
|
||||
<div class="col-2" v-if="editCheck">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.including"
|
||||
label="ลำดับ/รหัสตัวชี้วัด"
|
||||
bg-color="white"
|
||||
readonly
|
||||
dense
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
<div :class="`${editCheck ? 'col-6' : 'col-8'}`">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.includingName"
|
||||
label="ชื่อตัวชี้วัด"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกชิ่อตัวชี้วัด'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="year"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
:model-value="!!year ? year + 543 : null"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="year"
|
||||
name="cancel"
|
||||
class="cursor-pointer"
|
||||
@click.stop.prevent="year = 0"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<q-select
|
||||
ref="inputRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="planData.period"
|
||||
:options="roundOp"
|
||||
label="รอบการประเมิน"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
map-options
|
||||
emit-value
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.target"
|
||||
label="ค่าเป้าหมาย"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกค่าเป้าหมาย'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.unit"
|
||||
label="หน่วยนับ"
|
||||
bg-color="white"
|
||||
dense
|
||||
lazy-rules
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกหน่วยนับ'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.weight"
|
||||
label="น้ำหนัก"
|
||||
type="number"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกน้ำหนัก'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-6">
|
||||
<q-card flat bordered>
|
||||
<q-card bordered>
|
||||
<q-card-actions class="bg-grey-3 row">
|
||||
<q-card>
|
||||
<q-form @submit.prevent greedy @validation-success="onSubmit()">
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-md q-pa-md">
|
||||
<div class="col-2" v-if="editCheck">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.including"
|
||||
label="ลำดับ/รหัสตัวชี้วัด"
|
||||
bg-color="white"
|
||||
readonly
|
||||
dense
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
<div :class="`${editCheck ? 'col-6' : 'col-8'}`">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.includingName"
|
||||
label="ชื่อตัวชี้วัด"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกชิ่อตัวชี้วัด'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="year"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
:model-value="!!year ? year + 543 : null"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="year"
|
||||
name="cancel"
|
||||
class="cursor-pointer"
|
||||
@click.stop.prevent="year = 0"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<q-select
|
||||
ref="inputRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="planData.period"
|
||||
:options="roundOp"
|
||||
label="รอบการประเมิน"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
map-options
|
||||
emit-value
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.target"
|
||||
label="ค่าเป้าหมาย"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกค่าเป้าหมาย'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.unit"
|
||||
label="หน่วยนับ"
|
||||
bg-color="white"
|
||||
dense
|
||||
lazy-rules
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกหน่วยนับ'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.weight"
|
||||
label="น้ำหนัก"
|
||||
type="number"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกน้ำหนัก'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-6">
|
||||
<q-card flat bordered>
|
||||
<q-card bordered>
|
||||
<q-card-actions class="bg-grey-3 row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>ระดับคะแนน</div>
|
||||
</div>
|
||||
<div class="col-8 q-px-xl">ผลสำเร็จของงาน</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>ระดับคะแนน</div>
|
||||
<div>5</div>
|
||||
</div>
|
||||
<div class="col-8 q-px-xl">ผลสำเร็จของงาน</div>
|
||||
</q-card-actions>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement5"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>4</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement4"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>3</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement3"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>2</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement2"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>1</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement1"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>5</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement5"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>4</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement4"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>3</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement3"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>2</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement2"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 flex justify-center items-center">
|
||||
<div>1</div>
|
||||
</div>
|
||||
<div class="col-8 q-pa-sm">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.achievement1"
|
||||
label="กรอกผลสำเร็จของงาน"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.meaning"
|
||||
label="นิยามหรือความหมาย"
|
||||
type="textarea"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกนิยามหรือความหมาย'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.formula"
|
||||
label="สูตรคำนวณ"
|
||||
bg-color="white"
|
||||
type="textarea"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกสูตรคำนวณ'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-card bordered class="col-12">
|
||||
<div
|
||||
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
|
||||
>
|
||||
หน่วยงาน/ส่วนราชการ
|
||||
</div>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pa-sm">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="filterAgency"
|
||||
label="ค้นหา"
|
||||
class="inputgreen"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filterAgency !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="filterAgency = ''"
|
||||
/>
|
||||
<q-icon v-else name="search" color="grey-5" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
style="height: 350px; overflow: scroll"
|
||||
dense
|
||||
:nodes="nodeAgency"
|
||||
node-key="orgTreeId"
|
||||
label-key="orgTreeName"
|
||||
selected-color="primary"
|
||||
:filter="filterAgency"
|
||||
no-results-label="ไม่พบข้อมูลที่ค้นหา"
|
||||
no-nodes-label="ไม่มีข้อมูล"
|
||||
v-model:expanded="expandedAgency"
|
||||
v-model:selected="planData.nodeId"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<q-item
|
||||
clickable
|
||||
@click.stop="updateSelectedAgency(prop.node)"
|
||||
:active="planData.nodeId == prop.node.orgTreeId"
|
||||
active-class="my-list-link text-primary text-weight-medium"
|
||||
class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.orgTreeName }}
|
||||
</div>
|
||||
<div class="text-weight-light text-grey-8">
|
||||
{{
|
||||
prop.node.orgCode == null ? null : prop.node.orgCode
|
||||
}}
|
||||
{{
|
||||
prop.node.orgTreeShortName == null
|
||||
? null
|
||||
: prop.node.orgTreeShortName
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.meaning"
|
||||
label="นิยามหรือความหมาย"
|
||||
type="textarea"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกนิยามหรือความหมาย'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="planData.formula"
|
||||
label="สูตรคำนวณ"
|
||||
bg-color="white"
|
||||
type="textarea"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกสูตรคำนวณ'}`]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-card bordered class="col-12">
|
||||
<div
|
||||
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
|
||||
>
|
||||
หน่วยงาน/ส่วนราชการ
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="col-6">
|
||||
<q-card bordered class="col-12">
|
||||
<div
|
||||
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
|
||||
>
|
||||
ยุทธศาสตร์ / แผน
|
||||
</div>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pa-sm">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="filterAgency"
|
||||
label="ค้นหา"
|
||||
class="inputgreen"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filterAgency !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="filterAgency = ''"
|
||||
/>
|
||||
<q-icon v-else name="search" color="grey-5" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
style="height: 350px; overflow: scroll"
|
||||
dense
|
||||
:nodes="nodeAgency"
|
||||
node-key="orgTreeId"
|
||||
label-key="orgTreeName"
|
||||
selected-color="primary"
|
||||
:filter="filterAgency"
|
||||
no-results-label="ไม่พบข้อมูลที่ค้นหา"
|
||||
no-nodes-label="ไม่มีข้อมูล"
|
||||
v-model:expanded="expandedAgency"
|
||||
v-model:selected="planData.nodeId"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<q-item
|
||||
clickable
|
||||
@click.stop="updateSelectedAgency(prop.node)"
|
||||
:active="planData.nodeId == prop.node.orgTreeId"
|
||||
active-class="my-list-link text-primary text-weight-medium"
|
||||
class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.orgTreeName }}
|
||||
<q-card-section class="q-pa-sm">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="filter"
|
||||
label="ค้นหา"
|
||||
class="inputgreen"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filter !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="filter = ''"
|
||||
/>
|
||||
<q-icon v-else name="search" color="grey-5" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
style="height: 350px; overflow: scroll"
|
||||
dense
|
||||
:nodes="nodeplan"
|
||||
selected-color="primary"
|
||||
node-key="id"
|
||||
label-key="name"
|
||||
:filter="filter"
|
||||
no-results-label="ไม่พบข้อมูลที่ค้นหา"
|
||||
no-nodes-label="ไม่มีข้อมูล"
|
||||
v-model:expanded="expandedPlan"
|
||||
v-model:selected="planData.strategyId"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<q-item
|
||||
clickable
|
||||
@click.stop="updateSelected(prop.node)"
|
||||
:active="planData.strategyId == prop.node.id"
|
||||
active-class="my-list-link text-primary text-weight-medium"
|
||||
class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.name }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-weight-light text-grey-8">
|
||||
{{
|
||||
prop.node.orgCode == null ? null : prop.node.orgCode
|
||||
}}
|
||||
{{
|
||||
prop.node.orgTreeShortName == null
|
||||
? null
|
||||
: prop.node.orgTreeShortName
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
class="inputgreen"
|
||||
v-model="planData.documentInfoEvidence"
|
||||
label="ข้อมูลเอกสารหลักฐาน"
|
||||
outlined
|
||||
dense
|
||||
type="textarea"
|
||||
></q-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-card bordered class="col-12">
|
||||
<div
|
||||
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
|
||||
>
|
||||
ยุทธศาสตร์ / แผน
|
||||
</div>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pa-sm">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
v-model="filter"
|
||||
label="ค้นหา"
|
||||
class="inputgreen"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filter !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="filter = ''"
|
||||
/>
|
||||
<q-icon v-else name="search" color="grey-5" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
style="height: 350px; overflow: scroll"
|
||||
dense
|
||||
:nodes="nodeplan"
|
||||
selected-color="primary"
|
||||
node-key="id"
|
||||
label-key="name"
|
||||
:filter="filter"
|
||||
no-results-label="ไม่พบข้อมูลที่ค้นหา"
|
||||
no-nodes-label="ไม่มีข้อมูล"
|
||||
v-model:expanded="expandedPlan"
|
||||
v-model:selected="planData.strategyId"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<q-item
|
||||
clickable
|
||||
@click.stop="updateSelected(prop.node)"
|
||||
:active="planData.strategyId == prop.node.id"
|
||||
active-class="my-list-link text-primary text-weight-medium"
|
||||
class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.name }}
|
||||
</div>
|
||||
</div>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
class="inputgreen"
|
||||
v-model="planData.documentInfoEvidence"
|
||||
label="ข้อมูลเอกสารหลักฐาน"
|
||||
outlined
|
||||
dense
|
||||
type="textarea"
|
||||
></q-input>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator color="grey-4" />
|
||||
</div>
|
||||
<q-toolbar class="fit row wrap justify-end items-start content-start">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-toolbar>
|
||||
</q-form>
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -337,12 +337,10 @@ onMounted(async () => {
|
|||
/>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
type="submit"
|
||||
for="#submitForm"
|
||||
unelevated
|
||||
dense
|
||||
class="q-px-md items-center"
|
||||
color="public"
|
||||
label="บันทึก"
|
||||
|
|
|
|||
|
|
@ -571,12 +571,10 @@ onMounted(async () => {
|
|||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
type="submit"
|
||||
for="#submitForm"
|
||||
unelevated
|
||||
dense
|
||||
class="q-px-md items-center"
|
||||
color="public"
|
||||
label="บันทึก"
|
||||
|
|
|
|||
|
|
@ -67,83 +67,90 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<q-card flat bordered>
|
||||
<q-card>
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<q-card-section class="bg-grey-3 q-pa-sm">
|
||||
<div class="row text-dark text-body2 text-weight-medium">
|
||||
<div class="text-center col-8">เกณฑ์การประเมิน</div>
|
||||
<div class="text-center col-4">ระดับคะแนน</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-none">
|
||||
<div v-for="(field, index) in dataLevel" :key="field.id">
|
||||
<div class="row q-pa-sm">
|
||||
<div class="col-8 text-left">
|
||||
<q-field
|
||||
class="q_field_p_none"
|
||||
ref="fieldRef"
|
||||
v-model="field.description"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[(val) => !!val || 'กรุณากรอกมาตรฐานพฤติกรรม']"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
class="full-width"
|
||||
<q-card-section>
|
||||
<q-card flat bordered>
|
||||
<q-card-section class="bg-grey-3">
|
||||
<div class="row text-dark text-body2 text-weight-medium">
|
||||
<div class="text-center col-8">เกณฑ์การประเมิน</div>
|
||||
<div class="text-center col-4">ระดับคะแนน</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-none">
|
||||
<div v-for="(field, index) in dataLevel" :key="field.id">
|
||||
<div class="row q-pa-sm">
|
||||
<div class="col-8 text-left">
|
||||
<q-field
|
||||
class="q_field_p_none"
|
||||
ref="fieldRef"
|
||||
v-model="field.description"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[(val) => !!val || 'กรุณากรอกมาตรฐานพฤติกรรม']"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
class="full-width"
|
||||
v-model="field.description"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
]"
|
||||
:fonts="{
|
||||
arial: 'Arial',
|
||||
arial_black: 'Arial Black',
|
||||
comic_sans: 'Comic Sans MS',
|
||||
courier_new: 'Courier New',
|
||||
impact: 'Impact',
|
||||
lucida_grande: 'Lucida Grande',
|
||||
times_new_roman: 'Times New Roman',
|
||||
verdana: 'Verdana',
|
||||
}"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
<!-- <q-input
|
||||
v-model="formScore[field]"
|
||||
dense
|
||||
outlined
|
||||
class="inputgreen"
|
||||
label="กรอกข้อความเพื่อไว้ใช้อ้างอิงเท่านั้น"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกข้อความเพื่อไว้ใช้อ้างอิงเท่านั้น'}`,]"
|
||||
hide-bottom-space
|
||||
/> -->
|
||||
['unordered', 'ordered'],
|
||||
]"
|
||||
:fonts="{
|
||||
arial: 'Arial',
|
||||
arial_black: 'Arial Black',
|
||||
comic_sans: 'Comic Sans MS',
|
||||
courier_new: 'Courier New',
|
||||
impact: 'Impact',
|
||||
lucida_grande: 'Lucida Grande',
|
||||
times_new_roman: 'Times New Roman',
|
||||
verdana: 'Verdana',
|
||||
}"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
<!-- <q-input
|
||||
v-model="formScore[field]"
|
||||
dense
|
||||
outlined
|
||||
class="inputgreen"
|
||||
label="กรอกข้อความเพื่อไว้ใช้อ้างอิงเท่านั้น"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกข้อความเพื่อไว้ใช้อ้างอิงเท่านั้น'}`,]"
|
||||
hide-bottom-space
|
||||
/> -->
|
||||
</div>
|
||||
<div
|
||||
class="col-4 text-center text-body1 text-weight-bold self-center"
|
||||
>
|
||||
{{ field.level }}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="col-12"
|
||||
v-if="index !== Object.keys(fieldLabels).length - 1"
|
||||
>
|
||||
<q-separator />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="col-4 text-center text-body1 text-weight-bold self-center"
|
||||
>
|
||||
{{ field.level }}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="col-12"
|
||||
v-if="index !== Object.keys(fieldLabels).length - 1"
|
||||
>
|
||||
<q-separator />
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-card-section>
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" color="secondary" type="submit"
|
||||
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
|
||||
>
|
||||
|
|
|
|||
|
|
@ -3,11 +3,7 @@ import { ref, reactive } from "vue";
|
|||
import { useRouter } from "vue-router";
|
||||
|
||||
import Main from "@/modules/01_metadataNew/components/competency/Forms/Main.vue";
|
||||
// import FormMain from "@/modules/14_KPI/components/competency/Forms/01_FormMain.vue";
|
||||
// import FormGroup from "@/modules/14_KPI/components/competency/Forms/02_FormGroup.vue";
|
||||
// import FormExecutive from "@/modules/14_KPI/components/competency/Forms/03_FormExecutive.vue";
|
||||
// import FormExecutivePosition from "@/modules/14_KPI/components/competency/Forms/04_FormExecutivePosition.vue";
|
||||
// import FormExecutiveLevel from "@/modules/14_KPI/components/competency/Forms/05_FormExecutiveLevel.vue";
|
||||
|
||||
import { useKPIDataStore } from "@/modules/01_metadataNew/stores/KPIStore";
|
||||
|
||||
import type { DataOption } from "@/modules/01_metadataNew/interface/index/Main";
|
||||
|
|
@ -88,11 +84,9 @@ function onSubmit() {
|
|||
/>
|
||||
<span class="toptitle text-dark">เพิ่ม/แก้ไขสมรรถนะ</span>
|
||||
</div>
|
||||
<q-card flat bordered>
|
||||
<!-- @submit.prevent @validation-success="onSubmit" -->
|
||||
<!-- <q-form greedy> -->
|
||||
<q-card>
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<q-select
|
||||
v-model="store.competencyTypeVal"
|
||||
|
|
@ -106,16 +100,11 @@ function onSubmit() {
|
|||
map-options
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกประเภทสมรรถนะ'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Main />
|
||||
<!-- <FormMain v-if="store.competencyType === 'ID1'" />
|
||||
<FormGroup v-else-if="store.competencyType === 'ID2'" />
|
||||
<FormExecutive v-else-if="store.competencyType === 'ID3'" />
|
||||
<FormExecutivePosition v-else-if="store.competencyType === 'ID4'" />
|
||||
<FormExecutiveLevel v-else-if="store.competencyType === 'ID5'" /> -->
|
||||
</div>
|
||||
</q-card-section>
|
||||
<Main />
|
||||
</q-card>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
div
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
|
|
@ -107,19 +106,21 @@ onMounted(() => {
|
|||
|
||||
<template>
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit" class="col-12">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
v-model="formData.competencyName"
|
||||
dense
|
||||
outlined
|
||||
label="ชื่อสมรรถนะ"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อสมรรถนะ'}`,]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<q-card-section class="col-12 q-px-none">
|
||||
<div>
|
||||
<q-card-section class="q-pt-none">
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
v-model="formData.competencyName"
|
||||
dense
|
||||
outlined
|
||||
label="ชื่อสมรรถนะ"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อสมรรถนะ'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<q-field
|
||||
class="q_field_p_none"
|
||||
ref="fieldRef"
|
||||
|
|
@ -162,133 +163,129 @@ onMounted(() => {
|
|||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<div class="col-12">
|
||||
<q-card flat bordered>
|
||||
<q-card-section class="bg-grey-4">
|
||||
<div
|
||||
class="row items-center text-dark text-body2 text-weight-medium"
|
||||
>
|
||||
<div class="col-3">
|
||||
<div class="row items-center">
|
||||
<div class="col-1">
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="primary"
|
||||
icon="add"
|
||||
@click="onClickAddLevels"
|
||||
>
|
||||
<q-tooltip>เพิ่ม</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-11 text-center">
|
||||
<span>ระดับสมรรถนะ</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<span>พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย</span>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div
|
||||
class="row q-pa-sm"
|
||||
v-for="(items, index) in formData.levels"
|
||||
key="index"
|
||||
>
|
||||
<div class="col-3 align-center q-pr-lg">
|
||||
<q-input
|
||||
:readonly="
|
||||
store.competencyTypeVal === 'HEAD' ||
|
||||
store.competencyTypeVal === 'GROUP'
|
||||
"
|
||||
v-model="formData.levels[index].level"
|
||||
dense
|
||||
outlined
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกระดับสมรรถนะ'}`,]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-9">
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col-11">
|
||||
<q-field
|
||||
class="q_field_p_none"
|
||||
ref="fieldRef"
|
||||
v-model="formData.levels[index].description"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val || 'กรุณากรอกพฤติกรรมที่คาดหวัง/พฤติกรรมย่อย',
|
||||
]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
class="full-width"
|
||||
v-model="formData.levels[index].description"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
<div class="col-12">
|
||||
<q-card flat bordered>
|
||||
<q-card-section class="bg-grey-4">
|
||||
<div
|
||||
class="row items-center text-dark text-body2 text-weight-medium"
|
||||
>
|
||||
<div class="col-3">
|
||||
<div class="row items-center">
|
||||
<div class="col-1">
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="primary"
|
||||
icon="add"
|
||||
@click="onClickAddLevels"
|
||||
>
|
||||
<q-tooltip>เพิ่ม</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-11 text-center">
|
||||
<span>ระดับสมรรถนะ</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-1 text-center">
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="red"
|
||||
icon="delete"
|
||||
@click="onDeleteLevels(index)"
|
||||
v-if="
|
||||
(store.competencyTypeVal === 'HEAD' && index > 4) ||
|
||||
(store.competencyTypeVal === 'GROUP' && index > 4) ||
|
||||
((store.competencyTypeVal === 'EXECUTIVE' ||
|
||||
store.competencyTypeVal === 'DIRECTOR' ||
|
||||
store.competencyTypeVal === 'INSPECTOR') &&
|
||||
index > 0)
|
||||
"
|
||||
>
|
||||
<q-tooltip>ลบ</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<span>พฤติกรรมที่คาดหวัง/พฤติกรรมย่อย</span>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div
|
||||
class="row q-pa-sm"
|
||||
v-for="(items, index) in formData.levels"
|
||||
key="index"
|
||||
>
|
||||
<div class="col-3 align-center q-pr-lg">
|
||||
<q-input
|
||||
:readonly="
|
||||
store.competencyTypeVal === 'HEAD' ||
|
||||
store.competencyTypeVal === 'GROUP'
|
||||
"
|
||||
v-model="formData.levels[index].level"
|
||||
dense
|
||||
outlined
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกระดับสมรรถนะ'}`,]"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-9">
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col-11">
|
||||
<q-field
|
||||
class="q_field_p_none"
|
||||
ref="fieldRef"
|
||||
v-model="formData.levels[index].description"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val || 'กรุณากรอกพฤติกรรมที่คาดหวัง/พฤติกรรมย่อย',
|
||||
]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
class="full-width"
|
||||
v-model="formData.levels[index].description"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
<div class="col-1 text-center">
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="red"
|
||||
icon="delete"
|
||||
@click="onDeleteLevels(index)"
|
||||
v-if="
|
||||
(store.competencyTypeVal === 'HEAD' && index > 4) ||
|
||||
(store.competencyTypeVal === 'GROUP' && index > 4) ||
|
||||
((store.competencyTypeVal === 'EXECUTIVE' ||
|
||||
store.competencyTypeVal === 'DIRECTOR' ||
|
||||
store.competencyTypeVal === 'INSPECTOR') &&
|
||||
index > 0)
|
||||
"
|
||||
>
|
||||
<q-tooltip>ลบ</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 q-my-sm"><q-separator /></div>
|
||||
<div class="col-12 row justify-end">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
type="submit"
|
||||
>
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<div class="col-12"><q-separator /></div>
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" color="public" class="q-px-md" type="submit">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ interface FormDataRole {
|
|||
includingName: string;
|
||||
target: string;
|
||||
unit: string;
|
||||
weight: string;
|
||||
weight: string | null;
|
||||
meaning: string;
|
||||
formula: string;
|
||||
documentInfoEvidence: string;
|
||||
|
|
|
|||
|
|
@ -328,8 +328,8 @@ onMounted(() => {
|
|||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pt-none">
|
||||
<div class="row q-pa-md">
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<q-input
|
||||
dense
|
||||
|
|
@ -349,16 +349,8 @@ onMounted(() => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -979,8 +979,10 @@ async function emitSearch(keyword: string, typeSelect: string) {
|
|||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn type="submit" :label="`บันทึก`" color="public" />
|
||||
<q-card-actions align="right">
|
||||
<q-btn type="submit" label="บันทึก" color="public"
|
||||
><q-tooltip>บันทึก</q-tooltip></q-btn
|
||||
>
|
||||
</q-card-actions>
|
||||
</form>
|
||||
</q-card>
|
||||
|
|
|
|||
|
|
@ -121,7 +121,7 @@ watch(
|
|||
"
|
||||
/>
|
||||
<q-separator />
|
||||
<q-card-section class="q-pt-none q-pa-sm">
|
||||
<q-card-section>
|
||||
<d-table
|
||||
flat
|
||||
bordered
|
||||
|
|
|
|||
|
|
@ -95,14 +95,13 @@ watch(
|
|||
<template>
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="min-width: 50vw">
|
||||
<!-- <form @submit.prevent="validateForm"> -->
|
||||
<DialogHeader
|
||||
:tittle="`จัดลำดับ${type == 0 ? 'หน่วยงาน' : 'ส่วนราชการ'}`"
|
||||
:close="() => (modal = false)"
|
||||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section>
|
||||
<q-card-section style="max-height: 70vh" class="scroll">
|
||||
<q-table
|
||||
v-draggable-table="{
|
||||
options: {
|
||||
|
|
@ -124,10 +123,11 @@ watch(
|
|||
/>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn type="submit" :label="`บันทึก`" color="public" @click="save" />
|
||||
<q-card-actions align="right">
|
||||
<q-btn type="submit" :label="`บันทึก`" color="public" @click="save" >
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
<!-- </form> -->
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -121,7 +121,7 @@ watch(
|
|||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section>
|
||||
<q-card-section style="max-height: 70vh" class="scroll">
|
||||
<q-table
|
||||
v-if="rows.length > 0"
|
||||
v-draggable-table="{
|
||||
|
|
@ -152,7 +152,9 @@ watch(
|
|||
:label="`บันทึก`"
|
||||
color="public"
|
||||
@click="save"
|
||||
/>
|
||||
>
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
|
|
|||
|
|
@ -396,8 +396,10 @@ function clearForm() {
|
|||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="สืบทอดตำแหน่ง" color="public" @click="onClickConfirm" />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="สืบทอดตำแหน่ง" color="public" @click="onClickConfirm">
|
||||
<q-tooltip>สืบทอดตำแหน่ง</q-tooltip></q-btn
|
||||
>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
|
|
|||
|
|
@ -182,9 +182,8 @@ watch(
|
|||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="min-width: 350px">
|
||||
<q-form @submit.prevent @validation-success="onSubmit()" greedy>
|
||||
<q-card-section class="flex justify-between" style="padding: 0">
|
||||
<DialogHeader tittle="เพิ่มข้อมูล" :close="closeDialog" />
|
||||
</q-card-section>
|
||||
<DialogHeader tittle="เพิ่มข้อมูล" :close="closeDialog" />
|
||||
|
||||
<q-separator />
|
||||
<q-card-section class="q-pa-md q-col-gutter-md">
|
||||
<div class="row q-gutter-sm">
|
||||
|
|
@ -375,8 +374,6 @@ watch(
|
|||
<q-btn
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
|
|
|
|||
|
|
@ -323,7 +323,9 @@ watch(
|
|||
>
|
||||
<q-tooltip>ดูทะเบียนประวัติ</q-tooltip>
|
||||
{{
|
||||
`${props.row.prefix}${props.row.firstName} ${props.row.lastName}`
|
||||
`${props.row.prefix ? props.row.prefix : ""}${
|
||||
props.row.firstName
|
||||
} ${props.row.lastName}`
|
||||
}}
|
||||
</div>
|
||||
<div class="text-weight-light">{{ props.row.citizenId }}</div>
|
||||
|
|
@ -347,7 +349,9 @@ watch(
|
|||
|
||||
<div class="text-weight-medium q-mt-md">
|
||||
{{
|
||||
`${props.row.prefix}${props.row.firstName} ${props.row.lastName}`
|
||||
`${props.row.prefix ? props.row.prefix : ""}${
|
||||
props.row.firstName
|
||||
} ${props.row.lastName}`
|
||||
}}
|
||||
</div>
|
||||
<div class="text-weight-light full-width text-center">
|
||||
|
|
|
|||
|
|
@ -238,7 +238,7 @@ function closeHistoryDialog() {
|
|||
async function fetchData(id: string) {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileNewCertificateByProfileId(id,empType.value))
|
||||
.get(config.API.profileNewCertificateByProfileId(id, empType.value))
|
||||
.then(async (res) => {
|
||||
rows.value = res.data.result;
|
||||
})
|
||||
|
|
@ -290,10 +290,13 @@ async function addData() {
|
|||
|
||||
async function editData(idData: string) {
|
||||
await http
|
||||
.patch(config.API.profileNewCertificateByCertificateId(idData,empType.value), {
|
||||
...profesLicenseData,
|
||||
profileId: undefined,
|
||||
})
|
||||
.patch(
|
||||
config.API.profileNewCertificateByCertificateId(idData, empType.value),
|
||||
{
|
||||
...profesLicenseData,
|
||||
profileId: undefined,
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
fetchData(id.value);
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
|
|
@ -325,7 +328,7 @@ async function editData(idData: string) {
|
|||
async function fetchHistoryData(id: string) {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileNewCertificateHisByCertificateId(id,empType.value))
|
||||
.get(config.API.profileNewCertificateHisByCertificateId(id, empType.value))
|
||||
.then(async (res) => {
|
||||
historyRows.value = res.data.result;
|
||||
})
|
||||
|
|
@ -551,11 +554,11 @@ onMounted(async () => {
|
|||
"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 55vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-pb-sm">
|
||||
<div class="col">
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-sm q-pb-sm">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="profesLicenseData.certificateType"
|
||||
|
|
@ -567,7 +570,7 @@ onMounted(async () => {
|
|||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="profesLicenseData.issuer"
|
||||
|
|
@ -582,8 +585,8 @@ onMounted(async () => {
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-gutter-sm q-pb-sm">
|
||||
<div class="col">
|
||||
<div class="row q-col-gutter-sm q-pb-sm">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="profesLicenseData.certificateNo"
|
||||
|
|
@ -595,7 +598,7 @@ onMounted(async () => {
|
|||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="profesLicenseData.issueDate"
|
||||
|
|
@ -684,17 +687,9 @@ onMounted(async () => {
|
|||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
@ -708,7 +703,7 @@ onMounted(async () => {
|
|||
tittle="ประวัติแก้ไขใบอนุญาตประกอบวิชาชีพ"
|
||||
:close="closeHistoryDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 60vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
|
|
|
|||
|
|
@ -700,8 +700,8 @@ onMounted(async () => {
|
|||
"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 55vh" class="scroll">
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row q-mb-sm q-gutter-sm">
|
||||
<div class="col">
|
||||
<q-input
|
||||
|
|
@ -1063,17 +1063,9 @@ onMounted(async () => {
|
|||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
@ -1087,7 +1079,7 @@ onMounted(async () => {
|
|||
tittle="ประวัติแก้ไขการฝึกอบรม/ดูงาน"
|
||||
:close="closeHistoryDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
<q-card-section style="max-height: 60vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
<q-space />
|
||||
|
|
|
|||
|
|
@ -811,8 +811,8 @@ onMounted(async () => {
|
|||
"
|
||||
:close="clickClose"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 55vh" class="scroll">
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
|
|
@ -1103,17 +1103,9 @@ onMounted(async () => {
|
|||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
@ -1127,7 +1119,7 @@ onMounted(async () => {
|
|||
tittle="ประวัติแก้ไขเครื่องราชอิสริยาภรณ์"
|
||||
:close="() => (modalHistory = false)"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 60vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
|
|
|
|||
|
|
@ -541,8 +541,8 @@ onMounted(async () => {
|
|||
"
|
||||
:close="clickClose"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 55vh" class="scroll">
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="row col-12 q-gutter-md q-py-sm text-grey-7">
|
||||
<q-radio
|
||||
|
|
@ -736,15 +736,7 @@ onMounted(async () => {
|
|||
</q-card-section>
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -367,7 +367,9 @@ async function clickHistory(row: ResponseObject) {
|
|||
|
||||
showLoader();
|
||||
try {
|
||||
const res = await http.get(config.API.profileNewAssessmentsHisById(row.id,empType.value));
|
||||
const res = await http.get(
|
||||
config.API.profileNewAssessmentsHisById(row.id, empType.value)
|
||||
);
|
||||
|
||||
rowsHistory.value = res.data.result;
|
||||
} catch (e) {
|
||||
|
|
@ -611,8 +613,8 @@ onMounted(async () => {
|
|||
"
|
||||
:close="clickClose"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 55vh" class="scroll">
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-12">
|
||||
<datepicker
|
||||
|
|
@ -785,15 +787,7 @@ onMounted(async () => {
|
|||
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
@ -807,7 +801,7 @@ onMounted(async () => {
|
|||
tittle="ประวัติแก้ไขผลการประเมินการปฏิบัติราชการ"
|
||||
:close="() => (modalHistory = false)"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
<q-card-section style="max-height: 60vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
<q-space />
|
||||
|
|
|
|||
|
|
@ -0,0 +1,633 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, watch, ref, reactive } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute } from "vue-router";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import type { FormEmployee } from "@/modules/04_registryNew/interface/request/Employee";
|
||||
import type {
|
||||
EmployeeHistory,
|
||||
ResEmployee,
|
||||
} from "@/modules/04_registryNew/interface/response/Employee";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
import type { QTableColumn } from "quasar";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
const {
|
||||
success,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
date2Thai,
|
||||
messageError,
|
||||
dialogConfirm,
|
||||
dialogMessageNotify,
|
||||
} = useCounterMixin();
|
||||
|
||||
const profileId = ref<string>(
|
||||
route.params.id ? route.params.id.toString() : ""
|
||||
);
|
||||
|
||||
/** ข้อมูลลูกจ้างชั่วคราว*/
|
||||
const modalEdit = ref<boolean>(false);
|
||||
const dataEmployee = reactive<ResEmployee>({
|
||||
id: "",
|
||||
positionEmployeeGroupId: "",
|
||||
positionEmployeeLineId: "",
|
||||
positionEmployeePositionId: "",
|
||||
employeeOc: "",
|
||||
employeeTypeIndividual: "",
|
||||
employeeWage: "",
|
||||
employeeMoneyIncrease: "",
|
||||
employeeMoneyAllowance: "",
|
||||
employeeMoneyEmployee: "",
|
||||
employeeMoneyEmployer: "",
|
||||
});
|
||||
const formData = reactive<FormEmployee>({
|
||||
positionEmployeeGroupId: "",
|
||||
positionEmployeeLineId: "",
|
||||
positionEmployeePositionId: "",
|
||||
employeeOc: "",
|
||||
employeeTypeIndividual: "",
|
||||
employeeWage: "",
|
||||
employeeMoneyIncrease: "",
|
||||
employeeMoneyAllowance: "",
|
||||
employeeMoneyEmployee: "",
|
||||
employeeMoneyEmployer: "",
|
||||
});
|
||||
|
||||
/** function fetch ข้อมูลลูกจ้างชั่วคราว*/
|
||||
function fetchData() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.informationEmployee(profileId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
dataEmployee.positionEmployeeGroupId = data.positionEmployeeGroupId;
|
||||
dataEmployee.positionEmployeeLineId = data.positionEmployeeLineId;
|
||||
dataEmployee.positionEmployeePositionId = data.positionEmployeePositionId;
|
||||
dataEmployee.employeeOc = data.employeeOc;
|
||||
dataEmployee.employeeTypeIndividual = data.employeeTypeIndividual;
|
||||
dataEmployee.employeeWage = data.employeeWage;
|
||||
dataEmployee.employeeMoneyIncrease = data.employeeMoneyIncrease;
|
||||
dataEmployee.employeeMoneyAllowance = data.employeeMoneyAllowance;
|
||||
dataEmployee.employeeMoneyEmployee = data.employeeMoneyEmployee;
|
||||
dataEmployee.employeeMoneyEmployer = data.employeeMoneyEmployer;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/** function เปิด Dialog แก้ไขมูลลูกจ้างชั่วคราว*/
|
||||
function onClickEdit() {
|
||||
modalEdit.value = true;
|
||||
formData.positionEmployeeGroupId = dataEmployee.positionEmployeeGroupId;
|
||||
formData.positionEmployeeLineId = dataEmployee.positionEmployeeLineId;
|
||||
formData.positionEmployeePositionId = dataEmployee.positionEmployeePositionId;
|
||||
formData.employeeOc = dataEmployee.employeeOc;
|
||||
formData.employeeTypeIndividual = dataEmployee.employeeTypeIndividual;
|
||||
formData.employeeWage = dataEmployee.employeeWage;
|
||||
formData.employeeMoneyIncrease = dataEmployee.employeeMoneyIncrease;
|
||||
formData.employeeMoneyAllowance = dataEmployee.employeeMoneyAllowance;
|
||||
formData.employeeMoneyEmployee = dataEmployee.employeeMoneyEmployee;
|
||||
formData.employeeMoneyEmployer = dataEmployee.employeeMoneyEmployer;
|
||||
}
|
||||
|
||||
/** function ปิด Dialog แก้ไขมูลลูกจ้างชั่วคราว*/
|
||||
function onCloseDialog() {
|
||||
modalEdit.value = false;
|
||||
formData.positionEmployeeGroupId = "";
|
||||
formData.positionEmployeeLineId = "";
|
||||
formData.positionEmployeePositionId = "";
|
||||
formData.employeeOc = "";
|
||||
formData.employeeTypeIndividual = "";
|
||||
formData.employeeWage = "";
|
||||
formData.employeeMoneyIncrease = "";
|
||||
formData.employeeMoneyAllowance = "";
|
||||
formData.employeeMoneyEmployee = "";
|
||||
formData.employeeMoneyEmployer = "";
|
||||
}
|
||||
|
||||
/** function บันทึกแก้ไขมูลลูกจ้างชั่วคราว*/
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
showLoader();
|
||||
http
|
||||
.put(config.API.informationEmployee(profileId.value), formData)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
fetchData();
|
||||
onCloseDialog();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/** ประวัติข้อมูลลูกจ้างชั่วคราว */
|
||||
const modalHistory = ref<boolean>(false);
|
||||
const filter = ref<string>("");
|
||||
const rows = ref<EmployeeHistory[]>([]);
|
||||
const columns = ref<QTableColumn[]>([
|
||||
{
|
||||
name: "positionEmployeeGroupId",
|
||||
align: "left",
|
||||
label: "กลุ่มงาน",
|
||||
sortable: true,
|
||||
field: "positionEmployeeGroupId",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionEmployeeLineId",
|
||||
align: "left",
|
||||
label: "สายงาน",
|
||||
sortable: true,
|
||||
field: "positionEmployeeLineId",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionEmployeePositionId",
|
||||
align: "left",
|
||||
label: "ตำแหน่งทางสายงาน",
|
||||
sortable: true,
|
||||
field: "positionEmployeePositionId",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "employeeOc",
|
||||
align: "left",
|
||||
label: "สังกัด",
|
||||
sortable: true,
|
||||
field: "employeeOc",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "employeeTypeIndividual",
|
||||
align: "left",
|
||||
label: "ประเภทบุคคล",
|
||||
sortable: true,
|
||||
field: "employeeTypeIndividual",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "employeeWage",
|
||||
align: "left",
|
||||
label: "ค่าจ้าง",
|
||||
sortable: true,
|
||||
field: "employeeWage",
|
||||
format: (v) => (v ? Number(v).toLocaleString() : ""),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "employeeMoneyIncrease",
|
||||
align: "left",
|
||||
label: "เงินเพิ่มการครองชึพชั่วคราว",
|
||||
sortable: true,
|
||||
field: "employeeMoneyIncrease",
|
||||
format: (v) => (v ? Number(v).toLocaleString() : ""),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "employeeMoneyAllowance",
|
||||
align: "left",
|
||||
label: "เงินช่วยเหลือการครองชึพชั่วคราว",
|
||||
sortable: true,
|
||||
field: "employeeMoneyAllowance",
|
||||
format: (v) => (v ? Number(v).toLocaleString() : ""),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "employeeMoneyEmployee",
|
||||
align: "left",
|
||||
label: "เงินสมทบประกันสังคม(ลูกจ้าง)",
|
||||
sortable: true,
|
||||
field: "employeeMoneyEmployee",
|
||||
format: (v) => (v ? Number(v).toLocaleString() : ""),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "employeeMoneyEmployer",
|
||||
align: "left",
|
||||
label: "เงินสมทบประกันสังคม(นายจ้าง)",
|
||||
sortable: true,
|
||||
field: "employeeMoneyEmployer",
|
||||
format: (v) => (v ? Number(v).toLocaleString() : ""),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "createdFullName",
|
||||
align: "left",
|
||||
label: "ผู้ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "createdFullName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
align: "left",
|
||||
label: "วันที่แก้ไข",
|
||||
sortable: true,
|
||||
field: "lastUpdatedAt",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (v) => date2Thai(v),
|
||||
},
|
||||
]);
|
||||
const visibleColumns = ref<String[]>([
|
||||
"positionEmployeeGroupId",
|
||||
"positionEmployeeLineId",
|
||||
"positionEmployeePositionId",
|
||||
"employeeOc",
|
||||
"employeeTypeIndividual",
|
||||
"employeeWage",
|
||||
"employeeMoneyIncrease",
|
||||
"employeeMoneyAllowance",
|
||||
"employeeMoneyEmployee",
|
||||
"employeeMoneyEmployer",
|
||||
"createdFullName",
|
||||
"createdAt",
|
||||
]);
|
||||
|
||||
function onClickHistory() {
|
||||
showLoader();
|
||||
modalHistory.value = true;
|
||||
http
|
||||
.get(config.API.informationHistoryEmployee(profileId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
rows.value = data;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
profileId.value && fetchData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row q-gutter-sm items-center">
|
||||
<div class="toptitle col text-right q-gutter-x-sm">
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
dense
|
||||
icon="mdi-pencil-outline"
|
||||
color="primary"
|
||||
@click="onClickEdit"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
dense
|
||||
icon="mdi-history"
|
||||
color="info"
|
||||
@click="onClickHistory"
|
||||
>
|
||||
<q-tooltip>ประวัติแก้ไขข้อมูลลูกจ้างชั่วคราว</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-card bordered class="my-card bg-grey-1 q-pa-md">
|
||||
<div :class="$q.screen.gt.xs ? 'row' : 'column'">
|
||||
<!-- column 1 -->
|
||||
<div class="col-md-7 col-12 row">
|
||||
<div class="col-5 text-grey-6 text-weight-medium">
|
||||
<div class="q-py-xs">กลุ่มงาน</div>
|
||||
<div class="q-py-xs">สายงาน</div>
|
||||
<div class="q-py-xs">ตำแหน่งทางสายงาน</div>
|
||||
<div class="q-py-xs">สังกัด</div>
|
||||
<div class="q-py-xs">ประเภทบุคคล</div>
|
||||
</div>
|
||||
|
||||
<!-- data -->
|
||||
<div class="col-7">
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.positionEmployeeGroupId }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.positionEmployeeLineId }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.positionEmployeePositionId }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.employeeOc }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.employeeTypeIndividual }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- column 2 -->
|
||||
<div class="col-md-5 col-12 row">
|
||||
<div class="col-5 col text-grey-6 text-weight-medium">
|
||||
<div class="q-py-xs">ค่าจ้าง</div>
|
||||
<div class="q-py-xs">เงินเพิ่มการครองชึพชั่วคราว</div>
|
||||
<div class="q-py-xs">เงินช่วยเหลือการครองชึพชั่วคราว</div>
|
||||
<div class="q-py-xs">เงินสมทบประกันสังคม(ลูกจ้าง)</div>
|
||||
<div class="q-py-xs">เงินสมทบประกันสังคม(นายจ้าง)</div>
|
||||
</div>
|
||||
|
||||
<div class="col-7">
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.employeeWage }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.employeeMoneyIncrease }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.employeeMoneyAllowance }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.employeeMoneyEmployee }}
|
||||
</div>
|
||||
<div class="q-py-xs">
|
||||
{{ dataEmployee.employeeMoneyEmployer }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
|
||||
<!-- Dialog แก้ไขข้อมูลลูกจ้างชั่วคราว -->
|
||||
<q-dialog v-model="modalEdit" persistent full-width>
|
||||
<q-card>
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<DialogHeader
|
||||
tittle="แก้ไขข้อมูลลูกจ้างชั่วคราว"
|
||||
:close="onCloseDialog"
|
||||
/>
|
||||
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.positionEmployeeGroupId"
|
||||
class="inputgreen"
|
||||
label="กลุ่มงาน"
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกกลุ่มงาน'}`]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.positionEmployeeLineId"
|
||||
class="inputgreen"
|
||||
label="สายงาน"
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกสายงาน'}`]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.positionEmployeePositionId"
|
||||
class="inputgreen"
|
||||
label="ตำแหน่งทางสายงาน"
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่งทางสายงาน'}`]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.employeeOc"
|
||||
class="inputgreen"
|
||||
label="สังกัด"
|
||||
/>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกสังกัด'}`]" -->
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.employeeTypeIndividual"
|
||||
class="inputgreen"
|
||||
label="ประเภทบุคคล"
|
||||
/>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกประเภทบุคคล'}`]" -->
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.employeeWage"
|
||||
class="inputgreen"
|
||||
label="ค่าจ้าง"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกค่าจ้าง'}`]" -->
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.employeeMoneyIncrease"
|
||||
class="inputgreen"
|
||||
label="เงินเพิ่มการครองชึพชั่วคราว"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเงินเพิ่มการครองชึพชั่วคราว'}`]" -->
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.employeeMoneyAllowance"
|
||||
class="inputgreen"
|
||||
label="เงินช่วยเหลือการครองชึพชั่วคราว"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเงินช่วยเหลือการครองชึพชั่วคราว'}`]" -->
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.employeeMoneyEmployee"
|
||||
class="inputgreen"
|
||||
label="เงินสมทบประกันสังคม(ลูกจ้าง)"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเงินสมทบประกันสังคม(ลูกจ้าง)'}`]" -->
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.employeeMoneyEmployer"
|
||||
class="inputgreen"
|
||||
label="เงินสมทบประกันสังคม(นายจ้าง)"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
/>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเงินสมทบประกันสังคม(นายจ้าง))'}`]" -->
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<!-- Dialog ประวัติการแก้ไขข้อมูลลูกจ้างชั่วคราว -->
|
||||
<q-dialog v-model="modalHistory" persistent>
|
||||
<q-card style="min-width: 80%">
|
||||
<DialogHeader
|
||||
tittle="ประวัติแก้ไขข้อมูลส่วนตัว"
|
||||
:close="() => (modalHistory = false)"
|
||||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
<q-space />
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
v-model="filter"
|
||||
ref="filterRef"
|
||||
outlined
|
||||
placeholder="ค้นหา"
|
||||
debounce="300"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filter == ''"
|
||||
name="search"
|
||||
@click.stop.prevent="filter = ''"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
<q-icon
|
||||
v-if="filter"
|
||||
name="cancel"
|
||||
@click.stop.prevent="filter = ''"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns"
|
||||
option-value="name"
|
||||
options-cover
|
||||
style="min-width: 150px"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<d-table
|
||||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
dense
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
:visible-columns="visibleColumns"
|
||||
:filter="filter"
|
||||
>
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td v-for="col in props.cols" :key="col.id">
|
||||
<div>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right"> </q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,514 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
import { useQuasar } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import type { QTableProps } from "quasar";
|
||||
import type {
|
||||
Employment,
|
||||
EmploymentHistory,
|
||||
} from "@/modules/04_registryNew/interface/response/Employee";
|
||||
import type { FormEmployment } from "@/modules/04_registryNew/interface/request/Employee";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
const {
|
||||
date2Thai,
|
||||
dialogConfirm,
|
||||
dialogRemove,
|
||||
success,
|
||||
messageError,
|
||||
hideLoader,
|
||||
showLoader,
|
||||
} = useCounterMixin();
|
||||
|
||||
const profileId = ref<string>(route.params.id.toString());
|
||||
|
||||
/** ข้อมูลการจ้าง*/
|
||||
const rows = ref<Employment[]>([]);
|
||||
const filter = ref<string>("");
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "date",
|
||||
align: "left",
|
||||
label: "วันที่จ้าง",
|
||||
sortable: false,
|
||||
field: "date",
|
||||
format: (v) => date2Thai(v),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "command",
|
||||
align: "left",
|
||||
label: "คำสั่งจ้าง",
|
||||
sortable: false,
|
||||
field: "command",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "createdFullName",
|
||||
align: "left",
|
||||
label: "ผู้ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "createdFullName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
align: "left",
|
||||
label: "วันที่แก้ไข",
|
||||
sortable: true,
|
||||
field: "lastUpdatedAt",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (v) => date2Thai(v),
|
||||
},
|
||||
]);
|
||||
const visibleColumns = ref<string[]>([
|
||||
"date",
|
||||
"command",
|
||||
"createdFullName",
|
||||
"createdAt",
|
||||
]);
|
||||
const modalEmployment = ref<boolean>(false);
|
||||
const isEdit = ref<boolean>(false);
|
||||
const employmentId = ref<string>("");
|
||||
const formData = reactive<FormEmployment>({
|
||||
date: null,
|
||||
command: "",
|
||||
});
|
||||
|
||||
/** function fetch ข้อมูลรายการการจ้าง*/
|
||||
function fetchListEmployment() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.employmentEmployee(profileId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
rows.value = data;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* function fetch ข้อมูลการจ้าง
|
||||
* @param id รายการการจ้าง
|
||||
*/
|
||||
function fetchDataEmployment(id: string) {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.employmentEmployeeId(id))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
formData.date = data.date;
|
||||
formData.command = data.command;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* function เปิด dialog Form ข้อมูลการจ้าง
|
||||
* @param statusEdit สถานะการ สร้าง หรือ แก่ไข
|
||||
* @param id รายการการจ้าง
|
||||
*/
|
||||
function onOpenDialog(statusEdit: boolean = false, id: string = "") {
|
||||
modalEmployment.value = true;
|
||||
if (statusEdit) {
|
||||
isEdit.value = statusEdit;
|
||||
employmentId.value = id;
|
||||
fetchDataEmployment(id);
|
||||
}
|
||||
}
|
||||
|
||||
/** function ปิด dialog Form ข้อมูลการจ้าง*/
|
||||
function onCloseDialog() {
|
||||
modalEmployment.value = false;
|
||||
isEdit.value = false;
|
||||
employmentId.value = "";
|
||||
formData.date = null;
|
||||
formData.command = "";
|
||||
}
|
||||
|
||||
/** function บันทึกข้อมูลการจ้าง*/
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
showLoader();
|
||||
const methods = isEdit.value ? "put" : "post";
|
||||
const id = isEdit.value ? employmentId.value : profileId.value;
|
||||
http[methods](config.API.employmentEmployee(id), formData)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
fetchListEmployment();
|
||||
onCloseDialog();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* function ลบข้อมูลรายการจ้าง
|
||||
* @param id รายการจ้าง
|
||||
*/
|
||||
function onDeleteEmployment(id: string) {
|
||||
dialogRemove($q, () => {
|
||||
showLoader();
|
||||
http
|
||||
.delete(config.API.employmentEmployee(id))
|
||||
.then(() => {
|
||||
success($q, "ลบข้อมูลสำเร็จ");
|
||||
fetchListEmployment();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/** ประวัติข้อมูลการจ้าง*/
|
||||
const modalHistory = ref<boolean>(false);
|
||||
const rowsHistory = ref<EmploymentHistory[]>([]);
|
||||
const filterHistory = ref<string>("");
|
||||
|
||||
/**
|
||||
* function เปิด dialog ประวัติการแก้ไขข้อมูลการจ้าง
|
||||
* @param id รายการการจ้าง
|
||||
*/
|
||||
function onClickHistory(id: string) {
|
||||
modalHistory.value = true;
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.employmentHistoryEmployee(id))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
rowsHistory.value = data;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
profileId.value && fetchListEmployment();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex items-center">
|
||||
<div class="q-gutter-sm">
|
||||
<q-btn
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
color="primary"
|
||||
icon="mdi-plus"
|
||||
@click="onOpenDialog()"
|
||||
>
|
||||
<q-tooltip>เพิ่มข้อมูลการจ้าง</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
|
||||
<q-space />
|
||||
<div class="q-gutter-sm" style="display: flex">
|
||||
<q-input outlined dense v-model="filter" label="ค้นหา">
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filter == ''"
|
||||
name="search"
|
||||
@click.stop.prevent="filter = ''"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
<q-icon
|
||||
v-if="filter"
|
||||
name="cancel"
|
||||
@click.stop.prevent="filter = ''"
|
||||
class="cursor-pointer"
|
||||
/> </template
|
||||
></q-input>
|
||||
|
||||
<q-select
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns?.slice(0, 2)"
|
||||
option-value="name"
|
||||
options-cover
|
||||
style="min-width: 150px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="q-mt-sm">
|
||||
<d-table
|
||||
flat
|
||||
bordered
|
||||
id="table"
|
||||
ref="table"
|
||||
:columns="columns?.slice(0, 2)"
|
||||
:rows="rows"
|
||||
:filter="filter"
|
||||
row-key="dateEmployment"
|
||||
:paging="true"
|
||||
dense
|
||||
:visible-columns="visibleColumns"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
<q-th auto-width></q-th>
|
||||
<q-th auto-width></q-th>
|
||||
<q-th auto-width></q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer" style="height: 40px">
|
||||
<q-td v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<div>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="primary"
|
||||
icon="mdi-pencil"
|
||||
@click="onOpenDialog(true, props.row.id)"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-td>
|
||||
<q-td>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="red"
|
||||
icon="mdi-delete"
|
||||
@click="onDeleteEmployment(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ลบข้อมูล</q-tooltip></q-btn
|
||||
>
|
||||
</q-td>
|
||||
<q-td>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
color="info"
|
||||
icon="mdi-history"
|
||||
@click="onClickHistory(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ประวัติข้อมูลการจ้าง </q-tooltip>
|
||||
</q-btn>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
</div>
|
||||
|
||||
<!-- Dialog เพิ่มข้อมูลการจ้าง -->
|
||||
<q-dialog v-model="modalEmployment" persistent>
|
||||
<q-card style="width: 700px; max-width: 80vw">
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<DialogHeader
|
||||
:tittle="isEdit ? 'แก้ข้อมูลการจ้าง' : 'เพิ่มข้อมูลการจ้าง'"
|
||||
:close="onCloseDialog"
|
||||
/>
|
||||
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="formData.date"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
class="inputgreen"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
formData.date != null ? date2Thai(formData.date) : null
|
||||
"
|
||||
label="วันที่จ้าง"
|
||||
hide-bottom-space
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่จ้าง'}`]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
class="inputgreen"
|
||||
outlined
|
||||
v-model="formData.command"
|
||||
label="คำสั่งจ้าง"
|
||||
hide-bottom-space
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่งจ้าง'}`]"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<!-- Dialog ประวัติการแก้ไขข้อมูลลูกจ้างชั่วคราว -->
|
||||
<q-dialog v-model="modalHistory" persistent>
|
||||
<q-card style="min-width: 80%">
|
||||
<DialogHeader
|
||||
tittle="ประวัติแก้ไขข้อมูลส่วนตัว"
|
||||
:close="() => (modalHistory = false)"
|
||||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
<q-space />
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
v-model="filterHistory"
|
||||
outlined
|
||||
placeholder="ค้นหา"
|
||||
debounce="300"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filterHistory == ''"
|
||||
name="search"
|
||||
@click.stop.prevent="filterHistory = ''"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
<q-icon
|
||||
v-if="filterHistory"
|
||||
name="cancel"
|
||||
@click.stop.prevent="filterHistory = ''"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns"
|
||||
option-value="name"
|
||||
options-cover
|
||||
style="min-width: 150px"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<d-table
|
||||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
dense
|
||||
:columns="columns"
|
||||
:rows="rowsHistory"
|
||||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
:visible-columns="visibleColumns"
|
||||
:filter="filterHistory"
|
||||
>
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td v-for="col in props.cols" :key="col.id">
|
||||
<div>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right"> </q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
import DataEmployee from "@/modules/04_registryNew/components/detail/Employee/01_DataEmployee.vue";
|
||||
import Employment from "@/modules/04_registryNew/components/detail/Employee/02_Employment.vue";
|
||||
|
||||
const tab = ref<string>("1");
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-my-md">
|
||||
<div class="text-dark row items-center q-px-md">
|
||||
<q-icon name="mdi-account" class="q-mr-md" size="22px" />
|
||||
<div class="text-subtitle1 text-weight-bold">ข้อมูลลูกจ้างชั่วคราว</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
active-color="blue-8"
|
||||
align="left"
|
||||
bordered
|
||||
narrow-indicator
|
||||
indicator-color="transparent"
|
||||
dense
|
||||
class="text-grey q-pl-sm"
|
||||
>
|
||||
<q-tab name="1" label="ข้อมูลลูกจ้างชั่วคราว" />
|
||||
<q-tab name="2" label="ข้อมูลการจ้าง" />
|
||||
</q-tabs>
|
||||
<q-separator />
|
||||
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel name="1">
|
||||
<DataEmployee />
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="2">
|
||||
<Employment />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -660,9 +660,9 @@ onMounted(() => {
|
|||
<DialogHeader tittle="แก้ไขข้อมูลราชการ" :close="closeDialog" />
|
||||
<q-separator color="grey-4" />
|
||||
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-6">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker
|
||||
v-model="containDate"
|
||||
:locale="'th'"
|
||||
|
|
@ -704,7 +704,7 @@ onMounted(() => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker
|
||||
v-model="workDate"
|
||||
:locale="'th'"
|
||||
|
|
@ -764,15 +764,7 @@ onMounted(() => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -598,7 +598,7 @@ onMounted(async () => {
|
|||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="disciplineData.date"
|
||||
|
|
@ -634,7 +634,7 @@ onMounted(async () => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
ref="detailRef"
|
||||
class="full-width inputgreen cursor-pointer"
|
||||
|
|
@ -647,7 +647,7 @@ onMounted(async () => {
|
|||
:label="`${'รายละเอียด'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<selector
|
||||
class="full-width inputgreen cursor-pointer"
|
||||
outlined
|
||||
|
|
@ -669,7 +669,7 @@ onMounted(async () => {
|
|||
) "
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
class="full-width inputgreen cursor-pointer"
|
||||
outlined
|
||||
|
|
@ -679,7 +679,7 @@ onMounted(async () => {
|
|||
:label="`${'ล้างมลทิน'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
ref="refCommandNoRef"
|
||||
class="full-width inputgreen cursor-pointer"
|
||||
|
|
@ -696,7 +696,7 @@ onMounted(async () => {
|
|||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="disciplineData.refCommandDate"
|
||||
|
|
@ -737,15 +737,7 @@ onMounted(async () => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
div
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
|
|
@ -683,7 +682,7 @@ onMounted(() => {
|
|||
/>
|
||||
<q-separator color="grey-4" />
|
||||
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
|
|
@ -802,15 +801,7 @@ onMounted(() => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -541,8 +541,8 @@ onMounted(async () => {
|
|||
"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
|
|
@ -709,15 +709,7 @@ onMounted(async () => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -291,8 +291,9 @@ async function editData() {
|
|||
await http
|
||||
.put(config.API.profileNewProfileById(id.value, empType.value), {
|
||||
...formData,
|
||||
employeeClass: route.name === "registry-employeeId" ? "TEMP" : undefined,
|
||||
})
|
||||
.then((res) => {
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
getData(), (modal.value = false);
|
||||
props.fetchDataPersonal?.();
|
||||
|
|
@ -504,7 +505,7 @@ onMounted(async () => {
|
|||
/>
|
||||
|
||||
<q-separator />
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
|
|
@ -781,8 +782,6 @@ onMounted(async () => {
|
|||
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
|
|
|
|||
|
|
@ -709,12 +709,13 @@ watch(
|
|||
:tittle="dialogStatus === 'edit' ? 'แก้ไขข้อมูล' : 'เพิ่มข้อมูล'"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<q-card-section>
|
||||
<div class="row q-mb-sm">
|
||||
<div class="col-5">
|
||||
<q-select
|
||||
class="inputgreen"
|
||||
outlined
|
||||
v-model="changeNameData.status"
|
||||
:options="statusOption"
|
||||
|
|
@ -923,9 +924,7 @@ watch(
|
|||
<q-btn
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
dense
|
||||
:disable="submitDisable"
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
|
|
|
|||
|
|
@ -254,7 +254,9 @@ const columnsHistory = ref<QTableProps["columns"]>([
|
|||
async function getData() {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileNewAddressByProfileId(profileId.value,empType.value))
|
||||
.get(
|
||||
config.API.profileNewAddressByProfileId(profileId.value, empType.value)
|
||||
)
|
||||
.then((res) => {
|
||||
Object.assign(addressData, res.data.result);
|
||||
|
||||
|
|
@ -369,7 +371,7 @@ async function fetchAll() {
|
|||
async function editData() {
|
||||
showLoader();
|
||||
await http
|
||||
.patch(config.API.profileNewAddressById(id.value,empType.value), {
|
||||
.patch(config.API.profileNewAddressById(id.value, empType.value), {
|
||||
...formData,
|
||||
id: undefined,
|
||||
})
|
||||
|
|
@ -423,7 +425,7 @@ async function onClickOpenDialog() {
|
|||
async function clickHistory() {
|
||||
modalHistory.value = true;
|
||||
await http
|
||||
.get(config.API.profileNewAddressHisById(id.value,empType.value))
|
||||
.get(config.API.profileNewAddressHisById(id.value, empType.value))
|
||||
.then((res) => {
|
||||
rowsHistory.value = res.data.result;
|
||||
})
|
||||
|
|
@ -580,8 +582,8 @@ onMounted(async () => {
|
|||
<q-card>
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<DialogHeader tittle="แก้ไขข้อมูลที่อยู่" :close="clickClose" />
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 60vh" class="scroll">
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="col-12 q-pb-xs">
|
||||
<q-input
|
||||
dense
|
||||
|
|
@ -802,15 +804,7 @@ onMounted(async () => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -260,7 +260,6 @@ function fetchDataChildren() {
|
|||
function onSubmit(type: string) {
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
|
||||
const formBody = {
|
||||
profileId:
|
||||
!isEdit.value && empType.value === "" ? profileId.value : undefined,
|
||||
|
|
@ -325,7 +324,7 @@ function onOpenDialogForm(
|
|||
|
||||
if (type === "father") {
|
||||
titleForm.value = "บิดา";
|
||||
console.log(fatherData.isLive);
|
||||
console.log(fatherData);
|
||||
|
||||
fromData.isLive =
|
||||
fatherData.isLive === null ? 1 : fatherData.isLive ? 1 : 0;
|
||||
|
|
@ -793,7 +792,7 @@ onMounted(() => {
|
|||
"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="q-col-gutter-sm">
|
||||
<div class="row col" v-if="typeForm === 'couple'">
|
||||
|
|
@ -832,8 +831,10 @@ onMounted(() => {
|
|||
:rules="
|
||||
typeForm !== 'couple'
|
||||
? [
|
||||
(val) => !!val || 'กรุณากรอกเลขบัตรประชาชน',
|
||||
(val) =>
|
||||
val.length === 13 || 'กรุณากรอกเลขบัตรประชาชน',
|
||||
val.length === 13 ||
|
||||
'กรุณากรอกเลขบัตรประชาชนให้ครบ 13 หลัก',
|
||||
]
|
||||
: []
|
||||
"
|
||||
|
|
@ -951,17 +952,9 @@ onMounted(() => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<div class="q-pa-sm">
|
||||
<q-btn
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
>
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
|
|
@ -981,7 +974,7 @@ onMounted(() => {
|
|||
}`"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
<q-space />
|
||||
|
|
|
|||
|
|
@ -801,7 +801,7 @@ onMounted(async () => {
|
|||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td v-for="col in props.cols" :key="col.id">
|
||||
<div>
|
||||
{{ col.value === ""|| col.value === null ? "-" : col.value }}
|
||||
{{ col.value === "" || col.value === null ? "-" : col.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
|
|
@ -975,7 +975,7 @@ onMounted(async () => {
|
|||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator />
|
||||
<q-card-section style="max-height: 60vh" class="scroll">
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-6">
|
||||
<q-select
|
||||
|
|
@ -1386,15 +1386,7 @@ onMounted(async () => {
|
|||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn id="onSubmit" type="submit" label="บันทึก" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -510,8 +510,8 @@ onMounted(async () => {
|
|||
"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
|
|
@ -563,15 +563,7 @@ onMounted(async () => {
|
|||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import type {
|
|||
DataOption2,
|
||||
DataOption,
|
||||
} from "@/modules/04_registryNew/interface/index/Main";
|
||||
import type { ObjectSalaryRef } from "@/modules/04_registryNew/interface/index/salary";
|
||||
|
||||
import type { FormSalaryNew } from "@/modules/04_registryNew/interface/request/Salary";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
|
@ -669,7 +669,7 @@ onMounted(() => {
|
|||
/>
|
||||
<q-separator color="grey-4" />
|
||||
|
||||
<q-card-section style="max-height: 55vh" class="scroll">
|
||||
<q-card-section style="max-height: 100%" class="scroll">
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
|
|
@ -984,15 +984,7 @@ onMounted(() => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -436,11 +436,11 @@ onMounted(() => {
|
|||
"
|
||||
:close="onClickCloseDialog"
|
||||
/>
|
||||
<q-separator color="grey-4" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 55vh" class="scroll">
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="formData.date"
|
||||
|
|
@ -477,7 +477,7 @@ onMounted(() => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
ref="referenceRef"
|
||||
outlined
|
||||
|
|
@ -507,7 +507,7 @@ onMounted(() => {
|
|||
:label="`${'รายละเอียด'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
|
|
@ -523,7 +523,7 @@ onMounted(() => {
|
|||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="formData.refCommandDate"
|
||||
|
|
@ -567,15 +567,7 @@ onMounted(() => {
|
|||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-btn label="บันทึก" id="onSubmit" type="submit" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
|
||||
import { useRegistryDetailNewDataStore } from "@/modules/04_registryNew/stores/DetailMain";
|
||||
|
||||
|
|
@ -8,6 +9,9 @@ import GovernmentInformationMain from "@/modules/04_registryNew/components/detai
|
|||
import salaryMain from "@/modules/04_registryNew/components/detail/Salary/Main.vue";
|
||||
import AchievementMain from "@/modules/04_registryNew/components/detail/Achievement/Main.vue";
|
||||
import OtherMaim from "@/modules/04_registryNew/components/detail/Other/Main.vue";
|
||||
import EmployeeMain from "@/modules/04_registryNew/components/detail/Employee/Main.vue";
|
||||
|
||||
const route = useRoute();
|
||||
|
||||
const store = useRegistryDetailNewDataStore();
|
||||
const props = defineProps({
|
||||
|
|
@ -23,7 +27,10 @@ const itemsTab = ref<any>([
|
|||
{
|
||||
name: "2",
|
||||
icon: "mdi-account-tie",
|
||||
label: "ข้อมูลราชการ",
|
||||
label:
|
||||
route.name === "registry-employeeId"
|
||||
? "ข้อมูลลูกจ้างชั่วคราว"
|
||||
: "ข้อมูลราชการ",
|
||||
},
|
||||
{
|
||||
name: "3",
|
||||
|
|
@ -88,7 +95,11 @@ const splitterModel = ref<number>(12);
|
|||
v-if="store.tabMain === '1'"
|
||||
:fetchDataPersonal="props.fetchDataPersonal"
|
||||
/>
|
||||
<GovernmentInformationMain v-if="store.tabMain === '2'" />
|
||||
<EmployeeMain
|
||||
v-if="store.tabMain === '2' && route.name === 'registry-employeeId'"
|
||||
/>
|
||||
<GovernmentInformationMain v-else-if="store.tabMain === '2'" />
|
||||
|
||||
<salaryMain v-if="store.tabMain === '3'" />
|
||||
<AchievementMain v-if="store.tabMain === '4'" />
|
||||
<OtherMaim v-if="store.tabMain === '5'" />
|
||||
|
|
|
|||
19
src/modules/04_registryNew/interface/request/Employee.ts
Normal file
19
src/modules/04_registryNew/interface/request/Employee.ts
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
interface FormEmployee {
|
||||
positionEmployeeGroupId: string;
|
||||
positionEmployeeLineId: string;
|
||||
positionEmployeePositionId: string;
|
||||
employeeOc: string;
|
||||
employeeTypeIndividual: string;
|
||||
employeeWage: string;
|
||||
employeeMoneyIncrease: string;
|
||||
employeeMoneyAllowance: string;
|
||||
employeeMoneyEmployee: string;
|
||||
employeeMoneyEmployer: string;
|
||||
}
|
||||
|
||||
interface FormEmployment {
|
||||
command: string;
|
||||
date: null | Date;
|
||||
}
|
||||
|
||||
export type { FormEmployee, FormEmployment };
|
||||
|
|
@ -2,20 +2,20 @@ interface RequestObject {
|
|||
birthDate: Date | null;
|
||||
bloodGroup: string | null;
|
||||
citizenId: string;
|
||||
email: string | null;
|
||||
// email: string | null;
|
||||
ethnicity: string | null;
|
||||
firstName: string;
|
||||
gender: string | null;
|
||||
lastName: string;
|
||||
nationality: string | null;
|
||||
phone: string | null;
|
||||
posLevelId: string;
|
||||
posTypeId: string;
|
||||
// posLevelId: string;
|
||||
// posTypeId: string;
|
||||
prefix: string;
|
||||
rank: string | null;
|
||||
relationship: string | null;
|
||||
religion: string | null;
|
||||
telephoneNumber: string | null;
|
||||
// telephoneNumber: string | null;
|
||||
}
|
||||
|
||||
export type { RequestObject };
|
||||
|
|
|
|||
54
src/modules/04_registryNew/interface/response/Employee.ts
Normal file
54
src/modules/04_registryNew/interface/response/Employee.ts
Normal file
|
|
@ -0,0 +1,54 @@
|
|||
interface EmployeeHistory {
|
||||
createdAt: string;
|
||||
createdFullName: string;
|
||||
createdUserId: string;
|
||||
employeeMoneyAllowance: string;
|
||||
employeeMoneyEmployee: string;
|
||||
employeeMoneyEmployer: string;
|
||||
employeeMoneyIncrease: string;
|
||||
employeeOc: string;
|
||||
employeeTypeIndividual: string;
|
||||
employeeWage: string;
|
||||
id: string;
|
||||
lastUpdateFullName: string;
|
||||
lastUpdateUserId: string;
|
||||
lastUpdatedAt: string;
|
||||
positionEmployeeGroupId: string;
|
||||
positionEmployeeLineId: string;
|
||||
positionEmployeePositionId: string;
|
||||
}
|
||||
|
||||
interface Employment {
|
||||
command: string;
|
||||
date: string | Date;
|
||||
id: string;
|
||||
}
|
||||
|
||||
interface EmploymentHistory {
|
||||
command: string;
|
||||
createdAt: string | Date;
|
||||
createdFullName: string;
|
||||
createdUserId: string;
|
||||
date: string | Date;
|
||||
id: string;
|
||||
lastUpdateFullName: string;
|
||||
lastUpdateUserId: string;
|
||||
lastUpdatedAt: string | Date;
|
||||
profileEmployeeEmploymentId: string;
|
||||
}
|
||||
|
||||
interface ResEmployee {
|
||||
id: string;
|
||||
positionEmployeeGroupId: string;
|
||||
positionEmployeeLineId: string;
|
||||
positionEmployeePositionId: string;
|
||||
employeeOc: string;
|
||||
employeeTypeIndividual: string;
|
||||
employeeWage: string;
|
||||
employeeMoneyIncrease: string;
|
||||
employeeMoneyAllowance: string;
|
||||
employeeMoneyEmployee: string;
|
||||
employeeMoneyEmployer: string;
|
||||
}
|
||||
|
||||
export type { Employment, EmploymentHistory, EmployeeHistory, ResEmployee };
|
||||
|
|
@ -28,16 +28,16 @@ export const useProfileDataStore = defineStore("profile", () => {
|
|||
bloodGroup: null,
|
||||
relationship: null,
|
||||
gender: null,
|
||||
posTypeId: "",
|
||||
posLevelId: "",
|
||||
// posTypeId: "",
|
||||
// posLevelId: "",
|
||||
religion: null,
|
||||
citizenId: "",
|
||||
telephoneNumber: null,
|
||||
// telephoneNumber: null,
|
||||
nationality: null,
|
||||
ethnicity: null,
|
||||
birthDate: null,
|
||||
phone: null,
|
||||
email: null,
|
||||
// email: null,
|
||||
lastName: "",
|
||||
firstName: "",
|
||||
prefix: "",
|
||||
|
|
|
|||
|
|
@ -7,10 +7,10 @@ import http from "@/plugins/http";
|
|||
import config from "@/app.config";
|
||||
import { useQuasar } from "quasar";
|
||||
import type { DataOption } from "@/modules/04_registryNew/interface/index/Main";
|
||||
import type { DataPerson } from "@/modules/04_registryNew/interface/response/Main";
|
||||
|
||||
import avatar from "@/assets/avatar_user.jpg";
|
||||
import TabMain from "@/modules/04_registryNew/components/detail/TabMain.vue";
|
||||
import UploadFile from "@/modules/11_discipline/components/UploadFile.vue";
|
||||
|
||||
import type { ResponseObject } from "@/modules/04_registryNew/interface/response/Profile";
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
/** ถึงเเก่กรรม */
|
||||
|
|
@ -579,7 +579,11 @@ onMounted(async () => {
|
|||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
/>
|
||||
ทะเบียนประวัติ
|
||||
{{
|
||||
route.name === "registry-employeeId"
|
||||
? " ทะเบียนประวัติลูกจ้างชั่วคราว"
|
||||
: "ทะเบียนประวัติ"
|
||||
}}
|
||||
</div>
|
||||
<q-space />
|
||||
<q-btn-dropdown
|
||||
|
|
@ -668,7 +672,9 @@ onMounted(async () => {
|
|||
v-if="formDetail && formDetail.firstName && formDetail.lastName"
|
||||
>
|
||||
{{
|
||||
`${formDetail?.prefix}${formDetail?.firstName} ${formDetail?.lastName} ${leaveReason}`
|
||||
`${formDetail?.prefix ? formDetail?.prefix : ""}${
|
||||
formDetail?.firstName
|
||||
} ${formDetail?.lastName} ${leaveReason}`
|
||||
}}
|
||||
</h2>
|
||||
</div>
|
||||
|
|
@ -846,20 +852,8 @@ onMounted(async () => {
|
|||
<!-- Dialog เลือก Image -->
|
||||
<q-dialog v-model="dialogImage" persistent>
|
||||
<q-card style="width: 100vw; max-width: 60vw">
|
||||
<q-card-section class="q-py-sm row">
|
||||
<div class="text-h6">เลือกรูปภาพ</div>
|
||||
<q-space />
|
||||
<q-btn
|
||||
icon="close"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
@click="closeImage"
|
||||
style="color: #ff8080; background-color: #ffdede"
|
||||
>
|
||||
<q-tooltip>ปิดหน้านี้</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-section>
|
||||
<DialogHeader :tittle="'เลือกรูปภาพ'" :close="closeImage" />
|
||||
|
||||
<q-separator />
|
||||
<q-card-section class="col-12 row">
|
||||
<div
|
||||
|
|
@ -931,23 +925,7 @@ onMounted(async () => {
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<!-- <q-btn
|
||||
flat
|
||||
round
|
||||
color="red"
|
||||
@click="() => {}"
|
||||
icon="mdi-delete-outline"
|
||||
>
|
||||
<q-tooltip>ลบรูปภาพ</q-tooltip>
|
||||
</q-btn> -->
|
||||
<q-btn
|
||||
icon="check"
|
||||
dense
|
||||
flat
|
||||
round
|
||||
@click="selectAvatarHistory"
|
||||
color="positive"
|
||||
>
|
||||
<q-btn @click="selectAvatarHistory" color="public" label="เลือกรูปภาพ">
|
||||
<q-tooltip>เลือกรูปภาพ</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -70,9 +70,6 @@ function fetchType() {
|
|||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -85,14 +82,10 @@ function fetchLevel() {
|
|||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function fetchOptionGroup() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.orgEmployeeType)
|
||||
.then((res) => {
|
||||
|
|
@ -100,14 +93,10 @@ function fetchOptionGroup() {
|
|||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function fetchLevelGroup() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.orgEmployeelevel)
|
||||
.then((res) => {
|
||||
|
|
@ -115,9 +104,6 @@ function fetchLevelGroup() {
|
|||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -195,6 +195,7 @@ async function onClickSelectPos(id: string) {
|
|||
(e) => e.id === seletcId.value
|
||||
);
|
||||
}
|
||||
console.log(selected.value);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -208,7 +209,7 @@ onMounted(async () => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="column q-col-gutter-sm" style="height: 70vh">
|
||||
<div class="column q-col-gutter-sm">
|
||||
<!-- เลือกเลขที่ตำแหน่ง -->
|
||||
<div class="col-7">
|
||||
<q-card bordered style="height: 100%; border: 1px solid #d6dee1">
|
||||
|
|
|
|||
|
|
@ -198,8 +198,7 @@ async function fetchPosFind(level: number, id: string) {
|
|||
.post(config.API.orgPosFind, body)
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
console.log(data);
|
||||
|
||||
|
||||
expanded.value = data;
|
||||
nodeId.value = id;
|
||||
positionId.value = props?.dataRow?.posmasterId;
|
||||
|
|
@ -280,9 +279,8 @@ watch(
|
|||
if (modal.value) {
|
||||
await fetchOrganizationActive();
|
||||
console.log(props?.dataRow);
|
||||
|
||||
if (props?.dataRow?.node !== null && props?.dataRow?.nodeId !== null) {
|
||||
|
||||
if (props?.dataRow?.node !== null && props?.dataRow?.nodeId !== null) {
|
||||
await fetchPosFind(props?.dataRow?.node, props?.dataRow?.nodeId);
|
||||
} else {
|
||||
expanded.value = [];
|
||||
|
|
@ -348,7 +346,7 @@ watch(
|
|||
<q-card
|
||||
bordered
|
||||
class="col-12 col-sm-3 scroll q-pa-sm"
|
||||
style="height: 75vh"
|
||||
style="height: 80vh"
|
||||
>
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-toolbar-title class="text-subtitle2 text-bold"
|
||||
|
|
@ -410,7 +408,11 @@ watch(
|
|||
</q-tree>
|
||||
</q-card>
|
||||
|
||||
<q-card bordered class="col-12 col-sm-9 q-pa-sm">
|
||||
<q-card
|
||||
bordered
|
||||
class="col-12 col-sm-9 q-pa-sm scroll"
|
||||
style="height: 80vh"
|
||||
>
|
||||
<q-tab-panels
|
||||
v-model="nodeId"
|
||||
animated
|
||||
|
|
|
|||
|
|
@ -165,20 +165,20 @@ interface CheckboxItem {
|
|||
async function dataEdit(id: string) {
|
||||
// await myForm.value.validate().then((result: boolean) => {
|
||||
// if (result) {
|
||||
showLoader();
|
||||
const data = putDataEdit(id);
|
||||
http
|
||||
.put(config.API.saveEditAssign(id), data)
|
||||
.then(() => {})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
isEdit.value = false;
|
||||
getAssign();
|
||||
hideLoader();
|
||||
});
|
||||
// } else {
|
||||
// dialogMessageNotify($q, "กรุณากรอกข้อมูลให้ครบ");
|
||||
// }
|
||||
showLoader();
|
||||
const data = putDataEdit(id);
|
||||
http
|
||||
.put(config.API.saveEditAssign(id), data)
|
||||
.then(() => {})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
isEdit.value = false;
|
||||
getAssign();
|
||||
hideLoader();
|
||||
});
|
||||
// } else {
|
||||
// dialogMessageNotify($q, "กรุณากรอกข้อมูลให้ครบ");
|
||||
// }
|
||||
// });
|
||||
}
|
||||
|
||||
|
|
@ -308,16 +308,22 @@ async function getUser() {
|
|||
|
||||
OPcaretaker.value = data.caregiver.map((item: any) => ({
|
||||
id: item.id,
|
||||
name: item.prefix + item.firstName + " " + item.lastName,
|
||||
name:
|
||||
(item.prefix == null ? "" : item.prefix) +
|
||||
item.firstName +
|
||||
" " +
|
||||
item.lastName,
|
||||
label: item.position
|
||||
? `${item.prefix} ${item.firstName} ${item.lastName} (${
|
||||
item.position
|
||||
}${
|
||||
? `${item.prefix == null ? "" : item.prefix} ${item.firstName} ${
|
||||
item.lastName
|
||||
} (${item.position}${
|
||||
item.posLevel && item.posType
|
||||
? ", " + item.posType + ": " + item.posLevel
|
||||
: ""
|
||||
})`
|
||||
: `${item.prefix} ${item.firstName} ${item.lastName}`,
|
||||
: `${item.prefix == null ? "" : item.prefix} ${item.firstName} ${
|
||||
item.lastName
|
||||
}`,
|
||||
citizenId: item.citizenId,
|
||||
isDirector: item.isDirector,
|
||||
posLevel: item.posLevel,
|
||||
|
|
@ -327,16 +333,22 @@ async function getUser() {
|
|||
|
||||
OPcommander.value = data.commander.map((item: any) => ({
|
||||
id: item.id,
|
||||
name: item.prefix + item.firstName + " " + item.lastName,
|
||||
name:
|
||||
(item.prefix == null ? "" : item.prefix) +
|
||||
item.firstName +
|
||||
" " +
|
||||
item.lastName,
|
||||
label: item.position
|
||||
? `${item.prefix} ${item.firstName} ${item.lastName} (${
|
||||
item.position
|
||||
}${
|
||||
? `${item.prefix == null ? "" : item.prefix} ${item.firstName} ${
|
||||
item.lastName
|
||||
} (${item.position}${
|
||||
item.posLevel && item.posType
|
||||
? ", " + item.posType + ": " + item.posLevel
|
||||
: ""
|
||||
})`
|
||||
: `${item.prefix} ${item.firstName} ${item.lastName}`,
|
||||
: `${item.prefix == null ? "" : item.prefix} ${item.firstName} ${
|
||||
item.lastName
|
||||
}`,
|
||||
citizenId: item.citizenId,
|
||||
posLevel: item.posLevel,
|
||||
posType: item.posType,
|
||||
|
|
@ -345,16 +357,22 @@ async function getUser() {
|
|||
|
||||
OPchairman.value = data.chairman.map((item: any) => ({
|
||||
id: item.id,
|
||||
name: item.prefix + item.firstName + " " + item.lastName,
|
||||
name:
|
||||
(item.prefix == null ? "-" : item.prefix) +
|
||||
item.firstName +
|
||||
" " +
|
||||
item.lastName,
|
||||
label: item.position
|
||||
? `${item.prefix} ${item.firstName} ${item.lastName} (${
|
||||
item.position
|
||||
}${
|
||||
? `${item.prefix == null ? "-" : item.prefix} ${item.firstName} ${
|
||||
item.lastName
|
||||
} (${item.position}${
|
||||
item.posLevel && item.posType
|
||||
? ", " + item.posType + ": " + item.posLevel
|
||||
: ""
|
||||
})`
|
||||
: `${item.prefix} ${item.firstName} ${item.lastName}`,
|
||||
: `${item.prefix == null ? "-" : item.prefix} ${item.firstName} ${
|
||||
item.lastName
|
||||
}`,
|
||||
citizenId: item.citizenId,
|
||||
posLevel: item.posLevel,
|
||||
posType: item.posType,
|
||||
|
|
@ -378,7 +396,7 @@ async function getAssignNew(id: string) {
|
|||
monthOp.push(monthOption);
|
||||
monthSelect.value = `${data.assign_month} เดือน`;
|
||||
fullname.value =
|
||||
data.person.prefixName +
|
||||
(data.person.prefixName == null ? "" : data.person.prefixName) +
|
||||
data.person.firstName +
|
||||
" " +
|
||||
data.person.lastName;
|
||||
|
|
@ -1059,7 +1077,9 @@ onMounted(async () => {
|
|||
<q-form
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="assignId !== undefined ? saveEdit(assignId) : saveData(personalId)"
|
||||
@validation-success="
|
||||
assignId !== undefined ? saveEdit(assignId) : saveData(personalId)
|
||||
"
|
||||
>
|
||||
<div class="q-pa-sm">
|
||||
<div class="toptitle text-dark col-12 row items-center">
|
||||
|
|
|
|||
|
|
@ -110,7 +110,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
sortable: true,
|
||||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
style: "font-size: 14px ",
|
||||
classes: "table_ellipsis",
|
||||
},
|
||||
{
|
||||
name: "probation_no",
|
||||
|
|
@ -179,7 +180,10 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return row.posTypeName + " (" + row.posLevelName + ")";
|
||||
return (
|
||||
(row.posTypeName ? row.posTypeName : "") +
|
||||
(row.posLevelName !== null ? " (" + row.posLevelName + ")" : "")
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -250,7 +254,7 @@ async function getpersonalList() {
|
|||
position_line_id: item.position_line_id,
|
||||
position_level: item.position_level,
|
||||
position_level_id: item.position_level_id,
|
||||
organization: item.organization,
|
||||
organization: item.organization !== "" ? item.organization : "-",
|
||||
probation_no: item.probation_no,
|
||||
order_number: item.order_number != "xx/2566" ? item.order_number : "-",
|
||||
probation_status: statusProbationMain(Number(item.probation_status)),
|
||||
|
|
@ -382,9 +386,7 @@ function clickAdd(data: any) {
|
|||
$q,
|
||||
async () => {
|
||||
showLoader();
|
||||
// const postData = {
|
||||
// personal_id: id,
|
||||
// };
|
||||
|
||||
await http
|
||||
.post(config.API.personalAdd(), data)
|
||||
.then(() => {
|
||||
|
|
@ -582,7 +584,7 @@ onMounted(async () => {
|
|||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ col.value }}
|
||||
{{ col.value ?? "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
|
|
@ -680,7 +682,7 @@ onMounted(async () => {
|
|||
|
||||
<div v-else-if="col.name == 'fullname'">
|
||||
{{
|
||||
props.row.prefix +
|
||||
(props.row.prefix ? props.row.prefix : "") +
|
||||
props.row.firstName +
|
||||
" " +
|
||||
props.row.lastName
|
||||
|
|
|
|||
|
|
@ -740,13 +740,14 @@ function updatemodalPersonal(modal: boolean) {
|
|||
<q-card style="width: 50vw">
|
||||
<DialogHeader tittle="กรอกเหตุผล" :close="closeDialog" />
|
||||
<q-separator />
|
||||
<q-card-section class="q-pt-none bg-grey-1">
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="note"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกเหตุผล']"
|
||||
:label="`${'กรอกเหตุผล'}`"
|
||||
|
|
@ -756,9 +757,12 @@ function updatemodalPersonal(modal: boolean) {
|
|||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
v-if="action === 'delete'"
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
color="secondary"
|
||||
:disable="visibleNote"
|
||||
|
|
@ -766,6 +770,7 @@ function updatemodalPersonal(modal: boolean) {
|
|||
/>
|
||||
<q-btn
|
||||
v-else
|
||||
unelevated
|
||||
label="บักทึก"
|
||||
color="secondary"
|
||||
@click="saveNote"
|
||||
|
|
@ -782,9 +787,10 @@ function updatemodalPersonal(modal: boolean) {
|
|||
<q-separator />
|
||||
<q-card-section>
|
||||
<q-form ref="myForm">
|
||||
<div class="row q-pa-md q-gutter-md">
|
||||
<div class="col-12">
|
||||
<div class="row q-gutter-md">
|
||||
<div class="col-12 q-pr-md">
|
||||
<q-file
|
||||
hide-bottom-space
|
||||
bg-color="white"
|
||||
clearable
|
||||
outlined
|
||||
|
|
@ -801,7 +807,7 @@ function updatemodalPersonal(modal: boolean) {
|
|||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="col-12 q-pr-md">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="signDate"
|
||||
|
|
@ -836,13 +842,14 @@ function updatemodalPersonal(modal: boolean) {
|
|||
</div>
|
||||
</q-form>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
color="public"
|
||||
icon="mdi-content-save-outline"
|
||||
@click="uploadFile(fileUpload, signDate)"
|
||||
>
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
|
|
|
|||
|
|
@ -114,12 +114,10 @@ const cerateRetirement = async (data: object) => {
|
|||
<q-dialog v-model="modal">
|
||||
<q-card style="width: 450px; max-width: 80vw">
|
||||
<q-card-section>
|
||||
<div class="text-h6">เพิ่มประกาศ</div>
|
||||
<h6 class="q-ma-none">เพิ่มประกาศ</h6>
|
||||
<p class="q-mb-none">เลือกประกาศที่ต้องการเพิ่มข้อมูล</p>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-section class="q-pt-none">
|
||||
เลือกประกาศที่ต้องการเพิ่มข้อมูล
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<div class="q-pa-md">
|
||||
<q-list>
|
||||
|
|
@ -196,7 +194,8 @@ const cerateRetirement = async (data: object) => {
|
|||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn flat label="ยกเลิก" color="red" v-close-popup />
|
||||
<q-btn
|
||||
flat
|
||||
unelevated
|
||||
color="teal"
|
||||
label="ตกลง"
|
||||
@click="clickSelect(action)"
|
||||
:disable="radio === '' || (action === '' && radio !== 'ADD')"
|
||||
|
|
|
|||
|
|
@ -1360,7 +1360,6 @@ onMounted(async () => {
|
|||
@click="clickSave"
|
||||
class="q-px-md"
|
||||
>
|
||||
<!-- icon="mdi-content-save-outline" -->
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<script setup lang="ts">
|
||||
divdiv<script setup lang="ts">
|
||||
import { ref, watch, computed } from "vue";
|
||||
import { QForm, useQuasar } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
|
|
@ -238,53 +238,43 @@ async function fectDataByid(id: string) {
|
|||
}
|
||||
|
||||
/** function บักทึกผล*/
|
||||
async function clickSave() {
|
||||
let body = {
|
||||
citizanId: cardid.value, // เลขประจำตัวประชาชน
|
||||
insigniaId: brand.value, // insigniaID
|
||||
number: Advertise.value,
|
||||
issue: issue.value,
|
||||
dateReceive: receivedate.value, // วันที่ได้รับเครื่องราชฯ
|
||||
organizationOrganizationSend: affiliationRequest.value,
|
||||
organizationOrganizationReceive: affiliationReceived.value,
|
||||
date: announceDate.value, // วันที่กิจนุเบก
|
||||
volumeNo: volume.value, // เล่ม
|
||||
section: episode.value, //ตอนที่
|
||||
page: duty.value, //หน้าที่
|
||||
no: announced.value,
|
||||
datePayment: invoiceDate.value, //วันที่จ่าย
|
||||
typePayment: payment.value, // รูปแบบการจ่าย
|
||||
address: addressPayment.value, //ที่อยู่
|
||||
};
|
||||
// เช็คค่าว่าง
|
||||
await myForm.value!.validate().then((result: boolean) => {
|
||||
if (result) {
|
||||
dialogConfirm($q, async () => {
|
||||
await addNote(body);
|
||||
});
|
||||
async function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
if (props.roundId !== undefined) {
|
||||
showLoader();
|
||||
let body = {
|
||||
citizanId: cardid.value, // เลขประจำตัวประชาชน
|
||||
insigniaId: brand.value, // insigniaID
|
||||
number: Advertise.value,
|
||||
issue: issue.value,
|
||||
dateReceive: receivedate.value, // วันที่ได้รับเครื่องราชฯ
|
||||
organizationOrganizationSend: affiliationRequest.value,
|
||||
organizationOrganizationReceive: affiliationReceived.value,
|
||||
date: announceDate.value, // วันที่กิจนุเบก
|
||||
volumeNo: volume.value, // เล่ม
|
||||
section: episode.value, //ตอนที่
|
||||
page: duty.value, //หน้าที่
|
||||
no: announced.value,
|
||||
datePayment: invoiceDate.value, //วันที่จ่าย
|
||||
typePayment: payment.value, // รูปแบบการจ่าย
|
||||
address: addressPayment.value, //ที่อยู่
|
||||
};
|
||||
http
|
||||
.put(config.API.noteAdd(props.roundId), body)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
props.close?.();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** function เพิ่มแก้ ข้อมูลบันทึกผล*/
|
||||
async function addNote(body: any) {
|
||||
if (props.roundId !== undefined) {
|
||||
await http
|
||||
.put(config.API.noteAdd(props.roundId), body)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
if (props.close) {
|
||||
props.close();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** function หาเลขประจำตัวประชาชน*/
|
||||
function searchcardid() {
|
||||
if (cardid.value.length === 13) {
|
||||
|
|
@ -317,12 +307,16 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
|
||||
<template>
|
||||
<q-dialog v-model="props.modal" persistent>
|
||||
<q-card style="min-width: 900px" class="q-pb-md">
|
||||
<DialogHeader tittle="บันทึกผล" :close="props.close" />
|
||||
<q-separator />
|
||||
|
||||
<q-form ref="myForm">
|
||||
<div class="q-pa-md bg-grey-1">
|
||||
<q-card style="min-width: 900px" >
|
||||
<q-form
|
||||
ref="myForm"
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="onSubmit"
|
||||
>
|
||||
<DialogHeader tittle="บันทึกผล" :close="props.close" />
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-4">
|
||||
<q-select
|
||||
|
|
@ -343,6 +337,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
@update:model-value="selectType"
|
||||
:disable="status !== ''"
|
||||
lazy-rules
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 text-weight-bold text-grey">
|
||||
|
|
@ -421,6 +416,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
v-model="Advertise"
|
||||
lazy-rules
|
||||
label="หมายเลขประกาศนีย์บัตรกำกับเครื่องราชอิสริยาภรณ์"
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
|
|
@ -440,6 +436,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
:readonly="false"
|
||||
use-input
|
||||
:borderless="false"
|
||||
class="inputgreen"
|
||||
style="min-width: 150px"
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอกชื่อชั้นตราเครื่องราชอิสริยาภรณ์',
|
||||
|
|
@ -472,6 +469,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
borderless
|
||||
outlined
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
receivedate != null ? date2Thai(receivedate) : undefined
|
||||
|
|
@ -493,6 +491,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
<q-input
|
||||
:disable="disbleStatus || status == 'DONE'"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกทะเบียนฐานนันดร']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
dense
|
||||
borderless
|
||||
|
|
@ -508,6 +507,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
disbleStatus || status == 'DONE' || status == 'PENDING'
|
||||
"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
dense
|
||||
lazy-rules
|
||||
|
|
@ -523,6 +523,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
disbleStatus || status == 'DONE' || status == 'PENDING'
|
||||
"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
dense
|
||||
borderless
|
||||
|
|
@ -560,6 +561,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
borderless
|
||||
outlined
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
announceDate != null ? date2Thai(announceDate) : undefined
|
||||
|
|
@ -660,6 +662,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
borderless
|
||||
outlined
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
:model-value="
|
||||
invoiceDate != null ? date2Thai(invoiceDate) : undefined
|
||||
"
|
||||
|
|
@ -684,7 +687,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
:disable="disbleStatus"
|
||||
hide-bottom-space
|
||||
:options="paymentOp"
|
||||
class="col-xs-12 col-sm-6"
|
||||
class="inputgreen"
|
||||
dense
|
||||
borderless
|
||||
option-label="label"
|
||||
|
|
@ -701,27 +704,24 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
<q-input
|
||||
:disable="disbleStatus"
|
||||
label="ที่อยู่ที่จ่าย"
|
||||
class="bg-white"
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
outlined
|
||||
v-model="addressPayment"
|
||||
type="textarea"
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
|
||||
<q-separator />
|
||||
<div class="q-pa-md">
|
||||
<div class="row justify-end">
|
||||
<q-btn label="บันทึก" @click="clickSave" color="public"
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" type="submit" color="public"
|
||||
><q-tooltip>บันทึก</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
div
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from "vue";
|
||||
import { QForm, useQuasar } from "quasar";
|
||||
|
|
@ -74,53 +75,41 @@ function close() {
|
|||
* @param type receive,return
|
||||
* @param id personId
|
||||
*/
|
||||
async function SaveData(type: string, id: string) {
|
||||
await myForm.value.validate().then((result: boolean) => {
|
||||
if (result) {
|
||||
dialogConfirm($q, () => dataSave(type, id));
|
||||
async function onSubmit(type: string, id: string) {
|
||||
dialogConfirm($q, () => {
|
||||
const formData = new FormData();
|
||||
if (props.dateCheckReceive === null) {
|
||||
formData.append("Date", dateToISO((Datereceive.value as Date) ?? nullii));
|
||||
formData.append("File", files.value);
|
||||
formData.append("OrgId", OrganazationId.value);
|
||||
} else {
|
||||
formData.append("Date", dateToISO((Datereturn.value as Date) ?? nullii));
|
||||
formData.append("File", filesReturn.value);
|
||||
formData.append("OrgId", OrganazationId2.value);
|
||||
}
|
||||
showLoader();
|
||||
http
|
||||
.put(config.API.requestinsignia(type, id), formData)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
Datereceive.value = null;
|
||||
files.value = null;
|
||||
OrganazationId.value = "";
|
||||
Datereturn.value = null;
|
||||
filesReturn.value = null;
|
||||
OrganazationId2.value = "";
|
||||
props.fecthlistInsignia?.();
|
||||
props.close?.();
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* function บันทึกข้อมูล
|
||||
* @param type receive,return
|
||||
* @param id personId
|
||||
*/
|
||||
function dataSave(type: string, id: string) {
|
||||
const formData = new FormData();
|
||||
if (props.dateCheckReceive === null) {
|
||||
formData.append("Date", dateToISO((Datereceive.value as Date) ?? nullii));
|
||||
formData.append("File", files.value);
|
||||
formData.append("OrgId", OrganazationId.value);
|
||||
} else {
|
||||
formData.append("Date", dateToISO((Datereturn.value as Date) ?? nullii));
|
||||
formData.append("File", filesReturn.value);
|
||||
formData.append("OrgId", OrganazationId2.value);
|
||||
}
|
||||
showLoader();
|
||||
http
|
||||
.put(config.API.requestinsignia(type, id), formData)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
Datereceive.value = null;
|
||||
files.value = null;
|
||||
OrganazationId.value = "";
|
||||
Datereturn.value = null;
|
||||
filesReturn.value = null;
|
||||
OrganazationId2.value = "";
|
||||
props.fecthlistInsignia?.();
|
||||
props.close?.();
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/** function เรียกหน่วยงาน*/
|
||||
async function fetchOrgList() {
|
||||
showLoader();
|
||||
|
|
@ -175,23 +164,32 @@ watch(props, () => {
|
|||
<template>
|
||||
<q-dialog v-model="props.modal" persistent>
|
||||
<q-card style="min-width: 900px">
|
||||
<q-toolbar>
|
||||
<q-toolbar-title class="text-subtitle2 text-bold"
|
||||
>รับ-คืนเครื่องราชฯ</q-toolbar-title
|
||||
>
|
||||
<q-btn
|
||||
icon="close"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
@click="close"
|
||||
style="color: #ff8080; background-color: #ffdede"
|
||||
/>
|
||||
</q-toolbar>
|
||||
<q-separator />
|
||||
|
||||
<q-form ref="myForm">
|
||||
<div class="q-pa-md bg-grey-1">
|
||||
<q-form
|
||||
ref="myForm"
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="
|
||||
onSubmit(
|
||||
props.dateCheckReceive === null ? 'receive' : 'return',
|
||||
props.personId as string
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-toolbar>
|
||||
<q-toolbar-title class="text-subtitle2 text-bold"
|
||||
>รับ-คืนเครื่องราชฯ</q-toolbar-title
|
||||
>
|
||||
<q-btn
|
||||
icon="close"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
@click="close"
|
||||
style="color: #ff8080; background-color: #ffdede"
|
||||
/>
|
||||
</q-toolbar>
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-12 text-weight-bold text-grey-7">
|
||||
รับเครื่องราชฯ
|
||||
|
|
@ -220,18 +218,20 @@ watch(props, () => {
|
|||
outlined
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่ได้รับ']"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
:model-value="
|
||||
Datereceive != null ? date2Thai(Datereceive) : null
|
||||
"
|
||||
:label="`${'วันที่ได้รับ'}`"
|
||||
:disable="dateCheckReceive !== null"
|
||||
>
|
||||
<template v-if="Datereceive" v-slot:append>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="cancel"
|
||||
@click.stop.prevent="Datereceive = null"
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
color="primary"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
|
|
@ -285,6 +285,7 @@ watch(props, () => {
|
|||
:label="`หน่วยงานที่รับ`"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่รับ']"
|
||||
:disable="dateCheckReceive !== null"
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -319,6 +320,7 @@ watch(props, () => {
|
|||
dense
|
||||
borderless
|
||||
outlined
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่คืน']"
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
|
|
@ -389,30 +391,24 @@ watch(props, () => {
|
|||
:label="`หน่วยงานที่คืน`"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่คืน']"
|
||||
:disable="dateCheckReturn !== null"
|
||||
class="inputgreen"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
<div class="q-px-md q-py-sm">
|
||||
<div class="row justify-end">
|
||||
<q-separator v-if="dateCheckReturn === null" />
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
v-if="dateCheckReturn === null"
|
||||
label="บันทึก"
|
||||
color="public"
|
||||
@click="
|
||||
SaveData(
|
||||
props.dateCheckReceive === null ? 'receive' : 'return',
|
||||
props.personId as string
|
||||
)
|
||||
"
|
||||
type="submit"
|
||||
>
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
div
|
||||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
import { QForm, useQuasar } from "quasar";
|
||||
|
|
@ -41,7 +42,7 @@ function closeModal() {
|
|||
}
|
||||
|
||||
/** function ยืนยันการบันทึก*/
|
||||
const clickSave = () => {
|
||||
const onSubmit = () => {
|
||||
dialogConfirm($q, () => {
|
||||
if (props.actionType === "insignia") {
|
||||
props.save(
|
||||
|
|
@ -68,11 +69,15 @@ watch(props, () => {
|
|||
<template>
|
||||
<q-dialog v-model="props.modal" persistent>
|
||||
<q-card style="width: 800px">
|
||||
<DialogHeader tittle="แก้ไขการจัดสรรเครื่องราชฯ" :close="closeModal" />
|
||||
<q-separator />
|
||||
|
||||
<q-form ref="myForm">
|
||||
<div class="q-pa-md bg-grey-1">
|
||||
<q-form
|
||||
ref="myForm"
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="onSubmit"
|
||||
>
|
||||
<DialogHeader tittle="แก้ไขการจัดสรรเครื่องราชฯ" :close="closeModal" />
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div
|
||||
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
|
||||
>
|
||||
|
|
@ -99,17 +104,18 @@ watch(props, () => {
|
|||
lazy-rules
|
||||
type="number"
|
||||
label="จำนวน"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกจำนวน'}`]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div></div
|
||||
></q-card-section>
|
||||
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" type="submit" color="public">
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
<q-separator />
|
||||
<div class="row justify-end q-py-sm">
|
||||
<div class="q-px-md">
|
||||
<q-btn label="บันทึก" @click="clickSave" color="public" />
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
div
|
||||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
import { QForm, useQuasar } from "quasar";
|
||||
|
|
@ -53,7 +54,10 @@ function filterSelector(val: any, update: Function, name: any) {
|
|||
const needle = val.toLowerCase();
|
||||
if (name === "filterInsigniaOp") {
|
||||
grandCross.value = null;
|
||||
filterInsigniaOp.value = props.insigniaList.filter(
|
||||
const newList = props.insigniaList.filter(
|
||||
(e: any) => e.name !== "ทั้งหมด"
|
||||
);
|
||||
filterInsigniaOp.value = newList.filter(
|
||||
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
);
|
||||
}
|
||||
|
|
@ -61,16 +65,16 @@ function filterSelector(val: any, update: Function, name: any) {
|
|||
}
|
||||
|
||||
/** function ยืนยันการบันทึก*/
|
||||
const clickSave = () => {
|
||||
if (myForm.value !== null) {
|
||||
myForm.value.validate().then(async (success) => {
|
||||
if (success) {
|
||||
dialogConfirm($q, () => props.save(grandCross.value, amount.value));
|
||||
} else {
|
||||
dialogMessageNotify($q, "กรุณาข้อมูลให้ครบ");
|
||||
}
|
||||
});
|
||||
}
|
||||
const onSubmit = () => {
|
||||
// if (myForm.value !== null) {
|
||||
// myForm.value.validate().then(async (success) => {
|
||||
// if (success) {
|
||||
dialogConfirm($q, () => props.save(grandCross.value, amount.value));
|
||||
// } else {
|
||||
// dialogMessageNotify($q, "กรุณาข้อมูลให้ครบ");
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
};
|
||||
|
||||
watch(props, () => {
|
||||
|
|
@ -84,22 +88,28 @@ watch(props, () => {
|
|||
watch(
|
||||
() => props.insigniaList,
|
||||
(newVal) => {
|
||||
filterInsigniaOp.value = newVal;
|
||||
filterInsigniaOp.value = newVal.filter((e: any) => e.name !== "ทั้งหมด");
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog v-model="props.modal" persistent>
|
||||
<q-card style="width: 800px">
|
||||
<DialogHeader tittle="จัดสรรเครื่องราชฯ" :close="closeModal" />
|
||||
<q-separator />
|
||||
<q-card style="width: 700px; max-width: 80vw">
|
||||
<q-form
|
||||
ref="myForm"
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="onSubmit"
|
||||
>
|
||||
<DialogHeader tittle="จัดสรรเครื่องราชฯ" :close="closeModal" />
|
||||
<q-separator />
|
||||
|
||||
<q-form ref="myForm">
|
||||
<div class="q-pa-md bg-grey-1">
|
||||
<q-card-section>
|
||||
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
<div class="col-6">
|
||||
<q-select
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
:options="filterInsigniaOp"
|
||||
dense
|
||||
|
|
@ -112,7 +122,7 @@ watch(
|
|||
map-options
|
||||
outlined
|
||||
options-cover
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกจำนวน'}`]"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกเครื่องราชฯ'}`]"
|
||||
v-model="grandCross"
|
||||
:label="
|
||||
routeName == 'insigniaAllocate'
|
||||
|
|
@ -120,7 +130,7 @@ watch(
|
|||
: `เลือกหน่วยงาน`
|
||||
"
|
||||
@filter="(inputValue:any,doneFn:Function) =>
|
||||
filterSelector(inputValue, doneFn,'filterInsigniaOp') "
|
||||
filterSelector(inputValue, doneFn,'filterInsigniaOp') "
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
|
|
@ -137,20 +147,15 @@ watch(
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
<div class="row justify-end q-py-sm">
|
||||
<div class="q-px-md">
|
||||
<q-btn
|
||||
label="บันทึก"
|
||||
@click="clickSave"
|
||||
color="public"
|
||||
:disable="grandCross == '' || amount == null || amount == 0"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" type="submit" color="public"
|
||||
><q-tooltip>บันทึก</q-tooltip></q-btn
|
||||
>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -160,46 +160,44 @@ async function fetchOrgList() {
|
|||
// บันทึกข้อมูลการยืม-คืน
|
||||
|
||||
/** function บันทึกการเพิ่มข้อมูล*/
|
||||
async function clickSave() {
|
||||
await myForm.value!.validate().then((result: boolean) => {
|
||||
if (result) {
|
||||
dialogConfirm($q, async () => {
|
||||
if (props.action == "addData") {
|
||||
await http
|
||||
.post(config.API.insigniaManageBorrow(), {
|
||||
borrowDate: receivedate.value,
|
||||
// borrowOrganizationId: OrganazationId.value,
|
||||
insigniaNoteProfileId: insigniaNoteProfileId.value,
|
||||
})
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
clearData();
|
||||
props.closeAndFecth();
|
||||
});
|
||||
} else {
|
||||
await http
|
||||
.put(config.API.insigniaManageBorrowReturn(props.profileId), {
|
||||
returnDate: returndate.value,
|
||||
returnOrganizationId: OrganazationId.value,
|
||||
returnReason: reason.value,
|
||||
})
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
clearData();
|
||||
props.closeAndFecth();
|
||||
});
|
||||
}
|
||||
});
|
||||
async function onSubmit() {
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
if (props.action == "addData") {
|
||||
await http
|
||||
.post(config.API.insigniaManageBorrow(), {
|
||||
borrowDate: receivedate.value,
|
||||
insigniaNoteProfileId: insigniaNoteProfileId.value,
|
||||
})
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
clearData();
|
||||
props.closeAndFecth();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
} else {
|
||||
await http
|
||||
.put(config.API.insigniaManageBorrowReturn(props.profileId), {
|
||||
returnDate: returndate.value,
|
||||
returnOrganizationId: OrganazationId.value,
|
||||
returnReason: reason.value,
|
||||
})
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
clearData();
|
||||
props.closeAndFecth();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -297,11 +295,15 @@ watch(props, () => {
|
|||
<template>
|
||||
<q-dialog v-model="props.modal" persistent>
|
||||
<q-card style="min-width: 900px">
|
||||
<DialogHeader tittle="ยืม-คืนเครื่องราชฯ" :close="closeDialog" />
|
||||
<q-separator />
|
||||
|
||||
<q-form ref="myForm">
|
||||
<div class="q-pa-md bg-grey-1">
|
||||
<q-form
|
||||
ref="myForm "
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="onSubmit"
|
||||
>
|
||||
<DialogHeader tittle="ยืม-คืนเครื่องราชฯ" :close="closeDialog" />
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div
|
||||
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
|
||||
>
|
||||
|
|
@ -311,6 +313,7 @@ watch(props, () => {
|
|||
>
|
||||
<div class="col-6">
|
||||
<q-select
|
||||
class="inputgreen"
|
||||
v-model="roundNo"
|
||||
dense
|
||||
outlined
|
||||
|
|
@ -329,8 +332,8 @@ watch(props, () => {
|
|||
:rules="[(val) => !!val || 'กรุณาเลือกรอบการขอเครื่องราชฯ']"
|
||||
@update:model-value="fecthlistInsignia()"
|
||||
@filter="(inputValue:any,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'filterSelectRoundOption'
|
||||
) "
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'filterSelectRoundOption'
|
||||
) "
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 q-mt-md text-weight-bold text-grey-7">
|
||||
|
|
@ -346,11 +349,11 @@ watch(props, () => {
|
|||
dense
|
||||
lazy-rules
|
||||
:rules="[
|
||||
(val: string) => !!val || `${'กรุณากรอกเลขประจำตัวประชาชน'}`,
|
||||
(val: string) =>
|
||||
val.length >= 13 ||
|
||||
`${'กรุณากรอกเลขประจำตัวประชาชนให้ครบ'}`,
|
||||
]"
|
||||
(val: string) => !!val || `${'กรุณากรอกเลขประจำตัวประชาชน'}`,
|
||||
(val: string) =>
|
||||
val.length >= 13 ||
|
||||
`${'กรุณากรอกเลขประจำตัวประชาชนให้ครบ'}`,
|
||||
]"
|
||||
label="เลขประจำตัวประชาชน"
|
||||
maxlength="13"
|
||||
mask="#############"
|
||||
|
|
@ -409,6 +412,7 @@ watch(props, () => {
|
|||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
class="inputgreen"
|
||||
dense
|
||||
borderless
|
||||
outlined
|
||||
|
|
@ -430,28 +434,6 @@ watch(props, () => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<!-- <div class="col-xs-12 col-sm-6">
|
||||
<q-select
|
||||
hide-bottom-space
|
||||
:options="filterOrgList"
|
||||
dense
|
||||
borderless
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
use-input
|
||||
map-options
|
||||
outlined
|
||||
v-model="OrganazationId"
|
||||
lazy-rules
|
||||
:label="`เลือกหน่วยงาน`"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงาน']"
|
||||
@filter="(inputValue:any,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'filterOrgList'
|
||||
) "
|
||||
/>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div
|
||||
|
|
@ -505,26 +487,26 @@ watch(props, () => {
|
|||
</div>
|
||||
|
||||
<!-- <div class="col-xs-12 col-sm-6">
|
||||
<q-select
|
||||
hide-bottom-space
|
||||
:options="filterOrgList"
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
outlined
|
||||
use-input
|
||||
v-model="OrganazationId"
|
||||
:label="`เลือกหน่วยงานที่ส่งคืน`"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่คืน']"
|
||||
@filter="(inputValue:any,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'filterOrgList'
|
||||
) "
|
||||
/>
|
||||
</div> -->
|
||||
<q-select
|
||||
hide-bottom-space
|
||||
:options="filterOrgList"
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
outlined
|
||||
use-input
|
||||
v-model="OrganazationId"
|
||||
:label="`เลือกหน่วยงานที่ส่งคืน`"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่คืน']"
|
||||
@filter="(inputValue:any,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'filterOrgList'
|
||||
) "
|
||||
/>
|
||||
</div> -->
|
||||
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
|
|
@ -542,19 +524,17 @@ watch(props, () => {
|
|||
:label="`สาเหตุที่ส่งคืนเครื่องราชอิสริยาภรณ์`"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</div></div
|
||||
></q-card-section>
|
||||
|
||||
<q-separator />
|
||||
<div class="q-pa-md">
|
||||
<div class="row justify-end">
|
||||
<q-btn label="บันทึก" @click="clickSave" color="public">
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" type="submit" color="public">
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
|
|||
562
src/modules/08_registryEmployee/components/DialogAddEmployee.vue
Normal file
562
src/modules/08_registryEmployee/components/DialogAddEmployee.vue
Normal file
|
|
@ -0,0 +1,562 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, reactive } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** importType*/
|
||||
import type { DataOption } from "@/modules/08_registryEmployee/interface/index/Main";
|
||||
import type { FormDataEmployee } from "@/modules/08_registryEmployee/interface/request/Employee";
|
||||
import type { ResOptionPerson } from "@/modules/08_registryEmployee/interface/response/Employee";
|
||||
|
||||
/** importComponents*/
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
/** importStore*/
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useRegistryEmp } from "@/modules/08_registryEmployee/stores/registry-employee";
|
||||
|
||||
/** use*/
|
||||
const $q = useQuasar();
|
||||
const {
|
||||
dialogConfirm,
|
||||
success,
|
||||
messageError,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
dialogMessageNotify,
|
||||
date2Thai,
|
||||
} = useCounterMixin();
|
||||
const { calculateAge } = useRegistryEmp();
|
||||
|
||||
/** props*/
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
const props = defineProps({
|
||||
fetchData: { type: Function, require: true },
|
||||
});
|
||||
|
||||
const formData = reactive<FormDataEmployee>({
|
||||
citizenId: "",
|
||||
prefix: "",
|
||||
rank: "",
|
||||
firstName: "",
|
||||
lastName: "",
|
||||
birthDate: null,
|
||||
gender: "",
|
||||
relationship: "",
|
||||
nationality: "",
|
||||
ethnicity: "",
|
||||
religion: "",
|
||||
bloodGroup: "",
|
||||
phone: "",
|
||||
employeeClass: "TEMP",
|
||||
});
|
||||
|
||||
const prefixOpsMain = ref<DataOption[]>([]);
|
||||
const prefixOps = ref<DataOption[]>([]);
|
||||
const rankOpsMain = ref<DataOption[]>([]);
|
||||
const rankOps = ref<DataOption[]>([]);
|
||||
const genderOpsMain = ref<DataOption[]>([]);
|
||||
const genderOps = ref<DataOption[]>([]);
|
||||
const statusOpsMain = ref<DataOption[]>([]);
|
||||
const statusOps = ref<DataOption[]>([]);
|
||||
const religionOpsMain = ref<DataOption[]>([]);
|
||||
const religionOps = ref<DataOption[]>([]);
|
||||
const bloodOpsMain = ref<DataOption[]>([]);
|
||||
const bloodOps = ref<DataOption[]>([]);
|
||||
|
||||
function fetchDataPerson() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.profileNewMetaMain)
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
|
||||
let optionPerfix: DataOption[] = [];
|
||||
data.prefixs.map((r: ResOptionPerson) => {
|
||||
optionPerfix.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
prefixOpsMain.value = optionPerfix;
|
||||
|
||||
let optionrank: DataOption[] = [];
|
||||
data.rank.map((r: ResOptionPerson) => {
|
||||
optionrank.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
rankOpsMain.value = optionrank;
|
||||
|
||||
let optiongenders: DataOption[] = [];
|
||||
data.genders.map((r: ResOptionPerson) => {
|
||||
optiongenders.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
genderOpsMain.value = optiongenders;
|
||||
|
||||
let optionrelationships: DataOption[] = [];
|
||||
data.relationships.map((r: ResOptionPerson) => {
|
||||
optionrelationships.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
statusOpsMain.value = optionrelationships;
|
||||
|
||||
let optionreligions: DataOption[] = [];
|
||||
data.religions.map((r: ResOptionPerson) => {
|
||||
optionreligions.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
religionOpsMain.value = optionreligions;
|
||||
|
||||
let optionBlood: DataOption[] = [];
|
||||
data.bloodGroups.map((r: ResOptionPerson) => {
|
||||
optionBlood.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
bloodOpsMain.value = optionBlood;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function changeCardID(citizenId: string | number | null) {
|
||||
if (citizenId != null && typeof citizenId == "string") {
|
||||
if (citizenId.length == 13 && citizenId) {
|
||||
http
|
||||
.put(config.API.profileNewCitizenId(citizenId), {
|
||||
citizenId: citizenId,
|
||||
})
|
||||
.then(() => {})
|
||||
.catch((err) => {
|
||||
if (err.response.data.status === 500) {
|
||||
dialogMessageNotify($q, err.response.data.message);
|
||||
} else {
|
||||
messageError($q, err);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const filterSelector = (val: string, update: Function, refData: string) => {
|
||||
switch (refData) {
|
||||
case "prefix":
|
||||
update(() => {
|
||||
prefixOps.value = prefixOpsMain.value.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
||||
case "rank":
|
||||
update(() => {
|
||||
rankOps.value = rankOpsMain.value.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
||||
case "gender":
|
||||
update(() => {
|
||||
genderOps.value = genderOpsMain.value.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
||||
case "status":
|
||||
update(() => {
|
||||
statusOps.value = statusOpsMain.value.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
||||
case "religion":
|
||||
update(() => {
|
||||
religionOps.value = religionOpsMain.value.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
||||
case "blood":
|
||||
let f = val.toLocaleUpperCase();
|
||||
update(() => {
|
||||
bloodOps.value = bloodOpsMain.value.filter(
|
||||
(v: DataOption) => v.name.indexOf(f) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
function calculateMaxDate() {
|
||||
const today = new Date();
|
||||
today.setFullYear(today.getFullYear() - 18);
|
||||
return today;
|
||||
}
|
||||
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
showLoader();
|
||||
http
|
||||
.post(config.API.registryNew("-employee"), formData)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
props.fetchData?.();
|
||||
closeDialog();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function closeDialog() {
|
||||
modal.value = false;
|
||||
formData.citizenId = "";
|
||||
formData.prefix = "";
|
||||
formData.rank = "";
|
||||
formData.firstName = "";
|
||||
formData.lastName = "";
|
||||
formData.birthDate = null;
|
||||
formData.gender = "";
|
||||
formData.relationship = "";
|
||||
formData.nationality = "";
|
||||
formData.ethnicity = "";
|
||||
formData.religion = "";
|
||||
formData.bloodGroup = "";
|
||||
formData.phone = "";
|
||||
}
|
||||
|
||||
watch(
|
||||
() => modal.value,
|
||||
() => {
|
||||
if (modal.value) {
|
||||
fetchDataPerson();
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="min-width: 600px">
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<DialogHeader
|
||||
tittle="เพิ่มข้อมูลลูกจ้างชั่วคราว"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
|
||||
<q-separator />
|
||||
<q-card-section class="q-pa-md q-col-gutter-md">
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
maxlength="13"
|
||||
mask="#############"
|
||||
v-model="formData.citizenId"
|
||||
class="inputgreen"
|
||||
label="เลขประจำตัวประชาชน"
|
||||
:rules="[
|
||||
(val: string) => !!val || `${'กรุณากรอก เลขประจำตัวประชาชน'}`,
|
||||
(val: string) =>
|
||||
val.length >= 13 ||
|
||||
`${'กรุณากรอกเลขประจำตัวประชาชนให้ครบ'}`,
|
||||
]"
|
||||
@update:model-value="changeCardID"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
use-input
|
||||
lazy-rules
|
||||
emit-value
|
||||
map-options
|
||||
hide-bottom-space
|
||||
input-debounce="0"
|
||||
option-label="name"
|
||||
option-value="name"
|
||||
v-model="formData.prefix"
|
||||
class="inputgreen"
|
||||
:options="prefixOps"
|
||||
label="คำนำหน้าชื่อ"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
|
||||
@filter="(inputValue: string,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'prefix'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
clearable
|
||||
use-input
|
||||
lazy-rules
|
||||
emit-value
|
||||
map-options
|
||||
hide-bottom-space
|
||||
input-debounce="0"
|
||||
option-label="name"
|
||||
option-value="name"
|
||||
v-model="formData.rank"
|
||||
class="inputgreen"
|
||||
:options="rankOps"
|
||||
label="ยศ"
|
||||
@filter="(inputValue: string,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'rank'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.firstName"
|
||||
class="inputgreen"
|
||||
label="ชื่อ"
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกชื่อ'}`]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
v-model="formData.lastName"
|
||||
class="inputgreen"
|
||||
label="นามสกุล"
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกนามสกุล'}`]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
autoApply
|
||||
:max-date="calculateMaxDate()"
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
menu-class-name="modalfix"
|
||||
v-model="formData.birthDate"
|
||||
:locale="'th'"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
for="inputDatereceive"
|
||||
ref="dateReceivedRef"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
:model-value="
|
||||
formData.birthDate != null
|
||||
? date2Thai(formData.birthDate)
|
||||
: null
|
||||
"
|
||||
label="วัน/เดือน/ปี เกิด"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`,
|
||||
]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
color="primary"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
readonly
|
||||
:model-value="
|
||||
formData.birthDate !== null
|
||||
? calculateAge(formData.birthDate)
|
||||
: null
|
||||
"
|
||||
label="อายุ"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
use-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
map-options
|
||||
hide-bottom-space
|
||||
input-debounce="0"
|
||||
option-label="name"
|
||||
option-value="name"
|
||||
v-model="formData.gender"
|
||||
class="inputgreen"
|
||||
:options="genderOps"
|
||||
label="เพศ"
|
||||
@filter="(inputValue: string,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'gender'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
use-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
map-options
|
||||
hide-bottom-space
|
||||
option-value="name"
|
||||
option-label="name"
|
||||
input-debounce="0"
|
||||
class="inputgreen"
|
||||
v-model="formData.relationship"
|
||||
:options="statusOps"
|
||||
label="สถานภาพ"
|
||||
@filter="(inputValue: string,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'status'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
v-model="formData.nationality"
|
||||
label="สัญชาติ"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
v-model="formData.ethnicity"
|
||||
label="เชื้อชาติ"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
use-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
map-options
|
||||
hide-bottom-space
|
||||
option-value="name"
|
||||
option-label="name"
|
||||
input-debounce="0"
|
||||
v-model="formData.religion"
|
||||
class="inputgreen"
|
||||
:options="religionOps"
|
||||
label="ศาสนา"
|
||||
@filter="(inputValue: string,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'religion'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
use-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
map-options
|
||||
hide-bottom-space
|
||||
option-value="name"
|
||||
option-label="name"
|
||||
input-debounce="0"
|
||||
v-model="formData.bloodGroup"
|
||||
class="inputgreen"
|
||||
:options="bloodOps"
|
||||
label="หมู่เลือด"
|
||||
@filter="(inputValue: string,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'blood'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
mask="##########"
|
||||
class="inputgreen"
|
||||
v-model="formData.phone"
|
||||
label="เบอร์โทร"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn id="onSubmit" type="submit" label="บันทึก" color="public">
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form></q-card
|
||||
>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
929
src/modules/08_registryEmployee/components/DialogSelectPos.vue
Normal file
929
src/modules/08_registryEmployee/components/DialogSelectPos.vue
Normal file
|
|
@ -0,0 +1,929 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive, watch } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** importType*/
|
||||
import type { QTableProps } from "quasar";
|
||||
import type {
|
||||
TreeMain,
|
||||
PositionNo,
|
||||
Position,
|
||||
} from "@/modules/08_registryEmployee/interface/response/Employee";
|
||||
|
||||
/** importComponents*/
|
||||
import Header from "@/components/DialogHeader.vue";
|
||||
|
||||
/** importStore*/
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { asCleanDays } from "@fullcalendar/core/internal";
|
||||
|
||||
/** use*/
|
||||
const $q = useQuasar();
|
||||
const {
|
||||
success,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
dialogMessageNotify,
|
||||
dialogConfirm,
|
||||
} = useCounterMixin();
|
||||
|
||||
/**props*/
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
const props = defineProps({
|
||||
dataRow: {
|
||||
type: Object,
|
||||
require: true,
|
||||
},
|
||||
fetchData: {
|
||||
type: Function,
|
||||
require: true,
|
||||
},
|
||||
});
|
||||
|
||||
/** Tree*/
|
||||
const nodeId = ref<string>("");
|
||||
const nodeLevel = ref<number>(0);
|
||||
const filterTree = ref<string>("");
|
||||
const nodes = ref<Array<TreeMain>>([]);
|
||||
const lazy = ref(nodes);
|
||||
const expanded = ref<string[]>([]);
|
||||
|
||||
/** Table*/
|
||||
const filters = ref<string>("");
|
||||
const rowsPosition = ref<Position[]>([]);
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "isPosition",
|
||||
align: "left",
|
||||
label: "",
|
||||
sortable: true,
|
||||
field: "isPosition",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "no",
|
||||
align: "left",
|
||||
label: "ลำดับ",
|
||||
sortable: true,
|
||||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "posMasterNo",
|
||||
align: "left",
|
||||
label: "เลขที่ตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "posMasterNo",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionName",
|
||||
align: "left",
|
||||
label: "ตำแหน่งในสายงาน",
|
||||
field: "positionName",
|
||||
sortable: true,
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "posTypeName",
|
||||
align: "left",
|
||||
label: "ประเภทตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "posTypeName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "posLevelName",
|
||||
align: "left",
|
||||
label: "ระดับตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "posLevelName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
const columnsPostition = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
align: "left",
|
||||
label: "ลำดับ",
|
||||
sortable: false,
|
||||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionName",
|
||||
align: "left",
|
||||
label: "ตำแหน่งในสายงาน",
|
||||
sortable: true,
|
||||
field: "positionName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionField",
|
||||
align: "left",
|
||||
label: "สายงาน",
|
||||
sortable: true,
|
||||
field: "positionField",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "posTypeName",
|
||||
align: "left",
|
||||
label: "ประเภทตำเเหน่ง",
|
||||
sortable: true,
|
||||
field: "posTypeName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "posLevelName",
|
||||
align: "left",
|
||||
label: "ระดับตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "posLevelName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "posExecutiveName",
|
||||
align: "left",
|
||||
label: "ตำแหน่งทางการบริหาร",
|
||||
sortable: true,
|
||||
field: "posExecutiveName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionExecutiveField",
|
||||
align: "left",
|
||||
label: "ด้านทางการบริหาร",
|
||||
sortable: true,
|
||||
field: "positionExecutiveField",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionArea",
|
||||
align: "left",
|
||||
label: "ด้าน/สาขา",
|
||||
sortable: true,
|
||||
field: "positionArea",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
const visibleColumns = ref<string[]>([
|
||||
"isPosition",
|
||||
"no",
|
||||
"posMasterNo",
|
||||
"positionName",
|
||||
"posTypeName",
|
||||
"posLevelName",
|
||||
]);
|
||||
|
||||
/** Position*/
|
||||
const positionNo = ref<PositionNo[]>([]);
|
||||
const positionId = ref<string>("");
|
||||
const seletcId = ref<string>("");
|
||||
const selectedPos = ref<any[]>([]);
|
||||
const datePos = ref<Date>(new Date());
|
||||
const posMasterMain = ref<any>([]);
|
||||
const orgRevisionId = ref<string>("");
|
||||
|
||||
/** function เรียกข้อมูลโครงสร้าง แบบปัจุบันและ แบบร่าง*/
|
||||
async function fetchOrganizationActive() {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.activeOrganization)
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
if (data) {
|
||||
orgRevisionId.value = data.activeId;
|
||||
fetchDataTree(data.activeId);
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* function fetch ข้อมูลของ Tree
|
||||
* @param id id โครงสร้าง
|
||||
*/
|
||||
async function fetchDataTree(id: string) {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.orgByid(id.toString()))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
if (data) {
|
||||
nodes.value = data;
|
||||
filterItemsTaps(data);
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
setTimeout(() => {
|
||||
hideLoader();
|
||||
}, 1000);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* funtion เลือกข้อมูล Tree
|
||||
* @param data ข่อมูล Tree
|
||||
*/
|
||||
function updateSelected(data: TreeMain) {
|
||||
if (props?.dataRow?.nodeId === data.orgTreeId) {
|
||||
positionId.value = props?.dataRow?.posmasterId;
|
||||
seletcId.value = props?.dataRow?.positionId;
|
||||
datePos.value = props?.dataRow?.reportingDateFullDate;
|
||||
} else {
|
||||
positionId.value = "";
|
||||
seletcId.value = "";
|
||||
selectedPos.value = [];
|
||||
datePos.value = new Date();
|
||||
}
|
||||
|
||||
nodeId.value = data.orgTreeId ? data.orgTreeId : "";
|
||||
nodeLevel.value = data.orgLevel;
|
||||
fetchDataTable(data.orgTreeId, data.orgLevel);
|
||||
}
|
||||
|
||||
const isAll = ref<boolean>(false);
|
||||
const isBlank = ref<boolean>(false);
|
||||
|
||||
/**
|
||||
* function fetch ข้อมูลรายการตำแหน่ง
|
||||
* @param id idTree
|
||||
* @param level levelTree
|
||||
*/
|
||||
async function fetchDataTable(id: string, level: number = 0) {
|
||||
showLoader();
|
||||
const body = {
|
||||
node: level,
|
||||
nodeId: id,
|
||||
position: "",
|
||||
typeCommand: "",
|
||||
posLevel: props.dataRow?.posLevelCandidateId
|
||||
? props.dataRow?.posLevelCandidateId
|
||||
: "",
|
||||
posType: props.dataRow?.posTypeCandidateId
|
||||
? props.dataRow?.posTypeCandidateId
|
||||
: "",
|
||||
isAll: isAll.value,
|
||||
isBlank: isBlank.value,
|
||||
};
|
||||
await http
|
||||
.post(config.API.orgPosPlacemenTemp, body)
|
||||
.then((res) => {
|
||||
const dataMain: PositionNo[] = [];
|
||||
|
||||
posMasterMain.value = res.data.result.data;
|
||||
res.data.result.data.forEach((e: any) => {
|
||||
const p = e.positions;
|
||||
if (p.length !== 0) {
|
||||
const a = p.find((el: Position) => el.positionIsSelected === true);
|
||||
const { id, ...rest } = a ? a : p[0];
|
||||
const data: any = { ...e, ...rest };
|
||||
dataMain.push(data);
|
||||
}
|
||||
});
|
||||
positionNo.value = dataMain;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
setTimeout(() => {
|
||||
hideLoader();
|
||||
}, 1000);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* function fetch ข้อมูล expanded tree
|
||||
* @param level levelTree
|
||||
* @param id treeId
|
||||
*/
|
||||
async function fetchPosFind(level: number, id: string) {
|
||||
showLoader();
|
||||
const body = {
|
||||
node: level,
|
||||
nodeId: id,
|
||||
};
|
||||
await http
|
||||
.post(config.API.orgPosFind, body)
|
||||
.then(async (res) => {
|
||||
const data = res.data.result;
|
||||
|
||||
expanded.value = data;
|
||||
nodeId.value = id;
|
||||
positionId.value = props?.dataRow?.posmasterId;
|
||||
seletcId.value = props?.dataRow?.positionId;
|
||||
datePos.value = props?.dataRow?.reportingDateFullDate;
|
||||
|
||||
await fetchDataTable(nodeId.value, level);
|
||||
positionId.value && (await onClickSelectPos(positionId.value));
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/** function บันทึกข้อมูลตำแหน่ง*/
|
||||
async function onClickSubmit() {
|
||||
const dataPosMaster = await posMasterMain.value?.find(
|
||||
(e: any) => e.id === positionId.value
|
||||
);
|
||||
|
||||
if (selectedPos.value.length === 0) {
|
||||
dialogMessageNotify($q, "กรุณาเลือกตำแหน่ง");
|
||||
} else {
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
const body = {
|
||||
node: dataPosMaster.node,
|
||||
nodeId: dataPosMaster.nodeId,
|
||||
orgRevisionId: orgRevisionId.value,
|
||||
positionId: selectedPos.value[0].id,
|
||||
posMasterNo: dataPosMaster.posMasterNo.toString(), //เลขที่ตำแหน่ง(เลขอย่่างเดียว)
|
||||
position: selectedPos.value[0].positionName, //ชื่อตำแหน่ง
|
||||
positionField: "", //ชื่อตำแหน่ง
|
||||
posTypeId: selectedPos.value[0].posTypeId, //ชื่อตำแหน่ง
|
||||
posTypeName: selectedPos.value[0].posTypeName, //ชื่อตำแหน่ง
|
||||
posLevelId: selectedPos.value[0].posLevelId, //ชื่อตำแหน่ง
|
||||
posLevelName: selectedPos.value[0].posLevelName.toString(), //ชื่อตำแหน่ง
|
||||
posmasterId: dataPosMaster.id,
|
||||
};
|
||||
|
||||
await http
|
||||
.put(config.API.positionEmployee(props?.dataRow?.id), body)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
props.fetchData?.();
|
||||
closePopup();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** function closePopup*/
|
||||
function closePopup() {
|
||||
modal.value = !modal.value;
|
||||
clearData();
|
||||
}
|
||||
|
||||
/** function clearData*/
|
||||
function clearData() {
|
||||
nodeId.value = "";
|
||||
expanded.value = [];
|
||||
positionId.value = "";
|
||||
seletcId.value = "";
|
||||
}
|
||||
|
||||
const itemTaps = ref<string[]>();
|
||||
function filterItemsTaps(data: any[]) {
|
||||
let orgTreeIds: string[] = [];
|
||||
for (const child of data) {
|
||||
orgTreeIds.push(child.orgTreeId);
|
||||
if (child.children) {
|
||||
orgTreeIds = orgTreeIds.concat(filterItemsTaps(child.children));
|
||||
}
|
||||
}
|
||||
itemTaps.value = orgTreeIds;
|
||||
return orgTreeIds;
|
||||
}
|
||||
|
||||
async function onClickSelectPos(id: string) {
|
||||
positionId.value = id;
|
||||
selectedPos.value = [];
|
||||
const position: any = positionNo.value.find((e: any) => e.id === id);
|
||||
|
||||
// หาตำแหน่ง
|
||||
if (position) {
|
||||
rowsPosition.value = position.positions;
|
||||
if (seletcId.value) {
|
||||
selectedPos.value = rowsPosition.value.filter(
|
||||
(e) => e.id === seletcId.value
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** callback function เมื่อมีการเปิด popup*/
|
||||
watch(
|
||||
() => modal.value,
|
||||
async () => {
|
||||
if (modal.value) {
|
||||
await fetchOrganizationActive();
|
||||
if (props?.dataRow?.node !== null && props?.dataRow?.nodeId !== null) {
|
||||
await fetchPosFind(props?.dataRow?.node, props?.dataRow?.nodeId);
|
||||
} else {
|
||||
expanded.value = [];
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
watch(
|
||||
() => isAll.value,
|
||||
(value, oldVal) => {
|
||||
if (value !== oldVal) {
|
||||
fetchDataTable(nodeId.value, nodeLevel.value);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
watch(
|
||||
() => isBlank.value,
|
||||
(value, oldVal) => {
|
||||
if (value !== oldVal) {
|
||||
fetchDataTable(nodeId.value, nodeLevel.value);
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog v-model="modal" full-width persistent>
|
||||
<q-card>
|
||||
<Header :tittle="'เลือกหน่วยงานที่รับบรรจุ'" :close="closePopup" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pt-none q-pa-sm bg-grey-2">
|
||||
<div class="row">
|
||||
<q-card
|
||||
bordered
|
||||
class="col-12 col-sm-3 scroll q-pa-sm"
|
||||
style="height: 75vh"
|
||||
>
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-toolbar-title class="text-subtitle2 text-bold"
|
||||
>เลือกหน่วยงาน/ส่วนราชการ</q-toolbar-title
|
||||
>
|
||||
</q-toolbar>
|
||||
|
||||
<q-input
|
||||
ref="filterRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="filterTree"
|
||||
label="ค้นหา"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filterTree !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="filterTree = ''"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
class="q-pa-sm q-gutter-sm"
|
||||
dense
|
||||
default-expand-all
|
||||
:nodes="lazy"
|
||||
node-key="orgTreeId"
|
||||
label-key="orgTreeName"
|
||||
:filter="filterTree"
|
||||
no-results-label="ไม่พบข้อมูลที่ค้นหา"
|
||||
no-nodes-label="ไม่มีข้อมูล"
|
||||
v-model:expanded="expanded"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<q-item
|
||||
clickable
|
||||
:active="nodeId == prop.node.orgTreeId"
|
||||
@click.stop="updateSelected(prop.node)"
|
||||
active-class="my-list-link text-primary text-weight-medium"
|
||||
class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.orgTreeName }}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{ prop.node.orgCode == null ? null : prop.node.orgCode }}
|
||||
{{
|
||||
prop.node.orgTreeShortName == null
|
||||
? null
|
||||
: prop.node.orgTreeShortName
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card>
|
||||
|
||||
<q-card
|
||||
bordered
|
||||
class="col-12 col-sm-9 q-pa-sm scroll"
|
||||
style="height: 75vh"
|
||||
>
|
||||
<q-tab-panels
|
||||
v-model="nodeId"
|
||||
animated
|
||||
transition-prev="jump-up"
|
||||
transition-next="jump-up"
|
||||
>
|
||||
<q-tab-panel
|
||||
v-for="(item, index) in itemTaps"
|
||||
:key="index"
|
||||
:name="item"
|
||||
>
|
||||
<div class="column q-col-gutter-sm">
|
||||
<!-- เลือกเลขที่ตำแหน่ง -->
|
||||
<div class="col-7">
|
||||
<q-card
|
||||
bordered
|
||||
style="height: 100%; border: 1px solid #d6dee1"
|
||||
>
|
||||
<div
|
||||
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
|
||||
>
|
||||
เลือกเลขที่ตำแหน่ง
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="col-12 q-pa-md">
|
||||
<q-toolbar style="padding: 0px">
|
||||
<div class="row q-gutter-md">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
v-model="isBlank"
|
||||
label="แสดงเฉพาะตำแหน่งว่าง"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip>แสดงเฉพาะตำแหน่งว่าง </q-tooltip>
|
||||
</q-checkbox>
|
||||
</div>
|
||||
<q-space />
|
||||
|
||||
<div class="row q-gutter-md">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
v-model="isAll"
|
||||
label="แสดงตำแหน่งทั้งหมด"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip
|
||||
>แสดงตำแหน่งทั้งหมดภายใต้หน่วยงาน/ส่วนราชการที่เลือก</q-tooltip
|
||||
>
|
||||
</q-checkbox>
|
||||
<div>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
v-model="filters"
|
||||
label="ค้นหา"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="search" color="grey-5" />
|
||||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
<div>
|
||||
<q-select
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns"
|
||||
option-value="name"
|
||||
options-cover
|
||||
style="min-width: 180px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-toolbar>
|
||||
<d-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="positionNo"
|
||||
:filter="filters"
|
||||
row-key="id"
|
||||
flat
|
||||
bordered
|
||||
:paging="true"
|
||||
dense
|
||||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
class="tableTb"
|
||||
:visible-columns="visibleColumns"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
>
|
||||
<span class="text-weight-medium">{{
|
||||
col.label
|
||||
}}</span>
|
||||
</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
@click="onClickSelectPos(props.row.id)"
|
||||
:class="
|
||||
props.row.id === positionId ? 'bg-blue-2' : ''
|
||||
"
|
||||
>
|
||||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name === 'posMasterNo'">
|
||||
{{
|
||||
props.row.isSit
|
||||
? col.value + " " + "(ทับที่)"
|
||||
: col.value
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name === 'isPosition'">
|
||||
<div v-if="col.value">
|
||||
<q-icon
|
||||
name="done"
|
||||
color="primary"
|
||||
size="24px"
|
||||
>
|
||||
<q-tooltip>ตรงตามตำแหน่ง </q-tooltip>
|
||||
</q-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
|
||||
<!-- <d-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="positionNo"
|
||||
:filter="filters"
|
||||
row-key="id"
|
||||
flat
|
||||
bordered
|
||||
:paging="true"
|
||||
dense
|
||||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
:visible-columns="visibleColumns"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
>
|
||||
<span class="text-weight-medium">{{
|
||||
col.label
|
||||
}}</span>
|
||||
</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
@click="onClickSelectPos(props.row.id)"
|
||||
:class="
|
||||
props.row.id === positionId ? 'bg-blue-2' : ''
|
||||
"
|
||||
>
|
||||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name === 'posMasterNo'">
|
||||
{{
|
||||
props.row.isSit
|
||||
? col.value + " " + "(ทับที่)"
|
||||
: col.value
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name === 'isPosition'">
|
||||
<div v-if="col.value">
|
||||
<q-icon
|
||||
name="done"
|
||||
color="primary"
|
||||
size="24px"
|
||||
>
|
||||
<q-tooltip>ตรงตามตำแหน่ง </q-tooltip>
|
||||
</q-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table> -->
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<!-- เลือกตำแหน่ง -->
|
||||
<div class="col-5">
|
||||
<q-card
|
||||
bordered
|
||||
style="height: 100%; border: 1px solid #d6dee1"
|
||||
>
|
||||
<div
|
||||
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
|
||||
>
|
||||
เลือกตำแหน่ง
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<q-tab-panels
|
||||
v-model="positionId"
|
||||
animated
|
||||
swipeable
|
||||
vertical
|
||||
transition-prev="jump-up"
|
||||
transition-next="jump-up"
|
||||
>
|
||||
<q-tab-panel
|
||||
v-for="(item, index) in positionNo"
|
||||
:key="index"
|
||||
:name="item.id"
|
||||
>
|
||||
<div class="col-12">
|
||||
<!-- <q-toolbar style="padding: 0px">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="date"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
:min-date="date"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
ref="dateRef"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
:model-value="date != null ? date2Thai(date) : null"
|
||||
label="วันที่รายงานตัว"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</q-toolbar> -->
|
||||
<d-table
|
||||
ref="table"
|
||||
:columns="columnsPostition"
|
||||
:rows="rowsPosition"
|
||||
row-key="id"
|
||||
flat
|
||||
bordered
|
||||
:paging="true"
|
||||
dense
|
||||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
class="tableTb"
|
||||
selection="single"
|
||||
v-model:selected="selectedPos"
|
||||
>
|
||||
<template v-slot:header-selection="scope">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="scope.checkBox"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th auto-width />
|
||||
<q-th
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
>
|
||||
<span class="text-weight-medium">{{
|
||||
col.label
|
||||
}}</span>
|
||||
</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="props.selected"
|
||||
/>
|
||||
</q-td>
|
||||
<q-td
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
>
|
||||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name === 'posMasterNo'">
|
||||
{{
|
||||
props.row.isSit
|
||||
? col.value + " " + "(ทับที่)"
|
||||
: col.value
|
||||
}}
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
</div>
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-card>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="บันทึก" color="secondary" @click="onClickSubmit"
|
||||
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
|
||||
>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.my-list-link {
|
||||
color: rgb(118, 168, 222);
|
||||
border-radius: 5px;
|
||||
background: #a3d3fb48 !important;
|
||||
font-weight: 600;
|
||||
border: 1px solid rgba(175, 185, 196, 0.217);
|
||||
}
|
||||
</style>
|
||||
327
src/modules/08_registryEmployee/components/DialogSendOrder.vue
Normal file
327
src/modules/08_registryEmployee/components/DialogSendOrder.vue
Normal file
|
|
@ -0,0 +1,327 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watch, reactive } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** importType*/
|
||||
import type { QTableProps } from "quasar";
|
||||
import type { DataEmployee } from "@/modules/08_registryEmployee/interface/response/Employee";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
/** inportStore*/
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useRegistryEmp } from "@/modules/08_registryEmployee/stores/registry-employee";
|
||||
|
||||
const $q = useQuasar();
|
||||
const {
|
||||
success,
|
||||
messageError,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
date2Thai,
|
||||
dialogConfirm,
|
||||
dialogMessageNotify,
|
||||
} = useCounterMixin();
|
||||
const { statusText } = useRegistryEmp();
|
||||
|
||||
/**props*/
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
const props = defineProps({
|
||||
fetchData: {
|
||||
type: Function,
|
||||
require: true,
|
||||
},
|
||||
});
|
||||
|
||||
const filter = ref<string>("");
|
||||
const rows = ref<DataEmployee[]>([]);
|
||||
const selected = ref<DataEmployee[]>([]);
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
align: "left",
|
||||
label: "ลำดับ",
|
||||
sortable: false,
|
||||
field: (row) => rows.value.indexOf(row) + 1,
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "citizenId",
|
||||
align: "left",
|
||||
label: "เลขประจำตัวประชาชน",
|
||||
sortable: true,
|
||||
field: "citizenId",
|
||||
headerStyle: "font-size: 14px; min-width: 200px",
|
||||
style: "font-size: 14px; ",
|
||||
},
|
||||
{
|
||||
name: "fullname",
|
||||
align: "left",
|
||||
label: "ชื่อ-นามสกุล",
|
||||
sortable: true,
|
||||
field: (row) => `${row.prefix}${row.firstName} ${row.lastName}`,
|
||||
headerStyle: "font-size: 14px; min-width: 200px",
|
||||
style: "font-size: 14px; ",
|
||||
},
|
||||
{
|
||||
name: "draftOrganizationOrganization",
|
||||
align: "left",
|
||||
label: "หน่วยงานที่รับการบรรจุ",
|
||||
sortable: true,
|
||||
field: "draftOrganizationOrganization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
|
||||
{
|
||||
name: "govAge",
|
||||
align: "left",
|
||||
label: "อายุราชการ(ปี)",
|
||||
sortable: true,
|
||||
field: "govAge",
|
||||
format(val) {
|
||||
return val;
|
||||
},
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "dateEmployment",
|
||||
align: "left",
|
||||
label: "วันที่จ้าง",
|
||||
sortable: true,
|
||||
field: "dateEmployment",
|
||||
format: (val) => date2Thai(val),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
|
||||
{
|
||||
name: "salaryDate",
|
||||
align: "left",
|
||||
label: "วันที่แต่งตั้ง",
|
||||
sortable: true,
|
||||
field: "salaryDate",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "age",
|
||||
align: "left",
|
||||
label: "อายุ",
|
||||
sortable: true,
|
||||
field: "age",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
align: "left",
|
||||
label: "วันที่สร้าง",
|
||||
sortable: true,
|
||||
field: "createdAt",
|
||||
format(val) {
|
||||
return date2Thai(val);
|
||||
},
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "dateRetireLaw",
|
||||
align: "left",
|
||||
label: "วันที่พ้นราชการ",
|
||||
sortable: true,
|
||||
field: "dateRetireLaw",
|
||||
format(val) {
|
||||
return date2Thai(val);
|
||||
},
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "statustext",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: (row) => statusText(row.draftOrgEmployeeStatus),
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
const visibleColumns = ref<String[]>([
|
||||
"no",
|
||||
"citizenId",
|
||||
"fullname",
|
||||
"draftOrganizationOrganization",
|
||||
"govAge",
|
||||
"dateEmployment",
|
||||
"age",
|
||||
"createdAt",
|
||||
"dateRetireLaw",
|
||||
"statustext",
|
||||
]);
|
||||
|
||||
function onClickSendOrder() {
|
||||
if (selected.value.length == 0) {
|
||||
dialogMessageNotify($q, "กรุณาเลือกคนออกคำสั่ง");
|
||||
} else {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
() => {
|
||||
showLoader();
|
||||
let pId: string[] = [];
|
||||
selected.value.forEach((e: any) => {
|
||||
pId.push(e.id);
|
||||
});
|
||||
let data = {
|
||||
id: pId,
|
||||
};
|
||||
http
|
||||
.post(config.API.organizationEmployeeSendOrder, data)
|
||||
.then(() => {
|
||||
success($q, "บันทึกสำเร็จ");
|
||||
closeDialog();
|
||||
props?.fetchData?.();
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(async () => {
|
||||
hideLoader();
|
||||
});
|
||||
},
|
||||
"ยื่นยันการส่งรายชื่อไปออกคำสั่ง",
|
||||
"ต้องการยืนยันการส่งรายชื่อไปออกคำสั่งนี้หรือไม่ ?"
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function fetchList() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.registryNew("-employee") + `/temp`)
|
||||
.then((res) => {
|
||||
rows.value = res.data.result.data;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function closeDialog() {
|
||||
modal.value = false;
|
||||
selected.value = [];
|
||||
}
|
||||
|
||||
watch(
|
||||
() => modal.value,
|
||||
() => {
|
||||
modal.value && fetchList();
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog v-model="modal">
|
||||
<q-card style="width: 900px; max-width: 80vw">
|
||||
<DialogHeader tittle="ส่งรายชื่อไปออกคำสั่ง" :close="closeDialog" />
|
||||
<q-separator />
|
||||
<q-card-section class="q-pt-none">
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-12">
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-input
|
||||
borderless
|
||||
outlined
|
||||
dense
|
||||
debounce="300"
|
||||
v-model="filter"
|
||||
ref="filterRef"
|
||||
placeholder="ค้นหา"
|
||||
style="width: 850px; max-width: auto"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="search" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns"
|
||||
option-value="name"
|
||||
options-cover
|
||||
style="min-width: 150px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
</q-toolbar>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<d-table
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
:visible-columns="visibleColumns"
|
||||
:filter="filter"
|
||||
row-key="id"
|
||||
selection="multiple"
|
||||
v-model:selected="selected"
|
||||
>
|
||||
<template v-slot:header-selection="scope">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="scope.selected"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="props.selected"
|
||||
/>
|
||||
</q-td>
|
||||
<q-td
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
>
|
||||
<div>
|
||||
{{
|
||||
col.value !== null && col.value !== "" ? col.value : "-"
|
||||
}}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn
|
||||
label="ส่งไปออกคำสั่ง"
|
||||
@click="onClickSendOrder"
|
||||
color="public"
|
||||
/>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -1 +1,12 @@
|
|||
export type {};
|
||||
interface DataOption {
|
||||
id: string;
|
||||
name: string;
|
||||
}
|
||||
interface NewPagination {
|
||||
descending: boolean;
|
||||
page: number;
|
||||
rowsPerPage: number;
|
||||
sortBy: string;
|
||||
}
|
||||
|
||||
export type { DataOption, NewPagination };
|
||||
|
|
|
|||
|
|
@ -0,0 +1,18 @@
|
|||
interface FormDataEmployee {
|
||||
citizenId: string;
|
||||
prefix: string;
|
||||
rank: string;
|
||||
firstName: string;
|
||||
lastName: string;
|
||||
birthDate: any;
|
||||
gender: string;
|
||||
relationship: string;
|
||||
nationality: string;
|
||||
ethnicity: string;
|
||||
religion: string;
|
||||
bloodGroup: string;
|
||||
phone: string;
|
||||
employeeClass: string;
|
||||
}
|
||||
|
||||
export type { FormDataEmployee };
|
||||
119
src/modules/08_registryEmployee/interface/response/Employee.ts
Normal file
119
src/modules/08_registryEmployee/interface/response/Employee.ts
Normal file
|
|
@ -0,0 +1,119 @@
|
|||
interface DataEmployee {
|
||||
age: string;
|
||||
child1: null | string;
|
||||
child1Id: null | string;
|
||||
child1ShortName: null | string;
|
||||
child2: null | string;
|
||||
child2Id: null | string;
|
||||
child2ShortName: null | string;
|
||||
child3: null | string;
|
||||
child3Id: null | string;
|
||||
child3ShortName: null | string;
|
||||
child4: null | string;
|
||||
child4Id: null | string;
|
||||
child4ShortName: null | string;
|
||||
citizenId: string;
|
||||
createdAt: string;
|
||||
dateAppoint: null | string;
|
||||
dateRetireLaw: string;
|
||||
dateStart: null | string;
|
||||
draftOrgEmployeeStatus: string;
|
||||
draftOrganizationOrganization: string;
|
||||
draftPositionEmployee: string;
|
||||
employeeClass: string;
|
||||
firstName: string;
|
||||
govAge: number;
|
||||
id: string;
|
||||
lastName: string;
|
||||
node: null | string;
|
||||
nodeId: null | string;
|
||||
nodeName: null | string;
|
||||
nodeShortName: null | string;
|
||||
posLevel: number;
|
||||
posLevelId: string;
|
||||
posNo: string;
|
||||
posType: string;
|
||||
posTypeId: string;
|
||||
posTypeShortName: string;
|
||||
position: string;
|
||||
prefix: string;
|
||||
rank: string;
|
||||
root: string;
|
||||
rootId: string;
|
||||
rootShortName: string;
|
||||
}
|
||||
|
||||
interface ResOptionPerson {
|
||||
createdAt: string;
|
||||
createdFullName: "สาวิตรี ศรีสมัย";
|
||||
createdUserId: string;
|
||||
id: string;
|
||||
lastUpdateFullName: string;
|
||||
lastUpdateUserId: string;
|
||||
lastUpdatedAt: string;
|
||||
name: string;
|
||||
}
|
||||
|
||||
interface PositionNo {
|
||||
id: string;
|
||||
isPosition: boolean;
|
||||
isSit: boolean;
|
||||
node: number;
|
||||
nodeId: string;
|
||||
orgChild1Id: null | string;
|
||||
orgChild2Id: null | string;
|
||||
orgChild3Id: null | string;
|
||||
orgChild4Id: null | string;
|
||||
orgRootId: string;
|
||||
orgShortname: string;
|
||||
posLevelId: string;
|
||||
posLevelName: number;
|
||||
posMasterNo: number;
|
||||
posMasterNoPrefix: null | string;
|
||||
posMasterNoSuffix: null | string;
|
||||
posTypeId: string;
|
||||
posTypeName: string;
|
||||
positionIsSelected: boolean;
|
||||
positionName: string;
|
||||
position: Position[];
|
||||
}
|
||||
|
||||
interface TreeMain {
|
||||
children: TreeMain[]; // ปรับเป็นชนิดข้อมูลที่ถูกต้องตามโครงสร้างของ children ถ้าเป็นไปได้
|
||||
orgCode: string;
|
||||
orgLevel: number;
|
||||
orgName: string;
|
||||
orgRevisionId: string;
|
||||
orgRootName: string;
|
||||
orgTreeCode: string;
|
||||
orgTreeFax: string;
|
||||
orgTreeId: string;
|
||||
orgTreeName: string;
|
||||
orgTreeOrder: number;
|
||||
orgTreePhoneEx: string;
|
||||
orgTreePhoneIn: string;
|
||||
orgTreeRank: string;
|
||||
orgTreeShortName: string;
|
||||
totalPosition: number;
|
||||
totalPositionCurrentUse: number;
|
||||
totalPositionCurrentVacant: number;
|
||||
totalPositionNextUse: number;
|
||||
totalPositionNextVacant: number;
|
||||
totalRootPosition: number;
|
||||
totalRootPositionCurrentUse: number;
|
||||
totalRootPositionCurrentVacant: number;
|
||||
totalRootPositionNextUse: number;
|
||||
totalRootPositionNextVacant: number;
|
||||
}
|
||||
|
||||
interface Position {
|
||||
id: string;
|
||||
posLevelId: string;
|
||||
posLevelName: number;
|
||||
posTypeId: string;
|
||||
posTypeName: string;
|
||||
positionIsSelected: boolean;
|
||||
positionName: string;
|
||||
}
|
||||
|
||||
export type { DataEmployee, ResOptionPerson, PositionNo, TreeMain, Position };
|
||||
|
|
@ -4,14 +4,17 @@ import { defineAsyncComponent } from "vue";
|
|||
const Main = defineAsyncComponent(
|
||||
() => import("@/modules/08_registryEmployee/views/Main.vue")
|
||||
);
|
||||
|
||||
const CreateEmployee = defineAsyncComponent(
|
||||
() => import("@/modules/08_registryEmployee/views/Add.vue")
|
||||
const DetailView = defineAsyncComponent(
|
||||
() => import("@/modules/08_registryEmployee/views/DetailView.vue")
|
||||
);
|
||||
|
||||
const EditDetail = defineAsyncComponent(
|
||||
() => import("@/modules/08_registryEmployee/views/EditDetail.vue")
|
||||
);
|
||||
// const CreateEmployee = defineAsyncComponent(
|
||||
// () => import("@/modules/08_registryEmployee/views/Add.vue")
|
||||
// );
|
||||
|
||||
// const EditDetail = defineAsyncComponent(
|
||||
// () => import("@/modules/08_registryEmployee/views/EditDetail.vue")
|
||||
// );
|
||||
|
||||
export default [
|
||||
{
|
||||
|
|
@ -25,23 +28,33 @@ export default [
|
|||
},
|
||||
},
|
||||
{
|
||||
path: "/registry-employee/add",
|
||||
name: "registryEmployeeAdd",
|
||||
component: CreateEmployee,
|
||||
meta: {
|
||||
Auth: true,
|
||||
Key: [11],
|
||||
Role: "registryEmployee",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/registry-employee/edit/:id",
|
||||
name: "registryEmployeeEdit",
|
||||
component: EditDetail,
|
||||
path: "/registry-employee/:id",
|
||||
name: "registry-employeeId",
|
||||
component: DetailView,
|
||||
meta: {
|
||||
Auth: true,
|
||||
Key: [11],
|
||||
Role: "registryEmployee",
|
||||
},
|
||||
},
|
||||
// {
|
||||
// path: "/registry-employee/add",
|
||||
// name: "registryEmployeeAdd",
|
||||
// component: CreateEmployee,
|
||||
// meta: {
|
||||
// Auth: true,
|
||||
// Key: [11],
|
||||
// Role: "registryEmployee",
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: "/registry-employee/edit/:id",
|
||||
// name: "registryEmployeeEdit",
|
||||
// component: EditDetail,
|
||||
// meta: {
|
||||
// Auth: true,
|
||||
// Key: [11],
|
||||
// Role: "registryEmployee",
|
||||
// },
|
||||
// },
|
||||
];
|
||||
|
|
|
|||
57
src/modules/08_registryEmployee/stores/registry-employee.ts
Normal file
57
src/modules/08_registryEmployee/stores/registry-employee.ts
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
import { defineStore } from "pinia";
|
||||
|
||||
export const useRegistryEmp = defineStore("registry-employee", () => {
|
||||
/**
|
||||
* function คำนวณหาอายุ
|
||||
* @param birthDate วันเกิด
|
||||
* @returns อายุ
|
||||
*/
|
||||
function calculateAge(birthDate: Date | null) {
|
||||
if (!birthDate) return null;
|
||||
const birthDateTimeStamp = new Date(birthDate).getTime();
|
||||
const now = new Date();
|
||||
const diff = now.getTime() - birthDateTimeStamp;
|
||||
|
||||
const ageDate = new Date(diff);
|
||||
const years = ageDate.getUTCFullYear() - 1970;
|
||||
const months = ageDate.getUTCMonth();
|
||||
const days = ageDate.getUTCDate() - 1;
|
||||
const retire = new Date(birthDate);
|
||||
retire.setFullYear(retire.getFullYear() + 60);
|
||||
// retireDate.value = retire;
|
||||
|
||||
if (years > 60) {
|
||||
return "อายุเกิน 60 ปี";
|
||||
}
|
||||
|
||||
return `${years} ปี ${months} เดือน ${days} วัน`;
|
||||
}
|
||||
|
||||
/**
|
||||
* function convertstatus
|
||||
* @param val ค่าสภานะ
|
||||
* @returns textStatus
|
||||
*/
|
||||
const statusText = (val: string) => {
|
||||
switch (val) {
|
||||
case "WAITTING":
|
||||
return "รอดำเนินการ";
|
||||
case "PENDING":
|
||||
return "เลือกตำแหน่งแล้ว";
|
||||
case "APPROVE":
|
||||
return "อนุมัติ";
|
||||
case "REJECT":
|
||||
return "ไม่อนุมัติ";
|
||||
case "REPORT":
|
||||
return "ส่งรายชื่อไปออกคำสั่ง";
|
||||
case "DONE":
|
||||
return "ออกคำสั่งเสร็จแล้ว";
|
||||
default:
|
||||
return "-";
|
||||
}
|
||||
};
|
||||
return {
|
||||
calculateAge,
|
||||
statusText,
|
||||
};
|
||||
});
|
||||
9
src/modules/08_registryEmployee/views/DetailView.vue
Normal file
9
src/modules/08_registryEmployee/views/DetailView.vue
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<script setup lang="ts">
|
||||
import View from "@/modules/04_registryNew/views/detailView.vue";
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<View />
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
File diff suppressed because it is too large
Load diff
1045
src/modules/08_registryEmployee/views/MainOld.vue
Normal file
1045
src/modules/08_registryEmployee/views/MainOld.vue
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -713,8 +713,10 @@ watch(
|
|||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn type="submit" :label="`บันทึก`" color="public" />
|
||||
<q-card-actions align="right">
|
||||
<q-btn type="submit" :label="`บันทึก`" color="public">
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</form>
|
||||
</q-card>
|
||||
|
|
|
|||
|
|
@ -119,7 +119,7 @@ watch(
|
|||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section>
|
||||
<q-card-section style="max-height: 70vh" class="scroll">
|
||||
<q-table
|
||||
v-if="rows.length > 0"
|
||||
v-draggable-table="{
|
||||
|
|
@ -150,7 +150,9 @@ watch(
|
|||
:label="`บันทึก`"
|
||||
color="public"
|
||||
@click="save"
|
||||
/>
|
||||
>
|
||||
<q-tooltip>บันทึก</q-tooltip></q-btn
|
||||
>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
|
|
|||
|
|
@ -393,8 +393,10 @@ function clearForm() {
|
|||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="สืบทอดตำแหน่ง" color="public" @click="onClickConfirm" />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="สืบทอดตำแหน่ง" color="public" @click="onClickConfirm">
|
||||
<q-tooltip>สืบทอดตำแหน่ง</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue