บรรจุ แต่งตั้ง ย้าย โอน => ปรับ code และ load

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-08-19 16:14:43 +07:00
parent 9f4aeec575
commit 34dc306288
30 changed files with 1154 additions and 1429 deletions

View file

@ -8,7 +8,6 @@ import { useCounterMixin } from "@/stores/mixin";
import { useTransferDataStore } from "@/modules/05_placement/store";
import Dialogbody from "@/modules/05_placement/components/AppointEmployee/Dialogbody.vue";
// import DialogOrgTree from "@/modules/05_placement/components/AppointEmployee/Modal.vue";
import DialogHeader from "@/components/DialogHeader.vue";
import type {
listAppointType,
@ -19,7 +18,8 @@ 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";
import DialogHeader from "@/components/DialogHeader.vue";
import DialogOrgSelectEmployee from "@/components/Dialogs/DialogOrgSelectEmployee.vue"; //
const typeModal = ref<string>("");
const posType = ref<string>("");
@ -39,16 +39,12 @@ const {
messageError,
date2Thai,
dialogRemove,
dialogConfirm,
dialogMessageNotify,
} = mixin;
const rowsPosition = ref<any>([]);
const router = useRouter();
const rows = ref<listAppointType[]>([]);
const rows2 = ref<listAppointType[]>([]);
const modalTree = ref<boolean>(false);
const ModalEmployee = ref<boolean>(false);
const personal = ref<resData[]>([]);
const personalId = ref<string>("");
const filterKeyword = ref<string>("");
const filterKeyword2 = ref<string>("");
@ -56,7 +52,7 @@ const filterRef = ref<any>(null);
const listRecevice = ref<resData[]>([]);
const optionsType = ref<OpType[]>([]);
const type = ref<string>("");
const selectedPosition = ref<any>([]);
const visibleColumns = ref<string[]>([
"no",
"citizenId",
@ -66,124 +62,12 @@ const visibleColumns = ref<string[]>([
"createdAt",
"status",
]);
const visibleColumnsPosition = ref<String[]>([
"organizationOrganizationName",
"organizationAgencyName",
"organizationGovernmentAgencyName",
"organizationShortName",
"organizationTypeName",
"organizationLevelName",
"positionEmployeeLineName",
"positionEmployeePositionName",
"posNo",
]);
const pagination = ref({
sortBy: "createdAt",
descending: true,
page: 1,
rowsPerPage: 10,
});
const columnsPosition = ref<QTableProps["columns"]>([
{
name: "organizationOrganizationName",
align: "left",
label: "หน่วยงาน",
sortable: true,
field: "organizationOrganizationName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "organizationAgencyName",
align: "left",
label: "รหัสหน่วยงาน",
sortable: true,
field: "organizationAgencyName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "organizationGovernmentAgencyName",
align: "left",
label: "รหัสส่วนราชการ",
sortable: true,
field: "organizationGovernmentAgencyName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "organizationShortName",
align: "left",
label: "ชื่อย่อหน่วยงาน",
sortable: true,
field: "organizationShortName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "organizationTypeName",
align: "left",
label: "ประเภทหน่วยงาน",
sortable: true,
field: "organizationTypeName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "organizationLevelName",
align: "left",
label: "ระดับหน่วยงาน",
sortable: true,
field: "organizationLevelName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionEmployeeLineName",
align: "left",
label: "สายงาน",
sortable: true,
field: "positionEmployeeLineName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionEmployeePositionName",
align: "left",
label: "ตำแหน่ง",
sortable: true,
field: "positionEmployeePositionName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "posNo",
align: "left",
label: "ตำแหน่งเลขที่",
sortable: true,
field: "posNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
@ -249,39 +133,29 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
/**
* เซ input
*/
function resetFilter() {
filterKeyword.value = "";
filterKeyword2.value = "";
filterRef.value.focus();
}
onMounted(() => {
fecthlistappointment();
});
// API
const fecthlistappointment = async () => {
/**
* fetch รายการปรบระดบชนงานลกจาง
*/
function fecthlistappointment() {
showLoader();
rows.value = [];
await http
http
.get(config.API.appointEmployee())
.then((res) => {
let response = res.data.result;
listRecevice.value = response;
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: any) =>
e.root !== null &&
@ -302,205 +176,75 @@ const fecthlistappointment = async () => {
.finally(() => {
hideLoader();
});
};
}
//
const fecthTypeOption = async () => {
type.value = "";
await http
.get(config.API.typeOrder())
.then((res) => {
optionsType.value = res.data.result.filter(
(e: OpType) =>
e.commandCode === "C-PM-22" || e.commandCode === "C-PM-24"
);
type.value = optionsType.value[0].id;
})
.catch((e) => {
messageError($q, e);
});
};
//
const openModalEmployee = async (id: string) => {
personalId.value = id;
await getPosition(id);
};
const getPosition = async (id: string) => {
showLoader();
await http
.get(config.API.organizationEmployee)
.then((res) => {
const { result } = res.data;
let data: any[] = [];
result.map((r: any) => {
data.push({
id: r.id,
agency: r.agency,
conditionNote: r.conditionNote,
department: r.department,
government: r.government,
isActive: r.isActive,
isCondition: r.isCondition,
isDirector: r.isDirector,
organizationUserNote: r.organizationUserNote,
qualification: r.qualification,
pile: r.pile,
posNo: r.posNo,
positionCondition: r.positionCondition,
positionMasterUserNote: r.positionMasterUserNote,
organizationOrder: r.organizationOrder,
organizationFaxId: r.organizationFaxId,
organizationLevelId: r.organizationLevelId,
organizationOrganizationId: r.organizationOrganizationId,
organizationTelExternalId: r.organizationTelExternalId,
organizationTelInternalId: r.organizationTelInternalId,
organizationTypeId: r.organizationTypeId,
positionEmployeeStatusId: r.positionEmployeeStatusId,
positionEmployeeLineId: r.positionEmployeeLineId,
positionEmployeePositionId: r.positionEmployeePositionId,
organizationAgencyId: r.organizationAgencyId,
organizationGovernmentAgencyId: r.organizationGovernmentAgencyId,
organizationShortNameId: r.organizationShortNameId,
organizationFaxName: r.organizationFaxName,
organizationLevelName: r.organizationLevel,
organizationOrganizationName: r.organizationOrganization,
organizationTelExternalName: r.organizationTelExternal,
organizationTelInternalName: r.organizationTelInternal,
organizationTypeName: r.organizationType,
positionEmployeeStatusName: r.positionEmployeeStatus,
positionEmployeeLineName: r.positionEmployeeLine,
positionEmployeePositionName: r.positionEmployeePosition,
organizationAgencyName: r.organizationAgencyCode,
organizationGovernmentAgencyName: r.organizationGovernmentAgencyCode,
organizationShortName: r.organizationShortName,
positionEmployeeLevels: r.positionEmployeeLevels,
positionEmployeePositionSides: r.positionEmployeePositionSides,
use: r.use,
});
});
const index = data.findIndex((r: any) => r.use == true);
if (index >= 0) {
selectedPosition.value = [data[index]];
}
rowsPosition.value = data;
ModalEmployee.value = true;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
//
/**
* นยนลบรายการปรบระดบชนงานลกจาง
* @param id รายการปรบระดบชนงานลกจาง
*/
const clickDelete = (id: string) => {
dialogRemove($q, () => deleteAppoint(id));
};
//
const deleteAppoint = async (id: string) => {
showLoader();
await http
.delete(config.API.appointEmployeeByid(id))
.then(() => {
success($q, "ลบข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
fecthlistappointment();
hideLoader();
});
};
// modal
const closeModalTree = async () => {
await fecthlistappointment();
modalTree.value = false;
dialogRemove($q, () => {
showLoader();
http
.delete(config.API.appointEmployeeByid(id))
.then(async () => {
await fecthlistappointment();
await success($q, "ลบข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
});
};
//
const nextPage = (id: string) => {
/**
* redialect รายละเอยดการปรบระดบชนงานลกจาง
* @param id รายการปรบระดบชนงานลกจาง
*/
function nextPage(id: string) {
router.push({
path: `appoint-employee/detail/${id}`,
});
};
// input
const resetFilter = () => {
filterKeyword.value = "";
filterKeyword2.value = "";
filterRef.value.focus();
};
// modal
const clickClose = () => {
modal.value = false;
ModalEmployee.value = false;
};
// modal
const popup = () => {
}
/**
* เป popup งไปออกคำส
*/
function popup() {
modal.value = true;
filterKeyword2.value = "";
// fecthTypeOption();
};
}
const checkSave = () => {
dialogConfirm($q, async () => await saveData());
};
//
const saveData = async () => {
if (selectedPosition.value.length == 0) {
dialogMessageNotify($q, "ไม่สามารถบันทึกข้อมูลได้ กรุณาเลือกตำแหน่ง");
return;
} else {
await savePosition();
}
};
//
const savePosition = async () => {
showLoader();
const data = {
organizationEmployeeId: selectedPosition.value[0].id,
};
await http
.put(config.API.appointEmployeePosition(personalId.value), data)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
fecthlistappointment();
clickClose();
});
};
// // dialog
// const modalOpenClose = () => {
// modal.value = !modal.value;
// if (!modal.value) {
// selectedPosition.value = [];
// rowsPosition.value = [];
// id.value = "";
// }
// };
/**
* popup งไปออกคำส
*/
function clickClose() {
modal.value = false;
}
/**
* เป popup เลอกหนวยงาน
* @param data อมลหนวยงาน
* @param type ประเภท าย,ปร
*/
function openModalTree(data: any, type: string) {
modalTree.value = true;
typeModal.value = type;
personalId.value = data.id;
dataRows.value = data;
posType.value = data.posTypeNameOld;
posLevel.value = data.posLevelNameOld;
position.value = data.positionOld;
modalTree.value = true;
}
/**
* นยนการบนทกขอมลเลอกตำแหน
*/
function onSave(data: any) {
console.log("not save", data);
const dataAppoint = {
// personalId: data.personalId,
node: data.node,
nodeId: data.nodeId,
orgRevisionId: data.orgRevisionId,
@ -519,19 +263,23 @@ function onSave(data: any) {
showLoader();
http
.put(config.API.appointmentPosition(personalId.value), dataAppoint)
.then((res) => {
.then(async () => {
await fecthlistappointment();
await success($q, "บันทึกสำเร็จ");
modalTree.value = false;
success($q, "บันทึกสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
fecthlistappointment();
.finally(() => {
hideLoader();
});
}
onMounted(() => {
fecthlistappointment();
});
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
รายการปรบระดบชนงานลกจาง
@ -772,86 +520,7 @@ function onSave(data: any) {
</div>
</div>
</q-card>
<q-dialog v-model="ModalEmployee" persistent>
<q-card style="width: 70vw; max-width: 70vw">
<DialogHeader :tittle="'กำหนดตำแหน่ง'" :close="clickClose" />
<q-separator />
<q-card-section class="q-pa-sm">
<div class="row justify-end">
<div class="col-5">
<q-toolbar style="padding: 0">
<q-input
borderless
outlined
dense
ref="filterRef"
debounce="300"
v-model="filterKeyword2"
placeholder="ค้นหา"
style="width: 850px; max-width: auto"
>
<template v-slot:append>
<q-icon v-if="filterKeyword2 == ''" name="search" />
<q-icon
v-if="filterKeyword2 !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select
v-model="visibleColumnsPosition"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columnsPosition"
option-value="name"
options-cover
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</q-toolbar>
</div>
</div>
<d-table
:rows="rowsPosition"
:columns="columnsPosition"
:filter="filterKeyword2"
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"
/>
</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"
>
</q-btn>
</q-card-actions>
</q-card>
</q-dialog>
<Dialogbody
v-model:Modal="modal"
:clickClose="clickClose"
@ -862,12 +531,6 @@ function onSave(data: any) {
:nextPage="nextPage"
:fecthlistappointment="fecthlistappointment"
/>
<!-- <DialogOrgTree
v-model:modal="modalTree"
:close="closeModalTree"
:personal="personal"
:personalId="personalId"
/> -->
<DialogOrgSelectEmployee
:title="`เลือกหน่วยงานที่รับการปรับระดับชั้นงาน`"