ปรับ code Popup เลือกหน่วยงานที่รับบรรจุ
This commit is contained in:
parent
036820ca80
commit
4c0dd2af29
2 changed files with 45 additions and 40 deletions
|
|
@ -1,15 +1,18 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, watch } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
|
|
||||||
/** importType*/
|
/** importType*/
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
|
|
||||||
import type { Positions } from "@/modules/05_placement/interface/response/SelectOrg";
|
import type { Positions } from "@/modules/05_placement/interface/response/SelectOrg";
|
||||||
import type { DataPositionNo } from "@/modules/05_placement/interface/index/SelectOrg";
|
import type { DataPositionNo } from "@/modules/05_placement/interface/index/SelectOrg";
|
||||||
|
|
||||||
|
/** importStore*/
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
|
||||||
const { date2Thai, showLoader, hideLoader } = useCounterMixin();
|
/** use*/
|
||||||
|
const { date2Thai } = useCounterMixin();
|
||||||
|
|
||||||
|
/** props*/
|
||||||
const selected = defineModel("selectedPos", { required: true });
|
const selected = defineModel("selectedPos", { required: true });
|
||||||
const positionId = defineModel<string>("positionId", { required: true });
|
const positionId = defineModel<string>("positionId", { required: true });
|
||||||
const seletcId = defineModel<string>("seletcId", { required: true });
|
const seletcId = defineModel<string>("seletcId", { required: true });
|
||||||
|
|
@ -19,22 +22,6 @@ const positionData = defineModel<any>("position", { required: true });
|
||||||
const filters = ref<string>("");
|
const filters = ref<string>("");
|
||||||
const rowsPosition = ref<Positions[]>([]);
|
const rowsPosition = ref<Positions[]>([]);
|
||||||
|
|
||||||
async function onClickSelectPos(id: string) {
|
|
||||||
positionId.value = id;
|
|
||||||
selected.value = [];
|
|
||||||
const position: DataPositionNo = positionData.value.find(
|
|
||||||
(e: DataPositionNo) => e.id === id
|
|
||||||
);
|
|
||||||
if (position) {
|
|
||||||
rowsPosition.value = position.positions;
|
|
||||||
if (seletcId.value) {
|
|
||||||
selected.value = rowsPosition.value.filter(
|
|
||||||
(e) => e.id === seletcId.value
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/** columns*/
|
/** columns*/
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
|
|
@ -187,14 +174,32 @@ const visibleColumns = ref<string[]>([
|
||||||
"positionIsSelected",
|
"positionIsSelected",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* function เลือกเลขที่ตำแหน่ง
|
||||||
|
* @param id เลชที่ตำแหน่ง
|
||||||
|
*/
|
||||||
|
async function onClickSelectPos(id: string) {
|
||||||
|
positionId.value = id;
|
||||||
|
selected.value = [];
|
||||||
|
const position: DataPositionNo = positionData.value.find(
|
||||||
|
(e: DataPositionNo) => e.id === id
|
||||||
|
);
|
||||||
|
|
||||||
|
// หาตำแหน่ง
|
||||||
|
if (position) {
|
||||||
|
rowsPosition.value = position.positions;
|
||||||
|
if (seletcId.value) {
|
||||||
|
selected.value = rowsPosition.value.filter(
|
||||||
|
(e) => e.id === seletcId.value
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
if (positionId.value) {
|
if (positionId.value) {
|
||||||
// showLoader();
|
|
||||||
setTimeout(async () => {
|
setTimeout(async () => {
|
||||||
await onClickSelectPos(positionId.value);
|
await onClickSelectPos(positionId.value);
|
||||||
// setTimeout(() => {
|
|
||||||
// hideLoader();
|
|
||||||
// }, 2000);
|
|
||||||
}, 1000);
|
}, 1000);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
@ -208,8 +213,6 @@ onMounted(async () => {
|
||||||
เลือกเลขที่ตำแหน่ง
|
เลือกเลขที่ตำแหน่ง
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12"><q-separator /></div>
|
<div class="col-12"><q-separator /></div>
|
||||||
|
|
||||||
<!-- TABLE -->
|
|
||||||
<div class="col-12 q-pa-md">
|
<div class="col-12 q-pa-md">
|
||||||
<q-toolbar style="padding: 0px">
|
<q-toolbar style="padding: 0px">
|
||||||
<q-space />
|
<q-space />
|
||||||
|
|
|
||||||
|
|
@ -36,7 +36,6 @@ const {
|
||||||
|
|
||||||
/**props*/
|
/**props*/
|
||||||
const modal = defineModel<boolean>("modal", { required: true });
|
const modal = defineModel<boolean>("modal", { required: true });
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
dataRow: {
|
dataRow: {
|
||||||
type: Object,
|
type: Object,
|
||||||
|
|
@ -57,16 +56,13 @@ const nodes = ref<Array<TreeMain>>([]);
|
||||||
const lazy = ref(nodes);
|
const lazy = ref(nodes);
|
||||||
const expanded = ref<string[]>([]);
|
const expanded = ref<string[]>([]);
|
||||||
|
|
||||||
|
/** Position*/
|
||||||
const positionNo = ref<DataPositionNo[]>();
|
const positionNo = ref<DataPositionNo[]>();
|
||||||
const positionId = ref<string>("");
|
const positionId = ref<string>("");
|
||||||
const seletcId = ref<string>("");
|
const seletcId = ref<string>("");
|
||||||
const selectedPos = ref<any[]>([]);
|
const selectedPos = ref<any[]>([]);
|
||||||
const datePos = ref<Date>(new Date());
|
const datePos = ref<Date>(new Date());
|
||||||
|
|
||||||
function closePopup() {
|
|
||||||
modal.value = !modal.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** function เรียกข้อมูลโครงสร้าง แบบปัจุบันและ แบบร่าง*/
|
/** function เรียกข้อมูลโครงสร้าง แบบปัจุบันและ แบบร่าง*/
|
||||||
async function fetchOrganizationActive() {
|
async function fetchOrganizationActive() {
|
||||||
showLoader();
|
showLoader();
|
||||||
|
|
@ -113,7 +109,6 @@ async function fetchDataTree(id: string) {
|
||||||
* @param data ข่อมูล Tree
|
* @param data ข่อมูล Tree
|
||||||
*/
|
*/
|
||||||
function updateSelected(data: TreeMain) {
|
function updateSelected(data: TreeMain) {
|
||||||
// console.log(props?.dataRow?.nodeId === data.orgTreeId);
|
|
||||||
if (props?.dataRow?.nodeId === data.orgTreeId) {
|
if (props?.dataRow?.nodeId === data.orgTreeId) {
|
||||||
positionId.value = props?.dataRow?.posmasterId;
|
positionId.value = props?.dataRow?.posmasterId;
|
||||||
seletcId.value = props?.dataRow?.positionId;
|
seletcId.value = props?.dataRow?.positionId;
|
||||||
|
|
@ -150,8 +145,8 @@ async function fetchDataTable(id: string, level: number = 0) {
|
||||||
if (p.length !== 0) {
|
if (p.length !== 0) {
|
||||||
const a = p.find((el: Positions) => el.positionIsSelected === true);
|
const a = p.find((el: Positions) => el.positionIsSelected === true);
|
||||||
const { id, ...rest } = a ? a : p[0];
|
const { id, ...rest } = a ? a : p[0];
|
||||||
const test = { ...e, ...rest };
|
const data = { ...e, ...rest };
|
||||||
dataMain.push(test);
|
dataMain.push(data);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
positionNo.value = store.fetchPosNo(dataMain);
|
positionNo.value = store.fetchPosNo(dataMain);
|
||||||
|
|
@ -166,6 +161,11 @@ async function fetchDataTable(id: string, level: number = 0) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* function fetch ข้อมูล expanded tree
|
||||||
|
* @param level levelTree
|
||||||
|
* @param id treeId
|
||||||
|
*/
|
||||||
async function fetchPosFind(level: number, id: string) {
|
async function fetchPosFind(level: number, id: string) {
|
||||||
showLoader();
|
showLoader();
|
||||||
const body = {
|
const body = {
|
||||||
|
|
@ -176,8 +176,6 @@ async function fetchPosFind(level: number, id: string) {
|
||||||
.post(config.API.orgPosFind, body)
|
.post(config.API.orgPosFind, body)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
const data = res.data.result;
|
const data = res.data.result;
|
||||||
console.log(data);
|
|
||||||
|
|
||||||
expanded.value = data;
|
expanded.value = data;
|
||||||
nodeId.value = id;
|
nodeId.value = id;
|
||||||
positionId.value = props?.dataRow?.posmasterId;
|
positionId.value = props?.dataRow?.posmasterId;
|
||||||
|
|
@ -191,6 +189,7 @@ async function fetchPosFind(level: number, id: string) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** function บันทึกข้อมูลตำแหน่ง*/
|
||||||
function onClickSubmit() {
|
function onClickSubmit() {
|
||||||
if (selectedPos.value.length === 0) {
|
if (selectedPos.value.length === 0) {
|
||||||
dialogMessageNotify($q, "กรุณาเลือกตำแหน่ง");
|
dialogMessageNotify($q, "กรุณาเลือกตำแหน่ง");
|
||||||
|
|
@ -223,26 +222,29 @@ function onClickSubmit() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** function closePopup*/
|
||||||
|
function closePopup() {
|
||||||
|
modal.value = !modal.value;
|
||||||
|
clearData();
|
||||||
|
}
|
||||||
|
|
||||||
|
/** function clearData*/
|
||||||
function clearData() {
|
function clearData() {
|
||||||
nodeId.value = "";
|
nodeId.value = "";
|
||||||
expanded.value = [];
|
expanded.value = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** callback function เมื่อมีการเปิด popup*/
|
||||||
watch(
|
watch(
|
||||||
() => modal.value,
|
() => modal.value,
|
||||||
async () => {
|
async () => {
|
||||||
if (modal.value) {
|
if (modal.value) {
|
||||||
showLoader();
|
|
||||||
await fetchOrganizationActive();
|
await fetchOrganizationActive();
|
||||||
console.log(props.dataRow);
|
|
||||||
|
|
||||||
if (props?.dataRow?.node !== null && props?.dataRow?.nodeId !== null) {
|
if (props?.dataRow?.node !== null && props?.dataRow?.nodeId !== null) {
|
||||||
await fetchPosFind(props?.dataRow?.node, props?.dataRow?.nodeId);
|
await fetchPosFind(props?.dataRow?.node, props?.dataRow?.nodeId);
|
||||||
} else {
|
} else {
|
||||||
expanded.value = [];
|
expanded.value = [];
|
||||||
}
|
}
|
||||||
} else {
|
|
||||||
clearData();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue