API คนครอง
This commit is contained in:
parent
21e1249d4c
commit
b853b4e7d6
3 changed files with 167 additions and 136 deletions
|
|
@ -37,6 +37,6 @@ export default {
|
||||||
|
|
||||||
/**ครองตำแหน่ง */
|
/**ครองตำแหน่ง */
|
||||||
orgSearchProfile: `${orgProfile}/search`,
|
orgSearchProfile: `${orgProfile}/search`,
|
||||||
orgProfile: `${orgProfile}`,
|
orgProfile: `${orgPos}/profile`,
|
||||||
orgDeleteProfile: (id: string) => `${orgProfile}/delete/${id}`,
|
orgDeleteProfile: (id: string) => `${orgPos}/profile/delete/${id}`,
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,10 @@ import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
|
import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
import type { Position } from "@/modules/02_organizationalNew/interface/index/organizational";
|
import type { Position } from "@/modules/02_organizationalNew/interface/index/organizational";
|
||||||
import type { DataOption } from "@/modules/02_organizationalNew/interface/index/Main";
|
import type {
|
||||||
|
DataOption,
|
||||||
|
NewPagination,
|
||||||
|
} from "@/modules/02_organizationalNew/interface/index/Main";
|
||||||
import type {
|
import type {
|
||||||
OptionType,
|
OptionType,
|
||||||
OptionExecutive,
|
OptionExecutive,
|
||||||
|
|
@ -41,13 +44,19 @@ const levelOpsMain = ref<DataOption[]>([]);
|
||||||
const typeOps = ref<DataOption[]>([]);
|
const typeOps = ref<DataOption[]>([]);
|
||||||
const levelOps = ref<DataOption[]>([]);
|
const levelOps = ref<DataOption[]>([]);
|
||||||
const dataLevel = ref<any>();
|
const dataLevel = ref<any>();
|
||||||
const selected = ref<string[]>([]);
|
const selected = ref<Position[]>([]);
|
||||||
const isSit = ref<boolean>(false);
|
const isSit = ref<boolean>(false);
|
||||||
const executiveOps = ref<DataOption[]>([]);
|
const executiveOps = ref<DataOption[]>([]);
|
||||||
const store = useOrganizational();
|
const store = useOrganizational();
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const { dialogConfirm, showLoader, success, hideLoader, messageError } =
|
const {
|
||||||
useCounterMixin();
|
dialogConfirm,
|
||||||
|
showLoader,
|
||||||
|
success,
|
||||||
|
hideLoader,
|
||||||
|
messageError,
|
||||||
|
dialogMessageNotify,
|
||||||
|
} = useCounterMixin();
|
||||||
|
|
||||||
const modal = defineModel<boolean>("modal", { required: true });
|
const modal = defineModel<boolean>("modal", { required: true });
|
||||||
// const modal = ref<boolean>(true);
|
// const modal = ref<boolean>(true);
|
||||||
|
|
@ -58,6 +67,10 @@ const props = defineProps({
|
||||||
require: true,
|
require: true,
|
||||||
},
|
},
|
||||||
dataDetailPos: { type: Object, require: true },
|
dataDetailPos: { type: Object, require: true },
|
||||||
|
fetchDataTable: {
|
||||||
|
type: Function,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
const row = ref<Position[]>([]);
|
const row = ref<Position[]>([]);
|
||||||
const rowResult = ref<SeaechResult[]>([]);
|
const rowResult = ref<SeaechResult[]>([]);
|
||||||
|
|
@ -319,20 +332,13 @@ function updateSelectType(val: string) {
|
||||||
|
|
||||||
/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
|
/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
|
||||||
function validateForm() {
|
function validateForm() {
|
||||||
// const hasError = [];
|
if (selected.value.length === 0) {
|
||||||
// for (const key in objectRef) {
|
dialogMessageNotify($q, "กรุณาเลือกรายการตำแหน่ง");
|
||||||
// if (Object.prototype.hasOwnProperty.call(objectRef, key)) {
|
} else if (selectedProfile.value.length === 0) {
|
||||||
// const property = objectRef[key];
|
dialogMessageNotify($q, "กรุณาเลือกคนครอง");
|
||||||
// if (property.value && typeof property.value.validate === "function") {
|
} else {
|
||||||
// const isValid = property.value.validate();
|
onSubmit();
|
||||||
// hasError.push(isValid);
|
}
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// if (hasError.every((result) => result === true)) {
|
|
||||||
onSubmit();
|
|
||||||
// } else {
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** ฟังชั่น บันทึก */
|
/** ฟังชั่น บันทึก */
|
||||||
|
|
@ -340,26 +346,32 @@ function onSubmit() {
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
$q,
|
$q,
|
||||||
() => {
|
() => {
|
||||||
console.log("ตำแหน่ง==>", selected.value);
|
// console.log("ตำแหน่ง==>", selected.value[0]?.id);
|
||||||
console.log("ทับที่==>", isSit);
|
// console.log("ตำแหน่ง==>", selectedProfile.value[0]?.id);
|
||||||
// showLoader();
|
// console.log("ทับที่==>", isSit.value);
|
||||||
// http
|
// console.log(props.dataDetailPos);
|
||||||
// .post(config.API.createOrganization, formData)
|
|
||||||
// .then((res) => {
|
const body = {
|
||||||
// status.value = true;
|
posMaster: props.dataDetailPos?.id, //*id อัตรากำลัง
|
||||||
// store.typeOrganizational = "draft";
|
position: selected.value[0]?.id, //*id ตำแหน่ง
|
||||||
// store.draftId = res.data.result.id;
|
profileId: selectedProfile.value[0]?.id, //*id profile
|
||||||
// success($q, "บันทึกข้อมูลสำเร็จ");
|
isSit: isSit.value, //*นั่งทับที่ไหม
|
||||||
// // props.fetchActive?.();
|
};
|
||||||
// })
|
showLoader();
|
||||||
// .catch((err) => {
|
http
|
||||||
// messageError($q, err);
|
.post(config.API.orgProfile, body)
|
||||||
// })
|
.then(() => {
|
||||||
// .finally(async () => {
|
props.fetchDataTable?.(store.treeId, store.level, false);
|
||||||
// modal.value = await false;
|
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||||
// await close();
|
})
|
||||||
// await hideLoader();
|
.catch((err) => {
|
||||||
// });
|
messageError($q, err);
|
||||||
|
})
|
||||||
|
.finally(async () => {
|
||||||
|
modal.value = await false;
|
||||||
|
close();
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
"ยืนยันการเลือกคนครอง",
|
"ยืนยันการเลือกคนครอง",
|
||||||
"ต้องการยืนยันการเลือกคนครองตำแหน่งนี้ใช่หรือไม่?"
|
"ต้องการยืนยันการเลือกคนครองตำแหน่งนี้ใช่หรือไม่?"
|
||||||
|
|
@ -368,7 +380,9 @@ function onSubmit() {
|
||||||
|
|
||||||
/** เมื่อ enter ให้ทำการ ค้นหาข้อมูล */
|
/** เมื่อ enter ให้ทำการ ค้นหาข้อมูล */
|
||||||
const page = ref<number>(1);
|
const page = ref<number>(1);
|
||||||
const pageSize = ref<number>(20);
|
const pageSize = ref<number>(10);
|
||||||
|
const totalPage = ref<number>(0);
|
||||||
|
const selectedProfile = ref<SeaechResult[]>([]);
|
||||||
async function searchData() {
|
async function searchData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
console.log(formData);
|
console.log(formData);
|
||||||
|
|
@ -384,6 +398,7 @@ async function searchData() {
|
||||||
.post(config.API.orgSearchProfile, reqBody)
|
.post(config.API.orgSearchProfile, reqBody)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
console.log(res);
|
console.log(res);
|
||||||
|
totalPage.value = Math.ceil(res.data.result.total / pageSize.value);
|
||||||
const list = res.data.result.data.map((e: any) => ({
|
const list = res.data.result.data.map((e: any) => ({
|
||||||
id: e.id,
|
id: e.id,
|
||||||
citizenId: e.citizenId,
|
citizenId: e.citizenId,
|
||||||
|
|
@ -402,25 +417,6 @@ async function searchData() {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
|
|
||||||
// const data = [
|
|
||||||
// {
|
|
||||||
// id: "test1",
|
|
||||||
// citizenId: "test1",
|
|
||||||
// name: "test1",
|
|
||||||
// posTypeName: "test1",
|
|
||||||
// positionName: "test1",
|
|
||||||
// posLevelName: "test1",
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// id: "test2",
|
|
||||||
// citizenId: "test2",
|
|
||||||
// name: "test2",
|
|
||||||
// posTypeName: "test2",
|
|
||||||
// positionName: "test2",
|
|
||||||
// posLevelName: "test2",
|
|
||||||
// },
|
|
||||||
// ];
|
|
||||||
|
|
||||||
// rowResult.value = data;
|
// rowResult.value = data;
|
||||||
// props.fetchListDisciplinary?.();
|
// props.fetchListDisciplinary?.();
|
||||||
}
|
}
|
||||||
|
|
@ -429,6 +425,15 @@ function clearPosition() {
|
||||||
formData.positionType = "";
|
formData.positionType = "";
|
||||||
formData.positionLevel = "";
|
formData.positionLevel = "";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
watch([() => page.value, () => pageSize.value], () => {
|
||||||
|
searchData();
|
||||||
|
});
|
||||||
|
|
||||||
|
function updatePagination(newPagination: NewPagination) {
|
||||||
|
pageSize.value = newPagination.rowsPerPage;
|
||||||
|
page.value = 1;
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -461,70 +466,66 @@ function clearPosition() {
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12"><q-separator /></div>
|
<div class="col-12"><q-separator /></div>
|
||||||
|
|
||||||
<div class="row q-col-gutter-sm q-pa-sm">
|
<div class="q-pa-sm col-12">
|
||||||
<div class="col-12">
|
<d-table
|
||||||
<d-table
|
flat
|
||||||
flat
|
:columns="columns"
|
||||||
:columns="columns"
|
:rows="row"
|
||||||
:rows="row"
|
row-key="id"
|
||||||
row-key="id"
|
dense
|
||||||
dense
|
hide-pagination
|
||||||
hide-pagination
|
class="custom-header-table"
|
||||||
class="custom-header-table"
|
selection="single"
|
||||||
selection="single"
|
v-model:selected="selected"
|
||||||
v-model:selected="selected"
|
>
|
||||||
>
|
<template v-slot:header-selection="scope">
|
||||||
<template v-slot:header-selection="scope">
|
<q-checkbox
|
||||||
<q-checkbox
|
keep-color
|
||||||
keep-color
|
color="primary"
|
||||||
color="primary"
|
dense
|
||||||
dense
|
v-model="scope.checkBox"
|
||||||
v-model="scope.checkBox"
|
/>
|
||||||
/>
|
</template>
|
||||||
</template>
|
<template v-slot:header="props">
|
||||||
<template v-slot:header="props">
|
<q-tr :props="props">
|
||||||
<q-tr :props="props">
|
<q-th class="text-center"> </q-th>
|
||||||
<q-th class="text-center"> </q-th>
|
|
||||||
|
|
||||||
<q-th
|
<q-th
|
||||||
v-for="col in props.cols"
|
v-for="col in props.cols"
|
||||||
:key="col.name"
|
:key="col.name"
|
||||||
:props="props"
|
:props="props"
|
||||||
>
|
>
|
||||||
<span class="text-weight-medium">{{
|
<span class="text-weight-medium">{{ col.label }}</span>
|
||||||
col.label
|
</q-th>
|
||||||
}}</span>
|
</q-tr>
|
||||||
</q-th>
|
</template>
|
||||||
</q-tr>
|
<template v-slot:body="props">
|
||||||
</template>
|
<q-tr :props="props" class="cursor-pointer">
|
||||||
<template v-slot:body="props">
|
<q-td class="text-center">
|
||||||
<q-tr :props="props" class="cursor-pointer">
|
<q-checkbox
|
||||||
<td class="text-center">
|
keep-color
|
||||||
<q-checkbox
|
color="primary"
|
||||||
keep-color
|
dense
|
||||||
color="primary"
|
v-model="props.selected"
|
||||||
dense
|
/>
|
||||||
v-model="props.selected"
|
</q-td>
|
||||||
/>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<q-td
|
<q-td
|
||||||
v-for="col in props.cols"
|
v-for="col in props.cols"
|
||||||
:key="col.name"
|
:key="col.name"
|
||||||
:props="props"
|
:props="props"
|
||||||
>
|
>
|
||||||
<div v-if="col.name == 'no'">
|
<div v-if="col.name == 'no'">
|
||||||
{{ props.rowIndex + 1 }}
|
{{ props.rowIndex + 1 }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else>
|
<div v-else>
|
||||||
{{ col.value }}
|
{{ col.value }}
|
||||||
</div>
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
</d-table>
|
</d-table>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</q-card>
|
||||||
|
|
||||||
|
|
@ -653,16 +654,22 @@ function clearPosition() {
|
||||||
/>
|
/>
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<d-table
|
<d-table
|
||||||
|
ref="table"
|
||||||
flat
|
flat
|
||||||
:columns="columnsResult"
|
:columns="columnsResult"
|
||||||
:rows="rowResult"
|
:rows="rowResult"
|
||||||
row-key="id"
|
row-key="id"
|
||||||
dense
|
dense
|
||||||
hide-pagination
|
|
||||||
class="custom-header-table"
|
class="custom-header-table"
|
||||||
|
:paging="true"
|
||||||
|
:rows-per-page-options="[10, 25, 50, 100]"
|
||||||
|
@update:pagination="updatePagination"
|
||||||
|
selection="single"
|
||||||
|
v-model:selected="selectedProfile"
|
||||||
>
|
>
|
||||||
<template v-slot:header="props">
|
<template v-slot:header="props">
|
||||||
<q-tr :props="props">
|
<q-tr :props="props">
|
||||||
|
<q-th auto-width />
|
||||||
<q-th
|
<q-th
|
||||||
v-for="col in props.cols"
|
v-for="col in props.cols"
|
||||||
:key="col.name"
|
:key="col.name"
|
||||||
|
|
@ -676,6 +683,14 @@ function clearPosition() {
|
||||||
</template>
|
</template>
|
||||||
<template v-slot:body="props">
|
<template v-slot:body="props">
|
||||||
<q-tr :props="props" class="cursor-pointer">
|
<q-tr :props="props" class="cursor-pointer">
|
||||||
|
<q-td>
|
||||||
|
<q-checkbox
|
||||||
|
keep-color
|
||||||
|
color="primary"
|
||||||
|
dense
|
||||||
|
v-model="props.selected"
|
||||||
|
/>
|
||||||
|
</q-td>
|
||||||
<q-td
|
<q-td
|
||||||
v-for="col in props.cols"
|
v-for="col in props.cols"
|
||||||
:key="col.name"
|
:key="col.name"
|
||||||
|
|
@ -691,6 +706,17 @@ function clearPosition() {
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
|
<template v-slot:pagination="scope">
|
||||||
|
<q-pagination
|
||||||
|
v-model="page"
|
||||||
|
active-color="primary"
|
||||||
|
color="dark"
|
||||||
|
:max="totalPage"
|
||||||
|
size="sm"
|
||||||
|
boundary-links
|
||||||
|
direction-links
|
||||||
|
></q-pagination>
|
||||||
|
</template>
|
||||||
</d-table>
|
</d-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -322,23 +322,27 @@ function openSelectPerson(data: DataPosition[]) {
|
||||||
}
|
}
|
||||||
|
|
||||||
/** ลบคนครอง */
|
/** ลบคนครอง */
|
||||||
function removePerson(data: DataPosition[]) {
|
function removePerson(id: string) {
|
||||||
dialogRemove(
|
dialogRemove(
|
||||||
$q,
|
$q,
|
||||||
async () => {
|
async () => {
|
||||||
showLoader();
|
showLoader();
|
||||||
// await http
|
await http
|
||||||
// .delete(config.API.orgPosMasterById(id))
|
.post(config.API.orgDeleteProfile(id))
|
||||||
// .then(() => {
|
.then(() => {
|
||||||
// success($q, "ลบข้อมูลสำเร็จ");
|
success($q, "ลบข้อมูลสำเร็จ");
|
||||||
// props.fetchDataTable?.(reqMaster.value.id, reqMaster.value.type, false);
|
props.fetchDataTable?.(
|
||||||
// })
|
reqMaster.value.id,
|
||||||
// .catch((err) => {
|
reqMaster.value.type,
|
||||||
// messageError($q, err);
|
false
|
||||||
// })
|
);
|
||||||
// .finally(() => {
|
})
|
||||||
hideLoader();
|
.catch((err) => {
|
||||||
// });
|
messageError($q, err);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
"ยืนยันการลบคนครอง",
|
"ยืนยันการลบคนครอง",
|
||||||
"ต้องการยืนยันการลบคนครองนี้ใช่หรือไม่?"
|
"ต้องการยืนยันการลบคนครองนี้ใช่หรือไม่?"
|
||||||
|
|
@ -520,7 +524,7 @@ function removePerson(data: DataPosition[]) {
|
||||||
"
|
"
|
||||||
clickable
|
clickable
|
||||||
v-close-popup
|
v-close-popup
|
||||||
@click="removePerson(props.row)"
|
@click="removePerson(props.row.id)"
|
||||||
>
|
>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<div class="row items-center">
|
<div class="row items-center">
|
||||||
|
|
@ -678,6 +682,7 @@ function removePerson(data: DataPosition[]) {
|
||||||
<DialogSelectPerson
|
<DialogSelectPerson
|
||||||
v-model:modal="modalSelectPerson"
|
v-model:modal="modalSelectPerson"
|
||||||
:dataDetailPos="dataDetailPos"
|
:dataDetailPos="dataDetailPos"
|
||||||
|
:fetchDataTable="props.fetchDataTable"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue