อัตรากำลังลูกจ้างประจำฯ

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-03-14 17:39:20 +07:00
parent 748a878deb
commit 4091d21270
3 changed files with 162 additions and 646 deletions

View file

@ -76,4 +76,5 @@ export default {
orgDeleteProfileEmp: (id: string) => `${orgEmployeePos}/profile/delete/${id}`, orgDeleteProfileEmp: (id: string) => `${orgEmployeePos}/profile/delete/${id}`,
orgPosMasterByIdEmp: (id: string) => `${orgEmployeePos}/master/${id}`, orgPosMasterByIdEmp: (id: string) => `${orgEmployeePos}/master/${id}`,
orgPosMasterListEmp: `${orgEmployeePos}/master/list`, orgPosMasterListEmp: `${orgEmployeePos}/master/list`,
orgPosMasterEmp: `${orgEmployeePos}/master`,
}; };

View file

@ -1,27 +1,21 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, reactive, watch, defineProps } from "vue"; import { ref, reactive, watch, defineProps } from "vue";
import type { QTableProps } from "quasar";
import { useQuasar } from "quasar"; import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import DialogHeader from "@/components/DialogHeader.vue";
import http from "@/plugins/http"; import http from "@/plugins/http";
import config from "@/app.config"; import config from "@/app.config";
import type {
FormDataPosition,
FormPositionRef,
DataOption,
FormPositionSelect,
RowDetailPositions,
FormPositionSelectRef,
ListMenu,
} from "@/modules/16_positionEmployee/interface/index/Main";
import type { import type {
OptionType, ResGroup,
OptionLevel, ResLevel,
OptionExecutive, } from "@/modules/01_metadataNew/interface/response/positionEmployee/Main";
DataPosition, import type { ObjectPosRef } from "@/modules/01_metadataNew/interface/index/positionEmployee";
} from "@/modules/16_positionEmployee/interface/response/organizational"; import type { DataOption } from "@/modules/16_positionEmployee/interface/index/Main";
import type { OptionType } from "@/modules/16_positionEmployee/interface/response/organizational";
import DialogHeader from "@/components/DialogHeader.vue";
import { useCounterMixin } from "@/stores/mixin";
const isSpecial = ref<boolean>(false); const isSpecial = ref<boolean>(false);
const props = defineProps({ const props = defineProps({
@ -32,63 +26,36 @@ const props = defineProps({
}); });
const modal = defineModel<boolean>("modalAdd", { required: true }); const modal = defineModel<boolean>("modalAdd", { required: true });
const isEditCheck = defineModel<boolean>("isEdit", { required: true }); const isEditCheck = defineModel<boolean>("isEdit", { required: true });
const dataLevel = ref<any>();
const $q = useQuasar(); const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const { dialogConfirm, showLoader, hideLoader, messageError, success } = mixin;
dialogConfirm,
showLoader,
hideLoader,
messageError,
success,
dialogRemove,
} = mixin;
const isReadonly = ref<boolean>(false); //
const isDisValidate = ref<boolean>(false); const isDisValidate = ref<boolean>(false);
const positionNameRef = ref<Object | null>(null); const formDataPos = reactive({
const positionFieldRef = ref<Object | null>(null); posName: "",
const positionTypeRef = ref<Object | null>(null); posTypeName: "",
const positionLevelRef = ref<Object | null>(null); posLevelName: "",
const positionExecutiveRef = ref<Object | null>(null);
const positionExecutiveFieldRef = ref<Object | null>(null);
const positionAreaRef = ref<Object | null>(null);
const typeOpsMain = ref<DataOption[]>([]);
const levelOpsMain = ref<DataOption[]>([]);
const executiveOpsMain = ref<DataOption[]>([]);
const executiveOps = ref<DataOption[]>([]);
const typeOps = ref<DataOption[]>([]);
const levelOps = ref<DataOption[]>([]);
const formPositionSelect = reactive<FormPositionSelect>({
positionId: "",
positionName: "",
positionField: "",
positionType: "",
positionLevel: "",
positionExecutive: "",
positionExecutiveField: "",
positionArea: "",
}); });
const objectPositionSelectRef: FormPositionSelectRef = { const posNameRef = ref<object | null>(null);
positionName: positionNameRef, const posTypeNameRef = ref<object | null>(null);
positionField: positionFieldRef, const posLevelNameRef = ref<object | null>(null);
positionType: positionTypeRef, const objectRef: ObjectPosRef = {
positionLevel: positionLevelRef, posName: posNameRef,
positionExecutive: positionExecutiveRef, posTypeName: posTypeNameRef,
positionExecutiveField: positionExecutiveFieldRef, posLevelName: posLevelNameRef,
positionArea: positionAreaRef,
}; };
const posTypeMain = ref<ResGroup[]>([]);
const posTypeOp = ref<DataOption[]>([]);
const posLevelOp = ref<DataOption[]>([]);
/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */ /** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
function validateFormPositionEdit() { function validateFormPositionEdit() {
isDisValidate.value = false; isDisValidate.value = false;
const hasError = []; const hasError = [];
for (const key in objectPositionSelectRef) { for (const key in objectRef) {
if (Object.prototype.hasOwnProperty.call(objectPositionSelectRef, key)) { if (Object.prototype.hasOwnProperty.call(objectRef, key)) {
const property = objectPositionSelectRef[key]; const property = objectRef[key];
if (property.value && typeof property.value.validate === "function") { if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate(); const isValid = property.value.validate();
hasError.push(isValid); hasError.push(isValid);
@ -96,124 +63,45 @@ function validateFormPositionEdit() {
} }
} }
if (hasError.every((result) => result === true)) { if (hasError.every((result) => result === true)) {
if (isEditCheck.value == true) { dialogConfirm($q, () => {
saveSelectEdit(); submit();
} else { });
onSubmitSelectEdit();
}
} }
} }
async function submit() {
function saveSelectEdit() { const body = {
console.log(formPositionSelect.positionExecutive); posDictName: formDataPos.posName,
dialogConfirm( posTypeId: formDataPos.posTypeName,
$q, posLevelId: formDataPos.posLevelName,
async () => { };
showLoader(); showLoader();
const body = { try {
posDictName: formPositionSelect.positionName, const url = !isEditCheck.value
posDictField: formPositionSelect.positionField, // ? config.API.orgEmployeePos
posTypeId: formPositionSelect.positionType, //* : config.API.orgEmployeePosById(props?.data?.id);
posLevelId: formPositionSelect.positionLevel, //* await http[!isEditCheck.value ? "post" : "put"](url, body);
posExecutiveId: formPositionSelect.positionExecutive, // success($q, "บันทีกข้อมูลสำเร็จ");
posDictExecutiveField: formPositionSelect.positionExecutiveField, // props.emitSearch?.(formDataPos.posName, "positionName");
posDictArea: formPositionSelect.positionArea, /// close();
isSpecial: isSpecial.value, } catch (err) {
}; messageError($q, err);
await http } finally {
.put(config.API.orgPosPositionById(formPositionSelect.positionId), body) hideLoader();
.then(() => { }
success($q, "เพิ่มข้อมูลสำเร็จ");
props.getData?.();
close();
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
},
"ยืนยันการแก้ไขตำแหน่ง",
"ต้องการยืนยันแก้ไขตำแหน่งนี้ใช่หรือไม่?"
);
}
/** ฟังชั่น บันทึก */
function onSubmitSelectEdit() {
console.log(formPositionSelect.positionExecutive);
dialogConfirm(
$q,
async () => {
showLoader();
const body = {
posDictName: formPositionSelect.positionName,
posDictField: formPositionSelect.positionField, //
posTypeId: formPositionSelect.positionType, //*
posLevelId: formPositionSelect.positionLevel, //*
posExecutiveId: formPositionSelect.positionExecutive, //
posDictExecutiveField: formPositionSelect.positionExecutiveField, //
posDictArea: formPositionSelect.positionArea, ///
isSpecial: isSpecial.value,
};
await http
.post(config.API.orgPosPosition, body)
.then(() => {
success($q, "เพิ่มข้อมูลสำเร็จ");
props.emitSearch?.(formPositionSelect.positionName, "positionName");
close();
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
},
"ยืนยันการเพิ่มตำแหน่ง",
"ต้องการยืนยันการเพิ่มตำแหน่งนี้ใช่หรือไม่?"
);
} }
async function clearFormPositionSelect() { async function clearFormPositionSelect() {
isEditCheck.value = false; isEditCheck.value = false;
isDisValidate.value = await true; isDisValidate.value = true;
formPositionSelect.positionId = ""; formDataPos.posName = "";
formPositionSelect.positionName = ""; formDataPos.posTypeName = "";
formPositionSelect.positionField = ""; formDataPos.posLevelName = "";
formPositionSelect.positionType = "";
formPositionSelect.positionLevel = "";
formPositionSelect.positionExecutive = "";
formPositionSelect.positionExecutiveField = "";
formPositionSelect.positionArea = "";
isSpecial.value = false; isSpecial.value = false;
setTimeout(async () => { setTimeout(() => {
isDisValidate.value = await false; isDisValidate.value = false;
}, 1000); }, 1000);
} }
/**
* งค css ออกไปตามเงอนไข
* @param val true/false
*/
function inputEdit(val: boolean) {
return {
"full-width cursor-pointer inputgreen ": val,
"full-width cursor-pointer inputgreen": !val,
};
}
function updateSelectType(val: string) {
const listLevel = dataLevel.value.find((e: any) => e.id === val);
levelOpsMain.value = listLevel.posLevels.map((e: OptionLevel) => ({
id: e.id,
name: e.posLevelName,
}));
levelOps.value = levelOpsMain.value;
formPositionSelect.positionLevel = "";
}
function close() { function close() {
modal.value = false; modal.value = false;
clearFormPositionSelect(); clearFormPositionSelect();
@ -222,14 +110,13 @@ function close() {
async function fetchType() { async function fetchType() {
showLoader(); showLoader();
await http await http
.get(config.API.orgPosType) .get(config.API.orgEmployeeType)
.then((res) => { .then((res) => {
dataLevel.value = res.data.result; posTypeMain.value = res.data.result;
typeOpsMain.value = res.data.result.map((e: OptionType) => ({ posTypeOp.value = res.data.result.map((e: OptionType) => ({
id: e.id, id: e.id,
name: e.posTypeName, name: e.posTypeName,
})); }));
typeOps.value = typeOpsMain.value;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
@ -239,24 +126,14 @@ async function fetchType() {
}); });
} }
/** function เรียกรายการตำแหน่งทางการบริหาร */ function updatePosTypeName(id: string) {
async function fetchExecutive() { const posLevel = posTypeMain.value.find((e: ResGroup) => e.id === id);
showLoader(); posLevelOp.value =
await http posLevel?.posLevels.map((e: ResLevel) => ({
.get(config.API.orgPosExecutive) id: e.id,
.then((res) => { name: e.posLevelName.toString(),
executiveOpsMain.value = res.data.result.map((e: OptionExecutive) => ({ })) ?? [];
id: e.id, formDataPos.posLevelName = "";
name: e.posExecutiveName,
}));
executiveOps.value = executiveOpsMain.value;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
} }
watch( watch(
@ -264,26 +141,20 @@ watch(
async () => { async () => {
if (modal.value === true) { if (modal.value === true) {
await fetchType(); await fetchType();
await fetchExecutive();
if (props.data) { if (props.data) {
const dataList = props.data; const dataList = props.data;
console.log(dataList); updatePosTypeName(dataList.posTypeId);
updateSelectType(dataList.posTypeId);
formPositionSelect.positionId = dataList.id; formDataPos.posName = dataList.posDictName;
formPositionSelect.positionName = dataList.positionName; formDataPos.posTypeName = dataList.posTypeId;
formPositionSelect.positionField = dataList.positionField; formDataPos.posLevelName = dataList.posLevelId;
formPositionSelect.positionType = dataList.posTypeId;
formPositionSelect.positionLevel = dataList.posLevelId;
formPositionSelect.positionExecutive = dataList.posExecutiveId;
formPositionSelect.positionExecutiveField =
dataList.positionExecutiveField;
formPositionSelect.positionArea = dataList.positionArea;
isSpecial.value = dataList.isSpecial;
} }
} }
} }
); );
</script> </script>
<template> <template>
<q-dialog v-model="modal" persistent> <q-dialog v-model="modal" persistent>
<q-card style="min-width: 50vw"> <q-card style="min-width: 50vw">
@ -295,74 +166,27 @@ watch(
<q-card-section class="q-pa-none"> <q-card-section class="q-pa-none">
<form @submit.prevent="validateFormPositionEdit"> <form @submit.prevent="validateFormPositionEdit">
<div class="row q-col-gutter-sm col-12 q-pa-sm"> <div class="row q-col-gutter-sm col-12 q-pa-md">
<div class="col-6"> <div class="col-12">
<q-input <q-input
ref="positionNameRef" ref="posNameRef"
v-model="formPositionSelect.positionName" v-model="formDataPos.posName"
:class="inputEdit(isReadonly)"
dense dense
outlined outlined
for="#positionName" for="#positionName"
label="ตำแหน่งในสายงาน" label="ชื่อตำแหน่ง"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
:rules=" :rules="[(val) => !!val || `${'กรุณากรอกชื่อตำแหน่ง'}`]"
!isDisValidate
? [(val) => !!val || `${'กรุณากรอกตำแหน่งในสายงาน'}`]
: []
"
/>
</div>
<div class="col-6">
<q-input
ref="positionFieldRef"
v-model="formPositionSelect.positionField"
:class="inputEdit(isReadonly)"
dense
outlined
for="#positionField"
label="สายงาน"
lazy-rules
hide-bottom-space
:rules="
!isDisValidate
? [(val) => !!val || `${'กรุณากรอกสายงาน'}`]
: []
"
/> />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-select <q-select
ref="positionTypeRef" ref="posTypeNameRef"
:class="inputEdit(isReadonly)" label="กลุ่มงาน"
label="ประเภทตำแหน่ง" v-model="formDataPos.posTypeName"
v-model="formPositionSelect.positionType" :options="posTypeOp"
:options="typeOps"
emit-value
dense
@update:model-value="updateSelectType"
map-options
outlined
option-label="name"
option-value="id"
lazy-rules
hide-bottom-space
:rules="
!isDisValidate
? [(val) => !!val || `${'กรุณาเลือกประเภทตำแหน่ง'}`]
: []
"
/>
</div>
<div class="col-6">
<q-select
ref="positionLevelRef"
:class="inputEdit(isReadonly)"
label="ระดับตำแหน่ง"
v-model="formPositionSelect.positionLevel"
:disable="formPositionSelect.positionType === ''"
:options="levelOps"
emit-value emit-value
dense dense
map-options map-options
@ -371,20 +195,18 @@ watch(
option-value="id" option-value="id"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
:rules=" :rules="[(val) => !!val || `${'กรุณาเลือกกลุ่มงาน'}`]"
!isDisValidate @update:model-value="updatePosTypeName"
? [(val) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`]
: []
"
/> />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-select <q-select
ref="positionExecutiveRef" ref="posLevelNameRef"
:class="inputEdit(isReadonly)" label="ระดับชั้นงาน"
label="ตำแหน่งทางการบริหาร" v-model="formDataPos.posLevelName"
v-model="formPositionSelect.positionExecutive" :disable="formDataPos.posTypeName === ''"
:options="executiveOps" :options="posLevelOp"
emit-value emit-value
dense dense
map-options map-options
@ -393,39 +215,11 @@ watch(
option-value="id" option-value="id"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
clearable :rules="[(val) => !!val || `${'กรุณาเลือกระดับชั้นงาน'}`]"
/> />
</div> </div>
<div class="col-6">
<q-input
ref="positionExecutiveFieldRef"
v-model="formPositionSelect.positionExecutiveField"
:class="inputEdit(isReadonly)"
dense
outlined
for="#positionExecutiveField"
label="ด้านทางการบริหาร"
lazy-rules
hide-bottom-space
/>
</div>
<div class="col-6">
<q-input
ref="positionAreaRef"
v-model="formPositionSelect.positionArea"
:class="inputEdit(isReadonly)"
dense
outlined
for="#positionArea"
label="ด้าน/สาขา"
lazy-rules
hide-bottom-space
/>
</div>
<div class="col-6 self-center">
<q-checkbox size="md" v-model="isSpecial" label="ฉ" />
</div>
</div> </div>
<q-separator /> <q-separator />
<q-card-actions align="right" class="bg-white text-teal q-pa-sm"> <q-card-actions align="right" class="bg-white text-teal q-pa-sm">
<q-btn <q-btn

View file

@ -1,11 +1,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, reactive, watch } from "vue"; import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar"; import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin"; import http from "@/plugins/http";
import type { QTableProps } from "quasar"; import config from "@/app.config";
import DialogHeader from "@/components/DialogHeader.vue";
import DialogAddPosition from "@/modules/16_positionEmployee/components/DialogAddPosition.vue";
import type { QTableProps } from "quasar";
import type { import type {
FormDataPosition, FormDataPosition,
FormPositionRef, FormPositionRef,
@ -22,8 +21,10 @@ import type {
DataPosition, DataPosition,
} from "@/modules/16_positionEmployee/interface/response/organizational"; } from "@/modules/16_positionEmployee/interface/response/organizational";
import type { FilterMaster } from "@/modules/16_positionEmployee/interface/request/organizational"; import type { FilterMaster } from "@/modules/16_positionEmployee/interface/request/organizational";
import http from "@/plugins/http"; import DialogHeader from "@/components/DialogHeader.vue";
import config from "@/app.config"; import DialogAddPosition from "@/modules/16_positionEmployee/components/DialogAddPosition.vue";
import { useCounterMixin } from "@/stores/mixin";
const props = defineProps({ const props = defineProps({
modal: Boolean, modal: Boolean,
@ -43,7 +44,7 @@ const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
const isReadonly = ref<boolean>(false); // const isReadonly = ref<boolean>(false); //
const isDisValidate = ref<boolean>(false); const isDisValidate = ref<boolean>(false);
const isPosition = ref<boolean>(false); const isPosition = ref<boolean>(false);
const succession = ref<boolean>(false); // id
const dataCopy = ref<any>(); const dataCopy = ref<any>();
const $q = useQuasar(); const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
@ -56,26 +57,15 @@ const {
dialogRemove, dialogRemove,
dialogMessageNotify, dialogMessageNotify,
} = mixin; } = mixin;
const selected = ref<any>([]);
const search = ref<string>(""); const search = ref<string>("");
const type = ref<string>("positionName"); const type = ref<string>("positionName");
const optionFilter = ref<DataOption[]>([ const optionFilter = ref<DataOption[]>([
{ id: "positionName", name: "ตำแหน่งในสายงาน" }, { id: "positionName", name: "ชื่อตำแหน่ง" },
{ id: "positionField", name: "สายงาน" }, { id: "positionType", name: "กลุ่มงาน" },
{ id: "positionType", name: "ประเภทตำแหน่ง" }, { id: "positionLevel", name: "ระดับชั้นงาน" },
{ id: "positionLevel", name: "ระดับตำแหน่ง" },
{ id: "positionExecutive", name: "ตำแหน่งทางการบริหาร" },
{ id: "positionExecutiveField", name: "ด้านทางการบริหาร" },
{ id: "positionArea", name: "ด้าน/สาขา" },
]); ]);
const typeOpsMain = ref<DataOption[]>([]);
const levelOpsMain = ref<DataOption[]>([]);
const executiveOpsMain = ref<DataOption[]>([]);
const executiveOps = ref<DataOption[]>([]);
const typeOps = ref<DataOption[]>([]);
const levelOps = ref<any[]>([]);
const listMenu = ref<ListMenu[]>([ const listMenu = ref<ListMenu[]>([
{ {
label: "คัดลอก", label: "คัดลอก",
@ -99,19 +89,10 @@ const listMenu = ref<ListMenu[]>([
const rows = ref<RowDetailPositions[]>([]); const rows = ref<RowDetailPositions[]>([]);
const rowsPositionSelect = ref<RowDetailPositions[]>([]); const rowsPositionSelect = ref<RowDetailPositions[]>([]);
const ocLevelOp = ref<DataOption[]>([]);
const prefixNoRef = ref<Object | null>(null); const prefixNoRef = ref<Object | null>(null);
const positionNoRef = ref<Object | null>(null); const positionNoRef = ref<Object | null>(null);
const positionNameRef = ref<Object | null>(null);
const positionFieldRef = ref<Object | null>(null);
const positionTypeRef = ref<Object | null>(null);
const positionLevelRef = ref<Object | null>(null);
const positionExecutiveRef = ref<Object | null>(null);
const positionExecutiveFieldRef = ref<Object | null>(null);
const positionAreaRef = ref<Object | null>(null);
const formData = reactive<FormDataPosition>({ const formData = reactive<FormDataPosition>({
shortName: props.shortName, shortName: props.shortName,
prefixNo: "", prefixNo: "",
@ -119,32 +100,12 @@ const formData = reactive<FormDataPosition>({
suffixNo: "", suffixNo: "",
}); });
const formPositionSelect = reactive<FormPositionSelect>({
positionId: "",
positionName: "",
positionField: "",
positionType: "",
positionLevel: "",
positionExecutive: "",
positionExecutiveField: "",
positionArea: "",
});
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */ /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
const objectPositionRef: FormPositionRef = { const objectPositionRef: FormPositionRef = {
prefixNo: prefixNoRef, prefixNo: prefixNoRef,
positionNo: positionNoRef, positionNo: positionNoRef,
}; };
const objectPositionSelectRef: FormPositionSelectRef = {
positionName: positionNameRef,
positionField: positionFieldRef,
positionType: positionTypeRef,
positionLevel: positionLevelRef,
positionExecutive: positionExecutiveRef,
positionExecutiveField: positionExecutiveFieldRef,
positionArea: positionAreaRef,
};
const columns = ref<QTableProps["columns"]>([ const columns = ref<QTableProps["columns"]>([
{ {
name: "no", name: "no",
@ -156,27 +117,18 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px", style: "font-size: 14px",
}, },
{ {
name: "positionName", name: "posDictName",
align: "left", align: "left",
label: "ตำแหน่งในสายงาน", label: "ชื่อตำแหน่ง",
sortable: true, sortable: true,
field: "positionName", field: "posDictName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionField",
align: "left",
label: "สายงาน",
sortable: true,
field: "positionField",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
}, },
{ {
name: "posTypeName", name: "posTypeName",
align: "left", align: "left",
label: "ประเภทตำเเหน่ง", label: "กลุ่มงาน",
sortable: true, sortable: true,
field: "posTypeName", field: "posTypeName",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
@ -185,49 +137,18 @@ const columns = ref<QTableProps["columns"]>([
{ {
name: "posLevelName", name: "posLevelName",
align: "left", align: "left",
label: "ระดับตำแหน่ง", label: "ระดับชั้นงาน",
sortable: true, sortable: true,
field: "posLevelName", field: "posLevelName",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
}, },
{
name: "posExecutiveName",
align: "left",
label: "ตำแหน่งทางการบริหาร",
sortable: true,
field: "posExecutiveName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionExecutiveField",
align: "left",
label: "ด้านทางการบริหาร",
sortable: true,
field: "positionExecutiveField",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "positionArea",
align: "left",
label: "ด้าน/สาขา",
sortable: true,
field: "positionArea",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]); ]);
const visibleColumns = ref<string[]>([ const visibleColumns = ref<string[]>([
"no", "no",
"positionName", "posDictName",
"positionField",
"posTypeName", "posTypeName",
"posLevelName", "posLevelName",
"posExecutiveName",
"positionExecutiveField",
"positionArea",
]); ]);
async function fetchPosition(id: string) { async function fetchPosition(id: string) {
@ -249,68 +170,6 @@ async function fetchPosition(id: string) {
}); });
} }
const dataLevel = ref<any>();
/** function เรียกรายการประเภทตำแหน่ง */
async function fetchType() {
showLoader();
await http
.get(config.API.orgPosType)
.then((res) => {
dataLevel.value = res.data.result;
typeOpsMain.value = res.data.result.map((e: OptionType) => ({
id: e.id,
name: e.posTypeName,
}));
typeOps.value = typeOpsMain.value;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
/** function เรียกรายการระดับตำแหน่ง */
// async function fetchLevel() {
// showLoader();
// await http
// .get(config.API.orgPosLevel)
// .then((res) => {
// levelOpsMain.value = res.data.result.map((e: OptionLevel) => ({
// id: e.id,
// name: e.posLevelName,
// }));
// levelOps.value = levelOpsMain.value;
// })
// .catch((err) => {
// messageError($q, err);
// })
// .finally(() => {
// hideLoader();
// });
// }
/** function เรียกรายการตำแหน่งทางการบริหาร */
async function fetchExecutive() {
showLoader();
await http
.get(config.API.orgPosExecutive)
.then((res) => {
executiveOpsMain.value = res.data.result.map((e: OptionExecutive) => ({
id: e.id,
name: e.posExecutiveName,
}));
executiveOps.value = executiveOpsMain.value;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */ /** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
function validateForm() { function validateForm() {
const hasError = []; const hasError = [];
@ -332,36 +191,14 @@ function validateForm() {
} }
} }
/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
// function validateFormPositionEdit() {
// isDisValidate.value = false;
// const hasError = [];
// for (const key in objectPositionSelectRef) {
// if (Object.prototype.hasOwnProperty.call(objectPositionSelectRef, key)) {
// const property = objectPositionSelectRef[key];
// if (property.value && typeof property.value.validate === "function") {
// const isValid = property.value.validate();
// hasError.push(isValid);
// }
// }
// }
// if (hasError.every((result) => result === true)) {
// onSubmitSelectEdit();
// }
// }
/** ฟังชั่น บันทึก */ /** ฟังชั่น บันทึก */
function onSubmit() { function onSubmit() {
dialogConfirm($q, async () => { dialogConfirm($q, async () => {
showLoader();
const positionsData = rows.value.map((e: any) => ({ const positionsData = rows.value.map((e: any) => ({
posDictName: e.positionName, // () posDictName: e.posDictName, // ()
posDictField: e.positionField, //
posTypeId: e.posTypeId, //* posTypeId: e.posTypeId, //*
posLevelId: e.posLevelId, //* posLevelId: e.posLevelId, //*
posExecutiveId: e.posExecutiveId ? e.posExecutiveId : "", //
posDictExecutiveField: e.positionExecutiveField, //
posDictArea: e.positionArea, ///
isSpecial: e.isSpecial,
})); }));
const body = { const body = {
posMasterNoPrefix: formData.prefixNo, //*Prefix Optional (/) posMasterNoPrefix: formData.prefixNo, //*Prefix Optional (/)
@ -375,83 +212,23 @@ function onSubmit() {
positions: positionsData, positions: positionsData,
// succession: succession.value, // succession: succession.value,
}; };
try {
showLoader(); const url =
props.actionType === "ADD" props.actionType === "ADD"
? await http ? config.API.orgPosMasterEmp
.post(config.API.orgPosMaster, body) : config.API.orgPosMasterByIdEmp(props.rowId);
.then(() => { await http[props.actionType === "ADD" ? "post" : "put"](url, body);
success($q, "เพิ่มข้อมูลสำเร็จ"); success($q, "บันทีกข้อมูลสำเร็จ");
props.fetchDataTable?.( props.getSummary?.();
reqMaster.value.id, props.fetchDataTable?.(reqMaster.value.id, reqMaster.value.type, false);
reqMaster.value.type, close();
false } catch (err) {
); messageError($q, err);
props.getSummary?.(); } finally {
close(); hideLoader();
}) }
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
})
: props.rowId &&
(await http
.put(config.API.orgPosMasterById(props.rowId), body)
.then(() => {
success($q, "แก้ไขข้อมูลสำเร็จ");
props.fetchDataTable?.(
reqMaster.value.id,
reqMaster.value.type,
false
);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
close();
hideLoader();
}));
}); });
} }
/** ฟังชั่น บันทึก */
// function onSubmitSelectEdit() {
// dialogConfirm(
// $q,
// async () => {
// showLoader();
// const body = {
// posDictName: formPositionSelect.positionName,
// posDictField: formPositionSelect.positionField, //
// posTypeId: formPositionSelect.positionType, //*
// posLevelId: formPositionSelect.positionLevel, //*
// posExecutiveId:
// formPositionSelect.positionExecutive !== ""
// ? formPositionSelect.positionExecutive
// : null, //
// posDictExecutiveField: formPositionSelect.positionExecutiveField, //
// posDictArea: formPositionSelect.positionArea, ///
// };
// await http
// .post(config.API.orgPosPosition, body)
// .then(() => {
// success($q, "");
// clearFormPositionSelect();
// })
// .catch((err) => {
// messageError($q, err);
// })
// .finally(() => {
// hideLoader();
// });
// },
// "",
// "?"
// );
// }
/** input ค้นหา */ /** input ค้นหา */
const searchRef = ref<any>(null); const searchRef = ref<any>(null);
@ -461,7 +238,7 @@ async function searchInput() {
showLoader(); showLoader();
await http await http
.get( .get(
config.API.orgPosPosition + config.API.orgEmployeePos +
`?keyword=${search.value}&type=${type.value}` `?keyword=${search.value}&type=${type.value}`
) )
.then((res) => { .then((res) => {
@ -476,16 +253,6 @@ async function searchInput() {
} }
} }
// function updateSelectType(val: string) {
// const listLevel = dataLevel.value.find((e: any) => e.id === val);
// levelOpsMain.value = listLevel.posLevels.map((e: OptionLevel) => ({
// id: e.id,
// name: e.posLevelName,
// }));
// levelOps.value = levelOpsMain.value;
// formPositionSelect.positionLevel = "";
// }
/** /**
* ดลอกขอม * ดลอกขอม
* @param data อมลตำแหน * @param data อมลตำแหน
@ -502,7 +269,6 @@ function editDetiail(data: RowDetailPositions) {
isEdit.value = true; isEdit.value = true;
modalAdd.value = true; modalAdd.value = true;
dataCopy.value = data; dataCopy.value = data;
console.log(isEdit.value);
} }
/** /**
@ -515,60 +281,16 @@ function inputEdit(val: boolean) {
"full-width cursor-pointer inputgreen": !val, "full-width cursor-pointer inputgreen": !val,
}; };
} }
function addPosition(data: RowDetailPositions) {
watch( rows.value = [];
() => props.modal, rows.value.push(data);
() => {
if (props.modal === true) {
fetchType();
// fetchLevel();
fetchExecutive();
if (props.actionType === "ADD") {
rowsPositionSelect.value = [];
search.value = "";
rows.value = [];
clearFormPositionSelect();
formData.prefixNo = "";
formData.positionNo = "";
formData.suffixNo = "";
} else {
props.rowId && fetchPosition(props.rowId);
}
}
}
);
async function addPosition(data: RowDetailPositions) {
const isIdExist = await rows.value.some(
(item: any) =>
item.posExecutiveId == data.posExecutiveId &&
item.positionField == data.positionField &&
item.posLevelId == data.posLevelId &&
item.posTypeId == data.posTypeId &&
item.positionArea == data.positionArea &&
item.positionExecutiveField == data.positionExecutiveField &&
item.positionName == data.positionName &&
item.isSpecial == data.isSpecial
);
if (!isIdExist) {
rows.value = [...rows.value, data];
// rows.value.push(data);
}
}
function deleteData(id: string) {
const dataRow = rows.value;
const updatedRows = dataRow.filter((item: any) => item.id !== id);
rows.value = updatedRows;
} }
function deletePos(id: string) { function deletePos(id: string) {
dialogRemove($q, () => { dialogRemove($q, () => {
showLoader(); showLoader();
http http
.delete(config.API.orgPosPositionById(id)) .delete(config.API.orgEmployeePosById(id))
.then(() => { .then(() => {
success($q, "ลบข้อมูลสำเร็จ"); success($q, "ลบข้อมูลสำเร็จ");
}) })
@ -582,19 +304,11 @@ function deletePos(id: string) {
}); });
} }
async function clearFormPositionSelect() { function clearFormPositionSelect() {
isDisValidate.value = await true; isDisValidate.value = true;
formPositionSelect.positionId = "";
formPositionSelect.positionName = "";
formPositionSelect.positionField = "";
formPositionSelect.positionType = "";
formPositionSelect.positionLevel = "";
formPositionSelect.positionExecutive = "";
formPositionSelect.positionExecutiveField = "";
formPositionSelect.positionArea = "";
setTimeout(async () => { setTimeout(() => {
isDisValidate.value = await false; isDisValidate.value = false;
}, 1000); }, 1000);
} }
@ -609,6 +323,25 @@ async function emitSearch(keyword: string, typeSelect: string) {
await searchInput(); await searchInput();
} }
watch(
() => props.modal,
() => {
if (props.modal === true) {
if (props.actionType === "ADD") {
rowsPositionSelect.value = [];
search.value = "";
rows.value = [];
clearFormPositionSelect();
formData.prefixNo = "";
formData.positionNo = "";
formData.suffixNo = "";
} else {
props.rowId && fetchPosition(props.rowId);
}
}
}
);
</script> </script>
<template> <template>
@ -684,7 +417,7 @@ async function emitSearch(keyword: string, typeSelect: string) {
ref="table" ref="table"
:columns="columns" :columns="columns"
:rows="rows" :rows="rows"
row-key="idcard" row-key="id"
flat flat
bordered bordered
:paging="true" :paging="true"
@ -742,18 +475,6 @@ async function emitSearch(keyword: string, typeSelect: string) {
{{ col.value }} {{ col.value }}
</div> </div>
</q-td> </q-td>
<q-td auto-width>
<q-btn
flat
dense
icon="mdi-delete"
class="q-pa-none q-ml-xs"
color="red"
@click="deleteData(props.row.id)"
>
<q-tooltip>ลบขอม</q-tooltip>
</q-btn>
</q-td>
</q-tr> </q-tr>
</template> </template>
</d-table> </d-table>