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

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

Browse source
This commit is contained in:
AnandaTon 2023-08-21 12:20:31 +07:00
commit f995d18c4e
33 changed files with 2694 additions and 3386 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/api/02_organizational/api.treelist.ts
View file

@ -89,4 +89,6 @@ export default {
organizationEmployeePositionId: (profileId: string) =>
`${organizationEmployee}position/${profileId}`,
organizationEmployeeSendOrder: `${organizationEmployee}report`,
};

18
src/api/05_placement/api.placement.ts
View file

@ -61,6 +61,8 @@ export default {
`${placement}/position/clear/${personalId}`,
// order
organizationsOrder: () => `${order}/order/organizations`,
approverOC: (id: string) => `${order}/order/approver/${id}`,
yearOptionsOrder: () => `${order}/order/fiscal-year`,
listOrder: () => `${order}/order`,
detailOrder: (orderId: string) => `${order}/order/detail/${orderId}`,
@ -96,6 +98,7 @@ export default {
receiveReport: `${receive}/report`,
receiveDataId: (id: string) => `${receive}/${id}`,
receivePosition: (id: string) => `${receive}/position/${id}`,
receiveDataPosition: () => `${receive}/use`,
//tranfer ระบบคำขอโอน
transfer,
@ -113,6 +116,7 @@ export default {
appointmentDelete: (id: string) => `${placement}/appointment/${id}`,
appointmentPosition: (id: string) => `${placement}/appointment/position/${id}`,
apppointmentReport: (id: string) => `${placement}/appointment/report/${id}`,
apppointmentPosition: () => `${placement}/appointment/use`,
// ช่วยราชการ
placemenHelpGov,
@ -120,7 +124,7 @@ export default {
officerDetail: (id: string) => `${placement}/officer/${id}`,
officerMainDelete: (id: string) => `${placement}/officer/${id}`,
officerMainReport: () => `${placement}/officer/report`,
officerMainEdit: (id:string) => `${placemenHelpGov}/${id}`,
officerMainEdit: (id: string) => `${placemenHelpGov}/${id}`,
// ส่งตัวกลับ
placemenRepatriation,
@ -128,15 +132,17 @@ export default {
repatriationDetail: (id: string) => `${placement}/repatriation/${id}`,
repatriationMainDelete: (id: string) => `${placement}/repatriation/${id}`,
repatriationMainReport: () => `${placement}/repatriation/report`,
repatriationMainEdit: (id:string) => `${placemenRepatriation}/${id}`,
repatriationMainEdit: (id: string) => `${placemenRepatriation}/${id}`,
// ขอย้าย
placemenRelocation,
relocationMain: () => `${placement}/relocation`,
relocationDetail: (id:string) => `${placement}/relocation/${id}`,
relocationMainDelete: (id:string) => `${placement}/relocation/${id}`,
relocationDetail: (id: string) => `${placement}/relocation/${id}`,
relocationMainDelete: (id: string) => `${placement}/relocation/${id}`,
relocationMainReport: () => `${placement}/relocation/report`,
relocationMainPut: (id:string) => `${placement}/relocation/position/${id}`,
relocationMainEdit: (id:string) => `${placemenRelocation}/${id}`,
relocationMainPut: (id: string) => `${placement}/relocation/position/${id}`,
relocationMainEdit: (id: string) => `${placemenRelocation}/${id}`,
relocationMainPosition: () => `${placement}/relocation/use`,
// อื่นๆ
placemenOther,
otherMain: () => `${placemenOther}`,

10
src/api/07_insignia/api.insignia.ts
View file

@ -3,9 +3,19 @@
*/
import env from "../index";
const insignia = `${env.API_URI}/insignia`;
const Organization = `${env.API_URI}/Organization`
export default {
getRoundInsignia: (id: string) => `${insignia}/period/${id}`,
listRoundInsignia: (type: string) => `${insignia}/period/${type}`,
editRoundInsignia: (id: string) => `${insignia}/period/${id}`,
RoundInsignia: (id: string) => `${insignia}/period/${id}`,
requestInsignia: (insigniaPeriodId: string) => `${insignia}/request/${insigniaPeriodId}`,
// Type
typeOc: () => `${Organization}/history/type/หน่วยงาน`,
// manage
insigniaManage: (type: string) => `${insignia}/manage/${type}`,
insigniaList: (insigniaPeriodId: any, ocId: string, role: string, status: any) => `${insignia}/request/${insigniaPeriodId}/${ocId}/${role}/${status}`
};

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

@ -325,7 +325,7 @@
<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>

42
src/modules/05_placement/components/AppointMent/AppointmentModal.vue
View file

@ -30,15 +30,12 @@ let dataForm = reactive({
positionLineId: "",
positionPathSideId: "",
positionTypeId: "",
// salaryAmount: null,
// mouthSalaryAmount: null,
// positionSalaryAmount: null,
});
onMounted(async () => {
await fetchPublishFile();
await loadTreeData();
// await fetchplacementPosition();
await fetchplacementPosition();
});
const fetchPublishFile = async () => {
await http
@ -90,17 +87,17 @@ function filterByPersonIdNull(obj: any) {
}
// โหลด position
// const placementPosition = ref<any>([]);
// const fetchplacementPosition = async () => {
// await http
// .get(config.API.placementPosition())
// .then((res: any) => {
// placementPosition.value = res.data.result;
// })
// .catch((e: any) => {
// messageError($q, e);
// });
// };
const placementPosition = ref<any>([]);
const fetchplacementPosition = async () => {
await http
.get(config.API.apppointmentPosition())
.then((res: any) => {
placementPosition.value = res.data.result;
})
.catch((e: any) => {
messageError($q, e);
});
};
const search = ref<string>("");
//reset Tree Filter
@ -191,7 +188,7 @@ const saveAppoint = async () => {
// await resetFilter();
await fetchPublishFile();
await loadTreeData();
// await fetchplacementPosition();
await fetchplacementPosition();
hideLoader();
});
}
@ -367,10 +364,10 @@ const selectedPosition = async (data: any) => {
console.log("dataForm", dataForm);
};
// const checkPosition = (val: string) => {
// const num = placementPosition.value.findIndex((e: string) => e === val);
// return num;
// };
const checkPosition = (val: string) => {
const num = placementPosition.value.findIndex((e: string) => e === val);
return num;
};
const personal = ref<any>();
const expanded = ref<string[]>([]);
@ -506,13 +503,12 @@ function findByPerson(element: any): any {
:active="selected == prop.node.keyId"
@click="selectedPosition(prop.node)"
:disable="
prop.node.name != null
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"
>
<!-- checkPosition(prop.node.positionNumId) != -1 -->
<img
v-if="
prop.node.avatar == '' ||

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

@ -33,6 +33,7 @@ const title = ref<ResponseTitle>({
const appointment = ref<any>([]);
const edit = ref<boolean>(false);
const profileId = ref<string>("");
const organizationPositionOld = ref<string>("");
const positionTypeOld = ref<string>("");
const positionLevelOld = ref<string>("");
@ -53,8 +54,9 @@ const fecthappointmentByid = async () => {
.then((res: any) => {
const data = res.data.result;
appointment.value = data;
console.log(data);
// console.log(data);
profileId.value = data.profileId;
title.value.fullname = `${data.firstname ?? "-"} ${data.lastname ?? "-"}`;
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
title.value.positionLevelOld = data.positionLevelOld ?? "-";
@ -131,16 +133,7 @@ const getClass = (val: boolean) => {
</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.go(-1)"
/>
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
รายละเอียดการแต่งตั้ง-เลื่อน {{ title.fullname }}
</div>
<q-card bordered class="row col-12 text-dark">
@ -149,15 +142,8 @@ const getClass = (val: boolean) => {
{{ 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/${paramsId}`)"
/>
<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">
@ -204,36 +190,12 @@ const getClass = (val: boolean) => {
</div>
<q-space />
<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"
/>
<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="edit = !edit"
/>
<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="edit = !edit" />
</div>
</div>
<div class="col-12"><q-separator /></div>
@ -243,19 +205,9 @@ const getClass = (val: boolean) => {
<div class="text-weight-bold text-grey">วุฒิการศึกษา</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"
/>
<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">
@ -268,85 +220,38 @@ const getClass = (val: boolean) => {
</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"
/>
<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 items-center">
<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="`${'ตำแหน่งประเภท'}`"
/>
<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 items-center">
<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="`${'ระดับ'}`"
/>
<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 items-center">
<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="`${'เลขที่'}`"
/>
<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 items-center">
<div class="col-12">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="salary"
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
hide-bottom-space
:label="`${'เงินเดือน'}`"
type="number"
/>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="salary" :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]" hide-bottom-space
:label="`${'เงินเดือน'}`" type="number" />
</div>
</div>
<div class="col-12"><q-separator /></div>
@ -368,41 +273,22 @@ const getClass = (val: boolean) => {
</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"
>
<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"
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
:model-value="date !== null ? date2Thai(date) : null"
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
hide-bottom-space
:label="`${'ดำรงตำแหน่งในระดับปัจจุบันเมื่อ'}`"
>
: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 name="event" class="cursor-pointer" :style="edit
? 'color: var(--q-primary)'
: 'color: var(--q-grey)'
">
</q-icon>
</template>
</q-input>
@ -411,19 +297,9 @@ const getClass = (val: boolean) => {
</div>
</div>
<div class="col-12">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="reason"
:rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
hide-bottom-space
:label="`${'หมายเหตุ '}`"
type="textarea"
/>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="reason" :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]" hide-bottom-space
:label="`${'หมายเหตุ '}`" type="textarea" />
</div>
</div>
</div>
@ -435,11 +311,13 @@ const getClass = (val: boolean) => {
border-radius: 5px;
height: 70px;
}
.text-top {
color: gray;
font-weight: 400;
padding-bottom: 3px;
}
.text-detail {
font-weight: 500;
}

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

@ -131,32 +131,8 @@ const fecthTypeOption = async () => {
});
};
const rows = ref<any>([
// {
// personalId: "08db721d-add6-47b0-8a13-5f45d106e8d1",
// citizenId: "1234444332222",
// fullname: "นางสาวอย พชช",
// organizationName: "นักจัดการงานทั่วไป",
// orgName: "กลุ่มงานช่วยนักบริหาร",
// organizationShortName: "สกจ.",
// positionNumber: "กก. 1",
// positionPath: "นักจัดการงานทั่วไป",
// birthday: dateText(new Date("1989-09-03")),
// },
]);
const rows2 = ref<any>([
// {
// personalId: "08db721d-add6-47b0-8a13-5f45d106e8d1",
// citizenId: "1234444332222",
// fullname: "นางสาวอย พชช",
// organizationName: "นักจัดการงานทั่วไป",
// orgName: "กลุ่มงานช่วยนักบริหาร",
// organizationShortName: "สกจ.",
// positionNumber: "กก. 1",
// positionPath: "นักจัดการงานทั่วไป",
// birthday: dateText(new Date("1989-09-03")),
// },
]);
const rows = ref<any>([]);
const rows2 = ref<any>([]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
@ -714,7 +690,7 @@ const status = (val: string) => {
<q-card-actions align="right" class="bg-white text-teal">
<q-btn
label="ส่งไปรายการแต่งตั้ง-เลื่อน"
label="ส่งไปออกคำสั่ง"
@click="clickAddlist"
color="public"
:disable="checkSelected"

7
src/modules/05_placement/components/Other/Detail.vue
View file

@ -6,7 +6,6 @@ import { useCounterMixin } from "@/stores/mixin";
import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
import type {
TypeFile,
ResponseDataDetail,
} from "@/modules/05_placement/interface/response/Transfer";
import type { QTableProps, QForm } from "quasar";
@ -37,6 +36,7 @@ const title = ref<ResponseTitle>({
positionTypeOld: "",
});
const responseData = ref<ResponseDataDetail>({
profileId: "",
avataPath: "",
createdAt: new Date(),
date: new Date(),
@ -78,13 +78,14 @@ const fecthOther = async () => {
.then((res: any) => {
const data = res.data.result;
Otherdata.value = res.data.result;
console.log(data);
// console.log(data);
title.value.fullname = `${data.firstname ?? "-"} ${data.lastname ?? "-"}`;
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
title.value.positionLevelOld = data.positionLevelOld ?? "-";
title.value.positionTypeOld = data.positionTypeOld ?? "-";
responseData.value.profileId = data.profileId;
responseData.value.createdAt = data.createdAt;
responseData.value.date =
data.date !== null ? new Date(data.date) : new Date();
@ -189,7 +190,7 @@ const getClass = (val: boolean) => {
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${paramsId}`)"
@click="router.push(`/registry/${responseData.profileId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>

8
src/modules/05_placement/components/Receive/receiveDetail2.vue
View file

@ -25,7 +25,7 @@
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${paramsId}`)"
@click="router.push(`/registry/${profileId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>
@ -618,14 +618,15 @@ const title = ref<ResponseTitle>({
const myForm = ref<QForm | null>(null);
const edit = ref<boolean>(false);
const profileId = ref<string>("");
const educationOld = ref<string>("");
const organizationPositionOld = ref<string>("");
const positionTypeOld = ref<string>("");
const positionLevelOld = ref<string>("");
const posNo = ref<string>("");
const salary = ref<number>(0);
const organization = ref<string>("");
const date = ref<Date | null>(null);
// const organization = ref<string>("");
// const date = ref<Date | null>(null);
const reason = ref<string>("");
const informaData = ref<Information>(defaultInformation);
@ -738,6 +739,7 @@ const getData = async () => {
.then(async (res: any) => {
const data = res.data.result;
profileId.value = data.profileId;
title.value.fullname = `${data.firstname ?? "-"} ${data.lastname ?? "-"}`;
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
title.value.positionLevelOld = data.positionLevelOld ?? "-";

2
src/modules/05_placement/components/Receive/receiveModal.vue
View file

@ -100,7 +100,7 @@ function filterByPersonIdNull(obj: any) {
const placementPosition = ref<any>([]);
const fetchplacementPosition = async () => {
await http
.get(config.API.placementPosition())
.get(config.API.receiveDataPosition())
.then((res: any) => {
placementPosition.value = res.data.result;
})

2
src/modules/05_placement/components/Relocation/RelocationModal.vue
View file

@ -100,7 +100,7 @@ function filterByPersonIdNull(obj: any) {
const placementPosition = ref<any>([]);
const fetchplacementPosition = async () => {
await http
.get(config.API.placementPosition())
.get(config.API.relocationMainPosition())
.then((res: any) => {
placementPosition.value = res.data.result;
})

40
src/modules/05_placement/components/Relocation/RelocationbyId.vue
View file

@ -19,7 +19,7 @@ const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const edit = ref<boolean>(false);
const personId = route.params.id as string;
const dataId = route.params.id as string;
const {
date2Thai,
dialogMessage,
@ -36,7 +36,7 @@ const name = ref<string>("นายสมคิด ยอดใจ");
const level = ref<string>("ชำนาญการพิเศษ");
const institution = ref<string>("ฝ่ายบริหารงานทั่วไป");
const fullname = ref<string>("");
const id = ref<string>("");
const profileId = ref<string>("");
const prefix = ref<string>("");
const prefixId = ref<string>("");
const firstname = ref<string>("");
@ -114,9 +114,10 @@ const isActive = ref<string>("");
const getData = async () => {
showLoader();
await http
.get(config.API.relocationDetail(personId))
.get(config.API.relocationDetail(dataId))
.then((res: any) => {
const data = res.data.result;
profileId.value = data.profileId;
citizenId.value = data.citizenId;
fullname.value = `${data.prefix}${data.firstname} ${data.lastname}`;
prefixId.value = data.prefixId;
@ -205,7 +206,7 @@ const saveData = async () => {
};
showLoader();
await http
.put(config.API.relocationMainEdit(personId.toString()), body)
.put(config.API.relocationMainEdit(dataId), body)
.then((res: any) => {
// const data = res.data.result;
// console.log(data);
@ -221,35 +222,6 @@ const saveData = async () => {
});
};
// const confirmMessage = async () => {
// dialogMessage(
// $q,
// "ต้องการยืนยันส่งคำร้องไปยัง สกจ หรือไม่?",
// "ข้อมูลจะถูกนำส่งคำร้องไปยัง สกจ ทันที",
// "mdi-help-circle-outline",
// "ยืนยัน",
// "primary",
// () => sendConfirm(),
// undefined
// );
// };
// const sendConfirm = async () => {
// showLoader();
// await http
// .get(config.API.transferConfirmId(personId.toString()))
// .then((res: any) => {
// // const data = res.data.result;
// // console.log(data);
// success($q, "ส่งคำร้องข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await getData();
// hideLoader();
// });
// };
onMounted(async () => {
await getData();
});
@ -279,7 +251,7 @@ onMounted(async () => {
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${personId}`)"
@click="router.push(`/registry/${profileId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>

289
src/modules/05_placement/components/Repatriate/RepatriatebyId.vue
View file

@ -1,30 +1,14 @@
<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.go(-1)"
/>
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
รายละเอียดการส่งตัวกลับ {{ 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">{{ 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/${personId}`)"
/>
<q-btn outline color="blue" dense icon-right="mdi-open-in-new" class="q-px-sm" label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${personId}`)" />
</div>
<div class="col-12"><q-separator /></div>
<div class="row col-12 q-pa-md">
@ -63,11 +47,11 @@
<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 class="q-gutter-sm" v-if="!edit">
<q-btn
<!-- <q-btn
outline
color="primary"
dense
@ -76,27 +60,11 @@
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="conditionSave"
/>
<q-btn
outline
color="red"
dense
class="q-px-sm"
label="ยกเลิก"
style="width: 80px"
@click="cancelBtn"
/>
<q-btn outline color="public" dense class="q-px-sm" label="บันทึก" style="width: 80px" @click="conditionSave" />
<q-btn outline color="red" dense class="q-px-sm" label="ยกเลิก" style="width: 80px" @click="cancelBtn" />
</div>
</div>
<div class="col-12"><q-separator /></div>
@ -110,140 +78,64 @@
</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"
/>
<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 items-center">
<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="`${'ตำแหน่งประเภท'}`"
/>
<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 items-center">
<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="`${'ระดับ'}`"
/>
<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 items-center">
<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="`${'เลขที่'}`"
/>
<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 items-center">
<div class="col-12">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="salary"
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
hide-bottom-space
:label="`${'เงินเดือน'}`"
type="number"
/>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="salary" :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]" hide-bottom-space
:label="`${'เงินเดือน'}`" type="number" />
</div>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-6 col-sm-6 row items-center">
<div class="col-12">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="organization"
:rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]"
hide-bottom-space
:label="`${'โอนไปสังกัด'}`"
/>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="organization" :rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]" hide-bottom-space
:label="`${'โอนไปสังกัด'}`" />
</div>
</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"
>
<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"
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
:model-value="date !== null ? date2Thai(date) : null"
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
hide-bottom-space
:label="`${'ตั้งแต่วัน'}`"
>
: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 name="event" class="cursor-pointer" :style="edit
? 'color: var(--q-primary)'
: 'color: var(--q-grey)'
">
</q-icon>
</template>
</q-input>
@ -252,19 +144,9 @@
</div>
</div>
<div class="col-12">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="reason"
:rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
hide-bottom-space
:label="`${'หมายเหตุ '}`"
type="textarea"
/>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="reason" :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]" hide-bottom-space
:label="`${'หมายเหตุ '}`" type="textarea" />
</div>
</div>
</div>
@ -282,17 +164,13 @@ import config from "@/app.config";
import keycloak from "@/plugins/keycloak";
import type { QTableProps, QForm } from "quasar";
// import type {
// TypeFile,
// ResponseDataDetail,
// } from "@/modules/05_placement/interface/response/Transfer";
const $q = useQuasar();
const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const edit = ref<boolean>(false);
const personId = route.params.id as string;
const dataId = route.params.id as string;
const {
date2Thai,
dialogMessage,
@ -303,11 +181,9 @@ const {
dialogConfirm,
} = mixin;
const roleAdmin = ref<boolean>(false);
const myForm = ref<QForm | null>(null);
const name = ref<string>("นายสมคิด ยอดใจ");
const level = ref<string>("ชำนาญการพิเศษ");
const institution = ref<string>("ฝ่ายบริหารงานทั่วไป");
const personId = ref<string>("");
const fullname = ref<string>("");
const id = ref<string>("");
const prefix = ref<string>("");
@ -327,59 +203,16 @@ const positionLevelOld = ref<string>("");
const positionNumberOld = ref<string>("");
const organizationPositionOld = ref<string>("");
const isActive = ref<string>("");
// const responseData = ref<ResponseDataDetail>({
// createdAt: new Date(),
// date: new Date(),
// id: "",
// organization: "",
// organizationPositionOld: "",
// positionLevelOld: "",
// positionNumberOld: "",
// positionTypeOld: "",
// reason: "",
// salary: 0,
// status: "",
// });
// const rows = ref<TypeFile[]>([]);
// const columns = ref<QTableProps["columns"]>([
// {
// name: "no",
// align: "left",
// label: "ลำดับ",
// sortable: true,
// field: "no",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// },
// {
// name: "fileName",
// align: "left",
// label: "ชื่อไฟล์",
// sortable: true,
// field: "fileName",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// },
// {
// name: "btnMicrosoft",
// align: "right",
// label: "ปุ่ม",
// sortable: true,
// field: "btnMicrosoft",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// },
// ]);
const getData = async () => {
showLoader();
await http
.get(config.API.repatriationDetail(personId))
.get(config.API.repatriationDetail(dataId))
.then((res: any) => {
const data = res.data.result;
(fullname.value = `${data.prefix}${data.firstName} ${data.lastName}`),
(id.value = data.id);
personId.value = data.profileId;
prefix.value = data.prefix;
firstName.value = data.firstName;
lastName.value = data.lastName;
@ -399,19 +232,20 @@ const getData = async () => {
isActive.value = data.isActive;
})
.catch((e) => {
// messageError($q, e);
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
//
const conditionSave = async () => {
if (myForm.value !== null) {
myForm.value.validate().then((success: any) => {
@ -443,7 +277,7 @@ const saveData = async () => {
};
showLoader();
await http
.put(config.API.repatriationMainEdit(personId.toString()), body)
.put(config.API.repatriationMainEdit(dataId), body)
.then((res: any) => {
// const data = res.data.result;
// console.log(data);
@ -459,35 +293,6 @@ const saveData = async () => {
});
};
// const confirmMessage = async () => {
// dialogMessage(
// $q,
// "ต้องการยืนยันส่งคำร้องไปยัง สกจ หรือไม่?",
// "ข้อมูลจะถูกนำส่งคำร้องไปยัง สกจ ทันที",
// "mdi-help-circle-outline",
// "ยืนยัน",
// "primary",
// () => sendConfirm(),
// undefined
// );
// };
// const sendConfirm = async () => {
// showLoader();
// await http
// .get(config.API.transferConfirmId(personId.toString()))
// .then((res: any) => {
// // const data = res.data.result;
// // console.log(data);
// success($q, "ส่งคำร้องข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await getData();
// hideLoader();
// });
// };
onMounted(async () => {
await getData();
});
@ -497,11 +302,13 @@ onMounted(async () => {
border-radius: 5px;
height: 70px;
}
.text-top {
color: gray;
font-weight: 400;
padding-bottom: 3px;
}
.text-detail {
font-weight: 500;
}

12
src/modules/05_placement/components/Transfer/transferRegistry.vue
View file

@ -25,7 +25,7 @@
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${personId}`)"
@click="router.push(`/registry/${responseData.profileId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>
@ -380,7 +380,7 @@ const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const personId = route.params.id;
const dataId = route.params.id;
const {
date2Thai,
dialogMessage,
@ -405,6 +405,7 @@ const date = ref<Date | null>(null);
const reason = ref<string>("");
const responseData = ref<ResponseDataDetail>({
profileId: "",
avataPath: "",
createdAt: new Date(),
date: new Date(),
@ -462,7 +463,7 @@ onMounted(async () => {
const getData = async () => {
showLoader();
await http
.get(config.API.transferId(personId.toString()))
.get(config.API.transferId(dataId.toString()))
.then((res: any) => {
const data = res.data.result;
// console.log(data);
@ -476,6 +477,7 @@ const getData = async () => {
});
}
rows.value = list;
responseData.value.profileId = data.profileId;
responseData.value.createdAt = data.createdAt;
responseData.value.date =
data.date !== null ? new Date(data.date) : new Date();
@ -523,7 +525,7 @@ const confirmMessage = async () => {
const sendConfirm = async () => {
showLoader();
await http
.get(config.API.transferConfirmId(personId.toString()))
.get(config.API.transferConfirmId(dataId.toString()))
.then((res: any) => {
// const data = res.data.result;
// console.log(data);
@ -566,7 +568,7 @@ const saveData = async () => {
};
showLoader();
await http
.put(config.API.transferId(personId.toString()), body)
.put(config.API.transferId(dataId.toString()), body)
.then((res: any) => {
// const data = res.data.result;
// console.log(data);

291
src/modules/05_placement/components/helpgovernment/governmentDetail.vue
View file

@ -1,30 +1,14 @@
<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.go(-1)"
/>
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
รายละเอียดการช่วยราชการ {{ 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">{{ 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/${personId}`)"
/>
<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">
@ -67,40 +51,16 @@
</div>
<q-space />
<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"
/>
<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="conditionSave"
/>
<q-btn
outline
color="red"
dense
class="q-px-sm"
label="ยกเลิก"
style="width: 80px"
@click="cancelBtn"
/>
<q-btn outline color="public" dense class="q-px-sm" label="บันทึก" style="width: 80px" @click="conditionSave" />
<q-btn outline color="red" dense class="q-px-sm" label="ยกเลิก" style="width: 80px" @click="cancelBtn" />
</div>
</div>
<div class="col-12"><q-separator /></div>
<q-form ref="myForm">
<q-form ref="myForm " class="window-width">
<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 items-center">
@ -110,22 +70,12 @@
</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"
/>
<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 items-center">
<!-- <div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12">
<q-input
:class="getClass(edit)"
@ -189,61 +139,56 @@
type="number"
/>
</div>
</div>
</div> -->
<div class="col-12"><q-separator /></div>
<div class="col-xs-6 col-sm-6 row items-center">
<div class="col-xs-6 col-sm-4 row items-center">
<div class="col-12">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="organization"
:rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]"
hide-bottom-space
:label="`${'โอนไปสังกัด'}`"
/>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="organization" :rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]" hide-bottom-space
:label="`${'หน่วยงานที่ให้ช่วยราชการ'}`" />
</div>
</div>
<div class="col-xs-6 col-sm-6 row items-center">
<div class="col-xs-6 col-sm-4 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"
>
<datepicker menu-class-name="modalfix" :readonly="!edit" v-model="dateStart" :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"
:model-value="date !== null ? date2Thai(date) : null"
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
hide-bottom-space
:label="`${'ตั้งแต่วัน'}`"
>
<q-input :class="getClass(edit)" :outlined="edit" dense :readonly="!edit" lazy-rules :borderless="!edit"
:model-value="dateStart !== null ? date2Thai(dateStart) : 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 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-xs-6 col-sm-4 row items-center">
<div class="col-12">
<datepicker menu-class-name="modalfix" :readonly="!edit" v-model="dateEnd" :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 :readonly="!edit" :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
:model-value="dateEnd !== null ? date2Thai(dateEnd) : 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>
@ -252,19 +197,9 @@
</div>
</div>
<div class="col-12">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="reason"
:rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
hide-bottom-space
:label="`${'หมายเหตุ '}`"
type="textarea"
/>
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
v-model="reason" :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]" hide-bottom-space
:label="`${'หมายเหตุ '}`" type="textarea" />
</div>
</div>
</div>
@ -292,7 +227,7 @@ const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const edit = ref<boolean>(false);
const personId = route.params.id as string;
const dataId = route.params.id as string;
const {
date2Thai,
dialogConfirm,
@ -309,6 +244,7 @@ const level = ref<string>("ชำนาญการพิเศษ");
const institution = ref<string>("ฝ่ายบริหารงานทั่วไป");
const fullname = ref<string>("");
const id = ref<string>("");
const profileId = ref<string>("");
const prefix = ref<string>("");
const firstName = ref<string>("");
const lastName = ref<string>("");
@ -319,66 +255,24 @@ const createdAt = ref<string>("");
const organization = ref<string>("");
const reason = ref<string>("");
const status = ref<string>("");
const date = ref<Date | null>(null);
const dateStart = ref<Date | null>(null);
const dateEnd = ref<Date | null>(null);
const salary = ref<string>("");
const positionTypeOld = ref<string>("");
const positionLevelOld = ref<string>("");
const positionNumberOld = ref<string>("");
const organizationPositionOld = ref<string>("");
const isActive = ref<string>("");
// const responseData = ref<ResponseDataDetail>({
// createdAt: new Date(),
// date: new Date(),
// id: "",
// organization: "",
// organizationPositionOld: "",
// positionLevelOld: "",
// positionNumberOld: "",
// positionTypeOld: "",
// reason: "",
// salary: 0,
// status: "",
// });
// const rows = ref<TypeFile[]>([]);
// const columns = ref<QTableProps["columns"]>([
// {
// name: "no",
// align: "left",
// label: "ลำดับ",
// sortable: true,
// field: "no",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// },
// {
// name: "fileName",
// align: "left",
// label: "ชื่อไฟล์",
// sortable: true,
// field: "fileName",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// },
// {
// name: "btnMicrosoft",
// align: "right",
// label: "ปุ่ม",
// sortable: true,
// field: "btnMicrosoft",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// },
// ]);
const getData = async () => {
showLoader();
await http
.get(config.API.officerDetail(personId))
.get(config.API.officerDetail(dataId))
.then((res: any) => {
const data = res.data.result;
(fullname.value = `${data.prefix}${data.firstName} ${data.lastName}`),
(id.value = data.id);
profileId.value = data.profileId;
prefix.value = data.prefix;
firstName.value = data.firstName;
lastName.value = data.lastName;
@ -389,7 +283,8 @@ const getData = async () => {
organization.value = data.organization;
reason.value = data.reason;
status.value = data.status;
date.value = data.date;
dateStart.value = data.dateStart;
dateEnd.value = data.dateEnd;
salary.value = data.salary;
positionTypeOld.value = data.positionTypeOld;
positionLevelOld.value = data.positionLevelOld;
@ -412,19 +307,19 @@ const getClass = (val: boolean) => {
};
//
const conditionSave = async () => {
if (myForm.value !== null) {
myForm.value.validate().then((success: any) => {
if (success) {
dialogConfirm(
$q,
async () => await saveData(),
"ต้องการแก้ไขข้อมูลหรือไม่?",
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
);
}
});
}
};
// if (myForm.value !== null) {
// myForm.value.validate().then((success: any) => {
// if (success) {
dialogConfirm(
$q,
async () => await saveData(),
"ต้องการแก้ไขข้อมูลหรือไม่?",
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
);
}
// });
// }
// };
const cancelBtn = () => {
edit.value = !edit;
getData();
@ -434,7 +329,8 @@ const saveData = async () => {
organization: organization.value,
reason: reason.value,
organizationPositionOld: organizationPositionOld.value,
date: date.value,
dateStart: dateStart.value,
dateEnd: dateEnd.value,
positionTypeOld: positionTypeOld.value,
positionLevelOld: positionLevelOld.value,
positionNumberOld: posNo.value,
@ -442,7 +338,7 @@ const saveData = async () => {
};
showLoader();
await http
.put(config.API.officerMainEdit(personId.toString()), body)
.put(config.API.officerMainEdit(dataId), body)
.then((res: any) => {
// const data = res.data.result;
// console.log(data);
@ -458,35 +354,6 @@ const saveData = async () => {
});
};
// const confirmMessage = async () => {
// dialogMessage(
// $q,
// "ต้องการยืนยันส่งคำร้องไปยัง สกจ หรือไม่?",
// "ข้อมูลจะถูกนำส่งคำร้องไปยัง สกจ ทันที",
// "mdi-help-circle-outline",
// "ยืนยัน",
// "primary",
// () => sendConfirm(),
// undefined
// );
// };
// const sendConfirm = async () => {
// showLoader();
// await http
// .get(config.API.transferConfirmId(personId.toString()))
// .then((res: any) => {
// // const data = res.data.result;
// // console.log(data);
// success($q, "ส่งคำร้องข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await getData();
// hideLoader();
// });
// };
onMounted(async () => {
await getData();
});
@ -496,11 +363,13 @@ onMounted(async () => {
border-radius: 5px;
height: 70px;
}
.text-top {
color: gray;
font-weight: 400;
padding-bottom: 3px;
}
.text-detail {
font-weight: 500;
}

23
src/modules/05_placement/components/probation/MainDetail.vue
View file

@ -17,15 +17,6 @@ const TabsTemplate2Format2 = defineAsyncComponent(
const TabsTemplate3 = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/FormEvaluation/Template3.vue")
);
// const Tabs2 = defineAsyncComponent(
// () => import("@/modules/05_placement/components/probation/tabs/tabs2.vue")
// );
const Tabs3 = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/tabs/tabs3.vue")
);
const Tabs4 = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/tabs/tabs4.vue")
);
const router = useRouter();
const drawer = ref<boolean>(true);
@ -76,7 +67,7 @@ const activeTab = ref<string>("tab1");
</q-item-section> -->
<q-item-section>
แบบประเมินผล<br/>(ผู้บังคับบัญชา)
แบบประเมินผล<br />(ผู้บังคับบัญชา)
</q-item-section>
</q-item>
@ -87,7 +78,7 @@ const activeTab = ref<string>("tab1");
</q-item-section> -->
<q-item-section>
แบบประเมินผล<br/>(คณะกรรมการ)
แบบประเมินผล<br />(คณะกรรมการ)
</q-item-section>
</q-item>
@ -98,9 +89,15 @@ const activeTab = ref<string>("tab1");
</q-item-section> -->
<q-item-section>
แบบรายงาน<br/>การประเมินฯ
แบบรายงาน<br />การประเมินฯ
</q-item-section>
</q-item>
<q-item>
<q-item-section>
ผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ
</q-item-section>
</q-item>
</q-list>
</q-scroll-area>
</q-drawer>
@ -112,7 +109,7 @@ const activeTab = ref<string>("tab1");
</q-tab-panel>
<q-tab-panel name="tab2">
<TabsTemplate1 :activeTab="activeTab"/>
<TabsTemplate1 :activeTab="activeTab" />
</q-tab-panel>
<q-tab-panel name="tab3">

1
src/modules/05_placement/components/probation/ProbationDetail.vue
View file

@ -23,6 +23,7 @@
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${personalId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>

1
src/modules/05_placement/interface/response/Transfer.ts
View file

@ -27,6 +27,7 @@ interface TypeFile {
}
interface ResponseDataDetail {
profileId: string;
avataPath: string;
createdAt: Date;
date: Date;

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

@ -55,8 +55,8 @@ const relocationbyId = () => import("@/modules/05_placement/components/Relocatio
const receiveMain = () =>
import("@/modules/05_placement/components/Receive/receiveMain.vue");
const receiveDetail = () =>
import("@/modules/05_placement/components/Receive/receiveDetail.vue");
// const receiveDetail = () =>
// import("@/modules/05_placement/components/Receive/receiveDetail.vue");
const receiveDetail2 = () =>
import("@/modules/05_placement/components/Receive/receiveDetail2.vue");
const ReceiveAdd = () =>

123
src/modules/06_retirement/components/Discharged/dischargedRegistry.vue
View file

@ -25,7 +25,7 @@
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${personId}`)"
@click="router.push(`/registry/${responseData.personId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>
@ -66,88 +66,6 @@
</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 />
<q-btn
v-if="!roleAdmin"
outline
color="primary"
dense
icon-right="arrow_forward"
class="q-px-sm"
label="ส่งคำร้องไปยัง สกจ."
@click="confirmMessage"
/>
<q-btn
v-else
outline
color="primary"
dense
icon-right="download"
class="q-px-sm"
label="ดาวน์โหลด"
/>
</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-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">หน่วยงานที่ปลดออกไป</div>
<div class="col-12 text-detail">
{{ responseData.organization }}
</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">
{{ responseData.reason }}
</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>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12">
<d-table
:rows="rows"
:columns="columns"
row-key="fileName"
hide-header
hide-bottom
>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="fileName" :props="props">
{{ props.row.fileName }}
</q-td>
<q-td key="btnMicrosoft" :props="props">
<q-btn flat dense round color="red" icon="picture_as_pdf">
<q-tooltip>ไฟล์ PDF</q-tooltip>
</q-btn>
<q-btn flat dense round color="blue" icon="mdi-file-word">
<q-tooltip>ไฟล์ WORD</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</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">
@ -380,7 +298,7 @@ const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const personId = route.params.id;
const dataId = route.params.id.toString();
const {
date2Thai,
dialogMessage,
@ -404,6 +322,7 @@ const date = ref<Date | null>(null);
const reason = ref<string>("");
const responseData = ref<ResponseDataDetail>({
personId: "",
avataPath: "",
createdAt: new Date(),
date: new Date(),
@ -461,10 +380,11 @@ onMounted(async () => {
const getData = async () => {
showLoader();
await http
.get(config.API.dischargeByid(personId.toString()))
.get(config.API.dischargeByid(dataId))
.then((res: any) => {
const data = res.data.result;
responseData.value.personId = data.profileId;
responseData.value.createdAt = data.createdAt;
responseData.value.date =
data.date !== null ? new Date(data.date) : new Date();
@ -500,37 +420,6 @@ const getData = async () => {
});
};
const confirmMessage = async () => {
dialogMessage(
$q,
"ต้องการยืนยันส่งคำร้องไปยัง สกจ หรือไม่?",
"ข้อมูลจะถูกนำส่งคำร้องไปยัง สกจ ทันที",
"mdi-help-circle-outline",
"ยืนยัน",
"primary",
() => sendConfirm(),
undefined
);
};
const sendConfirm = async () => {
showLoader();
await http;
// .get(config.API.transferConfirmId(personId.toString()))
// .then((res: any) => {
// // const data = res.data.result;
// // console.log(data);
// success($q, "ส่งคำร้องข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await getData();
// hideLoader();
// });
};
const conditionSave = async () => {
if (myForm.value !== null) {
myForm.value.validate().then((success) => {
@ -563,7 +452,7 @@ const saveData = async () => {
};
showLoader();
await http
.put(config.API.dischargeByid(personId.toString()), body)
.put(config.API.dischargeByid(dataId), body)
.then((res: any) => {
// const data = res.data.result;
// console.log(data);

125
src/modules/06_retirement/components/DismissOrder/outRegistry.vue
View file

@ -25,7 +25,7 @@
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${personId}`)"
@click="router.push(`/registry/${responseData.personId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>
@ -66,88 +66,6 @@
</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 />
<q-btn
v-if="!roleAdmin"
outline
color="primary"
dense
icon-right="arrow_forward"
class="q-px-sm"
label="ส่งคำร้องไปยัง สกจ."
@click="confirmMessage"
/>
<q-btn
v-else
outline
color="primary"
dense
icon-right="download"
class="q-px-sm"
label="ดาวน์โหลด"
/>
</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-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">หน่วยงานที่ให้ออก</div>
<div class="col-12 text-detail">
{{ responseData.organization }}
</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">
{{ responseData.reason }}
</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>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12">
<d-table
:rows="rows"
:columns="columns"
row-key="fileName"
hide-header
hide-bottom
>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="fileName" :props="props">
{{ props.row.fileName }}
</q-td>
<q-td key="btnMicrosoft" :props="props">
<q-btn flat dense round color="red" icon="picture_as_pdf">
<q-tooltip>ไฟล์ PDF</q-tooltip>
</q-btn>
<q-btn flat dense round color="blue" icon="mdi-file-word">
<q-tooltip>ไฟล์ WORD</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</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">
@ -380,7 +298,7 @@ const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const personId = route.params.id;
const dataId = route.params.id.toString();
const {
date2Thai,
dialogMessage,
@ -404,6 +322,7 @@ const date = ref<Date | null>(null);
const reason = ref<string>("");
const responseData = ref<ResponseDataDetail>({
personId: "",
avataPath: "",
createdAt: new Date(),
date: new Date(),
@ -461,10 +380,11 @@ onMounted(async () => {
const getData = async () => {
showLoader();
await http
.get(config.API.outByid(personId.toString()))
.get(config.API.outByid(dataId))
.then((res: any) => {
const data = res.data.result;
responseData.value.personId = data.profileId;
responseData.value.createdAt = data.createdAt;
responseData.value.date =
data.date !== null ? new Date(data.date) : new Date();
@ -500,37 +420,6 @@ const getData = async () => {
});
};
const confirmMessage = async () => {
dialogMessage(
$q,
"ต้องการยืนยันส่งคำร้องไปยัง สกจ หรือไม่?",
"ข้อมูลจะถูกนำส่งคำร้องไปยัง สกจ ทันที",
"mdi-help-circle-outline",
"ยืนยัน",
"primary",
() => sendConfirm(),
undefined
);
};
const sendConfirm = async () => {
showLoader();
await http;
// .get(config.API.transferConfirmId(personId.toString()))
// .then((res: any) => {
// // const data = res.data.result;
// // console.log(data);
// success($q, "ส่งคำร้องข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await getData();
// hideLoader();
// });
};
const conditionSave = async () => {
if (myForm.value !== null) {
myForm.value.validate().then((success) => {
@ -563,7 +452,7 @@ const saveData = async () => {
};
showLoader();
await http
.put(config.API.outByid(personId.toString()), body)
.put(config.API.outByid(dataId), body)
.then((res: any) => {
// const data = res.data.result;
// console.log(data);

123
src/modules/06_retirement/components/Expulsion/expulsionRegistry.vue
View file

@ -25,7 +25,7 @@
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="router.push(`/registry/${personId}`)"
@click="router.push(`/registry/${responseData.personId}`)"
/>
</div>
<div class="col-12"><q-separator /></div>
@ -66,88 +66,6 @@
</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 />
<q-btn
v-if="!roleAdmin"
outline
color="primary"
dense
icon-right="arrow_forward"
class="q-px-sm"
label="ส่งคำร้องไปยัง สกจ."
@click="confirmMessage"
/>
<q-btn
v-else
outline
color="primary"
dense
icon-right="download"
class="q-px-sm"
label="ดาวน์โหลด"
/>
</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-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">หน่วยงานที่ไล่ออก</div>
<div class="col-12 text-detail">
{{ responseData.organization }}
</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">
{{ responseData.reason }}
</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>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12">
<d-table
:rows="rows"
:columns="columns"
row-key="fileName"
hide-header
hide-bottom
>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="fileName" :props="props">
{{ props.row.fileName }}
</q-td>
<q-td key="btnMicrosoft" :props="props">
<q-btn flat dense round color="red" icon="picture_as_pdf">
<q-tooltip>ไฟล์ PDF</q-tooltip>
</q-btn>
<q-btn flat dense round color="blue" icon="mdi-file-word">
<q-tooltip>ไฟล์ WORD</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</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">
@ -387,7 +305,7 @@ const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const personId = route.params.id;
const dataId = route.params.id.toString();
const {
date2Thai,
dialogMessage,
@ -411,6 +329,7 @@ const date = ref<Date | null>(null);
const reason = ref<string>("");
const responseData = ref<ResponseDataDetail>({
personId: "",
avataPath: "",
createdAt: new Date(),
date: new Date(),
@ -468,10 +387,11 @@ onMounted(async () => {
const getData = async () => {
showLoader();
await http
.get(config.API.expulsionByid(personId.toString()))
.get(config.API.expulsionByid(dataId))
.then((res: any) => {
const data = res.data.result;
responseData.value.personId = data.profileId;
responseData.value.createdAt = data.createdAt;
responseData.value.date =
data.date !== null ? new Date(data.date) : new Date();
@ -508,37 +428,6 @@ const getData = async () => {
});
};
const confirmMessage = async () => {
dialogMessage(
$q,
"ต้องการยืนยันส่งคำร้องไปยัง สกจ หรือไม่?",
"ข้อมูลจะถูกนำส่งคำร้องไปยัง สกจ ทันที",
"mdi-help-circle-outline",
"ยืนยัน",
"primary",
() => sendConfirm(),
undefined
);
};
const sendConfirm = async () => {
showLoader();
await http;
// .get(config.API.transferConfirmId(personId.toString()))
// .then((res: any) => {
// // const data = res.data.result;
// // console.log(data);
// success($q, "ส่งคำร้องข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await getData();
// hideLoader();
// });
};
const conditionSave = async () => {
if (myForm.value !== null) {
myForm.value.validate().then((success) => {
@ -571,7 +460,7 @@ const saveData = async () => {
};
showLoader();
await http
.put(config.API.expulsionByid(personId.toString()), body)
.put(config.API.expulsionByid(dataId), body)
.then((res: any) => {
// const data = res.data.result;
// console.log(data);

1
src/modules/06_retirement/interface/response/discharged.ts
View file

@ -27,6 +27,7 @@ interface TypeFile {
}
interface ResponseDataDetail {
personId: string;
avataPath: string;
createdAt: Date;
date: Date;

1
src/modules/06_retirement/interface/response/expulsion.ts
View file

@ -27,6 +27,7 @@ interface TypeFile {
}
interface ResponseDataDetail {
personId: string;
avataPath: string;
createdAt: Date;
date: Date;

43
src/modules/07_insignia/components/1_Proposals/listProposals.vue
View file

@ -20,6 +20,7 @@ const {
dateToISO,
showLoader,
hideLoader,
dialogConfirm,
} = mixin;
const route = useRoute();
const $q = useQuasar(); //ใช้ noti quasar
@ -232,6 +233,32 @@ const clickProposals = (file: string) => {
window.open(file);
}
};
const clickListInsignia = async (propsId: string) => {
dialogConfirm(
$q,
async () => {
await getRequest(propsId);
},
"ยืนยันการคำนวณราชชื่อผู้ได้รับเครื่องราช",
"ต้องการยืนยันการคำนวณราชชื่อผู้ได้รับเครื่องราชนี้หรือไม่ ?"
);
};
const getRequest = async (id: string) => {
showLoader();
await http
.get(config.API.requestInsignia(id))
.then((res) => {
console.log(res);
success($q, "ยืนยันสำเร็จ");
})
.catch((err) => {
console.log(err);
messageError($q, err);
})
.finally(async () => {
await fetchData();
});
};
// ค้นหาในตาราง
const filterKeyword = ref<string>("");
@ -338,6 +365,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
</q-th>
<q-th auto-width />
<q-th auto-width />
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
@ -390,6 +418,19 @@ const paginationLabel = (start: string, end: string, total: string) => {
@click="clickEdit(props.row)"
/>
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="primary"
@click="clickListInsignia(props.row.id)"
icon="mdi-account-star"
>
<q-tooltip>ผู้ได้รับเครื่องราชฯ</q-tooltip>
</q-btn>
</q-td>
<q-td auto-width>
<q-btn
dense
@ -436,8 +477,6 @@ const paginationLabel = (start: string, end: string, total: string) => {
</q-card>
</template>
<style lang="scss" scope>
.filter-card {
background-color: #f1f1f1b0;

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

@ -3,10 +3,14 @@ import { onMounted, ref, watch } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import type { QTableProps } from "quasar";
import { useInsigniaDataStore } from "@/modules/07_insignia/store";
import http from "@/plugins/http";
import config from "@/app.config";
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const $q = useQuasar();
const DataStore = useInsigniaDataStore();
const modalNote = ref<boolean>(false);
const organization = ref<number>(1);
@ -187,6 +191,39 @@ const titleModal = ref<string>("");
const actionModal = ref<string>("");
const person = ref<any>([]);
const props = defineProps({
tab: {
type: String,
},
roundId: {
type: String,
},
});
onMounted(async () => {
console.log(props);
organizationOptions.value = DataStore.optionsTypeOc;
console.log(organizationOptions.value);
await fecthInsignia();
});
const fecthInsignia = async () => {
for (const item of DataStore.optionsTypeOc) {
console.log(item.index);
// await http
// .get(
// config.API.insigniaList(props.roundId, item["id"], "officer", props.tab)
// )
// .then((res) => {
// console.log(res);
// })
// .catch((err) => {
// console.log(err);
// });
}
};
const clickAction = (props: any, action: string) => {
Note.value = "";
person.value = props;

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

@ -1,356 +1,33 @@
<script setup lang="ts">
import { onMounted, ref, useAttrs, reactive, watch } from "vue";
import type { QTableProps } from "quasar";
import type {
FormMainProbation,
FormMainProbation2,
} from "@/modules/05_placement/interface/request/Main";
import { onMounted, ref, watch } from "vue";
import { useQuasar } from "quasar";
import { useRouter } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
import DialogHeader from "@/modules/07_insignia/components/DialogHeader.vue";
import { useCounterMixin } from "@/stores/mixin";
import type { resMain } from "@/modules/06_retirement/interface/response/Main";
const yearOptions = reactive<any[]>([]);
import { useInsigniaDataStore } from "@/modules/07_insignia/store";
import cardTop from "@/modules/07_insignia/components/2_Manage/StatCard.vue";
import tab1 from "@/modules/07_insignia/components/2_Manage/Tab1.vue";
import tab2 from "@/modules/07_insignia/components/2_Manage/Tab2.vue";
import tab3 from "@/modules/07_insignia/components/2_Manage/Tab3.vue";
import tab4 from "@/modules/07_insignia/components/2_Manage/Tab4.vue";
const Note = ref<string>("");
const addNote = ref<boolean>(false);
const saveWriteNote = ref<any[]>([]);
const DataStore = useInsigniaDataStore();
const mixin = useCounterMixin();
const { messageError, date2Thai, showLoader, hideLoader, dialogMessage } =
mixin;
const router = useRouter();
const $q = useQuasar(); //ใช้ noti quasar
const modal = ref<boolean>(false);
const pagination = ref({
sortBy: "desc",
descending: false,
page: 1,
rowsPerPage: 10,
});
const round = ref<string>("รอบการเสนอพระราชทานเครื่องราชปี 2556");
const optionRound = [
"รอบการเสนอพระราชทานเครื่องราชปี 2557",
"รอบการเสนอพระราชทานเครื่องราชปี 2558",
"รอบการเสนอพระราชทานเครื่องราชปี 2556",
];
const visibleColumns = ref<string[]>([
"no",
"citizenId",
"name",
"position",
"level",
"salary",
"organization",
"insigniaType",
"insigniaSend",
"insigniaLevel",
"dateSend",
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
// หัวตาราง
const columns = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: true,
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: "name",
align: "left",
label: "ชื่อ-นามสกุล",
sortable: true,
field: "name",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "position",
align: "left",
label: "ตำแหน่ง",
sortable: true,
field: "position",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "level",
align: "left",
label: "อันดับ/ระดับ",
sortable: true,
field: "level",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "salary",
align: "left",
label: "เงินเดือน",
sortable: true,
field: "salary",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "organization",
align: "left",
label: "หน่วยงาน",
sortable: true,
field: "organization",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "insigniaType",
align: "left",
label: "ประเภทเครื่องราชฯ ปัจจุบัน",
sortable: true,
field: "insigniaType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "insigniaSend",
align: "left",
label: "ประเภทเครื่องราชฯ ที่ยื่นขอ",
sortable: true,
field: "insigniaSend",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "insigniaLevel",
align: "left",
label: "ชั้นเครื่องราชฯ",
sortable: true,
field: "insigniaLevel",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "dateSend",
align: "left",
label: "วันที่ยื่นขอ",
sortable: true,
field: "dateSend",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
const loading = ref<boolean>(false);
const round = ref<string>("");
const optionRound = ref<any>([]);
// const typeOc = ref<string>("kljkljk");
const optiontypeOc = ref<any>([]);
// ข้อมูลตาราง (จำลอง)
const rows = ref<any[]>([
{
no: "1",
citizenId: "1xxxxxxxxxx",
name: "นายใจดี ยอดใจ ",
position: "นักวิชาการพัสดุ",
level: "1",
salary: "15000",
organization: "บริหาร",
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
insigniaSend: "ตริตาภรณ์ช้างเผือก",
insigniaLevel: "ต่ำกว่าสายสะพาย",
dateSend: "31 ม.ค. 2566",
},
{
no: "2",
citizenId: "1xxxxxxxxxx",
name: "นายจักกริน บัณฑิต",
position: "นักวิชาการพัสดุ",
level: "ปฏิบัติการ",
salary: "15000",
organization: "บริหาร",
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
insigniaSend: "ตริตาภรณ์ช้างเผือก",
insigniaLevel: "ต่ำกว่าสายสะพาย",
dateSend: "31 ม.ค. 2566",
},
{
no: "3",
citizenId: "1xxxxxxxxxx",
name: "นางสาวกัณฐิมา กาฬสินธุ์",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
salary: "15000",
organization: "บริหาร",
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
insigniaSend: "ตริตาภรณ์ช้างเผือก",
insigniaLevel: "ต่ำกว่าสายสะพาย",
dateSend: "31 ม.ค. 2566",
},
{
no: "4",
citizenId: "1xxxxxxxxxx",
name: "นางสาวเมขลา กระจ่างมนตรี",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
salary: "15000",
organization: "บริหาร",
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
insigniaSend: "ตริตาภรณ์ช้างเผือก",
insigniaLevel: "ต่ำกว่าสายสะพาย",
dateSend: "31 ม.ค. 2566",
},
]);
// ข้อมูลตาราง (จำลอง)
const currentYear = new Date().getFullYear();
const tab = ref<any>("haveInsignia");
const visibleColumns2 = ref<string[]>(["no", "name", "retireNumber"]);
// หัวตาราง2
const columns2 = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: true,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "name",
align: "left",
label: "วันที่สร้าง",
sortable: true,
field: "name",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "retireNumber",
align: "left",
label: "จำนวนผู้เกษียณ",
sortable: true,
field: "total",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
// ข้อมูลตาราง (จำลอง)
const rows2 = ref<FormMainProbation2[]>([
{
no: "1",
name: "นายใจดี ยอดใจ ",
position: "นักวิชาการพัสดุ",
level: "ปฏิบัติการ",
institution: "กลุ่มงานโครงสร้างและอัตรากำลัง ๒",
},
{
no: "2",
name: "นายจักกริน บัณฑิต",
position: "นักวิชาการพัสดุ",
level: "ปฏิบัติการ",
institution: "กลุ่มงานโครงสร้างและอัตรากำลัง ๒",
},
{
no: "3",
name: "นางสาวกัณฐิมา กาฬสินธุ์",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
},
{
no: "4",
name: "นางสาวเมขลา กระจ่างมนตรี",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
},
{
no: "5",
name: "นางสาวฐิติรัตน์ พงษ์ศิริ",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
},
]);
const clickDelete = (id: string) => {
$q.dialog({
title: "ยืนยันการลบข้อมูล",
message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(async () => {})
.onCancel(() => {})
.onDismiss(() => {});
};
const clickNote = () => {
addNote.value = true;
};
const clickAdd = () => {
// modal.value = true;
$q.dialog({
title: "เพิ่มประกาศ",
message: "เลือกประกาศที่ต้องการเพิ่มข้อมูล",
options: {
type: "radio",
model: "opt1",
// inline: true
items: [
{ label: "ประกาศเพิ่มผู้เกษียณ", value: "ADD" },
{ label: "ประกาศแก้ไขข้อมูลผู้เกษียน", value: "EDIT" },
{ label: "ประกาศยกเลิกผู้เกษียณ", value: "REMOVE" },
],
},
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk((data) => {
console.log("option===>", data);
router.push(`/retirement/list/${type.value}/${currentYear}`);
})
.onCancel(() => {})
.onDismiss(() => {});
/* $q.dialog({
title: "ยืนยันการเพิ่มข้อมูลประกาศเกษียณ",
message: "ต้องการเพิ่มข้อมูลประกาศเกษียณใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(async () => {
router.push(`/retirement/list/${type.value}/${currentYear}`);
})
.onCancel(() => {})
.onDismiss(() => {}); */
};
const clickClose = async () => {
addNote.value = false;
};
const organization = ref<string>();
const organizationOptions = ref<any>([{ id: 1, name: "ทั้งหมด" }]);
const tab = ref<any>("pending");
const stat = ref<any>({
total: 0,
sendName: 0,
@ -358,54 +35,50 @@ const stat = ref<any>({
personSend: 0,
disclaim: 0,
});
onMounted(async () => {
console.log(DataStore.optionsTypeOc);
const saveNote = async () => {
if (saveWriteNote.value.length == 0) {
dialogMessage(
$q,
"ไม่สามารถบันทึกข้อมูลได้",
"กรุณาเพิ่มหมายเหตุ",
"warning",
undefined,
"orange",
undefined,
undefined,
true
);
return;
} else {
await saveTextNote();
}
await fecthlistRound();
await fecthType();
});
const fecthlistRound = async () => {
await http
.get(config.API.listRoundInsignia("insignia"))
.then((res: any) => {
optionRound.value = res.data.result.map((e: any) => ({
id: e.period_id,
year: e.period_year,
name: `รอบการเสนอพระราชทานเครื่องราช ${e.period_name} ปี ${e.period_year} `,
}));
console.log(optionRound.value);
// const lastIndex = optionRound.value.length;
const lastValue = optionRound.value[0];
round.value = lastValue.id.toString();
})
.catch((err) => {
console.log(err);
// messageError($q, err);
});
};
const saveTextNote = async () => {};
// ค้นหาในตาราง
const filterKeyword = ref<string>("");
const filterRef = ref<any>(null);
const resetFilter = () => {
filterKeyword.value = "";
filterRef.value.focus();
};
const filterKeyword2 = ref<string>("");
const filterRef2 = ref<any>(null);
const resetFilter2 = () => {
filterKeyword2.value = "";
filterRef2.value.focus();
};
const attrs = ref<any>(useAttrs());
const paging = ref<boolean>(true);
const paginationLabel = (start: string, end: string, total: string) => {
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
else return start + "-" + end + " ใน " + total;
};
const nextPage = (prop: any) => {
// console.log(prop.id);
router.push(`/retirement/listretire/${prop.id}/${type.value}`);
const fecthType = async () => {
await http
.get(config.API.typeOc())
.then((res) => {
console.log(res);
optiontypeOc.value = res.data.result.map((e: any) => ({
id: e.organizationId,
name: e.organizationName,
}));
console.log(typeof optiontypeOc.value);
DataStore.optionsTypeOc = optiontypeOc.value;
})
.catch((err) => {
console.log(err);
// messageError($q, err);
})
.finally(() => {
loading.value = true;
});
};
</script>
@ -417,7 +90,14 @@ const nextPage = (prop: any) => {
<div class="bg-grey-2 col-12 row items-center">
<div class="q-pl-sm q-mr-md text-weight-bold text-grey">รอบ</div>
<q-select borderless v-model="round" :options="optionRound" />
<q-select
borderless
v-model="round"
:options="optionRound"
map-options
option-value="id"
option-label="name"
/>
</div>
<div class="col-12 row bg-white">
<div class="fit q-px-md q-py-sm">
@ -447,7 +127,7 @@ const nextPage = (prop: any) => {
</div>
</q-card>
<q-card flat bordered class="col-12 q-mt-sm">
<q-card flat bordered class="col-12 q-mt-sm" v-if="loading">
<div class="row col-12">
<q-tabs
v-model="tab"
@ -458,242 +138,28 @@ const nextPage = (prop: any) => {
indicator-color="primary"
align="left"
>
<q-tab name="haveInsignia" label="ผู้ที่ได้รับพระราชทานเครื่องราชฯ" />
<q-tab name="personNotapply" label="คนที่ไม่ยื่นขอ" />
<q-tab name="personRemoved" label="คนที่ถูกลบออก" />
<q-tab name="nonInsignia" label="หน่วยงานที่ยังไม่ได้ส่งรายชื่อ" />
<q-tab name="pending" label="ผู้ที่ได้รับพระราชทานเครื่องราชฯ" />
<q-tab name="reject" label="คนที่ไม่ยื่นขอ" />
<q-tab name="delete" label="คนที่ถูกลบออก" />
<q-tab name="organization" label="หน่วยงานที่ยังไม่ได้ส่งรายชื่อ" />
</q-tabs>
</div>
<q-separator />
<q-tab-panels v-model="tab" animated>
<q-tab-panel name="haveInsignia">
<tab1 />
<q-tab-panel name="pending">
<tab1 :tab="tab" :roundId="round" />
</q-tab-panel>
<q-tab-panel name="personNotapply">
<tab2 />
<q-tab-panel name="reject">
<tab2 :tab="tab" />
</q-tab-panel>
<q-tab-panel name="personRemoved">
<tab3 />
<q-tab-panel name="delete">
<tab3 :tab="tab" />
</q-tab-panel>
<q-tab-panel name="nonInsignia">
<tab4 />
<q-tab-panel name="organization">
<tab4 :tab="tab" />
</q-tab-panel>
</q-tab-panels>
<!-- <div class="col-12 row q-pa-md">
<div class="row col-12">
<div class="row col-12 q-col-gutter-sm">
<q-select
v-model="organization"
label="หน่วยงาน"
dense
emit-value
map-options
:options="organizationOptions"
option-value="id"
option-label="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
style="min-width: 150px"
/>
<div>
<q-btn
@click="clickAdd()"
size="12px"
flat
round
color="add"
icon="mdi-plus"
>
<q-tooltip>เพิ่ม</q-tooltip>
</q-btn>
<q-btn size="md" icon="mdi-download" flat round color="primary">
<q-tooltip>ดาวน์โหลด</q-tooltip>
</q-btn> -->
<!-- <q-menu>
<q-list style="min-width: 100px">
<q-item clickable @click="clickAdd">
<q-item-section>ขรก.กทม.สามัญ</q-item-section>
</q-item>
<q-item clickable @click="clickAdd">
<q-item-section>ลูกจ้างประจำ</q-item-section>
</q-item>
</q-list>
</q-menu> -->
<!-- </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="ค้นหา"
>
<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"
/>
</div>
<div class="col-12 q-pt-sm">
<q-table
ref="table"
:columns="columns"
:rows="rows"
:filter="filterKeyword"
row-key="name"
flat
bordered
:paging="true"
dense
class="custom-header-table"
v-bind="attrs"
: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 auto-width />
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr
:props="props"
class="cursor-pointer"
@click="nextPage(props.row)"
>
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="citizenId" :props="props">
{{ props.row.citizenId }}
</q-td>
<q-td key="name" :props="props">
{{ props.row.name }}
</q-td>
<q-td key="position" :props="props">
{{ props.row.position }}
</q-td>
<q-td key="level" :props="props">
{{ props.row.level }}
</q-td>
<q-td key="salary" :props="props">
{{ props.row.salary }}
</q-td>
<q-td key="organization" :props="props">
{{ props.row.organization }}
</q-td>
<q-td key="insigniaType" :props="props">
{{ props.row.insigniaType }}
</q-td>
<q-td key="insigniaSend" :props="props">
{{ props.row.insigniaSend }}
</q-td>
<q-td key="insigniaLevel" :props="props">
{{ props.row.insigniaLevel }}
</q-td>
<q-td key="dateSend" :props="props">
{{ props.row.dateSend }}
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="blue"
@click="clickNote(props.row.id)"
icon="mdi-alert-circle-outline"
>
<q-tooltip>หมายเหตุ</q-tooltip>
</q-btn>
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="red"
@click="clickDelete(props.row.id)"
icon="mdi-delete"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</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>
</template>
</q-table>
</div>
</div>
</div> -->
</q-card>
<q-dialog v-model="addNote" persistent>
<q-card style="min-width: 350px">
<DialogHeader tittle="หมายเหตุ " :close="clickClose" />
<q-card-section class="q-pt-none">
<q-input
dense
type="textarea"
label="กรอกหมายเหตุ"
v-model="Note"
autofocus
@keyup.enter="addNote = false"
/>
</q-card-section>
<q-card-actions align="right" class="bg-white text-teal">
<q-btn label="บันทึก" @click="saveNote" color="public" />
</q-card-actions>
</q-card>
</q-dialog>
</template>
<style lang="scss" scope>

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

@ -1,5 +1,9 @@
import { defineStore } from "pinia";
import { ref, } from "vue";
export const useInsigniaDataStore = defineStore("insignia", () => {
return {};
let optionsTypeOc = ref<any>([]);
return {
optionsTypeOc
};
});

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

@ -7,62 +7,26 @@
<q-btn flat round color="primary" @click="clickAdd" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
</q-btn>
<q-btn
flat
round
color="primary"
icon="mdi-account-arrow-right"
@click="clickAddOrder"
/>
<q-btn flat round color="primary" icon="mdi-account-arrow-right" @click="clickAddOrder" />
<q-space />
<div class="items-center" style="display: flex">
<!-- ค้นหาข้อความใน table -->
<q-input
standout
dense
v-model="filter"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
class="q-ml-sm"
>
<q-input standout dense v-model="filter" ref="filterRef" outlined debounce="300" placeholder="ค้นหา"
style="max-width: 200px" class="q-ml-sm">
<template v-slot:append>
<q-icon v-if="filter == ''" name="search" />
<q-icon
v-if="filter !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
<q-icon v-if="filter !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
</template>
</q-input>
<!-- แสดงคอลัมน์ใน table -->
<q-select
v-model="visibleColumnsEmployeeTemp"
:display-value="$q.lang.table.columns"
multiple
outlined
dense
:options="columns"
options-dense
option-value="name"
map-options
emit-value
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
<q-select v-model="visibleColumnsEmployeeTemp" :display-value="$q.lang.table.columns" multiple outlined dense
:options="columns" options-dense option-value="name" map-options emit-value style="min-width: 150px"
class="gt-xs q-ml-sm" />
</div>
</div>
<div class="col-12 q-pt-sm">
<d-table
:rows="rows"
:columns="columns"
:visible-columns="visibleColumnsEmployeeTemp"
:filter="filter"
row-key="id"
>
<d-table :rows="rows" :columns="columns" :visible-columns="visibleColumnsEmployeeTemp" :filter="filter"
row-key="id">
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
@ -76,25 +40,13 @@
<q-td key="no" :props="props" @click="redirectToPage(props.row.id)">
{{ props.rowIndex + 1 }}
</q-td>
<q-td
key="fullname"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="fullname" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.fullname }}
</q-td>
<q-td
key="newAgency"
:props="props"
@click="redirectToPage(props.row.id)"
>
<div
class="col-12"
v-if="
props.row.draftOrganizationOrganization == null &&
props.row.draftPositionEmployee == null
"
>
<q-td key="newAgency" :props="props" @click="redirectToPage(props.row.id)">
<div class="col-12" v-if="props.row.draftOrganizationOrganization == null &&
props.row.draftPositionEmployee == null
">
<div class="text-weight-medium">
{{ "-" }}
</div>
@ -108,15 +60,8 @@
</div>
</div>
</q-td>
<q-td
key="currentAgency"
:props="props"
@click="redirectToPage(props.row.id)"
>
<div
class="col-12"
v-if="props.row.oc == null && props.row.position == null"
>
<q-td key="currentAgency" :props="props" @click="redirectToPage(props.row.id)">
<div class="col-12" v-if="props.row.oc == null && props.row.position == null">
<div class="text-weight-medium">
{{ "-" }}
</div>
@ -161,124 +106,53 @@
<q-td key="oc" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.oc }}
</q-td> -->
<q-td
key="amount"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="amount" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.amount }}
</q-td>
<q-td
key="govAge"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="govAge" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.govAge }}
</q-td>
<q-td
key="dateAppoint"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="dateAppoint" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.dateAppoint }}
</q-td>
<q-td
key="dateStart"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="dateStart" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.dateStart }}
</q-td>
<q-td
key="salaryDate"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="salaryDate" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.salaryDate }}
</q-td>
<q-td
key="refSalary"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="refSalary" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.refSalary }}
</q-td>
<q-td
key="age"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="age" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.age }}
</q-td>
<q-td
key="fullnameOld"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="fullnameOld" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.fullnameOld }}
</q-td>
<q-td
key="createdAt"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="createdAt" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.createdAt }}
</q-td>
<q-td
key="isLeave"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="isLeave" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.isLeave }}
</q-td>
<q-td
key="leaveDateOrder"
:props="props"
@click="redirectToPage(props.row.id)"
>
<q-td key="leaveDateOrder" :props="props" @click="redirectToPage(props.row.id)">
{{ props.row.leaveDateOrder }}
</q-td>
<q-td auto-width>
<q-btn
icon="mdi-dots-vertical"
size="12px"
color="grey-7"
flat
round
dense
>
<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: 160px">
<q-item
clickable
v-close-popup
@click="editDetail(props.row)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-icon
color="blue"
size="xs"
name="mdi-account-settings"
/>
<q-item clickable v-close-popup @click="editDetail(props.row)">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-icon color="blue" size="xs" name="mdi-account-settings" />
</q-item-section>
<q-item-section>กำหนดตำแหน่ง</q-item-section>
</q-item>
<q-separator />
<q-item
clickable
v-close-popup
@click="clickDelete(props.row.id)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-item clickable v-close-popup @click="clickDelete(props.row.id)">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
<q-item-section>ลบ</q-item-section>
@ -299,34 +173,16 @@
<DialogHeader tittle="กำหนดตำแหน่ง" :close="modalOpenClose" />
<q-separator />
<q-card-section class="q-pa-sm">
<d-table
:rows="rowsPosition"
:columns="columnsPosition"
row-key="id"
selection="single"
v-model:selected="selectedPosition"
:visible-columns="visibleColumnsPosition"
>
<d-table :rows="rowsPosition" :columns="columnsPosition" row-key="id" selection="single"
v-model:selected="selectedPosition" :visible-columns="visibleColumnsPosition">
<template v-slot:body-selection="scope">
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
<q-checkbox keep-color color="primary" dense v-model="scope.selected" />
</template>
</d-table>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="checkSave"
class="q-px-md"
><!-- icon="mdi-content-save-outline"
<q-btn dense unelevated label="บันทึก" color="public" @click="checkSave" class="q-px-md"><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
</q-card-actions>
@ -336,24 +192,14 @@
<!-- dialog ส่งรายชื่อไปออกคำสั่ง -->
<q-dialog v-model="modaladdOrder">
<q-card style="width: 900px; max-width: 80vw">
<DialogHeader
tittle="ส่งรายชื่อไปออกคำสั่ง"
:close="clickCloseSendModal"
/>
<DialogHeader tittle="ส่งรายชื่อไปออกคำสั่ง" :close="clickCloseSendModal" />
<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"
placeholder="ค้นหา"
style="width: 850px; max-width: auto"
>
<q-input borderless outlined dense debounce="300" v-model="filter" placeholder="ค้นหา"
style="width: 850px; max-width: auto">
<template v-slot:append>
<q-icon name="search" />
</template>
@ -362,32 +208,15 @@
</div>
</div>
<d-table
:rows="rowsOrder"
:columns="columnsOrder"
:visible-columns="visibleColumnsOrder"
:filter="filter"
row-key="id"
selection="single"
v-model:selected="selectedToOrder"
>
<d-table :rows="rowsOrder" :columns="columnsOrder" :visible-columns="visibleColumnsOrder" :filter="filter"
row-key="id" selection="single" v-model:selected="selectedToOrder">
<template v-slot:body-selection="scope">
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
<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-checkbox keep-color color="primary" dense v-model="props.selected" />
</q-td>
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
@ -449,7 +278,7 @@
</q-card-section>
<q-card-actions align="right" class="bg-white text-teal">
<q-btn label="บันทึก" @click="checkSaveOrder" color="public" />
<q-btn label="ส่งไปออกคำสั่ง" @click="checkSaveOrder" color="public" />
</q-card-actions>
</q-card>
</q-dialog>
@ -1168,8 +997,8 @@ const checkNull = (text: string) =>
text == null
? ""
: text == "00000000-0000-0000-0000-000000000000"
? ""
: text;
? ""
: text;
const getPosition = async (id: string) => {
showLoader();
@ -1251,7 +1080,7 @@ const getPosition = async (id: string) => {
const clickAddOrder = () => {
modaladdOrder.value = true;
const filteredRows = rowsOrder.value.filter(
(row) => row.positionEmployeePosition !== null
(row) => row.draftPositionEmployee !== null
);
rowsOrder.value = filteredRows;
};
@ -1259,8 +1088,8 @@ const clickAddOrder = () => {
const clickCloseSendModal = () => {
modaladdOrder.value = false;
};
const checkSave = () =>{
dialogConfirm($q,async() => await saveData())
const checkSave = () => {
dialogConfirm($q, async () => await saveData())
}
const saveData = async () => {
if (selectedPosition.value.length == 0) {
@ -1280,26 +1109,36 @@ const saveData = async () => {
await savePosition();
}
};
const checkSaveOrder = () =>{
dialogConfirm($q,async() => await SaveOrder())
const checkSaveOrder = () => {
dialogConfirm($q, () => SaveOrder())
}
const SaveOrder = async () => {
if (selectedToOrder.value.length == 0) {
dialogMessageNotify(
$q,
"ไม่สามารถบันทึกข้อมูลได้ กรุณาเลือกตำแหน่ง",
// "กรุณาเลือกตำแหน่ง",
// "warning",
// undefined,
// "orange",
// undefined,
// undefined,
// true
);
return;
} else {
await saveOrder();
}
// ส่งไปออกคำสั่ง
let pId: string[] = [];
selectedToOrder.value.forEach((e: any) => {
pId.push(e.id);
});
let data = {
id: pId,
};
console.log(data);
showLoader();
await http
.post(config.API.organizationEmployeeSendOrder, data)
.then((res: any) => {
// console.log(res);
success($q, "บันทึกสำเร็จ");
})
.catch((e: any) => {
// console.log(e);
messageError($q, e);
})
.finally(async () => {
hideLoader();
modaladdOrder.value = false;
await showEmployeeTemp();
selectedToOrder.value = [];
});
};
const savePosition = async () => {
@ -1321,25 +1160,6 @@ const savePosition = async () => {
});
};
const saveOrder = async () => {
// showLoader();
// const data = {
// organizationEmployeeId: selectedPosition.value[0].id,
// };
// await http
// .put(config.API.organizationEmployeePositionId(id.value), data)
// .then((res) => {
// success($q, "บันทึกข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await nodeTree();
// modalOpenClose();
// });
};
const modalOpenClose = () => {
modal.value = !modal.value;
if (!modal.value) {
@ -1349,9 +1169,9 @@ const modalOpenClose = () => {
}
};
const next = (id: string) => {
router.push(`/registry-employee/${id}`);
};
// const next = (id: string) => {
// router.push(`/registry-employee/${id}`);
// };
const resetFilter = () => {
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
@ -1359,31 +1179,12 @@ const resetFilter = () => {
filterRef.value!.focus();
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
const clickClose = async () => {
// if (editRow.value == true) {
// dialogMessage(
// $q,
// "ข้อมูลมีการแก้ไข",
// "ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?",
// "mdi-help-circle-outline",
// "ตกลง",
// "orange",
// () => (modal.value = false),
// undefined
// );
// } else {
modal.value = false;
// next.value = false;
// previous.value = false;
// }
};
// const getClass = (val: boolean) => {
// return {
// "full-width inputgreen cursor-pointer": val,
// "full-width cursor-pointer": !val,
// };
// };
const clickAdd = () => {
// modal.value = true;
@ -1404,24 +1205,24 @@ const editDetail = async (row: any) => {
};
const clickDelete = (id: string) =>{
dialogRemove($q,async () => await deleteData(id))
const clickDelete = (id: string) => {
dialogRemove($q, async () => await deleteData(id))
}
const deleteData = async(id: string) => {
showLoader();
await http
.delete(config.API.profileInforId(id))
.then((res) => {
success($q, "ลบข้อมูลการสอบสำเร็จ");
showEmployeeTemp();
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
})
const deleteData = async (id: string) => {
showLoader();
await http
.delete(config.API.profileInforId(id))
.then((res) => {
success($q, "ลบข้อมูลสำเร็จ");
showEmployeeTemp();
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
})
};
const nodeTree = async () => {
@ -1440,11 +1241,13 @@ const nodeTree = async () => {
.finally(async () => {
hideLoader();
await showEmployeeTemp();
await showEmployeeTempOrder();
// await showEmployeeTempOrder();
});
};
const showEmployeeTemp = async () => {
showLoader();
let cirteria = [];
cirteria.push({
@ -1457,8 +1260,7 @@ const showEmployeeTemp = async () => {
criteriaValue: "false",
});
if (selected.value == null || selected.value == "") return;
showLoader();
if (selected.value == null) return;
await http
.post(config.API.searchProfileTemp("all"), {
criterias: cirteria,
@ -1498,6 +1300,8 @@ const showEmployeeTemp = async () => {
draftPositionEmployee: e.draftPositionEmployee,
draftOrganizationOrganization: e.draftOrganizationOrganization,
});
rowsOrder.value = rows.value.filter((e: any) => e.draftPositionEmployee !== null);
});
})
.catch((e) => {
@ -1508,70 +1312,70 @@ const showEmployeeTemp = async () => {
});
};
const showEmployeeTempOrder = async () => {
let cirteria = [];
// const showEmployeeTempOrder = async () => {
// let cirteria = [];
cirteria.push({
criteriaType: "employee_class",
criteriaValue: "temp",
});
// cirteria.push({
// criteriaType: "employee_class",
// criteriaValue: "temp",
// });
cirteria.push({
criteriaType: "is_retire",
criteriaValue: "false",
});
// cirteria.push({
// criteriaType: "is_retire",
// criteriaValue: "false",
// });
if (selected.value == null || selected.value == "") return;
showLoader();
await http
.post(config.API.searchProfileTemp("all"), {
criterias: cirteria,
})
.then((res) => {
let data = res.data.result;
rowsOrder.value = [];
data.map((e: ResponseEmployeeTemp) => {
rowsOrder.value.push({
id: e.id,
fullname: e.fullname,
fullnameOld: e.fullnameOld,
position: e.position,
positionPathSide: e.positionPathSide,
positionLine: e.positionLine,
govAge: e.govAge,
positionEmployeePosition: e.positionEmployeePosition,
positionEmployeePositionSide: e.positionEmployeePositionSide,
positionEmployeeGroup: e.positionEmployeeGroup,
oc: e.oc,
age: e.age,
amount: e.amount == null ? "" : e.amount.toLocaleString(),
refSalary: e.refSalary,
dateAppoint:
e.dateAppoint == null ? null : date2Thai(new Date(e.dateAppoint)),
dateStart:
e.dateStart == null ? null : date2Thai(new Date(e.dateStart)),
createdAt:
e.createdAt == null ? null : date2Thai(new Date(e.createdAt)),
isLeave: e.isLeave == false ? "ครอง" : `${typeRetire(e.leaveReason)}`,
leaveDateOrder:
e.leaveDateOrder == null
? null
: date2Thai(new Date(e.leaveDateOrder)),
newAgency: "",
currentAgency: "",
draftPositionEmployee: e.draftPositionEmployee,
draftOrganizationOrganization: e.draftOrganizationOrganization,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
// console.log(rowsOrder);
});
};
// if (selected.value == null || selected.value == "") return;
// showLoader();
// await http
// .post(config.API.searchProfileTemp("all"), {
// criterias: cirteria,
// })
// .then((res) => {
// let data = res.data.result;
// rowsOrder.value = [];
// data.map((e: ResponseEmployeeTemp) => {
// rowsOrder.value.push({
// id: e.id,
// fullname: e.fullname,
// fullnameOld: e.fullnameOld,
// position: e.position,
// positionPathSide: e.positionPathSide,
// positionLine: e.positionLine,
// govAge: e.govAge,
// positionEmployeePosition: e.positionEmployeePosition,
// positionEmployeePositionSide: e.positionEmployeePositionSide,
// positionEmployeeGroup: e.positionEmployeeGroup,
// oc: e.oc,
// age: e.age,
// amount: e.amount == null ? "" : e.amount.toLocaleString(),
// refSalary: e.refSalary,
// dateAppoint:
// e.dateAppoint == null ? null : date2Thai(new Date(e.dateAppoint)),
// dateStart:
// e.dateStart == null ? null : date2Thai(new Date(e.dateStart)),
// createdAt:
// e.createdAt == null ? null : date2Thai(new Date(e.createdAt)),
// isLeave: e.isLeave == false ? "ครอง" : `${typeRetire(e.leaveReason)}`,
// leaveDateOrder:
// e.leaveDateOrder == null
// ? null
// : date2Thai(new Date(e.leaveDateOrder)),
// newAgency: "",
// currentAgency: "",
// draftPositionEmployee: e.draftPositionEmployee,
// draftOrganizationOrganization: e.draftOrganizationOrganization,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// hideLoader();
// // console.log(rowsOrder);
// });
// };
const onSelected = async (id: string) => {
// await fetchPositionNumber(id);

1414
src/modules/10_order/components/step/step01.vue
View file

File diff suppressed because it is too large Load diff

838
src/modules/10_order/components/step/step02.vue
View file

@ -1,4 +1,406 @@
div
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
import type { QInput } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import type { QTableProps, QForm } from "quasar";
import { useRoute } from "vue-router";
import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
import type { ResponseData } from "@/modules/05_placement/interface/response/Order";
import http from "@/plugins/http";
import config from "@/app.config";
const props = defineProps({
next: {
type: Function,
default: () => console.log("not function"),
},
previous: {
type: Function,
default: () => console.log("not function"),
},
});
const next = () => props.next();
const previous = () => props.previous();
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
const {
dialogMessageNotify,
dialogConfirm,
dialogRemove,
messageError,
showLoader,
hideLoader,
success,
} = mixin;
const route = useRoute();
const $q = useQuasar();
const modalData = ref<any>({
salaryAmount: null,
positionSalaryAmount: null,
mouthSalaryAmount: null,
});
const myForm = ref<QForm | null>(null);
const myFormAdd = ref<QForm | null>(null);
const modal = ref<boolean>(false);
const modalAdd = ref<boolean>(false);
const titleName = ref<string>("");
const filterRef = ref<QInput>();
const filter = ref<string>("");
const visibleColumns = ref<String[]>(["no", "idCard", "name", "education"]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
field: "no",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "idCard",
align: "left",
label: "เลขประจำตัวประชาชน",
field: "idCard",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "name",
align: "left",
label: "ชื่อ-สกุล",
field: "name",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "education",
align: "left",
label: "วุฒิการศึกษาในการออกคำสั่ง",
field: "education",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const rows = ref<ResponseData[]>([]);
const rows2 = ref<ResponseData[]>([]);
const selected = ref<ResponseData[]>([]);
onMounted(async () => {
await conditionData();
});
const conditionData = async () => {
const id = route.params.orderid
? route.params.orderid.toString()
: localStorage.getItem("orderId")
? localStorage.getItem("orderId")
: null;
if (id !== null) {
await getData(id);
}
};
const getData = async (id: string) => {
showLoader();
await http
.get(config.API.personsselectedOrder(id))
.then((res) => {
const data = res.data.result;
console.log(data);
let list: ResponseData[] = [];
data.map((r: ResponseData) => {
list.push({
education: r.education ?? "",
idCard: r.idCard ?? "",
name: r.name ?? "",
personalId: r.personalId ?? "",
selectStatus: r.selectStatus !== null ? r.selectStatus : false,
sequence: r.sequence !== null ? r.sequence : 0,
refRecordId: r.refRecordId,
salaryAmount: r.salaryAmount !== 0 ? r.salaryAmount : null,
positionSalaryAmount: r.positionSalaryAmount!== 0 ? r.positionSalaryAmount : null,
monthSalaryAmount: r.monthSalaryAmount!== 0 ? r.monthSalaryAmount : null,
});
});
// console.log("list", list);
rows.value = list;
selected.value = rows.value;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const dialogDeleteData = async (id: string) => {
dialogRemove($q, () => deleteData(id));
};
const deleteData = async (id: string) => {
await http
.delete(config.API.personsOrder(id))
.then((res) => {
// const data = res.data.result;
// console.log(res);
success($q, "ลบข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
await conditionData();
});
};
const swapUp = async (id: string) => {
// id = personalId
await http
.put(config.API.swapUpOrder(id))
.then((res) => {
// const data = res.data.result;
// console.log(res);
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await conditionData();
hideLoader();
});
};
const swapDown = async (id: string) => {
// id = personalId
await http
.put(config.API.swapDownOrder(id))
.then((res) => {
// const data = res.data.result;
// console.log(res);
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await conditionData();
hideLoader();
});
};
const upDown = async (value: any, up: boolean = true) => {
const indexCurrent = value.rowIndex;
if (up) {
await swapUp(value.row.personalId);
} else {
await swapDown(value.row.personalId);
}
};
const saveModal = () => {
if (myForm.value !== null) {
myForm.value.validate().then(async (result: boolean) => {
if (result) {
putSalary(modalData.value);
}
});
}
};
const personalId = ref<string>("");
const selectModal = (e: any) => {
console.log(e);
titleName.value = e.name;
personalId.value = e.personalId;
modalOpenClose(e.personalId);
};
const modalOpenClose = async (personalId: string) => {
modal.value = !modal.value;
if (!modal.value) {
titleName.value = "";
}
if (modal.value == true) {
await fetchSalary(personalId);
}
};
const fetchSalary = async (personalId: string) => {
console.log(personalId);
showLoader();
await http
.get(config.API.salaryOrder(personalId))
.then((res: any) => {
console.log(res);
const data = res.data.result;
modalData.value = {
salaryAmount: data.salaryAmount !== 0 ? data.salaryAmount:null,
positionSalaryAmount: data.positionSalaryAmount !== 0 ? data.salaryAmount:null,
mouthSalaryAmount: data.monthSalaryAmount !== 0 ? data.salaryAmount:null,
};
console.log("data", modalData.value);
})
.catch((e) => {
console.log(e);
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const putSalary = async (salary: any) => {
modalData.value = {
salaryAmount: Number(salary.salaryAmount),
positionSalaryAmount: Number(salary.positionSalaryAmount),
monthSalaryAmount: Number(salary.mouthSalaryAmount),
};
dialogConfirm($q, async () => {
showLoader();
await http
.put(config.API.salaryOrder(personalId.value), modalData.value)
.then((res: any) => {
// console.log(res);
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
// console.log(e);
messageError($q, e);
})
.finally(async () => {
await conditionData();
modal.value = false;
hideLoader();
});
});
};
const modalAddChange = async () => {
modalAdd.value = !modalAdd.value;
if (modalAdd.value == true) {
const id = route.params.orderid
? route.params.orderid.toString()
: localStorage.getItem("orderId")
? localStorage.getItem("orderId")
: null;
if (id !== null) {
await fetchaddlist(id);
}
} else await conditionData();
};
const fetchaddlist = async (id: string) => {
showLoader();
await http
.get(config.API.personsOrder(id))
.then((res) => {
const data = res.data.result;
console.log(data);
let list = [];
list = data.map((r: ResponseData) => ({
education: r.education ?? "",
idCard: r.idCard ?? "",
name: r.name ?? "",
personalId: r.personalId ?? "",
selectStatus: r.selectStatus !== null ? r.selectStatus : false,
sequence: r.sequence !== null ? r.sequence : 0,
refRecordId: r.refRecordId,
}));
rows2.value = list;
selected.value = rows.value;
// rows2.value = list.filter((e: any) => e.selectStatus === false);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const saveModalAdd = () => {
if (myFormAdd.value !== null) {
myFormAdd.value.validate().then(async (result: boolean) => {
if (result && selected.value.length !== 0) {
dialogConfirm(
$q,
() => {
let data = [];
data.push(...selected.value.map((e: any) => e.refRecordId));
addlist(data);
},
"ยืนยันการเพิ่มรายชื่อออกคำสั่ง",
"ต้องการยืนยันการเพิ่มรายชื่อออกคำสั่งนี้ใช่หรือไม่?"
);
}
});
}
};
const addlist = async (data: Object) => {
const id = route.params.orderid
? route.params.orderid.toString()
: localStorage.getItem("orderId")
? localStorage.getItem("orderId")
: null;
if (id !== null) {
await http
.post(config.API.personsOrder(id), data)
.then(() => {
success($q, "บันทึกสำเร็จ");
})
.catch((e: any) => {
console.log(e);
messageError($q, e);
})
.finally(() => {
modalAddChange();
});
}
};
const save = async () => {
// console.log("save===>", rows.value)
const check = rows.value.find((x:any) => x.salaryAmount==null);
if (selected.value.length > 0 && !check) {
dialogConfirm($q, () => {
success($q, "บันทึกข้อมูลสำเร็จ");
next();
});
} else if (check) {
dialogMessageNotify($q, "ระบุรายละเอียดการเงินไม่ครบ");
} else {
dialogMessageNotify($q, "กรุณาเลือกรายชื่อ");
}
};
const refresh = async () => {
// await conditionData();
modalAddChange();
selected.value = [];
};
const resetFilter = () => {
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
filter.value = "";
filterRef.value!.focus();
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>
<template>
<div>
<div class="q-py-md q-pl-md" style="height: 68vh; overflow-y: scroll">
@ -162,12 +564,8 @@ div
color="public"
@click="save"
class="q-px-md"
><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
>
</q-btn>
<!-- <q-btn dense flat round color="primary" icon="chevron_right" @click="next">
<q-tooltip>ต่อไป</q-tooltip>
</q-btn> -->
</div>
</div>
<!--********************************** เงินเดือน ********************************** -->
@ -311,431 +709,3 @@ div
</q-card>
</q-dialog>
</template>
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
import type { QInput } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import type { QTableProps, QForm } from "quasar";
import { useRoute } from "vue-router";
import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
import type { ResponseData } from "@/modules/05_placement/interface/response/Order";
import http from "@/plugins/http";
import config from "@/app.config";
const props = defineProps({
next: {
type: Function,
default: () => console.log("not function"),
},
previous: {
type: Function,
default: () => console.log("not function"),
},
});
const next = () => props.next();
const previous = () => props.previous();
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
const {
dialogMessageNotify,
dialogConfirm,
dialogRemove,
messageError,
showLoader,
hideLoader,
success,
} = mixin;
const route = useRoute();
const $q = useQuasar();
const salaryAmount = ref<number>();
const positionSalaryAmount = ref<number>();
const mouthSalaryAmount = ref<number>();
const modalData = ref<any>({
salaryAmount: null,
positionSalaryAmount: null,
mouthSalaryAmount: null,
});
const myForm = ref<QForm | null>(null);
const myFormAdd = ref<QForm | null>(null);
const modal = ref<boolean>(false);
const modalAdd = ref<boolean>(false);
const titleName = ref<string>("");
const filterRef = ref<QInput>();
const filter = ref<string>("");
const visibleColumns = ref<String[]>(["no", "idCard", "name", "education"]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
field: "no",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "idCard",
align: "left",
label: "เลขประจำตัวประชาชน",
field: "idCard",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "name",
align: "left",
label: "ชื่อ-สกุล",
field: "name",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "education",
align: "left",
label: "วุฒิการศึกษาในการออกคำสั่ง",
field: "education",
sortable: true,
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const rows = ref<ResponseData[]>([]);
const rows2 = ref<ResponseData[]>([]);
const selected = ref<ResponseData[]>([]);
onMounted(async () => {
await conditionData();
});
const conditionData = async () => {
const id = route.params.orderid
? route.params.orderid.toString()
: localStorage.getItem("orderId")
? localStorage.getItem("orderId")
: null;
if (id !== null) {
await getData(id);
}
};
const getData = async (id: string) => {
showLoader();
await http
.get(config.API.personsselectedOrder(id))
.then((res) => {
const data = res.data.result;
console.log(data);
let list: ResponseData[] = [];
data.map((r: ResponseData) => {
list.push({
education: r.education ?? "",
idCard: r.idCard ?? "",
name: r.name ?? "",
personalId: r.personalId ?? "",
selectStatus: r.selectStatus !== null ? r.selectStatus : false,
sequence: r.sequence !== null ? r.sequence : 0,
refRecordId: r.refRecordId,
salaryAmount: r.salaryAmount !== 0 ? r.salaryAmount : null,
positionSalaryAmount: r.positionSalaryAmount!== 0 ? r.positionSalaryAmount : null,
monthSalaryAmount: r.monthSalaryAmount!== 0 ? r.monthSalaryAmount : null,
});
});
console.log("list", list);
rows.value = list;
selected.value = rows.value;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
// const saveSalary = async (id: string) => {
// await http
// .put(config.API.salaryOrder(id))
// .then((res) => {
// // const data = res.data.result;
// // console.log(res);
// success($q, "บันทึกข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// hideLoader();
// });
// };
const dialogDeleteData = async (id: string) => {
dialogRemove($q, () => deleteData(id));
};
const deleteData = async (id: string) => {
await http
.delete(config.API.personsOrder(id))
.then((res) => {
// const data = res.data.result;
// console.log(res);
success($q, "ลบข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
await conditionData();
});
};
const swapUp = async (id: string) => {
// id = personalId
await http
.put(config.API.swapUpOrder(id))
.then((res) => {
// const data = res.data.result;
// console.log(res);
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await conditionData();
hideLoader();
});
};
const swapDown = async (id: string) => {
// id = personalId
await http
.put(config.API.swapDownOrder(id))
.then((res) => {
// const data = res.data.result;
// console.log(res);
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await conditionData();
hideLoader();
});
};
const upDown = async (value: any, up: boolean = true) => {
const indexCurrent = value.rowIndex;
if (up) {
await swapUp(value.row.personalId);
// rows.value[indexCurrent] = rows.value[indexCurrent - 1];
// rows.value[indexCurrent - 1] = value.row;
} else {
await swapDown(value.row.personalId);
// rows.value[indexCurrent] = rows.value[indexCurrent + 1];
// rows.value[indexCurrent + 1] = value.row;
}
};
const saveModal = () => {
if (myForm.value !== null) {
myForm.value.validate().then(async (result: boolean) => {
if (result) {
putSalary(modalData.value);
}
});
}
};
const personalId = ref<string>("");
const selectModal = (e: any) => {
console.log(e);
titleName.value = e.name;
personalId.value = e.personalId;
// modalData.value = {
// salaryAmount: 0,
// positionSalaryAmount: 0,
// mouthSalaryAmount: 0,
// };
modalOpenClose(e.personalId);
};
const modalOpenClose = async (personalId: string) => {
modal.value = !modal.value;
if (!modal.value) {
titleName.value = "";
}
if (modal.value == true) {
await fetchSalary(personalId);
}
};
const fetchSalary = async (personalId: string) => {
console.log(personalId);
showLoader();
await http
.get(config.API.salaryOrder(personalId))
.then((res: any) => {
console.log(res);
const data = res.data.result;
modalData.value = {
salaryAmount: data.salaryAmount !== 0 ? data.salaryAmount:null,
positionSalaryAmount: data.positionSalaryAmount !== 0 ? data.salaryAmount:null,
mouthSalaryAmount: data.monthSalaryAmount !== 0 ? data.salaryAmount:null,
};
console.log("data", modalData.value);
})
.catch((e) => {
console.log(e);
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const putSalary = async (salary: any) => {
modalData.value = {
salaryAmount: Number(salary.salaryAmount),
positionSalaryAmount: Number(salary.positionSalaryAmount),
monthSalaryAmount: Number(salary.mouthSalaryAmount),
};
dialogConfirm($q, async () => {
showLoader();
await http
.put(config.API.salaryOrder(personalId.value), modalData.value)
.then((res: any) => {
console.log(res);
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
console.log(e);
messageError($q, e);
})
.finally(async () => {
await conditionData();
modal.value = false;
hideLoader();
});
});
};
const modalAddChange = async () => {
modalAdd.value = !modalAdd.value;
if (modalAdd.value == true) {
const id = route.params.orderid
? route.params.orderid.toString()
: localStorage.getItem("orderId")
? localStorage.getItem("orderId")
: null;
if (id !== null) {
await fetchaddlist(id);
}
} else await conditionData();
};
const fetchaddlist = async (id: string) => {
showLoader();
await http
.get(config.API.personsOrder(id))
.then((res) => {
const data = res.data.result;
console.log(data);
let list = [];
list = data.map((r: ResponseData) => ({
education: r.education ?? "",
idCard: r.idCard ?? "",
name: r.name ?? "",
personalId: r.personalId ?? "",
selectStatus: r.selectStatus !== null ? r.selectStatus : false,
sequence: r.sequence !== null ? r.sequence : 0,
refRecordId: r.refRecordId,
}));
rows2.value = list;
selected.value = rows.value;
// rows2.value = list.filter((e: any) => e.selectStatus === false);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const saveModalAdd = () => {
if (myFormAdd.value !== null) {
myFormAdd.value.validate().then(async (result: boolean) => {
if (result && selected.value.length !== 0) {
dialogConfirm(
$q,
() => {
let data = [];
data.push(...selected.value.map((e: any) => e.refRecordId));
addlist(data);
},
"ยืนยันการเพิ่มรายชื่อออกคำสั่ง",
"ต้องการยืนยันการเพิ่มรายชื่อออกคำสั่งนี้ใช่หรือไม่?"
);
}
});
}
};
const addlist = async (data: Object) => {
const id = route.params.orderid
? route.params.orderid.toString()
: localStorage.getItem("orderId")
? localStorage.getItem("orderId")
: null;
if (id !== null) {
await http
.post(config.API.personsOrder(id), data)
.then(() => {
success($q, "บันทึกสำเร็จ");
})
.catch((e: any) => {
console.log(e);
messageError($q, e);
})
.finally(() => {
modalAddChange();
});
}
};
const click = (e: any) => {
console.log(e);
console.log(rows.value.length);
};
const save = () => {
if (selected.value.length > 0) {
dialogConfirm($q, () => {
success($q, "บันทึกข้อมูลสำเร็จ");
next();
});
} else {
dialogMessageNotify($q, "กรุณาเลือกรายชื่อ");
}
};
const refresh = async () => {
// await conditionData();
modalAddChange();
selected.value = [];
};
const resetFilter = () => {
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
filter.value = "";
filterRef.value!.focus();
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>
<style lang="scss"></style>

624
src/modules/10_order/components/step/step03.vue
View file

@ -1,314 +1,3 @@
<template>
<div>
<div class="q-py-md q-pl-md" style="height: 68vh; overflow-y: scroll">
<div class="col-12 row q-py-sm items-center">
<q-btn flat round color="primary" @click="clickAdd" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
</q-btn>
<q-space />
<div class="items-center" style="display: flex">
<!-- ค้นหาข้อความใน table -->
<q-input
standout
dense
v-model="filter"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
class="q-ml-sm"
>
<template v-slot:append>
<q-icon v-if="filter == ''" name="search" />
<q-icon
v-if="filter !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<!-- แสดงคอลัมน์ใน table -->
<q-select
v-model="visibleColumns"
:display-value="$q.lang.table.columns"
multiple
outlined
dense
:options="columns"
options-dense
option-value="name"
map-options
emit-value
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</div>
</div>
<q-form ref="myForm">
<d-table
:rows="rows"
:columns="columns"
:visible-columns="visibleColumns"
:filter="filter"
row-key="idCard"
>
<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">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="idCard" :props="props">
{{ props.row.idCard }}
</q-td>
<q-td key="name" :props="props">
{{ props.row.name }}
</q-td>
<q-td key="position" :props="props">
{{ props.row.position }}
</q-td>
<q-td key="unit" :props="props">
{{ props.row.unit }}
</q-td>
<q-td key="send" :props="props">
<q-select
:class="getClass(true)"
hide-bottom-space
multiple
:outlined="true"
dense
lazy-rules
v-model="props.row.mutiselect"
:rules="[(val:any) => !!val || `${'กรุณาเลือกช่องทางการส่งสำเนา'}`,(val:any) => val.length > 0 || `${'กรุณาเลือกช่องทางการส่งสำเนา'}`]"
:label="`${'เลือกช่องทางการส่งสำเนา'}`"
emit-value
map-options
option-label="name"
:options="optionSelect"
option-value="id"
input-debounce="0"
color="primary"
@update:model-value="() => updateData(props.row)"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-black">
ไม่พบข้อมูลที่ค้นหา
</q-item-section>
</q-item>
</template>
</q-select>
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="red"
@click="clickDelete(props.row.personalId)"
icon="mdi-delete"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</q-form>
</div>
<q-separator />
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-btn
dense
outline
color="primary"
icon="chevron_left"
@click="previous"
class="q-pr-md"
label="เลือกรายชื่อ"
>
</q-btn>
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="saveDataCopyOrder"
class="q-px-md"
><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
<!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
<q-tooltip>ต่อไป</q-tooltip>
</q-btn> -->
</div>
</div>
<q-dialog v-model="modal" persistent full-width>
<q-card>
<DialogHeader tittle="เลือกรายชื่อตามหน่วยงาน" :close="clickClose" />
<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-5 row">
<q-card flat bordered class="fit q-pa-sm">
<q-scroll-area visible style="height: 70vh">
<q-input
outlined
dense
v-model="search"
placeholder="ค้นหา"
class="q-mb-sm"
>
<template v-slot:append>
<q-icon name="mdi-magnify" />
</template>
</q-input>
<q-tree
:nodes="nodesTree"
dense
node-key="id"
v-model:selected="selected"
v-model:expanded="expanded"
no-selection-unset
selected-color="primary"
@update:selected="onSelected"
default-expand-all
/>
</q-scroll-area>
</q-card>
</div>
<div class="col-xs-12 col-sm-7">
<div class="col-12 row q-py-sm items-center">
<q-space />
<div class="items-center" style="display: flex">
<q-input
standout
dense
v-model="filterModal"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
class="q-ml-sm"
>
<template v-slot:append>
<q-icon v-if="filterModal == ''" name="search" />
<q-icon
v-if="filterModal !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select
v-model="visibleColumnsModal"
:display-value="$q.lang.table.columns"
multiple
outlined
dense
:options="columnsModal"
options-dense
option-value="name"
map-options
emit-value
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</div>
</div>
<d-table
:rows="rowsModal"
:columns="columnsModal"
:visible-columns="visibleColumnsModal"
:filter="filterModal"
row-key="profileId"
selection="multiple"
v-model:selected="selectedModal"
>
<template v-slot:header-selection="scope">
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
</template>
<template v-slot:body-selection="scope">
<!-- <q-checkbox
keep-color
color="primary"
dense
:model-value="scope.selected"
@update:model-value="
(val, evt) => {
Object.getOwnPropertyDescriptor(scope, 'selected').set(
val,
evt
);
}
"
/> -->
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
</template>
<template v-slot:body-cell="props">
<q-td :props="props">
<div v-if="props.col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else>
{{ props.value }}
</div>
</q-td>
</template>
</d-table>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<!-- <q-btn
flat
round
color="public"
icon="mdi-content-save-outline"
@click="clickClose"
>
<q-tooltip>บันทึก</q-tooltip>
</q-btn> -->
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="saveData"
class="q-px-md"
/>
</q-card-actions>
</q-card>
</q-dialog>
</template>
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
@ -698,4 +387,315 @@ const updateData = (row: DataCopyOrder) => {
editRows.value.push(row);
};
</script>
<style lang="scss"></style>
<template>
<div>
<div class="q-py-md q-pl-md" style="height: 68vh; overflow-y: scroll">
<div class="col-12 row q-py-sm items-center">
<q-btn flat round color="primary" @click="clickAdd" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
</q-btn>
<q-space />
<div class="items-center" style="display: flex">
<!-- ค้นหาข้อความใน table -->
<q-input
standout
dense
v-model="filter"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
class="q-ml-sm"
>
<template v-slot:append>
<q-icon v-if="filter == ''" name="search" />
<q-icon
v-if="filter !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<!-- แสดงคอลัมน์ใน table -->
<q-select
v-model="visibleColumns"
:display-value="$q.lang.table.columns"
multiple
outlined
dense
:options="columns"
options-dense
option-value="name"
map-options
emit-value
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</div>
</div>
<q-form ref="myForm">
<d-table
:rows="rows"
:columns="columns"
:visible-columns="visibleColumns"
:filter="filter"
row-key="idCard"
>
<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">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="idCard" :props="props">
{{ props.row.idCard }}
</q-td>
<q-td key="name" :props="props">
{{ props.row.name }}
</q-td>
<q-td key="position" :props="props">
{{ props.row.position }}
</q-td>
<q-td key="unit" :props="props">
{{ props.row.unit }}
</q-td>
<q-td key="send" :props="props">
<q-select
:class="getClass(true)"
hide-bottom-space
multiple
:outlined="true"
dense
lazy-rules
v-model="props.row.mutiselect"
:rules="[(val:any) => !!val || `${'กรุณาเลือกช่องทางการส่งสำเนา'}`,(val:any) => val.length > 0 || `${'กรุณาเลือกช่องทางการส่งสำเนา'}`]"
:label="`${'เลือกช่องทางการส่งสำเนา'}`"
emit-value
map-options
option-label="name"
:options="optionSelect"
option-value="id"
input-debounce="0"
color="primary"
@update:model-value="() => updateData(props.row)"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-black">
ไม่พบข้อมูลที่ค้นหา
</q-item-section>
</q-item>
</template>
</q-select>
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="red"
@click="clickDelete(props.row.personalId)"
icon="mdi-delete"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</q-form>
</div>
<q-separator />
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-btn
dense
outline
color="primary"
icon="chevron_left"
@click="previous"
class="q-pr-md"
label="เลือกรายชื่อ"
>
</q-btn>
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="saveDataCopyOrder"
class="q-px-md"
><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
<!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
<q-tooltip>ต่อไป</q-tooltip>
</q-btn> -->
</div>
</div>
<q-dialog v-model="modal" persistent full-width>
<q-card>
<DialogHeader tittle="เลือกรายชื่อตามหน่วยงาน" :close="clickClose" />
<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-5 row">
<q-card flat bordered class="fit q-pa-sm">
<q-scroll-area visible style="height: 70vh">
<q-input
outlined
dense
v-model="search"
placeholder="ค้นหา"
class="q-mb-sm"
>
<template v-slot:append>
<q-icon name="mdi-magnify" />
</template>
</q-input>
<q-tree
:nodes="nodesTree"
dense
node-key="id"
v-model:selected="selected"
v-model:expanded="expanded"
no-selection-unset
selected-color="primary"
@update:selected="onSelected"
default-expand-all
/>
</q-scroll-area>
</q-card>
</div>
<div class="col-xs-12 col-sm-7">
<div class="col-12 row q-py-sm items-center">
<q-space />
<div class="items-center" style="display: flex">
<q-input
standout
dense
v-model="filterModal"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
class="q-ml-sm"
>
<template v-slot:append>
<q-icon v-if="filterModal == ''" name="search" />
<q-icon
v-if="filterModal !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select
v-model="visibleColumnsModal"
:display-value="$q.lang.table.columns"
multiple
outlined
dense
:options="columnsModal"
options-dense
option-value="name"
map-options
emit-value
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</div>
</div>
<d-table
:rows="rowsModal"
:columns="columnsModal"
:visible-columns="visibleColumnsModal"
:filter="filterModal"
row-key="profileId"
selection="multiple"
v-model:selected="selectedModal"
>
<template v-slot:header-selection="scope">
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
</template>
<template v-slot:body-selection="scope">
<!-- <q-checkbox
keep-color
color="primary"
dense
:model-value="scope.selected"
@update:model-value="
(val, evt) => {
Object.getOwnPropertyDescriptor(scope, 'selected').set(
val,
evt
);
}
"
/> -->
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
</template>
<template v-slot:body-cell="props">
<q-td :props="props">
<div v-if="props.col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else>
{{ props.value }}
</div>
</q-td>
</template>
</d-table>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<!-- <q-btn
flat
round
color="public"
icon="mdi-content-save-outline"
@click="clickClose"
>
<q-tooltip>บันทึก</q-tooltip>
</q-btn> -->
<q-btn
dense
unelevated
label="บันทึก"
color="public"
@click="saveData"
class="q-px-md"
/>
</q-card-actions>
</q-card>
</q-dialog>
</template>

537
src/modules/10_order/components/step/step04.vue
View file

@ -1,3 +1,238 @@
<script setup lang="ts">
import { ref, onMounted, onUnmounted, computed, watch } from "vue";
import { VuePDF, usePDF } from "@tato30/vue-pdf";
import type { PDFDocumentLoadingTask } from "pdfjs-dist/types/src/display/api";
import type { QForm } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import { useRoute } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
const mixin = useCounterMixin();
const { date2Thai, messageError, showLoader, hideLoader, dialogConfirm } = mixin;
const route = useRoute();
const $q = useQuasar();
const orderId_params = route.params.orderid;
const dialog = ref<boolean>(false);
const dialogFileUpload = ref<boolean>(false);
const splitterModel = ref<number>(70);
const tab = ref<string>("main");
const order = ref<string>("");
const years = ref<number>(new Date().getDate());
const date = ref<Date>(new Date());
const fileOrder = ref<any>(null);
const fileTailer = ref<any>(null);
const OrderPDF = ref<string>("");
const TailerPDF = ref<string>("");
const OrderPDFUpload = ref<string>("");
const TailerPDFUpload = ref<string>("");
const statusOrder = ref<string>();
const orderId = ref<string>(orderId_params.toString());
onMounted(async () => {
if (orderId.value) {
fetchAttachment(orderId.value);
fecthstatusOrder(orderId.value);
}
});
const fetchAttachment = async (orderId: string) => {
showLoader();
await http
.get(config.API.attachmentOrder(orderId))
.then(async (res) => {
let response = res.data.result;
// console.log(response);
order.value = response.orderNo;
years.value = Number(response.orderYear);
if (response.date !== undefined) {
date.value = response.date;
}
if (response.orderFileUrl !== null) {
// OrderPDF.value = response.orderFileUrl;
OrderPDFUpload.value = response.orderFileUrl;
viewPDF(OrderPDF.value);
}
if (response.attachmentFileUrl !== null) {
// TailerPDF.value = response.attachmentFileUrl;
TailerPDFUpload.value = response.attachmentFileUrl;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const fecthstatusOrder = async (orderId: string) => {
await http
.get(config.API.orderReady(orderId))
.then((res) => {
let status = res.data.result;
statusOrder.value = status.result;
})
.catch((e) => {
console.log(e);
});
};
const viewPDF = async (pdf: string) => {
const pdfData = await usePDF(`${pdf}`);
showLoader();
setTimeout(() => {
pdfSrc.value = pdfData.pdf.value;
numOfPages.value = pdfData.pages.value;
hideLoader();
}, 1500);
};
const viewPDFUpload = async (pdf: string) => {
const pdfData = await usePDF(`${pdf}`);
showLoader();
setTimeout(() => {
pdfFileUploadSrc.value = pdfData.pdf.value;
numOfPages.value = pdfData.pages.value;
hideLoader();
}, 1500);
};
watch(tab, () => {
// console.log(tab.value);
if (tab.value === "main") {
viewPDF(OrderPDF.value);
}
if (tab.value === "second") {
viewPDF(TailerPDF.value);
}
});
const pdfSrc = ref<PDFDocumentLoadingTask | undefined>();
const pdfFileUploadSrc = ref<PDFDocumentLoadingTask | undefined>();
const numOfPages = ref<number>(0);
const page = ref<number>(1);
const vuePDFRef = ref<any>(null);
const myForm = ref<QForm | null>(null);
const props = defineProps({
next: {
type: Function,
default: () => console.log("not function"),
},
previous: {
type: Function,
default: () => console.log("not function"),
},
});
// const next = () => props.next();
const previous = () => props.previous();
const onchangePage = (val: any) => {
// console.log(val);
if (vuePDFRef !== null) {
vuePDFRef.value.reload();
}
};
const save = () => {
if (myForm.value !== null) {
myForm.value!.validate().then((success: Boolean) => {
if (success) {
dialogConfirm(
$q,
async () => {
await putOrderData();
await postfileOrder();
await postfileTailer();
await fetchAttachment(orderId.value);
await fecthstatusOrder(orderId.value);
},
);
}
});
}
};
const putOrderData = async () => {
const orderData = {
orderNo: order.value,
orderYear: years.value.toString(),
signDate: date.value,
};
await http
.put(config.API.attachmentOrder(orderId.value), orderData)
.then((res) => {
console.log(res);
})
.catch((e) => {
console.log(e);
});
};
const postfileOrder = async () => {
const formData = new FormData();
formData.append("File", fileOrder.value);
await http.post(config.API.attachmentOrderId(orderId.value), formData).then(() => {
// fileOrder.value = null
});
};
const postfileTailer = async () => {
const formData = new FormData();
formData.append("File", fileTailer.value);
await http.post(config.API.attachmentFileId(orderId.value), formData).then(() => { //fileTailer.value = null
});
};
const clickExecute = async (id: string) => {
dialogConfirm(
$q,
async () => {
await http
.put(config.API.executeOrder(id))
.then((res) => {
console.log(res);
})
.catch((e) => {
messageError($q, e);
});
},
"ยืนยันการออกคำสั่ง",
"ต้องการยืนยันการออกคำสั่งนี้ใช่หรือไม่?",
);
};
const validateForm = () => {
return (
fileOrder.value !== null &&
fileOrder.value !== null &&
order.value.trim() !== ""
);
};
const getClass = (val: boolean) => {
return {
"card-header-active q-px-lg q-py-md cursor-pointer": val,
"card-header q-px-lg q-py-md cursor-pointer": !val,
};
};
const setTab = (val: string) => {
tab.value = val;
page.value = 1;
};
const viewFileUpload = async (url: string) => {
pdfFileUploadSrc.value = undefined
await viewPDFUpload(url);
dialogFileUpload.value = true
}
</script>
<template>
<div>
<div style="min-height: 70vh">
@ -6,7 +241,7 @@
<div class="space">
<div @click="setTab('main')" :class="getClass(tab == 'main')">
<div class="q-pr-sm">คำสั่ง</div>
<q-btn v-show="OrderPDF == ''" size="12px" flat dense icon="mdi-download" :disable="tab !== 'main'"
<q-btn size="12px" flat dense icon="mdi-download" :disable="tab !== 'main'"
:color="tab !== 'main' ? 'grey' : 'add'">
<q-tooltip>ดาวน์โหลด</q-tooltip>
<q-menu>
@ -25,8 +260,8 @@
</div>
<div @click="setTab('second')" :class="getClass(tab == 'second')">
<div class="q-pr-sm">เอกสารแนบท้าย</div>
<q-btn v-show="TailerPDF == ''" size="12px" flat dense :color="tab !== 'second' ? 'grey' : 'add'"
icon="mdi-download" :disable="tab !== 'second'">
<q-btn size="12px" flat dense :color="tab !== 'second' ? 'grey' : 'add'" icon="mdi-download"
:disable="tab !== 'second'">
<q-tooltip>ดาวน์โหลด</q-tooltip>
<q-menu>
<q-list style="min-width: 150px">
@ -92,8 +327,17 @@
<div class="q-gutter-y-md q-mb-md">
<div>
<label class="text-file">คำสั่ง</label>
<div class="text-right">
<q-btn size="12px" flat dense color="primary" icon="mdi-eye"
@click="viewFileUpload(OrderPDFUpload)">
<q-tooltip>ดูไฟล์คำสั่ง</q-tooltip>
</q-btn>
<q-btn type="a" :href="OrderPDFUpload" size="12px" flat dense color="red" icon="mdi-download" target="_blank">
<q-tooltip>ดาวน์โหลดเอกสารแนบท้าย</q-tooltip>
</q-btn>
</div>
<q-file outlined dense v-model="fileOrder" label="เลือกไฟล์คำสั่ง" hide-bottom-space lazy-rules
:rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']">
:rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']" accept=".pdf">
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
@ -101,8 +345,18 @@
</div>
<div>
<label class="text-file">เอกสารแนบท้าย</label>
<div class="text-right">
<q-btn size="12px" flat dense color="primary" icon="mdi-eye"
@click="viewFileUpload(TailerPDFUpload)">
<q-tooltip>ดูไฟล์คำสั่ง</q-tooltip>
</q-btn>
<q-btn type="a" :href="TailerPDFUpload" size="12px" flat dense color="red" icon="mdi-download" target="_blank">
<q-tooltip>ดาวน์โหลดเอกสารแนบท้าย</q-tooltip>
</q-btn>
</div>
<q-file outlined dense v-model="fileTailer" label="เลือกไฟล์เอกสารแนบท้าย" hide-bottom-space
lazy-rules :rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']">
lazy-rules :rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']" accept=".pdf">
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
@ -184,22 +438,10 @@
<q-btn unelevated label="บันทึก" :color="validateForm() ? 'public' : 'grey'" :disable="!validateForm()"
@click="save">
</q-btn>
<!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
<q-tooltip>ต่อไป</q-tooltip>
</q-btn> -->
</div>
<q-dialog v-model="dialog" persistent :maximized="true" transition-show="slide-up" transition-hide="slide-down">
<q-card class="bg-white text-white">
<!-- <q-bar>
<q-space />
<q-btn dense flat icon="close" v-close-popup>
<q-tooltip>ปิดหน้าต่าง</q-tooltip>
</q-btn>
</q-bar> -->
<div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
<q-btn icon="close" unelevated round dense style="color: #ff8080; background-color: #ffdede" size="12px"
v-close-popup />
@ -238,227 +480,52 @@
</q-card-section>
</q-card>
</q-dialog>
<q-dialog v-model="dialogFileUpload" persistent :maximized="true" transition-show="slide-up"
transition-hide="slide-down">
<q-card class="bg-white text-white">
<div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
<q-btn icon="close" unelevated round dense style="color: #ff8080; background-color: #ffdede" size="12px"
v-close-popup />
</div>
<q-card-section bordered class="card-pdf q-ma-md q-pa-md">
<div class="justify-between items-center align-center q-pb-sm row">
<q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
<q-icon name="mdi-chevron-left" />
</q-btn>
<span class="body-2 grey--text text-black">
หน้าที่ {{ page }} จาก {{ numOfPages }}
</span>
<q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
<q-icon name="mdi-chevron-right" />
</q-btn>
</div>
<div class="pdfWidth">
<VuePDF ref="vuePDFRef" :pdf="pdfFileUploadSrc" :page="page" fit-parent :scale="0.1" />
<!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
</div>
<div class="justify-between items-center align-center q-pt-sm row">
<q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
<q-icon name="mdi-chevron-left" />
</q-btn>
<span class="body-2 grey--text text-black">
หน้าที่ {{ page }} จาก {{ numOfPages }}
</span>
<q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
<q-icon name="mdi-chevron-right" />
</q-btn>
</div>
</q-card-section>
</q-card>
</q-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, onUnmounted, computed, watch } from "vue";
import { VuePDF, usePDF } from "@tato30/vue-pdf";
import type { PDFDocumentLoadingTask } from "pdfjs-dist/types/src/display/api";
import type { QForm } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import { useRoute } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
const mixin = useCounterMixin();
const { date2Thai, messageError, showLoader, hideLoader, dialogConfirm } = mixin;
const route = useRoute();
const $q = useQuasar();
const orderId_params = route.params.orderid;
const dialog = ref<boolean>(false);
const splitterModel = ref<number>(70);
const tab = ref<string>("main");
const order = ref<string>("");
const years = ref<number>(new Date().getDate());
const date = ref<Date>(new Date());
const fileOrder = ref<any>(null);
const fileTailer = ref<any>(null);
const OrderPDF = ref<string>("");
const TailerPDF = ref<string>("");
const statusOrder = ref<string>();
const orderId = ref<string>(orderId_params.toString());
onMounted(async () => {
if (orderId.value) {
fetchAttachment(orderId.value);
fecthstatusOrder(orderId.value);
}
// const pdfData = usePDF();
// setTimeout(() => {
// pdfSrc.value = pdfData.pdf.value;
// numOfPages.value = pdfData.pages.value;
// }, 1000);
});
const fetchAttachment = async (orderId: string) => {
showLoader();
await http
.get(config.API.attachmentOrder(orderId))
.then(async (res) => {
let response = res.data.result;
// console.log(response);
order.value = response.orderNo;
years.value = Number(response.orderYear);
if (response.date !== undefined) {
date.value = response.date;
}
if (response.orderFileUrl !== null) {
OrderPDF.value = response.orderFileUrl;
viewPDF(OrderPDF.value);
}
if (response.attachmentFileUrl !== null) {
TailerPDF.value = response.attachmentFileUrl;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const fecthstatusOrder = async (orderId: string) => {
await http
.get(config.API.orderReady(orderId))
.then((res) => {
let status = res.data.result;
statusOrder.value = status.result;
})
.catch((e) => {
console.log(e);
});
};
const viewPDF = async (pdf: string) => {
const pdfData = await usePDF(`${pdf}`);
showLoader();
setTimeout(() => {
pdfSrc.value = pdfData.pdf.value;
numOfPages.value = pdfData.pages.value;
hideLoader();
}, 1500);
};
watch(tab, () => {
// console.log(tab.value);
if (tab.value === "main") {
viewPDF(OrderPDF.value);
}
if (tab.value === "second") {
viewPDF(TailerPDF.value);
}
});
// const myEventHandler = (e: any) => {
// console.log("e", e.target.innerWidth);
// if (vuePDFRef !== null) {
// vuePDFRef.value.reload();
// }
// };
const pdfSrc = ref<PDFDocumentLoadingTask | undefined>();
const numOfPages = ref<number>(0);
const page = ref<number>(1);
const vuePDFRef = ref<any>(null);
const myForm = ref<QForm | null>(null);
const props = defineProps({
next: {
type: Function,
default: () => console.log("not function"),
},
previous: {
type: Function,
default: () => console.log("not function"),
},
});
// const next = () => props.next();
const previous = () => props.previous();
const onchangePage = (val: any) => {
// console.log(val);
if (vuePDFRef !== null) {
vuePDFRef.value.reload();
}
};
const save = () => {
if (myForm.value !== null) {
myForm.value!.validate().then((success: Boolean) => {
if (success) {
dialogConfirm(
$q,
async () => {
await putOrderData();
await postfileOrder();
await postfileTailer();
await fetchAttachment(orderId.value);
await fecthstatusOrder(orderId.value);
},
);
}
});
}
};
const putOrderData = async () => {
const orderData = {
orderNo: order.value,
orderYear: years.value.toString(),
signDate: date.value,
};
await http
.put(config.API.attachmentOrder(orderId.value), orderData)
.then((res) => {
console.log(res);
})
.catch((e) => {
console.log(e);
});
};
const postfileOrder = async () => {
const formData = new FormData();
formData.append("File", fileOrder.value);
await http.post(config.API.attachmentOrderId(orderId.value), formData);
};
const postfileTailer = async () => {
const formData = new FormData();
formData.append("File", fileTailer.value);
await http.post(config.API.attachmentFileId(orderId.value), formData);
};
const clickExecute = async (id: string) => {
dialogConfirm(
$q,
async () => {
await http
.put(config.API.executeOrder(id))
.then((res) => {
console.log(res);
})
.catch((e) => {
messageError($q, e);
});
},
"ยืนยันการออกคำสั่ง",
"ต้องการยืนยันการออกคำสั่งนี้ใช่หรือไม่?",
);
};
const validateForm = () => {
return (
fileOrder.value !== null &&
fileOrder.value !== null &&
order.value.trim() !== ""
);
};
const getClass = (val: boolean) => {
return {
"card-header-active q-px-lg q-py-md cursor-pointer": val,
"card-header q-px-lg q-py-md cursor-pointer": !val,
};
};
const setTab = (val: string) => {
tab.value = val;
page.value = 1;
};
</script>
<style lang="scss" scoped>
.border {
border-radius: 10px;