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

ปรับเเก้

Browse source
This commit is contained in:
STW_TTTY\stwtt 2024-05-17 16:37:55 +07:00
parent d395bcbab5
commit 763f73d872
12 changed files with 1464 additions and 368 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/api/02_organizational/api.organization.ts
View file

@ -57,6 +57,7 @@ export default {
/** บรรจุแต่งตั้ง*/
orgPosPlacement: `${orgPos}/placement/search`,
orgPosPlacemenTemp: `${orgPos}/placementemp/search`,
orgPosFind: `${organization}/find/node`,
orgProfileProbation: `${organization}/profile/probation`,

879
src/components/Dialogs/DialogOrgSelectEmployee.vue Normal file
View file

@ -0,0 +1,879 @@
<script setup lang="ts">
import DialogHeader from "@/components/DialogHeader.vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import { ref, watch, reactive } from "vue";
import type { QTableProps } from "quasar";
import CardPosition from "@/modules/05_placement/components/PersonalList/CardPosition.vue";
import http from "@/plugins/http";
import config from "@/app.config";
import type {
OrgTree,
DataTree,
PositionMain,
PositionNo,
Positions,
DataPositionNo,
FormActive,
TreeMain,
} from "@/interface/request/orgSelect/org";
const props = defineProps({
dataRows: {
type: Object,
require: true,
},
onSubmit: Function,
});
const $q = useQuasar();
const mixin = useCounterMixin();
const {
dialogConfirm,
showLoader,
messageError,
hideLoader,
date2Thai,
dialogMessageNotify,
} = mixin;
const modal = defineModel<boolean>("modal", { required: true });
const title = defineModel<string>("title", { required: true });
const posType = defineModel<any>("posType", { required: true });
const posLevel = defineModel<any>("posLevel", { required: true });
const position = defineModel<any>("position", { required: true });
const orgRevisionId = ref<string>("");
const filter = ref<string>("");
const isAll = ref<boolean>(false);
const isBlank = ref<boolean>(false);
const posMasterMain = ref<any>([]);
const positionNo = ref<DataPositionNo[]>();
const itemTaps = ref<string[]>();
const filters = ref<string>("");
const positionId = ref<string>("");
const selectedPos = ref<any[]>([]);
const seletcId = ref<string>("");
const datePos = ref<Date>(new Date());
const rowsPosition = ref<Positions[]>([]);
const positionData = ref<any>();
/** active form */
const formActive = reactive<FormActive>({
activeId: "",
activeName: "",
draftId: "",
draftName: "",
orgPublishDate: null,
isPublic: false,
});
/** node */
const nodes = ref<Array<OrgTree>>([]);
const lazy = ref(nodes);
const expanded = ref<string[]>([]);
const nodeLevel = ref<number>(0);
const nodeId = ref<string>(""); // id ของ Tree
/** columns*/
const columns = ref<QTableProps["columns"]>([
{
name: "isPosition",
align: "left",
label: "",
sortable: true,
field: "isPosition",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: true,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "posMasterNo",
align: "left",
label: "เลขที่ตำแหน่ง",
sortable: true,
field: "posMasterNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionName",
align: "left",
label: "ตำแหน่ง",
field: "positionName",
sortable: true,
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "posTypeName",
align: "left",
label: "กลุ่มงาน",
sortable: true,
field: "posTypeName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "posLevelName",
align: "left",
label: "ระดับชั้นงาน",
sortable: true,
field: "posLevelName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionIsSelected",
align: "left",
label: "คนครอง",
sortable: true,
field: "positionIsSelected",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
const columnsPostition = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: false,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionName",
align: "left",
label: "ตำแหน่ง",
sortable: true,
field: "positionName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionField",
align: "left",
label: "สายงาน",
sortable: true,
field: "positionField",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "posTypeName",
align: "left",
label: "กลุ่มงาน",
sortable: true,
field: "posTypeName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "posLevelName",
align: "left",
label: "ระดับชั้นงาน",
sortable: true,
field: "posLevelName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionArea",
align: "left",
label: "ด้าน/สาขา",
sortable: true,
field: "positionArea",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
const visibleColumns = ref<string[]>([
"isPosition",
"no",
"posMasterNo",
"positionName",
"posTypeName",
"posLevelName",
"positionIsSelected",
]);
/** ปิด dialog */
function close() {
modal.value = false;
filter.value = "";
isAll.value = false;
isBlank.value = false;
nodes.value = [];
expanded.value = [];
nodeLevel.value = 0;
nodeId.value = "";
}
async function getDataTable(id: string, level: number = 0) {
showLoader();
const body = {
node: level,
nodeId: id,
position: posType.value ? posType.value : "",
posLevel: posLevel.value ? posLevel.value : "",
posType: position.value ? position.value : "",
isAll: isAll.value,
isBlank: isBlank.value,
typeCommand: null,
};
await http
.post(config.API.orgPosPlacemenTemp, body)
.then((res) => {
const dataMain: PositionMain[] = [];
posMasterMain.value = res.data.result.data;
res.data.result.data.forEach((e: PositionNo) => {
const p = e.positions;
if (p.length !== 0) {
const a = p.find((el: Positions) => el.positionIsSelected === true);
const { id, ...rest } = a ? a : p[0];
const data: any = { ...e, ...rest };
dataMain.push(data);
}
});
const listPosNo: DataPositionNo[] = dataMain.map((e: PositionMain) => ({
id: e.id,
isPosition: e.isPosition,
posMasterNo:
e.orgShortname +
(e.posMasterNoPrefix != null ? e.posMasterNoPrefix : "") +
e.posMasterNo +
(e.posMasterNoSuffix != null ? e.posMasterNoSuffix : ""),
positionName: e.positionName,
posTypeName: e.posTypeName,
posLevelName: e.posLevelName,
positionIsSelected: e.positionIsSelected
? e.fullNameCurrentHolder
: "-",
isSit: e.isSit,
positions: e.positions,
node: e.node,
nodeId: e.nodeId,
}));
positionNo.value = listPosNo;
positionData.value = listPosNo;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
setTimeout(() => {
hideLoader();
}, 1000);
});
}
/**
* funtion เลือกข้อมูล Tree
* @param data ข่อมูล Tree
*/
function updateSelected(data: DataTree) {
if (props?.dataRows?.nodeId === data.orgTreeId) {
positionId.value = props?.dataRows?.posmasterId;
seletcId.value = props?.dataRows?.positionId;
datePos.value = props?.dataRows?.reportingDateFullDate;
} else {
positionId.value = "";
seletcId.value = "";
selectedPos.value = [];
datePos.value = new Date();
}
nodeId.value = data.orgTreeId ? data.orgTreeId : "";
nodeLevel.value = data.orgLevel;
getDataTable(data.orgTreeId, data.orgLevel);
}
/** ดึงข้อมูล active */
async function getActive() {
showLoader();
await http
.get(config.API.activeOrganization)
.then((res) => {
const data = res.data.result;
formActive.activeId = data.activeId;
formActive.activeName = data.activeName;
formActive.draftId = data.draftId;
formActive.draftName = data.draftName;
formActive.orgPublishDate = data.orgPublishDate;
formActive.isPublic = data.isPublic;
getTreeData(data.activeId);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
/** ดึงข้อมูล หน่วยงาน */
async function getTreeData(id: string) {
showLoader();
await http
.get(config.API.orgByid(id))
.then((res) => {
const data = res.data.result;
nodes.value = data;
filterItemsTaps(data);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
function filterItemsTaps(data: TreeMain[]) {
let orgTreeIds: string[] = [];
for (const child of data) {
orgTreeIds.push(child.orgTreeId);
if (child.children) {
orgTreeIds = orgTreeIds.concat(filterItemsTaps(child.children));
}
}
itemTaps.value = orgTreeIds;
return orgTreeIds;
}
/**
* function เลือกเลขที่ตำแหน่ง
* @param id เลชที่ตำแหน่ง
*/
async function onClickSelectPos(id: string) {
positionData.value = positionNo.value;
positionId.value = id;
selectedPos.value = [];
const position: DataPositionNo = positionData.value.find(
(e: DataPositionNo) => e.id === id
);
// หาตำแหน่ง
if (position) {
rowsPosition.value = position.positions;
if (seletcId.value) {
selectedPos.value = rowsPosition.value.filter(
(e) => e.id === seletcId.value
);
}
}
}
/**
* function fetch ข้อมูล expanded tree
* @param level levelTree
* @param id treeId
*/
async function fetchPosFind(level: number, id: string) {
showLoader();
const body = {
node: level,
nodeId: id,
};
await http
.post(config.API.orgPosFind, body)
.then((res) => {
const data = res.data.result;
expanded.value = data;
nodeId.value = id;
positionId.value = props?.dataRows?.posmasterId;
seletcId.value = props?.dataRows?.positionId;
datePos.value = props?.dataRows?.reportingDateFullDate;
getDataTable(nodeId.value, level);
})
.catch((e) => {
messageError($q, e);
hideLoader();
});
}
watch(
() => modal.value,
async (n) => {
if (n == true) {
getActive();
if (props?.dataRows?.node !== null && props?.dataRows?.nodeId !== null) {
await fetchPosFind(props?.dataRows?.node, props?.dataRows?.nodeId);
if (positionId.value) {
setTimeout(async () => {
await onClickSelectPos(positionId.value);
}, 200);
}
} else {
expanded.value = [];
}
}
}
);
watch(
() => isAll.value,
(value, oldVal) => {
if (value !== oldVal) {
getDataTable(nodeId.value, nodeLevel.value);
}
}
);
watch(
() => isBlank.value,
(value, oldVal) => {
if (value !== oldVal) {
getDataTable(nodeId.value, nodeLevel.value);
}
}
);
watch(
() => positionId.value,
(n) => {
if (n) {
onClickSelectPos(n);
}
}
);
function onSubmit() {
const dataPosMaster = posMasterMain.value?.find(
(e: any) => e.id === positionId.value
);
console.log(dataPosMaster);
if (selectedPos.value.length === 0) {
dialogMessageNotify($q, "กรุณาเลือกตำแหน่ง");
} else {
dialogConfirm($q, async () => {
const body = {
personalId: props?.dataRows?.id,
node: dataPosMaster.node,
nodeId: dataPosMaster.nodeId,
orgRevisionId: formActive.activeId,
positionId: selectedPos.value[0].id,
posMasterNo: dataPosMaster.posMasterNo, //เลขที่ตำแหน่ง(เลขอย่่างเดียว)
positionName: selectedPos.value[0].positionName, //ชื่อตำแหน่ง
positionField: selectedPos.value[0].positionField, //ชื่อตำแหน่ง
posTypeId: selectedPos.value[0].posTypeId, //ชื่อตำแหน่ง
posTypeName: selectedPos.value[0].posTypeName, //ชื่อตำแหน่ง
posLevelId: selectedPos.value[0].posLevelId, //ชื่อตำแหน่ง
posLevelName: selectedPos.value[0].posLevelName, //ชื่อตำแหน่ง
reportingDate: datePos.value,
posmasterId: dataPosMaster.id,
};
props.onSubmit?.(body);
});
}
}
</script>
<template>
<q-dialog v-model="modal" persistent full-width>
<q-card class="no-scroll">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader :tittle="title" :close="close" />
<q-separator />
<q-card-section style="max-height: 80vh" class="scroll">
<div class="row">
<q-card
bordered
class="col-12 col-sm-3 scroll q-pa-sm"
style="height: 75vh"
>
<q-toolbar style="padding: 0">
<q-toolbar-title class="text-subtitle2 text-bold"
>เลือกหน่วยงาน/ส่วนราชการ</q-toolbar-title
>
</q-toolbar>
<q-input dense outlined v-model="filter" label="ค้นหา">
<template v-slot:append>
<q-icon
v-if="filter !== ''"
name="clear"
class="cursor-pointer"
@click="filter = ''"
/>
</template>
</q-input>
<q-tree
class="q-pa-sm q-gutter-sm"
dense
:nodes="lazy"
node-key="orgTreeId"
label-key="orgTreeName"
:filter="filter"
no-results-label="ไม่พบข้อมูลที่ค้นหา"
no-nodes-label="ไม่มีข้อมูล"
v-model:expanded="expanded"
>
<template v-slot:default-header="prop">
<q-item
@click.stop="updateSelected(prop.node)"
clickable
:active="nodeId == prop.node.orgTreeId"
active-class="my-list-link text-primary text-weight-medium"
class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
>
<div>
<div class="text-weight-medium">
{{ prop.node.orgTreeName }}
</div>
<div class="text-weight-light">
{{
prop.node.orgCode == null ? null : prop.node.orgCode
}}
{{
prop.node.orgTreeShortName == null
? null
: prop.node.orgTreeShortName
}}
</div>
</div>
</q-item>
</template>
</q-tree>
</q-card>
<q-card bordered class="col-12 col-sm-9 q-pa-sm">
<q-tab-panels
v-model="nodeId"
animated
transition-prev="jump-up"
transition-next="jump-up"
>
<q-tab-panel
v-for="(item, index) in itemTaps"
:key="index"
:name="item"
>
<div class="column q-col-gutter-sm" style="height: 70vh">
<!-- เลือกเลขที่ตำแหน่ง -->
<div class="col-7">
<q-card
bordered
style="height: 100%; border: 1px solid #d6dee1"
>
<div
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
>
เลือกเลขที่ตำแหน่ง
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12 q-pa-md">
<q-toolbar style="padding: 0px">
<div class="row q-gutter-md">
<q-checkbox
keep-color
v-model="isBlank"
label="แสดงเฉพาะตำแหน่งว่าง"
color="primary"
>
<q-tooltip>แสดงเฉพาะตำแหน่งว่าง </q-tooltip>
</q-checkbox>
</div>
<q-space />
<div class="row q-gutter-md">
<q-checkbox
keep-color
v-model="isAll"
label="แสดงตำแหน่งทั้งหมด"
color="primary"
>
<q-tooltip
>แสดงตำแหน่งทั้งหมดภายใต้หน่วยงาน/ส่วนราชการที่เลือก</q-tooltip
>
</q-checkbox>
<div>
<q-input
outlined
dense
v-model="filters"
label="ค้นหา"
>
<template v-slot:append>
<q-icon name="search" color="grey-5" />
</template>
</q-input>
</div>
<div>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
emit-value
:display-value="$q.lang.table.columns"
map-options
:options="columns"
option-value="name"
options-cover
style="min-width: 180px"
/>
</div>
</div>
</q-toolbar>
<d-table
ref="table"
:columns="columns"
:rows="positionData"
:filter="filters"
row-key="id"
flat
bordered
:paging="true"
dense
:rows-per-page-options="[10, 25, 50, 100]"
class="tableTb"
:visible-columns="visibleColumns"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<span class="text-weight-medium">{{
col.label
}}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="onClickSelectPos(props.row.id)"
:class="
props.row.id === positionId
? 'bg-blue-2'
: ''
"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="col.name === 'posMasterNo'">
{{
props.row.isSit
? col.value + " " + "(ทับที่)"
: col.value
}}
</div>
<div v-else-if="col.name === 'isPosition'">
<div v-if="col.value">
<q-icon
name="done"
color="primary"
size="24px"
>
<q-tooltip>ตรงตามตำแหน่ง </q-tooltip>
</q-icon>
</div>
</div>
<div v-else>
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</div>
</q-card>
</div>
<!-- เลือกตำแหน่ง -->
<div class="col-5">
<q-card
bordered
style="height: 100%; border: 1px solid #d6dee1"
>
<div
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
>
เลือกตำแหน่ง
</div>
<div class="col-12"><q-separator /></div>
<q-tab-panels
v-model="positionId"
animated
swipeable
vertical
transition-prev="jump-up"
transition-next="jump-up"
>
<q-tab-panel
v-for="(item, index) in positionData"
:key="index"
:name="item.id"
>
<div class="col-12">
<q-toolbar style="padding: 0px">
<datepicker
menu-class-name="modalfix"
v-model="datePos"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
:min-date="datePos"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateRef"
outlined
dense
hide-bottom-space
:model-value="
datePos != null
? date2Thai(datePos)
: null
"
label="วันที่รายงานตัว"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</q-toolbar>
<d-table
ref="table"
:columns="columnsPostition"
:rows="rowsPosition"
row-key="id"
flat
bordered
:paging="true"
dense
:rows-per-page-options="[10, 25, 50, 100]"
class="tableTb"
selection="single"
v-model:selected="selectedPos"
>
<template v-slot:header-selection="scope">
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.checkBox"
/>
</template>
<template v-slot:header="props">
<q-tr :props="props">
<q-th auto-width />
<q-th
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<span class="text-weight-medium">{{
col.label
}}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>
<q-checkbox
keep-color
color="primary"
dense
v-model="props.selected"
/>
</q-td>
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div
v-else-if="col.name === 'posMasterNo'"
>
{{
props.row.isSit
? col.value + " " + "(ทับที่)"
: col.value
}}
</div>
<div v-else>
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</div>
</q-tab-panel>
</q-tab-panels>
</q-card>
</div>
</div>
</q-tab-panel>
</q-tab-panels>
</q-card>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right" class="bg-white text-teal">
<q-btn label="บันทึก" color="secondary" type="submit"
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
>
</q-card-actions>
</q-form>
</q-card>
</q-dialog>
</template>
<style scoped>
.my-list-link {
color: rgb(118, 168, 222);
border-radius: 5px;
background: #a3d3fb48 !important;
font-weight: 600;
border: 1px solid rgba(175, 185, 196, 0.217);
}
</style>

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

@ -7,12 +7,15 @@ import type { ResponseTitle } from "@/modules/05_placement/interface/response/Re
import type {
appointmentData,
ResponseData,
DataProfile
} from "@/modules/05_placement/interface/response/AppointMent";
import type { QForm } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
import CardProfile from "@/components/CardProfile.vue";
const modalPersonal = ref<boolean>(false);
const personId = ref<string>("");
const $q = useQuasar();
@ -20,6 +23,8 @@ const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const dataProfile = ref<DataProfile>();
const appointment = ref<appointmentData>({
citizenId: "",
prefixId: "",
@ -63,6 +68,7 @@ const fecthappointmentByid = async () => {
await http
.get(config.API.appointEmployeeByid(paramsId.toString()))
.then((res: ResponseData) => {
dataProfile.value = res.data.result as unknown as DataProfile;
const data = res.data.result;
appointment.value = data;
profileId.value = data.profileId;
@ -175,56 +181,7 @@ onMounted(async () => {
/>
รายละเอียดการปรับระดับชั้นงานลูกจ้าง {{ title.fullname }}
</div>
<q-card bordered class="row col-12 text-dark">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-subtitle2">
{{ title.fullname }}
</div>
<q-space />
<q-btn
outline
color="blue"
dense
icon-right="mdi-open-in-new"
class="q-px-sm"
label="ดูข้อมูลทะเบียนประวัติ"
@click="onclickViewinfo(profileId)"
/>
</div>
<div class="col-12"><q-separator /></div>
<div class="row col-12 q-pa-md">
<div class="col-12 row bg-white q-col-gutter-md">
<div class="col-xs-3 col-sm-2 col-md-1 row">
<q-img :src="avatar" v-if="avatar !== ''" />
<q-img src="@/assets/avatar_user.jpg" v-else />
</div>
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12 q-pl-md">
<div class="col-12 text-top">ตำแหน่งในสายงาน</div>
<div class="col-12 text-detail">
{{ title.positionTypeOld }}
</div>
</div>
</div>
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">ระดับ</div>
<div class="col-12 text-detail">
{{ title.positionLevelOld }}
</div>
</div>
</div>
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">สังกัด</div>
<div class="col-12 text-detail">
{{ title.organizationPositionOld }}
</div>
</div>
</div>
</div>
</div>
</q-card>
<CardProfile :data="dataProfile as DataProfile" />
<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">

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

@ -9,8 +9,13 @@ import DialogHeader from "@/modules/05_placement/components/AppointMent/DialogHe
import http from "@/plugins/http";
import config from "@/app.config";
import { useTransferDataStore } from "@/modules/05_placement/store";
const storeFn = useTransferDataStore();
const { statusText } = storeFn;
const mixin = useCounterMixin();
const { showLoader, success, messageError, dialogConfirm, hideLoader } = mixin;
const { showLoader, success, messageError, dialogConfirm, hideLoader ,date2Thai} = mixin;
const $q = useQuasar();
const selected = ref<[]>([]);
@ -35,7 +40,7 @@ const visibleColumns2 = ref<string[]>([
"citizenId",
"fullname",
"organizationName",
"birthday",
"dateOfBirth",
]);
const columns2 = ref<QTableProps["columns"]>([
{
@ -68,7 +73,7 @@ const columns2 = ref<QTableProps["columns"]>([
{
name: "organizationName",
align: "left",
label: "หน่วยงานที่รับการปรับระดับชั้นงาน",
label: "หน่วยงานที่รับการแต่งตั้ง-เลื่อน-ย้าย",
sortable: true,
field: "organizationName",
headerStyle: "font-size: 14px",
@ -77,11 +82,11 @@ const columns2 = ref<QTableProps["columns"]>([
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "birthday",
name: "dateOfBirth",
align: "left",
label: "วัน/เดือน/ปี เกิด",
sortable: true,
field: "birthday",
field: "dateOfBirth",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
@ -115,7 +120,7 @@ const createdAppoint = async () => {
let pId: string[] = [];
let Type = props.type as string;
selected.value.forEach((e: UserData) => {
pId.push(e.personalId);
pId.push(e.id);
});
let data = {
id: pId,
@ -228,7 +233,7 @@ watchEffect(() => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>
<q-td auto-width>
<q-checkbox
keep-color
color="primary"
@ -236,59 +241,64 @@ watchEffect(() => {
v-model="props.selected"
/>
</q-td>
<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="fullname" :props="props">
{{ props.row.fullname }}
</q-td>
<q-td key="organizationName" :props="props">
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
{{
props.row.organizationShortName !== null
? `(${props.row.organizationShortName})`
: ""
}}
<!-- <div
v-if="
props.row.orgName !== null ||
props.row.positionPath !== null
"
>
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="col.name == 'fullname'">
{{
props.row.firstName
? `${props.row.prefix ?? ""}${
props.row.firstName ?? ""
} ${props.row.lastName ?? ""}`
: "-"
}}
</div>
<!-- <div v-else-if="col.name == 'status'">
{{ props.row.status ? statusText(props.row.status) : "-" }}
</div> -->
<div v-else-if="col.name == 'dateOfBirth'">
{{
props.row.dateOfBirth
? date2Thai(props.row.dateOfBirth)
: "-"
}}
</div>
<div v-else-if="col.name == 'organizationName'">
<div class="col-4">
<div class="text-weight-medium">
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
{{ props.row.root !== null ? props.row.root : "-" }}
{{
props.row.organizationShortName !== null
? `(${props.row.organizationShortName})`
props.row.rootShortName !== null
? `(${props.row.rootShortName})`
: ""
}}
</div>
<div class="text-weight-light">
{{
props.row.positionPath !== null
? props.row.positionPath
: "-"
props.row.nodeName !== null ? props.row.nodeName : ""
}}
{{
props.row.positionNumber !== null
? `(${props.row.positionNumber})`
props.row.nodeShortName !== null
? `(${props.row.nodeShortName}${props.row.posMasterNo})`
: ""
}}
</div>
</div>
</div>
<div v-else-if="col.name == 'createdAt'">
{{
props.row.createdAt ? date2Thai(props.row.createdAt) : "-"
}}
</div>
<div v-else>
<div class="col-4">
<div class="text-weight-medium">-</div>
</div>
</div> -->
</q-td>
<q-td key="birthday" :props="props">
{{ props.row.birthday }}
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>

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

@ -17,6 +17,13 @@ import type { OpType } from "@/modules/05_placement/interface/response/Main";
import http from "@/plugins/http";
import config from "@/app.config";
import DialogOrgSelectEmployee from "@/components/Dialogs/DialogOrgSelectEmployee.vue";
const posType = ref<string>("");
const posLevel = ref<string>("");
const position = ref<string>("");
const dataRows = ref<any[]>([]);
const $q = useQuasar();
const modal = ref<boolean>(false);
const storeFn = useTransferDataStore();
@ -205,7 +212,7 @@ const columns = ref<QTableProps["columns"]>([
{
name: "organizationName",
align: "left",
label: "หน่วยงานที่รับการปรับระดับชั้นงาน",
label: "หน่วยงานที่รับการแต่งตั้ง-เลื่อน-ย้าย",
sortable: true,
field: "organizationName",
headerStyle: "font-size: 14px",
@ -252,29 +259,31 @@ const fecthlistappointment = async () => {
.then((res) => {
let response = res.data.result;
listRecevice.value = response;
rows.value = response.map((e: resData) => ({
personalId: e.id,
citizenId: e.citizenId,
fullname: e.prefix + e.firstname + " " + e.lastname,
organizationName: e.organizationName + " " + e.organizationShortName,
orgName: e.organizationName,
organizationShortName: e.organizationShortName,
status: statusText(e.status),
createdAt: date2Thai(e.createdAt),
birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
educationOld: e.educationOld,
organizationPositionOld: e.organizationPositionOld,
positionTypeOld: e.positionTypeOld,
positionLevelOld: e.positionLevelOld,
positionNumberOld: e.positionNumberOld,
salary: e.salary,
positionDate: e.positionDate,
}));
rows.value = response
// rows.value = response.map((e: resData) => ({
// personalId: e.id,
// citizenId: e.citizenId,
// fullname: e.prefix + e.firstname + " " + e.lastname,
// organizationName: e.organizationName + " " + e.organizationShortName,
// orgName: e.organizationName,
// organizationShortName: e.organizationShortName,
// status: statusText(e.status),
// createdAt: date2Thai(e.createdAt),
// birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
// educationOld: e.educationOld,
// organizationPositionOld: e.organizationPositionOld,
// positionTypeOld: e.positionTypeOld,
// positionLevelOld: e.positionLevelOld,
// positionNumberOld: e.positionNumberOld,
// salary: e.salary,
// positionDate: e.positionDate,
// }));
rows2.value = rows.value.filter(
(e: orgFilter) =>
e.orgName !== null &&
e.status !== "ส่งรายชื่อไปออกคำสั่ง" &&
e.status !== "ออกคำสั่งเสร็จแล้ว" &&
(e: any) =>
e.root !== null &&
e.status !== "REPORT" &&
e.status !== "DONE" &&
e.educationOld &&
e.organizationPositionOld &&
e.positionTypeOld &&
@ -474,6 +483,54 @@ const savePosition = async () => {
// id.value = "";
// }
// };
function openModalTree(data:any){
modalTree.value = true
personalId.value = data.id;
dataRows.value = data;
posType.value = data.posTypeId;
posLevel.value = data.posLevelId;
position.value = data.positionName;
}
function onSave(data: any) {
console.log("not save", data);
const dataAppoint = {
// personalId: data.personalId,
node: data.node,
nodeId: data.nodeId,
orgRevisionId: data.orgRevisionId,
positionId: data.positionId,
posMasterNo: data.posMasterNo,
positionName: data.positionName,
posTypeId: data.posTypeId,
posTypeName: data.posTypeName,
posLevelId: data.posLevelId,
posLevelName: data.posLevelName,
reportingDate: data.reportingDate,
posmasterId: data.posmasterId,
};
showLoader();
http
.put(config.API.appointmentPosition(personalId.value), dataAppoint)
.then((res) => {
modalTree.value = false;
success($q, "บันทึกสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
fecthlistappointment();
hideLoader();
});
}
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
@ -554,76 +611,64 @@ const savePosition = async () => {
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
key="no"
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="nextPage(props.row.personalId)"
@click="nextPage(props.row.id)"
>
{{ props.rowIndex + 1 }}
</q-td>
<q-td
key="citizenId"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.citizenId }}
</q-td>
<q-td
key="fullname"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.fullname }}
</q-td>
<q-td
key="organizationName"
:props="props"
@click="nextPage(props.row.personalId)"
>
<div
v-if="
props.row.orgName !== null ||
props.row.positionPath !== null
"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="col.name == 'fullname'">
{{
props.row.firstName
? `${props.row.prefix ?? ""}${
props.row.firstName ?? ""
} ${props.row.lastName ?? ""}`
: "-"
}}
</div>
<div v-else-if="col.name == 'status'">
{{ props.row.status ? statusText(props.row.status) : "-" }}
</div>
<div v-else-if="col.name == 'dateOfBirth'">
{{
props.row.dateOfBirth
? date2Thai(props.row.dateOfBirth)
: "-"
}}
</div>
<div v-else-if="col.name == 'organizationName'">
<div class="col-4">
<div class="text-weight-medium">
{{ props.row.root !== null ? props.row.root : "-" }}
{{
props.row.orgName !== null ? props.row.orgName : "-"
props.row.rootShortName !== null
? `(${props.row.rootShortName})`
: ""
}}
</div>
<div class="text-weight-light">
{{
props.row.nodeName !== null ? props.row.nodeName : ""
}}
{{
props.row.organizationShortName !== null
? `(${props.row.organizationShortName})`
props.row.nodeShortName !== null
? `(${props.row.nodeShortName}${props.row.posMasterNo})`
: ""
}}
</div>
</div>
</div>
<div v-else>
<div class="col-4">
<div class="text-weight-medium">-</div>
</div>
<div v-else-if="col.name == 'createdAt'">
{{
props.row.createdAt ? date2Thai(props.row.createdAt) : "-"
}}
</div>
<div v-else>
{{ col.value ? col.value : "-" }}
</div>
</q-td>
<q-td
key="birthday"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.birthday }}
</q-td>
<q-td
key="createdAt"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.createdAt }}
</q-td>
<q-td
key="status"
:props="props"
@click="nextPage(props.row.personalId)"
>
{{ props.row.status }}
</q-td>
<q-td auto-width>
<q-btn
@ -643,7 +688,7 @@ const savePosition = async () => {
transition-hide="jump-up"
>
<q-list dense style="min-width: 200px">
<q-item
<!-- <q-item
clickable
v-close-popup
@click="openModalEmployee(props.row.personalId)"
@ -660,11 +705,29 @@ const savePosition = async () => {
/>
</q-item-section>
<q-item-section>กำหนดตำแหน่ง</q-item-section>
</q-item> -->
<q-item
clickable
v-close-popup
@click="openModalTree(props.row)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-icon
color="primary"
size="xs"
name="mdi-bookmark-outline"
/>
</q-item-section>
<q-item-section>หน่วยงานที่รับการปรับระดับชั้นงาน</q-item-section>
</q-item>
<q-item
clickable
v-close-popup
@click="clickDelete(props.row.personalId)"
@click="clickDelete(props.row.id)"
>
<q-item-section
style="min-width: 0px"
@ -783,5 +846,16 @@ const savePosition = async () => {
:personal="personal"
:personalId="personalId"
/> -->
<DialogOrgSelectEmployee
:title="`เลือกหน่วยงานที่รับการปรับระดับชั้นงาน`"
v-model:modal="modalTree"
:posType="posType"
:posLevel="posLevel"
:position="position"
:dataRows="dataRows"
:onSubmit="onSave"
/>
</template>
<style scoped lang="scss"></style>

260
src/modules/05_placement/components/PersonalDetail/Detail.vue
View file

@ -23,6 +23,7 @@ import Document from "@/modules/05_placement/components/PersonalDetail/Informati
import {
AddressDataDefualt,
FamilyDataDefualt,
} from "@/modules/05_placement/interface/index/Main";
import type {
@ -32,6 +33,8 @@ import type {
Family,
Address,
Certificate,
optionData,
InformationOps
} from "@/modules/05_placement/interface/index/Main";
import type { Information } from "@/modules/05_placement/components/PersonalDetail/profileType";
@ -99,11 +102,7 @@ const FamilyData = ref<Family>(FamilyDataDefualt);
const AddressData = ref<Address>(AddressDataDefualt);
const CertificateData = ref<Certificate[]>([]);
onMounted(async () => {
// await checkProfileData();
await fetchData();
await changeTab("information");
});
const guidCheck = (id: string) => {
if (id == "00000000-0000-0000-0000-000000000000") {
@ -112,9 +111,40 @@ const guidCheck = (id: string) => {
return id;
};
const Ops = ref<InformationOps>({
prefixOps: [],
genderOps: [],
bloodOps: [],
statusOps: [],
religionOps: [],
employeeClassOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
employeeTypeOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
});
const OpsFilter = ref<InformationOps>({
prefixOps: [],
genderOps: [],
bloodOps: [],
statusOps: [],
religionOps: [],
employeeClassOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
employeeTypeOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
});
const fetchData = async () => {
storePersonal.loading = false;
showLoader();
await http
.get(config.API.placementPersonalId(examId.value))
.then((res: any) => {
@ -235,10 +265,218 @@ const fetchData = async () => {
.catch((e: any) => {
messageError($q, e);
})
.finally(() => {
});
};
const fetchDataByType = async (type: string) => {
// storePersonal.loading = false;
showLoader();
await http
.get(config.API.placementPersonalId(examId.value))
.then((res: any) => {
const data = res.data.result;
storePersonal.fecthDataInformation(data);
personalData.value.fullName = data.fullName;
personalData.value.id = data.personalId;
if (type == "Information") {
InformationData.value.idCard = data.idCard;
InformationData.value.fullName = data.fullName;
InformationData.value.firstname = data.firstname;
InformationData.value.lastname = data.lastname;
InformationData.value.nationality = data.nationality;
InformationData.value.race = data.race;
InformationData.value.genderId = guidCheck(data.gender) ?? "";
InformationData.value.prefixId = guidCheck(data.prefix) ?? "";
InformationData.value.relationshipId =
guidCheck(data.relationship) ?? "";
InformationData.value.religionId = guidCheck(data.religion) ?? "";
InformationData.value.bloodGroupId = guidCheck(data.bloodGroup) ?? "";
InformationData.value.dateOfBirth = new Date(data.dateOfBirth);
InformationData.value.age = data.age;
InformationData.value.telephone = data.telephone;
} else if (type == "Address") {
AddressData.value.registAddress = data.registAddress ?? "";
AddressData.value.currentAddress = data.currentAddress ?? "";
AddressData.value.registSame = data.registSame ? "1" : "0";
AddressData.value.registSubDistrict = data.registSubDistrict ?? "";
AddressData.value.registSubDistrictId =
guidCheck(data.registSubDistrictId) ?? "";
AddressData.value.registZipCode = data.registZipCode ?? "";
AddressData.value.registDistrict = data.registDistrict ?? "";
AddressData.value.registDistrictId =
guidCheck(data.registDistrictId) ?? "";
AddressData.value.registProvince = data.registProvince ?? "";
AddressData.value.registProvinceId =
guidCheck(data.registProvinceId) ?? "";
AddressData.value.currentSubDistrict = data.currentSubDistrict ?? "";
AddressData.value.currentSubDistrictId =
guidCheck(data.currentSubDistrictId) ?? "";
AddressData.value.currentZipCode = data.currentZipCode ?? "";
AddressData.value.currentDistrict = data.currentDistrict ?? "";
AddressData.value.currentDistrictId =
guidCheck(data.currentDistrictId) ?? "";
AddressData.value.currentProvince = data.currentProvince ?? "";
AddressData.value.currentProvinceId =
guidCheck(data.currentProvinceId) ?? "";
} else if (type == "Family") {
FamilyData.value.couple = data.couple ? "1" : "0";
FamilyData.value.marryPrefix = data.marryPrefix ?? "";
FamilyData.value.marryPrefixId = guidCheck(data.marryPrefix) ?? "";
FamilyData.value.marryFirstName = data.marryFirstName ?? "";
FamilyData.value.marryLastName = data.marryLastName ?? "";
FamilyData.value.marryOccupation = data.marryOccupation ?? "";
FamilyData.value.fatherPrefix = data.fatherPrefix ?? "";
FamilyData.value.fatherPrefixId = guidCheck(data.fatherPrefix) ?? "";
FamilyData.value.fatherFirstName = data.fatherFirstName ?? "";
FamilyData.value.fatherLastName = data.fatherLastName ?? "";
FamilyData.value.fatherOccupation = data.fatherOccupation ?? "";
FamilyData.value.motherPrefix = data.motherPrefix ?? "";
FamilyData.value.motherPrefixId = guidCheck(data.motherPrefix) ?? "";
FamilyData.value.motherFirstName = data.motherFirstName ?? "";
FamilyData.value.motherLastName = data.motherLastName ?? "";
FamilyData.value.motherOccupation = data.motherOccupation ?? "";
} else if (type == "Exam") {
ExamData.value.pointA = data.pointA;
ExamData.value.pointB = data.pointB;
ExamData.value.pointC = data.pointC;
ExamData.value.point = data.point;
ExamData.value.pointTotalA = data.pointTotalA;
ExamData.value.pointTotalB = data.pointTotalB;
ExamData.value.pointTotalC = data.pointTotalC;
ExamData.value.pointTotal = data.pointTotal;
ExamData.value.examNumber = data.examNumber;
ExamData.value.examRound = data.examRound;
ExamData.value.pass = data.pass;
}
QualificationData.value = data.isProperty;
let listRow: Education[] = [];
data.education.map((row: any) => {
listRow.push({
id: guidCheck(row.id) ?? "",
educationLevel: row.educationLevel ?? "",
educationLevelId: guidCheck(row.educationLevelId) ?? "",
institute: row.institute ?? "",
degree: row.degree ?? "",
field: row.field ?? "",
gpa: row.gpa ?? "",
country: row.country ?? "",
duration: row.duration ?? "",
other: row.other ?? "",
fundName: row.fundName ?? "",
durationYear: row.durationYear ?? 0,
finishDate: row.finishDate ?? new Date(),
isDate: row.isDate ? "true" : "false",
startDate: row.startDate ? new Date(row.startDate) : new Date(),
endDate: row.endDate ? new Date(row.endDate) : new Date(),
positionPath: row.positionPath ?? "",
isEducation: row.isEducation ? true : false,
});
});
EducationData.value = listRow;
let listCert: Certificate[] = [];
data.certificates.map((row: any) => {
listCert.push({
id: guidCheck(row.id) ?? "",
certificateNo: guidCheck(row.certificateNo) ?? "",
issuer: row.issuer ?? "",
issueDate: new Date(row.issueDate) ?? new Date(),
expireDate: new Date(row.expireDate) ?? new Date(),
certificateType: row.certificateType ?? "",
});
});
CertificateData.value = listCert;
})
.catch((e: any) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
/**
* get รายการ ข้อมูลเกี่ยวกับบุคคล
*/
const fetchPerson = async () => {
await http
.get(config.API.profileNewMetaMain)
.then((res) => {
const data = res.data.result;
//กรุ๊ปเลือด
let optionbloodGroups: optionData[] = [];
data.bloodGroups.map((r: any) => {
optionbloodGroups.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.bloodOps = optionbloodGroups;
OpsFilter.value.bloodOps = optionbloodGroups;
//เพศ
let optiongenders: optionData[] = [];
data.genders.map((r: any) => {
optiongenders.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.genderOps = optiongenders;
OpsFilter.value.genderOps = optiongenders;
//คำนำหน้าชื่อ
let optionprefixs: optionData[] = [];
data.prefixs.map((r: any) => {
optionprefixs.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.prefixOps = optionprefixs;
OpsFilter.value.prefixOps = optionprefixs;
//สถานภาพ
let optionrelationships: optionData[] = [];
data.relationships.map((r: any) => {
optionrelationships.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.statusOps = optionrelationships;
OpsFilter.value.statusOps = optionrelationships;
//ศาสนา
let optionreligions: optionData[] = [];
data.religions.map((r: any) => {
optionreligions.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.religionOps = optionreligions;
OpsFilter.value.religionOps = optionreligions;
})
.catch((e: any) => {})
.finally(() => {
});
};
onMounted(async () => {
// await checkProfileData();
await fetchData();
await changeTab("information");
await fetchPerson()
});
</script>
<template>
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 row q-pb-sm">
@ -262,13 +500,15 @@ const fetchData = async () => {
<Informationvue
v-model:statusEdit="statusEdit"
v-model:data="InformationData"
:fetch="fetchData"
:fetch="fetchDataByType"
:Ops="Ops"
:OpsFilter="OpsFilter"
/>
<div class="col-12 q-px-md"><q-separator size="4px" /></div>
<Addressvue
v-model:statusEdit="statusEdit"
v-model:data="AddressData"
:fetch="fetchData"
:fetch="fetchDataByType"
/>
</div>
@ -277,7 +517,9 @@ const fetchData = async () => {
<Familyvue
v-model:statusEdit="statusEdit"
v-model:data="FamilyData"
:fetch="fetchData"
:fetch="fetchDataByType"
:Ops="Ops"
:OpsFilter="OpsFilter"
/>
</div>

29
src/modules/05_placement/components/PersonalDetail/Information/Address.vue
View file

@ -52,6 +52,7 @@ const {
dialogConfirm,
} = mixin;
const edit = ref<boolean>(false);
const onEdit = ref<boolean>(false);
const addressData = ref<AddressType>(props.data);
const myform = ref<any>();
const Ops = ref<AddressOps>({
@ -133,9 +134,21 @@ const filterSelector = (val: any, update: Function, refData: string) => {
const refreshData = async () => {
myform.value.reset();
// await props.fetch();
await fetchProvince();
await getNewData();
if (onEdit.value) {
dialogConfirm(
$q,
async () => {
emit("update:statusEdit", false);
await props.fetch("Address");
edit.value = false;
onEdit.value = false;
},
`ข้อมูลมีการแก้ไข`,
`ยืนยันยกเลิกการแก้ไขใช่หรือไม่?`
);
} else {
edit.value = false;
}
};
const getNewData = async () => {
@ -145,7 +158,7 @@ const getNewData = async () => {
// บันทึกข้อมูล
const editData = async () => {
dialogConfirm($q, async() => {
dialogConfirm($q, async () => {
const body = {
registrationSame: addressData.value.registSame == "1",
registrationAddress: addressData.value.registAddress,
@ -189,8 +202,7 @@ const editData = async () => {
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await getNewData();
await props.fetch();
await props.fetch("Address");
// await fetchProvince();
});
});
@ -326,7 +338,7 @@ const fetchDistrict = async (id: string | null, position: string) => {
if (id != null && id != "") {
showLoader();
await http
.get(config.API.orgProvince+`/${id}`)
.get(config.API.orgProvince + `/${id}`)
.then(async (res) => {
const data = res.data.result.districts;
let option: optionData[] = [];
@ -372,7 +384,7 @@ const fetchSubDistrict = async (id: string | null, position: string) => {
if (id != null && id != "") {
showLoader();
await http
.get(config.API.orgDistrict+`/${id}`)
.get(config.API.orgDistrict + `/${id}`)
.then(async (res) => {
const data = res.data.result.subDistricts;
let option: zipCodeOption[] = [];
@ -420,7 +432,6 @@ const fetchSubDistrict = async (id: string | null, position: string) => {
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false;
props.notiNoEdit();
} else {
emit("update:statusEdit", true);

58
src/modules/05_placement/components/PersonalDetail/Information/Family.vue
View file

@ -29,6 +29,12 @@ const props = defineProps({
type: Object as PropType<Family>,
default: FamilyDataDefualt,
},
Ops: {
type: Object as PropType<any>,
},
OpsFilter: {
type: Object as PropType<any>,
},
});
const emit = defineEmits(["update:statusEdit"]);
@ -45,26 +51,18 @@ const {
dialogConfirm,
} = mixin;
const edit = ref<boolean>(false);
const onEdit = ref<boolean>(false);
const myform = ref<QForm | null>(null);
const familyData = ref<Family>(props.data);
const Ops = ref<any>({
prefixOps: [],
});
const OpsFilter = ref<any>({
prefixOps: [],
});
onMounted(async () => {
await fetchPrefix();
emit("update:statusEdit", false);
});
const filterSelector = (val: any, update: Function, refData: string) => {
update(() => {
Ops.value[`${refData}`] = OpsFilter.value[`${refData}`].filter(
props.Ops[`${refData}`] = props.OpsFilter[`${refData}`].filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
@ -74,29 +72,21 @@ const refreshData = async () => {
if (myform.value != null) {
myform.value.reset();
}
emit("update:statusEdit", false);
await props.fetch();
};
const fetchPrefix = async () => {
showLoader();
await http
.get(config.API.profileNewMetaMain)
.then((res) => {
const data = res.data.result;
let option: DataOption[] = [];
data.prefixs.map((r: any) => {
option.push({ id: r.name.toString(), name: r.name.toString() });
});
Ops.value.prefixOps = option;
OpsFilter.value.prefixOps = option;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
if (onEdit.value) {
dialogConfirm(
$q,
async () => {
emit("update:statusEdit", false);
await props.fetch("Family");
edit.value = false;
onEdit.value = false;
},
`ข้อมูลมีการแก้ไข`,
`ยืนยันยกเลิกการแก้ไขใช่หรือไม่?`
);
} else {
edit.value = false;
}
};
const editData = async () => {
@ -153,7 +143,7 @@ const editData = async () => {
hideLoader();
edit.value = false;
emit("update:statusEdit", false);
await props.fetch();
await props.fetch("Family");
});
});
};

162
src/modules/05_placement/components/PersonalDetail/Information/Information.vue
View file

@ -9,10 +9,6 @@ import type {
} from "@/modules/05_placement/components/PersonalDetail/profileType";
import { defaultInformation } from "@/modules/05_placement/components/PersonalDetail/profileType";
import type {
InformationOps,
optionData,
} from "@/modules/05_placement/interface/index/Main";
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
import http from "@/plugins/http";
@ -40,6 +36,12 @@ const props = defineProps({
type: Object as PropType<Information>,
default: defaultInformation,
},
Ops: {
type: Object as PropType<any>,
},
OpsFilter: {
type: Object as PropType<any>,
},
});
const emit = defineEmits(["update:statusEdit"]);
@ -63,39 +65,8 @@ const edit = ref<boolean>(false);
const informaData = ref<Information>(props.data);
const age = ref<boolean>(true);
const myform = ref<QForm | null>(null);
const Ops = ref<InformationOps>({
prefixOps: [],
genderOps: [],
bloodOps: [],
statusOps: [],
religionOps: [],
employeeClassOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
employeeTypeOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
});
const OpsFilter = ref<InformationOps>({
prefixOps: [],
genderOps: [],
bloodOps: [],
statusOps: [],
religionOps: [],
employeeClassOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
employeeTypeOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
});
onMounted(async () => {
await fetchPerson();
emit("update:statusEdit", false);
});
@ -103,127 +74,72 @@ const onCancel = async () => {
if (myform.value != null) {
myform.value.reset();
}
await props.fetch();
};
if (onEdit.value) {
dialogConfirm(
$q,
async () => {
emit("update:statusEdit", false);
await props.fetch("Information");
edit.value = false;
onEdit.value = false;
},
`ข้อมูลมีการแก้ไข`,
`ยืนยันยกเลิกการแก้ไขใช่หรือไม่?`
);
/**
* get รายการ ข้อมูลเกี่ยวกับบุคคล
*/
const fetchPerson = async () => {
showLoader();
await http
.get(config.API.profileNewMetaMain)
.then((res) => {
const data = res.data.result;
//กรุ๊ปเลือด
let optionbloodGroups: optionData[] = [];
data.bloodGroups.map((r: any) => {
optionbloodGroups.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.bloodOps = optionbloodGroups;
OpsFilter.value.bloodOps = optionbloodGroups;
//เพศ
let optiongenders: optionData[] = [];
data.genders.map((r: any) => {
optiongenders.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.genderOps = optiongenders;
OpsFilter.value.genderOps = optiongenders;
//คำนำหน้าชื่อ
let optionprefixs: optionData[] = [];
data.prefixs.map((r: any) => {
optionprefixs.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.prefixOps = optionprefixs;
OpsFilter.value.prefixOps = optionprefixs;
//สถานภาพ
let optionrelationships: optionData[] = [];
data.relationships.map((r: any) => {
optionrelationships.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.statusOps = optionrelationships;
OpsFilter.value.statusOps = optionrelationships;
//ศาสนา
let optionreligions: optionData[] = [];
data.religions.map((r: any) => {
optionreligions.push({
id: r.name ?? "",
name: r.name ?? "",
});
});
Ops.value.religionOps = optionreligions;
OpsFilter.value.religionOps = optionreligions;
})
.catch((e: any) => {})
.finally(() => {
hideLoader();
});
} else {
edit.value = false;
}
};
const filterSelector = (val: any, update: Function, refData: string) => {
switch (refData) {
case "prefixOps":
update(() => {
Ops.value.prefixOps = OpsFilter.value.prefixOps.filter(
props.Ops.prefixOps = props.OpsFilter.prefixOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "genderOps":
update(() => {
Ops.value.genderOps = OpsFilter.value.genderOps.filter(
props.Ops.genderOps = props.OpsFilter.genderOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "bloodOps":
update(() => {
Ops.value.bloodOps = OpsFilter.value.bloodOps.filter(
props.Ops.bloodOps = props.OpsFilter.bloodOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "statusOps":
update(() => {
Ops.value.statusOps = OpsFilter.value.statusOps.filter(
props.Ops.statusOps = props.OpsFilter.statusOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "religionOps":
update(() => {
Ops.value.religionOps = OpsFilter.value.religionOps.filter(
props.Ops.religionOps = props.OpsFilter.religionOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "employeeClassOps":
update(() => {
Ops.value.employeeClassOps = OpsFilter.value.employeeClassOps.filter(
props.Ops.employeeClassOps = props.OpsFilter.employeeClassOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "employeeTypeOps":
update(() => {
Ops.value.employeeTypeOps = OpsFilter.value.employeeTypeOps.filter(
props.Ops.employeeTypeOps = props.OpsFilter.employeeTypeOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
@ -237,6 +153,7 @@ const filterSelector = (val: any, update: Function, refData: string) => {
const handleDate = async (modelData: Date) => {
informaData.value.dateOfBirth = modelData;
await calRetire(modelData);
onEdit.value = true;
};
const calRetire = async (birth: Date) => {
@ -299,7 +216,7 @@ const editData = async () => {
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await props.fetch();
await props.fetch("Information");
await changeBirth(informaData.value.dateOfBirth ?? new Date());
});
});
@ -318,7 +235,6 @@ const saveData = async () => {
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false;
props.notiNoEdit();
} else {
emit("update:statusEdit", true);
@ -334,6 +250,11 @@ const getClass = (val: boolean) => {
"full-width cursor-pointer": !val,
};
};
const onEdit = ref<boolean>(false);
function checkEdit() {
onEdit.value = true;
}
</script>
<template>
<q-card flat bordered class="col-12 q-px-lg q-py-md no-border">
@ -368,10 +289,12 @@ const getClass = (val: boolean) => {
]"
label="เลขประจำตัวประชาชน"
mask="#############"
@update:modelValue="checkEdit"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
@update:modelValue="checkEdit"
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
@ -408,6 +331,7 @@ const getClass = (val: boolean) => {
v-model="informaData.firstname"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
@update:modelValue="checkEdit"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
@ -422,6 +346,7 @@ const getClass = (val: boolean) => {
v-model="informaData.lastname"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
@update:modelValue="checkEdit"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
@ -486,6 +411,7 @@ const getClass = (val: boolean) => {
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
@update:modelValue="checkEdit"
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
@ -511,6 +437,7 @@ const getClass = (val: boolean) => {
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
@update:modelValue="checkEdit"
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
@ -536,6 +463,7 @@ const getClass = (val: boolean) => {
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
@update:modelValue="checkEdit"
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
@ -561,6 +489,7 @@ const getClass = (val: boolean) => {
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
@update:modelValue="checkEdit"
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
@ -575,6 +504,7 @@ const getClass = (val: boolean) => {
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
@update:modelValue="checkEdit"
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
@ -589,6 +519,7 @@ const getClass = (val: boolean) => {
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
@update:modelValue="checkEdit"
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
@ -614,6 +545,7 @@ const getClass = (val: boolean) => {
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
@update:modelValue="checkEdit"
hide-bottom-space
:outlined="edit"
dense

1
src/modules/05_placement/components/PersonalDetail/Information/top.vue
View file

@ -71,7 +71,6 @@ const historyClick = async () => {
};
const ClickCancel = () => {
updateEdit(!props.edit);
props.cancel();
props.changeBtn();
};

47
src/modules/05_placement/components/PersonalDetail/Qualification.vue
View file

@ -77,29 +77,30 @@ const onCancel = async () => {
};
</script>
<template>
<div class="row col-12 q-px-lg q-pt-lg q-pb-sm no-border">
<HeaderTop
v-model:edit="edit"
header="การคัดกรองคุณสมบัติ"
icon="mdi-account-search"
:save="saveData"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="onCancel"
/>
</div>
<div class="row q-px-lg">
<div v-for="item of props.data" :key="item.name" class="col-12 q-pt-sm">
<q-checkbox
size="xs"
v-model="item.value"
:label="item.name"
keep-color
color="gray-5"
:disable="!statusEdit"
<q-form ref="myform" greedy @submit.prevent @validation-success="saveData">
<div class="row col-12 q-px-lg q-pt-lg q-pb-sm no-border">
<HeaderTop
v-model:edit="edit"
header="การคัดกรองคุณสมบัติ"
icon="mdi-account-search"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="onCancel"
/>
<q-separator />
</div>
</div>
<div class="row q-px-lg">
<div v-for="item of props.data" :key="item.name" class="col-12 q-pt-sm">
<q-checkbox
size="xs"
v-model="item.value"
:label="item.name"
keep-color
color="gray-5"
:disable="!statusEdit"
/>
<q-separator />
</div>
</div>
</q-form>
</template>

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

@ -59,7 +59,7 @@ interface appointmentData {
}
interface UserData {
personalId: string;
id: string;
citizenId: string;
fullname: string;
organizationName: string;