hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Merge branch 'develop' of github.com:Frappet/bma-ehr-frontend into develop

Browse source
This commit is contained in:
Kittapath 2023-09-29 17:39:48 +07:00
commit 9b910afc6e
39 changed files with 3454 additions and 1558 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/interface/request/main/main.ts
View file

@ -250,6 +250,12 @@ const menuList = readonly<any[]>([
path: "appoint-promote",
role: "placement",
},
{
key: 6.8,
label: "รายการแต่งตั้งลูกจ้างประจำ",
path: "appoint-employee",
role: "placement",
},
// {
// key: 6.9,
// label: "รายการย้าย",

448
src/modules/04_registry/components/Profile.vue
View file

@ -6,17 +6,10 @@
v-model:statusEdit="statusEdit"
:profileType="profileType"
/> -->
<Information
v-model:statusEdit="statusEdit"
:fetchDataProfile="fetchData"
/>
<Information v-model:statusEdit="statusEdit" :fetchDataProfile="fetchData" />
</div>
<div id="government" name="16" class="row col-12 q-mt-md">
<Government
v-model:statusEdit="statusEdit"
:profileType="profileType"
:employeeClass="employeeClass"
/>
<Government v-model:statusEdit="statusEdit" :profileType="profileType" :employeeClass="employeeClass" />
</div>
<div id="address" name="17" class="row col-12 q-mt-md">
<Address v-model:statusEdit="statusEdit" />
@ -40,20 +33,11 @@
<CoinedVue v-model:statusEdit="statusEdit" :profileType="profileType" />
</div>
<div id="assessment" name="6" class="row col-12 q-mt-md">
<AssessmentVue
v-model:statusEdit="statusEdit"
:profileType="profileType"
/>
<AssessmentVue v-model:statusEdit="statusEdit" :profileType="profileType" />
</div>
<div id="position" name="7" class="row col-12 q-mt-md">
<SalaryVue
v-model:statusEdit="statusEdit"
v-if="profileType === 'officer'"
/>
<SalaryEmployeeTempVue
v-model:statusEdit="statusEdit"
v-else-if="employeeClass === 'temp'"
/>
<SalaryVue v-model:statusEdit="statusEdit" v-if="profileType === 'officer'" />
<SalaryEmployeeTempVue v-model:statusEdit="statusEdit" v-else-if="employeeClass === 'temp'" />
<SalaryEmployeeVue v-model:statusEdit="statusEdit" v-else />
</div>
<div id="rule" name="8" class="row col-12 q-mt-md">
@ -78,70 +62,29 @@
<DocumentVue v-model:statusEdit="statusEdit" />
</div>
</div>
<q-page-sticky
position="top"
expand
class="bg-grey-2 text-white"
style="z-index: 99; padding: 0% 1% 0% 1%"
>
<div
class="row col-12 q-gutter-sm q-pb-sm text-dark no-wrap items-center"
>
<q-btn
flat
round
class="bg-teal-1 full-height"
color="primary"
icon="mdi-chevron-left"
dense
@click="router.go(-1)"
>
<q-page-sticky position="top" expand class="bg-grey-2 text-white" style="z-index: 99; padding: 0% 1% 0% 1%">
<div class="row col-12 q-gutter-sm q-pb-sm text-dark no-wrap items-center">
<q-btn flat round class="bg-teal-1 full-height" color="primary" icon="mdi-chevron-left" dense
@click="router.go(-1)">
</q-btn>
<q-avatar
v-if="imageUrl == null"
size="65px"
rounded
class="containerimage"
>
<img
src="@/assets/avatar_user.jpg"
class="bg-grey-3"
style="object-fit: cover"
/>
<div
class="overlay absolute-bottom text-subtitle2 text-center cursor-pointer"
@click="clickImage()"
>
<q-avatar v-if="imageUrl == null" size="65px" rounded class="containerimage">
<img src="@/assets/avatar_user.jpg" class="bg-grey-3" style="object-fit: cover" />
<div class="overlay absolute-bottom text-subtitle2 text-center cursor-pointer" @click="clickImage()">
<q-icon name="mdi-camera" size="18px" color="blue">
<q-tooltip>อัปเดตรูปภาพ</q-tooltip>
</q-icon>
<input
type="file"
style="display: none"
ref="inputImage"
accept="image/*"
@change="uploadImage"
/>
<input type="file" style="display: none" ref="inputImage" accept="image/*" @change="uploadImage" />
</div>
</q-avatar>
<q-avatar v-else size="65px" rounded class="containerimage">
<img :src="imageUrl" class="bg-grey-3" style="object-fit: cover" />
<div
class="overlay absolute-bottom text-subtitle2 text-center cursor-pointer"
@click="clickImage()"
>
<div class="overlay absolute-bottom text-subtitle2 text-center cursor-pointer" @click="clickImage()">
<q-icon name="mdi-camera" size="18px" color="blue">
<q-tooltip>อัปเดตรูปภาพ</q-tooltip>
</q-icon>
<input
type="file"
style="display: none"
ref="inputImage"
accept="image/*"
@change="uploadImage"
/>
<input type="file" style="display: none" ref="inputImage" accept="image/*" @change="uploadImage" />
</div>
</q-avatar>
<div class="row items-center text-dark q-ml-md">
@ -154,26 +97,32 @@
</div>
<q-space />
<q-btn round flat color="blue" icon="mdi-file-document">
<q-btn round flat color="blue" icon="mdi-file-document"
v-if="profileType == 'officer' || (profileType == 'employee' && employeeClass == 'perm')">
<q-menu transition-show="jump-down" transition-hide="jump-up">
<q-list dense style="min-width: 160px">
<q-item clickable v-close-popup @click="helpPost">
<q-item clickable v-close-popup @click="helpPost" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>ช่วยราชการ</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="repatriationPost">
<q-item clickable v-close-popup @click="repatriationPost" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>ส่งตัวกลับ</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="appointPost">
<q-item clickable v-close-popup @click="appointPost" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>แต่งตั้ง-เลื่อน-ย้าย</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="appointPost" v-if="profileType == 'employee'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>แต่งตั้ง</q-item-section>
</q-item>
<q-separator />
<!-- <q-item clickable v-close-popup @click="relocationPost">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
@ -181,31 +130,31 @@
<q-item-section>ย้าย</q-item-section>
</q-item>
<q-separator /> -->
<q-item clickable v-close-popup @click="clickPassaway">
<q-item clickable v-close-popup @click="clickPassaway" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>ถึงแก่กรรม</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="outPost">
<q-item clickable v-close-popup @click="outPost" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>ให้ออกจากราชการ</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="dischargePost">
<q-item clickable v-close-popup @click="dischargePost" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>ปลดออกจากราชการ</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="expulsionPost">
<q-item clickable v-close-popup @click="expulsionPost" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>ไล่ออกจากราชการ</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="otherPost">
<q-item clickable v-close-popup @click="otherPost" v-if="profileType == 'officer'">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
</q-item-section>
<q-item-section>อื่นๆ</q-item-section>
@ -216,15 +165,8 @@
<!-- <q-tooltip>ส่งรายชื่อ</q-tooltip> -->
</q-btn>
<q-btn
round
flat
:color="reasonStatus ? 'primary' : 'pink-5'"
@click="clickRetire()"
:icon="
reasonStatus ? 'mdi-home-import-outline' : 'mdi-home-export-outline'
"
>
<q-btn round flat :color="reasonStatus ? 'primary' : 'pink-5'" @click="clickRetire()" :icon="reasonStatus ? 'mdi-home-import-outline' : 'mdi-home-export-outline'
">
<q-tooltip>{{
reasonStatus ? "การกลับเข้ารับราชการ" : "การออกจากราชการ"
}}</q-tooltip>
@ -238,9 +180,7 @@
<q-item-section class="text-blue">ก.พ.7/ก.ก.1</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="clickKp7Short()">
<q-item-section class="text-primary"
>ประวัติแบบย่อ</q-item-section
>
<q-item-section class="text-primary">ประวัติแบบย่อ</q-item-section>
</q-item>
</q-list>
</q-menu>
@ -252,20 +192,8 @@
<q-card style="width: 90vw; max-width: 80vw">
<q-card-section class="row items-center q-pb-xs col-12">
<q-space />
<q-btn
@click="downloadKP7()"
unelevated
class="btn_purple q-mr-sm"
label="ดาวน์โหลด ก.พ.7/ก.ก.1"
></q-btn>
<q-btn
icon="close"
unelevated
round
dense
@click="closeKp7"
style="color: #ff8080; background-color: #ffdede"
/>
<q-btn @click="downloadKP7()" unelevated class="btn_purple q-mr-sm" label="ดาวน์โหลด ก.พ.7/ก.ก.1"></q-btn>
<q-btn icon="close" unelevated round dense @click="closeKp7" style="color: #ff8080; background-color: #ffdede" />
</q-card-section>
<q-card-section class="q-p-sm">
<!-- <viewpdf
@ -280,20 +208,9 @@
<q-card style="width: 90vw; max-width: 80vw">
<q-card-section class="row items-center q-pb-xs col-12">
<q-space />
<q-btn
@click="downloadKP7Short()"
unelevated
class="btn_purple q-mr-sm"
label="ดาวน์โหลด ประวัติแบบย่อ"
></q-btn>
<q-btn
icon="close"
unelevated
round
dense
@click="closeKp7Short"
style="color: #ff8080; background-color: #ffdede"
/>
<q-btn @click="downloadKP7Short()" unelevated class="btn_purple q-mr-sm" label="ดาวน์โหลด ประวัติแบบย่อ"></q-btn>
<q-btn icon="close" unelevated round dense @click="closeKp7Short"
style="color: #ff8080; background-color: #ffdede" />
</q-card-section>
<q-card-section class="q-p-sm">
<!-- <viewpdf
@ -310,50 +227,28 @@
<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-btn icon="close" unelevated round dense @click="closeImage" style="color: #ff8080; background-color: #ffdede">
<q-tooltip>ปิดหน้านี้</q-tooltip>
</q-btn>
</q-card-section>
<q-separator />
<q-card-section class="col-12 row">
<div
class="row wrap items-start col-12 q-col-gutter-sm"
style="height: 320px; overflow: auto"
>
<div class="row wrap items-start col-12 q-col-gutter-sm" style="height: 320px; overflow: auto">
<div class="col-3" @click="addNewImage">
<div
style="
<div style="
height: 160px;
max-width: 15vw;
display: flex !important;
justify-content: center;
align-items: center;
"
class="column rounded-borders cursor-pointer bg-active-image text-white"
>
" class="column rounded-borders cursor-pointer bg-active-image text-white">
<q-icon name="add" size="60px" color="white" />
<strong>อัปโหลดรูปภาพ</strong>
</div>
</div>
<div
v-for="n in images"
:key="n"
class="col-3"
@click="imageActive(n)"
>
<div v-for="n in images" :key="n" class="col-3" @click="imageActive(n)">
<div :class="getClass(n)">
<q-img
v-if="n.avatar != null"
:src="n.avatar"
:class="imageClass(n)"
>
<q-img v-if="n.avatar != null" :src="n.avatar" :class="imageClass(n)">
<!-- <div
class="absolute-top bg-transparent cursor-pointer text-right"
style="padding: 5px"
@ -367,21 +262,11 @@
style="color: #ff8080"
/>
</div> -->
<div
class="absolute-bottom col-12 cursor-pointer flex justify-between items-center"
style="padding: 5px"
>
<div class="absolute-bottom col-12 cursor-pointer flex justify-between items-center" style="padding: 5px">
{{ date2Thai(n.createdDate) }}
<q-btn
v-if="!n.isActive"
icon="delete"
unelevated
dense
@click="deletePhoto(n.id)"
class="bg-white"
style="color: #ff8080"
>
<q-btn v-if="!n.isActive" icon="delete" unelevated dense @click="deletePhoto(n.id)" class="bg-white"
style="color: #ff8080">
<q-tooltip>ลบรูปภาพ</q-tooltip>
</q-btn>
</div>
@ -401,14 +286,7 @@
>
<q-tooltip>ลบรูปภาพ</q-tooltip>
</q-btn> -->
<q-btn
icon="check"
dense
flat
round
@click="selectAvatarHistory"
color="positive"
>
<q-btn icon="check" dense flat round @click="selectAvatarHistory" color="positive">
<q-tooltip>เลือกรูปภาพ</q-tooltip>
</q-btn>
</q-card-actions>
@ -422,39 +300,18 @@
<q-card-section class="q-py-sm row">
<DialogHeader tittle="ถึงแก่กรรม" :close="closePassaway" />
<div class="col-12 row q-pa-sm q-col-gutter-sm">
<q-file
class="col-12 col-sm-6 col-md-5"
outlined
dense
v-model="filePassaway"
label="แนบใบมรณบัตร"
hide-bottom-space
lazy-rules
accept=".pdf"
>
<q-file class="col-12 col-sm-6 col-md-5" outlined dense v-model="filePassaway" label="แนบใบมรณบัตร"
hide-bottom-space lazy-rules accept=".pdf">
<q-separator />
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<q-input
class="col-12 col-sm-6 col-md-7"
dense
outlined
v-model="deathCertificateNo"
label="เลขที่ใบมรณบัตร"
/>
<q-input class="col-12 col-sm-6 col-md-7" dense outlined v-model="deathCertificateNo"
label="เลขที่ใบมรณบัตร" />
<datepicker
class="col-12 col-sm-6 col-md-5"
menu-class-name="modalfix"
v-model="dateDeath"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<datepicker class="col-12 col-sm-6 col-md-5" menu-class-name="modalfix" v-model="dateDeath" :locale="'th'"
autoApply borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -462,63 +319,32 @@
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
class="full-width datepicker"
:model-value="
dateDeath != null ? date2Thai(dateDeath) : null
"
:label="`${'วันที่เสียชีวิต'}`"
:rules="[
(val) => !!val || `${'กรุณาเลือกวันที่เสียชีวิต'}`,
]"
>
<q-input outlined dense class="full-width datepicker" :model-value="dateDeath != null ? date2Thai(dateDeath) : null
" :label="`${'วันที่เสียชีวิต'}`" :rules="[
(val) => !!val || `${'กรุณาเลือกวันที่เสียชีวิต'}`,
]">
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
class="col-12 col-sm-6 col-md-7"
dense
outlined
v-model="placeDeathCertificate"
label="สถานที่ออกใบมรณบัตร"
/>
<q-input class="col-12 col-sm-6 col-md-7" dense outlined v-model="placeDeathCertificate"
label="สถานที่ออกใบมรณบัตร" />
<q-separator />
<q-input
class="col-12"
dense
outlined
v-model="reasonDeath"
label="เหตุผลการเสียชีวิต"
type="textarea"
/>
<q-input class="col-12" dense outlined v-model="reasonDeath" label="เหตุผลการเสียชีวิต" type="textarea" />
</div>
<q-space />
</q-card-section>
<q-separator />
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-btn
unelevated
label="บันทึก"
color="public"
@click="clickSaveDeceased"
:disable="
filePassaway === null ||
deathCertificateNo === '' ||
placeDeathCertificate === '' ||
reasonDeath === ''
"
>
<q-btn unelevated label="บันทึก" color="public" @click="clickSaveDeceased" :disable="filePassaway === null ||
deathCertificateNo === '' ||
placeDeathCertificate === '' ||
reasonDeath === ''
">
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>
@ -536,71 +362,34 @@
<q-dialog v-model="dialogLeave" persistent>
<q-card style="width: 600px">
<q-toolbar>
<q-toolbar-title class="text-subtitle2 text-bold"
>ประเภทการพ้นราชการ
<q-toolbar-title class="text-subtitle2 text-bold">ประเภทการพ้นราชการ
</q-toolbar-title>
<q-btn
icon="close"
unelevated
round
dense
@click="closeLeave"
style="color: #ff8080; background-color: #ffdede"
/>
<q-btn icon="close" unelevated round dense @click="closeLeave"
style="color: #ff8080; background-color: #ffdede" />
</q-toolbar>
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-xs-6 col-sm-6 col-md-6">
<q-select
class="full-width inputgreen cursor-pointer"
outlined
dense
lazy-rules
v-model="reason"
:rules="[(val) => !!val || `${'กรุณาเลือกประเภทการพ้นราชการ'}`]"
hide-bottom-space
:label="`${'ประเภทการพ้นราชการ'}`"
emit-value
map-options
option-label="name"
:options="reasonOptions"
option-value="id"
/>
<q-select class="full-width inputgreen cursor-pointer" outlined dense lazy-rules v-model="reason"
:rules="[(val) => !!val || `${'กรุณาเลือกประเภทการพ้นราชการ'}`]" hide-bottom-space
:label="`${'ประเภทการพ้นราชการ'}`" emit-value map-options option-label="name" :options="reasonOptions"
option-value="id" />
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<datepicker
menu-class-name="modalfix"
v-model="leaveDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
week-start="0"
>
<datepicker menu-class-name="modalfix" v-model="leaveDate" :locale="'th'" autoApply :enableTimePicker="false"
week-start="0">
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
class="full-width inputgreen cursor-pointer"
outlined
dense
lazy-rules
:model-value="date2Thai(leaveDate)"
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่พ้นราชการ'}`]"
hide-bottom-space
:label="`${'วันที่พ้นราชการ'}`"
>
<q-input class="full-width inputgreen cursor-pointer" outlined dense lazy-rules
:model-value="date2Thai(leaveDate)" :rules="[(val) => !!val || `${'กรุณาเลือกวันที่พ้นราชการ'}`]"
hide-bottom-space :label="`${'วันที่พ้นราชการ'}`">
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
@ -608,64 +397,30 @@
</datepicker>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
class="full-width inputgreen cursor-pointer"
outlined
dense
lazy-rules
autogrow
v-model="leaveDetail"
<q-input class="full-width inputgreen cursor-pointer" outlined dense lazy-rules autogrow v-model="leaveDetail"
:rules="[
(val) =>
!!val || `${'กรุณากรอกสาเหตุ/เหตุผลของการพ้นจากราชการ'}`,
]"
hide-bottom-space
:label="`${'สาเหตุ/เหตุผลของการพ้นจากราชการ'}`"
/>
]" hide-bottom-space :label="`${'สาเหตุ/เหตุผลของการพ้นจากราชการ'}`" />
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
class="full-width inputgreen cursor-pointer"
outlined
dense
lazy-rules
autogrow
v-model="leaveNumberOrder"
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่ง/เอกสารอ้างอิง'}`]"
hide-bottom-space
:label="`${'คำสั่ง/เอกสารอ้างอิง'}`"
/>
<q-input class="full-width inputgreen cursor-pointer" outlined dense lazy-rules autogrow
v-model="leaveNumberOrder" :rules="[(val) => !!val || `${'กรุณากรอกคำสั่ง/เอกสารอ้างอิง'}`]"
hide-bottom-space :label="`${'คำสั่ง/เอกสารอ้างอิง'}`" />
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<datepicker
menu-class-name="modalfix"
v-model="leaveDateOrder"
:locale="'th'"
autoApply
:enableTimePicker="false"
week-start="0"
>
<datepicker menu-class-name="modalfix" v-model="leaveDateOrder" :locale="'th'" autoApply
:enableTimePicker="false" week-start="0">
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
class="full-width inputgreen cursor-pointer"
outlined
dense
lazy-rules
:model-value="date2Thai(leaveDateOrder)"
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่ออกคำสั่ง'}`]"
hide-bottom-space
:label="`${'วันที่ออกคำสั่ง'}`"
>
<q-input class="full-width inputgreen cursor-pointer" outlined dense lazy-rules
:model-value="date2Thai(leaveDateOrder)" :rules="[(val) => !!val || `${'กรุณาเลือกวันที่ออกคำสั่ง'}`]"
hide-bottom-space :label="`${'วันที่ออกคำสั่ง'}`">
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
@ -676,13 +431,7 @@
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
flat
round
color="public"
@click="Retire"
icon="mdi-content-save-outline"
>
<q-btn flat round color="public" @click="Retire" icon="mdi-content-save-outline">
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</q-card-actions>
@ -823,7 +572,6 @@ const fetchData = async () => {
.get(config.API.profileAvatarId(profileId.value))
.then((res) => {
const data = res.data.result;
fullname.value = data.fullname;
imageUrl.value = data.avatar;
position.value = data.position;
@ -897,7 +645,7 @@ const uploadImage = async (e: any) => {
showLoader();
await http
.post(config.API.profileAvatarId(profileId.value), formData)
.then((res) => {})
.then((res) => { })
.catch((e) => {
messageError($q, e);
})
@ -1162,9 +910,9 @@ const otherPost = async () => {
});
};
const downloadKP7 = () => {};
const downloadKP7 = () => { };
const downloadKP7Short = () => {};
const downloadKP7Short = () => { };
const clickKp7 = async () => {
window.open(config.API.profileReportId(profileId.value));
@ -1409,8 +1157,8 @@ const clickSaveDeceased = async () => {
hideLoader();
});
})
.onCancel(() => {})
.onDismiss(() => {});
.onCancel(() => { })
.onDismiss(() => { });
};
</script>
<style>

323
src/modules/05_placement/components/AppointEmployee/Detail.vue Normal file
View file

@ -0,0 +1,323 @@
divdivdiv
<script setup lang="ts">
import { onMounted, ref } from "vue";
import { useQuasar } from "quasar";
import { useRoute, useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import CurrencyInput from "@/components/CurruncyInput.vue";
import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
import type {
appointmentData,
ResponseData,
} from "@/modules/05_placement/interface/response/AppointMent";
import type { QForm } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
const $q = useQuasar();
const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const appointment = ref<appointmentData>({
citizenId: "",
prefixId: "",
firstname: "",
lastname: "",
});
const myForm = ref<QForm | null>(null);
const edit = ref<boolean>(false);
const profileId = ref<string>("");
const organizationPositionOld = ref<string>("");
const positionTypeOld = ref<string>("");
const positionLevelOld = ref<string>("");
const posNo = ref<string>("");
const salary = ref<number>(0);
const educationOld = ref<string>("");
const reason = ref<string>("");
const date = ref<Date | null>(null);
const status = ref<string>("");
const avatar = ref<string>("");
const paramsId = route.params.id;
const {
date2Thai,
messageError,
showLoader,
hideLoader,
success,
dialogConfirm,
} = mixin;
const title = ref<ResponseTitle>({
fullname: "",
organizationPositionOld: "",
positionLevelOld: "",
positionTypeOld: "",
});
//เรียกข้อมูลตาม id
const fecthappointmentByid = async () => {
showLoader();
await http
.get(config.API.appointmentByid(paramsId.toString()))
.then((res: ResponseData) => {
const data = res.data.result;
appointment.value = data;
profileId.value = data.profileId;
title.value.fullname = `${data.prefix}${data.firstname ?? "-"} ${data.lastname ?? "-"
}`;
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
title.value.positionLevelOld = data.positionLevelOld ?? "-";
title.value.positionTypeOld = data.positionTypeOld ?? "-";
(status.value = data.status),
(educationOld.value = data.educationOld ?? "-");
organizationPositionOld.value = data.organizationPositionOld;
positionTypeOld.value = data.positionTypeOld;
positionLevelOld.value = data.positionLevelOld;
posNo.value = data.positionNumberOld;
salary.value = data.salary ?? 0;
reason.value = data.reason;
date.value = data.positionDate;
avatar.value = data.avatar ?? "";
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
//ยืนยันการเเก้ไข
const clickSave = async () => {
if (myForm.value !== null) {
myForm.value.validate().then((success: any) => {
if (success) {
dialogConfirm(
$q,
async () => await putAppointment(),
"ต้องการแก้ไขข้อมูลหรือไม่?",
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
);
}
});
}
};
// เเก้ไขข้อมูล
const putAppointment = async () => {
let data = {
citizenId: appointment.value.citizenId,
prefixId: appointment.value.prefixId,
firstname: appointment.value.firstname,
lastname: appointment.value.lastname,
educationOld: educationOld.value,
organizationPositionOld: organizationPositionOld.value,
positionTypeOld: positionTypeOld.value,
positionLevelOld: positionLevelOld.value,
positionNumberOld: posNo.value,
amountOld: Number(salary.value),
reason: reason.value,
positionDate: date.value,
};
// showLoader();
// await http
// .put(config.API.appointmentByid(paramsId.toString()), data)
// .then(() => {
// success($q, "บันทึกข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// fecthappointmentByid();
// edit.value = false;
// });
};
const cancel = () => {
edit.value = false;
fecthappointmentByid();
myForm.value?.resetValidation();
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
onMounted(async () => {
await fecthappointmentByid();
});
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm"
@click="router.push(`/appoint-promote`)" />
รายละเอียดการแต่งตั้ง-เลื่อน {{ title.fullname }}
</div>
<q-card bordered class="row col-12 text-dark">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-subtitle2">
{{ title.fullname }}
</div>
<q-space />
<q-btn outline color="blue" dense icon-right="mdi-open-in-new" class="q-px-sm" label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${profileId}`)" />
</div>
<div class="col-12"><q-separator /></div>
<div class="row col-12 q-pa-md">
<div class="col-12 row bg-white q-col-gutter-md">
<div class="col-xs-3 col-sm-2 col-md-1 row">
<q-img :src="avatar" v-if="avatar !== ''" />
<q-img src="@/assets/avatar_user.jpg" v-else />
</div>
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12 q-pl-md">
<div class="col-12 text-top">ตำแหน่งในสายงาน</div>
<div class="col-12 text-detail">
{{ title.positionTypeOld }}
</div>
</div>
</div>
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">ระดับ</div>
<div class="col-12 text-detail">
{{ title.positionLevelOld }}
</div>
</div>
</div>
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">สังกัด</div>
<div class="col-12 text-detail">
{{ title.organizationPositionOld }}
</div>
</div>
</div>
</div>
</div>
</q-card>
<q-card bordered class="row col-12 text-dark q-mt-sm">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">
แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
</div>
<q-space />
<div v-if="status !== 'DONE' && status !== 'REPORT'">
<div class="q-gutter-sm" v-if="!edit">
<q-btn outline color="primary" dense icon-right="mdi-file-edit-outline" class="q-px-sm" label="แก้ไข"
style="width: 80px" @click="edit = !edit" />
</div>
<div class="q-gutter-sm" v-else>
<q-btn outline color="public" dense class="q-px-sm" label="บันทึก" style="width: 80px" @click="clickSave" />
<q-btn outline color="red" dense class="q-px-sm" label="ยกเลิก" style="width: 80px" @click="cancel()" />
</div>
</div>
</div>
<div class="col-12"><q-separator /></div>
<q-form ref="myForm">
<div class="row col-12 q-pa-md">
<div class="col-12">
<div class="text-weight-bold">วุฒิการศึกษา</div>
</div>
<div class="col-12">
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="educationOld" :rules="[(val) => !!val || `${'กรุณากรอกวุฒิการศึกษา'}`]" hide-bottom-space
:label="`${'วุฒิการศึกษา'}`" type="text" />
</div>
</div>
<div class="row col-12 q-pa-md">
<div class="col-12 row bg-white q-col-gutter-md">
<div class="col-xs-12 row q-pa-md items-center">
<div class="col-12">
<div class="text-weight-bold">ตำแหน่งและหน่วยงานเดิม</div>
</div>
<div class="col-12">
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="organizationPositionOld" :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
hide-bottom-space :label="`${'ตำแหน่ง/สังกัด'}`" type="textarea" />
</div>
</div>
<div class="col-xs-6 col-sm-3 row">
<div class="col-12">
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="positionTypeOld" :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]" hide-bottom-space
:label="`${'ตำแหน่งประเภท'}`" />
</div>
</div>
<div class="col-xs-6 col-sm-3 row">
<div class="col-12">
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="positionLevelOld" :rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]" hide-bottom-space
:label="`${'ระดับ'}`" />
</div>
</div>
<div class="col-xs-6 col-sm-3 row">
<div class="col-12">
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="posNo" :rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]" hide-bottom-space
:label="`${'เลขที่'}`" />
</div>
</div>
<div class="col-xs-6 col-sm-3 row">
<div class="col-12">
<CurrencyInput v-model="salary" label="เงินเดือน" :edit="edit"
:rules="[(val: number) => !!val || `${'กรุณากรอกเงินเดือน'}`]" lazy-rules />
</div>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-6 col-sm-6 row items-center">
<div class="col-12">
<datepicker menu-class-name="modalfix" :readonly="!edit" v-model="date" :locale="'th'" autoApply
:enableTimePicker="false" week-start="0">
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit" :readonly="!edit"
:model-value="date !== null ? date2Thai(date) : null"
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]" hide-bottom-space
:label="`${'ดำรงตำแหน่งในระดับปัจจุบันเมื่อ'}`">
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" :style="edit
? 'color: var(--q-primary)'
: 'color: var(--q-grey)'
">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
<div class="col-12">
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="reason" hide-bottom-space :label="`${'หมายเหตุ '}`" type="textarea" />
</div>
</div>
</div>
</q-form>
</q-card>
</template>
<style lang="scss" scope>
.q-img {
border-radius: 5px;
height: 70px;
}
.text-top {
color: gray;
font-weight: 400;
padding-bottom: 3px;
}
.text-detail {
font-weight: 500;
}
</style>

27
src/modules/05_placement/components/AppointEmployee/DialogHeader.vue Normal file
View file

@ -0,0 +1,27 @@
<script setup lang="ts">
const props = defineProps({
title: String,
close: {
type: Function,
default: () => console.log("not function"),
},
});
const close = async () => {
props.close();
};
</script>
<template>
<q-toolbar class="q-py-md">
<q-toolbar-title class="header-text">{{ title }}</q-toolbar-title>
<q-btn icon="close" unelevated round dense @click="close" style="color: #ff8080; background-color: #ffdede" />
</q-toolbar>
</template>
<style scoped lang="scss">
.header-text {
font-size: 18px;
font-weight: 600;
line-height: 26px;
color: #35373C;
}
</style>

231
src/modules/05_placement/components/AppointEmployee/Dialogbody.vue Normal file
View file

@ -0,0 +1,231 @@
<script setup lang="ts">
import { ref, computed, watchEffect } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import type { QTableProps } from "quasar";
import type { UserData } from "@/modules/05_placement/interface/response/AppointMent";
import DialogHeader from "@/modules/05_placement/components/AppointMent/DialogHeader.vue";
import http from "@/plugins/http";
import config from "@/app.config";
const mixin = useCounterMixin();
const { showLoader, success, messageError, dialogConfirm, hideLoader } = mixin;
const $q = useQuasar();
const selected = ref<[]>([]);
const checkSelected = computed(() => {
if (selected.value.length === 0 || props.type === "") {
return true;
}
});
const props = defineProps({
Modal: Boolean,
clickClose: Function,
fecthlistappointment: Function,
nextPage: Function,
optionsType: Array,
rows2: Array,
filterKeyword2: String,
type: String,
});
const visibleColumns2 = ref<string[]>([
"no",
"citizenId",
"fullname",
"organizationName",
"birthday",
]);
const columns2 = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: false,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "citizenId",
align: "left",
label: "เลขประจำตัวประชาชน",
sortable: true,
field: "citizenId",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "fullname",
align: "left",
label: "ชื่อ-นามสกุล",
sortable: true,
field: "fullname",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "organizationName",
align: "left",
label: "หน่วยงานที่รับการแต่งตั้ง-เลื่อน",
sortable: true,
field: "organizationName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "birthday",
align: "left",
label: "วัน/เดือน/ปี เกิด",
sortable: true,
field: "birthday",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
const pageNext = (item: object) => {
props.nextPage?.(item)
}
const emit = defineEmits([
"update:filterKeyword2",
"update:type",
"update:selected",
]);
const updateInput = (value: any) => {
emit("update:filterKeyword2", value);
};
const updateInputType = (value: string) => {
emit("update:type", value);
};
//รีเซ็ตค่าในช่องค้นหา
const Reset = () => {
emit("update:filterKeyword2", "");
};
//เปิด modal ยืนยัน
const clickAddlist = () => {
dialogConfirm($q, () => createdAppoint());
};
//อัพเดต ส่งไปออกคำสั่ง
const createdAppoint = async () => {
let pId: string[] = [];
let Type = props.type as string
selected.value.forEach((e: UserData) => {
pId.push(e.personalId);
});
let data = {
id: pId,
};
showLoader();
await http
.put(config.API.apppointmentReport(Type), data)
.then((res) => {
success($q, "บันทึกสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
props.fecthlistappointment?.();
selected.value = [];
props.clickClose?.()
});
};
watchEffect(() => {
if (props.Modal === true) {
selected.value = [];
}
});
</script>
<template>
<q-dialog v-model="props.Modal">
<q-card style="width: 1200px; max-width: 80vw">
<DialogHeader title="ส่งไปออกคำสั่ง" :close="clickClose" />
<q-separator />
<q-card-section class="q-pt-none">
<div class="row justify-between">
<div class="col-5">
<q-toolbar style="padding: 0">
<q-select outlined dense :model-value="type" @update:model-value="updateInputType" :options="optionsType"
label="คำสั่งแต่งตั่ง-เลื่อน-ย้าย" style="width: 400px; max-width: auto" emit-value map-options
option-label="name" option-value="id" />
</q-toolbar>
</div>
<div class="col-5">
<q-toolbar style="padding: 0">
<q-input borderless outlined dense debounce="300" :model-value="filterKeyword2"
@update:model-value="updateInput" placeholder="ค้นหา" style="width: 850px; max-width: auto">
<template v-slot:append>
<q-icon v-if="filterKeyword2 == ''" name="search" />
<q-icon v-if="filterKeyword2 !== ''" name="clear" class="cursor-pointer" @click="Reset" />
</template>
</q-input>
<q-select v-model="visibleColumns2" multiple outlined dense options-dense
:display-value="$q.lang.table.columns" emit-value map-options :options="columns2" option-value="name"
options-cover style="min-width: 150px" class="gt-xs q-ml-sm" />
</q-toolbar>
</div>
</div>
<d-table :columns="columns2" :rows="rows2" :filter="filterKeyword2" row-key="personalId" flat
:visible-columns="visibleColumns2" 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 key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="citizenId" :props="props" @click="pageNext(props.row)">
{{ props.row.citizenId }}
</q-td>
<q-td key="fullname" :props="props" @click="pageNext(props.row)">
{{ props.row.fullname }}
</q-td>
<q-td key="organizationName" :props="props" @click="pageNext(props.row)">
<div v-if="props.row.orgName !== null ||
props.row.positionPath !== null
">
<div class="col-4">
<div class="text-weight-medium">
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
{{ props.row.organizationShortName !== null ? `(${props.row.organizationShortName})` : "" }}
</div>
<div class="text-weight-light">
{{ props.row.positionPath !== null ? props.row.positionPath : "-" }}
{{ props.row.positionNumber !== null ? `(${props.row.positionNumber})` : "" }}
</div>
</div>
</div>
<div v-else>
<div class="col-4">
<div class="text-weight-medium">-</div>
</div>
</div>
</q-td>
<q-td key="birthday" :props="props" @click="pageNext(props.row)">
{{ props.row.birthday }}
</q-td>
</q-tr>
</template>
</d-table>
</q-card-section>
<q-card-actions align="right" class="bg-white text-teal">
<q-btn label="ส่งไปออกคำสั่ง" @click="clickAddlist" color="public" :disable="checkSelected" />
</q-card-actions>
</q-card>
</q-dialog>
</template>

394
src/modules/05_placement/components/AppointEmployee/Main.vue Normal file
View file

@ -0,0 +1,394 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import type { QTableProps } from "quasar";
import { useQuasar } from "quasar";
import { useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useTransferDataStore } from "@/modules/05_placement/store";
import Dialogbody from "@/modules/05_placement/components/AppointEmployee/Dialogbody.vue";
import DialogOrgTree from "@/modules/05_placement/components/AppointEmployee/Modal.vue";
import type {
listAppointType,
resData,
orgFilter,
} from "@/modules/05_placement/interface/response/AppointMent";
import type { OpType } from "@/modules/05_placement/interface/response/Main";
import http from "@/plugins/http";
import config from "@/app.config";
const $q = useQuasar();
const modal = ref<boolean>(false);
const storeFn = useTransferDataStore();
const { statusText } = storeFn;
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
const {
showLoader,
hideLoader,
success,
messageError,
date2Thai,
dialogRemove,
} = mixin;
const router = useRouter();
const rows = ref<listAppointType[]>([]);
const rows2 = ref<listAppointType[]>([]);
const modalTree = ref<boolean>(false);
const personal = ref<resData[]>([]);
const personalId = ref<string>("");
const filterKeyword = ref<string>("");
const filterKeyword2 = ref<string>("");
const filterRef = ref<any>(null);
const listRecevice = ref<resData[]>([]);
const optionsType = ref<OpType[]>([]);
const type = ref<string>("");
const visibleColumns = ref<string[]>([
"no",
"citizenId",
"fullname",
"organizationName",
"birthday",
"createdAt",
"status",
]);
const pagination = ref({
sortBy: "createdAt",
descending: true,
page: 1,
rowsPerPage: 10,
});
const columns = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: false,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "citizenId",
align: "left",
label: "เลขประจำตัวประชาชน",
sortable: true,
field: "citizenId",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "fullname",
align: "left",
label: "ชื่อ-นามสกุล",
sortable: true,
field: "fullname",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "organizationName",
align: "left",
label: "หน่วยงานที่รับการแต่งตั้ง",
sortable: true,
field: "organizationName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "birthday",
align: "left",
label: "วัน/เดือน/ปี เกิด",
sortable: true,
field: "birthday",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "createdAt",
align: "left",
label: "วันที่ดำเนินการ",
sortable: true,
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "status",
align: "left",
label: "สถานะ",
sortable: true,
field: "status",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
//รีเซ็ต input
const resetFilter = () => {
filterKeyword.value = "";
filterKeyword2.value = "";
filterRef.value.focus();
};
//ปิด modal
const clickClose = () => {
modal.value = false;
};
//เปิด modal
const popup = () => {
modal.value = true;
filterKeyword2.value = "";
fecthTypeOption();
};
//ดึงข้อมูล API
const fecthlistappointment = async () => {
// showLoader();
// rows.value = [];
// await http
// .get(config.API.appointmentMain())
// .then((res) => {
// let response = res.data.result;
// listRecevice.value = response;
// rows.value = response.map((e: resData) => ({
// personalId: e.id,
// citizenId: e.citizenId,
// fullname: e.prefix + e.firstname + " " + e.lastname,
// organizationName:
// e.organizationName +
// " " +
// e.organizationShortName +
// " " +
// e.positionNumber +
// " " +
// e.positionPath,
// orgName: e.organizationName,
// organizationShortName: e.organizationShortName,
// positionNumber: e.positionNumber,
// positionPath: e.positionPath,
// status: statusText(e.status),
// createdAt: date2Thai(e.createdAt),
// birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
// educationOld: e.educationOld,
// organizationPositionOld: e.organizationPositionOld,
// positionTypeOld: e.positionTypeOld,
// positionLevelOld: e.positionLevelOld,
// positionNumberOld: e.positionNumberOld,
// salary: e.salary,
// positionDate: e.positionDate,
// }));
// rows2.value = rows.value.filter(
// (e: orgFilter) =>
// e.orgName !== null &&
// e.status !== "ส่งรายชื่อไปออกคำสั่ง" &&
// e.status !== "ออกคำสั่งเสร็จแล้ว" &&
// e.educationOld &&
// e.organizationPositionOld &&
// e.positionTypeOld &&
// e.positionLevelOld &&
// e.positionNumberOld &&
// e.salary !== null &&
// e.positionDate
// );
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// hideLoader();
// });
};
//ดึงข้อมูลประเภทคำสั่งเเต่งตั้ง
const fecthTypeOption = async () => {
type.value = "";
await http
.get(config.API.typeOrder())
.then((res) => {
optionsType.value = res.data.result.filter(
(e: OpType) =>
e.commandCode === "C-PM-05"
);
})
.catch((e) => {
messageError($q, e);
});
};
// เปิดโครงสร้าง
const openModalTree = (id: string) => {
personalId.value = id;
personal.value = listRecevice.value.filter((e) => e.id === id);
modalTree.value = true;
};
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => deleteAppoint(id));
};
// ลบข้อมูล
const deleteAppoint = async (id: string) => {
showLoader();
await http
.delete(config.API.appointmentDelete(id))
.then(() => {
success($q, "ลบข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
fecthlistappointment();
hideLoader();
});
};
// ปิด modal โครงส้ราง
const closeModalTree = async () => {
await fecthlistappointment();
modalTree.value = false;
};
// ไปหน้ารายละเอียด
const nextPage = (id: string) => {
router.push({
path: `appoint-promote/detail/${id}`,
});
};
onMounted(() => {
fecthlistappointment();
});
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
รายการแต่งตั้งลูกจ้างประจำ
</div>
<q-card flat bordered class="col-12 q-mt-sm">
<q-separator />
<div class="row q-pa-md">
<div class="col-12">
<div class="row col-12">
<q-btn @click="popup()" size="14px" flat round color="add" icon="mdi-account-arrow-right">
<q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
</q-btn>
<q-space />
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef" outlined
debounce="300" placeholder="ค้นหา">
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
</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="col-xs-12 col-sm-3 col-md-2 q-ml-sm" />
</div>
<div class="col-12 q-pt-sm">
<d-table :columns="columns" :rows="rows" :filter="filterKeyword" row-key="citizenId"
:visible-columns="visibleColumns" v-model:pagination="pagination">
<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-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props" @click="nextPage(props.row.personalId)">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="citizenId" :props="props" @click="nextPage(props.row.personalId)">
{{ props.row.citizenId }}
</q-td>
<q-td key="fullname" :props="props" @click="nextPage(props.row.personalId)">
{{ props.row.fullname }}
</q-td>
<q-td key="organizationName" :props="props" @click="nextPage(props.row.personalId)">
<div v-if="props.row.orgName !== null ||
props.row.positionPath !== null
">
<div class="col-4">
<div class="text-weight-medium">
{{
props.row.orgName !== null ? props.row.orgName : "-"
}}
{{
props.row.organizationShortName !== null
? `(${props.row.organizationShortName})`
: ""
}}
</div>
<div class="text-weight-light">
{{
props.row.positionPath !== null
? props.row.positionPath
: "-"
}}
{{
props.row.positionNumber !== null
? `(${props.row.positionNumber})`
: ""
}}
</div>
</div>
</div>
<div v-else>
<div class="col-4">
<div class="text-weight-medium">-</div>
</div>
</div>
</q-td>
<q-td key="birthday" :props="props" @click="nextPage(props.row.personalId)">
{{ props.row.birthday }}
</q-td>
<q-td key="createdAt" :props="props" @click="nextPage(props.row.personalId)">
{{ props.row.createdAt }}
</q-td>
<q-td key="status" :props="props" @click="nextPage(props.row.personalId)">
{{ props.row.status }}
</q-td>
<q-td auto-width>
<q-btn v-if="props.row.status !== 'ส่งรายชื่อไปออกคำสั่ง' &&
props.row.status !== 'ออกคำสั่งแล้ว'
" icon="mdi-dots-vertical" size="12px" color="grey-7" flat round dense>
<q-menu transition-show="jump-down" transition-hide="jump-up">
<q-list dense style="min-width: 100px">
<q-item clickable v-close-popup @click="openModalTree(props.row.personalId)">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-icon color="primary" size="xs" name="mdi-bookmark-outline" />
</q-item-section>
<q-item-section>เลือกหน่วยงาน/ตำแหน่ง</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="clickDelete(props.row.personalId)">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-tooltip>ลบข้อมูล</q-tooltip>
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
<q-item-section>ลบ</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</div>
</div>
</div>
</q-card>
<Dialogbody v-model:Modal="modal" :clickClose="clickClose" :optionsType="optionsType" :rows2="rows2"
v-model:filterKeyword2="filterKeyword2" v-model:type="type" :nextPage="nextPage"
:fecthlistappointment="fecthlistappointment" />
<DialogOrgTree v-model:modal="modalTree" :close="closeModalTree" :personal="personal" :personalId="personalId" />
</template>
<style scoped lang="scss"></style>

581
src/modules/05_placement/components/AppointEmployee/Modal.vue Normal file
View file

@ -0,0 +1,581 @@
<script setup lang="ts">
import { useQuasar, QForm } from "quasar";
import { onMounted, reactive, ref, watch } from "vue";
import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
const $q = useQuasar();
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
const { date2Thai, hideLoader, messageError, showLoader, success, dialogConfirm } = mixin; //ฟังก์ชันกลางที่เรียกใช้
const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
const noData = ref<string>("ไม่พบข้อมูลผังโครงสร้าง");
const checkValidate = ref<boolean>(false);
const myFormPosition = ref<any>();
const selected = ref<string>("");
const selectedFile = ref<string>("");
const dataRespone = ref<any>();
const personal = ref<any>();
const expanded = ref<string[]>([]);
const treeData = ref<Array<any>>([]);
const placementPosition = ref<any>([]);
const search = ref<string>("");
const filterRef = ref<any>(null);
const id = ref<string>("");
const editDataStatus = ref<boolean>(false);
// Set form field
let dataForm = reactive({
personalId: "",
containDate: new Date(),
posNoId: "",
positionId: "",
positionLevelId: "",
positionLineId: "",
positionPathSideId: "",
positionTypeId: "",
});
onMounted(async () => {
await fetchPublishFile();
await loadTreeData();
await fetchplacementPosition();
});
const fetchPublishFile = async () => {
await http
.get(config.API.getPublishFileHistory)
.then((res) => {
let data = res.data.result;
selectedFile.value = data[0].fileName;
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
});
};
// โหลดข้อมูลโครงสร้างจาก json
const loadTreeData = async () => {
expanded.value = [];
await http
.get(`${config.s3ClusterUrl}${selectedFile.value}`)
.then((res: any) => {
treeData.value = res.data;
dataRespone.value = res.data;
// Filter objects with "name" null
const filteredData = res.data.filter(filterByPersonIdNull);
treeData.value = filteredData;
})
.catch((e: any) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
function filterByPersonIdNull(obj: any) {
if (obj.name === null && obj.isCondition != true) {
return true;
}
if (obj.children && obj.children.length > 0) {
obj.children = obj.children.filter(filterByPersonIdNull);
return obj.children.length > 0;
}
return false;
}
// โหลด position
const fetchplacementPosition = async () => {
await http
.get(config.API.apppointmentPosition())
.then((res: any) => {
placementPosition.value = res.data.result;
})
.catch((e: any) => {
messageError($q, e);
});
};
const props = defineProps({
personalId: String,
modal: Boolean,
close: {
type: Function,
default: () => console.log("close modal"),
},
personal: Object,
});
const myFilterMethod = (node: any, filter: string) => {
const filt = filter;
return (
(node.name && node.name.indexOf(filt) > -1) ||
(node.organizationName && node.organizationName.indexOf(filt) > -1) ||
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
(node.positionName && node.positionName.indexOf(filt) > -1) ||
(node.governmentCode && node.governmentCode.toString().indexOf(filt) > -1) ||
(node.agency && node.agency.indexOf(filt) > -1) ||
(node.government && node.government.indexOf(filt) > -1) ||
(node.department && node.department.indexOf(filt) > -1) ||
(node.pile && node.pile.indexOf(filt) > -1) ||
(node.organizationShortName && node.organizationShortName.indexOf(filt) > -1) ||
(node.positionSideName && node.positionSideName.indexOf(filt) > -1) ||
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
(node.executivePositionSide && node.executivePositionSide.indexOf(filt) > -1) ||
(node.positionLevel && node.positionLevel.indexOf(filt) > -1)
);
};
const validateData = async () => {
checkValidate.value = true;
await myFormPosition.value.validate().then((result: boolean) => {
if (result == false) {
checkValidate.value = false;
}
});
};
const saveAppoint = async () => {
myFormPosition.value.validate().then(async (result: boolean) => {
if (props.personalId !== undefined) {
id.value = props.personalId.toString();
}
if (result) {
const dataAppoint = await {
recruitDate: dataForm.containDate,
posNoId: dataForm.posNoId,
positionId: dataForm.positionId,
positionLevelId: dataForm.positionLevelId,
positionLineId: dataForm.positionLineId,
positionPathSideId: dataForm.positionPathSideId,
positionTypeId: dataForm.positionTypeId,
};
showLoader();
await http
.put(config.API.appointmentPosition(id.value), dataAppoint)
.then((res) => {
success($q, "บันทึกสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await closeAndClear();
await fetchPublishFile();
await loadTreeData();
await fetchplacementPosition();
hideLoader();
});
}
});
};
const closeModal = () => {
if (editDataStatus.value == true) {
dialogConfirm(
$q,
async () => {
editDataStatus.value = false;
await closeAndClear();
},
`ข้อมูลมีการแก้ไข`,
`ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?`
);
} else {
closeAndClear();
}
};
const closeAndClear = async () => {
await props.close();
editDataStatus.value = false;
selected.value = "";
dataForm.personalId = "";
dataForm.containDate = new Date();
dataForm.posNoId = "";
dataForm.positionId = "";
dataForm.positionLevelId = "";
dataForm.positionLineId = "";
dataForm.positionPathSideId = "";
dataForm.positionTypeId = "";
};
// ตำแหน่งเลขที่
const posNoOptions = ref<Object[]>([
{
label: "",
value: "",
},
]);
// ตำแหน่ง
const positionOptions = ref<Object[]>([
{
label: "",
value: "",
},
]);
// ด้าน/สาขา
const positionPathSideOptions = ref<Object[]>([
{
label: "",
value: "",
},
]);
// ตำแหน่งประเภท
const positionTypeOptions = ref<Object[]>([
{
label: "",
value: "",
},
]);
// สายงาน
const positionLineOptions = ref<Object[]>([
{
label: "",
value: "",
},
]);
// ระดับ
const positionLevelOptions = ref<Object[]>([
{
label: "",
value: "",
},
]);
const selectedPosition = async (data: any) => {
if (data.name == null && selected.value != data.keyId) {
editDataStatus.value = true;
selected.value = data.keyId;
// posNo Options
posNoOptions.value = [
{
label: data.positionNum,
value: data.positionNumId,
},
];
dataForm.posNoId = data.positionNumId;
// position Options
positionOptions.value = [
{
label: data.positionName,
value: data.positionNameId,
},
];
dataForm.positionId = data.positionNameId;
// positionPathSide Options
let positionPathSideArr: any = [];
if (data.positionSideNameObj && data.positionSideNameObj != null) {
data.positionSideNameObj.map((x: any) => {
positionPathSideArr.push({
label: x.Name,
value: x.Id,
});
});
positionPathSideOptions.value = positionPathSideArr;
dataForm.positionPathSideId =
positionPathSideArr.length > 1 || positionPathSideArr.length == 0
? ""
: positionPathSideArr[0].value;
}
// positionType Options
positionTypeOptions.value = [
{
label: data.positionType,
value: data.positionTypeId,
},
];
dataForm.positionTypeId = data.positionTypeId;
// positionLine Options
positionLineOptions.value = [
{
label: data.positionLine,
value: data.positionLineId,
},
];
dataForm.positionLineId = data.positionLineId;
// positionLevel Options
let positionLevelsArr: any = [];
if (data.positionLevelObj != null) {
data.positionLevelObj.map((x: any) => {
positionLevelsArr.push({
label: x.Name,
value: x.Id,
});
});
positionLevelOptions.value = positionLevelsArr;
dataForm.positionLevelId =
positionLevelsArr.length > 1 || positionLevelsArr.length == 0
? ""
: positionLevelsArr[0].value;
dataForm.positionLevelId = data.positionLevelObj[0].Id;
}
} else if (selected.value == data.keyId) {
selected.value = "";
dataForm.posNoId = "";
dataForm.positionId = "";
dataForm.positionLevelId = "";
dataForm.positionLineId = "";
dataForm.positionPathSideId = "";
dataForm.positionTypeId = "";
}
};
const checkPosition = (val: string) => {
const num = placementPosition.value.findIndex((e: string) => e === val);
return num;
};
watch(props, () => {
expanded.value = [];
const dataPersonal = props.personal;
if (dataPersonal) {
dataPersonal.map((data: any) => {
personal.value = data;
});
}
if (personal.value) {
let findData: any = null;
dataRespone.value.map((x: any) => {
findData = findByPerson(x);
if (findData != null) {
selectedPosition(findData);
for (let i = 3; i <= findData.keyId.length; i += 2) {
expanded.value.push(findData.keyId.slice(0, i));
}
}
});
}
});
function findByPerson(element: any): any {
if (
element.positionNumId &&
element.positionLineId === personal.value.positionLineId &&
element.positionTypeId === personal.value.positionTypeId &&
element.positionNumId === personal.value.posNoId &&
(element.positionLevelObj === null ||
element.positionLevelObj[0].Id === personal.value.positionLevelId)
) {
return element;
} else if (element.children) {
var i;
var result = null;
for (i = 0; result == null && i < element.children.length; i++) {
result = findByPerson(element.children[i]);
}
return result;
}
return null;
}
</script>
<template>
<q-dialog v-model="props.modal" persistent>
<q-card style="width: 900px; max-width: 80vw">
<q-form ref="myFormPosition">
<DialogHeader title="เลือกหน่วยงานที่แต่งตั้ง - เลื่อน" :close="closeModal" />
<q-separator />
<q-card-section class="q-pa-sm bg-grey-1">
<div class="row col-12 q-col-gutter-sm">
<div class="col-xs-12 col-sm-7 row">
<q-card flat bordered class="fit q-pa-sm">
<q-scroll-area visible style="height: 70vh">
<q-input outlined dense ref="filterRef" v-model="search" placeholder="ค้นหา" class="q-mb-sm">
<template v-slot:append>
<q-icon name="mdi-magnify" />
</template>
</q-input>
<div class="q-pa-sm q-gutter-sm">
<q-tree no-transition dense :nodes="treeData" node-key="keyId" :filter="search"
:no-results-label="notFound" :no-nodes-label="noData" :filter-method="myFilterMethod"
v-model:expanded="expanded">
<template v-slot:header-organization="prop">
<div class="col">
<div class="row items-center q-px-xs q-pt-xs q-gutter-sm">
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
<div class="text-weight-medium">
{{ prop.node.organizationName }}
</div>
<q-badge v-if="prop.node.totalPositionVacant > 0" rounded color="red" outline
:label="prop.node.totalPositionVacant" />
<q-space />
</div>
<div class="col items-center q-px-xs q-pt-xs">
<div class="text-weight-medium text-grey-7">
{{ prop.node.governmentCode }}
{{ prop.node.organizationShortName }}
</div>
</div>
</div>
</template>
<template v-slot:header-person="prop">
<q-item clickable :active="selected == prop.node.keyId" @click="selectedPosition(prop.node)"
:disable="prop.node.name != null ||
checkPosition(prop.node.positionNumId) != -1
" active-class="my-list-link text-primary text-weight-medium"
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list">
<img v-if="prop.node.avatar == '' ||
prop.node.avatar ==
'https://cdn.quasar.dev/img/boy-avatar.png'
" src="@/assets/avatar_user.jpg" class="col-xs-1 col-sm-2" style="
width: 28px;
height: 28px;
border-radius: 50%;
" />
<img v-else :src="prop.node.avatar" class="col-xs-1 col-sm-2" style="
width: 28px;
height: 28px;
border-radius: 50%;
" />
<!--=====ตำแหน่งว่าง สีแดง=====-->
<div v-if="prop.node.name == null" class="q-px-sm text-weight-medium text-red">
ว่าง
</div>
<!--=====หัวหน้า สีเขียว=====-->
<div v-else-if="prop.node.positionLeaderFlag">
<div class="q-px-sm text-weight-medium text-primary">
{{ prop.node.name }}
</div>
</div>
<!--=====ลูกน้อง สีปกติ=====-->
<div v-else>
<div class="q-px-sm text-weight-medium">
{{ prop.node.name }}
</div>
</div>
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
<div class="q-pr-sm">
{{ prop.node.positionName }}
</div>
<div class="q-pr-sm">
{{ prop.node.positionNum }}
</div>
<div class="q-pr-sm">
{{ prop.node.positionLevel }}
</div>
<q-icon v-if="prop.node.positionLeaderFlag" class="q-mr-sm" size="15px" color="primary"
name="mdi-bookmark"></q-icon>
<q-space />
</q-item>
</template>
</q-tree>
</div>
</q-scroll-area>
</q-card>
</div>
<div class="col-xs-12 col-sm-5">
<q-card flat bordered class="fit q-pa-sm">
<q-scroll-area visible style="height: 70vh">
<div class="row col-12 q-col-gutter-xs">
<div class="col-xs-12 col-sm-12 col-md-12"></div>
<div class="col-xs-12 col-sm-12 col-md-12">
<datepicker menu-class-name="modalfix" v-model="dataForm.containDate" :locale="'th'" autoApply
:enableTimePicker="false" week-start="0">
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input class="full-width inputgreen cursor-pointer" outlined dense lazy-rules :model-value="date2Thai(new Date(dataForm.containDate))
" :rules="[(val: string) => !!val || `${'วันที่รายงานตัว'}`]"
:label="`${'วันที่รายงานตัว'}`" hide-bottom-space>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<q-space />
<div class="col-xs-12 col-sm-12 col-md-12">
<q-select class="full-width inputgreen cursor-pointer custom-input" outlined standout dense
hide-bottom-space lazy-rules :options="posNoOptions" v-model="dataForm.posNoId"
:label="`${'ตำแหน่งเลขที่'}`" map-options />
</div>
<div class="col-xs-12 col-sm-12 col-md-12">
<q-select outlined class="full-width inputgreen cursor-pointer custom-input" standout dense
hide-bottom-space lazy-rules :options="positionOptions" v-model="dataForm.positionId"
:label="`${'ตำแหน่ง'}`" map-options />
</div>
<div class="col-xs-12 col-sm-12 col-md-12">
<q-select outlined class="full-width inputgreen cursor-pointer custom-input" standout dense
hide-bottom-space lazy-rules emit-value :options="positionPathSideOptions"
v-model="dataForm.positionPathSideId" :label="`${'ด้าน/สาขา'}`" map-options />
</div>
<div class="col-xs-12 col-sm-12 col-md-12">
<q-select outlined class="full-width inputgreen cursor-pointer custom-input" standout dense
hide-bottom-space lazy-rules :options="positionTypeOptions" v-model="dataForm.positionTypeId"
:label="`${'ประเภทตำแหน่ง'}`" map-options />
</div>
<div class="col-xs-12 col-sm-12 col-md-12">
<q-select outlined class="full-width inputgreen cursor-pointer custom-input" standout dense
hide-bottom-space lazy-rules :options="positionLineOptions" v-model="dataForm.positionLineId"
:label="`${'สายงาน'}`" map-options />
</div>
<div class="col-xs-12 col-sm-12 col-md-12">
<q-select outlined class="full-width inputgreen cursor-pointer custom-input" standout dense
lazy-rules :options="positionLevelOptions" v-model="dataForm.positionLevelId"
:label="`${'ระดับ'}`" hide-bottom-space
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับ'}`]" emit-value map-options />
</div>
</div>
</q-scroll-area>
</q-card>
</div>
</div>
</q-card-section>
<q-separator />
<DialogFooter :editvisible="true" :validate="validateData" :save="saveAppoint"
v-model:modalEdit="editDataStatus" />
</q-form>
</q-card>
</q-dialog>
</template>
<style scoped lang="scss">
.q-tree__node-header {
padding: 0px;
margin-top: 0px;
border-radius: 4px;
outline: 0;
}
.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>

2
src/modules/05_placement/components/AppointMent/Detail.vue
View file

@ -163,7 +163,7 @@ onMounted(async () => {
class="q-mr-sm"
@click="router.push(`/appoint-promote`)"
/>
รายละเอียดการแต่งตั้ง-เลื่อน {{ title.fullname }}
รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย {{ title.fullname }}
</div>
<q-card bordered class="row col-12 text-dark">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">

2
src/modules/05_placement/components/AppointMent/Dialogbody.vue
View file

@ -68,7 +68,7 @@ const columns2 = ref<QTableProps["columns"]>([
{
name: "organizationName",
align: "left",
label: "หน่วยงานที่รับการแต่งตั้ง-เลื่อน",
label: "หน่วยงานที่รับการแต่งตั้ง-เลื่อน-ย้าย",
sortable: true,
field: "organizationName",
headerStyle: "font-size: 14px",

220
src/modules/05_placement/components/AppointMent/Main.vue
View file

@ -4,18 +4,22 @@ import type { QTableProps } from "quasar";
import { useQuasar } from "quasar";
import { useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useTransferDataStore } from "@/modules/05_placement/store"
import Dialogbody from "@/modules/05_placement/components/AppointMent/Dialogbody.vue"
import { useTransferDataStore } from "@/modules/05_placement/store";
import Dialogbody from "@/modules/05_placement/components/AppointMent/Dialogbody.vue";
import DialogOrgTree from "@/modules/05_placement/components/AppointMent/AppointmentModal.vue";
import type { listAppointType,resData,orgFilter } from "@/modules/05_placement/interface/response/AppointMent"
import type { OpType } from "@/modules/05_placement/interface/response/Main"
import type {
listAppointType,
resData,
orgFilter,
} from "@/modules/05_placement/interface/response/AppointMent";
import type { OpType } from "@/modules/05_placement/interface/response/Main";
import http from "@/plugins/http";
import config from "@/app.config";
const $q = useQuasar();
const modal = ref<boolean>(false);
const storeFn = useTransferDataStore();
const { statusText } = storeFn
const { statusText } = storeFn;
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
const {
showLoader,
@ -85,7 +89,7 @@ const columns = ref<QTableProps["columns"]>([
{
name: "organizationName",
align: "left",
label: "หน่วยงานที่รับการแต่งตั้ง-เลื่อน",
label: "หน่วยงานที่รับการแต่งตั้ง-เลื่อน-ย้าย",
sortable: true,
field: "organizationName",
headerStyle: "font-size: 14px",
@ -167,15 +171,30 @@ const fecthlistappointment = async () => {
status: statusText(e.status),
createdAt: date2Thai(e.createdAt),
birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
educationOld: e.educationOld,
organizationPositionOld: e.organizationPositionOld,
positionTypeOld: e.positionTypeOld,
positionLevelOld: e.positionLevelOld,
positionNumberOld: e.positionNumberOld,
salary: e.salary,
positionDate: e.positionDate,
}));
rows2.value = rows.value.filter(
(e: orgFilter) =>
e.orgName !== null &&
e.status !== "ส่งรายชื่อไปออกคำสั่ง" &&
e.status !== "ออกคำสั่งเสร็จแล้ว"
e.status !== "ออกคำสั่งเสร็จแล้ว" &&
e.educationOld &&
e.organizationPositionOld &&
e.positionTypeOld &&
e.positionLevelOld &&
e.positionNumberOld &&
e.salary !== null &&
e.positionDate
);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
@ -241,7 +260,6 @@ const nextPage = (id: string) => {
});
};
onMounted(() => {
fecthlistappointment();
});
@ -255,27 +273,65 @@ onMounted(() => {
<div class="row q-pa-md">
<div class="col-12">
<div class="row col-12">
<q-btn @click="popup()" size="14px" flat round color="add" icon="mdi-account-arrow-right">
<q-btn
@click="popup()"
size="14px"
flat
round
color="add"
icon="mdi-account-arrow-right"
>
<q-tooltip>ส่งไปออกคำสั่งแต่งตั้ง-เลื่อน-ย้าย</q-tooltip>
</q-btn>
<q-space />
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef" outlined
debounce="300" placeholder="ค้นหา">
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</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="col-xs-12 col-sm-3 col-md-2 q-ml-sm" />
<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="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
/>
</div>
<div class="col-12 q-pt-sm">
<d-table :columns="columns" :rows="rows" :filter="filterKeyword" row-key="citizenId"
:visible-columns="visibleColumns" v-model:pagination="pagination">
<d-table
:columns="columns"
:rows="rows"
:filter="filterKeyword"
row-key="citizenId"
:visible-columns="visibleColumns"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
@ -286,27 +342,60 @@ onMounted(() => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props" @click="nextPage(props.row.personalId)">
<q-td
key="no"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="citizenId" :props="props" @click="nextPage(props.row.personalId)">
<q-td
key="citizenId"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.citizenId }}
</q-td>
<q-td key="fullname" :props="props" @click="nextPage(props.row.personalId)">
<q-td
key="fullname"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.fullname }}
</q-td>
<q-td key="organizationName" :props="props" @click="nextPage(props.row.personalId)">
<div v-if="props.row.orgName !== null ||
props.row.positionPath !== null
">
<q-td
key="organizationName"
:props="props"
@click="nextPage(props.row.personalId)"
>
<div
v-if="
props.row.orgName !== null ||
props.row.positionPath !== null
"
>
<div class="col-4">
<div class="text-weight-medium">
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
{{ props.row.organizationShortName !== null ? `(${props.row.organizationShortName})` : "" }}
{{
props.row.orgName !== null ? props.row.orgName : "-"
}}
{{
props.row.organizationShortName !== null
? `(${props.row.organizationShortName})`
: ""
}}
</div>
<div class="text-weight-light">
{{ props.row.positionPath !== null ? props.row.positionPath : "-" }}
{{ props.row.positionNumber !== null ? `(${props.row.positionNumber})` : "" }}
{{
props.row.positionPath !== null
? props.row.positionPath
: "-"
}}
{{
props.row.positionNumber !== null
? `(${props.row.positionNumber})`
: ""
}}
</div>
</div>
</div>
@ -316,29 +405,73 @@ onMounted(() => {
</div>
</div>
</q-td>
<q-td key="birthday" :props="props" @click="nextPage(props.row.personalId)">
<q-td
key="birthday"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.birthday }}
</q-td>
<q-td key="createdAt" :props="props" @click="nextPage(props.row.personalId)">
<q-td
key="createdAt"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.createdAt }}
</q-td>
<q-td key="status" :props="props" @click="nextPage(props.row.personalId)">
<q-td
key="status"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.status }}
</q-td>
<q-td auto-width>
<q-btn v-if="props.row.status !== 'ส่งรายชื่อไปออกคำสั่ง' &&
props.row.status !== 'ออกคำสั่งแล้ว'
" icon="mdi-dots-vertical" size="12px" color="grey-7" flat round dense>
<q-menu transition-show="jump-down" transition-hide="jump-up">
<q-btn
v-if="
props.row.status !== 'ส่งรายชื่อไปออกคำสั่ง' &&
props.row.status !== 'ออกคำสั่งแล้ว'
"
icon="mdi-dots-vertical"
size="12px"
color="grey-7"
flat
round
dense
>
<q-menu
transition-show="jump-down"
transition-hide="jump-up"
>
<q-list dense style="min-width: 100px">
<q-item clickable v-close-popup @click="openModalTree(props.row.personalId)">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-icon color="primary" size="xs" name="mdi-bookmark-outline" />
<q-item
clickable
v-close-popup
@click="openModalTree(props.row.personalId)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-icon
color="primary"
size="xs"
name="mdi-bookmark-outline"
/>
</q-item-section>
<q-item-section>เลือกหน่วยงาน/ตำแหน่ง</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="clickDelete(props.row.personalId)">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-item
clickable
v-close-popup
@click="clickDelete(props.row.personalId)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
@ -366,6 +499,11 @@ onMounted(() => {
:nextPage="nextPage"
:fecthlistappointment="fecthlistappointment"
/>
<DialogOrgTree v-model:modal="modalTree" :close="closeModalTree" :personal="personal" :personalId="personalId" />
<DialogOrgTree
v-model:modal="modalTree"
:close="closeModalTree"
:personal="personal"
:personalId="personalId"
/>
</template>
<style scoped lang="scss"></style>

2
src/modules/05_placement/components/Main.vue
View file

@ -425,7 +425,7 @@ function filterFnYear(val: string, update: any) {
</template>
</q-select>
<q-select
class="col-xs-12 col-sm-3 col-md-2"
class="col-xs-12 col-sm-3 col-md-3"
v-model="examType"
label="ประเภทการสอบ"
dense

44
src/modules/05_placement/components/Other/Dialogbody.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, computed,watchEffect } from "vue";
import { ref, computed, watchEffect } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import type { QTableProps } from "quasar";
@ -25,8 +25,8 @@ const props = defineProps({
fecthlistOthet: Function,
optionsType: Array,
rows2: Array,
filterKeyword2:String,
type:String,
filterKeyword2: String,
type: String,
});
const visibleColumns2 = ref<string[]>([
"no",
@ -96,7 +96,6 @@ const emit = defineEmits([
"update:filterKeyword2",
"update:type",
"update:selected",
]);
const updateInput = (value: any) => {
emit("update:filterKeyword2", value);
@ -107,7 +106,7 @@ const updateInputType = (value: any) => {
};
//รีเซ็ตค่าในช่องค้นหา
const Reset = () => {
emit("update:filterKeyword2", "");
emit("update:filterKeyword2", "");
};
//เปิด modal ยืนยัน
const clickAddlist = () => {
@ -117,7 +116,7 @@ const clickAddlist = () => {
//อัพเดต ส่งไปออกคำสั่ง
const addOther = async () => {
let pId: string[] = [];
let Type = props.type as string
let Type = props.type as string;
selected.value.forEach((e: any) => {
pId.push(e.personalId);
});
@ -136,7 +135,7 @@ const addOther = async () => {
.finally(() => {
props.fecthlistOthet?.();
selected.value = [];
props.clickClose?.()
props.clickClose?.();
});
};
watchEffect(() => {
@ -144,6 +143,23 @@ watchEffect(() => {
selected.value = [];
}
});
// filter OptionsType
const OptionsTypeFn = ref<any>([]);
function filterFnOptionsType(val: string, update: any) {
if (val == "") {
update(() => {
OptionsTypeFn.value = props.optionsType;
});
} else {
update(() => {
if (props.optionsType) {
OptionsTypeFn.value = props.optionsType.filter(
(e: any) => e.name.search(val) !== -1
);
}
});
}
}
</script>
<template>
@ -160,14 +176,23 @@ watchEffect(() => {
dense
:model-value="type"
@update:model-value="updateInputType"
:options="optionsType"
:options="OptionsTypeFn"
label="ประเภทคำสั่ง"
style="width: 400px; max-width: auto"
emit-value
map-options
option-label="name"
option-value="id"
/>
use-input
@filter="filterFnOptionsType"
><template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไม่มีข้อมูล
</q-item-section>
</q-item>
</template>
</q-select>
</q-toolbar>
</div>
<div class="col-5">
@ -232,7 +257,6 @@ watchEffect(() => {
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>
<q-checkbox
keep-color
color="primary"

12
src/modules/05_placement/components/Other/Main.vue
View file

@ -150,9 +150,19 @@ const fecthlistOthet = async () => {
status: r.status ?? "-",
statustext: statusText(r.status ?? ""),
fullname: `${r.prefix ?? ""}${r.firstname ?? ""} ${r.lastname ?? ""}`,
amountOld: r.amountOld,
positionDate: r.positionDate,
}));
rows2.value = rows.value.filter(
(e: listMain) => e.status !== "REPORT" && e.status !== "DONE"
(e: listMain) =>
e.status !== "REPORT" &&
e.status !== "DONE" &&
e.organizationPositionOld &&
e.positionTypeOld &&
e.positionLevelOld &&
e.positionNumberOld &&
e.amountOld !== null &&
e.positionDate
);
})
.catch((e) => {

308
src/modules/05_placement/components/Receive/receiveMain.vue
View file

@ -52,8 +52,15 @@ const popup = () => {
(r.status == "WAITTING" ||
r.status == "PENDING" ||
r.status == "APPROVE") &&
r.positionNumber != null
r.positionNumber != null &&
r.educationOld &&
r.organizationPositionOld &&
r.positionTypeOld &&
r.positionLevelOld &&
r.positionNumberOld &&
r.amountOld !== null
);
rows2.value = row;
modal.value = true;
};
@ -147,27 +154,28 @@ const columns = ref<QTableProps["columns"]>([
},
]);
//save file
//save file
const SaveData = async () => {
myForm.value.validate().then((result: boolean) => {
if (result) {
const formData = new FormData();
formData.append("File", files.value);
showLoader();
http
.put(config.API.receiveFile(personalId.value), formData)
.then(() => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await clickCloseUpload();
hideLoader();
});
}})};
const formData = new FormData();
formData.append("File", files.value);
showLoader();
http
.put(config.API.receiveFile(personalId.value), formData)
.then(() => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await clickCloseUpload();
hideLoader();
});
}
});
};
const fecthlistRecevice = async () => {
showLoader();
@ -175,6 +183,7 @@ const fecthlistRecevice = async () => {
.get(config.API.receiveData())
.then((res: any) => {
const response = res.data.result;
listRecevice.value = response;
let list: ResponseRow[] = [];
response.map((e: ResponseData) => {
@ -194,12 +203,23 @@ const fecthlistRecevice = async () => {
organizationShortName: e.organizationShortName,
positionNumber: e.positionNumber,
positionPath: e.positionPath,
birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth) &&
e.dateOfBirth.toString() === "0001-01-01T00:00:00" ? "-" : date2Thai(e.dateOfBirth),
birthday:
e.dateOfBirth == null
? "-"
: date2Thai(e.dateOfBirth) &&
e.dateOfBirth.toString() === "0001-01-01T00:00:00"
? "-"
: date2Thai(e.dateOfBirth),
status: e.status,
statusText: statusText(e.status ?? ""),
createdAt: e.createdAt !== null ? new Date(e.createdAt) : null,
dateText: e.createdAt !== null ? date2Thai(e.createdAt) : "-",
educationOld: e.educationOld ?? "",
organizationPositionOld: e.organizationPositionOld ?? "",
positionTypeOld: e.positionTypeOld,
positionLevelOld: e.positionLevelOld,
positionNumberOld: e.positionNumberOld,
amountOld: e.amountOld,
});
});
rows.value = list;
@ -231,7 +251,7 @@ const clickClose = () => {
// ปิดโมเดลอัปเดตไฟล์
const clickCloseUpload = () => {
modalupload.value = false;
files.value = null
files.value = null;
};
// ปิดโมเดลโครงสร้าง
const openModalTree = (id: string) => {
@ -292,26 +312,62 @@ onMounted(() => {
<q-btn flat round color="primary" @click="add" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
</q-btn>
<q-btn size="14px" flat round color="add" icon="mdi-account-arrow-right" @click="popup()" >
<q-btn
size="14px"
flat
round
color="add"
icon="mdi-account-arrow-right"
@click="popup()"
>
<q-tooltip>ส่งไปออกคำสั่งรับโอน</q-tooltip>
</q-btn>
<q-space />
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword"
ref="filterRef" outlined debounce="300" placeholder="ค้นหา" >
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</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="col-xs-12 col-sm-3 col-md-2 q-ml-sm" />
<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="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
/>
</div>
<div class="col-12 q-pt-sm">
<d-table :columns="columns" :rows="rows" :filter="filterKeyword" row-key="fullname"
:visible-columns="visibleColumns" >
<d-table
:columns="columns"
:rows="rows"
:filter="filterKeyword"
row-key="fullname"
: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">
@ -322,25 +378,60 @@ onMounted(() => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props" @click="nextPage(props.row.personalId)">
<q-td
key="no"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="citizenId" :props="props" @click="nextPage(props.row.personalId)" >
<q-td
key="citizenId"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.citizenId }}
</q-td>
<q-td key="fullname" :props="props" @click="nextPage(props.row.personalId)" >
<q-td
key="fullname"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.fullname }}
</q-td>
<q-td key="organizationName" :props="props" @click="nextPage(props.row.personalId)" >
<div v-if=" props.row.orgName !== null || props.row.positionPath !== null " >
<q-td
key="organizationName"
:props="props"
@click="nextPage(props.row.personalId)"
>
<div
v-if="
props.row.orgName !== null ||
props.row.positionPath !== null
"
>
<div class="col-4">
<div class="text-weight-medium">
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
{{ props.row.organizationShortName !== null ? `(${props.row.organizationShortName})` : "" }}
{{
props.row.orgName !== null ? props.row.orgName : "-"
}}
{{
props.row.organizationShortName !== null
? `(${props.row.organizationShortName})`
: ""
}}
</div>
<div class="text-weight-light">
{{ props.row.positionPath !== null ? props.row.positionPath : "-" }}
{{ props.row.positionNumber !== null ? `(${props.row.positionNumber})` : "" }}
{{
props.row.positionPath !== null
? props.row.positionPath
: "-"
}}
{{
props.row.positionNumber !== null
? `(${props.row.positionNumber})`
: ""
}}
</div>
</div>
</div>
@ -350,46 +441,119 @@ onMounted(() => {
</div>
</div>
</q-td>
<q-td key="birthday" :props="props" @click="nextPage(props.row.personalId)" >
<q-td
key="birthday"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.birthday }}
</q-td>
<q-td key="dateText" :props="props" @click="nextPage(props.row.personalId)" >
<q-td
key="dateText"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.dateText }}
</q-td>
<q-td key="statusText" :props="props" @click="nextPage(props.row.personalId)" >
<q-td
key="statusText"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.statusText }}
</q-td>
<q-td auto-width>
<q-btn icon="mdi-dots-vertical" size="12px" color="grey-7"
flat round dense >
<q-menu transition-show="jump-down" transition-hide="jump-up" >
<q-btn
icon="mdi-dots-vertical"
size="12px"
color="grey-7"
flat
round
dense
>
<q-menu
transition-show="jump-down"
transition-hide="jump-up"
>
<q-list dense style="min-width: 100px">
<q-item clickable v-close-popup @click="openModalTree(props.row.personalId)"
:disable=" props.row.status == 'REPORT' || props.row.status == 'DONE' " >
<q-item-section style="min-width: 0px" avatar class="q-py-sm" >
<q-icon :color=" props.row.status == 'REPORT' || props.row.status == 'DONE' ? 'grey' : 'primary' "
size="xs" name="mdi-bookmark-outline" />
<q-item
clickable
v-close-popup
@click="openModalTree(props.row.personalId)"
:disable="
props.row.status == 'REPORT' ||
props.row.status == 'DONE'
"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-icon
:color="
props.row.status == 'REPORT' ||
props.row.status == 'DONE'
? 'grey'
: 'primary'
"
size="xs"
name="mdi-bookmark-outline"
/>
</q-item-section>
<q-item-section
>เลือกหน่วยงานที่รับโอน</q-item-section
>
</q-item>
<q-item clickable v-close-popup
@click="openUpload(props.row.personalId)" :disable=" props.row.status == 'REPORT' || props.row.status == 'DONE' ">
<q-item-section style="min-width: 0px" avatar class="q-py-sm" >
<q-icon size="xs" name="attach_file"
:color=" props.row.status == 'REPORT' || props.row.status == 'DONE' ? 'grey' : 'blue' " />
<q-item
clickable
v-close-popup
@click="openUpload(props.row.personalId)"
:disable="
props.row.status == 'REPORT' ||
props.row.status == 'DONE'
"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-icon
size="xs"
name="attach_file"
:color="
props.row.status == 'REPORT' ||
props.row.status == 'DONE'
? 'grey'
: 'blue'
"
/>
</q-item-section>
<q-item-section>อัปโหลดเอกสาร</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="openDelete(props.row.personalId)"
:disable=" props.row.status == 'REPORT' || props.row.status == 'DONE' " >
<q-item-section style="min-width: 0px" avatar class="q-py-sm" >
<q-item
clickable
v-close-popup
@click="openDelete(props.row.personalId)"
:disable="
props.row.status == 'REPORT' ||
props.row.status == 'DONE'
"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
<q-icon
:color="
props.row.status == 'REPORT' ||
props.row.status == 'DONE' ? 'grey' : 'red' "
props.row.status == 'DONE'
? 'grey'
: 'red'
"
size="xs"
name="mdi-delete"
/>
@ -423,8 +587,18 @@ onMounted(() => {
<q-card-section class="q-py-sm">
<div class="col-12 row items-center q-col-gutter-sm">
<div class="col-12">
<q-file ref="myForm" outlined dense v-model="files" label="อัปโหลดเอกสาร" lazy-rules
:rules="[(val) => val || 'กรุณาเลือกไฟล์หนังสือถึงหน่วยงานที่รับโอน']" hide-bottom-space >
<q-file
ref="myForm"
outlined
dense
v-model="files"
label="อัปโหลดเอกสาร"
lazy-rules
:rules="[
(val) => val || 'กรุณาเลือกไฟล์หนังสือถึงหน่วยงานที่รับโอน',
]"
hide-bottom-space
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
@ -435,7 +609,13 @@ onMounted(() => {
<q-separator />
<div class="row q-px-sm q-py-xs">
<q-space />
<q-btn flat round color="public" @click="SaveData()" icon="mdi-content-save-outline" >
<q-btn
flat
round
color="public"
@click="SaveData()"
icon="mdi-content-save-outline"
>
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>

138
src/modules/05_placement/components/Repatriate/RepatriateMain.vue
View file

@ -155,9 +155,17 @@ const openModalOrder = () => {
openModal();
const row = rows.value.filter(
(item: officerType) =>
item.status == "WAITTING" ||
item.status == "PENDING" ||
item.status == "APPROVE"
(item.status == "WAITTING" ||
item.status == "PENDING" ||
item.status == "APPROVE") &&
item.organizationPositionOld &&
item.positionTypeOld &&
item.positionLevelOld &&
item.positionNumberOld &&
item.salary !== null &&
item.organization &&
item.date &&
item.dateRepatriation
);
rows2.value = row;
};
@ -187,6 +195,7 @@ const getData = async () => {
positionNumberOld: item.positionNumberOld,
organizationPositionOld: item.organizationPositionOld,
isActive: item.isActive,
dateRepatriation: item.dateRepatriation,
}));
})
.catch((e) => {})
@ -224,26 +233,63 @@ onMounted(async () => {
<q-separator />
<div class="row q-pa-md">
<div class="col-12">
<div class="row col-12">
<q-btn flat round size="14px" color="add" icon="mdi-account-arrow-right" @click="openModalOrder" >
<q-btn
flat
round
size="14px"
color="add"
icon="mdi-account-arrow-right"
@click="openModalOrder"
>
<q-tooltip>ส่งไปออกคำสั่งส่งตัวกลับ</q-tooltip>
</q-btn>
<q-space />
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef"
outlined debounce="300" placeholder="ค้นหา" >
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select class="col-xs-12 col-sm-3 col-md-2 q-ml-sm" 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" />
<q-select
class="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
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>
<div class="col-12 q-pt-sm">
<d-table :columns="columns" :rows="rows" :filter="filterKeyword" row-key="id" :visible-columns="visibleColumns" >
<d-table
:columns="columns"
:rows="rows"
:filter="filterKeyword"
row-key="id"
: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">
@ -252,45 +298,89 @@ onMounted(async () => {
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props" @click="openDetail(props.row.id)">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="fullname" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="fullname"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.fullname }}
</q-td>
<q-td key="posNo" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="posNo"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.posNo }}
</q-td>
<q-td key="position" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="position"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.position }}
</q-td>
<q-td key="positionLevel" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="positionLevel"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.positionLevel }}
</q-td>
<q-td key="organizationPositionOld" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="organizationPositionOld"
:props="props"
@click="openDetail(props.row.id)"
>
<div class="table_ellipsis">
{{ props.row.organizationPositionOld }}
</div>
</q-td>
<q-td key="organization" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="organization"
:props="props"
@click="openDetail(props.row.id)"
>
<div class="table_ellipsis">
{{ props.row.organization }}
</div>
</q-td>
<q-td key="createdAt" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="createdAt"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.createdAt }}
</q-td>
<q-td key="statusText" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="statusText"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.statusText }}
</q-td>
<q-td auto-width>
<q-btn icon="delete" size="14px" flat round dense
:color="props.row.status == 'REPORT' || props.row.status == 'DONE' ? 'grey' : 'red-7'"
<q-btn
icon="delete"
size="14px"
flat
round
dense
:color="
props.row.status == 'REPORT' || props.row.status == 'DONE'
? 'grey'
: 'red-7'
"
@click="clickDelete(props.row.fullname, props.row.id)"
:disable="props.row.status == 'REPORT' || props.row.status == 'DONE'" >
:disable="
props.row.status == 'REPORT' || props.row.status == 'DONE'
"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>

22
src/modules/05_placement/components/Transfer/transferMain.vue
View file

@ -26,7 +26,7 @@ const rows = ref<ResponseData[]>([]);
const rows2 = ref<ResponseData[]>([]);
const filters = ref<ResponseData[]>([]);
//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
const visibleColumns = ref<string[]>([
"no",
"fullname",
@ -135,20 +135,30 @@ const columns = ref<QTableProps["columns"]>([
},
]);
const openModal = () => (modal.value = true);
const closeModal = () => {
modal.value = false
filterKeyword2.value = ""
modal.value = false;
filterKeyword2.value = "";
};
// เปิดโมเดล
const openModalOrder = () => {
console.log(filters.value);
openModal();
const row = filters.value.filter(
(r: ResponseData) =>
r.status == "WAITTING" || r.status == "PENDING" || r.status == "APPROVE"
(r.status == "WAITTING" ||
r.status == "PENDING" ||
r.status == "APPROVE") &&
r.createdAt &&
r.organizationPositionOld &&
r.positionTypeOld &&
r.positionLevel &&
r.posNo &&
r.salary !== null &&
r.organization &&
r.createdAt
);
rows2.value = row;
};

132
src/modules/05_placement/components/helpgovernment/mainHelp.vue
View file

@ -170,16 +170,20 @@ const openDetail = (id: string) => {
};
const openModal = () => (modal.value = true);
const closeModal = () => {
modal.value = false
modal.value = false;
filterKeyword2.value = "";
};
const openModalOrder = () => {
openModal();
const row = rows.value.filter(
(item: officerType) =>
item.status == "WAITTING" ||
item.status == "PENDING" ||
item.status == "APPROVE"
(item.status == "WAITTING" ||
item.status == "PENDING" ||
item.status == "APPROVE") &&
item.organizationPositionOld &&
item.organization &&
item.dateStart &&
item.dateEnd
);
rows2.value = row;
};
@ -213,7 +217,7 @@ const getData = async () => {
}));
})
.catch((e) => {})
.finally(() => {
.finally(() => {
hideLoader();
});
};
@ -246,21 +250,53 @@ onMounted(async () => {
<div class="row q-pa-md">
<div class="col-12">
<div class="row col-12">
<q-btn @click="openModalOrder" size="14px" flat round color="add" icon="mdi-account-arrow-right" >
<q-btn
@click="openModalOrder"
size="14px"
flat
round
color="add"
icon="mdi-account-arrow-right"
>
<q-tooltip>ส่งไปออกคำสั่งช่วยราชการ</q-tooltip>
</q-btn>
<q-space />
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef"
outlined debounce="300" placeholder="ค้นหา" >
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</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="col-xs-12 col-sm-3 col-md-2 q-ml-sm" />
<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="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
/>
</div>
<div class="col-12 q-pt-sm">
@ -291,42 +327,90 @@ onMounted(async () => {
>
{{ props.row.fullname }}
</q-td>
<q-td key="posNo" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="posNo"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.posNo }}
</q-td>
<q-td key="position" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="position"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.position }}
</q-td>
<q-td key="positionLevel" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="positionLevel"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.positionLevel }}
</q-td>
<q-td key="organizationPositionOld" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="organizationPositionOld"
:props="props"
@click="openDetail(props.row.id)"
>
<div class="table_ellipsis">
{{ props.row.organizationPositionOld }}
</div>
</q-td>
<q-td key="organization" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="organization"
:props="props"
@click="openDetail(props.row.id)"
>
<div class="table_ellipsis">
{{ props.row.organization }}
</div>
</q-td>
<q-td key="dateStart" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="dateStart"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.dateStart }}
</q-td>
<q-td key="dateEnd" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="dateEnd"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.dateEnd }}
</q-td>
<q-td key="createdAt" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="createdAt"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.createdAt }}
</q-td>
<q-td key="statusText" :props="props" @click="openDetail(props.row.id)" >
<q-td
key="statusText"
:props="props"
@click="openDetail(props.row.id)"
>
{{ props.row.statusText }}
</q-td>
<q-td auto-width>
<q-btn icon="delete" size="14px" flat round dense
:color=" props.row.status == 'REPORT' || props.row.status == 'DONE' ? 'grey' : 'red-7' "
<q-btn
icon="delete"
size="14px"
flat
round
dense
:color="
props.row.status == 'REPORT' || props.row.status == 'DONE'
? 'grey'
: 'red-7'
"
@click="clickDelete(props.row.fullname, props.row.id)"
:disable=" props.row.status == 'REPORT' || props.row.status == 'DONE' " >
:disable="
props.row.status == 'REPORT' || props.row.status == 'DONE'
"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>

2
src/modules/05_placement/components/probation/MainProbation.vue
View file

@ -393,7 +393,7 @@ function filterFn(val: string, update: any) {
<div class="col-6">
<div class="row">
<q-select
class="col-5 q-mr-sm"
class="col-5 col-sm-3 col-md-8"
v-model="fillter"
label="สถานะ"
dense

163
src/modules/05_placement/interface/response/AppointMent.ts
View file

@ -1,84 +1,105 @@
interface listAppointType {
personalId:string
citizenId:number
fullname:string
organizationName:string
orgName:string
organizationShortName:string
positionNumber:string
positionPath:string
status:string
createdAt:string
birthday:string
personalId: string
citizenId: number
fullname: string
organizationName: string
orgName: string
organizationShortName: string
positionNumber: string
positionPath: string
status: string
createdAt: string
birthday: string
educationOld: string
organizationPositionOld: string
positionTypeOld: string
positionLevelOld: string
positionNumberOld: string
salary: number
positionDate: Date
}
interface resData {
id:string
citizenId:number
prefix:string
firstname:string
lastname:string
organizationName:string
organizationShortName:string
positionNumber:string
positionPath:string
status:string
createdAt:Date
dateOfBirth:Date
id: string
citizenId: number
prefix: string
firstname: string
lastname: string
organizationName: string
organizationShortName: string
positionNumber: string
positionPath: string
status: string
createdAt: Date
dateOfBirth: Date
educationOld: string
organizationPositionOld: string
positionTypeOld: string
positionLevelOld: string
positionNumberOld: string
salary: number
positionDate: Date
}
interface orgFilter{
orgName:string
status:string
interface orgFilter {
orgName: string
status: string
educationOld: string
organizationPositionOld: string
positionTypeOld: string
positionLevelOld: string
positionNumberOld: string
salary: number
positionDate: Date
}
interface appointmentData{
citizenId:string
prefixId?:string
firstname?:string
lastname?:string
interface appointmentData {
citizenId: string
prefixId?: string
firstname?: string
lastname?: string
}
interface UserData {
personalId: string;
citizenId: string;
fullname: string;
organizationName: string ;
orgName: string ;
organizationShortName: string ;
positionNumber: string ;
positionPath: string;
status: string;
createdAt: string;
birthday: string;
}
personalId: string;
citizenId: string;
fullname: string;
organizationName: string;
orgName: string;
organizationShortName: string;
positionNumber: string;
positionPath: string;
status: string;
createdAt: string;
birthday: string;
}
interface ResponseData {
data: {
result: {
citizenId: string
profileId: string;
prefix: string;
firstname: string;
lastname: string;
organizationPositionOld: string;
positionLevelOld: string;
positionTypeOld: string;
status: string;
educationOld: string;
positionNumberOld: string;
salary: number;
reason: string;
positionDate: Date;
avatar: string;
interface ResponseData {
data: {
result: {
citizenId:string
profileId: string;
prefix: string;
firstname: string;
lastname: string;
organizationPositionOld: string;
positionLevelOld: string;
positionTypeOld: string;
status: string;
educationOld: string;
positionNumberOld: string;
salary: number;
reason: string;
positionDate: Date;
avatar: string;
};
};
}
};
}
export type {
listAppointType,
resData,
orgFilter,
appointmentData,
UserData,
ResponseData
listAppointType,
resData,
orgFilter,
appointmentData,
UserData,
ResponseData
}

4
src/modules/05_placement/interface/response/OhterMain.ts
View file

@ -20,6 +20,8 @@ interface listMain {
status: string;
statustext: string;
createdAt: Date;
amountOld: number;
positionDate: Date
}
//ข้อมูลจาก api
interface listMainAPI {
@ -44,6 +46,8 @@ interface listMainAPI {
status: string;
statustext: string;
createdAt: Date;
amountOld: number;
positionDate: Date
}
interface OtherdataInterface {

8
src/modules/05_placement/interface/response/Receive.ts
View file

@ -19,6 +19,13 @@ interface ResponseRow {
statusText: string;
createdAt: Date | null;
dateText: string | null;
educationOld: string
organizationPositionOld: string
positionTypeOld: string
positionLevelOld: string
positionNumberOld: string
amountOld: number
}
interface ResponseData {
@ -55,6 +62,7 @@ interface ResponseData {
recruitDate: Date;
salary: number;
status: string;
amountOld: number
}
export type { ResponseTitle, ResponseData, ResponseRow };

3
src/modules/05_placement/interface/response/officer.ts
View file

@ -19,8 +19,7 @@ interface officerType {
isActive: boolean;
dateEnd: string;
dateStart: string;
dateRepatriation: Date
}
interface ResponseData {
data: {

27
src/modules/05_placement/router.ts
View file

@ -61,6 +61,9 @@ const ReceiveAdd = () =>
//แต่งตั้ง-เลื่อน
const AppointmentMain = () => import("@/modules/05_placement/components/AppointMent/Main.vue");
const AppointmentDetail = () => import("@/modules/05_placement/components/AppointMent/Detail.vue");
//แต่งตั้งลูกจ้างประจำ
const AppointEmployeeMain = () => import("@/modules/05_placement/components/AppointEmployee/Main.vue");
const AppointEmployeeDetail = () => import("@/modules/05_placement/components/AppointEmployee/Detail.vue");
//อื่นๆ
const OtherMain = () => import("@/modules/05_placement/components/Other/Main.vue")
const OthertDetail = () => import("@/modules/05_placement/components/Other/Detail.vue");
@ -306,13 +309,33 @@ export default [
Role: "placement",
},
},
{
path: "appoint-employee",
name: "appoint-employee",
component: AppointEmployeeMain,
meta: {
Auth: true,
Key: [6.9],
Role: "placement",
},
},
{
path: "appoint-employee/detail/:id",
name: "appoint-employee-detail",
component: AppointEmployeeDetail,
meta: {
Auth: true,
Key: [6.9],
Role: "placement",
},
},
{
path: "other",
name: "other",
component: OtherMain,
meta: {
Auth: true,
Key: [6.9],
Key: [6.10],
Role: "placement",
},
}, {
@ -321,7 +344,7 @@ export default [
component: relocation,
meta: {
Auth: true,
Key: [6.9],
Key: [6.10],
Role: "placement",
},
},

2
src/modules/06_retirement/components/resign/Resign.vue
View file

@ -158,7 +158,7 @@ const openModalOrder = () => {
openModal();
const row = filters.value.filter(
(r: ResponseItems) =>
r.status == "PENDING" || r.status == "APPROVE" || r.status == "REJECT"
r.status == "WAITTING" || r.status == "PENDING" || r.status == "APPROVE"
);
rows2.value = row;
};

55
src/modules/06_retirement/views/Main.vue
View file

@ -72,19 +72,17 @@ const columns = ref<QTableProps["columns"]>([
// ข้อมูลตาราง (จำลอง)
const currentYear = new Date().getFullYear();
const rows = ref<resMain[]>([]);
const yearOptions = ref<any[]>([]);
const yearOptions = ref<any>([{ id: "", year: "ทั้งหมด" }]);
onMounted(() => {
filteryear();
onMounted(async () => {
await fetchRetirement(type.value, currentYear);
// await fetchRetirement(type.value, currentYear);
});
// หาปีปัจจุบัน
const filteryear = () => {
yearOptions.value = [{ id: currentYear, name: currentYear + 543 }];
yearOptions.value.push({ id: currentYear, name: currentYear + 543 });
// fiscalyear.value = yearOptions[0].id;
yearOptionsFilter.value = [{ id: currentYear, name: currentYear + 543 }];
yearOptionsFilter.value.push({ id: currentYear, name: currentYear + 543 });
// yearOptions.value.push({ id: currentYear, name: currentYear + 543 });
// yearOptionsFilter.value = [{ id: currentYear, name: currentYear + 543 }];
// yearOptionsFilter.value.push({ id: currentYear, name: currentYear + 543 });
fetchRetirement(type.value, currentYear);
};
// ประกาศเกษียณอายุราชการ
@ -98,7 +96,7 @@ const fetchRetirement = async (type: string, year: any) => {
rows.value = data.map((items: any) => ({
id: items.id,
Date: date2Thai(items.createdAt),
year: items.year,
year: items.year + 543,
retireNumber: items.round,
total: items.total,
round: items.round,
@ -106,6 +104,19 @@ const fetchRetirement = async (type: string, year: any) => {
json: items.json,
document: items.document,
}));
let option: any[] = [];
data.map((items: any) => {
option.push({
id: items.year,
year: (items.year + 543).toString(),
typeReport: typeReportChangeName(items.typeReport), // เปลี่ยนสถานะ
});
});
yearOptions.value = [{ id: 0, year: "ทั้งหมด" }];
yearOptions.value.push(...option);
yearOptionsFilter.value = yearOptions.value;
actionOption.value = rows.value;
rows.value.sort((a, b) => a.round - b.round); // เรียงรอบมากไปน้อย
checkststus(rows.value);
@ -144,10 +155,10 @@ const pagination = ref({
rowsPerPage: 10,
});
const filterSelector = (val: any, update: Function, year: any) => {
const filterSelector = (val: any, update: Function) => {
update(() => {
yearOptions.value = yearOptionsFilter.value.filter(
(v: any) => v.name.valueOf(val.toLowerCase()) > -1
(v: any) => v.year.indexOf(val) > -1
);
});
};
@ -219,18 +230,28 @@ const typeReportChangeName = (val: string) => {
map-options
:options="yearOptions"
option-value="id"
option-label="name"
option-label="year"
lazy-rules
use-input
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn
) "
:hide-dropdown-icon="false"
style="min-width: 150px"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'yearOptions'
) "
/>
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไม่มีข้อมูล
</q-item-section>
</q-item>
</template>
</q-select>
<!-- use-input -->
<div>
<popupAdd

652
src/modules/07_insignia/components/2_Manage/Tab1.vue
View file

@ -347,17 +347,17 @@ const fecthlistperson = async (id: string) => {
const clickAdd = async () => {
dataPerson.id
? await myForm.value!.validate().then((result: boolean) => {
if (result) {
dialogConfirm(
$q,
async () => {
await addlistperson(dataPerson.id);
},
"ยืนยันการเพิ่มรายชื่อคนที่ยื่นขอพระราชทานเครื่องราชฯ",
"ต้องการยืนยันการเพิ่มรายชื่อคนที่ยื่นขอพระราชทานเครื่องราชฯ นี้หรือไม่?"
);
}
})
if (result) {
dialogConfirm(
$q,
async () => {
await addlistperson(dataPerson.id);
},
"ยืนยันการเพิ่มรายชื่อคนที่ยื่นขอพระราชทานเครื่องราชฯ",
"ต้องการยืนยันการเพิ่มรายชื่อคนที่ยื่นขอพระราชทานเครื่องราชฯ นี้หรือไม่?"
);
}
})
: dialogMessageNotify($q, "กรุณาเลือกราชชื่อที่ต้องการเพิ่ม");
};
//เพิ่มราชชื่อข้าราชการ
@ -409,11 +409,17 @@ const downloadFile = (response: any, filename: string) => {
};
// เรียก file รายชื่อข้าราชการสามัญฯ
const downloadFileexcel = async () => {
const findInsigniaId = DataStore.dataInsigniaType.find(
(e: any) => e.name == DataStore.typeinsignia
);
showLoader();
await http
.get(config.API.insigniaDowanload(DataStore.requestId), {
responseType: "blob",
})
.put(config.API.insigniaDowanload(DataStore.requestId), {
profileType:
DataStore.employeeClass == "all" ? null : DataStore.employeeClass,
InsigniaId: DataStore.typeinsignia == "all" ? null : findInsigniaId.id,
}, { responseType: "blob" })
.then(async (res) => {
await downloadFile(
res,
@ -656,33 +662,29 @@ const clickShowWarn = (
const filterSelector = (val: any, update: Function, name: any) => {
update(() => {
const needle = val.toLowerCase();
if (name === 'typeinsigniaOptions') {
DataStore.typeinsignia = ''
typeinsigniaOptions.value = DataStore.typeinsigniaOptions.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
else if(name === 'employeeClassOps'){
DataStore.employeeClass = ''
employeeClassOps.value = DataStore.employeeClassOps.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
else if(name === 'filterOrganizationOP'){
if (name === "typeinsigniaOptions") {
DataStore.typeinsignia = "";
typeinsigniaOptions.value = DataStore.typeinsigniaOptions.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
} else if (name === "employeeClassOps") {
DataStore.employeeClass = "";
employeeClassOps.value = DataStore.employeeClassOps.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
} else if (name === "filterOrganizationOP") {
filterOrganizationOP.value = organizationOptions.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
}
)
}
});
};
const clearInsigniaFilters = (name: string) => {
if (name === "typeinsigniaOptions") {
DataStore.typeinsignia = "all";
typeinsigniaOptions.value = DataStore.typeinsigniaOptions;
} else if (name === 'employeeClassOps') {
} else if (name === "employeeClassOps") {
DataStore.employeeClass = "all";
employeeClassOps.value = DataStore.employeeClassOps;
}
@ -693,221 +695,100 @@ const clearInsigniaFilters = (name: string) => {
<div class="col-12 row q-pa-md">
<div class="row col-12">
<div class="row col-12 q-col-gutter-sm">
<q-select
class="col-4"
v-if="roleDataStore.adminRole"
v-model="organization"
label="หน่วยงาน"
dense
emit-value
map-options
:options="filterOrganizationOP"
option-value="id"
option-label="name"
lazy-rules
use-input
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
style="min-width: 150px"
@update:model-value="changtypeOc"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterOrganizationOP'
) "
/>
<q-select
class="col-1"
v-model="DataStore.typeinsignia"
label="ประเภทเครื่องราชฯ ที่ยืนขอ"
dense
emit-value
map-options
:options="typeinsigniaOptions"
option-value="id"
option-label="name"
lazy-rules
hide-bottom-space
use-input
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
style="min-width: 180px"
@update:model-value="
<q-select class="col-4" v-if="roleDataStore.adminRole" v-model="organization" label="หน่วยงาน" dense emit-value
map-options :options="filterOrganizationOP" option-value="id" option-label="name" lazy-rules use-input
hide-bottom-space :readonly="false" :borderless="false" :outlined="true" :hide-dropdown-icon="false"
style="min-width: 150px" @update:model-value="changtypeOc" @filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'filterOrganizationOP'
)" />
<q-select class="col-1" v-model="DataStore.typeinsignia" label="ประเภทเครื่องราชฯ ที่ยืนขอ" dense emit-value
map-options :options="typeinsigniaOptions" option-value="id" option-label="name" lazy-rules hide-bottom-space
use-input :readonly="false" :borderless="false" :outlined="true" :hide-dropdown-icon="false"
style="min-width: 180px" @update:model-value="
DataStore.searchDataTable(
DataStore.typeinsignia,
DataStore.employeeClass
)
"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'typeinsigniaOptions'
) "
>
" @filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'typeinsigniaOptions'
)">
<template v-if="DataStore.typeinsignia !== 'all'" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('typeinsigniaOptions'),
DataStore.searchDataTable(
DataStore.typeinsignia,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
</template>
</q-select>
<div>
<q-select
class="col-2"
v-model="DataStore.employeeClass"
dense
outlined
lazy-rules
hide-bottom-space
:label="`${'สถานภาพ'}`"
emit-value
use-input
map-options
option-label="name"
:options="employeeClassOps"
option-value="id"
:readonly="false"
:borderless="false"
style="min-width: 150px"
@update:model-value="
<q-icon name="cancel" @click.stop.prevent="
clearInsigniaFilters('typeinsigniaOptions'),
DataStore.searchDataTable(
DataStore.typeinsignia,
DataStore.employeeClass
)
"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'employeeClassOps'
) "
>
" class="cursor-pointer" />
</template>
</q-select>
<div>
<q-select class="col-2" v-model="DataStore.employeeClass" dense outlined lazy-rules hide-bottom-space
:label="`${'สถานภาพ'}`" emit-value use-input map-options option-label="name" :options="employeeClassOps"
option-value="id" :readonly="false" :borderless="false" style="min-width: 150px" @update:model-value="
DataStore.searchDataTable(
DataStore.typeinsignia,
DataStore.employeeClass
)
" @filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'employeeClassOps'
)">
<template v-if="DataStore.employeeClass !== 'all'" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('employeeClassOps'),
DataStore.searchDataTable(
DataStore.typeinsignia,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
<q-icon name="cancel" @click.stop.prevent="
clearInsigniaFilters('employeeClassOps'),
DataStore.searchDataTable(
DataStore.typeinsignia,
DataStore.employeeClass
)
" class="cursor-pointer" />
</template>
</q-select>
</div>
<div>
<q-btn
size="md"
icon="mdi-download"
flat
round
color="primary"
@click="downloadFileexcel"
>
<q-btn size="md" icon="mdi-download" flat round color="primary" @click="downloadFileexcel">
<q-tooltip>ดาวน์โหลด</q-tooltip>
</q-btn>
<q-btn
size="12px"
flat
round
color="add"
icon="mdi-plus"
@click="clickmodalAdd"
v-if="
(DataStore.isLock == false &&
DataStore.requestStatus == 'st5' &&
roleDataStore.adminRole) ||
checkStatus == true
"
>
<q-btn size="12px" flat round color="add" icon="mdi-plus" @click="clickmodalAdd" v-if="(DataStore.isLock == false &&
DataStore.requestStatus == 'st5' &&
roleDataStore.adminRole) ||
checkStatus == true
">
<q-tooltip>เพิ่ม</q-tooltip>
</q-btn>
</div>
<q-space />
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef" outlined
debounce="300" placeholder="ค้นหา">
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
</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="col-xs-12 col-sm-3 col-md-2"
/>
<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="col-xs-12 col-sm-3 col-md-2" />
</div>
<div class="col-12 q-pt-sm">
<q-table
ref="table"
:columns="columns"
:rows="DataStore.rows"
:filter="filterKeyword"
row-key="name"
flat
bordered
:paging="true"
dense
class="custom-header-table"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<q-table ref="table" :columns="columns" :rows="DataStore.rows" :filter="filterKeyword" row-key="name" flat
bordered :paging="true" dense class="custom-header-table" :visible-columns="visibleColumns"
:pagination-label="paginationLabel" v-model:pagination="pagination">
<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></q-th>
<q-th
auto-width
v-if="
(DataStore.isLock == false &&
DataStore.requestStatus == 'st5') ||
checkStatus == true
"
/>
<q-th auto-width v-if="(DataStore.isLock == false &&
DataStore.requestStatus == 'st5') ||
checkStatus == true
" />
<q-th v-else></q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr
:props="props"
class="cursor-pointer"
@click.stop="nextPage(props.row.profileId)"
>
<q-tr :props="props" class="cursor-pointer" @click.stop="nextPage(props.row.profileId)">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
@ -942,112 +823,50 @@ const clearInsigniaFilters = (name: string) => {
{{ props.row.dateSend }}
</q-td>
<q-td key="note" class="text-center">
<q-btn
v-if="props.row.reason"
icon="mdi-information-outline"
size="12px"
color="blue"
flat
round
dense
@click.stop="clickShowreson(props.row.name, props.row.reason)"
>
<q-btn v-if="props.row.reason" icon="mdi-information-outline" size="12px" color="blue" flat round dense
@click.stop="clickShowreson(props.row.name, props.row.reason)">
<q-tooltip>หมายเหตุ</q-tooltip>
</q-btn>
</q-td>
<q-td key="warn" class="text-center" v-if="props.row.statusMark">
<q-btn
icon="mdi-information-outline"
size="12px"
color="red"
flat
round
dense
@click.stop="
clickShowWarn(
props.row.markDiscipline,
props.row.markLeave,
props.row.markRate
)
"
>
<q-tooltip>แจ้งเตือน</q-tooltip></q-btn
>
<q-btn icon="mdi-information-outline" size="12px" color="red" flat round dense @click.stop="
clickShowWarn(
props.row.markDiscipline,
props.row.markLeave,
props.row.markRate
)
">
<q-tooltip>แจ้งเตือน</q-tooltip></q-btn>
</q-td>
<q-td v-else auto-width></q-td>
<q-td
v-close-popup
auto-width
v-if="
(DataStore.isLock == false &&
DataStore.requestStatus == 'st5' &&
roleDataStore.adminRole) ||
checkStatus == true
"
>
<q-btn
v-if="
roleDataStore.adminRole ||
(roleDataStore.insignia1Role &&
(requestStatus == 'st1' || requestStatus == 'st4'))
"
icon="mdi-dots-vertical"
size="12px"
color="grey-7"
flat
round
dense
@click.stop
>
<q-td v-close-popup auto-width v-if="(DataStore.isLock == false &&
DataStore.requestStatus == 'st5' &&
roleDataStore.adminRole) ||
checkStatus == true
">
<q-btn v-if="roleDataStore.adminRole ||
(roleDataStore.insignia1Role &&
(requestStatus == 'st1' || requestStatus == 'st4'))
" icon="mdi-dots-vertical" size="12px" color="grey-7" flat round dense @click.stop>
<q-menu transition-show="jump-down" transition-hide="jump-up">
<q-list dense style="min-width: 250px">
<q-item
clickable
@click.stop="clickmodalEdit(props.row)"
v-close-popup
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-item clickable @click.stop="clickmodalEdit(props.row)" v-close-popup>
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-tooltip>แก้ไขเครื่องราชฯ ที่ยื่นขอ</q-tooltip>
<q-icon color="primary" size="xs" name="mdi-pencil" />
</q-item-section>
<q-item-section
>แก้ไขเครื่องราชฯ ที่ยื่นขอ</q-item-section
>
<q-item-section>แก้ไขเครื่องราชฯ ที่ยื่นขอ</q-item-section>
</q-item>
<q-item
clickable
@click.stop="clickReject(props.row.id)"
v-close-popup
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-item clickable @click.stop="clickReject(props.row.id)" v-close-popup>
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-tooltip>ไม่ยื่นขอ</q-tooltip>
<q-icon
color="blue"
size="xs"
name="mdi-alert-circle-outline"
/>
<q-icon color="blue" size="xs" name="mdi-alert-circle-outline" />
</q-item-section>
<q-item-section>ไม่ยื่นขอ</q-item-section>
</q-item>
<q-item
clickable
@click.stop="clickDelete(props.row.id)"
v-close-popup
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-item clickable @click.stop="clickDelete(props.row.id)" v-close-popup>
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-tooltip>ลบออก</q-tooltip>
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
@ -1058,30 +877,16 @@ const clearInsigniaFilters = (name: string) => {
</q-btn>
</q-td>
<q-td v-else auto-width></q-td>
<q-td
auto-width
v-if="props.row.insigniaSend == 'เหรียญจักรพรรดิมาลา'"
>
<btnDownloadFile
:profileId="props.row.profileId"
:round="DataStore.roundId"
:optionRound="DataStore.optionRound"
/>
<q-td auto-width v-if="props.row.insigniaSend == 'เหรียญจักรพรรดิมาลา'">
<btnDownloadFile :profileId="props.row.profileId" :round="DataStore.roundId"
:optionRound="DataStore.optionRound" />
</q-td>
<q-td v-else auto-width></q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="primary"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
<q-pagination v-model="pagination.page" active-color="primary" color="primary" :max="scope.pagesNumber"
:max-pages="5" size="sm" boundary-links direction-links></q-pagination>
</template>
</q-table>
</div>
@ -1093,14 +898,8 @@ const clearInsigniaFilters = (name: string) => {
<q-toolbar class="q-py-md">
<q-toolbar-title class="text-h6">เพิ่มรายชื่อ </q-toolbar-title>
<q-btn
icon="close"
unelevated
round
dense
@click="modalAdd = false"
style="color: #ff8080; background-color: #ffdede"
/>
<q-btn icon="close" unelevated round dense @click="modalAdd = false"
style="color: #ff8080; background-color: #ffdede" />
</q-toolbar>
<q-separator />
<q-card-section class="q-pa-sm bg-grey-1">
@ -1109,49 +908,24 @@ const clearInsigniaFilters = (name: string) => {
<q-card flat bordered class="fit q-pa-sm">
<q-toolbar style="padding: 0">
<q-space />
<q-input
borderless
outlined
dense
debounce="300"
placeholder="ค้นหา"
v-model="filterKeyword2"
>
<q-input borderless outlined dense debounce="300" placeholder="ค้นหา" v-model="filterKeyword2">
<template v-slot:append>
<q-icon name="search" />
</template>
</q-input>
</q-toolbar>
<q-table
flat
bordered
dense
:rows="rows2"
:columns="columns2"
:filter="filterKeyword2"
row-key="fullname"
class="custom-header-table"
:pagination-label="paginationLabel2"
v-model:pagination="pagination2"
>
<q-table flat bordered dense :rows="rows2" :columns="columns2" :filter="filterKeyword2" row-key="fullname"
class="custom-header-table" :pagination-label="paginationLabel2" v-model:pagination="pagination2">
<template v-slot:header="props">
<q-tr :props="props">
<q-th
v-for="col in props.cols"
:key="col.name"
: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"
:class="{ 'text-primary': props.row.id === dataPerson.id }"
@click="selectPerson(props.row)"
>
<q-tr :props="props" class="cursor-pointer" :class="{ 'text-primary': props.row.id === dataPerson.id }"
@click="selectPerson(props.row)">
<q-td style="width: 75px">{{ props.rowIndex + 1 }}</q-td>
<q-td style="width: 250px" key="citizenId" :props="props">
{{ props.row.citizenId }}
@ -1162,15 +936,8 @@ const clearInsigniaFilters = (name: string) => {
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination2.page"
color="primary"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
<q-pagination v-model="pagination2.page" color="primary" :max="scope.pagesNumber" :max-pages="5"
size="sm" boundary-links direction-links></q-pagination>
</template>
</q-table>
</q-card>
@ -1181,71 +948,28 @@ const clearInsigniaFilters = (name: string) => {
<div class="q-pa-md">
<div class="row q-gutter-sm">
<div class="col-12">
<q-input
borderless
outlined
dense
label="ตำแหน่งในสายงาน"
placeholder="ตำแหน่งในสายงาน"
v-model="dataPerson.position"
readonly
/>
<q-input borderless outlined dense label="ตำแหน่งในสายงาน" placeholder="ตำแหน่งในสายงาน"
v-model="dataPerson.position" readonly />
</div>
<div class="col-12">
<q-input
borderless
outlined
dense
label="สังกัด"
placeholder="สังกัด"
v-model="dataPerson.organizationOrganization"
readonly
/>
<q-input borderless outlined dense label="สังกัด" placeholder="สังกัด"
v-model="dataPerson.organizationOrganization" readonly />
</div>
<div class="col-12">
<q-input
borderless
outlined
dense
label="ระดับ"
placeholder="ระดับ "
v-model="dataPerson.level"
readonly
/>
<q-input borderless outlined dense label="ระดับ" placeholder="ระดับ " v-model="dataPerson.level"
readonly />
</div>
<div class="col-12">
<q-select
v-model="insigniaType"
label="ประเภทเครื่องราชฯ"
dense
emit-value
map-options
:options="insigniaOptions"
option-value="id"
option-label="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
:rules="[
<q-select v-model="insigniaType" label="ประเภทเครื่องราชฯ" dense emit-value map-options
:options="insigniaOptions" option-value="id" option-label="name" lazy-rules hide-bottom-space
:readonly="false" :borderless="false" :outlined="true" :hide-dropdown-icon="false" :rules="[
(val) => !!val || `กรุณาเลือกประเภทเครื่องราช`,
]"
/>
]" />
</div>
<div class="col-12">
<q-input
type="textarea"
class="full-width inputgreen cursor-pointer"
hide-bottom-space
outlined
dense
lazy-rules
:rules="[(val) => !!val || `กรุณากรอกหมายเหตุ`]"
v-model="reason"
:label="`หมายเหตุ`"
/>
<q-input type="textarea" class="full-width inputgreen cursor-pointer" hide-bottom-space outlined
dense lazy-rules :rules="[(val) => !!val || `กรุณากรอกหมายเหตุ`]" v-model="reason"
:label="`หมายเหตุ`" />
</div>
</div>
</div>
@ -1267,42 +991,18 @@ const clearInsigniaFilters = (name: string) => {
<q-dialog v-model="modalEdit" persistent>
<q-card style="width: 450px; max-width: 80vw">
<q-form ref="myForm">
<DialogHeader
tittle="แก้ไขเครื่องราชฯ ที่ยื่นขอ"
:close="closeModalEdit"
/>
<DialogHeader tittle="แก้ไขเครื่องราชฯ ที่ยื่นขอ" :close="closeModalEdit" />
<q-separator />
<q-card-section class="q-pa-sm bg-grey-1">
<div class="row col-12 q-py-md">
<q-select
v-model="insignia"
label="ชื่อเครื่องราชฯ"
dense
emit-value
map-options
:options="insigniaOptions"
option-value="id"
option-label="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
style="width: 100%"
/>
<q-select v-model="insignia" label="ชื่อเครื่องราชฯ" dense emit-value map-options :options="insigniaOptions"
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
:outlined="true" :hide-dropdown-icon="false" style="width: 100%" />
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="clickSave"
class="q-px-md"
>
<q-btn dense unelevated label="บันทึก" color="public" @click="clickSave" class="q-px-md">
<!-- icon="mdi-content-save-outline" -->
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
@ -1312,59 +1012,27 @@ const clearInsigniaFilters = (name: string) => {
</q-dialog>
<!-- popup เหตุผลไม่ยื่นขอ -->
<DialogPopupReason
:modal="modelPopupReject"
title="เหตุผลการไม่ยื่นขอ"
label="หมายเหตุ"
:click-close="closemodelPopupReject"
:savaForm="savaReasonReject"
/>
<DialogPopupReason :modal="modelPopupReject" title="เหตุผลการไม่ยื่นขอ" label="หมายเหตุ"
:click-close="closemodelPopupReject" :savaForm="savaReasonReject" />
<!-- เหตุผลที่ลบออก -->
<DialogPopupReason
:modal="modelPopupDelete"
title="เหตุผลการลบออก"
label="หมายเหตุ"
:click-close="closemodelPopupDelete"
:savaForm="savaReasonDelete"
/>
<DialogPopupReason :modal="modelPopupDelete" title="เหตุผลการลบออก" label="หมายเหตุ"
:click-close="closemodelPopupDelete" :savaForm="savaReasonDelete" />
<!-- หมายเหตุ -->
<DialogInformation
:modal="dialogNote"
:title="dialogTitle"
:desc="dialogDesc"
:click-close="clickCloseReson"
/>
<DialogInformation :modal="dialogNote" :title="dialogTitle" :desc="dialogDesc" :click-close="clickCloseReson" />
<!-- แจ้งเตือน -->
<q-dialog v-model="dialogWarn">
<q-card style="width: 800px; max-width: 80vw">
<q-toolbar class="q-py-md">
<q-toolbar-title class="text-h6">แจ้งเตือน </q-toolbar-title>
<q-btn
icon="close"
unelevated
round
dense
v-close-popup
style="color: #ff8080; background-color: #ffdede"
/>
<q-btn icon="close" unelevated round dense v-close-popup style="color: #ff8080; background-color: #ffdede" />
</q-toolbar>
<q-separator />
<div class="q-pa-md">
<div class="q-gutter-sm">
<q-item
tag="label"
v-ripple
v-for="list in checkboxData"
:key="list.id"
>
<q-item tag="label" v-ripple v-for="list in checkboxData" :key="list.id">
<q-item-section avatar>
<q-checkbox
v-model="list.val"
:val="`${list.id}`"
color="teal"
disable
/>
<q-checkbox v-model="list.val" :val="`${list.id}`" color="teal" disable />
<!-- <q-radio v-model="checkboxList" :val="list.id" color="teal" /> -->
</q-item-section>
<q-item-section>

17
src/modules/07_insignia/components/2_Manage/listManage.vue
View file

@ -40,6 +40,7 @@ const modalPopupBackToEdit = ref<boolean>(false); //model แก้ไข
onMounted(async () => {
tab.value = DataStore.mainTab;
await fecthlistRound();
DataStore.dataInsigniaType.length === 0 && (await fecthInsignia());
});
//เรียกรอบการเสนอขอพระราชทานเครื่อง
@ -123,6 +124,18 @@ const fecthType = async () => {
messageError($q, err);
});
};
// เรียกประเภทเครื่องราช
const fecthInsignia = async () => {
await http
.get(config.API.insignia)
.then((res) => {
let data = res.data.result;
DataStore.fetchInsigniaType(data);
})
.catch((err) => {
messageError($q, err);
});
};
//เลือกรอบการแสดง
const changround = async () => {
@ -436,7 +449,7 @@ const uploadFile = async (event: any) => {
<q-card flat bordered class="col-12 q-mt-sm" v-if="loading">
<div
v-if="roleDataStore.insignia1Role && requestStatus == 'st4'"
v-if="(roleDataStore.insignia1Role && requestStatus == 'st4') || (roleDataStore.insignia2Role && requestStatus == 'st5')"
class="q-pa-md q-gutter-sm"
>
<q-banner
@ -568,7 +581,7 @@ const uploadFile = async (event: any) => {
@click="sendToDirector"
/>
<q-btn
v-if="roleDataStore.insignia2Role && requestStatus == 'st3'"
v-if="roleDataStore.insignia2Role && (requestStatus == 'st3' || requestStatus == 'st5')"
dense
unelevated
label="ตีกลับ"

20
src/modules/07_insignia/components/3_result/DialogForm.vue
View file

@ -40,7 +40,7 @@ const affiliationReceived = ref<string>("");
const receivedate = ref<Date | null>();
const announceDate = ref<Date | null>();
const invoiceDate = ref<Date | null>(null);
const filterinsigniaOp2 = ref<any>(DataStore.insigniaOp2)
const employeeClass = ref<string>("");
const employeeClassOps = ref<DataOption[]>([
{ id: "officer", name: "ข้าราชการ กทม.สามัญ" },
@ -276,6 +276,19 @@ const searchcardid = () => {
} else notifyError($q, "ไม่พบข้อมูลเลขบัตรประชาชนนี้");
}
};
const filterSelector = (val: any, update: Function, name: any) => {
update(() => {
const needle = val.toLowerCase();
if (name === 'insigniaOp2') {
brand.value = ''
filterinsigniaOp2.value = DataStore.insigniaOp2.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
}
)
}
</script>
<template>
@ -398,14 +411,17 @@ const searchcardid = () => {
emit-value
map-options
option-label="name"
:options="DataStore.insigniaOp2"
:options="filterinsigniaOp2"
option-value="id"
:readonly="false"
use-input
:borderless="false"
style="min-width: 150px"
:rules="[
(val) => !!val || 'กรุณากรอกชื่อชั้นตราเครื่องราชอิสริยาภรณ์',
]"
@filter="(inputValue:any,doneFn:Function) =>
filterSelector(inputValue, doneFn,'insigniaOp2') "
/>
</div>
<div class="col-xs-12 col-sm-6">

24
src/modules/07_insignia/components/3_result/Dialogbody.vue
View file

@ -124,18 +124,21 @@ onMounted(()=>{
<q-dialog v-model="props.modal" persistent>
<q-card style="min-width: 900px">
<q-toolbar>
<q-toolbar-title v-if="props.fileCheck === null" class="text-subtitle2 text-bold">รับเครื่องราชฯ</q-toolbar-title>
<q-toolbar-title v-else class="text-subtitle2 text-bold">คืนเครื่องราชฯ</q-toolbar-title>
<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">
<div v-if="props.fileCheck === null" class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
<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">
รับเครื่องราชฯ
</div>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="Datereceive" :locale="'th'" autoApply borderless
:enableTimePicker="false" week-start="0">
:enableTimePicker="false" week-start="0" :readonly="fileCheck !== null">
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -145,7 +148,7 @@ onMounted(()=>{
<template #trigger>
<q-input dense borderless outlined lazy-rules :rules="[(val) => !!val || 'กรุณาเลือกวันที่ได้รับ']"
hide-bottom-space :model-value="Datereceive != null ? date2Thai(Datereceive) : undefined
" :label="`${'วันที่ได้รับ'}`" clearable @clear="clearReceiveDate">
" :label="`${'วันที่ได้รับ'}`" clearable @clear="clearReceiveDate" :disable="fileCheck !== null">
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" color="primary">
</q-icon>
@ -158,7 +161,7 @@ onMounted(()=>{
<div class="col-xs-12 col-sm-4">
<q-file outlined dense v-model="files" label="ไฟล์หลักฐานการรับ" lazy-rules
:rules="[(val) => val || 'กรุณาเลือกไฟล์หลักฐานการรับ']" hide-bottom-space>
:rules="[(val) => val || 'กรุณาเลือกไฟล์หลักฐานการรับ']" hide-bottom-space :disable="fileCheck !== null">
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
@ -167,10 +170,15 @@ onMounted(()=>{
<div class="col-xs-12 col-sm-4">
<q-select hide-bottom-space :options="OrgList" dense borderless option-label="name" option-value="id"
emit-value map-options outlined v-model="OrganazationId" lazy-rules :label="`หน่วยงานที่รับ`"
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่รับ']" />
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่รับ']" :disable="fileCheck !== null"/>
</div>
</div>
<div v-if="props.fileCheck !== null" class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-12 q-my-sm"> <q-separator/></div>
<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">
คืนเครื่องราชฯ
</div>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="Datereturn" :locale="'th'" autoApply borderless

26
src/modules/07_insignia/components/4_Allocate/DialogForm.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, watch } from "vue";
import { ref, watch,onMounted } from "vue";
import { QForm, useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import DialogHeader from "@/components/DialogHeader.vue";
@ -14,6 +14,7 @@ const routeName = router.currentRoute.value.name;
const amount = ref<number | null>();
const Org = ref<string | null>("");
const grandCross = ref<string | null>("");
const filterInsigniaOp = ref<any>()
const closeModal = () => {
props.close();
};
@ -41,7 +42,22 @@ watch(props, () => {
amount.value = null;
}
});
watch(() => props.insigniaList, (newVal) => {
filterInsigniaOp.value = newVal;
});
const filterSelector = (val: any, update: Function, name: any) => {
update(() => {
const needle = val.toLowerCase();
if (name === 'filterInsigniaOp') {
grandCross.value = null
filterInsigniaOp.value = props.insigniaList.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
}
)
}
const clickSave = () => {
if (myForm.value !== null) {
myForm.value.validate().then(async (success) => {
@ -67,12 +83,14 @@ const clickSave = () => {
<div class="col-6">
<q-select
hide-bottom-space
:options="insigniaList"
:options="filterInsigniaOp"
dense
borderless
use-input
lazy-rules
option-label="name"
option-value="id"
emit-value
emit-valuez
map-options
outlined
options-cover
@ -83,6 +101,8 @@ const clickSave = () => {
? `เครื่องราชฯ`
: `เลือกหน่วยงาน`
"
@filter="(inputValue:any,doneFn:Function) =>
filterSelector(inputValue, doneFn,'filterInsigniaOp') "
/>
</div>
<div class="col-xs-12 col-sm-6">

2
src/modules/07_insignia/components/4_Allocate/Main.vue
View file

@ -176,7 +176,7 @@ watch(tab, () => {
if (!a) {
DataStore.insignia = "";
}
filterInsigniaOp.value = insigniaOp.value
filterInsigniaOp.value = insigniaOp.value
fecthlistInsignia();
});

60
src/modules/07_insignia/components/5_Borrow/DialogForm.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, watch } from "vue";
import { ref, watch,onMounted } from "vue";
import { QForm, useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
@ -30,8 +30,10 @@ const returndate = ref<Date | null>();
const reason = ref<string>("");
const listPerson = ref<any>([]);
const OrgList = ref<DataOption[]>([]);
const filterOrgList = ref<any>([]);
const insigniaNoteProfileId = ref<string>("");
const filterSelectRound = ref<any>()
const selectRound = ref<any>()
// เคลียร์ข้อมูลในฟอร์ม
const clearData = () => {
receivedate.value = null;
@ -68,7 +70,10 @@ const props = defineProps({
type: String,
},
selectRoundOption: {
type: Array,
type: Array,
},
filterSelectRoundOption: {
type: Array,
},
profileId: {
type: String,
@ -92,7 +97,8 @@ watch(props, () => {
// ดึงข้อมูลรายการเครื่องราช
const fecthlistInsignia = async () => {
showLoader();
if(roundNo.value !== ''&& roundNo.value !== null){
showLoader();
let data = {
insigniaTypeId: props.typeId,
insigniaNoteId: roundNo.value,
@ -115,6 +121,8 @@ const fecthlistInsignia = async () => {
hideLoader();
});
};
}
// ดึงข้อมูลรายการหน่วยงาน
const fetchOrgList = async () => {
@ -136,6 +144,7 @@ const fetchOrgList = async () => {
// ];
// } else {
OrgList.value = orgArr;
filterOrgList.value = OrgList.value
// }
})
.catch((err) => {
@ -240,6 +249,31 @@ const clearReceiveDate = () => {
const clearReturnDate = () => {
returndate.value = null;
};
const filterSelector = (val: any, update: Function, name: any) => {
update(() => {
const needle = val.toLowerCase();
if (name === 'filterOrgList') {
OrganazationId.value = ''
filterOrgList.value = OrgList.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
if (name === 'filterSelectRoundOption') {
roundNo.value = ''
filterSelectRound.value = selectRound.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
}
)
}
const setValue = () => {
filterSelectRound.value = props.filterSelectRoundOption
selectRound.value = props.selectRoundOption
}
onMounted(() => {
setValue();
});
</script>
<template>
@ -267,14 +301,18 @@ const clearReturnDate = () => {
:label="`${'รอบการขอเครื่องราชฯ'}`"
emit-value
map-options
use-input
option-label="name"
:options="selectRoundOption"
:options="filterSelectRound"
option-value="id"
:readonly="false"
:borderless="false"
style="min-width: 150px"
:rules="[(val) => !!val || 'กรุณาเลือกรอบการขอเครื่องราชฯ']"
@update:model-value="fecthlistInsignia()"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterSelectRoundOption'
) "
/>
</div>
<div class="col-12 q-mt-md text-weight-bold text-grey-7">
@ -382,18 +420,22 @@ const clearReturnDate = () => {
<div class="col-xs-12 col-sm-6">
<q-select
hide-bottom-space
:options="OrgList"
: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>
@ -452,7 +494,7 @@ const clearReturnDate = () => {
<div class="col-xs-12 col-sm-6">
<q-select
hide-bottom-space
:options="OrgList"
:options="filterOrgList"
dense
lazy-rules
borderless
@ -461,9 +503,13 @@ const clearReturnDate = () => {
emit-value
map-options
outlined
use-input
v-model="OrganazationId"
:label="`เลือกหน่วยงานที่ส่งคืน`"
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่คืน']"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterOrgList'
) "
/>
</div>

140
src/modules/07_insignia/components/5_Borrow/Main.vue
View file

@ -19,15 +19,18 @@ const tab = ref<string>("");
const selectRound = ref<string>();
const selectRoundOption = ref<OptionDataYear[]>([]);
const filterSelectRoundOption = ref<any>([]);
const selectRoundAllOption = ref<OptionDataYear[]>([]);
const filterSelectRoundAllOption = ref<OptionDataYear[]>([]);
const modal = ref<boolean>(false);
const action = ref<string>("");
const profileId = ref<string>("");
const roundYear = ref<any>();
const insigniaList = ref<any>([]);
const fileterInsigniaList = ref<any>([]);
const loadView = ref<boolean>(false);
const employeeClassOps = ref<any>(DataStore.employeeClassOps)
onMounted(async () => {
await fecthRound();
});
@ -58,8 +61,10 @@ const fecthRound = async () => {
year: e.year,
});
});
filterSelectRoundAllOption.value = selectRoundAllOption.value
selectRound.value = data[0].id;
filterSelectRoundOption.value = selectRoundOption.value
console.log(filterSelectRoundOption.value)
yearRound.value = data[0].year;
roundYear.value = data[0].year;
if (roundYear.value) {
@ -326,6 +331,7 @@ watch(tab, async () => {
(x: any) => x.type == tab.value || x.type == ""
);
DataStore.insignia = "";
fileterInsigniaList.value = insigniaList.value
fecthlistInsignia();
});
@ -392,6 +398,44 @@ const paginationLabel = (start: number, end: number, total: number) => {
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
else return start + "-" + end + " ใน " + total;
};
const filterSelector = (val: any, update: Function, name: any) => {
update(() => {
const needle = val.toLowerCase();
if (name === 'employeeClassOps') {
DataStore.employeeClass = ''
employeeClassOps.value = DataStore.employeeClassOps.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
else if (name === 'fileterInsigniaList') {
DataStore.insignia = null as any
fileterInsigniaList.value = insigniaList.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
else if (name === 'filterSelectRoundAllOption') {
yearRound.value = null as any
filterSelectRoundAllOption.value = selectRoundAllOption.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
}
)
}
const clearInsigniaFilters = (name: string) => {
if (name === "employeeClassOps") {
DataStore.employeeClass = "all";
employeeClassOps.value = DataStore.employeeClassOps;
}
else if (name === "fileterInsigniaList") {
DataStore.insignia = "";
fileterInsigniaList.value = insigniaList.value;
}
// else if (name === 'employeeClassOps') {
// }
};
</script>
<template>
@ -426,7 +470,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
>
<div class="q-pa-md">
<div class="row col-12 q-pb-sm q-col-gutter-x-xs">
<div>
<q-select
v-model="yearRound"
dense
@ -436,26 +480,30 @@ const paginationLabel = (start: number, end: number, total: number) => {
:label="`${'รอบการเสนอขอเครื่องราชฯ'}`"
emit-value
map-options
use-input
option-label="name"
:options="selectRoundAllOption"
:options="filterSelectRoundAllOption"
option-value="year"
:borderless="false"
style="min-width: 150px"
@update:model-value="selectorRound"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterSelectRoundAllOption'
) "
/>
</div>
<div>
<q-select
v-model="DataStore.insignia"
dense
outlined
use-input
lazy-rules
hide-bottom-space
:label="`${'เครื่องราชฯ'}`"
emit-value
map-options
option-label="name"
:options="insigniaList"
:options="fileterInsigniaList"
option-value="id"
:readonly="false"
:borderless="false"
@ -466,31 +514,68 @@ const paginationLabel = (start: number, end: number, total: number) => {
DataStore.employeeClass
)
"
/>
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'fileterInsigniaList'
) "
>
<template v-if="DataStore.insignia !== ''" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('fileterInsigniaList'),
DataStore.searchDatatable(
DataStore.insignia,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
</template>
</q-select>
</div>
<div>
<q-select
v-model="DataStore.employeeClass"
dense
outlined
lazy-rules
hide-bottom-space
:label="`${'สถานภาพ'}`"
emit-value
map-options
option-label="name"
:options="DataStore.employeeClassOps"
option-value="id"
:readonly="false"
:borderless="false"
style="min-width: 150px"
@update:model-value="
DataStore.searchDatatable(
DataStore.insignia,
DataStore.employeeClass
)
class="col-2"
v-model="DataStore.employeeClass"
dense
outlined
lazy-rules
hide-bottom-space
:label="`${'สถานภาพ'}`"
emit-value
use-input
map-options
option-label="name"
:options="employeeClassOps"
option-value="id"
:readonly="false"
:borderless="false"
style="min-width: 150px"
@update:model-value="
DataStore.searchDatatable(
DataStore.insignia,
DataStore.employeeClass
)
"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'employeeClassOps'
) "
>
<template v-if="DataStore.employeeClass !== 'all'" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('employeeClassOps'),
DataStore.searchDatatable(
DataStore.insignia,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
</template>
</q-select>
</div>
<div>
@ -600,7 +685,8 @@ const paginationLabel = (start: number, end: number, total: number) => {
:round-id="selectRound == '0' ? 'all' : selectRound"
:action="action"
:profile-id="profileId"
:select-round-option="selectRoundOption"
v-model:selectRoundOption="selectRoundOption"
v-model:filterSelectRoundOption="filterSelectRoundOption"
:type-id="tab"
/>
</q-card>

20
src/modules/07_insignia/components/report/Report_02.vue
View file

@ -40,6 +40,7 @@ onMounted(async () => {
const splitterModel = ref(14);
const selectList = ref<any>();
const optionsList = ref<any>([{ id: 0, name: "เลือกกรอบการยื่นขอ" }]);
const filterOtion = ref<any>([]);
const nextPage = () => {
if (page.value < numOfPages.value) {
@ -65,6 +66,7 @@ const fecthlistRound = async () => {
year: e.period_year,
name: e.period_name,
}));
filterOtion.value = optionsList.value
})
.catch((err) => {
messageError($q, err);
@ -130,6 +132,18 @@ const downloadReport = async (
hideLoader();
});
};
const filterSelector = (val: any, update: Function, name: any) => {
update(() => {
const needle = val.toLowerCase();
if (name === 'selectList') {
filterOtion.value = optionsList.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
}
)
}
</script>
<template>
@ -152,19 +166,23 @@ const downloadReport = async (
<q-toolbar style="padding: 0">
<q-form ref="myForm" class="row items-center">
<q-select
style="width: 400px;"
class="q-pa-none"
use-input
fill-input
hide-selected
dense
lazy-rules
outlined
v-model="selectList"
:options="optionsList"
:options="filterOtion"
label="เลือกรอบ"
option-value="id"
option-label="name"
:rules="[(val) => !!val || 'กรุณาเลือกรอบ']"
@update:model-value="updateSelect"
@filter="(inputValue:any,doneFn:Function) =>
filterSelector(inputValue, doneFn,'selectList') "
/>
</q-form>
<q-space />

9
src/modules/07_insignia/store.ts
View file

@ -37,6 +37,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
{ id: '44', title: 'บัญชีแสดงจำนวนชั้นตราเครื่องราชฯ' }
])
const mainTab = ref<string | undefined>("pending");
const dataInsigniaType = ref<any>([])
// เรียกราชชื่อการเสนอขอ
const fetchData = async (data: any) => {
if (data !== null) {
@ -124,6 +125,10 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
rows.value = listinsignia.value;
}
};
// ประเภทเครื่องราช
function fetchInsigniaType(data: any) {
dataInsigniaType.value = data
}
// ประเภทลูกจ้าง
const profileType = (val: string) => {
@ -167,11 +172,13 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
employeeClass,
employeeClassOps,
fetchDataInsignia,
fetchInsigniaType,
isLock,
requestId,
roleUser,
requestStatus,
optionReport,
convertStatus
convertStatus,
dataInsigniaType,
};
});

779
src/modules/08_registryEmployee/components/DialogSendToCommand.vue
View file

@ -1,403 +1,476 @@
<script setup lang="ts">
import { ref, watch } from 'vue';
import type { FormRegistryEmployee } from '../interface/request/Main';
import { useQuasar, type QTableProps, QInput } from 'quasar';
import { useCounterMixin } from '@/stores/mixin';
import http from '@/plugins/http';
import { ref, watch } from "vue";
import type { FormRegistryEmployee } from "../interface/request/Main";
import { useQuasar, type QTableProps, QInput } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
const {
success,
messageError,
showLoader,
hideLoader,
dialogConfirm,
dialogMessageNotify,
success,
messageError,
showLoader,
hideLoader,
dialogConfirm,
dialogMessageNotify,
} = mixin; //ฟังก์ชันกลางที่ใช้ในหน้านี้
const $q = useQuasar();
const props = defineProps({
modal: {
type: Boolean,
default: false,
modal: {
type: Boolean,
default: false,
},
rows: {
type: Object,
default: [],
},
fetchNewList: {
type: Function,
default: () => {
/* ฟังก์ชั่น get รายการข้อมูลในหน้าหลักใหม่ */
},
rows: {
type: Object,
default: []
},
fetchNewList: {
type: Function,
default: () => { /* ฟังก์ชั่น get รายการข้อมูลในหน้าหลักใหม่ */ }
},
closeDialog: {
type: Function,
default: () => { /* ฟังก์ชั่นปิด dialog ส่งไปออกคำสั่ง */ }
},
closeDialog: {
type: Function,
default: () => {
/* ฟังก์ชั่นปิด dialog ส่งไปออกคำสั่ง */
},
},
});
const filter = ref<string>("");
const filterRef = ref<QInput>();
// visible columns ตารางใน dialog ส่งไปออกคำสั่ง
const visibleColumnsOrder = ref<string[]>([
"no",
"fullname",
"fullnameOld",
"oc",
"positionEmployeePosition",
"positionEmployeePositionSide",
"positionLine",
"govAge",
"positionEmployeeGroup",
"dateAppoint",
"refSalary",
"dateStart",
"createdAt",
"salaryDate",
"age",
"amount",
"statustext",
"leaveDateOrder",
"newAgency",
"currentAgency",
"no",
"fullname",
"fullnameOld",
"oc",
"positionEmployeePosition",
"positionEmployeePositionSide",
"positionLine",
"govAge",
"positionEmployeeGroup",
"dateAppoint",
"refSalary",
"dateStart",
"createdAt",
"salaryDate",
"age",
"amount",
"statustext",
"leaveDateOrder",
"newAgency",
"currentAgency",
]);
// คอลัมน์ในตาราง
const columnsOrder = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: false,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "fullname",
align: "left",
label: "ชื่อ-สกุล",
sortable: true,
field: "fullname",
headerStyle: "font-size: 14px; min-width: 200px",
style: "font-size: 14px; ",
},
{
name: "newAgency",
align: "left",
label: "หน่วยงานที่รับการบรรจุ",
sortable: true,
field: "newAgency",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "currentAgency",
align: "left",
label: "หน่วยงานปัจจุบัน",
sortable: true,
field: "currentAgency",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "amount",
align: "left",
label: "ค่าจ้าง",
sortable: true,
field: "amount",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "govAge",
align: "left",
label: "อายุราชการ(ปี)",
sortable: true,
field: "govAge",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "dateAppoint",
align: "left",
label: "วันที่จ้าง",
sortable: true,
field: "dateAppoint",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "dateStart",
align: "left",
label: "วันที่เริ่มปฎิบัติราชการ",
sortable: true,
field: "dateStart",
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: "refSalary",
align: "left",
label: "เอกสารอ้างอิง",
sortable: true,
field: "refSalary",
headerStyle: "font-size: 14px; min-width: 200px",
style: "font-size: 14px; ",
},
{
name: "age",
align: "left",
label: "อายุ",
sortable: true,
field: "age",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "fullnameOld",
align: "left",
label: "ชื่อ-สกุล(เดิม)",
sortable: true,
field: "fullnameOld",
headerStyle: "font-size: 14px; min-width: 200px",
style: "font-size: 14px; ",
},
{
name: "createdAt",
align: "left",
label: "วันที่สร้าง",
sortable: true,
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "leaveDateOrder",
align: "left",
label: "วันที่พ้นราชการ",
sortable: true,
field: "leaveDateOrder",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "statustext",
align: "left",
label: "สถานะ",
sortable: true,
field: "statustext",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: false,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "fullname",
align: "left",
label: "ชื่อ-นามสกุล",
sortable: true,
field: "fullname",
headerStyle: "font-size: 14px; min-width: 200px",
style: "font-size: 14px; ",
},
{
name: "newAgency",
align: "left",
label: "หน่วยงานที่รับการบรรจุ",
sortable: true,
field: "newAgency",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "currentAgency",
align: "left",
label: "หน่วยงานปัจจุบัน",
sortable: true,
field: "currentAgency",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "amount",
align: "left",
label: "ค่าจ้าง",
sortable: true,
field: "amount",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "govAge",
align: "left",
label: "อายุราชการ(ปี)",
sortable: true,
field: "govAge",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "dateAppoint",
align: "left",
label: "วันที่จ้าง",
sortable: true,
field: "dateAppoint",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "dateStart",
align: "left",
label: "วันที่เริ่มปฎิบัติราชการ",
sortable: true,
field: "dateStart",
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: "refSalary",
align: "left",
label: "เอกสารอ้างอิง",
sortable: true,
field: "refSalary",
headerStyle: "font-size: 14px; min-width: 200px",
style: "font-size: 14px; ",
},
{
name: "age",
align: "left",
label: "อายุ",
sortable: true,
field: "age",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
{
name: "fullnameOld",
align: "left",
label: "ชื่อ-สกุล(เดิม)",
sortable: true,
field: "fullnameOld",
headerStyle: "font-size: 14px; min-width: 200px",
style: "font-size: 14px; ",
},
{
name: "createdAt",
align: "left",
label: "วันที่สร้าง",
sortable: true,
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "leaveDateOrder",
align: "left",
label: "วันที่พ้นราชการ",
sortable: true,
field: "leaveDateOrder",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "statustext",
align: "left",
label: "สถานะ",
sortable: true,
field: "statustext",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, {
numeric: true,
sensitivity: "base",
}),
},
]);
// checkbox เลือกคนไปออกคำสั่ง
const selected = ref<any>([]);
const save = () => {
if (selected.value.length == 0) {
dialogMessageNotify($q, "กรุณาเลือกคนออกคำสั่ง");
} else dialogConfirm($q, () => sendToCommand());
if (selected.value.length == 0) {
dialogMessageNotify($q, "กรุณาเลือกคนออกคำสั่ง");
} else dialogConfirm($q, () => sendToCommand());
};
// post ส่งไปออกคำสั่ง
const sendToCommand = async () => {
let pId: string[] = [];
selected.value.forEach((e: any) => {
pId.push(e.id);
let pId: string[] = [];
selected.value.forEach((e: any) => {
pId.push(e.id);
});
let data = {
id: pId,
};
showLoader();
await http
.post(config.API.organizationEmployeeSendOrder, data)
.then((res: any) => {
success($q, "บันทึกสำเร็จ");
})
.catch((e: any) => {
messageError($q, e);
})
.finally(async () => {
props.fetchNewList();
props.closeDialog();
selected.value = [];
hideLoader();
});
let data = {
id: pId,
};
showLoader();
await http
.post(config.API.organizationEmployeeSendOrder, data)
.then((res: any) => {
success($q, "บันทึกสำเร็จ");
})
.catch((e: any) => {
messageError($q, e);
})
.finally(async () => {
props.fetchNewList()
props.closeDialog()
selected.value = [];
hideLoader();
});
};
// เลือกรายการเฉพาะคนที่มีสถานะ PENDING (เลือกตำแหน่งแล้ว)
const rowsOrder = ref<FormRegistryEmployee[]>([]);
const filterRowData = () => {
rowsOrder.value = props.rows.filter(
(r: FormRegistryEmployee) => r.status == "PENDING"
);
}
rowsOrder.value = props.rows.filter(
(r: FormRegistryEmployee) => r.status == "PENDING"
);
};
// เช็ค props modal ทำการ filter เมื่อคลิก icon ส่งไปออกคำสั่ง
watch(props, () => {
if (props.modal === true && props.rows) {
filterRowData()
}
if (props.modal === true && props.rows) {
filterRowData();
visibleColumnsOrder.value = [
"no",
"fullname",
"fullnameOld",
"oc",
"positionEmployeePosition",
"positionEmployeePositionSide",
"positionLine",
"govAge",
"positionEmployeeGroup",
"dateAppoint",
"refSalary",
"dateStart",
"createdAt",
"salaryDate",
"age",
"amount",
"statustext",
"leaveDateOrder",
"newAgency",
"currentAgency",
];
}
});
</script>
<template>
<q-dialog v-model="props.modal">
<q-card style="width: 900px; max-width: 80vw">
<DialogHeader tittle="ส่งรายชื่อไปออกคำสั่ง" :close="props.closeDialog" />
<q-separator />
<q-card-section class="q-pt-none">
<div class="row justify-end">
<div class="col-5">
<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-toolbar>
</div>
<q-dialog v-model="props.modal">
<q-card style="width: 900px; max-width: 80vw">
<DialogHeader tittle="ส่งรายชื่อไปออกคำสั่ง" :close="props.closeDialog" />
<q-separator />
<q-card-section class="q-pt-none">
<div class="row justify-end">
<div class="col-5">
<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="visibleColumnsOrder"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columnsOrder"
option-value="name"
options-cover
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</q-toolbar>
</div>
</div>
<d-table
:rows="rowsOrder"
:columns="columnsOrder"
:visible-columns="visibleColumnsOrder"
: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 key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="fullname" :props="props">
{{ props.row.fullname }}
</q-td>
<q-td key="newAgency" :props="props">
<div
class="col-12"
v-if="
props.row.draftOrganizationOrganization == null &&
props.row.draftPositionEmployee == null
"
>
<div class="text-weight-medium">
{{ "-" }}
</div>
</div>
<div class="col-12" v-else>
<div class="text-weight-medium">
{{ props.row.draftOrganizationOrganization ?? "-" }}
</div>
<div class="text-weight-light">
{{ props.row.draftPositionEmployee ?? "-" }}
</div>
</div>
</q-td>
<q-td key="currentAgency" :props="props">
<div
class="col-12"
v-if="props.row.oc == null && props.row.position == null"
>
<div class="text-weight-medium">
{{ "-" }}
</div>
</div>
<div class="col-12" v-else>
<div class="text-weight-medium">
{{ props.row.oc ?? "-" }}
</div>
<div class="text-weight-light">
{{ props.row.position ?? "-" }}
</div>
</div>
</q-td>
<d-table :rows="rowsOrder" :columns="columnsOrder" :visible-columns="visibleColumnsOrder" :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 key="amount" :props="props">
{{ props.row.amount }}
</q-td>
<q-td key="govAge" :props="props">
{{ props.row.govAge }}
</q-td>
<q-td key="dateAppoint" :props="props">
{{ props.row.dateAppoint }}
</q-td>
<q-td key="dateStart" :props="props">
{{ props.row.dateStart }}
</q-td>
<q-td key="salaryDate" :props="props">
{{ props.row.salaryDate }}
</q-td>
<q-td key="refSalary" :props="props">
{{ props.row.refSalary }}
</q-td>
<q-td key="age" :props="props">
{{ props.row.age }}
</q-td>
<q-td key="fullnameOld" :props="props">
{{ props.row.fullnameOld }}
</q-td>
<q-td key="createdAt" :props="props">
{{ props.row.createdAt }}
</q-td>
<q-td key="isLeave" :props="props">
{{ props.row.isLeave }}
</q-td>
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="fullname" :props="props">
{{ props.row.fullname }}
</q-td>
<q-td key="newAgency" :props="props">
<div class="col-12" v-if="props.row.draftOrganizationOrganization == null &&
props.row.draftPositionEmployee == null
">
<div class="text-weight-medium">
{{ "-" }}
</div>
</div>
<div class="col-12" v-else>
<div class="text-weight-medium">
{{ props.row.draftOrganizationOrganization ?? "-" }}
</div>
<div class="text-weight-light">
{{ props.row.draftPositionEmployee ?? "-" }}
</div>
</div>
</q-td>
<q-td key="currentAgency" :props="props">
<div class="col-12" v-if="props.row.oc == null && props.row.position == null">
<div class="text-weight-medium">
{{ "-" }}
</div>
</div>
<div class="col-12" v-else>
<div class="text-weight-medium">
{{ props.row.oc ?? "-" }}
</div>
<div class="text-weight-light">
{{ props.row.position ?? "-" }}
</div>
</div>
</q-td>
<q-td key="leaveDateOrder" :props="props">
{{ props.row.leaveDateOrder }}
</q-td>
<q-td key="statustext" :props="props">
{{ props.row.statustext }}
</q-td>
</q-tr>
</template>
</d-table>
</q-card-section>
<q-td key="amount" :props="props">
{{ props.row.amount }}
</q-td>
<q-td key="govAge" :props="props">
{{ props.row.govAge }}
</q-td>
<q-td key="dateAppoint" :props="props">
{{ props.row.dateAppoint }}
</q-td>
<q-td key="dateStart" :props="props">
{{ props.row.dateStart }}
</q-td>
<q-td key="salaryDate" :props="props">
{{ props.row.salaryDate }}
</q-td>
<q-td key="refSalary" :props="props">
{{ props.row.refSalary }}
</q-td>
<q-td key="age" :props="props">
{{ props.row.age }}
</q-td>
<q-td key="fullnameOld" :props="props">
{{ props.row.fullnameOld }}
</q-td>
<q-td key="createdAt" :props="props">
{{ props.row.createdAt }}
</q-td>
<q-td key="isLeave" :props="props">
{{ props.row.isLeave }}
</q-td>
<q-td key="leaveDateOrder" :props="props">
{{ props.row.leaveDateOrder }}
</q-td>
<q-td key="statustext" :props="props">
{{ props.row.statustext }}
</q-td>
</q-tr>
</template>
</d-table>
</q-card-section>
<q-card-actions align="right" class="bg-white text-teal">
<q-btn label="ส่งไปออกคำสั่ง" @click="save" color="public" />
</q-card-actions>
</q-card>
</q-dialog>
</template>
<q-card-actions align="right" class="bg-white text-teal">
<q-btn label="ส่งไปออกคำสั่ง" @click="save" color="public" />
</q-card-actions>
</q-card>
</q-dialog>
</template>

4
src/modules/08_registryEmployee/views/Main.vue
View file

@ -310,7 +310,7 @@ const deleteData = async (id: string) => {
// **** เริ่มในส่วนของการเลือกตำแหน่ง ***//
const rowsPosition = ref<any>([]); // รายการข้อมูลในตารางกำหนดตำแหน่ง
const filters = ref<FormRegistryEmployee[]>([]);
const filterKeyword2 = ref<string>("");
const filterKeyword2 = ref<any>("");
const modal = ref<boolean>(false); // เปิด-ปิด dialod กำหนดตำแหน่ง
const selectedPosition = ref<any>([]); // เก็บตำแหน่งที่เลือก
@ -970,7 +970,7 @@ const showEmployeeTemp = async () => {
dense
ref="filterRef"
debounce="300"
:model-value="filterKeyword2"
v-model="filterKeyword2"
placeholder="ค้นหา"
style="width: 850px; max-width: auto"
>

37
src/modules/10_order/store.ts
View file

@ -45,13 +45,19 @@ export const useOrderPlacementDataStore = defineStore("placementOrder", () => {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.orderTypeValue === filter_1
);
} else if (filter_1 !== "" && filter_2 !== "ทั้งหมด" && filterYear === null) {
} else if (
filter_1 !== "" &&
filter_2 !== "ทั้งหมด" &&
filterYear === null
) {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.orderTypeValue === filter_1 && item.OrderStatus === filter_2
(item) =>
item.orderTypeValue === filter_1 && item.OrderStatus === filter_2
);
} else if (filter_1 !== "" && filter_2 === "ทั้งหมด" && filterYear !== 0) {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.orderTypeValue === filter_1 && item.fiscalYear === filterYear
(item) =>
item.orderTypeValue === filter_1 && item.fiscalYear === filterYear
);
} else if (filter_1 === "" && filter_2 !== "ทั้งหมด" && filterYear === 0) {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
@ -61,27 +67,32 @@ export const useOrderPlacementDataStore = defineStore("placementOrder", () => {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.fiscalYear === filterYear
);
} else if (filter_1 === "" && filter_2 !== "ทั้งหมด" && filterYear !== null) {
} else if (
filter_1 === "" &&
filter_2 !== "ทั้งหมด" &&
filterYear !== null
) {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) =>
item.OrderStatus === filter_2 && item.fiscalYear === filterYear
);
} else if (filter_1 !== "" && filter_2 !== "ทั้งหมด" && filterYear === 0) {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.OrderStatus === filter_2 && item.orderTypeValue === filter_1
(item) =>
item.OrderStatus === filter_2 && item.orderTypeValue === filter_1
);
} else if (filter_1 !== "" && filter_2 !== "ทั้งหมด" && filterYear !== null) {
} else if (
filter_1 !== "" &&
filter_2 !== "ทั้งหมด" &&
filterYear !== null
) {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) =>
item.orderTypeValue === filter_1 &&
item.OrderStatus === filter_2 &&
item.fiscalYear === filterYear
);
} else if (
filter_1 == "" &&
filter_2 == "ทั้งหมด" &&
filterYear !== null
) {
} else if (filter_1 == "" && filter_2 == "ทั้งหมด" && filterYear !== null) {
DataMainUpdateOrder.value = DataMainOrigOrder.value;
}
};
@ -144,6 +155,6 @@ export const useOrderPlacementDataStore = defineStore("placementOrder", () => {
DataUpdateOrder,
DataMainYearSetOrder,
DataMainOrder,
nameOrderFilter
nameOrderFilter,
};
});
});

66
src/modules/10_order/views/Main.vue
View file

@ -18,15 +18,6 @@ const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError, date2Thai } = mixin;
const DataStore = useOrderPlacementDataStore();
const OpsFilterYear = ref<any>({
fiscalyearOP: [],
});
const OpsFilterOrderType = ref<any>({
OrderTypeOption: [],
});
const OpsFilterOrderStatus = ref<any>({
OrderStatusOption: [],
});
const pagination = ref({
descending: true,
page: 1,
@ -153,16 +144,6 @@ const OriginalDataFetch = async () => {
OrderType: e.orderTypeName,
orderTypeValue: e.orderTypeValue,
}));
// OpsFilterYear.value.fiscalYear = res.data.result.map((e: any) => ({
// fiscalYear: Number(e.fiscalYear),
// }));
OpsFilterOrderStatus.value.OrderStatus = res.data.result.map(
(e: any) => ({
OrderStatus: e.orderStatusName,
})
);
console.log(fiscalyear.value);
console.log(OrderStatus.value);
})
.catch((e: any) => {
messageError($q, e);
@ -199,22 +180,26 @@ const redirectToPage = (id?: string, status?: string) => {
const clickAdd = () => {
router.push({ name: "OrderAdd" });
};
const Ops = ref<any>({
fiscalyearOP: [],
});
// รายการข้อมูลปีงบประมาณ
const fiscalyear = ref<number | null>(0);
const fiscalyearOP = ref<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
const fiscalyearOP = ref<any>([{ id: 0, name: "ทั้งหมด" }]);
const fiscalyearFilter1 = ref<any>([]);
const fiscalYearFilter = async () => {
await http.get(config.API.yearOptionsOrder()).then((res) => {
const response = res.data.result;
fiscalyearOP.value = [{ id: 0, name: "ทั้งหมด" }];
fiscalyearOP.value.push(...response);
response.map((r: any) => {
fiscalyearOP.value.push({ id: r.id, name: r.name.toString() });
});
fiscalyearFilter1.value = [{ id: 0, name: "ทั้งหมด" }];
fiscalyearFilter1.value.push(...response);
response.map((r: any) => {
fiscalyearFilter1.value.push({
id: r.id,
name: r.name.toString(),
});
});
});
};
@ -300,7 +285,7 @@ const filterSelector = (val: any, update: Function, refData: string) => {
case "fiscalyearOP":
update(() => {
fiscalyearOP.value = fiscalyearFilter1.value.filter(
(v: any) => v.name.valueOf(val) > -1
(v: any) => v.name.indexOf(val) > -1
);
});
break;
@ -347,6 +332,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
option-value="id"
option-label="name"
lazy-rules
use-input
hide-bottom-space
:readonly="false"
:borderless="false"
@ -356,7 +342,13 @@ const paginationLabel = (start: string, end: string, total: string) => {
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'fiscalyearOP'
) "
/>
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
</q-item>
</template>
</q-select>
<!-- use-input -->
<div>
<q-btn
@ -433,7 +425,15 @@ const paginationLabel = (start: string, end: string, total: string) => {
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'OrderTypeOption'
) "
/>
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไม่มีข้อมูล
</q-item-section>
</q-item>
</template>
</q-select>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
@ -456,7 +456,15 @@ const paginationLabel = (start: string, end: string, total: string) => {
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'OrderStatusOption'
) "
/>
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไม่มีข้อมูล
</q-item-section>
</q-item>
</template>
</q-select>
</div>
<q-space />
<div><PopupHistory :OrderTypeOption="OrderTypeOption" /></div>