Refactoring code module 05_placement
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
202fbf27b6
commit
4678ead38e
75 changed files with 3110 additions and 10795 deletions
|
|
@ -1,7 +1,8 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
import { useRoute, useRouter } from "vue-router";
|
import { useRoute, useRouter } from "vue-router";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
|
|
@ -11,7 +12,6 @@ import config from "@/app.config";
|
||||||
* importType
|
* importType
|
||||||
*/
|
*/
|
||||||
import type { QForm } from "quasar";
|
import type { QForm } from "quasar";
|
||||||
import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
|
|
||||||
import type {
|
import type {
|
||||||
appointmentData,
|
appointmentData,
|
||||||
ResponseData,
|
ResponseData,
|
||||||
|
|
@ -37,8 +37,7 @@ const {
|
||||||
dialogConfirm,
|
dialogConfirm,
|
||||||
} = mixin;
|
} = mixin;
|
||||||
|
|
||||||
const modalPersonal = ref<boolean>(false);
|
const dataProfile = ref<DataProfile>(); //ข้อมุลส่วนตัว
|
||||||
const dataProfile = ref<DataProfile>();
|
|
||||||
|
|
||||||
const appointment = ref<appointmentData>({
|
const appointment = ref<appointmentData>({
|
||||||
citizenId: "",
|
citizenId: "",
|
||||||
|
|
@ -49,42 +48,33 @@ const appointment = ref<appointmentData>({
|
||||||
const myForm = ref<QForm | null>(null);
|
const myForm = ref<QForm | null>(null);
|
||||||
const edit = ref<boolean>(false);
|
const edit = ref<boolean>(false);
|
||||||
const profileId = ref<string>("");
|
const profileId = ref<string>("");
|
||||||
const organizationPositionOld = ref<string>("");
|
const educationOld = ref<string>(""); //วุฒิการศึกษา
|
||||||
const positionTypeOld = ref<string>("");
|
const organizationPositionOld = ref<string>(""); //ตำแหน่ง/สังกัดเดิม
|
||||||
const positionLevelOld = ref<string>("");
|
const positionTypeOld = ref<string>(""); //ประเภทตำแหน่ง
|
||||||
const posNo = ref<string>("");
|
const positionLevelOld = ref<string>(""); //ระดับตำแหน่ง
|
||||||
const salary = ref<number>(0);
|
const posNo = ref<string>(""); //เลขที่
|
||||||
const educationOld = ref<string>("");
|
const salary = ref<number>(0); //เงินเดือน
|
||||||
const reason = ref<string>("");
|
const date = ref<Date | null>(null); //ดำรงตำแหน่งในระดับปัจจุบันเมื่อ
|
||||||
const date = ref<Date | null>(null);
|
const reason = ref<string>(""); //หมายเหตุ
|
||||||
const status = ref<string>("");
|
const status = ref<string>("");
|
||||||
const avatar = ref<string>("");
|
const fullName = ref<string>("");
|
||||||
|
|
||||||
const title = ref<ResponseTitle>({
|
|
||||||
fullname: "",
|
|
||||||
organizationPositionOld: "",
|
|
||||||
positionLevelOld: "",
|
|
||||||
positionTypeOld: "",
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* fetch รายละเอียดการปรับระดับชั้นงานลูกจ้าง
|
* fetch รายละเอียดการปรับระดับชั้นงานลูกจ้าง
|
||||||
*/
|
*/
|
||||||
function fecthappointmentByid() {
|
async function fecthappointmentByid() {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
await http
|
||||||
.get(config.API.appointEmployeeByid(paramsId.toString()))
|
.get(config.API.appointEmployeeByid(paramsId.toString()))
|
||||||
.then((res: ResponseData) => {
|
.then((res: ResponseData) => {
|
||||||
dataProfile.value = res.data.result as unknown as DataProfile;
|
dataProfile.value = res.data.result as unknown as DataProfile;
|
||||||
const data = res.data.result;
|
const data = res.data.result;
|
||||||
appointment.value = data;
|
appointment.value = data;
|
||||||
profileId.value = data.profileId;
|
profileId.value = data.profileId;
|
||||||
title.value.fullname = `${data.prefix === null ? "" : data.prefix}${
|
fullName.value = `${data.prefix === null ? "" : data.prefix}${
|
||||||
data.firstName ?? "-"
|
data.firstName ?? "-"
|
||||||
} ${data.lastName ?? "-"}`;
|
} ${data.lastName ?? "-"}`;
|
||||||
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
|
|
||||||
title.value.positionLevelOld = data.positionLevelOld ?? "-";
|
|
||||||
title.value.positionTypeOld = data.positionTypeOld ?? "-";
|
|
||||||
(status.value = data.status),
|
(status.value = data.status),
|
||||||
(educationOld.value = data.educationOld ?? "-");
|
(educationOld.value = data.educationOld ?? "-");
|
||||||
organizationPositionOld.value = data.organizationPositionOld;
|
organizationPositionOld.value = data.organizationPositionOld;
|
||||||
|
|
@ -94,7 +84,6 @@ function fecthappointmentByid() {
|
||||||
salary.value = data.salary ?? 0;
|
salary.value = data.salary ?? 0;
|
||||||
reason.value = data.reason;
|
reason.value = data.reason;
|
||||||
date.value = data.positionDate;
|
date.value = data.positionDate;
|
||||||
avatar.value = data.avatar ?? "";
|
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
|
|
@ -186,7 +175,7 @@ onMounted(() => {
|
||||||
class="q-mr-sm"
|
class="q-mr-sm"
|
||||||
@click="router.push(`/placement/appoint-employee`)"
|
@click="router.push(`/placement/appoint-employee`)"
|
||||||
/>
|
/>
|
||||||
รายละเอียดการปรับระดับชั้นงานลูกจ้าง{{ title.fullname }}
|
รายละเอียดการปรับระดับชั้นงานลูกจ้าง{{ fullName }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<CardProfile :data="dataProfile as DataProfile" :type="'employee'" />
|
<CardProfile :data="dataProfile as DataProfile" :type="'employee'" />
|
||||||
|
|
@ -1,34 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const props = defineProps({
|
|
||||||
title: String,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const close = async () => {
|
|
||||||
props.close();
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-toolbar class="q-py-md">
|
|
||||||
<q-toolbar-title class="header-text">{{ title }}</q-toolbar-title>
|
|
||||||
<q-btn
|
|
||||||
icon="close"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
@click="close"
|
|
||||||
style="color: #ff8080; background-color: #ffdede"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.header-text {
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 26px;
|
|
||||||
color: #35373c;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,19 +1,16 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watchEffect } from "vue";
|
import { ref, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
import type { UserData } from "@/modules/05_placement/interface/response/AppointMent";
|
import type { UserData } from "@/modules/05_placement/interface/response/AppointMent";
|
||||||
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
const $q = useQuasar();
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
const storeFn = useTransferDataStore();
|
|
||||||
const { statusText } = storeFn;
|
|
||||||
|
|
||||||
const mixin = useCounterMixin();
|
const mixin = useCounterMixin();
|
||||||
const {
|
const {
|
||||||
showLoader,
|
showLoader,
|
||||||
|
|
@ -24,24 +21,23 @@ const {
|
||||||
date2Thai,
|
date2Thai,
|
||||||
} = mixin;
|
} = mixin;
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const selected = ref<[]>([]);
|
|
||||||
const checkSelected = computed(() => {
|
|
||||||
if (selected.value.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
Modal: Boolean,
|
Modal: Boolean,
|
||||||
clickClose: Function,
|
clickClose: Function,
|
||||||
fecthlistappointment: Function,
|
fetchData: Function,
|
||||||
nextPage: Function,
|
nextPage: Function,
|
||||||
optionsType: Array,
|
optionsType: Array,
|
||||||
rows2: Array,
|
rows2: Array,
|
||||||
filterKeyword2: String,
|
filterKeyword2: String,
|
||||||
type: String,
|
type: String,
|
||||||
});
|
});
|
||||||
|
const emit = defineEmits([
|
||||||
|
"update:filterKeyword2",
|
||||||
|
"update:type",
|
||||||
|
"update:selected",
|
||||||
|
]);
|
||||||
|
|
||||||
|
const selected = ref<[]>([]); //รายากรที่เลือก
|
||||||
const visibleColumns2 = ref<string[]>([
|
const visibleColumns2 = ref<string[]>([
|
||||||
"no",
|
"no",
|
||||||
"citizenId",
|
"citizenId",
|
||||||
|
|
@ -49,6 +45,11 @@ const visibleColumns2 = ref<string[]>([
|
||||||
"organizationName",
|
"organizationName",
|
||||||
"dateOfBirth",
|
"dateOfBirth",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* อัปเดทคค้นหา
|
||||||
|
* @param value ตำค้นหา
|
||||||
|
*/
|
||||||
const columns2 = ref<QTableProps["columns"]>([
|
const columns2 = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
@ -98,62 +99,62 @@ const columns2 = ref<QTableProps["columns"]>([
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
// const pageNext = (item: object) => {
|
|
||||||
// props.nextPage?.(item);
|
function updateInput(value: any) {
|
||||||
// };
|
|
||||||
const emit = defineEmits([
|
|
||||||
"update:filterKeyword2",
|
|
||||||
"update:type",
|
|
||||||
"update:selected",
|
|
||||||
]);
|
|
||||||
const updateInput = (value: any) => {
|
|
||||||
emit("update:filterKeyword2", value);
|
emit("update:filterKeyword2", value);
|
||||||
};
|
}
|
||||||
|
|
||||||
const updateInputType = (value: string) => {
|
/**
|
||||||
emit("update:type", value);
|
* รีเซ็ตค่าในช่องค้นหา
|
||||||
};
|
*/
|
||||||
//รีเซ็ตค่าในช่องค้นหา
|
function Reset() {
|
||||||
const Reset = () => {
|
|
||||||
emit("update:filterKeyword2", "");
|
emit("update:filterKeyword2", "");
|
||||||
};
|
}
|
||||||
//เปิด modal ยืนยัน
|
|
||||||
const clickAddlist = () => {
|
|
||||||
dialogConfirm($q, () => createdAppoint());
|
|
||||||
};
|
|
||||||
|
|
||||||
//อัพเดต ส่งไปออกคำสั่ง
|
/**
|
||||||
const createdAppoint = async () => {
|
* ฟังก์ชันยืนยันส่งไปออกคำสั่ง
|
||||||
let pId: string[] = [];
|
*/
|
||||||
let Type = props.type as string;
|
function clickAddlist() {
|
||||||
selected.value.forEach((e: UserData) => {
|
dialogConfirm($q, async () => {
|
||||||
pId.push(e.id);
|
let pId: string[] = [];
|
||||||
});
|
let Type = props.type as string;
|
||||||
let data = {
|
selected.value.forEach((e: UserData) => {
|
||||||
id: pId,
|
pId.push(e.id);
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.post(config.API.appointEmployeeOrder(Type), data)
|
|
||||||
.then(async () => {
|
|
||||||
await props.fecthlistappointment?.();
|
|
||||||
await props.clickClose?.();
|
|
||||||
await success($q, "บันทึกสำเร็จ");
|
|
||||||
selected.value = [];
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
});
|
||||||
};
|
let data = {
|
||||||
|
id: pId,
|
||||||
|
};
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.post(config.API.appointEmployeeOrder(Type), data)
|
||||||
|
.then(async () => {
|
||||||
|
await props.fetchData?.();
|
||||||
|
await props.clickClose?.();
|
||||||
|
await success($q, "บันทึกสำเร็จ");
|
||||||
|
selected.value = [];
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
watchEffect(() => {
|
/**
|
||||||
if (props.Modal === true) {
|
* เมื่อ props.modal เป็น true
|
||||||
selected.value = [];
|
*
|
||||||
|
* กำหนดให้ selected เป็นค่าว่าง
|
||||||
|
*/
|
||||||
|
watch(
|
||||||
|
() => props.Modal,
|
||||||
|
() => {
|
||||||
|
if (props.Modal === true) {
|
||||||
|
selected.value = [];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
);
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-dialog v-model="props.Modal">
|
<q-dialog v-model="props.Modal">
|
||||||
|
|
@ -297,7 +298,7 @@ watchEffect(() => {
|
||||||
label="ส่งไปออกคำสั่ง"
|
label="ส่งไปออกคำสั่ง"
|
||||||
@click="clickAddlist"
|
@click="clickAddlist"
|
||||||
color="public"
|
color="public"
|
||||||
:disable="checkSelected"
|
:disable="selected.length === 0"
|
||||||
><q-tooltip>ส่งไปออกคำสั่ง</q-tooltip></q-btn
|
><q-tooltip>ส่งไปออกคำสั่ง</q-tooltip></q-btn
|
||||||
>
|
>
|
||||||
</q-card-actions>
|
</q-card-actions>
|
||||||
|
|
@ -1,700 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useQuasar, QForm } from "quasar";
|
|
||||||
import { onMounted, reactive, ref, watch } from "vue";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
|
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
hideLoader,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
success,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin; //ฟังก์ชันกลางที่เรียกใช้
|
|
||||||
|
|
||||||
const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
|
|
||||||
const noData = ref<string>("ไม่พบข้อมูลผังโครงสร้าง");
|
|
||||||
|
|
||||||
const checkValidate = ref<boolean>(false);
|
|
||||||
const myFormPosition = ref<any>();
|
|
||||||
const selected = ref<string>("");
|
|
||||||
const selectedFile = ref<string>("");
|
|
||||||
const dataRespone = ref<any>();
|
|
||||||
const personal = ref<any>();
|
|
||||||
const expanded = ref<string[]>([]);
|
|
||||||
const treeData = ref<Array<any>>([]);
|
|
||||||
const placementPosition = ref<any>([]);
|
|
||||||
const search = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const id = ref<string>("");
|
|
||||||
|
|
||||||
const editDataStatus = ref<boolean>(false);
|
|
||||||
// Set form field
|
|
||||||
let dataForm = reactive({
|
|
||||||
personalId: "",
|
|
||||||
containDate: new Date(),
|
|
||||||
posNoId: "",
|
|
||||||
positionId: "",
|
|
||||||
positionLevelId: "",
|
|
||||||
positionLineId: "",
|
|
||||||
positionPathSideId: "",
|
|
||||||
positionTypeId: "",
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
// await fetchPublishFile();
|
|
||||||
// await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
});
|
|
||||||
// const fetchPublishFile = async () => {
|
|
||||||
// await http
|
|
||||||
// .get(config.API.getPublishFileHistory)
|
|
||||||
// .then((res) => {
|
|
||||||
// let data = res.data.result;
|
|
||||||
// selectedFile.value = data[0].fileName;
|
|
||||||
// })
|
|
||||||
// .catch((e) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(async () => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// };
|
|
||||||
// โหลดข้อมูลโครงสร้างจาก json
|
|
||||||
// const loadTreeData = async () => {
|
|
||||||
// expanded.value = [];
|
|
||||||
// await http
|
|
||||||
// .get(`${config.s3ClusterUrl}${selectedFile.value}`)
|
|
||||||
// .then((res: any) => {
|
|
||||||
// treeData.value = res.data;
|
|
||||||
// dataRespone.value = res.data;
|
|
||||||
// // Filter objects with "name" null
|
|
||||||
// const filteredData = res.data.filter(filterByPersonIdNull);
|
|
||||||
// treeData.value = filteredData;
|
|
||||||
// })
|
|
||||||
// .catch((e: any) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(() => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// };
|
|
||||||
function filterByPersonIdNull(obj: any) {
|
|
||||||
if (obj.name === null && obj.isCondition != true) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if (obj.children && obj.children.length > 0) {
|
|
||||||
obj.children = obj.children.filter(filterByPersonIdNull);
|
|
||||||
return obj.children.length > 0;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
// โหลด position
|
|
||||||
const fetchplacementPosition = async () => {
|
|
||||||
await http
|
|
||||||
.get(config.API.apppointmentPositionUse())
|
|
||||||
.then((res: any) => {
|
|
||||||
placementPosition.value = res.data.result;
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const props = defineProps({
|
|
||||||
personalId: String,
|
|
||||||
modal: Boolean,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("close modal"),
|
|
||||||
},
|
|
||||||
personal: Object,
|
|
||||||
});
|
|
||||||
const myFilterMethod = (node: any, filter: string) => {
|
|
||||||
const filt = filter;
|
|
||||||
return (
|
|
||||||
(node.name && node.name.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationName && node.organizationName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
|
|
||||||
(node.positionName && node.positionName.indexOf(filt) > -1) ||
|
|
||||||
(node.governmentCode &&
|
|
||||||
node.governmentCode.toString().indexOf(filt) > -1) ||
|
|
||||||
(node.agency && node.agency.indexOf(filt) > -1) ||
|
|
||||||
(node.government && node.government.indexOf(filt) > -1) ||
|
|
||||||
(node.department && node.department.indexOf(filt) > -1) ||
|
|
||||||
(node.pile && node.pile.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationShortName &&
|
|
||||||
node.organizationShortName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionSideName && node.positionSideName.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePositionSide &&
|
|
||||||
node.executivePositionSide.indexOf(filt) > -1) ||
|
|
||||||
(node.positionLevel && node.positionLevel.indexOf(filt) > -1)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
const validateData = async () => {
|
|
||||||
checkValidate.value = true;
|
|
||||||
await myFormPosition.value.validate().then((result: boolean) => {
|
|
||||||
if (result == false) {
|
|
||||||
checkValidate.value = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const saveAppoint = async () => {
|
|
||||||
myFormPosition.value.validate().then(async (result: boolean) => {
|
|
||||||
if (props.personalId !== undefined) {
|
|
||||||
id.value = props.personalId.toString();
|
|
||||||
}
|
|
||||||
if (result) {
|
|
||||||
const dataAppoint = await {
|
|
||||||
recruitDate: dataForm.containDate,
|
|
||||||
posNoId: dataForm.posNoId,
|
|
||||||
positionId: dataForm.positionId,
|
|
||||||
positionLevelId: dataForm.positionLevelId,
|
|
||||||
positionLineId: dataForm.positionLineId,
|
|
||||||
positionPathSideId: dataForm.positionPathSideId,
|
|
||||||
positionTypeId: dataForm.positionTypeId,
|
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.appointEmployeePosition(id.value), dataAppoint)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await closeAndClear();
|
|
||||||
// await fetchPublishFile();
|
|
||||||
// await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const closeModal = () => {
|
|
||||||
if (editDataStatus.value == true) {
|
|
||||||
dialogConfirm(
|
|
||||||
$q,
|
|
||||||
async () => {
|
|
||||||
editDataStatus.value = false;
|
|
||||||
await closeAndClear();
|
|
||||||
},
|
|
||||||
`ข้อมูลมีการแก้ไข`,
|
|
||||||
`ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?`
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
closeAndClear();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
const closeAndClear = async () => {
|
|
||||||
await props.close();
|
|
||||||
editDataStatus.value = false;
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.personalId = "";
|
|
||||||
dataForm.containDate = new Date();
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
};
|
|
||||||
// ตำแหน่งเลขที่
|
|
||||||
const posNoOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ตำแหน่ง
|
|
||||||
const positionOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ด้าน/สาขา
|
|
||||||
const positionPathSideOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ประเภทตำแหน่ง
|
|
||||||
const positionTypeOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// สายงาน
|
|
||||||
const positionLineOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ระดับ
|
|
||||||
const positionLevelOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
const selectedPosition = async (data: any) => {
|
|
||||||
if (data.name == null && selected.value != data.keyId) {
|
|
||||||
editDataStatus.value = true;
|
|
||||||
selected.value = data.keyId;
|
|
||||||
|
|
||||||
// posNo Options
|
|
||||||
posNoOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionNum,
|
|
||||||
value: data.positionNumId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.posNoId = data.positionNumId;
|
|
||||||
|
|
||||||
// position Options
|
|
||||||
positionOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionName,
|
|
||||||
value: data.positionNameId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionId = data.positionNameId;
|
|
||||||
|
|
||||||
// positionPathSide Options
|
|
||||||
let positionPathSideArr: any = [];
|
|
||||||
if (data.positionSideNameObj && data.positionSideNameObj != null) {
|
|
||||||
data.positionSideNameObj.map((x: any) => {
|
|
||||||
positionPathSideArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionPathSideOptions.value = positionPathSideArr;
|
|
||||||
dataForm.positionPathSideId =
|
|
||||||
positionPathSideArr.length > 1 || positionPathSideArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionPathSideArr[0].value;
|
|
||||||
}
|
|
||||||
|
|
||||||
// positionType Options
|
|
||||||
positionTypeOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionType,
|
|
||||||
value: data.positionTypeId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionTypeId = data.positionTypeId;
|
|
||||||
|
|
||||||
// positionLine Options
|
|
||||||
positionLineOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionLine,
|
|
||||||
value: data.positionLineId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionLineId = data.positionLineId;
|
|
||||||
|
|
||||||
// positionLevel Options
|
|
||||||
let positionLevelsArr: any = [];
|
|
||||||
if (data.positionLevelObj != null) {
|
|
||||||
data.positionLevelObj.map((x: any) => {
|
|
||||||
positionLevelsArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionLevelOptions.value = positionLevelsArr;
|
|
||||||
dataForm.positionLevelId =
|
|
||||||
positionLevelsArr.length > 1 || positionLevelsArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionLevelsArr[0].value;
|
|
||||||
dataForm.positionLevelId = data.positionLevelObj[0].Id;
|
|
||||||
}
|
|
||||||
} else if (selected.value == data.keyId) {
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const checkPosition = (val: string) => {
|
|
||||||
const num = placementPosition.value.findIndex((e: string) => e === val);
|
|
||||||
return num;
|
|
||||||
};
|
|
||||||
|
|
||||||
watch(props, () => {
|
|
||||||
expanded.value = [];
|
|
||||||
const dataPersonal = props.personal;
|
|
||||||
|
|
||||||
if (dataPersonal) {
|
|
||||||
dataPersonal.map((data: any) => {
|
|
||||||
personal.value = data;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (personal.value) {
|
|
||||||
let findData: any = null;
|
|
||||||
dataRespone.value.map((x: any) => {
|
|
||||||
findData = findByPerson(x);
|
|
||||||
if (findData != null) {
|
|
||||||
selectedPosition(findData);
|
|
||||||
for (let i = 3; i <= findData.keyId.length; i += 2) {
|
|
||||||
expanded.value.push(findData.keyId.slice(0, i));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function findByPerson(element: any): any {
|
|
||||||
if (
|
|
||||||
element.positionNumId &&
|
|
||||||
element.positionLineId === personal.value.positionLineId &&
|
|
||||||
element.positionTypeId === personal.value.positionTypeId &&
|
|
||||||
element.positionNumId === personal.value.posNoId &&
|
|
||||||
(element.positionLevelObj === null ||
|
|
||||||
element.positionLevelObj[0].Id === personal.value.positionLevelId)
|
|
||||||
) {
|
|
||||||
return element;
|
|
||||||
} else if (element.children) {
|
|
||||||
var i;
|
|
||||||
var result = null;
|
|
||||||
for (i = 0; result == null && i < element.children.length; i++) {
|
|
||||||
result = findByPerson(element.children[i]);
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-dialog v-model="props.modal" persistent>
|
|
||||||
<q-card style="width: 900px; max-width: 80vw">
|
|
||||||
<q-form ref="myFormPosition">
|
|
||||||
<DialogHeader :tittle="'เลือกหน่วยงาน'" :close="closeModal" />
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section class="q-pa-sm bg-grey-1">
|
|
||||||
<div class="row col-12 q-col-gutter-sm">
|
|
||||||
<div class="col-xs-12 col-sm-7 row">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
ref="filterRef"
|
|
||||||
v-model="search"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
class="q-mb-sm"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon name="mdi-magnify" />
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
<div class="q-pa-sm q-gutter-sm">
|
|
||||||
<q-tree
|
|
||||||
no-transition
|
|
||||||
dense
|
|
||||||
:nodes="treeData"
|
|
||||||
node-key="keyId"
|
|
||||||
:filter="search"
|
|
||||||
:no-results-label="notFound"
|
|
||||||
:no-nodes-label="noData"
|
|
||||||
:filter-method="myFilterMethod"
|
|
||||||
v-model:expanded="expanded"
|
|
||||||
>
|
|
||||||
<template v-slot:header-organization="prop">
|
|
||||||
<div class="col">
|
|
||||||
<div
|
|
||||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
|
||||||
>
|
|
||||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{ prop.node.organizationName }}
|
|
||||||
</div>
|
|
||||||
<q-badge
|
|
||||||
v-if="prop.node.totalPositionVacant > 0"
|
|
||||||
rounded
|
|
||||||
color="red"
|
|
||||||
outline
|
|
||||||
:label="prop.node.totalPositionVacant"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</div>
|
|
||||||
<div class="col items-center q-px-xs q-pt-xs">
|
|
||||||
<div class="text-weight-medium text-grey-7">
|
|
||||||
{{ prop.node.governmentCode }}
|
|
||||||
{{ prop.node.organizationShortName }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-slot:header-person="prop">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
:active="selected == prop.node.keyId"
|
|
||||||
@click="selectedPosition(prop.node)"
|
|
||||||
:disable="
|
|
||||||
prop.node.name != null ||
|
|
||||||
checkPosition(prop.node.positionNumId) != -1
|
|
||||||
"
|
|
||||||
active-class="my-list-link text-primary text-weight-medium"
|
|
||||||
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
v-if="
|
|
||||||
prop.node.avatar == '' ||
|
|
||||||
prop.node.avatar ==
|
|
||||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
|
||||||
"
|
|
||||||
src="@/assets/avatar_user.jpg"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<img
|
|
||||||
v-else
|
|
||||||
:src="prop.node.avatar"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
|
||||||
<div
|
|
||||||
v-if="prop.node.name == null"
|
|
||||||
class="q-px-sm text-weight-medium text-red"
|
|
||||||
>
|
|
||||||
ว่าง
|
|
||||||
</div>
|
|
||||||
<!--=====หัวหน้า สีเขียว=====-->
|
|
||||||
<div v-else-if="prop.node.positionLeaderFlag">
|
|
||||||
<div
|
|
||||||
class="q-px-sm text-weight-medium text-primary"
|
|
||||||
>
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--=====ลูกน้อง สีปกติ=====-->
|
|
||||||
<div v-else>
|
|
||||||
<div class="q-px-sm text-weight-medium">
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionName }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionNum }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionLevel }}
|
|
||||||
</div>
|
|
||||||
<q-icon
|
|
||||||
v-if="prop.node.positionLeaderFlag"
|
|
||||||
class="q-mr-sm"
|
|
||||||
size="15px"
|
|
||||||
color="primary"
|
|
||||||
name="mdi-bookmark"
|
|
||||||
></q-icon>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</q-item>
|
|
||||||
</template>
|
|
||||||
</q-tree>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-5">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<div class="row col-12 q-col-gutter-xs">
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12"></div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="dataForm.containDate"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
:model-value="
|
|
||||||
date2Thai(new Date(dataForm.containDate))
|
|
||||||
"
|
|
||||||
:rules="[(val: string) => !!val || `${'วันที่รายงานตัว'}`]"
|
|
||||||
:label="`${'วันที่รายงานตัว'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
style="color: var(--q-primary)"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
outlined
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="posNoOptions"
|
|
||||||
v-model="dataForm.posNoId"
|
|
||||||
:label="`${'ตำแหน่งเลขที่'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionOptions"
|
|
||||||
v-model="dataForm.positionId"
|
|
||||||
:label="`${'ตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
emit-value
|
|
||||||
:options="positionPathSideOptions"
|
|
||||||
v-model="dataForm.positionPathSideId"
|
|
||||||
:label="`${'ด้าน/สาขา'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionTypeOptions"
|
|
||||||
v-model="dataForm.positionTypeId"
|
|
||||||
:label="`${'ประเภทตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLineOptions"
|
|
||||||
v-model="dataForm.positionLineId"
|
|
||||||
:label="`${'สายงาน'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLevelOptions"
|
|
||||||
v-model="dataForm.positionLevelId"
|
|
||||||
:label="`${'ระดับ'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับ'}`]"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
|
||||||
|
|
||||||
<q-separator />
|
|
||||||
<DialogFooter
|
|
||||||
:editvisible="true"
|
|
||||||
:validate="validateData"
|
|
||||||
:save="saveAppoint"
|
|
||||||
v-model:modalEdit="editDataStatus"
|
|
||||||
/>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
|
||||||
</q-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.q-tree__node-header {
|
|
||||||
padding: 0px;
|
|
||||||
margin-top: 0px;
|
|
||||||
border-radius: 4px;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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>
|
|
||||||
|
|
@ -1,8 +1,10 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
import { useRoute, useRouter } from "vue-router";
|
||||||
|
|
||||||
|
import { useQuasar } from "quasar";
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
|
@ -10,7 +12,6 @@ import config from "@/app.config";
|
||||||
* importType
|
* importType
|
||||||
*/
|
*/
|
||||||
import type { QForm } from "quasar";
|
import type { QForm } from "quasar";
|
||||||
import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
|
|
||||||
import type { DataProfile } from "@/modules/05_placement/interface/response/AppointMent";
|
import type { DataProfile } from "@/modules/05_placement/interface/response/AppointMent";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -18,11 +19,6 @@ import type { DataProfile } from "@/modules/05_placement/interface/response/Appo
|
||||||
*/
|
*/
|
||||||
import CardProfile from "@/components/CardProfile.vue"; // card ข้อมูลส่วนตัว
|
import CardProfile from "@/components/CardProfile.vue"; // card ข้อมูลส่วนตัว
|
||||||
|
|
||||||
/**
|
|
||||||
* importStore
|
|
||||||
*/
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
@ -34,49 +30,39 @@ const {
|
||||||
success,
|
success,
|
||||||
dialogConfirm,
|
dialogConfirm,
|
||||||
} = useCounterMixin();
|
} = useCounterMixin();
|
||||||
const paramsId = route.params.id;
|
|
||||||
|
|
||||||
const dataProfile = ref<DataProfile>();
|
const paramsId = route.params.id; //id รายการที่เลือก
|
||||||
|
const dataProfile = ref<DataProfile>(); //ข้อมูลส่วนตัว
|
||||||
|
const edit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
|
|
||||||
const myForm = ref<QForm | null>(null);
|
const myForm = ref<QForm | null>(null);
|
||||||
const edit = ref<boolean>(false);
|
|
||||||
const profileId = ref<string>("");
|
const profileId = ref<string>("");
|
||||||
const organizationPositionOld = ref<string>("");
|
const educationOld = ref<string>(""); //วุฒิการศึกษา
|
||||||
const positionTypeOld = ref<string>("");
|
const organizationPositionOld = ref<string>(""); //'ตำแหน่ง/สังกัด
|
||||||
const positionLevelOld = ref<string>("");
|
const positionTypeOld = ref<string>(""); //ตำแหน่งประเภท
|
||||||
const posNo = ref<string>("");
|
const positionLevelOld = ref<string>(""); //ระดับตำแหน่ง
|
||||||
const salary = ref<number>(0);
|
const posNo = ref<string>(""); //เลขที่
|
||||||
const educationOld = ref<string>("");
|
const salary = ref<number>(0); //เงินเดือน
|
||||||
const reason = ref<string>("");
|
const date = ref<Date | null>(null); //ดำรงตำแหน่งในระดับปัจจุบันเมื่อ
|
||||||
const date = ref<Date | null>(null);
|
const reason = ref<string>(""); //หมายเหตุ
|
||||||
const status = ref<string>("");
|
const status = ref<string>("");
|
||||||
const avatar = ref<string>("");
|
const fullName = ref<string>("");
|
||||||
|
|
||||||
const title = ref<ResponseTitle>({
|
|
||||||
fullname: "",
|
|
||||||
organizationPositionOld: "",
|
|
||||||
positionLevelOld: "",
|
|
||||||
positionTypeOld: "",
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* fetch รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย
|
* fetch รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย
|
||||||
*/
|
*/
|
||||||
function fecthappointmentByid() {
|
async function fecthappointmentByid() {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
await http
|
||||||
.get(config.API.appointmentByid(paramsId.toString()))
|
.get(config.API.appointmentByid(paramsId.toString()))
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
dataProfile.value = res.data.result as unknown as DataProfile;
|
dataProfile.value = res.data.result as unknown as DataProfile;
|
||||||
const data = res.data.result;
|
const data = res.data.result;
|
||||||
|
|
||||||
profileId.value = data.profileId;
|
profileId.value = data.profileId;
|
||||||
title.value.fullname = `${data.prefix}${data.firstName ?? "-"} ${
|
fullName.value = `${data.prefix}${data.firstName ?? "-"} ${
|
||||||
data.lastName ?? "-"
|
data.lastName ?? "-"
|
||||||
}`;
|
}`;
|
||||||
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
|
|
||||||
title.value.positionLevelOld = data.positionLevelOld ?? "-";
|
|
||||||
title.value.positionTypeOld = data.positionTypeOld ?? "-";
|
|
||||||
(status.value = data.status),
|
(status.value = data.status),
|
||||||
(educationOld.value = data.educationOld ?? "-");
|
(educationOld.value = data.educationOld ?? "-");
|
||||||
organizationPositionOld.value = data.organizationPositionOld;
|
organizationPositionOld.value = data.organizationPositionOld;
|
||||||
|
|
@ -86,7 +72,6 @@ function fecthappointmentByid() {
|
||||||
salary.value = data.salary ?? 0;
|
salary.value = data.salary ?? 0;
|
||||||
reason.value = data.reason;
|
reason.value = data.reason;
|
||||||
date.value = data.positionDate;
|
date.value = data.positionDate;
|
||||||
avatar.value = data.avatar ?? "";
|
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
|
|
@ -156,6 +141,7 @@ onMounted(() => {
|
||||||
fecthappointmentByid();
|
fecthappointmentByid();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="toptitle text-dark col-12 row items-center">
|
<div class="toptitle text-dark col-12 row items-center">
|
||||||
<q-btn
|
<q-btn
|
||||||
|
|
@ -168,7 +154,7 @@ onMounted(() => {
|
||||||
class="q-mr-sm"
|
class="q-mr-sm"
|
||||||
@click="router.push(`/placement/appoint-promote`)"
|
@click="router.push(`/placement/appoint-promote`)"
|
||||||
/>
|
/>
|
||||||
รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย{{ title.fullname }}
|
รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย{{ fullName }}
|
||||||
</div>
|
</div>
|
||||||
<CardProfile :data="dataProfile as DataProfile" />
|
<CardProfile :data="dataProfile as DataProfile" />
|
||||||
|
|
||||||
|
|
@ -392,7 +378,7 @@ onMounted(() => {
|
||||||
:borderless="!edit"
|
:borderless="!edit"
|
||||||
v-model="reason"
|
v-model="reason"
|
||||||
hide-bottom-space
|
hide-bottom-space
|
||||||
:label="`${'หมายเหตุ '}`"
|
:label="`${'หมายเหตุ'}`"
|
||||||
type="textarea"
|
type="textarea"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -1,715 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useQuasar, QForm } from "quasar";
|
|
||||||
import { onMounted, reactive, ref, watch } from "vue";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
hideLoader,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
success,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin; //ฟังก์ชันกลางที่เรียกใช้
|
|
||||||
|
|
||||||
const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
|
|
||||||
const noData = ref<string>("ไม่พบข้อมูลผังโครงสร้าง");
|
|
||||||
|
|
||||||
const checkValidate = ref<boolean>(false);
|
|
||||||
const myFormPosition = ref<any>();
|
|
||||||
const selected = ref<string>("");
|
|
||||||
const selectedFile = ref<string>("");
|
|
||||||
const dataRespone = ref<any>();
|
|
||||||
const personal = ref<any>();
|
|
||||||
const expanded = ref<string[]>([]);
|
|
||||||
const treeData = ref<Array<any>>([]);
|
|
||||||
const placementPosition = ref<any>([]);
|
|
||||||
const search = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const id = ref<string>("");
|
|
||||||
|
|
||||||
const editDataStatus = ref<boolean>(false);
|
|
||||||
// Set form field
|
|
||||||
let dataForm = reactive({
|
|
||||||
personalId: "",
|
|
||||||
containDate: new Date(),
|
|
||||||
posNoId: "",
|
|
||||||
positionId: "",
|
|
||||||
positionLevelId: "",
|
|
||||||
positionLineId: "",
|
|
||||||
positionPathSideId: "",
|
|
||||||
positionTypeId: "",
|
|
||||||
});
|
|
||||||
|
|
||||||
// const fetchPublishFile = async () => {
|
|
||||||
// await http
|
|
||||||
// .get(config.API.getPublishFileHistory)
|
|
||||||
// .then((res) => {
|
|
||||||
// let data = res.data.result;
|
|
||||||
// selectedFile.value = data[0].fileName;
|
|
||||||
// })
|
|
||||||
// .catch((e) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(async () => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// };
|
|
||||||
|
|
||||||
// โหลดข้อมูลโครงสร้างจาก json
|
|
||||||
// const loadTreeData = async () => {
|
|
||||||
// expanded.value = [];
|
|
||||||
// await http
|
|
||||||
// .get(`${config.s3ClusterUrl}${selectedFile.value}`)
|
|
||||||
// .then((res: any) => {
|
|
||||||
// treeData.value = res.data;
|
|
||||||
// dataRespone.value = res.data;
|
|
||||||
|
|
||||||
// // Filter objects with "name" null
|
|
||||||
// const filteredData = res.data.filter(filterByPersonIdNull);
|
|
||||||
// treeData.value = filteredData;
|
|
||||||
// })
|
|
||||||
// .catch((e: any) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(() => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// };
|
|
||||||
|
|
||||||
function filterByPersonIdNull(obj: any) {
|
|
||||||
if (obj.name === null && obj.isCondition != true) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if (obj.children && obj.children.length > 0) {
|
|
||||||
obj.children = obj.children.filter(filterByPersonIdNull);
|
|
||||||
return obj.children.length > 0;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// โหลด position
|
|
||||||
|
|
||||||
const fetchplacementPosition = async () => {
|
|
||||||
await http
|
|
||||||
.get(config.API.apppointmentPosition())
|
|
||||||
.then((res: any) => {
|
|
||||||
placementPosition.value = res.data.result;
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
personalId: String,
|
|
||||||
modal: Boolean,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("close modal"),
|
|
||||||
},
|
|
||||||
personal: Object,
|
|
||||||
});
|
|
||||||
|
|
||||||
const myFilterMethod = (node: any, filter: string) => {
|
|
||||||
const filt = filter;
|
|
||||||
|
|
||||||
return (
|
|
||||||
(node.name && node.name.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationName && node.organizationName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
|
|
||||||
(node.positionName && node.positionName.indexOf(filt) > -1) ||
|
|
||||||
(node.governmentCode &&
|
|
||||||
node.governmentCode.toString().indexOf(filt) > -1) ||
|
|
||||||
(node.agency && node.agency.indexOf(filt) > -1) ||
|
|
||||||
(node.government && node.government.indexOf(filt) > -1) ||
|
|
||||||
(node.department && node.department.indexOf(filt) > -1) ||
|
|
||||||
(node.pile && node.pile.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationShortName &&
|
|
||||||
node.organizationShortName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionSideName && node.positionSideName.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePositionSide &&
|
|
||||||
node.executivePositionSide.indexOf(filt) > -1) ||
|
|
||||||
(node.positionLevel && node.positionLevel.indexOf(filt) > -1)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const validateData = async () => {
|
|
||||||
checkValidate.value = true;
|
|
||||||
await myFormPosition.value.validate().then((result: boolean) => {
|
|
||||||
if (result == false) {
|
|
||||||
checkValidate.value = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const saveAppoint = async () => {
|
|
||||||
myFormPosition.value.validate().then(async (result: boolean) => {
|
|
||||||
if (props.personalId !== undefined) {
|
|
||||||
id.value = props.personalId.toString();
|
|
||||||
}
|
|
||||||
if (result) {
|
|
||||||
const dataAppoint = await {
|
|
||||||
recruitDate: dataForm.containDate,
|
|
||||||
posNoId: dataForm.posNoId,
|
|
||||||
positionId: dataForm.positionId,
|
|
||||||
positionLevelId: dataForm.positionLevelId,
|
|
||||||
positionLineId: dataForm.positionLineId,
|
|
||||||
positionPathSideId: dataForm.positionPathSideId,
|
|
||||||
positionTypeId: dataForm.positionTypeId,
|
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.appointmentPosition(id.value), dataAppoint)
|
|
||||||
.then((res) => {
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await closeAndClear();
|
|
||||||
// await fetchPublishFile();
|
|
||||||
// await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeModal = () => {
|
|
||||||
if (editDataStatus.value == true) {
|
|
||||||
dialogConfirm(
|
|
||||||
$q,
|
|
||||||
async () => {
|
|
||||||
editDataStatus.value = false;
|
|
||||||
await closeAndClear();
|
|
||||||
},
|
|
||||||
`ข้อมูลมีการแก้ไข`,
|
|
||||||
`ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?`
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
closeAndClear();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeAndClear = async () => {
|
|
||||||
await props.close();
|
|
||||||
editDataStatus.value = false;
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.personalId = "";
|
|
||||||
dataForm.containDate = new Date();
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
};
|
|
||||||
// ตำแหน่งเลขที่
|
|
||||||
const posNoOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ตำแหน่ง
|
|
||||||
const positionOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ด้าน/สาขา
|
|
||||||
const positionPathSideOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ประเภทตำแหน่ง
|
|
||||||
const positionTypeOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// สายงาน
|
|
||||||
const positionLineOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ระดับ
|
|
||||||
const positionLevelOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
const selectedPosition = async (data: any) => {
|
|
||||||
if (data.name == null && selected.value != data.keyId) {
|
|
||||||
editDataStatus.value = true;
|
|
||||||
selected.value = data.keyId;
|
|
||||||
|
|
||||||
// posNo Options
|
|
||||||
posNoOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionNum,
|
|
||||||
value: data.positionNumId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.posNoId = data.positionNumId;
|
|
||||||
|
|
||||||
// position Options
|
|
||||||
positionOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionName,
|
|
||||||
value: data.positionNameId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionId = data.positionNameId;
|
|
||||||
|
|
||||||
// positionPathSide Options
|
|
||||||
let positionPathSideArr: any = [];
|
|
||||||
if (data.positionSideNameObj && data.positionSideNameObj != null) {
|
|
||||||
data.positionSideNameObj.map((x: any) => {
|
|
||||||
positionPathSideArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionPathSideOptions.value = positionPathSideArr;
|
|
||||||
dataForm.positionPathSideId =
|
|
||||||
positionPathSideArr.length > 1 || positionPathSideArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionPathSideArr[0].value;
|
|
||||||
}
|
|
||||||
|
|
||||||
// positionType Options
|
|
||||||
positionTypeOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionType,
|
|
||||||
value: data.positionTypeId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionTypeId = data.positionTypeId;
|
|
||||||
|
|
||||||
// positionLine Options
|
|
||||||
positionLineOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionLine,
|
|
||||||
value: data.positionLineId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionLineId = data.positionLineId;
|
|
||||||
|
|
||||||
// positionLevel Options
|
|
||||||
let positionLevelsArr: any = [];
|
|
||||||
if (data.positionLevelObj != null) {
|
|
||||||
data.positionLevelObj.map((x: any) => {
|
|
||||||
positionLevelsArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionLevelOptions.value = positionLevelsArr;
|
|
||||||
dataForm.positionLevelId =
|
|
||||||
positionLevelsArr.length > 1 || positionLevelsArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionLevelsArr[0].value;
|
|
||||||
dataForm.positionLevelId = data.positionLevelObj[0].Id;
|
|
||||||
}
|
|
||||||
} else if (selected.value == data.keyId) {
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const checkPosition = (val: string) => {
|
|
||||||
const num = placementPosition.value.findIndex((e: string) => e === val);
|
|
||||||
return num;
|
|
||||||
};
|
|
||||||
|
|
||||||
watch(props, () => {
|
|
||||||
expanded.value = [];
|
|
||||||
const dataPersonal = props.personal;
|
|
||||||
|
|
||||||
if (dataPersonal) {
|
|
||||||
dataPersonal.map((data: any) => {
|
|
||||||
personal.value = data;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (personal.value) {
|
|
||||||
let findData: any = null;
|
|
||||||
dataRespone.value.map((x: any) => {
|
|
||||||
findData = findByPerson(x);
|
|
||||||
if (findData != null) {
|
|
||||||
selectedPosition(findData);
|
|
||||||
for (let i = 3; i <= findData.keyId.length; i += 2) {
|
|
||||||
expanded.value.push(findData.keyId.slice(0, i));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function findByPerson(element: any): any {
|
|
||||||
if (
|
|
||||||
element.positionNumId &&
|
|
||||||
element.positionLineId === personal.value.positionLineId &&
|
|
||||||
element.positionTypeId === personal.value.positionTypeId &&
|
|
||||||
element.positionNumId === personal.value.posNoId &&
|
|
||||||
(element.positionLevelObj === null ||
|
|
||||||
element.positionLevelObj[0].Id === personal.value.positionLevelId)
|
|
||||||
) {
|
|
||||||
return element;
|
|
||||||
} else if (element.children) {
|
|
||||||
var i;
|
|
||||||
var result = null;
|
|
||||||
for (i = 0; result == null && i < element.children.length; i++) {
|
|
||||||
result = findByPerson(element.children[i]);
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
// await fetchPublishFile();
|
|
||||||
// await loadTreeData();
|
|
||||||
// await fetchplacementPosition();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-dialog v-model="props.modal" persistent>
|
|
||||||
<q-card style="width: 900px; max-width: 80vw">
|
|
||||||
<q-form ref="myFormPosition">
|
|
||||||
<DialogHeader
|
|
||||||
:tittle="'เลือกหน่วยงานที่แต่งตั้ง - เลื่อน'"
|
|
||||||
:close="closeModal"
|
|
||||||
/>
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section class="q-pa-sm bg-grey-1">
|
|
||||||
<div class="row col-12 q-col-gutter-sm">
|
|
||||||
<div class="col-xs-12 col-sm-7 row">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
ref="filterRef"
|
|
||||||
v-model="search"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
class="q-mb-sm"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon name="mdi-magnify" />
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
<div class="q-pa-sm q-gutter-sm">
|
|
||||||
<q-tree
|
|
||||||
no-transition
|
|
||||||
dense
|
|
||||||
:nodes="treeData"
|
|
||||||
node-key="keyId"
|
|
||||||
:filter="search"
|
|
||||||
:no-results-label="notFound"
|
|
||||||
:no-nodes-label="noData"
|
|
||||||
:filter-method="myFilterMethod"
|
|
||||||
v-model:expanded="expanded"
|
|
||||||
>
|
|
||||||
<template v-slot:header-organization="prop">
|
|
||||||
<div class="col">
|
|
||||||
<div
|
|
||||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
|
||||||
>
|
|
||||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{ prop.node.organizationName }}
|
|
||||||
</div>
|
|
||||||
<q-badge
|
|
||||||
v-if="prop.node.totalPositionVacant > 0"
|
|
||||||
rounded
|
|
||||||
color="red"
|
|
||||||
outline
|
|
||||||
:label="prop.node.totalPositionVacant"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</div>
|
|
||||||
<div class="col items-center q-px-xs q-pt-xs">
|
|
||||||
<div class="text-weight-medium text-grey-7">
|
|
||||||
{{ prop.node.governmentCode }}
|
|
||||||
{{ prop.node.organizationShortName }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-slot:header-person="prop">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
:active="selected == prop.node.keyId"
|
|
||||||
@click="selectedPosition(prop.node)"
|
|
||||||
:disable="
|
|
||||||
prop.node.name != null ||
|
|
||||||
checkPosition(prop.node.positionNumId) != -1
|
|
||||||
"
|
|
||||||
active-class="my-list-link text-primary text-weight-medium"
|
|
||||||
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
v-if="
|
|
||||||
prop.node.avatar == '' ||
|
|
||||||
prop.node.avatar ==
|
|
||||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
|
||||||
"
|
|
||||||
src="@/assets/avatar_user.jpg"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<img
|
|
||||||
v-else
|
|
||||||
:src="prop.node.avatar"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
|
||||||
<div
|
|
||||||
v-if="prop.node.name == null"
|
|
||||||
class="q-px-sm text-weight-medium text-red"
|
|
||||||
>
|
|
||||||
ว่าง
|
|
||||||
</div>
|
|
||||||
<!--=====หัวหน้า สีเขียว=====-->
|
|
||||||
<div v-else-if="prop.node.positionLeaderFlag">
|
|
||||||
<div
|
|
||||||
class="q-px-sm text-weight-medium text-primary"
|
|
||||||
>
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--=====ลูกน้อง สีปกติ=====-->
|
|
||||||
<div v-else>
|
|
||||||
<div class="q-px-sm text-weight-medium">
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionName }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionNum }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionLevel }}
|
|
||||||
</div>
|
|
||||||
<q-icon
|
|
||||||
v-if="prop.node.positionLeaderFlag"
|
|
||||||
class="q-mr-sm"
|
|
||||||
size="15px"
|
|
||||||
color="primary"
|
|
||||||
name="mdi-bookmark"
|
|
||||||
></q-icon>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</q-item>
|
|
||||||
</template>
|
|
||||||
</q-tree>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-5">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<div class="row col-12 q-col-gutter-xs">
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12"></div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="dataForm.containDate"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
:model-value="
|
|
||||||
date2Thai(new Date(dataForm.containDate))
|
|
||||||
"
|
|
||||||
:rules="[ (val: string) =>!!val ||`${'วันที่รายงานตัว'}`]"
|
|
||||||
:label="`${'วันที่รายงานตัว'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
style="color: var(--q-primary)"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
outlined
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="posNoOptions"
|
|
||||||
v-model="dataForm.posNoId"
|
|
||||||
:label="`${'ตำแหน่งเลขที่'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionOptions"
|
|
||||||
v-model="dataForm.positionId"
|
|
||||||
:label="`${'ตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
emit-value
|
|
||||||
:options="positionPathSideOptions"
|
|
||||||
v-model="dataForm.positionPathSideId"
|
|
||||||
:label="`${'ด้าน/สาขา'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionTypeOptions"
|
|
||||||
v-model="dataForm.positionTypeId"
|
|
||||||
:label="`${'ประเภทตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLineOptions"
|
|
||||||
v-model="dataForm.positionLineId"
|
|
||||||
:label="`${'สายงาน'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLevelOptions"
|
|
||||||
v-model="dataForm.positionLevelId"
|
|
||||||
:label="`${'ระดับตำแหน่ง'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`]"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
|
||||||
|
|
||||||
<q-separator />
|
|
||||||
<DialogFooter
|
|
||||||
:editvisible="true"
|
|
||||||
:validate="validateData"
|
|
||||||
:save="saveAppoint"
|
|
||||||
v-model:modalEdit="editDataStatus"
|
|
||||||
/>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
|
||||||
</q-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.q-tree__node-header {
|
|
||||||
padding: 0px;
|
|
||||||
margin-top: 0px;
|
|
||||||
border-radius: 4px;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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>
|
|
||||||
|
|
@ -1,34 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const props = defineProps({
|
|
||||||
title: String,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const close = async () => {
|
|
||||||
props.close();
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-toolbar class="q-py-md">
|
|
||||||
<q-toolbar-title class="header-text">{{ title }}</q-toolbar-title>
|
|
||||||
<q-btn
|
|
||||||
icon="close"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
@click="close"
|
|
||||||
style="color: #ff8080; background-color: #ffdede"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.header-text {
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 26px;
|
|
||||||
color: #35373c;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,6 +1,9 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watch } from "vue";
|
import { ref, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
|
@ -14,13 +17,6 @@ import type { UserDataNew } from "@/modules/05_placement/interface/response/Appo
|
||||||
* importcomponents
|
* importcomponents
|
||||||
*/
|
*/
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
|
|
||||||
/**
|
|
||||||
* importStore
|
|
||||||
*/
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const storeFn = useTransferDataStore();
|
const storeFn = useTransferDataStore();
|
||||||
const { statusText } = storeFn;
|
const { statusText } = storeFn;
|
||||||
|
|
@ -39,7 +35,7 @@ const {
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
Modal: Boolean,
|
Modal: Boolean,
|
||||||
clickClose: Function,
|
clickClose: Function,
|
||||||
fecthlistappointment: Function,
|
fetchData: Function,
|
||||||
nextPage: Function,
|
nextPage: Function,
|
||||||
optionsType: Array,
|
optionsType: Array,
|
||||||
rows2: Array,
|
rows2: Array,
|
||||||
|
|
@ -130,14 +126,12 @@ const columns2 = ref<QTableProps["columns"]>([
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const selected = ref<[]>([]);
|
const selected = ref<[]>([]);
|
||||||
const checkSelected = computed(() => {
|
|
||||||
if (selected.value.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ไปหน้ารายละเอียดที่เลือก
|
||||||
|
* @param item
|
||||||
|
*/
|
||||||
function pageNext(item: any) {
|
function pageNext(item: any) {
|
||||||
props.nextPage?.(item?.id);
|
props.nextPage?.(item?.id);
|
||||||
}
|
}
|
||||||
|
|
@ -173,7 +167,7 @@ function sendToCommand() {
|
||||||
await http
|
await http
|
||||||
.put(config.API.apppointmentReport(Type), data)
|
.put(config.API.apppointmentReport(Type), data)
|
||||||
.then(async () => {
|
.then(async () => {
|
||||||
await props.fecthlistappointment?.();
|
await props.fetchData?.();
|
||||||
await props.clickClose?.();
|
await props.clickClose?.();
|
||||||
await success($q, "บันทึกสำเร็จ");
|
await success($q, "บันทึกสำเร็จ");
|
||||||
selected.value = [];
|
selected.value = [];
|
||||||
|
|
@ -187,6 +181,11 @@ function sendToCommand() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* เมื่อ props.modal เป็น true
|
||||||
|
*
|
||||||
|
* กำหนดให้ selected เป็นค่าว่าง
|
||||||
|
*/
|
||||||
watch(
|
watch(
|
||||||
() => props.Modal,
|
() => props.Modal,
|
||||||
() => {
|
() => {
|
||||||
|
|
@ -343,7 +342,7 @@ watch(
|
||||||
label="ส่งไปออกคำสั่ง"
|
label="ส่งไปออกคำสั่ง"
|
||||||
@click="sendToCommand"
|
@click="sendToCommand"
|
||||||
color="public"
|
color="public"
|
||||||
:disable="checkSelected"
|
:disable="selected.length === 0"
|
||||||
>
|
>
|
||||||
<q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
|
<q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
|
||||||
</q-btn>
|
</q-btn>
|
||||||
|
|
@ -1,409 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import { reactive, ref, onMounted, watch } from "vue";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
import type {
|
|
||||||
optionData,
|
|
||||||
tableType,
|
|
||||||
} from "@/modules/05_placement/interface/index/Main";
|
|
||||||
import { useRouter, useRoute } from "vue-router";
|
|
||||||
|
|
||||||
const total = ref<number>(0);
|
|
||||||
const totalList = ref<number>(1);
|
|
||||||
const pagination = ref({
|
|
||||||
sortBy: "createdAt",
|
|
||||||
descending: true,
|
|
||||||
page: 1,
|
|
||||||
rowsPerPage: 10,
|
|
||||||
});
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
getData: Function,
|
|
||||||
});
|
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
|
||||||
const id = ref<string>(route.params.id ? route.params.id.toString() : "");
|
|
||||||
const searchRules = ref<boolean>(false);
|
|
||||||
const selected = ref<any[]>([]);
|
|
||||||
const searchRef = ref<any>(null);
|
|
||||||
const rows = ref<tableType[]>([]);
|
|
||||||
const type = ref<string>("citizenId");
|
|
||||||
const search = ref<string>("");
|
|
||||||
const typeOps = ref<optionData[]>([
|
|
||||||
{ id: "citizenId", name: "เลขประจำตัวประชาชน" },
|
|
||||||
{ id: "firstname", name: "ชื่อ" },
|
|
||||||
{ id: "lastname", name: "นามสกุล" },
|
|
||||||
]);
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const {
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
messageError,
|
|
||||||
date2Thai,
|
|
||||||
dialogConfirm,
|
|
||||||
dialogMessageNotify,
|
|
||||||
findOrgName,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const modalDialog = defineModel<boolean>("modal", { required: true });
|
|
||||||
|
|
||||||
function onCloseDialog() {
|
|
||||||
modalDialog.value = false;
|
|
||||||
rows.value = [];
|
|
||||||
selected.value = [];
|
|
||||||
search.value = "";
|
|
||||||
type.value = "idcard";
|
|
||||||
}
|
|
||||||
|
|
||||||
/** หัวข้อที่เเสดงในตารางผู้ถูกร้องเรียน */
|
|
||||||
const visibleColumnsRespondent = ref<string[]>([
|
|
||||||
"no",
|
|
||||||
"name",
|
|
||||||
"position",
|
|
||||||
"positionType",
|
|
||||||
"organization",
|
|
||||||
]);
|
|
||||||
|
|
||||||
const columnsRespondent = ref<QTableProps["columns"]>([
|
|
||||||
{
|
|
||||||
name: "no",
|
|
||||||
align: "left",
|
|
||||||
label: "ลำดับ",
|
|
||||||
sortable: false,
|
|
||||||
field: "no",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "name",
|
|
||||||
align: "left",
|
|
||||||
label: "ชื่อ - นามสกุล",
|
|
||||||
sortable: true,
|
|
||||||
field: "name",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "position",
|
|
||||||
align: "left",
|
|
||||||
label: "ตำแหน่ง",
|
|
||||||
sortable: true,
|
|
||||||
field: "position",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "positionType",
|
|
||||||
align: "left",
|
|
||||||
label: "ประเภทตำแหน่ง",
|
|
||||||
sortable: true,
|
|
||||||
field: "positionType",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "organization",
|
|
||||||
align: "left",
|
|
||||||
label: "สังกัด",
|
|
||||||
sortable: true,
|
|
||||||
field: "organization",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
async function searchInput(check: boolean) {
|
|
||||||
if (check) {
|
|
||||||
searchRules.value = check;
|
|
||||||
searchRef.value.validate();
|
|
||||||
if (!searchRef.value.hasError) {
|
|
||||||
await getSearch();
|
|
||||||
}
|
|
||||||
setTimeout(() => {
|
|
||||||
searchRules.value = false;
|
|
||||||
}, 100);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function getSearch() {
|
|
||||||
showLoader();
|
|
||||||
const body = {
|
|
||||||
fieldName: type.value,
|
|
||||||
keyword: search.value,
|
|
||||||
};
|
|
||||||
await http
|
|
||||||
.post(
|
|
||||||
config.API.orgSearchPersonal() +
|
|
||||||
`?page=${pagination.value.page}&pageSize=${pagination.value.rowsPerPage}&searchKeyword=${search.value}`,
|
|
||||||
body
|
|
||||||
)
|
|
||||||
.then((res) => {
|
|
||||||
const data = res.data.result;
|
|
||||||
totalList.value = Math.ceil(data.total / pagination.value.rowsPerPage);
|
|
||||||
total.value = data.total;
|
|
||||||
rows.value = data.data;
|
|
||||||
})
|
|
||||||
.catch((err) => {})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** update เมื่อเปลี่ยน option */
|
|
||||||
function updateSelect() {
|
|
||||||
search.value = "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function onSubmit() {
|
|
||||||
if (selected.value.length == 0) {
|
|
||||||
dialogMessageNotify($q, "กรุณาเลือกรายชื่อผู้ที่ย้ายสับเปลี่ยนตำแหน่ง");
|
|
||||||
} else {
|
|
||||||
const dataProfile = selected.value;
|
|
||||||
dialogConfirm($q, () => {
|
|
||||||
showLoader();
|
|
||||||
http
|
|
||||||
.post(config.API.changePositionByIdProfile + `/${id.value}`, {
|
|
||||||
changePositionId: id.value,
|
|
||||||
profiles: dataProfile.map((i: any) => ({
|
|
||||||
profileId: i.id,
|
|
||||||
prefix: i.prefix,
|
|
||||||
firstName: i.firstName,
|
|
||||||
lastName: i.lastName,
|
|
||||||
citizenId: i.citizenId ? i.citizenId : null,
|
|
||||||
birthDate: i.birthDate ? i.birthDate : null,
|
|
||||||
positionOld: i.position ? i.position : null,
|
|
||||||
positionTypeOld: i.positionType ? i.positionType : null,
|
|
||||||
positionLevelOld: i.positionLevel ? i.positionLevel : null,
|
|
||||||
positionNumberOld: i.posNo ? i.posNo : null,
|
|
||||||
organizationOld: i.organization ? i.organization : null,
|
|
||||||
amountOld: i.salary ? i.salary : null,
|
|
||||||
educationOld: i.educationDegree ? i.educationDegree : null,
|
|
||||||
rootOld: i.root ? i.root : null,
|
|
||||||
rootOldId: i.rootId ? i.rootId : null,
|
|
||||||
rootShortNameOld: i.rootShortName ? i.rootShortName : null,
|
|
||||||
child1Old: i.child1 ? i.child1 : null,
|
|
||||||
child1OldId: i.child1Id ? i.child1Id : null,
|
|
||||||
child1ShortNameOld: i.child1ShortName ? i.child1ShortName : null,
|
|
||||||
child2Old: i.child2 ? i.child2 : null,
|
|
||||||
child2OldId: i.child2Id ? i.child2Id : null,
|
|
||||||
child2ShortNameOld: i.child2ShortName ? i.child2ShortName : null,
|
|
||||||
child3Old: i.child3 ? i.child3 : null,
|
|
||||||
child3OldId: i.child3Id ? i.child3Id : null,
|
|
||||||
child3ShortNameOld: i.child3ShortName ? i.child3ShortName : null,
|
|
||||||
child4Old: i.child4 ? i.child4 : null,
|
|
||||||
child4OldId: i.child4Id ? i.child4Id : null,
|
|
||||||
child4ShortNameOld: i.child4ShortName ? i.child4ShortName : null,
|
|
||||||
posMasterNoOld: i.posMasterNo ? i.posMasterNo : null,
|
|
||||||
posTypeOldId: i.posTypeId ? i.posTypeId : null,
|
|
||||||
posTypeNameOld: i.posTypeName ? i.posTypeName : null,
|
|
||||||
posLevelOldId: i.posLevelId ? i.posLevelId : null,
|
|
||||||
posLevelNameOld: i.posLevelName ? i.posLevelName : null,
|
|
||||||
})),
|
|
||||||
})
|
|
||||||
.then((res) => {
|
|
||||||
onCloseDialog();
|
|
||||||
props.getData?.();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
messageError($q, err);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatePagination(newPagination: any) {
|
|
||||||
pagination.value.page = 1;
|
|
||||||
pagination.value.rowsPerPage = newPagination.rowsPerPage;
|
|
||||||
}
|
|
||||||
|
|
||||||
watch(
|
|
||||||
() => pagination.value.rowsPerPage,
|
|
||||||
async () => {
|
|
||||||
await getSearch();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-dialog v-model="modalDialog" persistent>
|
|
||||||
<q-card :style="$q.screen.gt.xs ? 'min-width: 90vw' : 'width: 100vw'">
|
|
||||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
|
||||||
<DialogHeader
|
|
||||||
:tittle="'เพิ่มรายชื่อผู้ที่ย้ายสับเปลี่ยนตำแหน่ง'"
|
|
||||||
:close="onCloseDialog"
|
|
||||||
/>
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section class="q-pa-none scroll" style="max-height: 80vh">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="row q-pa-md q-col-gutter-sm">
|
|
||||||
<div class="col-12 col-sm-6 col-md-3">
|
|
||||||
<q-select
|
|
||||||
label="ค้นหาจาก"
|
|
||||||
v-model="type"
|
|
||||||
:options="typeOps"
|
|
||||||
emit-value
|
|
||||||
dense
|
|
||||||
@update:model-value="updateSelect"
|
|
||||||
map-options
|
|
||||||
outlined
|
|
||||||
option-label="name"
|
|
||||||
option-value="id"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-12 col-sm-6 col-md-9">
|
|
||||||
<q-input
|
|
||||||
ref="searchRef"
|
|
||||||
v-model="search"
|
|
||||||
outlined
|
|
||||||
clearable
|
|
||||||
hide-bottom-space
|
|
||||||
dense
|
|
||||||
label="คำค้น"
|
|
||||||
:rules="[
|
|
||||||
(val) => !!val || !searchRules || `กรุณากรอกคำค้น`,
|
|
||||||
]"
|
|
||||||
>
|
|
||||||
<template v-slot:after>
|
|
||||||
<q-btn
|
|
||||||
color="primary"
|
|
||||||
icon="search"
|
|
||||||
label="ค้นหา"
|
|
||||||
class="full-width q-py-sm q-px-md"
|
|
||||||
@click="searchInput(true)"
|
|
||||||
>
|
|
||||||
</q-btn>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 q-pt-sm">
|
|
||||||
<d-table
|
|
||||||
ref="table"
|
|
||||||
:columns="columnsRespondent"
|
|
||||||
:rows="rows"
|
|
||||||
row-key="id"
|
|
||||||
flat
|
|
||||||
bordered
|
|
||||||
selection="multiple"
|
|
||||||
v-model:selected="selected"
|
|
||||||
:paging="true"
|
|
||||||
dense
|
|
||||||
class="custom-header-table"
|
|
||||||
:visible-columns="visibleColumnsRespondent"
|
|
||||||
:rows-per-page-options="[1, 25, 50, 100]"
|
|
||||||
@update:pagination="updatePagination"
|
|
||||||
>
|
|
||||||
<template v-slot:pagination="scope">
|
|
||||||
ทั้งหมด {{ total }} รายการ
|
|
||||||
<q-pagination
|
|
||||||
v-model="pagination.page"
|
|
||||||
active-color="primary"
|
|
||||||
color="dark"
|
|
||||||
:max="Number(totalList)"
|
|
||||||
size="sm"
|
|
||||||
boundary-links
|
|
||||||
direction-links
|
|
||||||
:max-pages="5"
|
|
||||||
@update:model-value="getSearch"
|
|
||||||
></q-pagination>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-slot:header="props">
|
|
||||||
<q-tr :props="props">
|
|
||||||
<q-th auto-width>
|
|
||||||
<q-checkbox
|
|
||||||
keep-color
|
|
||||||
color="primary"
|
|
||||||
dense
|
|
||||||
v-model="props.selected"
|
|
||||||
/>
|
|
||||||
</q-th>
|
|
||||||
<q-th
|
|
||||||
v-for="col in props.cols"
|
|
||||||
:key="col.name"
|
|
||||||
:props="props"
|
|
||||||
style="color: #000000; font-weight: 500"
|
|
||||||
>
|
|
||||||
<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'">
|
|
||||||
{{
|
|
||||||
(pagination.page - 1) * pagination.rowsPerPage +
|
|
||||||
props.rowIndex +
|
|
||||||
1
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div v-else-if="col.name == 'name'">
|
|
||||||
{{
|
|
||||||
`${props.row.prefix ? props.row.prefix : ""}${
|
|
||||||
props.row.firstName ? props.row.firstName : ""
|
|
||||||
} ${props.row.lastName ? props.row.lastName : ""}`
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div v-else-if="col.name == 'positionType'">
|
|
||||||
{{
|
|
||||||
props.row.positionTypeName
|
|
||||||
? props.row.positionTypeName
|
|
||||||
: ""
|
|
||||||
}}{{
|
|
||||||
props.row.positionLevelName
|
|
||||||
? ` (${props.row.positionLevelName})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-else-if="col.name == 'organization'"
|
|
||||||
class="table_ellipsis"
|
|
||||||
>
|
|
||||||
{{ findOrgName(props.row) }}
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
{{ col.value }}
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
</d-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</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>
|
|
||||||
|
|
@ -1,34 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const props = defineProps({
|
|
||||||
title: String,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const close = async () => {
|
|
||||||
props.close();
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-toolbar class="q-py-md">
|
|
||||||
<q-toolbar-title class="header-text">{{ title }}</q-toolbar-title>
|
|
||||||
<q-btn
|
|
||||||
icon="close"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
@click="close"
|
|
||||||
style="color: #ff8080; background-color: #ffdede"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.header-text {
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 26px;
|
|
||||||
color: #35373c;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,80 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, watch } from "vue";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const { dialogConfirm, success, showLoader, hideLoader } = mixin;
|
|
||||||
const modal = defineModel<boolean>("modal", { required: true });
|
|
||||||
const editCheck = defineModel<boolean>("edit");
|
|
||||||
const round = defineModel<string>("round", { required: true });
|
|
||||||
const idRound = defineModel<string>("id", { required: true });
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
getData: Function,
|
|
||||||
});
|
|
||||||
/** ปิด dialog */
|
|
||||||
function close() {
|
|
||||||
modal.value = false;
|
|
||||||
editCheck.value = false;
|
|
||||||
round.value = "";
|
|
||||||
idRound.value = "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function onSubmit() {
|
|
||||||
dialogConfirm($q, () => {
|
|
||||||
const url = editCheck.value
|
|
||||||
? config.API.changePosition + `/${idRound.value}`
|
|
||||||
: config.API.changePosition;
|
|
||||||
|
|
||||||
http[editCheck.value ? "put" : "post"](url, {
|
|
||||||
name: round.value,
|
|
||||||
}).then((res) => {
|
|
||||||
close();
|
|
||||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
|
||||||
props.getData?.();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-dialog persistent v-model="modal">
|
|
||||||
<q-card bordered style="min-width: 40vh">
|
|
||||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
|
||||||
<DialogHeader
|
|
||||||
:tittle="`${
|
|
||||||
editCheck ? 'แก้ไข' : 'เพิ่ม'
|
|
||||||
}รอบการออกคำสั่งย้ายสับเปลี่ยนตำแหน่ง`"
|
|
||||||
:close="close"
|
|
||||||
/>
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section class="q-pa-sm">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
v-model="round"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
class="inputgreen"
|
|
||||||
label="ชื่อรอบการย้ายสับเปลี่ยนตำแหน่ง"
|
|
||||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อรอบการย้ายสับเปลี่ยนตำแหน่ง'}`,]"
|
|
||||||
></q-input>
|
|
||||||
</div>
|
|
||||||
</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>
|
|
||||||
|
|
@ -1,405 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, onMounted, watch } from "vue";
|
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { useRouter } from "vue-router";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
import SendToCommand from "@/modules/05_placement/components/ChangePosition/SendToCommand.vue";
|
|
||||||
|
|
||||||
import DialogRound from "@/modules/05_placement/components/ChangePosition/DialogRound.vue";
|
|
||||||
import type {
|
|
||||||
listAppointType,
|
|
||||||
resData,
|
|
||||||
} from "@/modules/05_placement/interface/response/AppointMent";
|
|
||||||
import type { OpType } from "@/modules/05_placement/interface/response/Main";
|
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
const total = ref<number>(0);
|
|
||||||
const totalList = ref<number>(1);
|
|
||||||
const round = ref<string>("");
|
|
||||||
const idRound = ref<string>("");
|
|
||||||
const editCheck = ref<boolean>(false);
|
|
||||||
const modalRound = ref<boolean>(false);
|
|
||||||
const $q = useQuasar();
|
|
||||||
const modal = ref<boolean>(false);
|
|
||||||
const storeFn = useTransferDataStore();
|
|
||||||
const { statusText } = storeFn;
|
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const {
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
success,
|
|
||||||
messageError,
|
|
||||||
date2Thai,
|
|
||||||
dialogRemove,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const router = useRouter();
|
|
||||||
const rows = ref<any[]>([]);
|
|
||||||
const rows2 = ref<any>([]);
|
|
||||||
const filterKeyword = ref<string>("");
|
|
||||||
const filterKeyword2 = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const optionsType = ref<OpType[]>([]);
|
|
||||||
const type = ref<string>("");
|
|
||||||
|
|
||||||
const visibleColumns = ref<string[]>(["no", "name", "createdAt", "status"]);
|
|
||||||
const pagination = ref({
|
|
||||||
sortBy: "createdAt",
|
|
||||||
descending: true,
|
|
||||||
page: 1,
|
|
||||||
rowsPerPage: 10,
|
|
||||||
});
|
|
||||||
const columns = ref<QTableProps["columns"]>([
|
|
||||||
{
|
|
||||||
name: "no",
|
|
||||||
align: "left",
|
|
||||||
label: "ลำดับ",
|
|
||||||
sortable: false,
|
|
||||||
field: "no",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "name",
|
|
||||||
align: "left",
|
|
||||||
label: "ชื่อรอบการย้ายสับเปลี่ยนตำแหน่ง",
|
|
||||||
sortable: true,
|
|
||||||
field: "name",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "createdAt",
|
|
||||||
align: "left",
|
|
||||||
label: "วันที่ดำเนินการ",
|
|
||||||
sortable: true,
|
|
||||||
field: "createdAt",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "status",
|
|
||||||
align: "left",
|
|
||||||
label: "สถานะ",
|
|
||||||
sortable: true,
|
|
||||||
field: "status",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
//รีเซ็ต input
|
|
||||||
const resetFilter = () => {
|
|
||||||
filterKeyword.value = "";
|
|
||||||
filterKeyword2.value = "";
|
|
||||||
filterRef.value.focus();
|
|
||||||
fecthLists();
|
|
||||||
};
|
|
||||||
|
|
||||||
//ปิด modal
|
|
||||||
const clickClose = () => {
|
|
||||||
modal.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
//เปิด modal
|
|
||||||
function sendToCommand() {
|
|
||||||
modal.value = true;
|
|
||||||
filterKeyword2.value = "";
|
|
||||||
// fecthTypeOption();
|
|
||||||
}
|
|
||||||
|
|
||||||
//ดึงข้อมูล API
|
|
||||||
async function fecthLists() {
|
|
||||||
showLoader();
|
|
||||||
rows.value = [];
|
|
||||||
await http
|
|
||||||
.get(
|
|
||||||
config.API.changePosition +
|
|
||||||
`?page=${pagination.value.page}&pageSize=${pagination.value.rowsPerPage}&searchKeyword=${filterKeyword.value}`
|
|
||||||
)
|
|
||||||
.then((res) => {
|
|
||||||
totalList.value = Math.ceil(
|
|
||||||
res.data.result.total / pagination.value.rowsPerPage
|
|
||||||
);
|
|
||||||
total.value = res.data.result.total;
|
|
||||||
rows.value = res.data.result.data;
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// dialog สำหรับแก้ไข
|
|
||||||
function openModaledit(data: any) {
|
|
||||||
modalRound.value = true;
|
|
||||||
editCheck.value = true;
|
|
||||||
round.value = data.name;
|
|
||||||
idRound.value = data.id;
|
|
||||||
}
|
|
||||||
|
|
||||||
// ฟังก์ชั่นสำหรับเพิ่มรอบการย้ายสับเปลี่ยนตำแหน่ง
|
|
||||||
function addRound() {
|
|
||||||
modalRound.value = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
//ลบข้อมูล
|
|
||||||
function clickDelete(id: string) {
|
|
||||||
dialogRemove($q, () => {
|
|
||||||
showLoader();
|
|
||||||
http
|
|
||||||
.delete(config.API.changePosition + `/${id}`)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "ลบข้อมูลสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
fecthLists();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// ไปหน้ารายชื่อ
|
|
||||||
function personalListPage(id: string) {
|
|
||||||
router.push({
|
|
||||||
path: `/change-positions/${id}`,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatePagination(newPagination: any) {
|
|
||||||
pagination.value.page = 1;
|
|
||||||
pagination.value.rowsPerPage = newPagination.rowsPerPage;
|
|
||||||
}
|
|
||||||
|
|
||||||
watch(
|
|
||||||
() => pagination.value.rowsPerPage,
|
|
||||||
async () => {
|
|
||||||
await fecthLists();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
fecthLists();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="toptitle text-dark col-12 row items-center">
|
|
||||||
รายการออกคำสั่งย้ายสับเปลี่ยนตำแหน่ง
|
|
||||||
</div>
|
|
||||||
<q-card flat bordered class="col-12 q-mt-sm">
|
|
||||||
<q-separator />
|
|
||||||
<div class="row q-pa-md">
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="row col-12">
|
|
||||||
<q-btn
|
|
||||||
@click="addRound()"
|
|
||||||
size="14px"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
color="primary"
|
|
||||||
icon="add"
|
|
||||||
>
|
|
||||||
<q-tooltip>เพิ่มรอบการย้ายสับเปลี่ยนตำแหน่ง</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
|
|
||||||
<q-btn
|
|
||||||
@click="sendToCommand()"
|
|
||||||
size="14px"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
color="add"
|
|
||||||
icon="mdi-account-arrow-right"
|
|
||||||
>
|
|
||||||
<q-tooltip>ส่งไปออกคำสั่งแต่งตั้ง-เลื่อน-ย้าย</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
<q-input
|
|
||||||
class="col-xs-12 col-sm-3 col-md-2"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
v-model="filterKeyword"
|
|
||||||
ref="filterRef"
|
|
||||||
outlined
|
|
||||||
debounce="300"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
@keyup.enter="fecthLists()"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon v-if="filterKeyword == ''" name="search" />
|
|
||||||
<q-icon
|
|
||||||
v-if="filterKeyword !== ''"
|
|
||||||
name="clear"
|
|
||||||
class="cursor-pointer"
|
|
||||||
@click="resetFilter"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
|
|
||||||
<q-select
|
|
||||||
v-model="visibleColumns"
|
|
||||||
multiple
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
options-dense
|
|
||||||
:display-value="$q.lang.table.columns"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
:options="columns"
|
|
||||||
option-value="name"
|
|
||||||
options-cover
|
|
||||||
style="min-width: 150px"
|
|
||||||
class="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-12 q-pt-sm">
|
|
||||||
<d-table
|
|
||||||
:columns="columns"
|
|
||||||
:rows="rows"
|
|
||||||
row-key="id"
|
|
||||||
:visible-columns="visibleColumns"
|
|
||||||
:rows-per-page-options="[1, 25, 50, 100]"
|
|
||||||
@update:pagination="updatePagination"
|
|
||||||
>
|
|
||||||
<template v-slot:pagination="scope">
|
|
||||||
ทั้งหมด {{ total }} รายการ
|
|
||||||
<q-pagination
|
|
||||||
v-model="pagination.page"
|
|
||||||
active-color="primary"
|
|
||||||
color="dark"
|
|
||||||
:max="Number(totalList)"
|
|
||||||
size="sm"
|
|
||||||
boundary-links
|
|
||||||
direction-links
|
|
||||||
:max-pages="5"
|
|
||||||
@update:model-value="fecthLists"
|
|
||||||
></q-pagination>
|
|
||||||
</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 auto-width>
|
|
||||||
<q-btn
|
|
||||||
v-if="
|
|
||||||
props.row.status !== 'REPORT' &&
|
|
||||||
props.row.status !== 'DONE'
|
|
||||||
"
|
|
||||||
icon="mdi-dots-vertical"
|
|
||||||
size="12px"
|
|
||||||
color="grey-7"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
>
|
|
||||||
<q-menu
|
|
||||||
transition-show="jump-down"
|
|
||||||
transition-hide="jump-up"
|
|
||||||
>
|
|
||||||
<q-list dense style="min-width: 250px">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
v-close-popup
|
|
||||||
@click="openModaledit(props.row)"
|
|
||||||
>
|
|
||||||
<q-item-section
|
|
||||||
style="min-width: 0px"
|
|
||||||
avatar
|
|
||||||
class="q-py-sm"
|
|
||||||
>
|
|
||||||
<q-icon color="edit" size="xs" name="edit" />
|
|
||||||
</q-item-section>
|
|
||||||
<q-item-section>แก้ไข</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
v-close-popup
|
|
||||||
@click="clickDelete(props.row.id)"
|
|
||||||
>
|
|
||||||
<q-item-section
|
|
||||||
style="min-width: 0px"
|
|
||||||
avatar
|
|
||||||
class="q-py-sm"
|
|
||||||
>
|
|
||||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
|
||||||
<q-icon color="red" size="xs" name="mdi-delete" />
|
|
||||||
</q-item-section>
|
|
||||||
<q-item-section>ลบ</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
</q-list>
|
|
||||||
</q-menu>
|
|
||||||
</q-btn>
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
v-for="col in props.cols"
|
|
||||||
:key="col.name"
|
|
||||||
@click="personalListPage(props.row.id)"
|
|
||||||
>
|
|
||||||
<div v-if="col.name == 'no'">
|
|
||||||
{{
|
|
||||||
(pagination.page - 1) * pagination.rowsPerPage +
|
|
||||||
props.rowIndex +
|
|
||||||
1
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else-if="col.name == 'createdAt'">
|
|
||||||
{{
|
|
||||||
props.row.createdAt ? date2Thai(props.row.createdAt) : "-"
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else-if="col.name == 'status'">
|
|
||||||
{{ props.row.status ? statusText(props.row.status) : "-" }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else>
|
|
||||||
{{ col.value ? col.value : "-" }}
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
</d-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card>
|
|
||||||
|
|
||||||
<SendToCommand
|
|
||||||
v-model:Modal="modal"
|
|
||||||
:clickClose="clickClose"
|
|
||||||
:optionsType="optionsType"
|
|
||||||
:rows2="rows2"
|
|
||||||
v-model:filterKeyword2="filterKeyword2"
|
|
||||||
v-model:type="type"
|
|
||||||
:nextPage="personalListPage"
|
|
||||||
:fecthLists="fecthLists"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<DialogRound
|
|
||||||
v-model:modal="modalRound"
|
|
||||||
v-model:edit="editCheck"
|
|
||||||
v-model:round="round"
|
|
||||||
v-model:id="idRound"
|
|
||||||
:getData="fecthLists"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
||||||
|
|
@ -1,716 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useQuasar, QForm } from "quasar";
|
|
||||||
import { onMounted, reactive, ref, watch } from "vue";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
|
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
hideLoader,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
success,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin; //ฟังก์ชันกลางที่เรียกใช้
|
|
||||||
|
|
||||||
const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
|
|
||||||
const noData = ref<string>("ไม่พบข้อมูลผังโครงสร้าง");
|
|
||||||
|
|
||||||
const checkValidate = ref<boolean>(false);
|
|
||||||
const myFormPosition = ref<any>();
|
|
||||||
const selected = ref<string>("");
|
|
||||||
const selectedFile = ref<string>("");
|
|
||||||
const dataRespone = ref<any>();
|
|
||||||
const personal = ref<any>();
|
|
||||||
const expanded = ref<string[]>([]);
|
|
||||||
const treeData = ref<Array<any>>([]);
|
|
||||||
const placementPosition = ref<any>([]);
|
|
||||||
const search = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const id = ref<string>("");
|
|
||||||
|
|
||||||
const editDataStatus = ref<boolean>(false);
|
|
||||||
// Set form field
|
|
||||||
let dataForm = reactive({
|
|
||||||
personalId: "",
|
|
||||||
containDate: new Date(),
|
|
||||||
posNoId: "",
|
|
||||||
positionId: "",
|
|
||||||
positionLevelId: "",
|
|
||||||
positionLineId: "",
|
|
||||||
positionPathSideId: "",
|
|
||||||
positionTypeId: "",
|
|
||||||
});
|
|
||||||
|
|
||||||
// const fetchPublishFile = async () => {
|
|
||||||
// await http
|
|
||||||
// .get(config.API.getPublishFileHistory)
|
|
||||||
// .then((res) => {
|
|
||||||
// let data = res.data.result;
|
|
||||||
// selectedFile.value = data[0].fileName;
|
|
||||||
// })
|
|
||||||
// .catch((e) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(async () => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// };
|
|
||||||
|
|
||||||
// โหลดข้อมูลโครงสร้างจาก json
|
|
||||||
// const loadTreeData = async () => {
|
|
||||||
// expanded.value = [];
|
|
||||||
// await http
|
|
||||||
// .get(`${config.s3ClusterUrl}${selectedFile.value}`)
|
|
||||||
// .then((res: any) => {
|
|
||||||
// treeData.value = res.data;
|
|
||||||
// dataRespone.value = res.data;
|
|
||||||
|
|
||||||
// // Filter objects with "name" null
|
|
||||||
// const filteredData = res.data.filter(filterByPersonIdNull);
|
|
||||||
// treeData.value = filteredData;
|
|
||||||
// })
|
|
||||||
// .catch((e: any) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(() => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// };
|
|
||||||
|
|
||||||
function filterByPersonIdNull(obj: any) {
|
|
||||||
if (obj.name === null && obj.isCondition != true) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if (obj.children && obj.children.length > 0) {
|
|
||||||
obj.children = obj.children.filter(filterByPersonIdNull);
|
|
||||||
return obj.children.length > 0;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// โหลด position
|
|
||||||
|
|
||||||
const fetchplacementPosition = async () => {
|
|
||||||
await http
|
|
||||||
.get(config.API.apppointmentPosition())
|
|
||||||
.then((res: any) => {
|
|
||||||
placementPosition.value = res.data.result;
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
personalId: String,
|
|
||||||
modal: Boolean,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("close modal"),
|
|
||||||
},
|
|
||||||
personal: Object,
|
|
||||||
});
|
|
||||||
|
|
||||||
const myFilterMethod = (node: any, filter: string) => {
|
|
||||||
const filt = filter;
|
|
||||||
|
|
||||||
return (
|
|
||||||
(node.name && node.name.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationName && node.organizationName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
|
|
||||||
(node.positionName && node.positionName.indexOf(filt) > -1) ||
|
|
||||||
(node.governmentCode &&
|
|
||||||
node.governmentCode.toString().indexOf(filt) > -1) ||
|
|
||||||
(node.agency && node.agency.indexOf(filt) > -1) ||
|
|
||||||
(node.government && node.government.indexOf(filt) > -1) ||
|
|
||||||
(node.department && node.department.indexOf(filt) > -1) ||
|
|
||||||
(node.pile && node.pile.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationShortName &&
|
|
||||||
node.organizationShortName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionSideName && node.positionSideName.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePositionSide &&
|
|
||||||
node.executivePositionSide.indexOf(filt) > -1) ||
|
|
||||||
(node.positionLevel && node.positionLevel.indexOf(filt) > -1)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const validateData = async () => {
|
|
||||||
checkValidate.value = true;
|
|
||||||
await myFormPosition.value.validate().then((result: boolean) => {
|
|
||||||
if (result == false) {
|
|
||||||
checkValidate.value = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const saveAppoint = async () => {
|
|
||||||
myFormPosition.value.validate().then(async (result: boolean) => {
|
|
||||||
if (props.personalId !== undefined) {
|
|
||||||
id.value = props.personalId.toString();
|
|
||||||
}
|
|
||||||
if (result) {
|
|
||||||
const dataAppoint = await {
|
|
||||||
recruitDate: dataForm.containDate,
|
|
||||||
posNoId: dataForm.posNoId,
|
|
||||||
positionId: dataForm.positionId,
|
|
||||||
positionLevelId: dataForm.positionLevelId,
|
|
||||||
positionLineId: dataForm.positionLineId,
|
|
||||||
positionPathSideId: dataForm.positionPathSideId,
|
|
||||||
positionTypeId: dataForm.positionTypeId,
|
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.appointmentPosition(id.value), dataAppoint)
|
|
||||||
.then((res) => {
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await closeAndClear();
|
|
||||||
// await fetchPublishFile();
|
|
||||||
// await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeModal = () => {
|
|
||||||
if (editDataStatus.value == true) {
|
|
||||||
dialogConfirm(
|
|
||||||
$q,
|
|
||||||
async () => {
|
|
||||||
editDataStatus.value = false;
|
|
||||||
await closeAndClear();
|
|
||||||
},
|
|
||||||
`ข้อมูลมีการแก้ไข`,
|
|
||||||
`ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?`
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
closeAndClear();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeAndClear = async () => {
|
|
||||||
await props.close();
|
|
||||||
editDataStatus.value = false;
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.personalId = "";
|
|
||||||
dataForm.containDate = new Date();
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
};
|
|
||||||
// ตำแหน่งเลขที่
|
|
||||||
const posNoOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ตำแหน่ง
|
|
||||||
const positionOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ด้าน/สาขา
|
|
||||||
const positionPathSideOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ประเภทตำแหน่ง
|
|
||||||
const positionTypeOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// สายงาน
|
|
||||||
const positionLineOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ระดับ
|
|
||||||
const positionLevelOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
const selectedPosition = async (data: any) => {
|
|
||||||
if (data.name == null && selected.value != data.keyId) {
|
|
||||||
editDataStatus.value = true;
|
|
||||||
selected.value = data.keyId;
|
|
||||||
|
|
||||||
// posNo Options
|
|
||||||
posNoOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionNum,
|
|
||||||
value: data.positionNumId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.posNoId = data.positionNumId;
|
|
||||||
|
|
||||||
// position Options
|
|
||||||
positionOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionName,
|
|
||||||
value: data.positionNameId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionId = data.positionNameId;
|
|
||||||
|
|
||||||
// positionPathSide Options
|
|
||||||
let positionPathSideArr: any = [];
|
|
||||||
if (data.positionSideNameObj && data.positionSideNameObj != null) {
|
|
||||||
data.positionSideNameObj.map((x: any) => {
|
|
||||||
positionPathSideArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionPathSideOptions.value = positionPathSideArr;
|
|
||||||
dataForm.positionPathSideId =
|
|
||||||
positionPathSideArr.length > 1 || positionPathSideArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionPathSideArr[0].value;
|
|
||||||
}
|
|
||||||
|
|
||||||
// positionType Options
|
|
||||||
positionTypeOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionType,
|
|
||||||
value: data.positionTypeId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionTypeId = data.positionTypeId;
|
|
||||||
|
|
||||||
// positionLine Options
|
|
||||||
positionLineOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionLine,
|
|
||||||
value: data.positionLineId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionLineId = data.positionLineId;
|
|
||||||
|
|
||||||
// positionLevel Options
|
|
||||||
let positionLevelsArr: any = [];
|
|
||||||
if (data.positionLevelObj != null) {
|
|
||||||
data.positionLevelObj.map((x: any) => {
|
|
||||||
positionLevelsArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionLevelOptions.value = positionLevelsArr;
|
|
||||||
dataForm.positionLevelId =
|
|
||||||
positionLevelsArr.length > 1 || positionLevelsArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionLevelsArr[0].value;
|
|
||||||
dataForm.positionLevelId = data.positionLevelObj[0].Id;
|
|
||||||
}
|
|
||||||
} else if (selected.value == data.keyId) {
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const checkPosition = (val: string) => {
|
|
||||||
const num = placementPosition.value.findIndex((e: string) => e === val);
|
|
||||||
return num;
|
|
||||||
};
|
|
||||||
|
|
||||||
watch(props, () => {
|
|
||||||
expanded.value = [];
|
|
||||||
const dataPersonal = props.personal;
|
|
||||||
|
|
||||||
if (dataPersonal) {
|
|
||||||
dataPersonal.map((data: any) => {
|
|
||||||
personal.value = data;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (personal.value) {
|
|
||||||
let findData: any = null;
|
|
||||||
dataRespone.value.map((x: any) => {
|
|
||||||
findData = findByPerson(x);
|
|
||||||
if (findData != null) {
|
|
||||||
selectedPosition(findData);
|
|
||||||
for (let i = 3; i <= findData.keyId.length; i += 2) {
|
|
||||||
expanded.value.push(findData.keyId.slice(0, i));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function findByPerson(element: any): any {
|
|
||||||
if (
|
|
||||||
element.positionNumId &&
|
|
||||||
element.positionLineId === personal.value.positionLineId &&
|
|
||||||
element.positionTypeId === personal.value.positionTypeId &&
|
|
||||||
element.positionNumId === personal.value.posNoId &&
|
|
||||||
(element.positionLevelObj === null ||
|
|
||||||
element.positionLevelObj[0].Id === personal.value.positionLevelId)
|
|
||||||
) {
|
|
||||||
return element;
|
|
||||||
} else if (element.children) {
|
|
||||||
var i;
|
|
||||||
var result = null;
|
|
||||||
for (i = 0; result == null && i < element.children.length; i++) {
|
|
||||||
result = findByPerson(element.children[i]);
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
// await fetchPublishFile();
|
|
||||||
// await loadTreeData();
|
|
||||||
// await fetchplacementPosition();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-dialog v-model="props.modal" persistent>
|
|
||||||
<q-card style="width: 900px; max-width: 80vw">
|
|
||||||
<q-form ref="myFormPosition">
|
|
||||||
<DialogHeader
|
|
||||||
:tittle="'เลือกหน่วยงานที่แต่งตั้ง - เลื่อน'"
|
|
||||||
:close="closeModal"
|
|
||||||
/>
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section class="q-pa-sm bg-grey-1">
|
|
||||||
<div class="row col-12 q-col-gutter-sm">
|
|
||||||
<div class="col-xs-12 col-sm-7 row">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
ref="filterRef"
|
|
||||||
v-model="search"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
class="q-mb-sm"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon name="mdi-magnify" />
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
<div class="q-pa-sm q-gutter-sm">
|
|
||||||
<q-tree
|
|
||||||
no-transition
|
|
||||||
dense
|
|
||||||
:nodes="treeData"
|
|
||||||
node-key="keyId"
|
|
||||||
:filter="search"
|
|
||||||
:no-results-label="notFound"
|
|
||||||
:no-nodes-label="noData"
|
|
||||||
:filter-method="myFilterMethod"
|
|
||||||
v-model:expanded="expanded"
|
|
||||||
>
|
|
||||||
<template v-slot:header-organization="prop">
|
|
||||||
<div class="col">
|
|
||||||
<div
|
|
||||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
|
||||||
>
|
|
||||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{ prop.node.organizationName }}
|
|
||||||
</div>
|
|
||||||
<q-badge
|
|
||||||
v-if="prop.node.totalPositionVacant > 0"
|
|
||||||
rounded
|
|
||||||
color="red"
|
|
||||||
outline
|
|
||||||
:label="prop.node.totalPositionVacant"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</div>
|
|
||||||
<div class="col items-center q-px-xs q-pt-xs">
|
|
||||||
<div class="text-weight-medium text-grey-7">
|
|
||||||
{{ prop.node.governmentCode }}
|
|
||||||
{{ prop.node.organizationShortName }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-slot:header-person="prop">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
:active="selected == prop.node.keyId"
|
|
||||||
@click="selectedPosition(prop.node)"
|
|
||||||
:disable="
|
|
||||||
prop.node.name != null ||
|
|
||||||
checkPosition(prop.node.positionNumId) != -1
|
|
||||||
"
|
|
||||||
active-class="my-list-link text-primary text-weight-medium"
|
|
||||||
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
v-if="
|
|
||||||
prop.node.avatar == '' ||
|
|
||||||
prop.node.avatar ==
|
|
||||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
|
||||||
"
|
|
||||||
src="@/assets/avatar_user.jpg"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<img
|
|
||||||
v-else
|
|
||||||
:src="prop.node.avatar"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
|
||||||
<div
|
|
||||||
v-if="prop.node.name == null"
|
|
||||||
class="q-px-sm text-weight-medium text-red"
|
|
||||||
>
|
|
||||||
ว่าง
|
|
||||||
</div>
|
|
||||||
<!--=====หัวหน้า สีเขียว=====-->
|
|
||||||
<div v-else-if="prop.node.positionLeaderFlag">
|
|
||||||
<div
|
|
||||||
class="q-px-sm text-weight-medium text-primary"
|
|
||||||
>
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--=====ลูกน้อง สีปกติ=====-->
|
|
||||||
<div v-else>
|
|
||||||
<div class="q-px-sm text-weight-medium">
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionName }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionNum }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionLevel }}
|
|
||||||
</div>
|
|
||||||
<q-icon
|
|
||||||
v-if="prop.node.positionLeaderFlag"
|
|
||||||
class="q-mr-sm"
|
|
||||||
size="15px"
|
|
||||||
color="primary"
|
|
||||||
name="mdi-bookmark"
|
|
||||||
></q-icon>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</q-item>
|
|
||||||
</template>
|
|
||||||
</q-tree>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-5">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<div class="row col-12 q-col-gutter-xs">
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12"></div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="dataForm.containDate"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
:model-value="
|
|
||||||
date2Thai(new Date(dataForm.containDate))
|
|
||||||
"
|
|
||||||
:rules="[ (val: string) =>!!val ||`${'วันที่รายงานตัว'}`]"
|
|
||||||
:label="`${'วันที่รายงานตัว'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
style="color: var(--q-primary)"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
outlined
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="posNoOptions"
|
|
||||||
v-model="dataForm.posNoId"
|
|
||||||
:label="`${'ตำแหน่งเลขที่'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionOptions"
|
|
||||||
v-model="dataForm.positionId"
|
|
||||||
:label="`${'ตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
emit-value
|
|
||||||
:options="positionPathSideOptions"
|
|
||||||
v-model="dataForm.positionPathSideId"
|
|
||||||
:label="`${'ด้าน/สาขา'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionTypeOptions"
|
|
||||||
v-model="dataForm.positionTypeId"
|
|
||||||
:label="`${'ประเภทตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLineOptions"
|
|
||||||
v-model="dataForm.positionLineId"
|
|
||||||
:label="`${'สายงาน'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLevelOptions"
|
|
||||||
v-model="dataForm.positionLevelId"
|
|
||||||
:label="`${'ระดับตำแหน่ง'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`]"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
|
||||||
|
|
||||||
<q-separator />
|
|
||||||
<DialogFooter
|
|
||||||
:editvisible="true"
|
|
||||||
:validate="validateData"
|
|
||||||
:save="saveAppoint"
|
|
||||||
v-model:modalEdit="editDataStatus"
|
|
||||||
/>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
|
||||||
</q-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.q-tree__node-header {
|
|
||||||
padding: 0px;
|
|
||||||
margin-top: 0px;
|
|
||||||
border-radius: 4px;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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>
|
|
||||||
|
|
@ -1,406 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { onMounted, ref, reactive } from "vue";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
|
|
||||||
import type { DataProfile } from "@/modules/05_placement/interface/response/AppointMent";
|
|
||||||
import type { QForm } from "quasar";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
import CardProfile from "@/components/CardProfile.vue";
|
|
||||||
|
|
||||||
const modalPersonal = ref<boolean>(false);
|
|
||||||
const personId = ref<string>("");
|
|
||||||
const $q = useQuasar();
|
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
|
|
||||||
const dataProfile = ref<DataProfile>();
|
|
||||||
|
|
||||||
const myForm = ref<QForm | null>(null);
|
|
||||||
const edit = ref<boolean>(false);
|
|
||||||
const profileId = ref<string>("");
|
|
||||||
const organizationPositionOld = ref<string>("");
|
|
||||||
const positionTypeOld = ref<string>("");
|
|
||||||
const positionLevelOld = ref<string>("");
|
|
||||||
const posNo = ref<string>("");
|
|
||||||
const salary = ref<number>(0);
|
|
||||||
const educationOld = ref<string>("");
|
|
||||||
const reason = ref<string>("");
|
|
||||||
const date = ref<Date | null>(null);
|
|
||||||
const status = ref<string>("");
|
|
||||||
const avatar = ref<string>("");
|
|
||||||
|
|
||||||
const paramsId = route.params.id;
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
success,
|
|
||||||
dialogConfirm,
|
|
||||||
findOrgName,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const title = ref<ResponseTitle>({
|
|
||||||
fullname: "",
|
|
||||||
organizationPositionOld: "",
|
|
||||||
positionLevelOld: "",
|
|
||||||
positionTypeOld: "",
|
|
||||||
});
|
|
||||||
|
|
||||||
//เรียกข้อมูลตาม id
|
|
||||||
async function getData() {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(config.API.changePositionByIdProfile + `/${paramsId.toString()}`)
|
|
||||||
.then((res) => {
|
|
||||||
dataProfile.value = res.data.result as unknown as DataProfile;
|
|
||||||
const data = res.data.result;
|
|
||||||
|
|
||||||
profileId.value = data.profileId;
|
|
||||||
title.value.fullname = `${data.prefix}${data.firstName ?? "-"} ${
|
|
||||||
data.lastName ?? "-"
|
|
||||||
}`;
|
|
||||||
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
|
|
||||||
title.value.positionLevelOld = data.positionLevelOld ?? "-";
|
|
||||||
title.value.positionTypeOld = data.positionTypeOld ?? "-";
|
|
||||||
(status.value = data.status),
|
|
||||||
(educationOld.value = data.educationOld ?? "-");
|
|
||||||
organizationPositionOld.value = data.organizationPositionOld;
|
|
||||||
positionTypeOld.value = data.posTypeNameOld;
|
|
||||||
positionLevelOld.value = data.posLevelNameOld;
|
|
||||||
posNo.value = data.posMasterNo;
|
|
||||||
salary.value = data.amountOld ?? 0;
|
|
||||||
reason.value = data.reason;
|
|
||||||
date.value = data.dateCurrent;
|
|
||||||
avatar.value = data.avatar ?? "";
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// เเก้ไขข้อมูล
|
|
||||||
function putAppointment() {
|
|
||||||
dialogConfirm(
|
|
||||||
$q,
|
|
||||||
() => {
|
|
||||||
let data = {
|
|
||||||
educationOld: educationOld.value,
|
|
||||||
organizationPositionOld: organizationPositionOld.value,
|
|
||||||
positionTypeOld: positionTypeOld.value,
|
|
||||||
positionLevelOld: positionLevelOld.value,
|
|
||||||
posMasterNoOld: posNo.value,
|
|
||||||
amountOld: salary.value.toString().replace(/,/g, ""),
|
|
||||||
reason: reason.value,
|
|
||||||
dateCurrent: date.value,
|
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
http;
|
|
||||||
http
|
|
||||||
.put(
|
|
||||||
config.API.changePositionByIdProfile + `/${paramsId.toString()}`,
|
|
||||||
data
|
|
||||||
)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
getData();
|
|
||||||
edit.value = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
"ต้องการแก้ไขข้อมูลหรือไม่?",
|
|
||||||
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
|
|
||||||
);
|
|
||||||
}
|
|
||||||
const cancel = () => {
|
|
||||||
edit.value = false;
|
|
||||||
getData();
|
|
||||||
myForm.value?.resetValidation();
|
|
||||||
};
|
|
||||||
const getClass = (val: boolean) => {
|
|
||||||
return {
|
|
||||||
"full-width inputgreen cursor-pointer": val,
|
|
||||||
"full-width cursor-pointer": !val,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
function onclickViewinfo(id: string) {
|
|
||||||
modalPersonal.value = true;
|
|
||||||
personId.value = id;
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatemodalPersonal(modal: boolean) {
|
|
||||||
modalPersonal.value = modal;
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
await getData();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<div class="toptitle text-dark col-12 row items-center">
|
|
||||||
<q-btn
|
|
||||||
icon="mdi-arrow-left"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
flat
|
|
||||||
color="primary"
|
|
||||||
class="q-mr-sm"
|
|
||||||
@click="router.go(-1)"
|
|
||||||
/>
|
|
||||||
รายละเอียดผู้ที่ย้ายสับเปลี่ยนตำแหน่ง {{ title.fullname }}
|
|
||||||
</div>
|
|
||||||
<CardProfile :data="dataProfile as DataProfile" />
|
|
||||||
|
|
||||||
<q-card bordered class="row col-12 text-dark q-mt-sm">
|
|
||||||
<q-form
|
|
||||||
greedy
|
|
||||||
@submit.prevent
|
|
||||||
@validation-success="putAppointment"
|
|
||||||
ref="myForm"
|
|
||||||
class="full-width"
|
|
||||||
>
|
|
||||||
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
|
|
||||||
<div class="q-pl-sm text-weight-bold text-dark">
|
|
||||||
แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<div v-if="status !== 'DONE' && status !== 'REPORT'">
|
|
||||||
<div class="q-gutter-sm" v-if="!edit">
|
|
||||||
<q-btn
|
|
||||||
outline
|
|
||||||
color="primary"
|
|
||||||
dense
|
|
||||||
icon-right="mdi-file-edit-outline"
|
|
||||||
class="q-px-sm"
|
|
||||||
label="แก้ไข"
|
|
||||||
style="width: 80px"
|
|
||||||
@click="edit = !edit"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="q-gutter-sm" v-else>
|
|
||||||
<q-btn
|
|
||||||
outline
|
|
||||||
type="submit"
|
|
||||||
color="public"
|
|
||||||
dense
|
|
||||||
class="q-px-sm"
|
|
||||||
label="บันทึก"
|
|
||||||
style="width: 80px"
|
|
||||||
/>
|
|
||||||
<q-btn
|
|
||||||
outline
|
|
||||||
color="red"
|
|
||||||
dense
|
|
||||||
class="q-px-sm"
|
|
||||||
label="ยกเลิก"
|
|
||||||
style="width: 80px"
|
|
||||||
@click="cancel()"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12"><q-separator /></div>
|
|
||||||
|
|
||||||
<div class="row col-12 q-pa-md">
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="text-weight-bold">วุฒิการศึกษา</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="educationOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกวุฒิการศึกษา'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'วุฒิการศึกษา'}`"
|
|
||||||
type="text"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row col-12 q-pa-md">
|
|
||||||
<div class="col-12 row bg-white q-col-gutter-md">
|
|
||||||
<div class="col-xs-12 row q-pa-md items-center">
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="text-weight-bold">ตำแหน่ง/สังกัดเดิม</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="organizationPositionOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'ตำแหน่ง/สังกัด'}`"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-xs-6 col-sm-3 row">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="positionTypeOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'ตำแหน่งประเภท'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 row">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="positionLevelOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกระดับตำแหน่ง'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'ระดับตำแหน่ง'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 row">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="posNo"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'เลขที่'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 row">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
v-model="salary"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
:readonly="!edit"
|
|
||||||
hide-bottom-space
|
|
||||||
:borderless="!edit"
|
|
||||||
:label="`${'เงินเดือน'}`"
|
|
||||||
:rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
|
||||||
lazy-rules
|
|
||||||
mask="###,###,###,###"
|
|
||||||
reverse-fill-mask
|
|
||||||
:class="getClass(edit)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12"><q-separator /></div>
|
|
||||||
<div class="col-xs-6 col-sm-6 row items-center">
|
|
||||||
<div class="col-12">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
:readonly="!edit"
|
|
||||||
v-model="date"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
:borderless="!edit"
|
|
||||||
:readonly="!edit"
|
|
||||||
:model-value="date !== null ? date2Thai(date) : null"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'ดำรงตำแหน่งในระดับปัจจุบันเมื่อ'}`"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
:style="
|
|
||||||
edit
|
|
||||||
? 'color: var(--q-primary)'
|
|
||||||
: 'color: var(--q-grey)'
|
|
||||||
"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="reason"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'หมายเหตุ '}`"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
|
||||||
</template>
|
|
||||||
<style lang="scss" scope>
|
|
||||||
.q-img {
|
|
||||||
border-radius: 5px;
|
|
||||||
height: 70px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-top {
|
|
||||||
color: gray;
|
|
||||||
font-weight: 400;
|
|
||||||
padding-bottom: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-detail {
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,506 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, onMounted, watch } from "vue";
|
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
import type { OpType } from "@/modules/05_placement/interface/response/Main";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue";
|
|
||||||
import DialogEvalute from "@/modules/05_placement/components/ChangePosition/DialogChange.vue";
|
|
||||||
|
|
||||||
const router = useRouter();
|
|
||||||
const route = useRoute();
|
|
||||||
const id = ref<string>(route.params.id ? route.params.id.toString() : "");
|
|
||||||
|
|
||||||
const total = ref<number>(0);
|
|
||||||
const totalList = ref<number>(1);
|
|
||||||
const modalDialog = ref<boolean>(false);
|
|
||||||
const posType = ref<string>("");
|
|
||||||
const posLevel = ref<string>("");
|
|
||||||
const position = ref<string>("");
|
|
||||||
const typeModal = ref<string | null>(null);
|
|
||||||
const dataRows = ref<any[]>([]);
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const modal = ref<boolean>(false);
|
|
||||||
const storeFn = useTransferDataStore();
|
|
||||||
const { statusText } = storeFn;
|
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const {
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
success,
|
|
||||||
messageError,
|
|
||||||
date2Thai,
|
|
||||||
dialogRemove,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const rows = ref<any[]>([]);
|
|
||||||
const modalTree = ref<boolean>(false);
|
|
||||||
const personalId = ref<string>("");
|
|
||||||
const filterKeyword = ref<string>("");
|
|
||||||
const filterKeyword2 = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const optionsType = ref<OpType[]>([]);
|
|
||||||
const type = ref<string>("");
|
|
||||||
|
|
||||||
const visibleColumns = ref<string[]>([
|
|
||||||
"no",
|
|
||||||
"citizenId",
|
|
||||||
"fullname",
|
|
||||||
"organizationName",
|
|
||||||
"birthDate",
|
|
||||||
"lastUpdatedAt",
|
|
||||||
"status",
|
|
||||||
]);
|
|
||||||
const pagination = ref({
|
|
||||||
sortBy: "createdAt",
|
|
||||||
descending: true,
|
|
||||||
page: 1,
|
|
||||||
rowsPerPage: 10,
|
|
||||||
});
|
|
||||||
const columns = ref<QTableProps["columns"]>([
|
|
||||||
{
|
|
||||||
name: "no",
|
|
||||||
align: "left",
|
|
||||||
label: "ลำดับ",
|
|
||||||
sortable: false,
|
|
||||||
field: "no",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "citizenId",
|
|
||||||
align: "left",
|
|
||||||
label: "เลขประจำตัวประชาชน",
|
|
||||||
sortable: true,
|
|
||||||
field: "citizenId",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "fullname",
|
|
||||||
align: "left",
|
|
||||||
label: "ชื่อ-นามสกุล",
|
|
||||||
sortable: true,
|
|
||||||
field: "fullname",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "organizationName",
|
|
||||||
align: "left",
|
|
||||||
label: "หน่วยงานที่รับย้าย",
|
|
||||||
sortable: true,
|
|
||||||
field: "organizationName",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "birthDate",
|
|
||||||
align: "left",
|
|
||||||
label: "วัน/เดือน/ปี เกิด",
|
|
||||||
sortable: true,
|
|
||||||
field: "birthDate",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "lastUpdatedAt",
|
|
||||||
align: "left",
|
|
||||||
label: "วันที่ดำเนินการ",
|
|
||||||
sortable: true,
|
|
||||||
field: "lastUpdatedAt",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "status",
|
|
||||||
align: "left",
|
|
||||||
label: "สถานะ",
|
|
||||||
sortable: true,
|
|
||||||
field: "status",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
//รีเซ็ต input
|
|
||||||
const resetFilter = () => {
|
|
||||||
filterKeyword.value = "";
|
|
||||||
filterKeyword2.value = "";
|
|
||||||
filterRef.value.focus();
|
|
||||||
fecthLists();
|
|
||||||
};
|
|
||||||
|
|
||||||
//ปิด modal
|
|
||||||
const clickClose = () => {
|
|
||||||
modal.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
// เพิ่มรายชื่อเพื่อย้ายสับเปลี่ยนตำแหน่ง
|
|
||||||
const addPerson = () => {
|
|
||||||
modalDialog.value = true;
|
|
||||||
};
|
|
||||||
|
|
||||||
//ดึงข้อมูล API
|
|
||||||
const fecthLists = async () => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(
|
|
||||||
config.API.changePositionById +
|
|
||||||
`/${id.value}?page=${pagination.value.page}&pageSize=${pagination.value.rowsPerPage}&searchKeyword=${filterKeyword.value}`
|
|
||||||
)
|
|
||||||
.then(async (res) => {
|
|
||||||
let response = await res.data.result;
|
|
||||||
totalList.value = Math.ceil(
|
|
||||||
res.data.result.total / pagination.value.rowsPerPage
|
|
||||||
);
|
|
||||||
total.value = response.total;
|
|
||||||
rows.value = response.data;
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// เปิดโครงสร้าง
|
|
||||||
const openModalTree = (data: any, type: string) => {
|
|
||||||
personalId.value = data.id;
|
|
||||||
modalTree.value = true;
|
|
||||||
typeModal.value = type;
|
|
||||||
dataRows.value = data;
|
|
||||||
posType.value = data.posTypeOldId;
|
|
||||||
posLevel.value = data.posLevelOldId;
|
|
||||||
position.value = data.positionOld;
|
|
||||||
};
|
|
||||||
//เบข้อมูล
|
|
||||||
const clickDelete = (id: string) => {
|
|
||||||
dialogRemove($q, () => {
|
|
||||||
showLoader();
|
|
||||||
http
|
|
||||||
.delete(config.API.changePositionByIdProfile + `/${id}`)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "ลบข้อมูลสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
fecthLists();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// ไปหน้ารายละเอียด
|
|
||||||
const detailPage = (id: string) => {
|
|
||||||
router.push({
|
|
||||||
path: `/change-positions/personal/${id}`,
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
function onSave(data: any) {
|
|
||||||
showLoader();
|
|
||||||
http
|
|
||||||
.put(
|
|
||||||
config.API.changePositionByIdProfile + `/position/${personalId.value}`,
|
|
||||||
{
|
|
||||||
node: data.node,
|
|
||||||
nodeId: data.nodeId,
|
|
||||||
posmasterId: data.posmasterId,
|
|
||||||
posMasterNo: data.posMasterNo,
|
|
||||||
positionId: data.positionId,
|
|
||||||
orgRevisionId: data.orgRevisionId,
|
|
||||||
position: data.positionName,
|
|
||||||
positionField: data.positionField,
|
|
||||||
posTypeId: data.posTypeId,
|
|
||||||
posTypeName: data.posTypeName,
|
|
||||||
posLevelId: data.posLevelId,
|
|
||||||
posLevelName: data.posLevelName,
|
|
||||||
}
|
|
||||||
)
|
|
||||||
.then((res) => {
|
|
||||||
modalTree.value = false;
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
fecthLists();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatePagination(newPagination: any) {
|
|
||||||
pagination.value.page = 1;
|
|
||||||
pagination.value.rowsPerPage = newPagination.rowsPerPage;
|
|
||||||
}
|
|
||||||
|
|
||||||
watch(
|
|
||||||
() => pagination.value.rowsPerPage,
|
|
||||||
async () => {
|
|
||||||
await fecthLists();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
fecthLists();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="toptitle text-dark col-12 row items-center">
|
|
||||||
<q-btn
|
|
||||||
icon="mdi-arrow-left"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
flat
|
|
||||||
color="primary"
|
|
||||||
class="q-mr-sm"
|
|
||||||
@click="router.push(`/change-positions`)"
|
|
||||||
/>
|
|
||||||
|
|
||||||
รายชื่อผู้ที่ย้ายสับเปลี่ยนตำแหน่ง
|
|
||||||
</div>
|
|
||||||
<q-card flat bordered class="col-12 q-mt-sm">
|
|
||||||
<q-separator />
|
|
||||||
<div class="row q-pa-md">
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="row col-12">
|
|
||||||
<q-btn
|
|
||||||
@click="addPerson()"
|
|
||||||
size="14px"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
color="primary"
|
|
||||||
icon="add"
|
|
||||||
>
|
|
||||||
<q-tooltip>เพิ่มรายชื่อเพื่อย้ายสับเปลี่ยนตำแหน่ง</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
<q-input
|
|
||||||
class="col-xs-12 col-sm-3 col-md-2"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
v-model="filterKeyword"
|
|
||||||
ref="filterRef"
|
|
||||||
outlined
|
|
||||||
debounce="300"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
@keyup.enter="fecthLists()"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon v-if="filterKeyword == ''" name="search" />
|
|
||||||
<q-icon
|
|
||||||
v-if="filterKeyword !== ''"
|
|
||||||
name="clear"
|
|
||||||
class="cursor-pointer"
|
|
||||||
@click="resetFilter"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
|
|
||||||
<q-select
|
|
||||||
v-model="visibleColumns"
|
|
||||||
multiple
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
options-dense
|
|
||||||
:display-value="$q.lang.table.columns"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
:options="columns"
|
|
||||||
option-value="name"
|
|
||||||
options-cover
|
|
||||||
style="min-width: 150px"
|
|
||||||
class="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-12 q-pt-sm">
|
|
||||||
<d-table
|
|
||||||
:columns="columns"
|
|
||||||
:rows="rows"
|
|
||||||
row-key="id"
|
|
||||||
:visible-columns="visibleColumns"
|
|
||||||
:rows-per-page-options="[1, 25, 50, 100]"
|
|
||||||
@update:pagination="updatePagination"
|
|
||||||
>
|
|
||||||
<template v-slot:pagination="scope">
|
|
||||||
ทั้งหมด {{ total }} รายการ
|
|
||||||
<q-pagination
|
|
||||||
v-model="pagination.page"
|
|
||||||
active-color="primary"
|
|
||||||
color="dark"
|
|
||||||
:max="Number(totalList)"
|
|
||||||
size="sm"
|
|
||||||
boundary-links
|
|
||||||
direction-links
|
|
||||||
:max-pages="5"
|
|
||||||
@update:model-value="fecthLists"
|
|
||||||
></q-pagination>
|
|
||||||
</template>
|
|
||||||
<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-th auto-width />
|
|
||||||
</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="detailPage(props.row.id)"
|
|
||||||
>
|
|
||||||
<div v-if="col.name == 'no'">
|
|
||||||
{{
|
|
||||||
(pagination.page - 1) * pagination.rowsPerPage +
|
|
||||||
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 == 'birthDate'">
|
|
||||||
{{
|
|
||||||
props.row.birthDate ? date2Thai(props.row.birthDate) : "-"
|
|
||||||
}}
|
|
||||||
</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.rootShortName !== null
|
|
||||||
? `(${props.row.rootShortName})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div class="text-weight-light">
|
|
||||||
{{ props.row.root ? props.row.root : "" }}
|
|
||||||
{{
|
|
||||||
props.row.rootShortName
|
|
||||||
? `(${props.row.rootShortName}${props.row.posMasterNo})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else-if="col.name == 'lastUpdatedAt'">
|
|
||||||
{{
|
|
||||||
props.row.lastUpdatedAt
|
|
||||||
? date2Thai(props.row.lastUpdatedAt)
|
|
||||||
: "-"
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
{{ col.value ? col.value : "-" }}
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
<q-td auto-width>
|
|
||||||
<q-btn
|
|
||||||
v-if="
|
|
||||||
props.row.status !== 'REPORT' &&
|
|
||||||
props.row.status !== 'DONE'
|
|
||||||
"
|
|
||||||
icon="mdi-dots-vertical"
|
|
||||||
size="12px"
|
|
||||||
color="grey-7"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
>
|
|
||||||
<q-menu
|
|
||||||
transition-show="jump-down"
|
|
||||||
transition-hide="jump-up"
|
|
||||||
>
|
|
||||||
<q-list dense style="min-width: 250px">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
v-close-popup
|
|
||||||
@click="openModalTree(props.row, 'MOVE')"
|
|
||||||
>
|
|
||||||
<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.id)"
|
|
||||||
>
|
|
||||||
<q-item-section
|
|
||||||
style="min-width: 0px"
|
|
||||||
avatar
|
|
||||||
class="q-py-sm"
|
|
||||||
>
|
|
||||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
|
||||||
<q-icon color="red" size="xs" name="mdi-delete" />
|
|
||||||
</q-item-section>
|
|
||||||
<q-item-section>ลบ</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
</q-list>
|
|
||||||
</q-menu>
|
|
||||||
</q-btn>
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
</d-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card>
|
|
||||||
|
|
||||||
<DialogOrgSelect
|
|
||||||
:title="`เลือกหน่วยงานที่รับย้าย`"
|
|
||||||
v-model:modal="modalTree"
|
|
||||||
v-model:type="typeModal"
|
|
||||||
:posType="posType"
|
|
||||||
:posLevel="posLevel"
|
|
||||||
:position="position"
|
|
||||||
:dataRows="dataRows"
|
|
||||||
:onSubmit="onSave"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<DialogEvalute v-model:modal="modalDialog" :getData="fecthLists" />
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
|
||||||
|
|
@ -1,301 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, computed, watchEffect } from "vue";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import type { UserDataNew } from "@/modules/05_placement/interface/response/AppointMent";
|
|
||||||
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
const storeFn = useTransferDataStore();
|
|
||||||
const { statusText } = storeFn;
|
|
||||||
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const {
|
|
||||||
showLoader,
|
|
||||||
success,
|
|
||||||
messageError,
|
|
||||||
dialogConfirm,
|
|
||||||
hideLoader,
|
|
||||||
date2Thai,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const selected = ref<[]>([]);
|
|
||||||
const checkSelected = computed(() => {
|
|
||||||
if (selected.value.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
Modal: Boolean,
|
|
||||||
clickClose: Function,
|
|
||||||
fecthlistappointment: Function,
|
|
||||||
nextPage: Function,
|
|
||||||
optionsType: Array,
|
|
||||||
rows2: Array,
|
|
||||||
filterKeyword2: String,
|
|
||||||
type: String,
|
|
||||||
});
|
|
||||||
const visibleColumns2 = ref<string[]>(["no", "name", "createdAt"]);
|
|
||||||
const columns2 = ref<QTableProps["columns"]>([
|
|
||||||
{
|
|
||||||
name: "no",
|
|
||||||
align: "left",
|
|
||||||
label: "ลำดับ",
|
|
||||||
sortable: false,
|
|
||||||
field: "no",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "name",
|
|
||||||
align: "left",
|
|
||||||
label: "ชื่อรอบการย้ายสับเปลี่ยนตำแหน่ง",
|
|
||||||
sortable: true,
|
|
||||||
field: "name",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "createdAt",
|
|
||||||
align: "left",
|
|
||||||
label: "วันที่ดำเนินการ",
|
|
||||||
sortable: true,
|
|
||||||
field: "createdAt",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
const pageNext = (item: object) => {
|
|
||||||
props.nextPage?.(item);
|
|
||||||
};
|
|
||||||
const emit = defineEmits([
|
|
||||||
"update:filterKeyword2",
|
|
||||||
"update:type",
|
|
||||||
"update:selected",
|
|
||||||
]);
|
|
||||||
const updateInput = (value: any) => {
|
|
||||||
emit("update:filterKeyword2", value);
|
|
||||||
};
|
|
||||||
|
|
||||||
// const updateInputType = (value: string) => {
|
|
||||||
// emit("update:type", value);
|
|
||||||
// };
|
|
||||||
//รีเซ็ตค่าในช่องค้นหา
|
|
||||||
const Reset = () => {
|
|
||||||
emit("update:filterKeyword2", "");
|
|
||||||
};
|
|
||||||
|
|
||||||
//ส่งไปออกคำสั่ง
|
|
||||||
const sendToCommand = () => {
|
|
||||||
dialogConfirm($q, async () => {
|
|
||||||
let pId: string[] = [];
|
|
||||||
let Type = props.type as string;
|
|
||||||
selected.value.forEach((e: UserDataNew) => {
|
|
||||||
pId.push(e.id);
|
|
||||||
});
|
|
||||||
let data = {
|
|
||||||
id: pId,
|
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.apppointmentReport(Type), data)
|
|
||||||
.then((res) => {
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
props.fecthlistappointment?.();
|
|
||||||
selected.value = [];
|
|
||||||
props.clickClose?.();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
watchEffect(() => {
|
|
||||||
if (props.Modal === true) {
|
|
||||||
selected.value = [];
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-dialog v-model="props.Modal">
|
|
||||||
<q-card style="width: 1200px; max-width: 80vw">
|
|
||||||
<DialogHeader :tittle="'ส่งไปออกคำสั่ง'" :close="clickClose" />
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section>
|
|
||||||
<div class="row justify-between">
|
|
||||||
<div class="col-5">
|
|
||||||
<!-- <q-toolbar style="padding: 0">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
:model-value="type"
|
|
||||||
@update:model-value="updateInputType"
|
|
||||||
:options="optionsType"
|
|
||||||
label="คำสั่งแต่งตั่ง-เลื่อน-ย้าย"
|
|
||||||
style="width: 400px; max-width: auto"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
option-value="id"
|
|
||||||
/>
|
|
||||||
</q-toolbar> -->
|
|
||||||
</div>
|
|
||||||
<div class="col-5">
|
|
||||||
<q-toolbar style="padding: 0">
|
|
||||||
<q-input
|
|
||||||
borderless
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
debounce="300"
|
|
||||||
:model-value="filterKeyword2"
|
|
||||||
@update:model-value="updateInput"
|
|
||||||
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="Reset"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
<q-select
|
|
||||||
v-model="visibleColumns2"
|
|
||||||
multiple
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
options-dense
|
|
||||||
:display-value="$q.lang.table.columns"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
:options="columns2"
|
|
||||||
option-value="name"
|
|
||||||
options-cover
|
|
||||||
style="min-width: 150px"
|
|
||||||
class="gt-xs q-ml-sm"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<d-table
|
|
||||||
:columns="columns2"
|
|
||||||
:rows="rows2"
|
|
||||||
:filter="filterKeyword2"
|
|
||||||
row-key="profileId"
|
|
||||||
flat
|
|
||||||
:visible-columns="visibleColumns2"
|
|
||||||
selection="multiple"
|
|
||||||
v-model:selected="selected"
|
|
||||||
>
|
|
||||||
<template v-slot:header-selection="scope">
|
|
||||||
<q-checkbox
|
|
||||||
keep-color
|
|
||||||
color="primary"
|
|
||||||
dense
|
|
||||||
v-model="scope.selected"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template v-slot:body="props">
|
|
||||||
<q-tr :props="props" class="cursor-pointer">
|
|
||||||
<q-td auto-width>
|
|
||||||
<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"
|
|
||||||
@click="pageNext(props.row)"
|
|
||||||
>
|
|
||||||
<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.rootShortName !== null
|
|
||||||
? `(${props.row.rootShortName})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div class="text-weight-light">
|
|
||||||
{{
|
|
||||||
props.row.nodeName !== null ? props.row.nodeName : ""
|
|
||||||
}}
|
|
||||||
{{
|
|
||||||
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>
|
|
||||||
{{ col.value ? col.value : "-" }}
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
</d-table>
|
|
||||||
</q-card-section>
|
|
||||||
<q-separator />
|
|
||||||
<q-card-actions align="right">
|
|
||||||
<q-btn
|
|
||||||
label="ส่งไปออกคำสั่ง"
|
|
||||||
@click="sendToCommand"
|
|
||||||
color="public"
|
|
||||||
:disable="checkSelected"
|
|
||||||
>
|
|
||||||
<q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
</q-card-actions>
|
|
||||||
</q-card>
|
|
||||||
</q-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,6 +1,9 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watch } from "vue";
|
import { ref, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
|
@ -15,12 +18,6 @@ import type { officerType } from "@/modules/05_placement/interface/response/offi
|
||||||
*/
|
*/
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
|
|
||||||
/**
|
|
||||||
* importStore
|
|
||||||
*/
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* use
|
* use
|
||||||
*/
|
*/
|
||||||
|
|
@ -188,13 +185,7 @@ const visibleColumns2 = ref<string[]>([
|
||||||
"createdAt",
|
"createdAt",
|
||||||
"status",
|
"status",
|
||||||
]);
|
]);
|
||||||
const selected = ref<officerType[]>([]);
|
const selected = ref<officerType[]>([]); //รายการที่เลือก
|
||||||
|
|
||||||
const checkSelected = computed(() => {
|
|
||||||
if (selected.value.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* ยืนยันการส่งไปออกคำสั่ง
|
* ยืนยันการส่งไปออกคำสั่ง
|
||||||
|
|
@ -242,6 +233,11 @@ function Reset() {
|
||||||
emit("update:filterKeyword2", "");
|
emit("update:filterKeyword2", "");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* เมื่อ props.modal เป็น true
|
||||||
|
*
|
||||||
|
* กำหนดให้ selected เป็นค่าว่าง
|
||||||
|
*/
|
||||||
watch(
|
watch(
|
||||||
() => props.Modal,
|
() => props.Modal,
|
||||||
() => {
|
() => {
|
||||||
|
|
@ -354,7 +350,7 @@ watch(
|
||||||
<q-card-actions align="right">
|
<q-card-actions align="right">
|
||||||
<q-btn
|
<q-btn
|
||||||
label="ส่งไปออกคำสั่ง"
|
label="ส่งไปออกคำสั่ง"
|
||||||
:disable="checkSelected"
|
:disable="selected.length === 0"
|
||||||
color="public"
|
color="public"
|
||||||
@click="saveOrder"
|
@click="saveOrder"
|
||||||
><q-tooltip>ส่งไปออกคำสั่ง</q-tooltip></q-btn
|
><q-tooltip>ส่งไปออกคำสั่ง</q-tooltip></q-btn
|
||||||
|
|
@ -1,8 +1,10 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
import { useRoute, useRouter } from "vue-router";
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
|
@ -14,9 +16,6 @@ import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
|
||||||
/** importComponents*/
|
/** importComponents*/
|
||||||
import CardProfile from "@/components/CardProfile.vue";
|
import CardProfile from "@/components/CardProfile.vue";
|
||||||
|
|
||||||
/** impoerStore*/
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
|
|
||||||
/** use*/
|
/** use*/
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
|
@ -32,12 +31,11 @@ const {
|
||||||
findOrgName,
|
findOrgName,
|
||||||
} = mixin;
|
} = mixin;
|
||||||
|
|
||||||
const myForm = ref<QForm | null>(null);
|
|
||||||
const edit = ref<boolean>(false);
|
|
||||||
const dataId = route.params.id as string;
|
const dataId = route.params.id as string;
|
||||||
const dataProfile = ref<DataProfile>();
|
const myForm = ref<QForm | null>(null);
|
||||||
|
const edit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
const fullname = ref<string>("");
|
const dataProfile = ref<DataProfile>(); //ข้อมุลส่วนตัว
|
||||||
|
const fullname = ref<string>(""); //ชื่อ
|
||||||
|
|
||||||
/** form แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
|
/** form แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย*/
|
||||||
const organizationPositionOld = ref<string>(""); //ตำแหน่ง/สังกัดเดิม
|
const organizationPositionOld = ref<string>(""); //ตำแหน่ง/สังกัดเดิม
|
||||||
|
|
@ -50,9 +48,9 @@ const status = ref<string>("");
|
||||||
/**
|
/**
|
||||||
* fetch ข้อมูลรายละเอียด
|
* fetch ข้อมูลรายละเอียด
|
||||||
*/
|
*/
|
||||||
function getData() {
|
async function getData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
await http
|
||||||
.get(config.API.officerDetail(dataId))
|
.get(config.API.officerDetail(dataId))
|
||||||
.then((res: resHelpDetail) => {
|
.then((res: resHelpDetail) => {
|
||||||
const data = res.data.result;
|
const data = res.data.result;
|
||||||
|
|
@ -128,6 +126,9 @@ const getClass = (val: boolean) => {
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getData();
|
getData();
|
||||||
});
|
});
|
||||||
|
|
@ -1,34 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const props = defineProps({
|
|
||||||
title: String,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const close = async () => {
|
|
||||||
props.close();
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-toolbar class="q-py-md">
|
|
||||||
<q-toolbar-title class="header-text">{{ title }}</q-toolbar-title>
|
|
||||||
<q-btn
|
|
||||||
icon="close"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
@click="close"
|
|
||||||
style="color: #ff8080; background-color: #ffdede"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.header-text {
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 26px;
|
|
||||||
color: #35373c;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watchEffect, watch } from "vue";
|
import { ref, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
|
|
@ -41,12 +41,8 @@ const emit = defineEmits([
|
||||||
"update:selected",
|
"update:selected",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const selected = ref<any>([]);
|
const selected = ref<any[]>([]); //รายการทีี่เลือก
|
||||||
const checkSelected = computed(() => {
|
const OptionsTypeFn = ref<any[]>([]); //ตัวเลือกประเภทคำสั่ง
|
||||||
if (selected.value.length === 0 || props.type === "") {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Table
|
* Table
|
||||||
|
|
@ -183,21 +179,15 @@ function clickAddlist() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(
|
/**
|
||||||
() => props.Modal,
|
* filter OptionsType
|
||||||
() => {
|
* @param val คำค้นหา
|
||||||
if (props.Modal === true) {
|
* @param update Function
|
||||||
selected.value = [];
|
*/
|
||||||
}
|
function filterFnOptionsType(val: string, update: Function) {
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
// filter OptionsType
|
|
||||||
const OptionsTypeFn = ref<any>([]);
|
|
||||||
function filterFnOptionsType(val: string, update: any) {
|
|
||||||
if (val == "") {
|
if (val == "") {
|
||||||
update(() => {
|
update(() => {
|
||||||
OptionsTypeFn.value = props.optionsType;
|
OptionsTypeFn.value = props.optionsType || [];
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
update(() => {
|
update(() => {
|
||||||
|
|
@ -209,6 +199,20 @@ function filterFnOptionsType(val: string, update: any) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* เมื่อ props.modal เป็น true
|
||||||
|
*
|
||||||
|
* กำหนดให้ selected เป็นค่าว่าง
|
||||||
|
*/
|
||||||
|
watch(
|
||||||
|
() => props.Modal,
|
||||||
|
() => {
|
||||||
|
if (props.Modal === true) {
|
||||||
|
selected.value = [];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -334,7 +338,7 @@ function filterFnOptionsType(val: string, update: any) {
|
||||||
<q-btn
|
<q-btn
|
||||||
label="ส่งไปออกคำสั่ง"
|
label="ส่งไปออกคำสั่ง"
|
||||||
@click="clickAddlist"
|
@click="clickAddlist"
|
||||||
:disable="checkSelected"
|
:disable="selected.length === 0"
|
||||||
color="public"
|
color="public"
|
||||||
>
|
>
|
||||||
<q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
|
<q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
|
||||||
|
|
@ -1,11 +1,14 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
import { useRoute, useRouter } from "vue-router";
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
|
import { tokenParsed } from "@/plugins/auth";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import { tokenParsed } from "@/plugins/auth";
|
|
||||||
/**
|
/**
|
||||||
* impotyType
|
* impotyType
|
||||||
*/
|
*/
|
||||||
|
|
@ -16,15 +19,11 @@ import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
|
||||||
/** importComponents*/
|
/** importComponents*/
|
||||||
import CardProfile from "@/components/CardProfile.vue";
|
import CardProfile from "@/components/CardProfile.vue";
|
||||||
|
|
||||||
/** importStore*/
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
|
|
||||||
/** use*/
|
/** use*/
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const mixin = useCounterMixin();
|
const mixin = useCounterMixin();
|
||||||
const paramsId = route.params.id;
|
|
||||||
const {
|
const {
|
||||||
messageError,
|
messageError,
|
||||||
showLoader,
|
showLoader,
|
||||||
|
|
@ -35,29 +34,30 @@ const {
|
||||||
success,
|
success,
|
||||||
} = mixin;
|
} = mixin;
|
||||||
|
|
||||||
|
const paramsId = route.params.id;
|
||||||
const myForm = ref<QForm | null>(null);
|
const myForm = ref<QForm | null>(null);
|
||||||
const roleAdmin = ref<boolean>(false);
|
const roleAdmin = ref<boolean>(false);
|
||||||
const dataProfile = ref<DataProfile>();
|
const dataProfile = ref<DataProfile>(); //ข้อมุลส่วนตัว
|
||||||
const fullName = ref<string>("");
|
|
||||||
const edit = ref<boolean>(false);
|
const edit = ref<boolean>(false);
|
||||||
const status = ref<string>("");
|
const status = ref<string>("");
|
||||||
|
const fullName = ref<string>("");
|
||||||
|
|
||||||
const educationOld = ref<string>("");
|
const educationOld = ref<string>(""); //วุฒิ/สาขา
|
||||||
const organizationPositionOld = ref<string>("");
|
const organizationPositionOld = ref<string>(""); //ตำแหน่ง/สังกัด
|
||||||
const positionTypeOld = ref<string>("");
|
const positionTypeOld = ref<string>(""); //ประเภทตำแหน่ง
|
||||||
const positionLevelOld = ref<string>("");
|
const positionLevelOld = ref<string>(""); //ระดับตำแหน่ง
|
||||||
const posNo = ref<string>("");
|
const posNo = ref<string>(""); //เลขที่
|
||||||
const salary = ref<number>(0);
|
const salary = ref<number>(0); //เงินเดือน
|
||||||
const date = ref<Date | null>(null);
|
const date = ref<Date | null>(null); //ตั้งแต่วัน
|
||||||
const militaryDate = ref<Date | null>(null);
|
const militaryDate = ref<Date | null>(null); //พ้นราชการทหารเมื่อ
|
||||||
const reason = ref<string>("");
|
const reason = ref<string>(""); //หมายเหตุ
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* fetch รายละเอียดรายการอื่นๆ
|
* fetch รายละเอียดรายการอื่นๆ
|
||||||
*/
|
*/
|
||||||
function fetchData() {
|
async function fetchData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
await http
|
||||||
.get(config.API.otherByid(paramsId.toString()))
|
.get(config.API.otherByid(paramsId.toString()))
|
||||||
.then((res: resApiData) => {
|
.then((res: resApiData) => {
|
||||||
const data = res.data.result;
|
const data = res.data.result;
|
||||||
|
|
@ -1,783 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useQuasar, QForm } from "quasar";
|
|
||||||
import { onMounted, reactive, ref, watch } from "vue";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const { date2Thai, hideLoader, messageError, showLoader, success } = mixin; //ฟังก์ชันกลางที่เรียกใช้
|
|
||||||
|
|
||||||
const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
|
|
||||||
const noData = ref<string>("ไม่พบข้อมูลผังโครงสร้าง");
|
|
||||||
|
|
||||||
const checkValidate = ref<boolean>(false);
|
|
||||||
const myFormPosition = ref<any>();
|
|
||||||
const selected = ref<string>("");
|
|
||||||
const selectedFile = ref<string>("");
|
|
||||||
const dataRespone = ref<any>();
|
|
||||||
|
|
||||||
// Set form field
|
|
||||||
let dataForm = reactive({
|
|
||||||
personalId: "",
|
|
||||||
containDate: new Date(),
|
|
||||||
posNoId: "",
|
|
||||||
positionId: "",
|
|
||||||
positionLevelId: "",
|
|
||||||
positionLineId: "",
|
|
||||||
positionPathSideId: "",
|
|
||||||
positionTypeId: "",
|
|
||||||
// salaryAmount: null,
|
|
||||||
// mouthSalaryAmount: null,
|
|
||||||
// positionSalaryAmount: null,
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
await fetchPublishFile();
|
|
||||||
await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
});
|
|
||||||
const fetchPublishFile = async () => {
|
|
||||||
await http
|
|
||||||
.get(config.API.getPublishFileHistory)
|
|
||||||
.then((res) => {
|
|
||||||
let data = res.data.result;
|
|
||||||
selectedFile.value = data[0].fileName;
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// โหลดข้อมูลโครงสร้างจาก json
|
|
||||||
const treeData = ref<Array<any>>([]);
|
|
||||||
const loadTreeData = async () => {
|
|
||||||
expanded.value = [];
|
|
||||||
await http
|
|
||||||
.get(`${config.s3ClusterUrl}${selectedFile.value}`)
|
|
||||||
.then((res: any) => {
|
|
||||||
treeData.value = res.data;
|
|
||||||
dataRespone.value = res.data;
|
|
||||||
|
|
||||||
// Filter objects with "name" null
|
|
||||||
const filteredData = res.data.filter(filterByPersonIdNull);
|
|
||||||
treeData.value = filteredData;
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
function filterByPersonIdNull(obj: any) {
|
|
||||||
if (obj.name === null && obj.isCondition != true) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if (obj.children && obj.children.length > 0) {
|
|
||||||
obj.children = obj.children.filter(filterByPersonIdNull);
|
|
||||||
return obj.children.length > 0;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// โหลด position
|
|
||||||
const placementPosition = ref<any>([]);
|
|
||||||
const fetchplacementPosition = async () => {
|
|
||||||
await http
|
|
||||||
.get(config.API.placementPosition())
|
|
||||||
.then((res: any) => {
|
|
||||||
placementPosition.value = res.data.result;
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const search = ref<string>("");
|
|
||||||
//reset Tree Filter
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
// const resetFilter = () => {
|
|
||||||
// search.value = "";
|
|
||||||
// filterRef.value.focus();
|
|
||||||
// };
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
personalId: String,
|
|
||||||
modal: Boolean,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("close modal"),
|
|
||||||
},
|
|
||||||
personal: Object,
|
|
||||||
});
|
|
||||||
|
|
||||||
const myFilterMethod = (node: any, filter: string) => {
|
|
||||||
const filt = filter;
|
|
||||||
|
|
||||||
return (
|
|
||||||
// ((node.name && node.name == null) || !node.name) &&
|
|
||||||
(node.name && node.name.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationName && node.organizationName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
|
|
||||||
(node.positionName && node.positionName.indexOf(filt) > -1) ||
|
|
||||||
(node.governmentCode &&
|
|
||||||
node.governmentCode.toString().indexOf(filt) > -1) ||
|
|
||||||
(node.agency && node.agency.indexOf(filt) > -1) ||
|
|
||||||
(node.government && node.government.indexOf(filt) > -1) ||
|
|
||||||
(node.department && node.department.indexOf(filt) > -1) ||
|
|
||||||
(node.pile && node.pile.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationShortName &&
|
|
||||||
node.organizationShortName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionSideName && node.positionSideName.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePositionSide &&
|
|
||||||
node.executivePositionSide.indexOf(filt) > -1) ||
|
|
||||||
(node.positionLevel && node.positionLevel.indexOf(filt) > -1)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const validateData = async () => {
|
|
||||||
checkValidate.value = true;
|
|
||||||
await myFormPosition.value.validate().then((result: boolean) => {
|
|
||||||
if (result == false) {
|
|
||||||
checkValidate.value = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const id = ref<string>("");
|
|
||||||
const saveAppoint = async () => {
|
|
||||||
myFormPosition.value.validate().then(async (result: boolean) => {
|
|
||||||
if (props.personalId !== undefined) {
|
|
||||||
id.value = props.personalId.toString();
|
|
||||||
}
|
|
||||||
if (result) {
|
|
||||||
const dataAppoint = await {
|
|
||||||
// personalId: props.personalId,
|
|
||||||
recruitDate: dataForm.containDate,
|
|
||||||
posNoId: dataForm.posNoId,
|
|
||||||
positionId: dataForm.positionId,
|
|
||||||
positionLevelId: dataForm.positionLevelId,
|
|
||||||
positionLineId: dataForm.positionLineId,
|
|
||||||
positionPathSideId: dataForm.positionPathSideId,
|
|
||||||
positionTypeId: dataForm.positionTypeId,
|
|
||||||
// salaryAmount: dataForm.salaryAmount,
|
|
||||||
// mouthSalaryAmount: dataForm.mouthSalaryAmount,
|
|
||||||
// positionSalaryAmount: dataForm.positionSalaryAmount,
|
|
||||||
};
|
|
||||||
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.otherPosition(id.value), dataAppoint)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await closeAndClear();
|
|
||||||
// await resetFilter();
|
|
||||||
await fetchPublishFile();
|
|
||||||
await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const editDataStatus = ref<boolean>(false);
|
|
||||||
const clickEditRow = () => {
|
|
||||||
editDataStatus.value = true;
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeModal = () => {
|
|
||||||
if (editDataStatus.value == true) {
|
|
||||||
$q.dialog({
|
|
||||||
title: `ข้อมูลมีการแก้ไข`,
|
|
||||||
message: `ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?`,
|
|
||||||
cancel: "ยกเลิก",
|
|
||||||
ok: "ยืนยัน",
|
|
||||||
persistent: true,
|
|
||||||
}).onOk(() => {
|
|
||||||
editDataStatus.value = false;
|
|
||||||
closeAndClear();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
closeAndClear();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeAndClear = async () => {
|
|
||||||
await props.close();
|
|
||||||
editDataStatus.value = false;
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.personalId = "";
|
|
||||||
dataForm.containDate = new Date();
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
// dataForm.salaryAmount = null;
|
|
||||||
// dataForm.mouthSalaryAmount = null;
|
|
||||||
// dataForm.positionSalaryAmount = null;
|
|
||||||
};
|
|
||||||
// ตำแหน่งเลขที่
|
|
||||||
const posNoOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ตำแหน่ง
|
|
||||||
const positionOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ด้าน/สาขา
|
|
||||||
const positionPathSideOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ประเภทตำแหน่ง
|
|
||||||
const positionTypeOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// สายงาน
|
|
||||||
const positionLineOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ระดับ
|
|
||||||
const positionLevelOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
const selectedPosition = async (data: any) => {
|
|
||||||
if (data.name == null && selected.value != data.keyId) {
|
|
||||||
editDataStatus.value = true;
|
|
||||||
selected.value = data.keyId;
|
|
||||||
|
|
||||||
// posNo Options
|
|
||||||
posNoOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionNum,
|
|
||||||
value: data.positionNumId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.posNoId = data.positionNumId;
|
|
||||||
|
|
||||||
// position Options
|
|
||||||
positionOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionName,
|
|
||||||
value: data.positionNameId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionId = data.positionNameId;
|
|
||||||
|
|
||||||
// positionPathSide Options
|
|
||||||
let positionPathSideArr: any = [];
|
|
||||||
if (data.positionSideNameObj && data.positionSideNameObj != null) {
|
|
||||||
data.positionSideNameObj.map((x: any) => {
|
|
||||||
positionPathSideArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionPathSideOptions.value = positionPathSideArr;
|
|
||||||
dataForm.positionPathSideId =
|
|
||||||
positionPathSideArr.length > 1 || positionPathSideArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionPathSideArr[0].value;
|
|
||||||
}
|
|
||||||
|
|
||||||
// positionType Options
|
|
||||||
positionTypeOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionType,
|
|
||||||
value: data.positionTypeId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionTypeId = data.positionTypeId;
|
|
||||||
|
|
||||||
// positionLine Options
|
|
||||||
positionLineOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionLine,
|
|
||||||
value: data.positionLineId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionLineId = data.positionLineId;
|
|
||||||
|
|
||||||
// positionLevel Options
|
|
||||||
let positionLevelsArr: any = [];
|
|
||||||
if (data.positionLevelObj != null) {
|
|
||||||
data.positionLevelObj.map((x: any) => {
|
|
||||||
positionLevelsArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionLevelOptions.value = positionLevelsArr;
|
|
||||||
dataForm.positionLevelId =
|
|
||||||
positionLevelsArr.length > 1 || positionLevelsArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionLevelsArr[0].value;
|
|
||||||
dataForm.positionLevelId = data.positionLevelObj[0].Id;
|
|
||||||
}
|
|
||||||
} else if (selected.value == data.keyId) {
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const checkPosition = (val: string) => {
|
|
||||||
const num = placementPosition.value.findIndex((e: string) => e === val);
|
|
||||||
return num;
|
|
||||||
};
|
|
||||||
const personal = ref<any>();
|
|
||||||
const expanded = ref<string[]>([]);
|
|
||||||
|
|
||||||
watch(props, () => {
|
|
||||||
expanded.value = [];
|
|
||||||
const dataPersonal = props.personal;
|
|
||||||
|
|
||||||
if (dataPersonal) {
|
|
||||||
dataPersonal.map((data: any) => {
|
|
||||||
personal.value = data;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (personal.value) {
|
|
||||||
let findData: any = null;
|
|
||||||
dataRespone.value.map((x: any) => {
|
|
||||||
findData = findByPerson(x);
|
|
||||||
|
|
||||||
if (findData != null) {
|
|
||||||
selectedPosition(findData);
|
|
||||||
for (let i = 3; i <= findData.keyId.length; i += 2) {
|
|
||||||
expanded.value.push(findData.keyId.slice(0, i));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// loadTreeData();
|
|
||||||
// selectedPosition(findData.children.children.children)
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function findByPerson(element: any): any {
|
|
||||||
if (
|
|
||||||
element.positionNumId &&
|
|
||||||
element.positionLineId === personal.value.positionLineId &&
|
|
||||||
element.positionTypeId === personal.value.positionTypeId &&
|
|
||||||
element.positionNumId === personal.value.posNoId &&
|
|
||||||
(element.positionLevelObj === null ||
|
|
||||||
element.positionLevelObj[0].Id === personal.value.positionLevelId)
|
|
||||||
) {
|
|
||||||
return element;
|
|
||||||
} else if (element.children) {
|
|
||||||
var i;
|
|
||||||
var result = null;
|
|
||||||
for (i = 0; result == null && i < element.children.length; i++) {
|
|
||||||
result = findByPerson(element.children[i]);
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-dialog v-model="props.modal" persistent>
|
|
||||||
<q-card style="width: 900px; max-width: 80vw">
|
|
||||||
<q-form ref="myFormPosition">
|
|
||||||
<DialogHeader :tittle="'เลือกหน่วยงานที่รับโอน'" :close="closeModal" />
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section class="q-pa-sm bg-grey-1">
|
|
||||||
<div class="row col-12 q-col-gutter-sm">
|
|
||||||
<div class="col-xs-12 col-sm-7 row">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
ref="filterRef"
|
|
||||||
v-model="search"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
class="q-mb-sm"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon name="mdi-magnify" />
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
<div class="q-pa-sm q-gutter-sm">
|
|
||||||
<q-tree
|
|
||||||
no-transition
|
|
||||||
dense
|
|
||||||
:nodes="treeData"
|
|
||||||
node-key="keyId"
|
|
||||||
:filter="search"
|
|
||||||
:no-results-label="notFound"
|
|
||||||
:no-nodes-label="noData"
|
|
||||||
:filter-method="myFilterMethod"
|
|
||||||
v-model:expanded="expanded"
|
|
||||||
>
|
|
||||||
<template v-slot:header-organization="prop">
|
|
||||||
<div class="col">
|
|
||||||
<div
|
|
||||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
|
||||||
>
|
|
||||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{ prop.node.organizationName }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!--แสดง Total Count PositionNum-->
|
|
||||||
<!-- <q-badge rounded color="grey-2" text-color="dark"
|
|
||||||
:label="prop.node.totalPositionCount" /> -->
|
|
||||||
<q-badge
|
|
||||||
v-if="prop.node.totalPositionVacant > 0"
|
|
||||||
rounded
|
|
||||||
color="red"
|
|
||||||
outline
|
|
||||||
:label="prop.node.totalPositionVacant"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</div>
|
|
||||||
<div class="col items-center q-px-xs q-pt-xs">
|
|
||||||
<div class="text-weight-medium text-grey-7">
|
|
||||||
{{ prop.node.governmentCode }}
|
|
||||||
{{ prop.node.organizationShortName }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-slot:header-person="prop">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
:active="selected == prop.node.keyId"
|
|
||||||
@click="selectedPosition(prop.node)"
|
|
||||||
:disable="
|
|
||||||
prop.node.name != null ||
|
|
||||||
checkPosition(prop.node.positionNumId) != -1
|
|
||||||
"
|
|
||||||
active-class="my-list-link text-primary text-weight-medium"
|
|
||||||
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
v-if="
|
|
||||||
prop.node.avatar == '' ||
|
|
||||||
prop.node.avatar ==
|
|
||||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
|
||||||
"
|
|
||||||
src="@/assets/avatar_user.jpg"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<img
|
|
||||||
v-else
|
|
||||||
:src="prop.node.avatar"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
|
||||||
<div
|
|
||||||
v-if="prop.node.name == null"
|
|
||||||
class="q-px-sm text-weight-medium text-red"
|
|
||||||
>
|
|
||||||
ว่าง
|
|
||||||
</div>
|
|
||||||
<!--=====หัวหน้า สีเขียว=====-->
|
|
||||||
<div v-else-if="prop.node.positionLeaderFlag">
|
|
||||||
<div
|
|
||||||
class="q-px-sm text-weight-medium text-primary"
|
|
||||||
>
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--=====ลูกน้อง สีปกติ=====-->
|
|
||||||
<div v-else>
|
|
||||||
<div class="q-px-sm text-weight-medium">
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionName }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionNum }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionLevel }}
|
|
||||||
</div>
|
|
||||||
<q-icon
|
|
||||||
v-if="prop.node.positionLeaderFlag"
|
|
||||||
class="q-mr-sm"
|
|
||||||
size="15px"
|
|
||||||
color="primary"
|
|
||||||
name="mdi-bookmark"
|
|
||||||
></q-icon>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</q-item>
|
|
||||||
</template>
|
|
||||||
</q-tree>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-5">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<div class="row col-12 q-col-gutter-xs">
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12"></div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="dataForm.containDate"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
:model-value="
|
|
||||||
date2Thai(new Date(dataForm.containDate))
|
|
||||||
"
|
|
||||||
:rules="[ (val: string) =>!!val ||`${'วันที่รายงานตัว'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'วันที่รายงานตัว'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
style="color: var(--q-primary)"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
outlined
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="posNoOptions"
|
|
||||||
v-model="dataForm.posNoId"
|
|
||||||
:label="`${'ตำแหน่งเลขที่'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionOptions"
|
|
||||||
v-model="dataForm.positionId"
|
|
||||||
:label="`${'ตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionPathSideOptions"
|
|
||||||
v-model="dataForm.positionPathSideId"
|
|
||||||
:label="`${'ด้าน/สาขา'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionTypeOptions"
|
|
||||||
v-model="dataForm.positionTypeId"
|
|
||||||
:label="`${'ประเภทตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLineOptions"
|
|
||||||
v-model="dataForm.positionLineId"
|
|
||||||
:label="`${'สายงาน'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLevelOptions"
|
|
||||||
v-model="dataForm.positionLevelId"
|
|
||||||
:label="`${'ระดับ'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับ'}`]"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<!-- <div class="col-sx-12 col-sm-12 col-md-12">
|
|
||||||
<q-separator inset size="2px" class="q-my-md" />
|
|
||||||
</div> -->
|
|
||||||
<!-- <div class="col-xs-6 col-sm-6 col-md-6">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="dataForm.salaryAmount"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
|
||||||
:label="`${'เงินเดือน'}`"
|
|
||||||
@update:modelValue="clickEditRow"
|
|
||||||
type="number"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<!-- <div class="col-xs-6 col-sm-6 col-md-6">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="dataForm.positionSalaryAmount"
|
|
||||||
:rules="[
|
|
||||||
(val) => !!val || `${'กรุณากรอกเงินประจำตำแหน่ง'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'เงินประจำตำแหน่ง'}`"
|
|
||||||
@update:modelValue="clickEditRow"
|
|
||||||
type="number"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<!-- <div class="col-xs-6 col-sm-6 col-md-6">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="dataForm.mouthSalaryAmount"
|
|
||||||
:rules="[
|
|
||||||
(val) =>
|
|
||||||
!!val || `${'กรุณากรอกเงินค่าตอบแทนรายเดือน'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'เงินค่าตอบแทนรายเดือน'}`"
|
|
||||||
@update:modelValue="clickEditRow"
|
|
||||||
type="number"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
|
||||||
|
|
||||||
<q-separator />
|
|
||||||
<DialogFooter
|
|
||||||
:editvisible="true"
|
|
||||||
:validate="validateData"
|
|
||||||
:save="saveAppoint"
|
|
||||||
v-model:modalEdit="editDataStatus"
|
|
||||||
/>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
|
||||||
</q-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.q-tree__node-header {
|
|
||||||
padding: 0px;
|
|
||||||
margin-top: 0px;
|
|
||||||
border-radius: 4px;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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);
|
|
||||||
/* box-shadow: 1px 1px 7px 1px rgba(41, 95, 255, 0.15) !important; */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,30 +1,20 @@
|
||||||
<!-- หน้า รายละเอียดของ -->
|
<!-- หน้า รายละเอียดของ -->
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, reactive, ref } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { useDataStore } from "@/stores/data";
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { useRoute, useRouter } from "vue-router";
|
||||||
|
import { useDataStore } from "@/stores/data";
|
||||||
|
import { usePersonalDataStore } from "@/modules/05_placement/storePersona";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
import { usePersonalDataStore } from "@/modules/05_placement/storePersona";
|
|
||||||
|
|
||||||
import Informationvue from "@/modules/05_placement/components/PersonalDetail/Information/Information.vue";
|
|
||||||
import Addressvue from "@/modules/05_placement/components/PersonalDetail/Information/Address.vue";
|
|
||||||
import EducationVue from "@/modules/05_placement/components/PersonalDetail/Education.vue";
|
|
||||||
import Certicate from "@/modules/05_placement/components/PersonalDetail/Information/Certicate.vue";
|
|
||||||
import ExamResult from "@/modules/05_placement/components/PersonalDetail/ExamResult.vue";
|
|
||||||
import Qualification from "@/modules/05_placement/components/PersonalDetail/Qualification.vue";
|
|
||||||
import Familyvue from "@/modules/05_placement/components/PersonalDetail/Information/Family.vue";
|
|
||||||
import Document from "@/modules/05_placement/components/PersonalDetail/Information/Document.vue";
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
AddressDataDefualt,
|
AddressDataDefualt,
|
||||||
FamilyDataDefualt,
|
FamilyDataDefualt,
|
||||||
} from "@/modules/05_placement/interface/index/Main";
|
} from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
Property,
|
Property,
|
||||||
PointExam,
|
PointExam,
|
||||||
|
|
@ -35,25 +25,32 @@ import type {
|
||||||
optionData,
|
optionData,
|
||||||
InformationOps,
|
InformationOps,
|
||||||
} from "@/modules/05_placement/interface/index/Main";
|
} from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
import type { Information } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
import type { Information } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
|
|
||||||
const $q = useQuasar(); // show dialog
|
import Informationvue from "@/modules/05_placement/components/PersonalDetail/Information/Information.vue";
|
||||||
|
import Addressvue from "@/modules/05_placement/components/PersonalDetail/Information/Address.vue";
|
||||||
|
import Familyvue from "@/modules/05_placement/components/PersonalDetail/Information/Family.vue";
|
||||||
|
import Certicate from "@/modules/05_placement/components/PersonalDetail/Information/Certicate.vue";
|
||||||
|
import EducationVue from "@/modules/05_placement/components/PersonalDetail/Information/Education.vue";
|
||||||
|
import ExamResult from "@/modules/05_placement/components/PersonalDetail/Information/ExamResult.vue";
|
||||||
|
import Qualification from "@/modules/05_placement/components/PersonalDetail/Information/Qualification.vue";
|
||||||
|
import Document from "@/modules/05_placement/components/PersonalDetail/Information/Document.vue";
|
||||||
|
|
||||||
|
const $q = useQuasar();
|
||||||
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const store = useDataStore();
|
const store = useDataStore();
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
const mixin = useCounterMixin();
|
||||||
const storePersonal = usePersonalDataStore();
|
const storePersonal = usePersonalDataStore();
|
||||||
const { showLoader, hideLoader, messageError } = mixin;
|
const { showLoader, hideLoader, messageError } = mixin;
|
||||||
const { changeTab } = store;
|
const { changeTab } = store;
|
||||||
const statusEdit = ref<boolean>(false);
|
|
||||||
const profileType = ref<string>("");
|
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const examId = ref<string>(
|
const examId = ref<string>(
|
||||||
route.params.personalId ? route.params.personalId.toString() : ""
|
route.params.personalId ? route.params.personalId.toString() : ""
|
||||||
);
|
);
|
||||||
|
const statusEdit = ref<boolean>(false); //การแก้ไข
|
||||||
|
const profileType = ref<string>(""); //ประเภทของบุคคล
|
||||||
|
//ผลการสอบ
|
||||||
const ExamDataDefualt: PointExam = {
|
const ExamDataDefualt: PointExam = {
|
||||||
pointA: 0,
|
pointA: 0,
|
||||||
pointB: 0,
|
pointB: 0,
|
||||||
|
|
@ -67,7 +64,7 @@ const ExamDataDefualt: PointExam = {
|
||||||
examRound: 0,
|
examRound: 0,
|
||||||
pass: "",
|
pass: "",
|
||||||
};
|
};
|
||||||
|
//ข้อมูลส่วนตัว
|
||||||
const InformationDataDefualt: Information = {
|
const InformationDataDefualt: Information = {
|
||||||
idCard: "",
|
idCard: "",
|
||||||
prefix: "",
|
prefix: "",
|
||||||
|
|
@ -89,29 +86,23 @@ const InformationDataDefualt: Information = {
|
||||||
religion: "",
|
religion: "",
|
||||||
religionId: "",
|
religionId: "",
|
||||||
};
|
};
|
||||||
|
//ชื่อ
|
||||||
const personalData = ref({
|
const personalData = ref({
|
||||||
id: "",
|
id: "",
|
||||||
fullName: "",
|
fullName: "",
|
||||||
});
|
});
|
||||||
const QualificationData = ref<Property[]>([]);
|
const QualificationData = ref<Property[]>([]);
|
||||||
const ExamData = ref<PointExam>(ExamDataDefualt);
|
const ExamData = ref<PointExam>(ExamDataDefualt); //ข้อมูลผลการสอบ
|
||||||
const InformationData = ref<Information>(InformationDataDefualt);
|
const InformationData = ref<Information>(InformationDataDefualt); //ข้อมูลส่วนตัว
|
||||||
const EducationData = ref<Education[]>([]);
|
const EducationData = ref<Education[]>([]); //ข้อมูลประวัติการศึกษา
|
||||||
const FamilyData = ref<Family>(FamilyDataDefualt);
|
const FamilyData = ref<Family>(FamilyDataDefualt); //ข้อมูลครอบครัว
|
||||||
const AddressData = ref<Address>(AddressDataDefualt);
|
const AddressData = ref<Address>(AddressDataDefualt); //ข้อมูลที่อยู่
|
||||||
const CertificateData = ref<Certificate[]>([]);
|
const CertificateData = ref<Certificate[]>([]); //ข้อมูลใบอนุญาตประกอบอาชีพ
|
||||||
|
//สิทธิการแก้ไข
|
||||||
const isEdit = ref<boolean>(
|
const isEdit = ref<boolean>(
|
||||||
checkPermission(route)?.attrIsUpdate ? true : false
|
checkPermission(route)?.attrIsUpdate ? true : false
|
||||||
);
|
);
|
||||||
|
|
||||||
const guidCheck = (id: string) => {
|
|
||||||
if (id == "00000000-0000-0000-0000-000000000000") {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
return id;
|
|
||||||
};
|
|
||||||
|
|
||||||
const Ops = ref<InformationOps>({
|
const Ops = ref<InformationOps>({
|
||||||
prefixOps: [],
|
prefixOps: [],
|
||||||
genderOps: [],
|
genderOps: [],
|
||||||
|
|
@ -144,16 +135,19 @@ const OpsFilter = ref<InformationOps>({
|
||||||
],
|
],
|
||||||
});
|
});
|
||||||
|
|
||||||
const fetchData = async () => {
|
/**
|
||||||
|
* ฟังก์ชันดึงข้อมูลรายละเอียดทั้งหมด
|
||||||
|
*/
|
||||||
|
async function fetchData() {
|
||||||
|
showLoader();
|
||||||
storePersonal.loading = false;
|
storePersonal.loading = false;
|
||||||
await http
|
await http
|
||||||
.get(config.API.placementPersonalId(examId.value))
|
.get(config.API.placementPersonalId(examId.value))
|
||||||
.then((res: any) => {
|
.then(async (res) => {
|
||||||
const data = res.data.result;
|
const data = await res.data.result;
|
||||||
storePersonal.fecthDataInformation(data);
|
storePersonal.fecthDataInformation(data);
|
||||||
personalData.value.fullName = data.fullName;
|
personalData.value.fullName = data.fullName;
|
||||||
personalData.value.id = data.personalId;
|
personalData.value.id = data.personalId;
|
||||||
|
|
||||||
InformationData.value.idCard = data.idCard;
|
InformationData.value.idCard = data.idCard;
|
||||||
InformationData.value.fullName = data.fullName;
|
InformationData.value.fullName = data.fullName;
|
||||||
InformationData.value.firstname = data.firstname;
|
InformationData.value.firstname = data.firstname;
|
||||||
|
|
@ -263,19 +257,24 @@ const fetchData = async () => {
|
||||||
});
|
});
|
||||||
CertificateData.value = listCert;
|
CertificateData.value = listCert;
|
||||||
})
|
})
|
||||||
.catch((e: any) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
})
|
})
|
||||||
.finally(() => {});
|
.finally(() => {
|
||||||
};
|
hideLoader();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
const fetchDataByType = async (type: string) => {
|
/**
|
||||||
// storePersonal.loading = false;
|
* ฟังก์ชันดึงข้อมูลรายละเอียดตามประเภท
|
||||||
|
* @param type ประเภทของข้อมูล
|
||||||
|
*/
|
||||||
|
async function fetchDataByType(type: string) {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
.get(config.API.placementPersonalId(examId.value))
|
.get(config.API.placementPersonalId(examId.value))
|
||||||
.then((res: any) => {
|
.then(async (res) => {
|
||||||
const data = res.data.result;
|
const data = await res.data.result;
|
||||||
storePersonal.fecthDataInformation(data);
|
storePersonal.fecthDataInformation(data);
|
||||||
personalData.value.fullName = data.fullName;
|
personalData.value.fullName = data.fullName;
|
||||||
personalData.value.id = data.personalId;
|
personalData.value.id = data.personalId;
|
||||||
|
|
@ -392,18 +391,19 @@ const fetchDataByType = async (type: string) => {
|
||||||
QualificationData.value = data.isProperty;
|
QualificationData.value = data.isProperty;
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch((e: any) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
};
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* get รายการ ข้อมูลเกี่ยวกับบุคคล
|
* ฟังก์ชันดึงข้อมูลเกี่ยวกับบุคคล
|
||||||
*/
|
*/
|
||||||
const fetchPerson = async () => {
|
async function fetchPerson() {
|
||||||
|
showLoader();
|
||||||
await http
|
await http
|
||||||
.get(config.API.profileNewMetaMain)
|
.get(config.API.profileNewMetaMain)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
|
|
@ -464,16 +464,32 @@ const fetchPerson = async () => {
|
||||||
Ops.value.religionOps = optionreligions;
|
Ops.value.religionOps = optionreligions;
|
||||||
OpsFilter.value.religionOps = optionreligions;
|
OpsFilter.value.religionOps = optionreligions;
|
||||||
})
|
})
|
||||||
.catch((e: any) => {})
|
.catch((e) => {
|
||||||
.finally(() => {});
|
messageError($q, e);
|
||||||
};
|
})
|
||||||
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันเช็ต id
|
||||||
|
* @param id profile
|
||||||
|
* @returns ถ้า ID เป็น "00000000-0000-0000-0000-000000000000" ให้ return null
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
function guidCheck(id: string) {
|
||||||
|
if (id == "00000000-0000-0000-0000-000000000000") {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return id;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
// await checkProfileData();
|
await Promise.all([fetchData(), changeTab("information"), fetchPerson()]);
|
||||||
|
|
||||||
await fetchData();
|
|
||||||
await changeTab("information");
|
|
||||||
await fetchPerson();
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
@ -53,10 +53,6 @@ const edit = async () => {
|
||||||
updateEdit(!props.editvisible);
|
updateEdit(!props.editvisible);
|
||||||
props.edit();
|
props.edit();
|
||||||
};
|
};
|
||||||
const checkSave = () => {
|
|
||||||
props.validate();
|
|
||||||
props.save();
|
|
||||||
};
|
|
||||||
|
|
||||||
const clickNext = async () => {
|
const clickNext = async () => {
|
||||||
await props.clickNext();
|
await props.clickNext();
|
||||||
|
|
@ -93,8 +89,7 @@ const clickPrevious = async () => {
|
||||||
label="ลบข้อมูล"
|
label="ลบข้อมูล"
|
||||||
color="red"
|
color="red"
|
||||||
@click="clickDelete"
|
@click="clickDelete"
|
||||||
><!-- icon="mdi-delete"
|
>
|
||||||
<q-tooltip>ลบข้อมูล</q-tooltip> -->
|
|
||||||
</q-btn>
|
</q-btn>
|
||||||
<q-btn
|
<q-btn
|
||||||
v-show="editvisible"
|
v-show="editvisible"
|
||||||
|
|
@ -106,8 +101,6 @@ const clickPrevious = async () => {
|
||||||
label="ยกเลิกแก้ไข"
|
label="ยกเลิกแก้ไข"
|
||||||
v-if="modalEdit == true"
|
v-if="modalEdit == true"
|
||||||
>
|
>
|
||||||
<!-- icon="mdi-undo"
|
|
||||||
<q-tooltip>ยกเลิก</q-tooltip> -->
|
|
||||||
</q-btn>
|
</q-btn>
|
||||||
<q-btn
|
<q-btn
|
||||||
v-if="!editvisible"
|
v-if="!editvisible"
|
||||||
|
|
@ -117,8 +110,6 @@ const clickPrevious = async () => {
|
||||||
:color="editvisible ? 'grey-7' : 'primary'"
|
:color="editvisible ? 'grey-7' : 'primary'"
|
||||||
@click="edit"
|
@click="edit"
|
||||||
>
|
>
|
||||||
<!-- icon="mdi-pencil-outline"
|
|
||||||
<q-tooltip></q-tooltip> -->
|
|
||||||
</q-btn>
|
</q-btn>
|
||||||
|
|
||||||
<q-btn
|
<q-btn
|
||||||
|
|
@ -128,8 +119,7 @@ const clickPrevious = async () => {
|
||||||
:color="!editvisible ? 'grey-7' : 'public'"
|
:color="!editvisible ? 'grey-7' : 'public'"
|
||||||
type="submit"
|
type="submit"
|
||||||
label="บันทึก"
|
label="บันทึก"
|
||||||
><!-- icon="mdi-content-save-outline"
|
>
|
||||||
<q-tooltip>บันทึก</q-tooltip> -->
|
|
||||||
</q-btn>
|
</q-btn>
|
||||||
</q-card-actions>
|
</q-card-actions>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -1,27 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const props = defineProps({
|
|
||||||
tittle: String,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const close = async () => {
|
|
||||||
props.close();
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-toolbar>
|
|
||||||
<q-toolbar-title class="text-subtitle2 text-bold">{{
|
|
||||||
tittle
|
|
||||||
}}</q-toolbar-title>
|
|
||||||
<q-btn
|
|
||||||
icon="close"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
@click="close"
|
|
||||||
style="color: #ff8080; background-color: #ffdede"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,17 +1,15 @@
|
||||||
<!-- card ข้อมูลที่อยู่ -->
|
<!-- card ข้อมูลที่อยู่ -->
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, reactive } from "vue";
|
import { ref, onMounted, reactive } from "vue";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
import type { zipCodeOption } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
|
||||||
|
|
||||||
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
|
||||||
|
|
||||||
import { useRoute } from "vue-router";
|
import { useRoute } from "vue-router";
|
||||||
import { AddressDataDefualt } from "@/modules//05_placement/interface/index/Main";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
import { AddressDataDefualt } from "@/modules//05_placement/interface/index/Main";
|
||||||
|
import type { zipCodeOption } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
||||||
import type {
|
import type {
|
||||||
AddressOps,
|
AddressOps,
|
||||||
Address as AddressType,
|
Address as AddressType,
|
||||||
|
|
@ -20,6 +18,16 @@ import type {
|
||||||
} from "@/modules/05_placement/interface/index/Main";
|
} from "@/modules/05_placement/interface/index/Main";
|
||||||
import type { PropType } from "vue";
|
import type { PropType } from "vue";
|
||||||
|
|
||||||
|
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
||||||
|
|
||||||
|
const route = useRoute();
|
||||||
|
const $q = useQuasar();
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
const { success, messageError, showLoader, hideLoader, dialogConfirm } = mixin;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* props
|
||||||
|
*/
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
statusEdit: {
|
statusEdit: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
|
|
@ -40,21 +48,11 @@ const props = defineProps({
|
||||||
});
|
});
|
||||||
const emit = defineEmits(["update:statusEdit"]);
|
const emit = defineEmits(["update:statusEdit"]);
|
||||||
|
|
||||||
const route = useRoute();
|
const myform = ref<any>(); //refForm
|
||||||
const $q = useQuasar();
|
const edit = ref<boolean>(false); //การแก้ไข
|
||||||
const mixin = useCounterMixin();
|
const onEdit = ref<boolean>(false); //การแก้ไข
|
||||||
const {
|
const addressData = ref<AddressType>(props.data); //ข้อมูลที่อยู่
|
||||||
date2Thai,
|
//ตัวเลือกข้อมูลที่อยู่
|
||||||
success,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
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>({
|
const Ops = ref<AddressOps>({
|
||||||
provinceOps: [],
|
provinceOps: [],
|
||||||
districtOps: [],
|
districtOps: [],
|
||||||
|
|
@ -62,6 +60,7 @@ const Ops = ref<AddressOps>({
|
||||||
subdistrictOps: [],
|
subdistrictOps: [],
|
||||||
subdistrictCOps: [],
|
subdistrictCOps: [],
|
||||||
});
|
});
|
||||||
|
//ข้อมูลที่อยู่
|
||||||
const OpsFilter = ref<AddressOps>({
|
const OpsFilter = ref<AddressOps>({
|
||||||
provinceOps: [],
|
provinceOps: [],
|
||||||
districtOps: [],
|
districtOps: [],
|
||||||
|
|
@ -69,14 +68,14 @@ const OpsFilter = ref<AddressOps>({
|
||||||
subdistrictOps: [],
|
subdistrictOps: [],
|
||||||
subdistrictCOps: [],
|
subdistrictCOps: [],
|
||||||
});
|
});
|
||||||
|
//ที่อยู่ตามทะเบียนบ้าน
|
||||||
const registAddress = reactive<AddressData>({
|
const registAddress = reactive<AddressData>({
|
||||||
subDistrictId: "",
|
subDistrictId: "",
|
||||||
zipCode: "",
|
zipCode: "",
|
||||||
districtId: "",
|
districtId: "",
|
||||||
provinceId: "",
|
provinceId: "",
|
||||||
});
|
});
|
||||||
|
//ที่อยู่ปัจบัน
|
||||||
const currentAddress = reactive<AddressData>({
|
const currentAddress = reactive<AddressData>({
|
||||||
subDistrictId: "",
|
subDistrictId: "",
|
||||||
zipCode: "",
|
zipCode: "",
|
||||||
|
|
@ -84,12 +83,13 @@ const currentAddress = reactive<AddressData>({
|
||||||
provinceId: "",
|
provinceId: "",
|
||||||
});
|
});
|
||||||
|
|
||||||
onMounted(async () => {
|
/**
|
||||||
await getNewData();
|
* ฟังก์ชันค้นหาข้อมูลในรายการตัวเลือก
|
||||||
emit("update:statusEdit", false);
|
* @param val คำค้นหา
|
||||||
});
|
* @param update ฟังก์ชัน
|
||||||
|
* @param refData ประเภทของตัวเลือก
|
||||||
const filterSelector = (val: any, update: Function, refData: string) => {
|
*/
|
||||||
|
function filterSelector(val: string, update: Function, refData: string) {
|
||||||
switch (refData) {
|
switch (refData) {
|
||||||
case "provinceOps":
|
case "provinceOps":
|
||||||
update(() => {
|
update(() => {
|
||||||
|
|
@ -130,9 +130,9 @@ const filterSelector = (val: any, update: Function, refData: string) => {
|
||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const refreshData = async () => {
|
function refreshData() {
|
||||||
myform.value.reset();
|
myform.value.reset();
|
||||||
if (onEdit.value) {
|
if (onEdit.value) {
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
|
|
@ -150,15 +150,21 @@ const refreshData = async () => {
|
||||||
} else {
|
} else {
|
||||||
edit.value = false;
|
edit.value = false;
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const getNewData = async () => {
|
/**
|
||||||
|
* ฟังก์ชันดึงข้อมูลใหม่
|
||||||
|
*/
|
||||||
|
async function getNewData() {
|
||||||
await fetchProvince();
|
await fetchProvince();
|
||||||
};
|
}
|
||||||
|
|
||||||
// บันทึกข้อมูล
|
/**
|
||||||
const editData = async () => {
|
* ฟังก์ชันบันทึกการแก้ไข
|
||||||
|
*/
|
||||||
|
async function editData() {
|
||||||
dialogConfirm($q, async () => {
|
dialogConfirm($q, async () => {
|
||||||
|
showLoader();
|
||||||
const body = {
|
const body = {
|
||||||
registrationSame: addressData.value.registSame == "1",
|
registrationSame: addressData.value.registSame == "1",
|
||||||
registrationAddress: addressData.value.registAddress,
|
registrationAddress: addressData.value.registAddress,
|
||||||
|
|
@ -201,13 +207,19 @@ const editData = async () => {
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
}
|
||||||
|
|
||||||
// เลือกข้อมูลจังหวัด
|
/**
|
||||||
const selectProvince = async (e: string | null, name: string) => {
|
* ฟังก์ชันเลือกข้อมูลจังหวัด
|
||||||
|
* @param e id จังหวัด
|
||||||
|
* @param name ที่อยู่ตามทะเบียนบ้าน , ที่อยู่ปัจจุบัน
|
||||||
|
*/
|
||||||
|
async function selectProvince(e: string | null, name: string) {
|
||||||
onEdit.value = true;
|
onEdit.value = true;
|
||||||
if (e != null) {
|
if (e != null) {
|
||||||
if (name == "1") {
|
if (name == "1") {
|
||||||
|
|
@ -222,10 +234,14 @@ const selectProvince = async (e: string | null, name: string) => {
|
||||||
myform.value.resetValidation();
|
myform.value.resetValidation();
|
||||||
await fetchDistrict(e, name);
|
await fetchDistrict(e, name);
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
// เลือกข้อมูลอำเภอ
|
/**
|
||||||
const selectDistrict = async (e: string | null, name: string) => {
|
* ฟังก์ชันลือกข้อมูลอำเภอ
|
||||||
|
* @param e id อำเภอ
|
||||||
|
* @param name ที่อยู่ตามทะเบียนบ้าน , ที่อยู่ปัจจุบัน
|
||||||
|
*/
|
||||||
|
async function selectDistrict(e: string | null, name: string) {
|
||||||
onEdit.value = true;
|
onEdit.value = true;
|
||||||
if (e != null) {
|
if (e != null) {
|
||||||
if (name == "1") {
|
if (name == "1") {
|
||||||
|
|
@ -238,10 +254,14 @@ const selectDistrict = async (e: string | null, name: string) => {
|
||||||
myform.value.resetValidation();
|
myform.value.resetValidation();
|
||||||
await fetchSubDistrict(e, name);
|
await fetchSubDistrict(e, name);
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
// เลือกข้อมูลตำบล
|
/**
|
||||||
const selectSubDistrict = (e: string | null, name: string) => {
|
* ฟังก์ชันเลือกข้อมูลตำบล
|
||||||
|
* @param e id ตำบล
|
||||||
|
* @param name ที่อยู่ตามทะเบียนบ้าน , ที่อยู่ปัจจุบัน
|
||||||
|
*/
|
||||||
|
async function selectSubDistrict(e: string | null, name: string) {
|
||||||
onEdit.value = true;
|
onEdit.value = true;
|
||||||
if (e != null) {
|
if (e != null) {
|
||||||
if (name == "1") {
|
if (name == "1") {
|
||||||
|
|
@ -254,10 +274,12 @@ const selectSubDistrict = (e: string | null, name: string) => {
|
||||||
currentAddress.zipCode = namecode;
|
currentAddress.zipCode = namecode;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
// ดึงข้อมูลจังหวัด
|
/**
|
||||||
const fetchProvince = async () => {
|
* ฟังก์ชันดึงข้อมูลจังหวัด
|
||||||
|
*/
|
||||||
|
async function fetchProvince() {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
.get(config.API.orgProvince)
|
.get(config.API.orgProvince)
|
||||||
|
|
@ -330,10 +352,14 @@ const fetchProvince = async () => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
})
|
})
|
||||||
.finally(() => {});
|
.finally(() => {});
|
||||||
};
|
}
|
||||||
|
|
||||||
// ดึงข้อมูลอำเภอ
|
/**
|
||||||
const fetchDistrict = async (id: string | null, position: string) => {
|
* ฟังก์ชันดึงข้อมูลอำเภอ
|
||||||
|
* @param id จังหวัด
|
||||||
|
* @param position ที่อยู่ตามทะเบียนบ้าน , ที่อยู่ปัจจุบัน
|
||||||
|
*/
|
||||||
|
async function fetchDistrict(id: string | null, position: string) {
|
||||||
if (id != null && id != "") {
|
if (id != null && id != "") {
|
||||||
await http
|
await http
|
||||||
.get(config.API.orgProvince + `/${id}`)
|
.get(config.API.orgProvince + `/${id}`)
|
||||||
|
|
@ -373,10 +399,14 @@ const fetchDistrict = async (id: string | null, position: string) => {
|
||||||
})
|
})
|
||||||
.finally(() => {});
|
.finally(() => {});
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
// ดึงข้อมูลตำบล
|
/**
|
||||||
const fetchSubDistrict = async (id: string | null, position: string) => {
|
* ฟังก์ชันดึงข้อมูลตำบล
|
||||||
|
* @param id อำเภอ
|
||||||
|
* @param position ที่อยู่ตามทะเบียนบ้าน , ที่อยู่ปัจจุบัน
|
||||||
|
*/
|
||||||
|
async function fetchSubDistrict(id: string | null, position: string) {
|
||||||
if (id != null && id != "") {
|
if (id != null && id != "") {
|
||||||
await http
|
await http
|
||||||
.get(config.API.orgDistrict + `/${id}`)
|
.get(config.API.orgDistrict + `/${id}`)
|
||||||
|
|
@ -422,9 +452,12 @@ const fetchSubDistrict = async (id: string | null, position: string) => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const changeBtn = async () => {
|
/**
|
||||||
|
* ฟังก์ชันการแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
|
function changeBtn() {
|
||||||
if (edit.value == true) {
|
if (edit.value == true) {
|
||||||
if (props.statusEdit === true) {
|
if (props.statusEdit === true) {
|
||||||
props.notiNoEdit();
|
props.notiNoEdit();
|
||||||
|
|
@ -434,18 +467,33 @@ const changeBtn = async () => {
|
||||||
} else {
|
} else {
|
||||||
emit("update:statusEdit", false);
|
emit("update:statusEdit", false);
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const getClass = (val: boolean) => {
|
/**
|
||||||
|
* ฟังก์ชันแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
|
function checkEdit() {
|
||||||
|
onEdit.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันสำหรับคืนค่าชื่อคลาสตามค่าที่กำหนด
|
||||||
|
* @param val ค่าที่ใช้กำหนดคลาส
|
||||||
|
*/
|
||||||
|
function getClass(val: boolean) {
|
||||||
return {
|
return {
|
||||||
"full-width inputgreen cursor-pointer": val,
|
"full-width inputgreen cursor-pointer": val,
|
||||||
"full-width cursor-pointer": !val,
|
"full-width cursor-pointer": !val,
|
||||||
};
|
};
|
||||||
};
|
|
||||||
|
|
||||||
function checkEdit() {
|
|
||||||
onEdit.value = true;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
|
onMounted(async () => {
|
||||||
|
await getNewData();
|
||||||
|
emit("update:statusEdit", false);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
|
||||||
|
|
@ -1,26 +1,30 @@
|
||||||
<!-- card ใบอนุญาตประกอบอาชีพ -->
|
<!-- card ใบอนุญาตประกอบอาชีพ -->
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref, watch } from "vue";
|
import { onMounted, ref, watch } from "vue";
|
||||||
import { useRoute } from "vue-router";
|
|
||||||
import { useProfileDataStore } from "@/modules/05_placement/store";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useDataStore } from "@/stores/data";
|
|
||||||
import ProfileTable from "@/modules/05_placement/components/PersonalDetail/Table.vue";
|
|
||||||
import DialogHeader from "@/modules/05_placement/components/PersonalDetail/DialogHeader.vue";
|
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalDetail/DialogFooter.vue";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { useRoute } from "vue-router";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useProfileDataStore } from "@/modules/05_placement/store";
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
RequestItemsObject,
|
RequestItemsObject,
|
||||||
DataProps,
|
DataProps,
|
||||||
} from "@/modules/05_placement/interface/request/Certificate";
|
} from "@/modules/05_placement/interface/request/Certificate";
|
||||||
import type { ResponseObject } from "@/modules/05_placement/interface/response/Certificate";
|
|
||||||
import HistoryTable from "@/components/TableHistory.vue";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
import type { PropType } from "vue";
|
import type { PropType } from "vue";
|
||||||
import type { Certificate } from "@/modules/05_placement/interface/index/Main";
|
import type { Certificate } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
|
import HistoryTable from "@/components/TableHistory.vue";
|
||||||
|
import ProfileTable from "@/modules/05_placement/components/PersonalDetail/Information/TableEducation.vue";
|
||||||
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
|
import DialogFooter from "@/modules/05_placement/components/PersonalDetail/DialogFooter.vue";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* props
|
||||||
|
*/
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
statusEdit: {
|
statusEdit: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
|
|
@ -48,7 +52,7 @@ const mixin = useCounterMixin();
|
||||||
const {
|
const {
|
||||||
date2Thai,
|
date2Thai,
|
||||||
success,
|
success,
|
||||||
dateToISO,
|
|
||||||
messageError,
|
messageError,
|
||||||
showLoader,
|
showLoader,
|
||||||
hideLoader,
|
hideLoader,
|
||||||
|
|
@ -75,10 +79,7 @@ const rowsHistory = ref<RequestItemsObject[]>([]); //select data history
|
||||||
const tittleHistory = ref<string>("ประวัติแก้ไขใบอนุญาตประกอบอาชีพ"); //
|
const tittleHistory = ref<string>("ประวัติแก้ไขใบอนุญาตประกอบอาชีพ"); //
|
||||||
const filterHistory = ref<string>(""); //search data table history
|
const filterHistory = ref<string>(""); //search data table history
|
||||||
const modalHistory = ref<boolean>(false); //modal ประวัติการแก้ไขข้อมูล
|
const modalHistory = ref<boolean>(false); //modal ประวัติการแก้ไขข้อมูล
|
||||||
const checkValidate = ref<boolean>(false); //validate data ผ่านหรือไม่
|
|
||||||
// const profileId = ref<string>(
|
|
||||||
// route.params.id ? route.params.id.toString() : ""
|
|
||||||
// );
|
|
||||||
const profileId = ref<string>("");
|
const profileId = ref<string>("");
|
||||||
const rows = ref<Certificate[]>([]);
|
const rows = ref<Certificate[]>([]);
|
||||||
const filter = ref<string>(""); //search data table
|
const filter = ref<string>(""); //search data table
|
||||||
|
|
@ -238,19 +239,6 @@ const visibleColumnsHistory = ref<String[]>([
|
||||||
"createdAt",
|
"createdAt",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
watch(visibleColumns, async (count: String[], prevCount: String[]) => {
|
|
||||||
await changeProfileColumns("certicate", count);
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
// await fetchData();
|
|
||||||
if (route.params.id) {
|
|
||||||
profileId.value = route.params.personalId.toString();
|
|
||||||
}
|
|
||||||
// await props.fetch();
|
|
||||||
rows.value = props.data;
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* กดดูข้อมูลก่อนหน้า
|
* กดดูข้อมูลก่อนหน้า
|
||||||
*/
|
*/
|
||||||
|
|
@ -489,55 +477,6 @@ const clickEditRow = () => {
|
||||||
editRow.value = true;
|
editRow.value = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
|
||||||
* ฟังชั้นดูข้อมูลประวัติแก้ไขข้อมูลที่เลือก
|
|
||||||
* @param row ข้อมูล row ที่ดูประวัติการแก้ไข
|
|
||||||
*/
|
|
||||||
const clickHistory = async (row: RequestItemsObject) => {
|
|
||||||
tittleHistory.value =
|
|
||||||
props.profileType == "employee"
|
|
||||||
? "ประวัติแก้ไขใบอนุญาตของลูกจ้าง"
|
|
||||||
: "ประวัติแก้ไขใบอนุญาตประกอบอาชีพ";
|
|
||||||
modalHistory.value = true;
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(config.API.profileCertHisId(row.id))
|
|
||||||
.then((res) => {
|
|
||||||
let data = res.data.result;
|
|
||||||
rowsHistory.value = [];
|
|
||||||
data.map((e: ResponseObject) => {
|
|
||||||
rowsHistory.value.push({
|
|
||||||
id: e.id,
|
|
||||||
certificateNo: e.certificateNo,
|
|
||||||
issuer: e.issuer,
|
|
||||||
issueDate: new Date(e.issueDate),
|
|
||||||
expireDate: new Date(e.expireDate),
|
|
||||||
certificateType: e.certificateType,
|
|
||||||
createdFullName: e.createdFullName,
|
|
||||||
createdAt: new Date(e.createdAt),
|
|
||||||
});
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* validate input ใน dialog
|
|
||||||
*/
|
|
||||||
const validateData = async () => {
|
|
||||||
checkValidate.value = true;
|
|
||||||
await myForm.value.validate().then((result: boolean) => {
|
|
||||||
if (result == false) {
|
|
||||||
checkValidate.value = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
|
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
|
||||||
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่
|
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่
|
||||||
|
|
@ -548,6 +487,17 @@ const getClass = (val: boolean) => {
|
||||||
"full-width cursor-pointer": !val,
|
"full-width cursor-pointer": !val,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
watch(visibleColumns, async (count: String[], prevCount: String[]) => {
|
||||||
|
changeProfileColumns("certicate", count);
|
||||||
|
});
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
if (route.params.id) {
|
||||||
|
profileId.value = route.params.personalId.toString();
|
||||||
|
}
|
||||||
|
rows.value = props.data;
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md no-border">
|
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md no-border">
|
||||||
|
|
@ -587,17 +537,6 @@ const getClass = (val: boolean) => {
|
||||||
{{ col.value }}
|
{{ col.value }}
|
||||||
</div>
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<!-- <q-td auto-width>
|
|
||||||
<q-btn
|
|
||||||
color="info"
|
|
||||||
flat
|
|
||||||
dense
|
|
||||||
round
|
|
||||||
size="14px"
|
|
||||||
icon="mdi-history"
|
|
||||||
@click="clickHistory(props.row)"
|
|
||||||
/>
|
|
||||||
</q-td> -->
|
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
</ProfileTable>
|
</ProfileTable>
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, computed, ref, watch } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { useQuasar, QForm } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useRoute } from "vue-router";
|
import { useRoute } from "vue-router";
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
|
@ -15,6 +15,18 @@ interface ArrayFileList {
|
||||||
fileName: string;
|
fileName: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const $q = useQuasar(); // show dialog
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
const route = useRoute();
|
||||||
|
const {
|
||||||
|
success,
|
||||||
|
messageError,
|
||||||
|
showLoader,
|
||||||
|
dialogConfirm,
|
||||||
|
hideLoader,
|
||||||
|
dialogRemove,
|
||||||
|
} = mixin;
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
statusEdit: {
|
statusEdit: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
|
|
@ -41,72 +53,13 @@ const emit = defineEmits(["update:statusEdit"]);
|
||||||
const documentFile = ref<any>(null);
|
const documentFile = ref<any>(null);
|
||||||
const fileList = ref<ArrayFileList[]>([]);
|
const fileList = ref<ArrayFileList[]>([]);
|
||||||
|
|
||||||
const $q = useQuasar(); // show dialog
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const route = useRoute();
|
|
||||||
const {
|
|
||||||
success,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
dialogConfirm,
|
|
||||||
hideLoader,
|
|
||||||
dialogRemove,
|
|
||||||
} = mixin;
|
|
||||||
const profileId = ref<string>(
|
const profileId = ref<string>(
|
||||||
route.params.personalId ? route.params.personalId.toString() : ""
|
route.params.personalId ? route.params.personalId.toString() : ""
|
||||||
);
|
);
|
||||||
const edit = ref<boolean>(false);
|
const edit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
const uploader = ref<any>();
|
const uploader = ref<any>(); //
|
||||||
const files = ref<any>([]);
|
const file = ref<any>([]); //ไฟล์์
|
||||||
const file = ref<any>([]);
|
|
||||||
const name = ref<string>("");
|
const name = ref<string>("");
|
||||||
const dataMain = ref<any>([]);
|
|
||||||
|
|
||||||
// const getData = async () => {
|
|
||||||
// if (props.datainformation) {
|
|
||||||
// dataMain.value = props.datainformation;
|
|
||||||
// files.value = dataMain.value.docs;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// โค้ดเก่ายังไม่ได้ใช้
|
|
||||||
// if (profileId.value) {
|
|
||||||
// showLoader();
|
|
||||||
// await http
|
|
||||||
// .get(config.API.profilePaperId(profileId.value))
|
|
||||||
// .then((res) => {
|
|
||||||
// const data = res.data.result;
|
|
||||||
// files.value = data;
|
|
||||||
// })
|
|
||||||
// .catch((e) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(() => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
// };
|
|
||||||
|
|
||||||
const deleteData = async (id: string) => {
|
|
||||||
dialogConfirm(
|
|
||||||
$q,
|
|
||||||
async () => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.delete(config.API.documentDelid(profileId.value, id))
|
|
||||||
.then(() => {
|
|
||||||
success($q, "ลบไฟล์เอกสารสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await props.fetch();
|
|
||||||
});
|
|
||||||
},
|
|
||||||
"ยืนยันการลบเอกสารหลักฐาน",
|
|
||||||
"ต้องการยืนยันการลบเอกสารหลักฐานนี้หรือไม่ ?"
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const uploadData = async () => {
|
const uploadData = async () => {
|
||||||
if (profileId.value) {
|
if (profileId.value) {
|
||||||
|
|
@ -117,7 +70,6 @@ const uploadData = async () => {
|
||||||
});
|
});
|
||||||
const formData = new FormData();
|
const formData = new FormData();
|
||||||
formData.append("file", newFile);
|
formData.append("file", newFile);
|
||||||
// formData.append("moss", "newFile");
|
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
.put(config.API.documentByid(profileId.value), formData)
|
.put(config.API.documentByid(profileId.value), formData)
|
||||||
|
|
@ -134,26 +86,10 @@ const uploadData = async () => {
|
||||||
edit.value = false;
|
edit.value = false;
|
||||||
emit("update:statusEdit", false);
|
emit("update:statusEdit", false);
|
||||||
});
|
});
|
||||||
// } else {
|
|
||||||
// // modalError(
|
|
||||||
// // $q,
|
|
||||||
// // "ไม่สามารถอัปโหลดไฟล์ได้",
|
|
||||||
// // "กรุณาเลือกไฟล์ที่ต้องการอัปโหลด"
|
|
||||||
// // );
|
|
||||||
// getData();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const fileAdd = async (val: any) => {
|
|
||||||
name.value = val[0].name;
|
|
||||||
file.value = val;
|
|
||||||
};
|
|
||||||
|
|
||||||
const downloadData = async (path: string) => {
|
|
||||||
window.open(path);
|
|
||||||
};
|
|
||||||
|
|
||||||
const changeBtn = async () => {
|
const changeBtn = async () => {
|
||||||
name.value = "";
|
name.value = "";
|
||||||
if (edit.value == true) {
|
if (edit.value == true) {
|
||||||
|
|
@ -171,7 +107,6 @@ const changeBtn = async () => {
|
||||||
/** ฟังชั่นใหม่ */
|
/** ฟังชั่นใหม่ */
|
||||||
function clickUpload(file: any) {
|
function clickUpload(file: any) {
|
||||||
const fileName = { fileName: file.name };
|
const fileName = { fileName: file.name };
|
||||||
|
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
$q,
|
$q,
|
||||||
async () => {
|
async () => {
|
||||||
|
|
@ -295,6 +230,9 @@ function deleteFile(fileName: string) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันดึงข้อมูลรายการไฟล์
|
||||||
|
*/
|
||||||
async function getData() {
|
async function getData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
@ -312,6 +250,9 @@ async function getData() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await getData();
|
await getData();
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -4,8 +4,8 @@ import { useRoute } from "vue-router";
|
||||||
import { useProfileDataStore } from "@/modules/05_placement/store";
|
import { useProfileDataStore } from "@/modules/05_placement/store";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
|
||||||
import ProfileTable from "@/modules/05_placement/components/PersonalDetail/Table.vue";
|
import ProfileTable from "@/modules/05_placement/components/PersonalDetail/Information/TableEducation.vue";
|
||||||
import DialogHeader from "@/modules/05_placement/components/PersonalDetail/DialogHeader.vue";
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalDetail/DialogFooter.vue";
|
import DialogFooter from "@/modules/05_placement/components/PersonalDetail/DialogFooter.vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import type {
|
import type {
|
||||||
|
|
@ -23,6 +23,22 @@ import type {
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
import type { PropType } from "vue";
|
import type { PropType } from "vue";
|
||||||
|
|
||||||
|
const $q = useQuasar();
|
||||||
|
const route = useRoute();
|
||||||
|
const store = useProfileDataStore();
|
||||||
|
const { profileData, changeProfileColumns } = store;
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
const {
|
||||||
|
success,
|
||||||
|
dateToISO,
|
||||||
|
date2Thai,
|
||||||
|
messageError,
|
||||||
|
showLoader,
|
||||||
|
hideLoader,
|
||||||
|
dialogRemove,
|
||||||
|
dialogConfirm,
|
||||||
|
} = mixin;
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
statusEdit: {
|
statusEdit: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
|
|
@ -38,21 +54,6 @@ const props = defineProps({
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const store = useProfileDataStore();
|
|
||||||
const { profileData, changeProfileColumns } = store;
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const {
|
|
||||||
success,
|
|
||||||
dateToISO,
|
|
||||||
date2Thai,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
dialogRemove,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin;
|
|
||||||
const route = useRoute();
|
|
||||||
const id = ref<string>("");
|
const id = ref<string>("");
|
||||||
const levelId = ref<string>();
|
const levelId = ref<string>();
|
||||||
const Ops = ref<EduOps>({
|
const Ops = ref<EduOps>({
|
||||||
|
|
@ -96,6 +97,7 @@ const checkValidate = ref<boolean>(false); //validate data ผ่านหรื
|
||||||
const rows = ref<Education[]>(props.data);
|
const rows = ref<Education[]>(props.data);
|
||||||
const filter = ref<string>(""); //search data table
|
const filter = ref<string>(""); //search data table
|
||||||
const visibleColumns = ref<String[]>([]);
|
const visibleColumns = ref<String[]>([]);
|
||||||
|
|
||||||
profileData.education.columns.length == 0
|
profileData.education.columns.length == 0
|
||||||
? (visibleColumns.value = [
|
? (visibleColumns.value = [
|
||||||
"educationLevel",
|
"educationLevel",
|
||||||
|
|
@ -108,7 +110,6 @@ profileData.education.columns.length == 0
|
||||||
"durationYear",
|
"durationYear",
|
||||||
"other",
|
"other",
|
||||||
"fundName",
|
"fundName",
|
||||||
// "positionPath",
|
|
||||||
"finishDate",
|
"finishDate",
|
||||||
"startDate",
|
"startDate",
|
||||||
"endDate",
|
"endDate",
|
||||||
|
|
@ -170,17 +171,7 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
sort: (a: string, b: string) =>
|
sort: (a: string, b: string) =>
|
||||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// name: "positionPath",
|
|
||||||
// align: "left",
|
|
||||||
// label: "เป็นวุฒิการศึกษาในตำแหน่ง",
|
|
||||||
// sortable: true,
|
|
||||||
// field: "positionPath",
|
|
||||||
// headerStyle: "font-size: 14px",
|
|
||||||
// style: "font-size: 14px",
|
|
||||||
// sort: (a: string, b: string) =>
|
|
||||||
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
|
||||||
// },
|
|
||||||
{
|
{
|
||||||
name: "degree",
|
name: "degree",
|
||||||
align: "left",
|
align: "left",
|
||||||
|
|
@ -271,20 +262,9 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
watch(startDate, (count, prevCount) => {
|
/**
|
||||||
minDate.value = new Date(`${startDate.value}-01-01`);
|
* ฟังก์ชันดึงข้อมูลระดับ
|
||||||
});
|
*/
|
||||||
|
|
||||||
watch(visibleColumns, async (count: String[], prevCount: String[]) => {
|
|
||||||
await changeProfileColumns("education", count);
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
await fetchLevel();
|
|
||||||
await fetchPositionPath();
|
|
||||||
rows.value = props.data;
|
|
||||||
});
|
|
||||||
|
|
||||||
const fetchLevel = async () => {
|
const fetchLevel = async () => {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
@ -306,6 +286,9 @@ const fetchLevel = async () => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันดึงข้อมูลตำแหน่ง
|
||||||
|
*/
|
||||||
const fetchPositionPath = async () => {
|
const fetchPositionPath = async () => {
|
||||||
let option: any = [];
|
let option: any = [];
|
||||||
option.push({ id: true, name: "ใช่" });
|
option.push({ id: true, name: "ใช่" });
|
||||||
|
|
@ -314,7 +297,13 @@ const fetchPositionPath = async () => {
|
||||||
OpsFilter.value.positionPathOptions = option;
|
OpsFilter.value.positionPathOptions = option;
|
||||||
};
|
};
|
||||||
|
|
||||||
const filterSelector = (val: any, update: Function, refData: string) => {
|
/**
|
||||||
|
* ฟังก์ชันค้นหาข้อมูลในรายการตัวเลือก
|
||||||
|
* @param val คำค้นหา
|
||||||
|
* @param update ฟังก์ชัน
|
||||||
|
* @param refData ประเภทของตัวเลือก
|
||||||
|
*/
|
||||||
|
const filterSelector = (val: string, update: Function, refData: string) => {
|
||||||
switch (refData) {
|
switch (refData) {
|
||||||
case "levelOptions":
|
case "levelOptions":
|
||||||
update(() => {
|
update(() => {
|
||||||
|
|
@ -359,7 +348,7 @@ const clickNext = async () => {
|
||||||
/**
|
/**
|
||||||
* กดดูข้อมูลต่อไป
|
* กดดูข้อมูลต่อไป
|
||||||
*/
|
*/
|
||||||
const getData = () => {
|
const getData = async () => {
|
||||||
const row = rows.value[rowIndex.value];
|
const row = rows.value[rowIndex.value];
|
||||||
const checkLevelEducation = OpsFilter.value.levelOptions.find(
|
const checkLevelEducation = OpsFilter.value.levelOptions.find(
|
||||||
(e) => e.id === row.educationLevelId
|
(e) => e.id === row.educationLevelId
|
||||||
|
|
@ -367,8 +356,6 @@ const getData = () => {
|
||||||
|
|
||||||
levelId.value = checkLevelEducation ? row.educationLevelId : "";
|
levelId.value = checkLevelEducation ? row.educationLevelId : "";
|
||||||
isDate.value = row.isDate;
|
isDate.value = row.isDate;
|
||||||
isEducation.value = row.isEducation;
|
|
||||||
// positionPathId.value = resultPath;
|
|
||||||
institute.value = row.institute;
|
institute.value = row.institute;
|
||||||
degree.value = row.degree;
|
degree.value = row.degree;
|
||||||
field.value = row.field;
|
field.value = row.field;
|
||||||
|
|
@ -396,7 +383,7 @@ const getData = () => {
|
||||||
/**
|
/**
|
||||||
* เช็คปุ่มดูข้อมูล ย้อน กับ ต่อไป ว่าต้องแสดงไหม
|
* เช็คปุ่มดูข้อมูล ย้อน กับ ต่อไป ว่าต้องแสดงไหม
|
||||||
*/
|
*/
|
||||||
const checkRowPage = () => {
|
const checkRowPage = async () => {
|
||||||
editRow.value = false;
|
editRow.value = false;
|
||||||
next.value = true;
|
next.value = true;
|
||||||
previous.value = true;
|
previous.value = true;
|
||||||
|
|
@ -420,9 +407,9 @@ const clickEdit = () => {
|
||||||
/**
|
/**
|
||||||
* กดปุ่มเพิ่มด้านบน table
|
* กดปุ่มเพิ่มด้านบน table
|
||||||
*/
|
*/
|
||||||
const clickAdd = async () => {
|
const clickAdd = () => {
|
||||||
editRow.value = false;
|
editRow.value = false;
|
||||||
await addData();
|
addData();
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -430,9 +417,9 @@ const clickAdd = async () => {
|
||||||
*/
|
*/
|
||||||
const clickSave = async () => {
|
const clickSave = async () => {
|
||||||
if (modalEdit.value) {
|
if (modalEdit.value) {
|
||||||
await dialogConfirm($q, () => editData());
|
dialogConfirm($q, () => editData());
|
||||||
} else {
|
} else {
|
||||||
await dialogConfirm($q, () => saveData());
|
dialogConfirm($q, () => saveData());
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -444,7 +431,6 @@ const saveData = async () => {
|
||||||
await http
|
await http
|
||||||
.post(config.API.placementEducationId(route.params.personalId.toString()), {
|
.post(config.API.placementEducationId(route.params.personalId.toString()), {
|
||||||
id: id.value,
|
id: id.value,
|
||||||
// educationLevel: filter[0].name,
|
|
||||||
educationLevelId: levelId.value,
|
educationLevelId: levelId.value,
|
||||||
positionPathId: positionPathId.value,
|
positionPathId: positionPathId.value,
|
||||||
institute: institute.value,
|
institute: institute.value,
|
||||||
|
|
@ -475,6 +461,8 @@ const saveData = async () => {
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
@ -487,7 +475,6 @@ const editData = async () => {
|
||||||
await http
|
await http
|
||||||
.put(config.API.placementEducationId(route.params.personalId.toString()), {
|
.put(config.API.placementEducationId(route.params.personalId.toString()), {
|
||||||
id: id.value,
|
id: id.value,
|
||||||
// educationLevel: filter[0].name,
|
|
||||||
educationLevelId: levelId.value,
|
educationLevelId: levelId.value,
|
||||||
positionPathId: positionPathId.value,
|
positionPathId: positionPathId.value,
|
||||||
institute: institute.value,
|
institute: institute.value,
|
||||||
|
|
@ -518,6 +505,8 @@ const editData = async () => {
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
@ -526,22 +515,23 @@ const editData = async () => {
|
||||||
* ลบลบข้อมูล
|
* ลบลบข้อมูล
|
||||||
*/
|
*/
|
||||||
const clickDelete = async () => {
|
const clickDelete = async () => {
|
||||||
dialogRemove($q, async () => await deletePlacementEducation());
|
dialogRemove($q, async () => {
|
||||||
};
|
showLoader();
|
||||||
const deletePlacementEducation = async () => {
|
await http
|
||||||
showLoader();
|
.delete(config.API.placementEducationId(id.value))
|
||||||
await http
|
.then(async () => {
|
||||||
.delete(config.API.placementEducationId(id.value))
|
await props.fetch("Education");
|
||||||
.then(async (res) => {
|
await success($q, "ลบข้อมูลสำเร็จ");
|
||||||
await props.fetch("Education");
|
modal.value = false;
|
||||||
await success($q, "ลบข้อมูลสำเร็จ");
|
rows.value = props.data;
|
||||||
modal.value = false;
|
})
|
||||||
rows.value = props.data;
|
.catch((e) => {
|
||||||
})
|
messageError($q, e);
|
||||||
.catch((e) => {
|
})
|
||||||
messageError($q, e);
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -582,9 +572,6 @@ const selectData = async (_props: DataProps) => {
|
||||||
rowIndex.value = _props.rowIndex;
|
rowIndex.value = _props.rowIndex;
|
||||||
levelId.value = checkLevelEducation ? _props.row.educationLevelId : "";
|
levelId.value = checkLevelEducation ? _props.row.educationLevelId : "";
|
||||||
|
|
||||||
// positionPathId.value = resultPath;
|
|
||||||
// levelId.value = _props.row.levelId;
|
|
||||||
// positionPathId.value = _props.row.positionPathId;
|
|
||||||
institute.value = _props.row.institute;
|
institute.value = _props.row.institute;
|
||||||
degree.value = _props.row.degree;
|
degree.value = _props.row.degree;
|
||||||
field.value = _props.row.field;
|
field.value = _props.row.field;
|
||||||
|
|
@ -646,17 +633,6 @@ const clickCancel = async () => {
|
||||||
`ข้อมูลมีการแก้ไข`,
|
`ข้อมูลมีการแก้ไข`,
|
||||||
`ยืนยันยกเลิกการแก้ไขใช่หรือไม่?`
|
`ยืนยันยกเลิกการแก้ไขใช่หรือไม่?`
|
||||||
);
|
);
|
||||||
// $q.dialog({
|
|
||||||
// title: `ข้อมูลมีการแก้ไข`,
|
|
||||||
// message: `ยืนยันยกเลิกการแก้ไขใช่หรือไม่?`,
|
|
||||||
// cancel: "ยกเลิก",
|
|
||||||
// ok: "ยืนยัน",
|
|
||||||
// persistent: true,
|
|
||||||
// }).onOk(async () => {
|
|
||||||
// edit.value = false;
|
|
||||||
// await checkRowPage();
|
|
||||||
// await getData();
|
|
||||||
// });
|
|
||||||
} else {
|
} else {
|
||||||
edit.value = false;
|
edit.value = false;
|
||||||
await checkRowPage();
|
await checkRowPage();
|
||||||
|
|
@ -692,6 +668,23 @@ const getClass = (val: boolean) => {
|
||||||
"full-width cursor-pointer": !val,
|
"full-width cursor-pointer": !val,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
watch(startDate, (count, prevCount) => {
|
||||||
|
minDate.value = new Date(`${startDate.value}-01-01`);
|
||||||
|
});
|
||||||
|
|
||||||
|
watch(visibleColumns, (count: String[], prevCount: String[]) => {
|
||||||
|
changeProfileColumns("education", count);
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
|
onMounted(async () => {
|
||||||
|
await fetchLevel();
|
||||||
|
await fetchPositionPath();
|
||||||
|
rows.value = props.data;
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-card flat bordered class="col-12 q-px-lg q-py-md no-border">
|
<q-card flat bordered class="col-12 q-px-lg q-py-md no-border">
|
||||||
|
|
@ -783,7 +776,7 @@ const getClass = (val: boolean) => {
|
||||||
option-value="id"
|
option-value="id"
|
||||||
use-input
|
use-input
|
||||||
input-debounce="0"
|
input-debounce="0"
|
||||||
@filter="(inputValue:any,
|
@filter="(inputValue:string,
|
||||||
doneFn:Function) => filterSelector(inputValue, doneFn,'levelOptions'
|
doneFn:Function) => filterSelector(inputValue, doneFn,'levelOptions'
|
||||||
) "
|
) "
|
||||||
/>
|
/>
|
||||||
|
|
@ -1057,30 +1050,7 @@ const getClass = (val: boolean) => {
|
||||||
</template>
|
</template>
|
||||||
</datepicker>
|
</datepicker>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="col-xs-6 col-sm-6 col-md-6">
|
|
||||||
<selector
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="isEducation"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'เป็นวุฒิการศึกษาในตำแหน่ง'}`"
|
|
||||||
@update:modelValue="clickEditRow"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="Ops.positionPathOptions"
|
|
||||||
option-value="id"
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
@filter="(inputValue:any,
|
|
||||||
doneFn:Function) => filterSelector(inputValue, doneFn,'positionPathOptions'
|
|
||||||
) "
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(edit)"
|
:class="getClass(edit)"
|
||||||
|
|
@ -1,16 +1,24 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import type { QForm } from "quasar";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import type { DataOption } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
|
||||||
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
import { useRoute } from "vue-router";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import { useRoute } from "vue-router";
|
|
||||||
|
import { FamilyDataDefualt } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
import type { QForm } from "quasar";
|
||||||
import type { PropType } from "vue";
|
import type { PropType } from "vue";
|
||||||
import type { Family } from "@/modules/05_placement/interface/index/Main";
|
import type { Family } from "@/modules/05_placement/interface/index/Main";
|
||||||
import { FamilyDataDefualt } from "@/modules/05_placement/interface/index/Main";
|
import type { DataOption } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
||||||
|
|
||||||
|
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
||||||
|
|
||||||
|
const $q = useQuasar();
|
||||||
|
const route = useRoute();
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
const { success, messageError, showLoader, hideLoader, dialogConfirm } = mixin;
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
statusEdit: {
|
statusEdit: {
|
||||||
|
|
@ -38,29 +46,25 @@ const props = defineProps({
|
||||||
});
|
});
|
||||||
const emit = defineEmits(["update:statusEdit"]);
|
const emit = defineEmits(["update:statusEdit"]);
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const $q = useQuasar();
|
|
||||||
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
success,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin;
|
|
||||||
const edit = ref<boolean>(false);
|
|
||||||
const onEdit = ref<boolean>(false);
|
|
||||||
|
|
||||||
const myform = ref<QForm | null>(null);
|
const myform = ref<QForm | null>(null);
|
||||||
const familyData = ref<Family>(props.data);
|
const edit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
|
const onEdit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
|
const familyData = ref<Family>(props.data); //ข้อมูลครอบครัว
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
function checkEdit() {
|
function checkEdit() {
|
||||||
onEdit.value = true;
|
onEdit.value = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
function filterSelector(val: any, update: Function, refData: string) {
|
/**
|
||||||
|
* ฟังก์ชันค้นหาข้อมูลในรายการตัวเลือก
|
||||||
|
* @param val คำค้นหา
|
||||||
|
* @param update ฟังก์ชัน
|
||||||
|
* @param refData ประเภทของตัวเลือก
|
||||||
|
*/
|
||||||
|
function filterSelector(val: string, update: Function, refData: string) {
|
||||||
update(() => {
|
update(() => {
|
||||||
props.Ops[`${refData}`] = props.OpsFilter[`${refData}`].filter(
|
props.Ops[`${refData}`] = props.OpsFilter[`${refData}`].filter(
|
||||||
(v: DataOption) => v.name.indexOf(val) > -1
|
(v: DataOption) => v.name.indexOf(val) > -1
|
||||||
|
|
@ -121,32 +125,30 @@ async function editData() {
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
hideLoader();
|
|
||||||
})
|
})
|
||||||
.finally(async () => {});
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async function saveData() {
|
/**
|
||||||
await myform.value?.validate().then(async (success: boolean) => {
|
* ฟังก์ชันเลือกคู่สมรส
|
||||||
if (success) {
|
* @param e มี, ไม่มีคู่สมรส
|
||||||
await editData();
|
*/
|
||||||
} else {
|
function selectRadio(e: boolean) {
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function selectRadio(e: boolean, i: any) {
|
|
||||||
onEdit.value = true;
|
onEdit.value = true;
|
||||||
if (e) {
|
if (e) {
|
||||||
familyData.value.marryPrefixId = "";
|
familyData.value.marryPrefixId = "";
|
||||||
familyData.value.marryFirstName = "";
|
familyData.value.marryFirstName = "";
|
||||||
familyData.value.marryLastName = "";
|
familyData.value.marryLastName = "";
|
||||||
// familyData.value.lastnameCOld = "";
|
|
||||||
familyData.value.marryOccupation = "";
|
familyData.value.marryOccupation = "";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันการแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
async function changeBtn() {
|
async function changeBtn() {
|
||||||
if (edit.value == true) {
|
if (edit.value == true) {
|
||||||
if (props.statusEdit === true) {
|
if (props.statusEdit === true) {
|
||||||
|
|
@ -159,6 +161,10 @@ async function changeBtn() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันสำหรับคืนค่าชื่อคลาสตามค่าที่กำหนด
|
||||||
|
* @param val ค่าที่ใช้กำหนดคลาส
|
||||||
|
*/
|
||||||
function getClass(val: boolean) {
|
function getClass(val: boolean) {
|
||||||
return {
|
return {
|
||||||
"full-width inputgreen cursor-pointer": val,
|
"full-width inputgreen cursor-pointer": val,
|
||||||
|
|
@ -166,6 +172,9 @@ function getClass(val: boolean) {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
emit("update:statusEdit", false);
|
emit("update:statusEdit", false);
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -1,25 +1,40 @@
|
||||||
<!-- card ข้อมูลส่วนตัว -->
|
<!-- card ข้อมูลส่วนตัว -->
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
import type { PropType } from "vue";
|
||||||
|
|
||||||
|
import { useRoute } from "vue-router";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useProfileDataStore } from "@/modules/05_placement/store";
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
Information,
|
Information,
|
||||||
DataOption,
|
DataOption,
|
||||||
} from "@/modules/05_placement/components/PersonalDetail/profileType";
|
} from "@/modules/05_placement/components/PersonalDetail/profileType";
|
||||||
|
import type { QForm } from "quasar";
|
||||||
import { defaultInformation } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
import { defaultInformation } from "@/modules/05_placement/components/PersonalDetail/profileType";
|
||||||
|
|
||||||
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
const route = useRoute();
|
||||||
import config from "@/app.config";
|
const $q = useQuasar();
|
||||||
import { useRoute } from "vue-router";
|
const mixin = useCounterMixin();
|
||||||
import { useProfileDataStore } from "@/modules/05_placement/store";
|
const profileStore = useProfileDataStore();
|
||||||
|
const { changeRetireText, changeBirth } = profileStore;
|
||||||
|
const {
|
||||||
|
date2Thai,
|
||||||
|
success,
|
||||||
|
dateToISO,
|
||||||
|
messageError,
|
||||||
|
modalError,
|
||||||
|
showLoader,
|
||||||
|
hideLoader,
|
||||||
|
dialogConfirm,
|
||||||
|
} = mixin;
|
||||||
|
|
||||||
import type { QForm } from "quasar";
|
|
||||||
import type { PropType } from "vue";
|
|
||||||
|
|
||||||
const onEdit = ref<boolean>(false);
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
statusEdit: {
|
statusEdit: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
|
|
@ -46,30 +61,11 @@ const props = defineProps({
|
||||||
});
|
});
|
||||||
const emit = defineEmits(["update:statusEdit"]);
|
const emit = defineEmits(["update:statusEdit"]);
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
success,
|
|
||||||
dateToISO,
|
|
||||||
messageError,
|
|
||||||
modalError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const profileStore = useProfileDataStore();
|
|
||||||
const { changeRetireText, changeBirth } = profileStore;
|
|
||||||
const edit = ref<boolean>(false);
|
|
||||||
const informaData = ref<Information>(props.data);
|
|
||||||
const age = ref<boolean>(true);
|
|
||||||
const myform = ref<QForm | null>(null);
|
const myform = ref<QForm | null>(null);
|
||||||
|
const onEdit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
onMounted(async () => {
|
const edit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
emit("update:statusEdit", false);
|
const informaData = ref<Information>(props.data); //ข้อมูลส่วนตัว
|
||||||
});
|
const age = ref<boolean>(true); //อายุ
|
||||||
|
|
||||||
const onCancel = async () => {
|
const onCancel = async () => {
|
||||||
if (myform.value != null) {
|
if (myform.value != null) {
|
||||||
|
|
@ -92,7 +88,13 @@ const onCancel = async () => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const filterSelector = (val: any, update: Function, refData: string) => {
|
/**
|
||||||
|
* ฟังก์ชันค้นหาข้อมูลในรายการตัวเลือก
|
||||||
|
* @param val คำค้นหา
|
||||||
|
* @param update ฟังก์ชัน
|
||||||
|
* @param refData ประเภทของตัวเลือก
|
||||||
|
*/
|
||||||
|
const filterSelector = (val: string, update: Function, refData: string) => {
|
||||||
switch (refData) {
|
switch (refData) {
|
||||||
case "prefixOps":
|
case "prefixOps":
|
||||||
update(() => {
|
update(() => {
|
||||||
|
|
@ -149,12 +151,20 @@ const filterSelector = (val: any, update: Function, refData: string) => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์เลือกวันเดือนปีเกิด
|
||||||
|
* @param modelData วันเดือนปีเกิด
|
||||||
|
*/
|
||||||
const handleDate = async (modelData: Date) => {
|
const handleDate = async (modelData: Date) => {
|
||||||
informaData.value.dateOfBirth = modelData;
|
informaData.value.dateOfBirth = modelData;
|
||||||
await calRetire(modelData);
|
await calRetire(modelData);
|
||||||
onEdit.value = true;
|
onEdit.value = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันคำนวนวันเกษียณอายุราชการ
|
||||||
|
* @param birth วันเดือนปีเกิด
|
||||||
|
*/
|
||||||
const calRetire = async (birth: Date) => {
|
const calRetire = async (birth: Date) => {
|
||||||
const body = {
|
const body = {
|
||||||
birthDate: dateToISO(birth),
|
birthDate: dateToISO(birth),
|
||||||
|
|
@ -179,13 +189,16 @@ const calRetire = async (birth: Date) => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* บันทึกการแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
const editData = async () => {
|
const editData = async () => {
|
||||||
dialogConfirm($q, async () => {
|
dialogConfirm($q, async () => {
|
||||||
if (age.value == false) {
|
if (age.value == false) {
|
||||||
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
|
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
showLoader();
|
||||||
const body: any = {
|
const body: any = {
|
||||||
citizenId: informaData.value.idCard,
|
citizenId: informaData.value.idCard,
|
||||||
prefix: informaData.value.prefixId,
|
prefix: informaData.value.prefixId,
|
||||||
|
|
@ -215,11 +228,16 @@ const editData = async () => {
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันการแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
const changeBtn = async () => {
|
const changeBtn = async () => {
|
||||||
if (edit.value == true) {
|
if (edit.value == true) {
|
||||||
if (props.statusEdit === true) {
|
if (props.statusEdit === true) {
|
||||||
|
|
@ -232,6 +250,17 @@ const changeBtn = async () => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
|
function checkEdit() {
|
||||||
|
onEdit.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันสำหรับคืนค่าชื่อคลาสตามค่าที่กำหนด
|
||||||
|
* @param val ค่าที่ใช้กำหนดคลาส
|
||||||
|
*/
|
||||||
const getClass = (val: boolean) => {
|
const getClass = (val: boolean) => {
|
||||||
return {
|
return {
|
||||||
"full-width inputgreen cursor-pointer": val,
|
"full-width inputgreen cursor-pointer": val,
|
||||||
|
|
@ -239,9 +268,12 @@ const getClass = (val: boolean) => {
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
function checkEdit() {
|
/**
|
||||||
onEdit.value = true;
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
}
|
*/
|
||||||
|
onMounted(async () => {
|
||||||
|
emit("update:statusEdit", false);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-card flat bordered class="col-12 q-px-lg q-py-md no-border">
|
<q-card flat bordered class="col-12 q-px-lg q-py-md no-border">
|
||||||
|
|
@ -300,7 +332,7 @@ function checkEdit() {
|
||||||
:label="`${'คำนำหน้า'}`"
|
:label="`${'คำนำหน้า'}`"
|
||||||
use-input
|
use-input
|
||||||
input-debounce="0"
|
input-debounce="0"
|
||||||
@filter="(inputValue:any,
|
@filter="(inputValue:string,
|
||||||
doneFn:Function) => filterSelector(inputValue, doneFn,'prefixOps'
|
doneFn:Function) => filterSelector(inputValue, doneFn,'prefixOps'
|
||||||
) "
|
) "
|
||||||
/>
|
/>
|
||||||
|
|
@ -417,7 +449,7 @@ function checkEdit() {
|
||||||
:label="`${'เพศ'}`"
|
:label="`${'เพศ'}`"
|
||||||
use-input
|
use-input
|
||||||
input-debounce="0"
|
input-debounce="0"
|
||||||
@filter="(inputValue:any,
|
@filter="(inputValue:string,
|
||||||
doneFn:Function) => filterSelector(inputValue, doneFn,'genderOps'
|
doneFn:Function) => filterSelector(inputValue, doneFn,'genderOps'
|
||||||
) "
|
) "
|
||||||
/>
|
/>
|
||||||
|
|
@ -443,7 +475,7 @@ function checkEdit() {
|
||||||
:label="`${'สถานภาพ'}`"
|
:label="`${'สถานภาพ'}`"
|
||||||
use-input
|
use-input
|
||||||
input-debounce="0"
|
input-debounce="0"
|
||||||
@filter="(inputValue:any,
|
@filter="(inputValue:string,
|
||||||
doneFn:Function) => filterSelector(inputValue, doneFn,'statusOps'
|
doneFn:Function) => filterSelector(inputValue, doneFn,'statusOps'
|
||||||
) "
|
) "
|
||||||
/>
|
/>
|
||||||
|
|
@ -468,7 +500,7 @@ function checkEdit() {
|
||||||
:label="`${'หมู่เลือด'}`"
|
:label="`${'หมู่เลือด'}`"
|
||||||
use-input
|
use-input
|
||||||
input-debounce="0"
|
input-debounce="0"
|
||||||
@filter="(inputValue:any,
|
@filter="(inputValue:string,
|
||||||
doneFn:Function) => filterSelector(inputValue, doneFn,'bloodOps'
|
doneFn:Function) => filterSelector(inputValue, doneFn,'bloodOps'
|
||||||
) "
|
) "
|
||||||
/>
|
/>
|
||||||
|
|
@ -524,7 +556,7 @@ function checkEdit() {
|
||||||
:label="`${'ศาสนา'}`"
|
:label="`${'ศาสนา'}`"
|
||||||
use-input
|
use-input
|
||||||
input-debounce="0"
|
input-debounce="0"
|
||||||
@filter="(inputValue:any,
|
@filter="(inputValue:string,
|
||||||
doneFn:Function) => filterSelector(inputValue, doneFn,'religionOps'
|
doneFn:Function) => filterSelector(inputValue, doneFn,'religionOps'
|
||||||
) "
|
) "
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,17 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useRoute } from "vue-router";
|
import { useRoute } from "vue-router";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
import type { PropType } from "vue";
|
import type { PropType } from "vue";
|
||||||
import type { Property } from "@/modules/05_placement/interface/index/Main";
|
import type { Property } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
|
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const mixin = useCounterMixin();
|
const mixin = useCounterMixin();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
|
@ -33,13 +33,12 @@ const props = defineProps({
|
||||||
});
|
});
|
||||||
const emit = defineEmits(["update:statusEdit", "update:data"]);
|
const emit = defineEmits(["update:statusEdit", "update:data"]);
|
||||||
|
|
||||||
const edit = ref<boolean>(false);
|
const edit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
const onEdit = ref<boolean>(false);
|
const onEdit = ref<boolean>(false); //การแก้ไขข้อมูล
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
emit("update:statusEdit", false);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันบันทึกการแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
const saveData = async () => {
|
const saveData = async () => {
|
||||||
dialogConfirm($q, async () => {
|
dialogConfirm($q, async () => {
|
||||||
showLoader();
|
showLoader();
|
||||||
|
|
@ -57,11 +56,16 @@ const saveData = async () => {
|
||||||
})
|
})
|
||||||
.catch((e: any) => {
|
.catch((e: any) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันการแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
const changeBtn = async () => {
|
const changeBtn = async () => {
|
||||||
if (edit.value == true) {
|
if (edit.value == true) {
|
||||||
if (props.statusEdit === true) {
|
if (props.statusEdit === true) {
|
||||||
|
|
@ -91,9 +95,19 @@ const onCancel = async () => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันแก้ไขข้อมูล
|
||||||
|
*/
|
||||||
function checkEdit() {
|
function checkEdit() {
|
||||||
onEdit.value = true;
|
onEdit.value = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
|
onMounted(() => {
|
||||||
|
emit("update:statusEdit", false);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-form ref="myform" greedy @submit.prevent @validation-success="saveData">
|
<q-form ref="myform" greedy @submit.prevent @validation-success="saveData">
|
||||||
|
|
@ -49,12 +49,18 @@ const emit = defineEmits([
|
||||||
"update:editvisible",
|
"update:editvisible",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const updateEdit = (value: Boolean) => {
|
/**
|
||||||
emit("update:editvisible", value);
|
* ฟังก์ชันอัปเดทคำค้นหา
|
||||||
};
|
* @param value คำค้นหา
|
||||||
|
*/
|
||||||
const updateInput = (value: string | number | null) => {
|
const updateInput = (value: string | number | null) => {
|
||||||
emit("update:inputfilter", value);
|
emit("update:inputfilter", value);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันอัปเดท Visible
|
||||||
|
* @param value Visible
|
||||||
|
*/
|
||||||
const updateVisible = (value: []) => {
|
const updateVisible = (value: []) => {
|
||||||
emit("update:inputvisible", value);
|
emit("update:inputvisible", value);
|
||||||
};
|
};
|
||||||
|
|
@ -63,20 +69,13 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
return start + "-" + end + " ใน " + total;
|
return start + "-" + end + " ใน " + total;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันเพิ่มข้อมูล
|
||||||
|
*/
|
||||||
const checkAdd = () => {
|
const checkAdd = () => {
|
||||||
props.add();
|
props.add();
|
||||||
};
|
};
|
||||||
|
|
||||||
const edit = async () => {
|
|
||||||
updateEdit(!props.editvisible);
|
|
||||||
props.edit();
|
|
||||||
};
|
|
||||||
|
|
||||||
const cancel = async () => {
|
|
||||||
updateEdit(!props.editvisible);
|
|
||||||
props.cancel();
|
|
||||||
};
|
|
||||||
|
|
||||||
const resetFilter = () => {
|
const resetFilter = () => {
|
||||||
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
|
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
|
||||||
emit("update:inputfilter", "");
|
emit("update:inputfilter", "");
|
||||||
|
|
@ -1,65 +0,0 @@
|
||||||
<!-- card รวม ข้อมูลส่วนตัว กับ ที่อยู่ -->
|
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, onMounted, watch } from "vue";
|
|
||||||
import Information from "@/modules/05_placement/components/PersonalDetail/Information/Information.vue";
|
|
||||||
import Address from "@/modules/05_placement/components/PersonalDetail/Information/Address.vue";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
statusEdit: {
|
|
||||||
type: Boolean,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
profileType: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const emit = defineEmits(["update:statusEdit"]);
|
|
||||||
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const { showLoader, hideLoader } = mixin;
|
|
||||||
const statusEdit = ref<boolean>(false);
|
|
||||||
const modalNoEdit = ref<boolean>(false);
|
|
||||||
const modalNoEditTittle = ref<string>("ไม่สามารถไม่สามารถแก้ไขข้อมูลได้?");
|
|
||||||
const modalNoEditDetail = ref<string>("มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล");
|
|
||||||
|
|
||||||
watch(statusEdit, (count: boolean, prevCount: boolean) => {
|
|
||||||
emit("update:statusEdit", count);
|
|
||||||
});
|
|
||||||
|
|
||||||
watch(props, (count: any, prevCount: any) => {
|
|
||||||
statusEdit.value = props.statusEdit;
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
// hideLoader();
|
|
||||||
});
|
|
||||||
|
|
||||||
const notiNoEdit = () => {
|
|
||||||
modalNoEdit.value = true;
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeModalError = () => {
|
|
||||||
modalNoEdit.value = false;
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<div class="row col-12 items-center">
|
|
||||||
<div>
|
|
||||||
<Information :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-12 q-px-md"><q-separator size="4px" /></div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<Address :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.horizontal-line {
|
|
||||||
background-color: #f4f4f4;
|
|
||||||
height: 5px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -13,18 +13,17 @@ import { useCounterMixin } from "@/stores/mixin";
|
||||||
const { date2Thai } = useCounterMixin();
|
const { date2Thai } = useCounterMixin();
|
||||||
|
|
||||||
/** props*/
|
/** 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 }); //id ตำแหน่งที่เลือก
|
||||||
const seletcId = defineModel<string>("seletcId", { required: true });
|
const seletcId = defineModel<string>("seletcId", { required: true }); // ตำแหน่งที่เลือก
|
||||||
const date = defineModel<Date>("datePos", { required: true });
|
const date = defineModel<Date>("datePos", { required: true }); //วันยที่รายงานคัว
|
||||||
const positionData = defineModel<any[]>("position", { required: true });
|
const positionData = defineModel<any[]>("position", { required: true }); //ข้อมูลรายการตำแหน่งเลขที่
|
||||||
const isAll = defineModel<boolean>("isAll", { required: true });
|
const isAll = defineModel<boolean>("isAll", { required: true }); //แสดงตำแหน่งทั้งหมด
|
||||||
const isBlank = defineModel<boolean>("isBlank", { required: true });
|
const isBlank = defineModel<boolean>("isBlank", { required: true }); //แสดงเฉพาะตำแหน่งว่าง
|
||||||
|
|
||||||
const filters = ref<string>("");
|
//Table
|
||||||
const rowsPosition = ref<Positions[]>([]);
|
const filters = ref<string>(""); //คำค้นหา
|
||||||
|
const rowsPosition = ref<Positions[]>([]); //รายการตำแหน่ง
|
||||||
/** columns*/
|
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "isPosition",
|
name: "isPosition",
|
||||||
|
|
@ -90,7 +89,6 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const columnsPostition = ref<QTableProps["columns"]>([
|
const columnsPostition = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
@ -165,7 +163,6 @@ const columnsPostition = ref<QTableProps["columns"]>([
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const visibleColumns = ref<string[]>([
|
const visibleColumns = ref<string[]>([
|
||||||
"isPosition",
|
"isPosition",
|
||||||
"no",
|
"no",
|
||||||
|
|
@ -195,10 +192,12 @@ async function onClickSelectPos(id: string) {
|
||||||
(e) => e.id === seletcId.value
|
(e) => e.id === seletcId.value
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
console.log(selected.value);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อ Components ถูกเรียกใช้งาน
|
||||||
|
*/
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
if (positionId.value) {
|
if (positionId.value) {
|
||||||
setTimeout(async () => {
|
setTimeout(async () => {
|
||||||
|
|
|
||||||
|
|
@ -1,22 +1,24 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, watch } from "vue";
|
import { ref, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
|
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
import type { QTableProps } from "quasar";
|
||||||
|
import type { DataEducation } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
import type {
|
||||||
|
DataPerson,
|
||||||
|
Education,
|
||||||
|
} from "@/modules/05_placement/interface/response/Main";
|
||||||
|
|
||||||
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
||||||
const { showLoader, hideLoader, date2Thai, messageError } = mixin;
|
const { showLoader, hideLoader, date2Thai, messageError } = mixin;
|
||||||
|
|
||||||
const rows = ref<any[]>([]);
|
|
||||||
const myForm = ref<any>([]);
|
|
||||||
const selection = ref<any>([]);
|
|
||||||
const personalForm = ref<any>([]);
|
|
||||||
|
|
||||||
/** รับค่ามาจากหน้าหลัก */
|
/** รับค่ามาจากหน้าหลัก */
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
Modal: Boolean,
|
Modal: Boolean,
|
||||||
|
|
@ -34,6 +36,9 @@ const props = defineProps({
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const rows = ref<DataEducation[]>([]);
|
||||||
|
const personalForm = ref<DataPerson>();
|
||||||
|
|
||||||
/**หัวตาราง */
|
/**หัวตาราง */
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
|
|
@ -78,16 +83,18 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
/** get ข้อมูลการศึกษา */
|
/**
|
||||||
|
* ฟังก์ชันดึงข้อมูลรายละเอียด
|
||||||
|
*/
|
||||||
async function fetchData() {
|
async function fetchData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
.get(config.API.getDatapersonal(props.personalId))
|
.get(config.API.getDatapersonal(props.personalId))
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
personalForm.value = res.data.result;
|
personalForm.value = res.data.result;
|
||||||
personalForm.value.education.map((e: any) => {
|
personalForm.value?.education.map((e: Education) => {
|
||||||
rows.value.push({
|
rows.value.push({
|
||||||
university: e.name,
|
university: e.institute,
|
||||||
degree: e.degree,
|
degree: e.degree,
|
||||||
major: e.field,
|
major: e.field,
|
||||||
graduation: date2Thai(e.finishDate),
|
graduation: date2Thai(e.finishDate),
|
||||||
|
|
@ -103,8 +110,8 @@ async function fetchData() {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* convert text
|
* ฟังก์ชันแปลงประเภทข้าราชการ เป็นไทย
|
||||||
* @param val type
|
* @param val ประเภทข้าราชการ
|
||||||
*/
|
*/
|
||||||
function formBmaofficer(val: string) {
|
function formBmaofficer(val: string) {
|
||||||
switch (val) {
|
switch (val) {
|
||||||
|
|
@ -119,14 +126,17 @@ function formBmaofficer(val: string) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** ปิด POPUP ข้อมูล */
|
/**
|
||||||
|
* ปิด POPUP ข้อมูล
|
||||||
|
*/
|
||||||
async function close() {
|
async function close() {
|
||||||
props.close();
|
props.close();
|
||||||
selection.value = [];
|
|
||||||
rows.value = [];
|
rows.value = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
/** เมื่อ props.Modal จะเรียกข้อมูลการศึกษา */
|
/**
|
||||||
|
* เมื่อ props.Modal เป็น true จะเรียกข้อมูลการศึกษา
|
||||||
|
*/
|
||||||
watch(props, () => {
|
watch(props, () => {
|
||||||
if (props.Modal === true) {
|
if (props.Modal === true) {
|
||||||
fetchData();
|
fetchData();
|
||||||
|
|
@ -136,9 +146,9 @@ watch(props, () => {
|
||||||
<template>
|
<template>
|
||||||
<q-dialog v-model="props.Modal" persistent>
|
<q-dialog v-model="props.Modal" persistent>
|
||||||
<q-card style="max-width: 100%; width: 80%">
|
<q-card style="max-width: 100%; width: 80%">
|
||||||
<q-form ref="myForm">
|
<q-form>
|
||||||
<DialogHeader
|
<DialogHeader
|
||||||
:tittle="`รายละเอียดของ ${personalForm.fullName}`"
|
:tittle="`รายละเอียดของ ${personalForm?.fullName}`"
|
||||||
:close="close"
|
:close="close"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|
@ -150,7 +160,7 @@ watch(props, () => {
|
||||||
<div class="row items-center q-pa-xs header-text">
|
<div class="row items-center q-pa-xs header-text">
|
||||||
ข้อมูลทั่วไป
|
ข้อมูลทั่วไป
|
||||||
<span
|
<span
|
||||||
v-if="personalForm.bmaOfficer != null"
|
v-if="personalForm?.bmaOfficer != null"
|
||||||
class="check-officer"
|
class="check-officer"
|
||||||
>
|
>
|
||||||
<q-icon name="mdi-check" />
|
<q-icon name="mdi-check" />
|
||||||
|
|
@ -166,10 +176,10 @@ watch(props, () => {
|
||||||
|
|
||||||
<div class="col-4 sub-text">
|
<div class="col-4 sub-text">
|
||||||
<div class="q-pb-md">
|
<div class="q-pb-md">
|
||||||
{{ personalForm.idCard }}
|
{{ personalForm?.idCard }}
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ date2Thai(personalForm.dateOfBirth) }}
|
{{ date2Thai(personalForm?.dateOfBirth) }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -179,10 +189,10 @@ watch(props, () => {
|
||||||
</div>
|
</div>
|
||||||
<div class="col-3 sub-text">
|
<div class="col-3 sub-text">
|
||||||
<div class="q-pb-md">
|
<div class="q-pb-md">
|
||||||
{{ personalForm.fullName }}
|
{{ personalForm?.fullName }}
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ personalForm.gender }}
|
{{ personalForm?.gender }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -195,7 +205,7 @@ watch(props, () => {
|
||||||
<div class="row q-pa-xs">
|
<div class="row q-pa-xs">
|
||||||
<div class="col-3 header-sub-text">ที่อยู่</div>
|
<div class="col-3 header-sub-text">ที่อยู่</div>
|
||||||
<div class="col-9 sub-text">
|
<div class="col-9 sub-text">
|
||||||
{{ personalForm.address }}
|
{{ personalForm?.registAddress }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</q-card>
|
||||||
|
|
@ -233,10 +243,10 @@ watch(props, () => {
|
||||||
</div>
|
</div>
|
||||||
<div class="col-5 sub-text-exam">
|
<div class="col-5 sub-text-exam">
|
||||||
<div class="q-pb-sm">
|
<div class="q-pb-sm">
|
||||||
{{ personalForm.pass }}
|
{{ personalForm?.pass }}
|
||||||
</div>
|
</div>
|
||||||
<div class="q-pb-sm">{{ personalForm.examNumber }}</div>
|
<div class="q-pb-sm">{{ personalForm?.examNumber }}</div>
|
||||||
<div class="q-pb-sm">{{ personalForm.examRound }}</div>
|
<div class="q-pb-sm">{{ personalForm?.examRound }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,32 +1,30 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { useRouter, useRoute } from "vue-router";
|
import { useQuasar } from "quasar";
|
||||||
import { tokenParsed } from "@/plugins/auth";
|
|
||||||
|
|
||||||
|
import { tokenParsed } from "@/plugins/auth";
|
||||||
|
import { useRouter, useRoute } from "vue-router";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { usePlacementDataStore } from "@/modules/05_placement/store";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { usePlacementDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
import CardTop from "@/modules/05_placement/components/PersonalList/StatCard.vue";
|
import CardTop from "@/modules/05_placement/components/PersonalList/StatCard.vue";
|
||||||
import AddTablePosition from "@/modules/05_placement/components/PersonalList/Table.vue";
|
import AddTablePosition from "@/modules/05_placement/components/PersonalList/Table.vue";
|
||||||
|
|
||||||
const DataStore = usePlacementDataStore();
|
const $q = useQuasar();
|
||||||
|
|
||||||
let roleAdmin = ref<boolean>(false);
|
|
||||||
const $q = useQuasar;
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const { messageError, showLoader, hideLoader } = mixin;
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
const DataStore = usePlacementDataStore();
|
||||||
|
const { messageError, showLoader, hideLoader } = mixin;
|
||||||
|
|
||||||
const examId = route.params.examId;
|
const examId = route.params.examId;
|
||||||
const year = ref<string>("");
|
const year = ref<string>("");
|
||||||
const round = ref<string>("");
|
const round = ref<string>("");
|
||||||
const title = ref<string>("");
|
const title = ref<string>("");
|
||||||
const examData = ref<any>();
|
const examData = ref<any>();
|
||||||
|
const roleAdmin = ref<boolean>(false);
|
||||||
const stat = ref<any>({
|
const stat = ref<any>({
|
||||||
total: 0,
|
total: 0,
|
||||||
unContain: 0,
|
unContain: 0,
|
||||||
|
|
@ -35,7 +33,9 @@ const stat = ref<any>({
|
||||||
disclaim: 0,
|
disclaim: 0,
|
||||||
});
|
});
|
||||||
|
|
||||||
/** เรียกข้อมูล Stat */
|
/**
|
||||||
|
* เรียกข้อมูล Stat
|
||||||
|
*/
|
||||||
async function getStat() {
|
async function getStat() {
|
||||||
const examIdString = Array.isArray(examId) ? examId[0] : examId;
|
const examIdString = Array.isArray(examId) ? examId[0] : examId;
|
||||||
await http
|
await http
|
||||||
|
|
@ -56,7 +56,9 @@ async function getStat() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** get รายละเอียด ของการสอบ */
|
/**
|
||||||
|
* get รายละเอียด ของการสอบ
|
||||||
|
*/
|
||||||
async function fetchPlacementData() {
|
async function fetchPlacementData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
|
||||||
|
|
@ -16,13 +16,23 @@ import type { QTableProps } from "quasar";
|
||||||
import type { DataList } from "@/modules/05_placement/interface/response/SelectOrg";
|
import type { DataList } from "@/modules/05_placement/interface/response/SelectOrg";
|
||||||
|
|
||||||
import DialogSelectOrg from "@/modules/05_placement/components/PersonalList/DialogSelectOrg.vue";
|
import DialogSelectOrg from "@/modules/05_placement/components/PersonalList/DialogSelectOrg.vue";
|
||||||
|
|
||||||
import Table from "@/modules/05_placement/components/PersonalList/TableView.vue";
|
import Table from "@/modules/05_placement/components/PersonalList/TableView.vue";
|
||||||
import DialogCard from "@/modules/05_placement/components/PersonalList/DialogDetail.vue";
|
import DialogCard from "@/modules/05_placement/components/PersonalList/DialogDetail.vue";
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
|
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
|
|
||||||
let roleAdmin = ref<boolean>(false);
|
const route = useRoute();
|
||||||
|
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
||||||
|
const $q = useQuasar(); // show dialog
|
||||||
|
const {
|
||||||
|
messageError,
|
||||||
|
showLoader,
|
||||||
|
hideLoader,
|
||||||
|
dateText,
|
||||||
|
success,
|
||||||
|
dialogConfirm,
|
||||||
|
date2Thai,
|
||||||
|
} = mixin;
|
||||||
|
|
||||||
/** รับค่ามาจากหน้าหลัก */
|
/** รับค่ามาจากหน้าหลัก */
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
|
@ -32,6 +42,7 @@ const props = defineProps({
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
let roleAdmin = ref<boolean>(false);
|
||||||
const edit = ref<boolean>(true);
|
const edit = ref<boolean>(true);
|
||||||
const modal = ref<boolean>(false); //modal ขอผ่อนผัน + สละสิทธิ์
|
const modal = ref<boolean>(false); //modal ขอผ่อนผัน + สละสิทธิ์
|
||||||
const editRow = ref<boolean>(false); //เช็คมีการแก้ไขข้อมูล
|
const editRow = ref<boolean>(false); //เช็คมีการแก้ไขข้อมูล
|
||||||
|
|
@ -49,8 +60,7 @@ const rows = ref<any[]>([]);
|
||||||
const rowsFilter = ref<any>([]);
|
const rowsFilter = ref<any>([]);
|
||||||
const myForm = ref<any>();
|
const myForm = ref<any>();
|
||||||
const files = ref<any>(null);
|
const files = ref<any>(null);
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const $q = useQuasar(); // show dialog
|
|
||||||
const appointModal = ref<boolean>(false);
|
const appointModal = ref<boolean>(false);
|
||||||
const getNumFile = ref(0);
|
const getNumFile = ref(0);
|
||||||
const dataRes = ref<any>([]);
|
const dataRes = ref<any>([]);
|
||||||
|
|
@ -69,25 +79,12 @@ const checkSelected = computed(() => {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
const pagination = ref({
|
|
||||||
page: 1,
|
|
||||||
rowsPerPage: 10,
|
|
||||||
});
|
|
||||||
const dataInfo = reactive({
|
const dataInfo = reactive({
|
||||||
reason: "",
|
reason: "",
|
||||||
reliefDoc: "",
|
reliefDoc: "",
|
||||||
});
|
});
|
||||||
const {
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
dateText,
|
|
||||||
success,
|
|
||||||
dialogConfirm,
|
|
||||||
date2Thai,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const examId = route.params.examId;
|
const examId = route.params.examId;
|
||||||
const examIdString = Array.isArray(examId) ? examId[0] : examId;
|
const examIdString = Array.isArray(examId) ? examId[0] : examId;
|
||||||
const personalId = ref<string>("");
|
const personalId = ref<string>("");
|
||||||
|
|
@ -251,6 +248,10 @@ function convertContainStatus(val: string, type: string = "") {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* แปลงสถานะ
|
||||||
|
* @param val type
|
||||||
|
*/
|
||||||
function convertTypeCommand(val: string) {
|
function convertTypeCommand(val: string) {
|
||||||
switch (val) {
|
switch (val) {
|
||||||
case "APPOINTED":
|
case "APPOINTED":
|
||||||
|
|
@ -281,7 +282,9 @@ function convertDraft(val: boolean) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**เรียกข้อมูลรายชื่อผู้สอบผ่าน */
|
/**
|
||||||
|
* เรียกข้อมูลรายชื่อผู้สอบผ่าน
|
||||||
|
*/
|
||||||
async function getTable() {
|
async function getTable() {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
@ -389,7 +392,9 @@ async function getTable() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**ยืนยันการผ่อนผัน */
|
/**
|
||||||
|
* ยืนยันการผ่อนผัน
|
||||||
|
*/
|
||||||
async function saveDeferment() {
|
async function saveDeferment() {
|
||||||
myForm.value.validate().then(async (result: boolean) => {
|
myForm.value.validate().then(async (result: boolean) => {
|
||||||
if (result) {
|
if (result) {
|
||||||
|
|
@ -402,7 +407,9 @@ async function saveDeferment() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
/**post ผ่อนผัน */
|
/**
|
||||||
|
* post ผ่อนผัน
|
||||||
|
*/
|
||||||
async function postDeferment() {
|
async function postDeferment() {
|
||||||
showLoader();
|
showLoader();
|
||||||
const formData = new FormData();
|
const formData = new FormData();
|
||||||
|
|
@ -425,7 +432,9 @@ async function postDeferment() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**ยืนยันการสละสิทธิ์ */
|
/**
|
||||||
|
* ยืนยันการสละสิทธิ์
|
||||||
|
*/
|
||||||
async function saveDisclaim() {
|
async function saveDisclaim() {
|
||||||
myForm.value.validate().then(async (result: boolean) => {
|
myForm.value.validate().then(async (result: boolean) => {
|
||||||
if (result) {
|
if (result) {
|
||||||
|
|
@ -439,7 +448,9 @@ async function saveDisclaim() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**post การสละสิทธิ์ */
|
/**
|
||||||
|
* post การสละสิทธิ์
|
||||||
|
*/
|
||||||
async function postDisclaimf() {
|
async function postDisclaimf() {
|
||||||
showLoader();
|
showLoader();
|
||||||
const dataPost = {
|
const dataPost = {
|
||||||
|
|
@ -462,12 +473,16 @@ async function postDisclaimf() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** เปิด dialog */
|
/** เ
|
||||||
|
* ปิด dialog
|
||||||
|
*/
|
||||||
function clickEditRow() {
|
function clickEditRow() {
|
||||||
editRow.value = true;
|
editRow.value = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** เปลี่ยน class true/false */
|
/**
|
||||||
|
* เปลี่ยน class true/false
|
||||||
|
*/
|
||||||
function getClass(val: boolean) {
|
function getClass(val: boolean) {
|
||||||
return {
|
return {
|
||||||
"full-width inputgreen cursor-pointer ": val,
|
"full-width inputgreen cursor-pointer ": val,
|
||||||
|
|
@ -553,26 +568,23 @@ function openAppointModal(
|
||||||
data: DataList,
|
data: DataList,
|
||||||
typeCommandVal: "APPOINTED" | "APPOINT" | "SLIP" | "MOVE"
|
typeCommandVal: "APPOINTED" | "APPOINT" | "SLIP" | "MOVE"
|
||||||
) {
|
) {
|
||||||
// appointModal.value = true;
|
|
||||||
// personalId.value = pid;
|
|
||||||
// personal.value = dataRes.value.filter(
|
|
||||||
// (e: any) => e.personalId == personalId.value
|
|
||||||
// );
|
|
||||||
// console.log(personal.value);
|
|
||||||
|
|
||||||
dataRow.value = data;
|
dataRow.value = data;
|
||||||
typeCommand.value = typeCommandVal;
|
typeCommand.value = typeCommandVal;
|
||||||
modalDialogSelectOrg.value = !modalDialogSelectOrg.value;
|
modalDialogSelectOrg.value = !modalDialogSelectOrg.value;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** close dialog */
|
/**
|
||||||
|
* close dialog
|
||||||
|
*/
|
||||||
async function clickCloseModalTree() {
|
async function clickCloseModalTree() {
|
||||||
await getTable();
|
await getTable();
|
||||||
appointModal.value = false;
|
appointModal.value = false;
|
||||||
props.statCard();
|
props.statCard();
|
||||||
}
|
}
|
||||||
|
|
||||||
/** validate */
|
/**
|
||||||
|
* validate
|
||||||
|
*/
|
||||||
async function validateData() {
|
async function validateData() {
|
||||||
checkValidate.value = true;
|
checkValidate.value = true;
|
||||||
await myForm.value.validate().then((result: boolean) => {
|
await myForm.value.validate().then((result: boolean) => {
|
||||||
|
|
@ -582,12 +594,16 @@ async function validateData() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** ปิด dialog */
|
/**
|
||||||
|
* ปิด dialog
|
||||||
|
*/
|
||||||
function clickCloseSendModal() {
|
function clickCloseSendModal() {
|
||||||
modaladdlist.value = false;
|
modaladdlist.value = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** validate */
|
/**
|
||||||
|
* validate
|
||||||
|
*/
|
||||||
async function clickClose() {
|
async function clickClose() {
|
||||||
userNote.value = "";
|
userNote.value = "";
|
||||||
if (editRow.value == true) {
|
if (editRow.value == true) {
|
||||||
|
|
@ -610,7 +626,9 @@ async function clickClose() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** ยืนยันส่งรายชื่อไปหน่วยงาน */
|
/**
|
||||||
|
* ยืนยันส่งรายชื่อไปหน่วยงาน
|
||||||
|
*/
|
||||||
function savelist() {
|
function savelist() {
|
||||||
selected.value.map((e: any) => {
|
selected.value.map((e: any) => {
|
||||||
personal_selected.value.push(e.personalId);
|
personal_selected.value.push(e.personalId);
|
||||||
|
|
@ -654,14 +672,6 @@ function paginationLabel(start: number, end: number, total: number) {
|
||||||
else return start + "-" + end + " ใน " + total;
|
else return start + "-" + end + " ใน " + total;
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(containStatus, () => {
|
|
||||||
if (containStatus.value) {
|
|
||||||
rows.value = rowsAll.value.filter((x: any) => x.statusId == "CONTAIN");
|
|
||||||
} else {
|
|
||||||
rows.value = rowsAll.value.filter((x: any) => x.statusId != "CONTAIN");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function onRestorePos(id: string) {
|
function onRestorePos(id: string) {
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
$q,
|
$q,
|
||||||
|
|
@ -713,6 +723,14 @@ function onSubmitDate() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
watch(containStatus, () => {
|
||||||
|
if (containStatus.value) {
|
||||||
|
rows.value = rowsAll.value.filter((x: any) => x.statusId == "CONTAIN");
|
||||||
|
} else {
|
||||||
|
rows.value = rowsAll.value.filter((x: any) => x.statusId != "CONTAIN");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const user = await tokenParsed();
|
const user = await tokenParsed();
|
||||||
if (user) {
|
if (user) {
|
||||||
|
|
@ -754,7 +772,7 @@ onMounted(async () => {
|
||||||
:boss="true"
|
:boss="true"
|
||||||
:saveNoDraft="true"
|
:saveNoDraft="true"
|
||||||
:role-admin="roleAdmin"
|
:role-admin="roleAdmin"
|
||||||
:displayAdd="displayAdd"
|
:display-add="displayAdd"
|
||||||
row-key="fullname"
|
row-key="fullname"
|
||||||
>
|
>
|
||||||
<template #columns="props">
|
<template #columns="props">
|
||||||
|
|
@ -1382,24 +1400,6 @@ onMounted(async () => {
|
||||||
</div>
|
</div>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<!-- <div class="row col-12 text-no-wrap items-center">
|
|
||||||
<img
|
|
||||||
v-if="props.row.avatar == ''"
|
|
||||||
src="@/assets/avatar_user.jpg"
|
|
||||||
class="col-4 img-info"
|
|
||||||
/>
|
|
||||||
<img
|
|
||||||
v-else
|
|
||||||
:src="props.row.avatar"
|
|
||||||
class="col-4 img-info"
|
|
||||||
/>
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="text-weight-medium">{{ props.row.name }}</div>
|
|
||||||
<div class="text-weight-light">
|
|
||||||
{{ props.row.idCard }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="col.name === 'examNumber'">
|
<template v-else-if="col.name === 'examNumber'">
|
||||||
<div class="text-weight-medium">
|
<div class="text-weight-medium">
|
||||||
|
|
@ -1482,17 +1482,6 @@ onMounted(async () => {
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
<!-- <template v-slot:pagination="scope">
|
|
||||||
<q-pagination
|
|
||||||
v-model="pagination.page"
|
|
||||||
color="primary"
|
|
||||||
:max="scope.pagesNumber"
|
|
||||||
:max-pages="5"
|
|
||||||
size="sm"
|
|
||||||
boundary-links
|
|
||||||
direction-links
|
|
||||||
></q-pagination>
|
|
||||||
</template> -->
|
|
||||||
</d-table>
|
</d-table>
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
<q-separator />
|
<q-separator />
|
||||||
|
|
@ -1513,10 +1502,10 @@ onMounted(async () => {
|
||||||
<!-- เลือกหน่วยงานที่บรรจุ -->
|
<!-- เลือกหน่วยงานที่บรรจุ -->
|
||||||
<DialogSelectOrg
|
<DialogSelectOrg
|
||||||
v-model:modal="modalDialogSelectOrg"
|
v-model:modal="modalDialogSelectOrg"
|
||||||
:dataRow="dataRow"
|
:data-row="dataRow"
|
||||||
:fetchTable="getTable"
|
:fetch-table="getTable"
|
||||||
:fetchStatCard="statCard"
|
:fetch-stat-card="statCard"
|
||||||
:typeCommand="typeCommand"
|
:type-command="typeCommand"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<!-- dialog วันรายงานตัว-->
|
<!-- dialog วันรายงานตัว-->
|
||||||
|
|
|
||||||
|
|
@ -1,927 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, onMounted, reactive, watch } from "vue";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
import { useRouter } from "vue-router";
|
|
||||||
import type { QForm } from "quasar";
|
|
||||||
|
|
||||||
import { useProfileDataStore } from "@/modules/08_registryEmployee/store";
|
|
||||||
import type {
|
|
||||||
Information,
|
|
||||||
DataOption,
|
|
||||||
DataOptioninfo,
|
|
||||||
} from "@/modules/04_registry/components/profileType";
|
|
||||||
import type {
|
|
||||||
InformationOps,
|
|
||||||
FormAddPerson,
|
|
||||||
DataType,
|
|
||||||
} from "@/modules/04_registry/interface/index/Main";
|
|
||||||
import HeaderTop from "@/modules/08_registryEmployee/components/AddEmployee/HeaderTop.vue";
|
|
||||||
|
|
||||||
const retireDate = ref<Date>();
|
|
||||||
const router = useRouter();
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
success,
|
|
||||||
dateToISO,
|
|
||||||
messageError,
|
|
||||||
dialogMessageNotify,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const profileStore = useProfileDataStore();
|
|
||||||
const { changeRetireText } = profileStore;
|
|
||||||
|
|
||||||
const age = ref<string | null>("");
|
|
||||||
|
|
||||||
const informaData = ref<FormAddPerson>({
|
|
||||||
prefix: "",
|
|
||||||
firstName: "",
|
|
||||||
lastName: "",
|
|
||||||
citizenId: "",
|
|
||||||
birthDate: null,
|
|
||||||
age: null,
|
|
||||||
genderId: null,
|
|
||||||
bloodId: null,
|
|
||||||
nationality: null,
|
|
||||||
ethnicity: null,
|
|
||||||
statusId: null,
|
|
||||||
religionId: null,
|
|
||||||
tel: null,
|
|
||||||
employeeType: null,
|
|
||||||
employeeClass: null,
|
|
||||||
profileType: null,
|
|
||||||
});
|
|
||||||
|
|
||||||
const dateBefore = ref<Date>(new Date());
|
|
||||||
// รายการข้อมูลทั้งหมด
|
|
||||||
const Ops = ref<InformationOps>({
|
|
||||||
prefixOps: [],
|
|
||||||
prefixOldOps: [],
|
|
||||||
genderOps: [],
|
|
||||||
bloodOps: [],
|
|
||||||
statusOps: [],
|
|
||||||
religionOps: [],
|
|
||||||
employeeClassOps: [],
|
|
||||||
employeeTypeOps: [],
|
|
||||||
});
|
|
||||||
// ข้อมูลเมื่อเลือกแล้ว
|
|
||||||
const OpsFilter = ref<InformationOps>({
|
|
||||||
prefixOps: [],
|
|
||||||
prefixOldOps: [],
|
|
||||||
genderOps: [],
|
|
||||||
bloodOps: [],
|
|
||||||
statusOps: [],
|
|
||||||
religionOps: [],
|
|
||||||
employeeClassOps: [],
|
|
||||||
employeeTypeOps: [],
|
|
||||||
});
|
|
||||||
|
|
||||||
/*** get รายการข้อมูลเกี่ยวกับบุคคล (dropdown list) */
|
|
||||||
const fetchPerson = async () => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(config.API.profileNewMetaMain)
|
|
||||||
.then((res) => {
|
|
||||||
const data = res.data.result;
|
|
||||||
let optionbloodGroups: DataOption[] = [];
|
|
||||||
data.bloodGroups.map((r: DataOptioninfo) => {
|
|
||||||
optionbloodGroups.push({
|
|
||||||
id: r.id.toString(),
|
|
||||||
name: r.name.toString(),
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Ops.value.bloodOps = optionbloodGroups;
|
|
||||||
OpsFilter.value.bloodOps = optionbloodGroups;
|
|
||||||
|
|
||||||
let optiongenders: DataOption[] = [];
|
|
||||||
data.genders.map((r: DataOptioninfo) => {
|
|
||||||
optiongenders.push({
|
|
||||||
id: r.id.toString(),
|
|
||||||
name: r.name.toString(),
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Ops.value.genderOps = optiongenders;
|
|
||||||
OpsFilter.value.genderOps = optiongenders;
|
|
||||||
|
|
||||||
let optionprefixs: DataOption[] = [];
|
|
||||||
optionprefixs = data.prefixs.map((v: any) => ({
|
|
||||||
id: v.id,
|
|
||||||
name: v.name,
|
|
||||||
}));
|
|
||||||
|
|
||||||
Ops.value.prefixOps = optionprefixs;
|
|
||||||
OpsFilter.value.prefixOps = optionprefixs;
|
|
||||||
|
|
||||||
let optionrelationships: DataOption[] = [];
|
|
||||||
data.relationships.map((r: DataOptioninfo) => {
|
|
||||||
optionrelationships.push({
|
|
||||||
id: r.id.toString(),
|
|
||||||
name: r.name.toString(),
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Ops.value.statusOps = optionrelationships;
|
|
||||||
OpsFilter.value.statusOps = optionrelationships;
|
|
||||||
|
|
||||||
let optionreligions: DataOption[] = [];
|
|
||||||
data.religions.map((r: DataOptioninfo) => {
|
|
||||||
optionreligions.push({
|
|
||||||
id: r.id.toString(),
|
|
||||||
name: r.name.toString(),
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Ops.value.religionOps = optionreligions;
|
|
||||||
OpsFilter.value.religionOps = optionreligions;
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// รูป profile
|
|
||||||
const inputImage = ref<any>(null);
|
|
||||||
const image = ref<any>(null);
|
|
||||||
const fileData = ref<any>(null);
|
|
||||||
const uploadImage = async (e: any) => {
|
|
||||||
const input = e.target.files;
|
|
||||||
if (input.length > 0) {
|
|
||||||
const url = URL.createObjectURL(input[0]);
|
|
||||||
image.value = url;
|
|
||||||
fileData.value = input[0];
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// คลิกแก้ไขรูป profile
|
|
||||||
const addNewImage = async () => {
|
|
||||||
inputImage.value.click();
|
|
||||||
};
|
|
||||||
|
|
||||||
// ตรวจสอบเลขประจำตัวประชาชน
|
|
||||||
const defaultCitizenData = ref<string>("");
|
|
||||||
const changeCardID = async (value: string | number | null) => {
|
|
||||||
if (value != null && typeof value == "string") {
|
|
||||||
if (value.length == 13 && value != defaultCitizenData.value) {
|
|
||||||
await checkCitizen(value);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* function เช็คเลขประจำตัวประชาชนช้ำ
|
|
||||||
* @param id เลขประจำตัวประชาชน
|
|
||||||
*/
|
|
||||||
const checkCitizen = async (id: string) => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.profileNewCitizenId(id), {
|
|
||||||
citizenId: id,
|
|
||||||
})
|
|
||||||
.then(() => {})
|
|
||||||
.catch((err) => {
|
|
||||||
if (err.response.data.status === 500) {
|
|
||||||
dialogMessageNotify($q, err.response.data.message);
|
|
||||||
} else {
|
|
||||||
messageError($q, err);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// filter list ข้อมูลต่างๆ
|
|
||||||
const filterSelector = (val: any, update: Function, refData: string) => {
|
|
||||||
switch (refData) {
|
|
||||||
case "prefixOps":
|
|
||||||
update(() => {
|
|
||||||
Ops.value.prefixOps = OpsFilter.value.prefixOps.filter(
|
|
||||||
(v: DataOption) => v.name.indexOf(val) > -1
|
|
||||||
);
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
case "genderOps":
|
|
||||||
update(() => {
|
|
||||||
Ops.value.genderOps = OpsFilter.value.genderOps.filter(
|
|
||||||
(v: DataOption) => v.name.indexOf(val) > -1
|
|
||||||
);
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
case "bloodOps":
|
|
||||||
update(() => {
|
|
||||||
Ops.value.bloodOps = OpsFilter.value.bloodOps.filter(
|
|
||||||
(v: DataOption) => v.name.indexOf(val) > -1
|
|
||||||
);
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
case "statusOps":
|
|
||||||
update(() => {
|
|
||||||
Ops.value.statusOps = OpsFilter.value.statusOps.filter(
|
|
||||||
(v: DataOption) => v.name.indexOf(val) > -1
|
|
||||||
);
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
case "religionOps":
|
|
||||||
update(() => {
|
|
||||||
Ops.value.religionOps = OpsFilter.value.religionOps.filter(
|
|
||||||
(v: DataOption) => v.name.indexOf(val) > -1
|
|
||||||
);
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// เช็ควันที่ที่สามารถเลือกวันเกิดได้โดย max date น้อยกว่าวันปัจจุบัน เพื่อให้ฟังก์ชั่นการเช็คทำงานได้ปกติ
|
|
||||||
const calculateMaxDate = () => {
|
|
||||||
const today = new Date();
|
|
||||||
today.setFullYear(today.getFullYear() - 18);
|
|
||||||
return today;
|
|
||||||
};
|
|
||||||
|
|
||||||
// post เพิ่มข้อมูลทะเบียนประวัติไปที่ api
|
|
||||||
const onSubmit = async () => {
|
|
||||||
const formData = new FormData();
|
|
||||||
if (fileData.value != null) formData.append("File", fileData.value); //แก้ไขรูป
|
|
||||||
if (informaData.value.citizenId != undefined)
|
|
||||||
formData.append("citizenId", informaData.value.citizenId);
|
|
||||||
if (informaData.value.prefix != undefined)
|
|
||||||
formData.append("prefix", informaData.value.prefix);
|
|
||||||
if (informaData.value.firstName != undefined)
|
|
||||||
formData.append("firstName", informaData.value.firstName);
|
|
||||||
if (informaData.value.lastName != undefined)
|
|
||||||
formData.append("lastName", informaData.value.lastName);
|
|
||||||
if (informaData.value.genderId != undefined)
|
|
||||||
formData.append("gender", informaData.value.genderId);
|
|
||||||
if (informaData.value.nationality != undefined)
|
|
||||||
formData.append("nationality", informaData.value.nationality);
|
|
||||||
if (informaData.value.ethnicity != undefined)
|
|
||||||
formData.append("race", informaData.value.ethnicity);
|
|
||||||
if (informaData.value.religionId != undefined)
|
|
||||||
formData.append("religion", informaData.value.religionId);
|
|
||||||
if (informaData.value.birthDate != undefined)
|
|
||||||
formData.append(
|
|
||||||
"birthDate",
|
|
||||||
dateToISO(informaData.value.birthDate) ?? dateToISO(new Date())
|
|
||||||
);
|
|
||||||
if (informaData.value.bloodId != undefined)
|
|
||||||
formData.append("bloodGroup", informaData.value.bloodId);
|
|
||||||
if (informaData.value.statusId != undefined)
|
|
||||||
formData.append("relationship", informaData.value.statusId);
|
|
||||||
if (informaData.value.tel != undefined)
|
|
||||||
formData.append("telephoneNumber", informaData.value.tel);
|
|
||||||
if (informaData.value.employeeType != undefined)
|
|
||||||
formData.append("employeeType", informaData.value.employeeType);
|
|
||||||
if (informaData.value.employeeClass != undefined)
|
|
||||||
formData.append("employeeClass", informaData.value.employeeClass);
|
|
||||||
|
|
||||||
dialogConfirm($q, async () => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.post(config.API.receiveData(), formData)
|
|
||||||
.then(async (res) => {
|
|
||||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
|
||||||
await clickBack();
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// ปุ่ม back
|
|
||||||
const clickBack = () => {
|
|
||||||
router.push("/placement/receive");
|
|
||||||
};
|
|
||||||
|
|
||||||
function calculateAge(birthDate: Date | null) {
|
|
||||||
if (!birthDate) return null;
|
|
||||||
const birthDateTimeStamp = new Date(birthDate).getTime();
|
|
||||||
const now = new Date();
|
|
||||||
const diff = now.getTime() - birthDateTimeStamp;
|
|
||||||
|
|
||||||
const ageDate = new Date(diff);
|
|
||||||
const years = ageDate.getUTCFullYear() - 1970;
|
|
||||||
const months = ageDate.getUTCMonth();
|
|
||||||
const days = ageDate.getUTCDate() - 1;
|
|
||||||
const retire = new Date(birthDate);
|
|
||||||
retire.setFullYear(retire.getFullYear() + 60);
|
|
||||||
retireDate.value = retire;
|
|
||||||
|
|
||||||
if (years > 60) {
|
|
||||||
return "อายุเกิน 60 ปี";
|
|
||||||
}
|
|
||||||
|
|
||||||
return `${years} ปี ${months} เดือน ${days} วัน`;
|
|
||||||
}
|
|
||||||
|
|
||||||
watch(
|
|
||||||
() => informaData.value.birthDate,
|
|
||||||
(v) => {
|
|
||||||
if (v) {
|
|
||||||
age.value = calculateAge(v);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
await fetchPerson();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<!-- <q-card flat bordered class="col-12 q-px-lg q-py-md">
|
|
||||||
<HeaderTop header="ข้อมูลส่วนตัว" icon="mdi-account" />
|
|
||||||
<q-form ref="myform" class="col-12 q-pt-md">
|
|
||||||
<div class="row">
|
|
||||||
<div class="row col-12 q-col-gutter-x-sm q-mb-xs">
|
|
||||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
v-model="informaData.citizenId"
|
|
||||||
dense
|
|
||||||
@update:model-value="changeCardID"
|
|
||||||
lazy-rules
|
|
||||||
:rules="[
|
|
||||||
(val: string) => !!val || `${'กรุณากรอก เลขประจำตัวประชาชน'}`,
|
|
||||||
(val: string) =>
|
|
||||||
val.length >= 13 ||
|
|
||||||
`${'กรุณากรอกเลขประจำตัวประชาชนให้ครบ'}`,
|
|
||||||
]"
|
|
||||||
label="เลขประจำตัวประชาชน"
|
|
||||||
maxlength="13"
|
|
||||||
mask="#############"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
|
||||||
<selector
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.prefix"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="Ops.prefixOps"
|
|
||||||
option-value="id"
|
|
||||||
:label="`${'คำนำหน้าชื่อ'}`"
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
@filter="(inputValue: any, doneFn: Function) => filterSelector(inputValue, doneFn, 'prefixOps')"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.firstName"
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
|
|
||||||
:label="`${'ชื่อ'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.lastName"
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
|
|
||||||
:label="`${'นามสกุล'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row col-12 q-col-gutter-x-sm q-mb-xs">
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<datepicker
|
|
||||||
v-model="informaData.birthDate"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
:max-date="calculateMaxDate()"
|
|
||||||
@update:model-value="handleDate"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">
|
|
||||||
{{ year + 543 }}
|
|
||||||
</template>
|
|
||||||
<template #year-overlay-value="{ value }">
|
|
||||||
{{ parseInt(value + 543) }}
|
|
||||||
</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:model-value="
|
|
||||||
informaData.birthDate == null
|
|
||||||
? null
|
|
||||||
: date2Thai(informaData.birthDate)
|
|
||||||
"
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`]"
|
|
||||||
:label="`${'วัน/เดือน/ปี เกิด'}`"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
style="color: var(--q-primary)"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
readonly
|
|
||||||
borderless
|
|
||||||
style="padding: 0 12px"
|
|
||||||
:model-value="informaData.age"
|
|
||||||
:label="`${'อายุ'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<selector
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.genderId"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="Ops.genderOps"
|
|
||||||
option-value="id"
|
|
||||||
:label="`${'เพศ'}`"
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'genderOps'
|
|
||||||
)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<selector
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.statusId"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="Ops.statusOps"
|
|
||||||
option-value="id"
|
|
||||||
:label="`${'สถานภาพ'}`"
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'statusOps'
|
|
||||||
)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.nationality"
|
|
||||||
:label="`${'สัญชาติ'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.ethnicity"
|
|
||||||
:label="`${'เชื้อชาติ'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row col-12 q-col-gutter-x-sm q-mb-xs">
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<selector
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.religionId"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="Ops.religionOps"
|
|
||||||
option-value="id"
|
|
||||||
:label="`${'ศาสนา'}`"
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'religionOps'
|
|
||||||
)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<selector
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="informaData.bloodId"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="Ops.bloodOps"
|
|
||||||
option-value="id"
|
|
||||||
:label="`${'หมู่เลือด'}`"
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'bloodOps'
|
|
||||||
)"
|
|
||||||
clearable
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-2 col-md-2">
|
|
||||||
<q-input
|
|
||||||
hide-bottom-space
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
type="tel"
|
|
||||||
v-model="informaData.tel"
|
|
||||||
:label="`${'เบอร์โทร'}`"
|
|
||||||
mask="##########"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-form>
|
|
||||||
<div class="col-12 q-pt-md q-pb-sm"><q-separator /></div>
|
|
||||||
<div class="row col-12">
|
|
||||||
<q-space />
|
|
||||||
<q-btn
|
|
||||||
unelevated
|
|
||||||
dense
|
|
||||||
class="q-px-md items-center"
|
|
||||||
color="light-blue-10"
|
|
||||||
label="บันทึก"
|
|
||||||
@click="saveData"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</q-card> -->
|
|
||||||
|
|
||||||
<!-- Header -->
|
|
||||||
<q-page-sticky
|
|
||||||
position="top"
|
|
||||||
expand
|
|
||||||
class="bg-grey-2 text-white"
|
|
||||||
style="z-index: 99; padding: 0% 1% 0% 1%"
|
|
||||||
>
|
|
||||||
<div class="row col-12 q-gutter-sm q-pb-sm text-dark no-wrap items-center">
|
|
||||||
<q-btn
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
class="bg-teal-1 full-height"
|
|
||||||
color="primary"
|
|
||||||
icon="mdi-chevron-left"
|
|
||||||
dense
|
|
||||||
@click="router.push(`/placement/receive`)"
|
|
||||||
>
|
|
||||||
</q-btn>
|
|
||||||
<q-avatar size="65px" rounded class="containerimage">
|
|
||||||
<img
|
|
||||||
v-if="image == null"
|
|
||||||
src="@/assets/avatar_user.jpg"
|
|
||||||
class="bg-grey-3"
|
|
||||||
style="object-fit: cover"
|
|
||||||
/>
|
|
||||||
<img :src="image" class="bg-grey-3" style="object-fit: cover" />
|
|
||||||
<div
|
|
||||||
class="overlay absolute-bottom text-subtitle2 text-center cursor-pointer"
|
|
||||||
@click="addNewImage()"
|
|
||||||
>
|
|
||||||
<q-icon name="mdi-camera" size="18px" color="blue">
|
|
||||||
<q-tooltip>อัปเดตรูปภาพ</q-tooltip>
|
|
||||||
</q-icon>
|
|
||||||
|
|
||||||
<input
|
|
||||||
type="file"
|
|
||||||
style="display: none"
|
|
||||||
ref="inputImage"
|
|
||||||
accept="image/*"
|
|
||||||
@change="uploadImage"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</q-avatar>
|
|
||||||
|
|
||||||
<div class="row items-center text-dark q-ml-md">
|
|
||||||
<div class="column">
|
|
||||||
<div class="text-bold q-pb-xs text-name">
|
|
||||||
เพิ่มข้อมูลทะเบียนประวัติ
|
|
||||||
</div>
|
|
||||||
<div class="text-bold q-pb-xs text-sub">ข้าราชการกทม. สามัญ</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
</div>
|
|
||||||
</q-page-sticky>
|
|
||||||
<!-- End Header -->
|
|
||||||
|
|
||||||
<q-card flat bordered class="col-12">
|
|
||||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
|
||||||
<HeaderTop
|
|
||||||
header="ข้อมูลส่วนตัว"
|
|
||||||
icon="mdi-account"
|
|
||||||
class="q-px-lg q-pt-md"
|
|
||||||
/>
|
|
||||||
<q-card-section class="q-px-lg">
|
|
||||||
<div class="row q-col-gutter-sm">
|
|
||||||
<div class="col-3">
|
|
||||||
<q-input
|
|
||||||
bg-color="white"
|
|
||||||
outlined
|
|
||||||
v-model="informaData.citizenId"
|
|
||||||
label="เลขประจำตัวประชาชน"
|
|
||||||
class="inputgreen"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
borderless
|
|
||||||
:rules="[
|
|
||||||
(val: string) => !!val || `${'กรุณากรอกเลขประจำตัวประชาชน'}`,
|
|
||||||
(val: string) =>
|
|
||||||
val.length >= 13 ||
|
|
||||||
`${'กรุณากรอกเลขประจำตัวประชาชนให้ครบ'}`,
|
|
||||||
]"
|
|
||||||
maxlength="13"
|
|
||||||
hide-bottom-space
|
|
||||||
mask="#############"
|
|
||||||
@update:model-value="changeCardID"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<q-select
|
|
||||||
bg-color="white"
|
|
||||||
v-model="informaData.prefix"
|
|
||||||
label="คำนำหน้าชื่อ"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
class="inputgreen"
|
|
||||||
:options="Ops.prefixOps"
|
|
||||||
option-label="name"
|
|
||||||
option-value="name"
|
|
||||||
map-options
|
|
||||||
hide-bottom-space
|
|
||||||
:rules="[
|
|
||||||
(val) => {
|
|
||||||
return val.length > 0 || 'กรุณาเลือกคำนำหน้าชื่อ';
|
|
||||||
},
|
|
||||||
]"
|
|
||||||
emit-value
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<q-input
|
|
||||||
bg-color="white"
|
|
||||||
outlined
|
|
||||||
v-model="informaData.firstName"
|
|
||||||
label="ชื่อ"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
class="inputgreen"
|
|
||||||
borderless
|
|
||||||
:rules="[(val) => val.length > 0 || 'กรุณากรอกชื่อ']"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<q-input
|
|
||||||
bg-color="white"
|
|
||||||
outlined
|
|
||||||
v-model="informaData.lastName"
|
|
||||||
label="นามสกุล"
|
|
||||||
class="inputgreen"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
borderless
|
|
||||||
:rules="[(val) => val.length > 0 || 'กรุณากรอกนามสกุล']"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-2">
|
|
||||||
<datepicker
|
|
||||||
autoApply
|
|
||||||
borderless
|
|
||||||
week-start="0"
|
|
||||||
:max-date="calculateMaxDate()"
|
|
||||||
:enableTimePicker="false"
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="informaData.birthDate"
|
|
||||||
:locale="'th'"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">
|
|
||||||
{{ year + 543 }}
|
|
||||||
</template>
|
|
||||||
<template #year-overlay-value="{ value }">
|
|
||||||
{{ parseInt(value + 543) }}
|
|
||||||
</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
for="inputDatereceive"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
class="inputgreen"
|
|
||||||
:model-value="
|
|
||||||
informaData.birthDate != null
|
|
||||||
? date2Thai(informaData.birthDate)
|
|
||||||
: null
|
|
||||||
"
|
|
||||||
label="วัน/เดือน/ปี เกิด"
|
|
||||||
:rules="[
|
|
||||||
(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`,
|
|
||||||
]"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon name="event" class="cursor-pointer" color="primary">
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-input
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
lazy-rules
|
|
||||||
hide-bottom-space
|
|
||||||
readonly
|
|
||||||
class="inputgreen"
|
|
||||||
v-model="age"
|
|
||||||
label="อายุ"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-select
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
use-input
|
|
||||||
clearable
|
|
||||||
lazy-rules
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
hide-bottom-space
|
|
||||||
input-debounce="0"
|
|
||||||
option-label="name"
|
|
||||||
option-value="name"
|
|
||||||
v-model="informaData.genderId"
|
|
||||||
class="inputgreen"
|
|
||||||
:options="Ops.genderOps"
|
|
||||||
label="เพศ"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'genderOps'
|
|
||||||
)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-select
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
use-input
|
|
||||||
clearable
|
|
||||||
lazy-rules
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
hide-bottom-space
|
|
||||||
option-value="name"
|
|
||||||
option-label="name"
|
|
||||||
input-debounce="0"
|
|
||||||
class="inputgreen"
|
|
||||||
v-model="informaData.statusId"
|
|
||||||
:options="Ops.statusOps"
|
|
||||||
label="สถานภาพ"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'statusOps'
|
|
||||||
)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-input
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
lazy-rules
|
|
||||||
hide-bottom-space
|
|
||||||
class="inputgreen"
|
|
||||||
v-model="informaData.nationality"
|
|
||||||
label="สัญชาติ"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-input
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
lazy-rules
|
|
||||||
hide-bottom-space
|
|
||||||
class="inputgreen"
|
|
||||||
v-model="informaData.ethnicity"
|
|
||||||
label="เชื้อชาติ"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-select
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
use-input
|
|
||||||
clearable
|
|
||||||
lazy-rules
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
hide-bottom-space
|
|
||||||
option-value="name"
|
|
||||||
option-label="name"
|
|
||||||
input-debounce="0"
|
|
||||||
v-model="informaData.religionId"
|
|
||||||
class="inputgreen"
|
|
||||||
:options="Ops.religionOps"
|
|
||||||
label="ศาสนา"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'religionOps'
|
|
||||||
)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-select
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
use-input
|
|
||||||
clearable
|
|
||||||
lazy-rules
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
hide-bottom-space
|
|
||||||
option-value="name"
|
|
||||||
option-label="name"
|
|
||||||
input-debounce="0"
|
|
||||||
v-model="informaData.bloodId"
|
|
||||||
class="inputgreen"
|
|
||||||
:options="Ops.bloodOps"
|
|
||||||
label="หมู่เลือด"
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'bloodOps'
|
|
||||||
)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-2">
|
|
||||||
<q-input
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
lazy-rules
|
|
||||||
hide-bottom-space
|
|
||||||
mask="##########"
|
|
||||||
class="inputgreen"
|
|
||||||
v-model="informaData.tel"
|
|
||||||
label="เบอร์โทร"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</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>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,68 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const props = defineProps({
|
|
||||||
editvisible: Boolean,
|
|
||||||
modalEdit: Boolean,
|
|
||||||
cancel: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
edit: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
save: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
validate: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const emit = defineEmits([
|
|
||||||
"update:editvisible",
|
|
||||||
"update:next",
|
|
||||||
"update:previous",
|
|
||||||
]);
|
|
||||||
|
|
||||||
const updateEdit = (value: Boolean) => {
|
|
||||||
emit("update:editvisible", value);
|
|
||||||
};
|
|
||||||
// const cancel = async () => {
|
|
||||||
// props.cancel();
|
|
||||||
// };
|
|
||||||
const edit = async () => {
|
|
||||||
updateEdit(!props.editvisible);
|
|
||||||
props.edit();
|
|
||||||
};
|
|
||||||
const checkSave = () => {
|
|
||||||
props.validate();
|
|
||||||
props.save();
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-card-actions class="text-primary">
|
|
||||||
<q-space />
|
|
||||||
<q-btn
|
|
||||||
v-if="!editvisible"
|
|
||||||
outline
|
|
||||||
:disabled="editvisible"
|
|
||||||
:color="editvisible ? 'grey-7' : 'primary'"
|
|
||||||
@click="edit"
|
|
||||||
><!-- icon="mdi-pencil-outline"
|
|
||||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip> -->
|
|
||||||
</q-btn>
|
|
||||||
<div v-else>
|
|
||||||
<q-btn
|
|
||||||
unelevated
|
|
||||||
label="บันทึก"
|
|
||||||
:disabled="!editvisible"
|
|
||||||
:color="!editvisible ? 'grey-7' : 'public'"
|
|
||||||
@click="checkSave"
|
|
||||||
>
|
|
||||||
</q-btn
|
|
||||||
><!-- icon="mdi-content-save-outline">
|
|
||||||
<q-tooltip>บันทึก</q-tooltip> -->
|
|
||||||
</div>
|
|
||||||
</q-card-actions>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,34 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const props = defineProps({
|
|
||||||
title: String,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("not function"),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const close = async () => {
|
|
||||||
props.close();
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<q-toolbar class="q-py-sm">
|
|
||||||
<q-toolbar-title class="header-text">{{ title }}</q-toolbar-title>
|
|
||||||
<q-btn
|
|
||||||
icon="close"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
@click="close"
|
|
||||||
style="color: #ff8080; background-color: #ffdede"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.header-text {
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 26px;
|
|
||||||
color: #35373c;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,15 +1,17 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watchEffect } from "vue";
|
import { ref, watchEffect } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import type { ResponseRow } from "@/modules/05_placement/interface/response/Receive";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
// import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";
|
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
import type { QTableProps } from "quasar";
|
||||||
|
import type { ResponseRow } from "@/modules/05_placement/interface/response/Receive";
|
||||||
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
|
|
||||||
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
const transferStore = useTransferDataStore();
|
const transferStore = useTransferDataStore();
|
||||||
const { statusText } = transferStore;
|
const { statusText } = transferStore;
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
|
|
@ -24,17 +26,20 @@ const {
|
||||||
date2Thai,
|
date2Thai,
|
||||||
} = mixin;
|
} = mixin;
|
||||||
|
|
||||||
//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
/**
|
||||||
const visibleColumns2 = ref<string[]>([
|
* props
|
||||||
"no",
|
*/
|
||||||
"citizenId",
|
const props = defineProps({
|
||||||
"fullname",
|
modal: Boolean,
|
||||||
"organizationName",
|
clickClose: Function,
|
||||||
"dateOfBirth",
|
fecthlistRecevice: Function,
|
||||||
"createdAt",
|
nextPage: Function,
|
||||||
"status",
|
rows2: Array,
|
||||||
]);
|
filterKeyword2: String,
|
||||||
//หัวตาราง
|
});
|
||||||
|
const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
|
||||||
|
|
||||||
|
//Table
|
||||||
const columns2 = ref<QTableProps["columns"]>([
|
const columns2 = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
@ -113,69 +118,74 @@ const columns2 = ref<QTableProps["columns"]>([
|
||||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
const visibleColumns2 = ref<string[]>([
|
||||||
|
"no",
|
||||||
|
"citizenId",
|
||||||
|
"fullname",
|
||||||
|
"organizationName",
|
||||||
|
"dateOfBirth",
|
||||||
|
"createdAt",
|
||||||
|
"status",
|
||||||
|
]);
|
||||||
|
|
||||||
const props = defineProps({
|
/**
|
||||||
Modal: Boolean,
|
* ฟังก์ชันยืนยันการส่งออกคำสั่ง
|
||||||
clickClose: Function,
|
*/
|
||||||
fecthlistRecevice: Function,
|
function saveOrder() {
|
||||||
nextPage: Function,
|
|
||||||
rows2: Array,
|
|
||||||
filterKeyword2: String,
|
|
||||||
});
|
|
||||||
|
|
||||||
const checkSelected = computed(() => {
|
|
||||||
if (selected.value.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
//popup ยืนยันส่งัว
|
|
||||||
const saveOrder = () => {
|
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
$q,
|
$q,
|
||||||
() => Ordersave(),
|
async () => {
|
||||||
|
const id = selected.value.map((r: ResponseRow) => r.id);
|
||||||
|
const body = {
|
||||||
|
id,
|
||||||
|
};
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.post(config.API.receiveReport, body)
|
||||||
|
.then(async () => {
|
||||||
|
await props.fecthlistRecevice?.();
|
||||||
|
success($q, "ส่งไปออกคำสั่งรับโอนสำเร็จ");
|
||||||
|
props.clickClose?.();
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(async () => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
},
|
||||||
"ยืนยันส่งไปออกคำสั่ง",
|
"ยืนยันส่งไปออกคำสั่ง",
|
||||||
"ต้องการยืนยันส่งไปออกคำสั่งใช่หรือไม่?"
|
"ต้องการยืนยันส่งไปออกคำสั่งใช่หรือไม่?"
|
||||||
);
|
);
|
||||||
};
|
}
|
||||||
//ส่งไปออกคำสั่ง
|
|
||||||
const Ordersave = async () => {
|
|
||||||
const id = selected.value.map((r: ResponseRow) => r.id);
|
|
||||||
const body = {
|
|
||||||
id,
|
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.post(config.API.receiveReport, body)
|
|
||||||
.then((res: any) => {
|
|
||||||
success($q, "ส่งไปออกคำสั่งรับโอนสำเร็จ");
|
|
||||||
props.clickClose?.();
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
props.fecthlistRecevice?.();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const emit = defineEmits(["update:filterKeyword2", "update:selected"]);
|
/**
|
||||||
const updateInput = (value: any) => {
|
* ฟังก์ชันอัปเดทค่าในช่องค้นหา
|
||||||
|
*/
|
||||||
|
function updateInput(value: any) {
|
||||||
emit("update:filterKeyword2", value);
|
emit("update:filterKeyword2", value);
|
||||||
};
|
}
|
||||||
//รีเซ็ตค่าในช่องค้นหา
|
|
||||||
const Reset = () => {
|
/**
|
||||||
|
* ฟังก์ชันรีเซ็ตค่าในช่องค้นหา
|
||||||
|
*/
|
||||||
|
function onReset() {
|
||||||
emit("update:filterKeyword2", "");
|
emit("update:filterKeyword2", "");
|
||||||
};
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* เมื่อ props.modal เป็น true
|
||||||
|
*
|
||||||
|
* กำหนดให้ selected เป็นค่าว่าง
|
||||||
|
*/
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
if (props.Modal === true) {
|
if (props.modal === true) {
|
||||||
selected.value = [];
|
selected.value = [];
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-dialog v-model="props.Modal">
|
<q-dialog v-model="props.modal">
|
||||||
<q-card style="width: 1200px; max-width: 80vw">
|
<q-card style="width: 1200px; max-width: 80vw">
|
||||||
<DialogHeader :tittle="'ส่งไปออกคำสั่งรับโอน'" :close="clickClose" />
|
<DialogHeader :tittle="'ส่งไปออกคำสั่งรับโอน'" :close="clickClose" />
|
||||||
<q-separator />
|
<q-separator />
|
||||||
|
|
@ -199,7 +209,7 @@ watchEffect(() => {
|
||||||
v-if="filterKeyword2 !== ''"
|
v-if="filterKeyword2 !== ''"
|
||||||
name="clear"
|
name="clear"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer"
|
||||||
@click="Reset"
|
@click="onReset"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
@ -317,7 +327,7 @@ watchEffect(() => {
|
||||||
<q-btn
|
<q-btn
|
||||||
label="ส่งไปออกคำสั่ง"
|
label="ส่งไปออกคำสั่ง"
|
||||||
@click="saveOrder"
|
@click="saveOrder"
|
||||||
:disable="checkSelected"
|
:disable="selected.length === 0"
|
||||||
color="public"
|
color="public"
|
||||||
><q-tooltip>ส่งไปออกคำสั่ง</q-tooltip></q-btn
|
><q-tooltip>ส่งไปออกคำสั่ง</q-tooltip></q-btn
|
||||||
>
|
>
|
||||||
|
|
@ -1,74 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import Information from "@/modules/05_placement/components/Receive/AddEmployee/Main.vue";
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="col-12 row">
|
|
||||||
<div class="row col-12" style="padding-top: 80px">
|
|
||||||
<div id="information" name="1" class="row col-12 information q-mt-sm">
|
|
||||||
<Information :statusAdd="true" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.image-size-default {
|
|
||||||
height: 150px;
|
|
||||||
max-width: 15vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
.image-size-full {
|
|
||||||
height: 160px;
|
|
||||||
max-width: 15vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
.border-green {
|
|
||||||
border: 5px solid #52c688;
|
|
||||||
}
|
|
||||||
|
|
||||||
.area-div {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-header {
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.containerimage {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.containerimage:hover .overlay {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.overlay {
|
|
||||||
background-color: #e4f2ffd2 !important;
|
|
||||||
opacity: 0;
|
|
||||||
padding: 2px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.information:target {
|
|
||||||
padding-top: 84px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.border-custom {
|
|
||||||
border: 0.5px solid #c3c3c3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg-active-image {
|
|
||||||
background-color: #52c688;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-name {
|
|
||||||
font-size: 1.3em;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-sub {
|
|
||||||
font-size: 1.2em;
|
|
||||||
overflow: hidden;
|
|
||||||
color: var(--q-primary);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
771
src/modules/05_placement/components/Receive/ReceiveAddPerson.vue
Normal file
771
src/modules/05_placement/components/Receive/ReceiveAddPerson.vue
Normal file
|
|
@ -0,0 +1,771 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, onMounted } from "vue";
|
||||||
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { useRouter } from "vue-router";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useProfileDataStore } from "@/modules/08_registryEmployee/store";
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
import type { QForm } from "quasar";
|
||||||
|
import type {
|
||||||
|
DataOption,
|
||||||
|
DataOptioninfo,
|
||||||
|
} from "@/modules/04_registry/components/profileType";
|
||||||
|
import type {
|
||||||
|
InformationOps,
|
||||||
|
FormAddPerson,
|
||||||
|
} from "@/modules/04_registry/interface/index/Main";
|
||||||
|
|
||||||
|
import HeaderTop from "@/modules/08_registryEmployee/components/AddEmployee/HeaderTop.vue";
|
||||||
|
|
||||||
|
const retireDate = ref<Date>();
|
||||||
|
const router = useRouter();
|
||||||
|
const $q = useQuasar();
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
const {
|
||||||
|
date2Thai,
|
||||||
|
success,
|
||||||
|
dateToISO,
|
||||||
|
messageError,
|
||||||
|
dialogMessageNotify,
|
||||||
|
showLoader,
|
||||||
|
hideLoader,
|
||||||
|
dialogConfirm,
|
||||||
|
} = mixin;
|
||||||
|
|
||||||
|
const profileStore = useProfileDataStore();
|
||||||
|
|
||||||
|
const age = ref<string | null>("");
|
||||||
|
const defaultCitizenData = ref<string>("");
|
||||||
|
const informaData = ref<FormAddPerson>({
|
||||||
|
prefix: "",
|
||||||
|
firstName: "",
|
||||||
|
lastName: "",
|
||||||
|
citizenId: "",
|
||||||
|
birthDate: null,
|
||||||
|
age: null,
|
||||||
|
genderId: null,
|
||||||
|
bloodId: null,
|
||||||
|
nationality: null,
|
||||||
|
ethnicity: null,
|
||||||
|
statusId: null,
|
||||||
|
religionId: null,
|
||||||
|
tel: null,
|
||||||
|
employeeType: null,
|
||||||
|
employeeClass: null,
|
||||||
|
profileType: null,
|
||||||
|
});
|
||||||
|
|
||||||
|
// รายการข้อมูลทั้งหมด
|
||||||
|
const Ops = ref<InformationOps>({
|
||||||
|
prefixOps: [],
|
||||||
|
prefixOldOps: [],
|
||||||
|
genderOps: [],
|
||||||
|
bloodOps: [],
|
||||||
|
statusOps: [],
|
||||||
|
religionOps: [],
|
||||||
|
employeeClassOps: [],
|
||||||
|
employeeTypeOps: [],
|
||||||
|
});
|
||||||
|
// ข้อมูลเมื่อเลือกแล้ว
|
||||||
|
const OpsFilter = ref<InformationOps>({
|
||||||
|
prefixOps: [],
|
||||||
|
prefixOldOps: [],
|
||||||
|
genderOps: [],
|
||||||
|
bloodOps: [],
|
||||||
|
statusOps: [],
|
||||||
|
religionOps: [],
|
||||||
|
employeeClassOps: [],
|
||||||
|
employeeTypeOps: [],
|
||||||
|
});
|
||||||
|
|
||||||
|
// รูป profile
|
||||||
|
const inputImage = ref<any>(null);
|
||||||
|
const image = ref<any>(null);
|
||||||
|
const fileData = ref<any>(null);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันดึงข้อมูลรายการข้อมูลเกี่ยวกับบุคคล (dropdown list)
|
||||||
|
*/
|
||||||
|
async function fetchPerson() {
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.get(config.API.profileNewMetaMain)
|
||||||
|
.then((res) => {
|
||||||
|
const data = res.data.result;
|
||||||
|
let optionbloodGroups: DataOption[] = [];
|
||||||
|
data.bloodGroups.map((r: DataOptioninfo) => {
|
||||||
|
optionbloodGroups.push({
|
||||||
|
id: r.id.toString(),
|
||||||
|
name: r.name.toString(),
|
||||||
|
});
|
||||||
|
});
|
||||||
|
Ops.value.bloodOps = optionbloodGroups;
|
||||||
|
OpsFilter.value.bloodOps = optionbloodGroups;
|
||||||
|
|
||||||
|
let optiongenders: DataOption[] = [];
|
||||||
|
data.genders.map((r: DataOptioninfo) => {
|
||||||
|
optiongenders.push({
|
||||||
|
id: r.id.toString(),
|
||||||
|
name: r.name.toString(),
|
||||||
|
});
|
||||||
|
});
|
||||||
|
Ops.value.genderOps = optiongenders;
|
||||||
|
OpsFilter.value.genderOps = optiongenders;
|
||||||
|
|
||||||
|
let optionprefixs: DataOption[] = [];
|
||||||
|
optionprefixs = data.prefixs.map((v: any) => ({
|
||||||
|
id: v.id,
|
||||||
|
name: v.name,
|
||||||
|
}));
|
||||||
|
|
||||||
|
Ops.value.prefixOps = optionprefixs;
|
||||||
|
OpsFilter.value.prefixOps = optionprefixs;
|
||||||
|
|
||||||
|
let optionrelationships: DataOption[] = [];
|
||||||
|
data.relationships.map((r: DataOptioninfo) => {
|
||||||
|
optionrelationships.push({
|
||||||
|
id: r.id.toString(),
|
||||||
|
name: r.name.toString(),
|
||||||
|
});
|
||||||
|
});
|
||||||
|
Ops.value.statusOps = optionrelationships;
|
||||||
|
OpsFilter.value.statusOps = optionrelationships;
|
||||||
|
|
||||||
|
let optionreligions: DataOption[] = [];
|
||||||
|
data.religions.map((r: DataOptioninfo) => {
|
||||||
|
optionreligions.push({
|
||||||
|
id: r.id.toString(),
|
||||||
|
name: r.name.toString(),
|
||||||
|
});
|
||||||
|
});
|
||||||
|
Ops.value.religionOps = optionreligions;
|
||||||
|
OpsFilter.value.religionOps = optionreligions;
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function uploadImage(e: any) {
|
||||||
|
const input = e.target.files;
|
||||||
|
if (input.length > 0) {
|
||||||
|
const url = URL.createObjectURL(input[0]);
|
||||||
|
image.value = url;
|
||||||
|
fileData.value = input[0];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันคลิกแก้ไขรูป profile
|
||||||
|
*/
|
||||||
|
function addNewImage() {
|
||||||
|
inputImage.value.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันตรวจสอบเลขบัตรประจำตัวประชาชน
|
||||||
|
* @param value เลขบัตรประจำตัวประชาชน
|
||||||
|
*/
|
||||||
|
async function changeCardID(value: string | number | null) {
|
||||||
|
if (value != null && typeof value == "string") {
|
||||||
|
if (value.length == 13 && value != defaultCitizenData.value) {
|
||||||
|
await checkCitizen(value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันยิง API ตรวจสอบเลขบัตรประจำตัวประชาชนซ้ำ
|
||||||
|
* @param value เลขบัตรประจำตัวประชาชน
|
||||||
|
*/
|
||||||
|
async function checkCitizen(id: string) {
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.put(config.API.profileNewCitizenId(id), {
|
||||||
|
citizenId: id,
|
||||||
|
})
|
||||||
|
.then(() => {})
|
||||||
|
.catch((err) => {
|
||||||
|
if (err.response.data.status === 500) {
|
||||||
|
dialogMessageNotify($q, err.response.data.message);
|
||||||
|
} else {
|
||||||
|
messageError($q, err);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันค้นหาข้อมูลในรายการตัวเลือก
|
||||||
|
* @param val คำค้นหา
|
||||||
|
* @param update ฟังก์ชัน
|
||||||
|
* @param refData ประเภทของตัวเลือก
|
||||||
|
*/
|
||||||
|
function filterSelector(val: string, update: Function, refData: string) {
|
||||||
|
switch (refData) {
|
||||||
|
case "prefixOps":
|
||||||
|
update(() => {
|
||||||
|
Ops.value.prefixOps = OpsFilter.value.prefixOps.filter(
|
||||||
|
(v: DataOption) => v.name.indexOf(val) > -1
|
||||||
|
);
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case "genderOps":
|
||||||
|
update(() => {
|
||||||
|
Ops.value.genderOps = OpsFilter.value.genderOps.filter(
|
||||||
|
(v: DataOption) => v.name.indexOf(val) > -1
|
||||||
|
);
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case "bloodOps":
|
||||||
|
update(() => {
|
||||||
|
Ops.value.bloodOps = OpsFilter.value.bloodOps.filter(
|
||||||
|
(v: DataOption) => v.name.indexOf(val) > -1
|
||||||
|
);
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case "statusOps":
|
||||||
|
update(() => {
|
||||||
|
Ops.value.statusOps = OpsFilter.value.statusOps.filter(
|
||||||
|
(v: DataOption) => v.name.indexOf(val) > -1
|
||||||
|
);
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
case "religionOps":
|
||||||
|
update(() => {
|
||||||
|
Ops.value.religionOps = OpsFilter.value.religionOps.filter(
|
||||||
|
(v: DataOption) => v.name.indexOf(val) > -1
|
||||||
|
);
|
||||||
|
});
|
||||||
|
break;
|
||||||
|
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันเช็ควันที่ที่สามารถเลือกวันเกิดได้โดย max date น้อยกว่าวันปัจจุบัน เพื่อให้ฟังก์ชั่นการเช็คทำงานได้ปกติ
|
||||||
|
*/
|
||||||
|
function calculateMaxDate() {
|
||||||
|
const today = new Date();
|
||||||
|
today.setFullYear(today.getFullYear() - 18);
|
||||||
|
return today;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันยืนยันการบันทึกข้อมูล
|
||||||
|
*/
|
||||||
|
function onSubmit() {
|
||||||
|
const formData = new FormData();
|
||||||
|
if (fileData.value != null) formData.append("File", fileData.value); //แก้ไขรูป
|
||||||
|
if (informaData.value.citizenId != undefined)
|
||||||
|
formData.append("citizenId", informaData.value.citizenId);
|
||||||
|
if (informaData.value.prefix != undefined)
|
||||||
|
formData.append("prefix", informaData.value.prefix);
|
||||||
|
if (informaData.value.firstName != undefined)
|
||||||
|
formData.append("firstName", informaData.value.firstName);
|
||||||
|
if (informaData.value.lastName != undefined)
|
||||||
|
formData.append("lastName", informaData.value.lastName);
|
||||||
|
if (informaData.value.genderId != undefined)
|
||||||
|
formData.append("gender", informaData.value.genderId);
|
||||||
|
if (informaData.value.nationality != undefined)
|
||||||
|
formData.append("nationality", informaData.value.nationality);
|
||||||
|
if (informaData.value.ethnicity != undefined)
|
||||||
|
formData.append("race", informaData.value.ethnicity);
|
||||||
|
if (informaData.value.religionId != undefined)
|
||||||
|
formData.append("religion", informaData.value.religionId);
|
||||||
|
if (informaData.value.birthDate != undefined)
|
||||||
|
formData.append(
|
||||||
|
"birthDate",
|
||||||
|
dateToISO(informaData.value.birthDate) ?? dateToISO(new Date())
|
||||||
|
);
|
||||||
|
if (informaData.value.bloodId != undefined)
|
||||||
|
formData.append("bloodGroup", informaData.value.bloodId);
|
||||||
|
if (informaData.value.statusId != undefined)
|
||||||
|
formData.append("relationship", informaData.value.statusId);
|
||||||
|
if (informaData.value.tel != undefined)
|
||||||
|
formData.append("telephoneNumber", informaData.value.tel);
|
||||||
|
if (informaData.value.employeeType != undefined)
|
||||||
|
formData.append("employeeType", informaData.value.employeeType);
|
||||||
|
if (informaData.value.employeeClass != undefined)
|
||||||
|
formData.append("employeeClass", informaData.value.employeeClass);
|
||||||
|
|
||||||
|
dialogConfirm($q, async () => {
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.post(config.API.receiveData(), formData)
|
||||||
|
.then(async () => {
|
||||||
|
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||||
|
clickBack();
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(async () => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันกลับไปหน้ารายการรายการรับโอน
|
||||||
|
*/
|
||||||
|
function clickBack() {
|
||||||
|
router.push("/placement/receive");
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันคำนวนอายุ
|
||||||
|
* @param birthDate วันเดือยปีเกิด
|
||||||
|
* @returns อายุ แบบ ปี เดือน วัน
|
||||||
|
*/
|
||||||
|
function calculateAge(birthDate: Date | null) {
|
||||||
|
if (!birthDate) return null;
|
||||||
|
const birthDateTimeStamp = new Date(birthDate).getTime();
|
||||||
|
const now = new Date();
|
||||||
|
const diff = now.getTime() - birthDateTimeStamp;
|
||||||
|
|
||||||
|
const ageDate = new Date(diff);
|
||||||
|
const years = ageDate.getUTCFullYear() - 1970;
|
||||||
|
const months = ageDate.getUTCMonth();
|
||||||
|
const days = ageDate.getUTCDate() - 1;
|
||||||
|
const retire = new Date(birthDate);
|
||||||
|
retire.setFullYear(retire.getFullYear() + 60);
|
||||||
|
retireDate.value = retire;
|
||||||
|
|
||||||
|
if (years > 60) {
|
||||||
|
return "อายุเกิน 60 ปี";
|
||||||
|
}
|
||||||
|
|
||||||
|
return `${years} ปี ${months} เดือน ${days} วัน`;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันอัปเดทวันเดือนปีเกิด
|
||||||
|
* @param v วันเดือยปีเกิด
|
||||||
|
*/
|
||||||
|
function updateBirthDate(v: Date) {
|
||||||
|
age.value = calculateAge(v);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
|
onMounted(async () => {
|
||||||
|
await fetchPerson();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="col-12 row">
|
||||||
|
<div class="row col-12" style="padding-top: 80px">
|
||||||
|
<div id="information" name="1" class="row col-12 information q-mt-sm">
|
||||||
|
<!-- Header -->
|
||||||
|
<q-page-sticky
|
||||||
|
position="top"
|
||||||
|
expand
|
||||||
|
class="bg-grey-2 text-white"
|
||||||
|
style="z-index: 99; padding: 0% 1% 0% 1%"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="row col-12 q-gutter-sm q-pb-sm text-dark no-wrap items-center"
|
||||||
|
>
|
||||||
|
<q-btn
|
||||||
|
flat
|
||||||
|
round
|
||||||
|
class="bg-teal-1 full-height"
|
||||||
|
color="primary"
|
||||||
|
icon="mdi-chevron-left"
|
||||||
|
dense
|
||||||
|
@click="router.push(`/placement/receive`)"
|
||||||
|
>
|
||||||
|
</q-btn>
|
||||||
|
<q-avatar size="65px" rounded class="containerimage">
|
||||||
|
<img
|
||||||
|
v-if="image == null"
|
||||||
|
src="@/assets/avatar_user.jpg"
|
||||||
|
class="bg-grey-3"
|
||||||
|
style="object-fit: cover"
|
||||||
|
/>
|
||||||
|
<img :src="image" class="bg-grey-3" style="object-fit: cover" />
|
||||||
|
<div
|
||||||
|
class="overlay absolute-bottom text-subtitle2 text-center cursor-pointer"
|
||||||
|
@click="addNewImage()"
|
||||||
|
>
|
||||||
|
<q-icon name="mdi-camera" size="18px" color="blue">
|
||||||
|
<q-tooltip>อัปเดตรูปภาพ</q-tooltip>
|
||||||
|
</q-icon>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
style="display: none"
|
||||||
|
ref="inputImage"
|
||||||
|
accept="image/*"
|
||||||
|
@change="uploadImage"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</q-avatar>
|
||||||
|
|
||||||
|
<div class="row items-center text-dark q-ml-md">
|
||||||
|
<div class="column">
|
||||||
|
<div class="text-bold q-pb-xs text-name">
|
||||||
|
เพิ่มข้อมูลทะเบียนประวัติ
|
||||||
|
</div>
|
||||||
|
<div class="text-bold q-pb-xs text-sub">
|
||||||
|
ข้าราชการกทม. สามัญ
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<q-space />
|
||||||
|
</div>
|
||||||
|
</q-page-sticky>
|
||||||
|
|
||||||
|
<q-card flat bordered class="col-12">
|
||||||
|
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||||
|
<HeaderTop
|
||||||
|
header="ข้อมูลส่วนตัว"
|
||||||
|
icon="mdi-account"
|
||||||
|
class="q-px-lg q-pt-md"
|
||||||
|
/>
|
||||||
|
<q-card-section class="q-px-lg">
|
||||||
|
<div class="row q-col-gutter-sm">
|
||||||
|
<div class="col-3">
|
||||||
|
<q-input
|
||||||
|
bg-color="white"
|
||||||
|
outlined
|
||||||
|
v-model="informaData.citizenId"
|
||||||
|
label="เลขประจำตัวประชาชน"
|
||||||
|
class="inputgreen"
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
borderless
|
||||||
|
:rules="[
|
||||||
|
(val: string) => !!val || `${'กรุณากรอกเลขประจำตัวประชาชน'}`,
|
||||||
|
(val: string) =>
|
||||||
|
val.length >= 13 ||
|
||||||
|
`${'กรุณากรอกเลขประจำตัวประชาชนให้ครบ'}`,
|
||||||
|
]"
|
||||||
|
maxlength="13"
|
||||||
|
hide-bottom-space
|
||||||
|
mask="#############"
|
||||||
|
@update:model-value="changeCardID"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-3">
|
||||||
|
<q-select
|
||||||
|
bg-color="white"
|
||||||
|
v-model="informaData.prefix"
|
||||||
|
label="คำนำหน้าชื่อ"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
class="inputgreen"
|
||||||
|
:options="Ops.prefixOps"
|
||||||
|
option-label="name"
|
||||||
|
option-value="name"
|
||||||
|
map-options
|
||||||
|
hide-bottom-space
|
||||||
|
:rules="[
|
||||||
|
(val) => {
|
||||||
|
return val.length > 0 || 'กรุณาเลือกคำนำหน้าชื่อ';
|
||||||
|
},
|
||||||
|
]"
|
||||||
|
emit-value
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-3">
|
||||||
|
<q-input
|
||||||
|
bg-color="white"
|
||||||
|
outlined
|
||||||
|
v-model="informaData.firstName"
|
||||||
|
label="ชื่อ"
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
class="inputgreen"
|
||||||
|
borderless
|
||||||
|
:rules="[(val) => val.length > 0 || 'กรุณากรอกชื่อ']"
|
||||||
|
hide-bottom-space
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-3">
|
||||||
|
<q-input
|
||||||
|
bg-color="white"
|
||||||
|
outlined
|
||||||
|
v-model="informaData.lastName"
|
||||||
|
label="นามสกุล"
|
||||||
|
class="inputgreen"
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
borderless
|
||||||
|
:rules="[(val) => val.length > 0 || 'กรุณากรอกนามสกุล']"
|
||||||
|
hide-bottom-space
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-2">
|
||||||
|
<datepicker
|
||||||
|
autoApply
|
||||||
|
borderless
|
||||||
|
week-start="0"
|
||||||
|
:max-date="calculateMaxDate()"
|
||||||
|
:enableTimePicker="false"
|
||||||
|
menu-class-name="modalfix"
|
||||||
|
v-model="informaData.birthDate"
|
||||||
|
:locale="'th'"
|
||||||
|
@update:model-value="updateBirthDate"
|
||||||
|
>
|
||||||
|
<template #year="{ year }">
|
||||||
|
{{ year + 543 }}
|
||||||
|
</template>
|
||||||
|
<template #year-overlay-value="{ value }">
|
||||||
|
{{ parseInt(value + 543) }}
|
||||||
|
</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
for="inputDatereceive"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
hide-bottom-space
|
||||||
|
class="inputgreen"
|
||||||
|
:model-value="
|
||||||
|
informaData.birthDate != null
|
||||||
|
? date2Thai(informaData.birthDate)
|
||||||
|
: null
|
||||||
|
"
|
||||||
|
label="วัน/เดือน/ปี เกิด"
|
||||||
|
:rules="[
|
||||||
|
(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`,
|
||||||
|
]"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
name="event"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="primary"
|
||||||
|
>
|
||||||
|
</q-icon>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</datepicker>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-input
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
lazy-rules
|
||||||
|
hide-bottom-space
|
||||||
|
readonly
|
||||||
|
class="inputgreen"
|
||||||
|
v-model="age"
|
||||||
|
label="อายุ"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-select
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
use-input
|
||||||
|
clearable
|
||||||
|
lazy-rules
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
hide-bottom-space
|
||||||
|
input-debounce="0"
|
||||||
|
option-label="name"
|
||||||
|
option-value="name"
|
||||||
|
v-model="informaData.genderId"
|
||||||
|
class="inputgreen"
|
||||||
|
:options="Ops.genderOps"
|
||||||
|
label="เพศ"
|
||||||
|
@filter="(inputValue:string,
|
||||||
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'genderOps'
|
||||||
|
)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-select
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
use-input
|
||||||
|
clearable
|
||||||
|
lazy-rules
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
hide-bottom-space
|
||||||
|
option-value="name"
|
||||||
|
option-label="name"
|
||||||
|
input-debounce="0"
|
||||||
|
class="inputgreen"
|
||||||
|
v-model="informaData.statusId"
|
||||||
|
:options="Ops.statusOps"
|
||||||
|
label="สถานภาพ"
|
||||||
|
@filter="(inputValue:string,
|
||||||
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'statusOps'
|
||||||
|
)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-input
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
lazy-rules
|
||||||
|
hide-bottom-space
|
||||||
|
class="inputgreen"
|
||||||
|
v-model="informaData.nationality"
|
||||||
|
label="สัญชาติ"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-input
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
lazy-rules
|
||||||
|
hide-bottom-space
|
||||||
|
class="inputgreen"
|
||||||
|
v-model="informaData.ethnicity"
|
||||||
|
label="เชื้อชาติ"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-select
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
use-input
|
||||||
|
clearable
|
||||||
|
lazy-rules
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
hide-bottom-space
|
||||||
|
option-value="name"
|
||||||
|
option-label="name"
|
||||||
|
input-debounce="0"
|
||||||
|
v-model="informaData.religionId"
|
||||||
|
class="inputgreen"
|
||||||
|
:options="Ops.religionOps"
|
||||||
|
label="ศาสนา"
|
||||||
|
@filter="(inputValue:string,
|
||||||
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'religionOps'
|
||||||
|
)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-select
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
use-input
|
||||||
|
clearable
|
||||||
|
lazy-rules
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
hide-bottom-space
|
||||||
|
option-value="name"
|
||||||
|
option-label="name"
|
||||||
|
input-debounce="0"
|
||||||
|
v-model="informaData.bloodId"
|
||||||
|
class="inputgreen"
|
||||||
|
:options="Ops.bloodOps"
|
||||||
|
label="หมู่เลือด"
|
||||||
|
@filter="(inputValue:string,
|
||||||
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'bloodOps'
|
||||||
|
)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-2">
|
||||||
|
<q-input
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
lazy-rules
|
||||||
|
hide-bottom-space
|
||||||
|
mask="##########"
|
||||||
|
class="inputgreen"
|
||||||
|
v-model="informaData.tel"
|
||||||
|
label="เบอร์โทร"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</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>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.image-size-default {
|
||||||
|
height: 150px;
|
||||||
|
max-width: 15vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image-size-full {
|
||||||
|
height: 160px;
|
||||||
|
max-width: 15vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-green {
|
||||||
|
border: 5px solid #52c688;
|
||||||
|
}
|
||||||
|
|
||||||
|
.area-div {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-header {
|
||||||
|
font-size: 1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.containerimage {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.containerimage:hover .overlay {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.overlay {
|
||||||
|
background-color: #e4f2ffd2 !important;
|
||||||
|
opacity: 0;
|
||||||
|
padding: 2px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.information:target {
|
||||||
|
padding-top: 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-custom {
|
||||||
|
border: 0.5px solid #c3c3c3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-active-image {
|
||||||
|
background-color: #52c688;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-name {
|
||||||
|
font-size: 1.3em;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-sub {
|
||||||
|
font-size: 1.2em;
|
||||||
|
overflow: hidden;
|
||||||
|
color: var(--q-primary);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
File diff suppressed because it is too large
Load diff
File diff suppressed because it is too large
Load diff
|
|
@ -1,733 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, computed, onMounted } from "vue";
|
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { useRouter } from "vue-router";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
import DialogOrgTree from "@/modules/05_placement/components/Relocation/RelocationModal.vue";
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
|
|
||||||
import type { relocationType } from "@/modules/05_placement/interface/response/Relocation";
|
|
||||||
|
|
||||||
const transferStore = useTransferDataStore();
|
|
||||||
const { statusText } = transferStore;
|
|
||||||
|
|
||||||
const personalId = ref<string>("");
|
|
||||||
const personal = ref<any[]>([]);
|
|
||||||
const modalTree = ref<boolean>(false);
|
|
||||||
const selected = ref<relocationType[]>([]);
|
|
||||||
const checkSelected = computed(() => {
|
|
||||||
if (selected.value.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const router = useRouter();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
success,
|
|
||||||
dialogMessage,
|
|
||||||
dialogRemove,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const modal = ref<boolean>(false);
|
|
||||||
const visibleColumns = ref<string[]>([
|
|
||||||
"no",
|
|
||||||
"citizenId",
|
|
||||||
"fullname",
|
|
||||||
"organizationName",
|
|
||||||
"dateOfBirth",
|
|
||||||
"createdAt",
|
|
||||||
"statusText",
|
|
||||||
"btn",
|
|
||||||
]);
|
|
||||||
const visibleColumns2 = ref<string[]>([
|
|
||||||
"no",
|
|
||||||
"citizenId",
|
|
||||||
"fullname",
|
|
||||||
"organizationName",
|
|
||||||
"dateOfBirth",
|
|
||||||
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
|
||||||
const filterKeyword = ref<string>("");
|
|
||||||
const filterKeyword2 = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const resetFilter = () => {
|
|
||||||
filterKeyword.value = "";
|
|
||||||
filterKeyword2.value = "";
|
|
||||||
filterRef.value.focus();
|
|
||||||
};
|
|
||||||
|
|
||||||
const rows = ref<relocationType[]>([]);
|
|
||||||
const rows2 = ref<any[]>([]);
|
|
||||||
const columns = ref<QTableProps["columns"]>([
|
|
||||||
{
|
|
||||||
name: "no",
|
|
||||||
align: "left",
|
|
||||||
label: "ลำดับ",
|
|
||||||
sortable: true,
|
|
||||||
field: "no",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "citizenId",
|
|
||||||
align: "left",
|
|
||||||
label: "เลขประจำตัวประชาชน",
|
|
||||||
sortable: true,
|
|
||||||
field: "fullname",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "fullname",
|
|
||||||
align: "left",
|
|
||||||
label: "ชื่อ-นามสกุล",
|
|
||||||
sortable: true,
|
|
||||||
field: "fullname",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "organizationName",
|
|
||||||
align: "left",
|
|
||||||
label: "หน่วยงานที่รับโอน",
|
|
||||||
sortable: true,
|
|
||||||
field: "organizationName",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
sort: (a: string, b: string) =>
|
|
||||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "dateOfBirth",
|
|
||||||
align: "left",
|
|
||||||
label: "วัน/เดือน/ปี เกิด",
|
|
||||||
sortable: true,
|
|
||||||
field: "dateOfBirth",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "createdAt",
|
|
||||||
align: "left",
|
|
||||||
label: "วันที่ดำเนินการ",
|
|
||||||
sortable: true,
|
|
||||||
field: "createdAt",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
name: "statusText",
|
|
||||||
align: "left",
|
|
||||||
label: "สถานะ",
|
|
||||||
sortable: true,
|
|
||||||
field: "statusText",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "btn",
|
|
||||||
align: "left",
|
|
||||||
label: "",
|
|
||||||
sortable: true,
|
|
||||||
field: "btn",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
const columns2 = ref<QTableProps["columns"]>([
|
|
||||||
{
|
|
||||||
name: "no",
|
|
||||||
align: "left",
|
|
||||||
label: "ลำดับ",
|
|
||||||
sortable: true,
|
|
||||||
field: "no",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "citizenId",
|
|
||||||
align: "left",
|
|
||||||
label: "เลขประจำตัวประชาชน",
|
|
||||||
sortable: true,
|
|
||||||
field: "citizenId",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "fullname",
|
|
||||||
align: "left",
|
|
||||||
label: "ชื่อ-นามสกุล",
|
|
||||||
sortable: true,
|
|
||||||
field: "fullname",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "organizationName",
|
|
||||||
align: "left",
|
|
||||||
label: "หน่วยงานที่รับโอน",
|
|
||||||
sortable: true,
|
|
||||||
field: "organizationName",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
sort: (a: string, b: string) =>
|
|
||||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "dateOfBirth",
|
|
||||||
align: "left",
|
|
||||||
label: "วัน/เดือน/ปี เกิด",
|
|
||||||
sortable: true,
|
|
||||||
field: "dateOfBirth",
|
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
//--------------(ปุ่มลบ)----------------//
|
|
||||||
|
|
||||||
const openDetail = (id: string) => {
|
|
||||||
router.push(`/relocation/detail/${id}`);
|
|
||||||
};
|
|
||||||
const openModal = () => (modal.value = true);
|
|
||||||
const closeModal = () => (modal.value = false);
|
|
||||||
const openModalOrder = () => {
|
|
||||||
openModal();
|
|
||||||
const row = rows.value.filter(
|
|
||||||
(item: relocationType) =>
|
|
||||||
item.status == "WAITTING" ||
|
|
||||||
item.status == "PENDING" ||
|
|
||||||
item.status == "APPROVE"
|
|
||||||
);
|
|
||||||
rows2.value = row;
|
|
||||||
};
|
|
||||||
const openModalTree = (id: string) => {
|
|
||||||
personalId.value = id;
|
|
||||||
personal.value = rows.value.filter((e: any) => e.id === id);
|
|
||||||
modalTree.value = true;
|
|
||||||
};
|
|
||||||
const getData = async () => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(config.API.relocationMain())
|
|
||||||
.then((res: any) => {
|
|
||||||
const data = res.data.result;
|
|
||||||
rows.value = data.map((item: relocationType) => ({
|
|
||||||
fullname: `${item.prefix}${item.firstname} ${item.lastname}`,
|
|
||||||
id: item.id,
|
|
||||||
citizenId: item.citizenId,
|
|
||||||
prefix: item.prefix,
|
|
||||||
firstname: item.firstname,
|
|
||||||
lastname: item.lastname,
|
|
||||||
dateOfBirth: date2Thai(item.dateOfBirth),
|
|
||||||
gender: item.gender,
|
|
||||||
status: item.status,
|
|
||||||
statusText: statusText(item.status),
|
|
||||||
recruitDate: item.recruitDate,
|
|
||||||
positionNumber: item.positionNumber,
|
|
||||||
positionPath: item.positionPath,
|
|
||||||
positionPathSide: item.positionPathSide,
|
|
||||||
positionType: item.positionType,
|
|
||||||
positionLine: item.positionLine,
|
|
||||||
positionLevel: item.positionLevel,
|
|
||||||
posNoId: item.posNoId,
|
|
||||||
positionId: item.positionId,
|
|
||||||
positionPathSideId: item.positionPathSideId,
|
|
||||||
positionTypeId: item.positionTypeId,
|
|
||||||
positionLineId: item.positionLineId,
|
|
||||||
positionLevelId: item.positionLevelId,
|
|
||||||
organizationPositionId: item.organizationPositionId,
|
|
||||||
organizationName: item.organizationName,
|
|
||||||
organizationShortName: item.organizationShortName,
|
|
||||||
isActive: item.isActive,
|
|
||||||
reason: item.reason,
|
|
||||||
educationOld: item.educationOld,
|
|
||||||
salary: item.salary,
|
|
||||||
positionTypeOld: item.positionTypeOld,
|
|
||||||
positionLevelOld: item.positionLevelOld,
|
|
||||||
positionNumberOld: item.positionNumberOld,
|
|
||||||
organizationPositionOld: item.organizationPositionOld,
|
|
||||||
createdAt: date2Thai(item.createdAt),
|
|
||||||
}));
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const saveOrder = async () => {
|
|
||||||
const id = selected.value.map((item) => item.id);
|
|
||||||
const body = {
|
|
||||||
id,
|
|
||||||
};
|
|
||||||
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.post(config.API.relocationMainReport(), body)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "ส่งไปออกคำสั่งย้าย");
|
|
||||||
closeModal();
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await getData();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const deleteData = async (id: string) => {
|
|
||||||
await http
|
|
||||||
.delete(config.API.relocationMainDelete(id))
|
|
||||||
.then(() => {
|
|
||||||
success($q, "ลบข้อมูลสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await getData();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const clickDelete = async (name: string, id: string) => {
|
|
||||||
dialogRemove(
|
|
||||||
$q,
|
|
||||||
async () => {
|
|
||||||
await deleteData(id);
|
|
||||||
await getData();
|
|
||||||
},
|
|
||||||
`ลบข้อมูลของ ${name}`
|
|
||||||
);
|
|
||||||
};
|
|
||||||
const closeModalTree = async () => {
|
|
||||||
await getData();
|
|
||||||
modalTree.value = false;
|
|
||||||
};
|
|
||||||
onMounted(async () => {
|
|
||||||
await getData();
|
|
||||||
});
|
|
||||||
const pagination = ref({
|
|
||||||
sortBy: "createdAt",
|
|
||||||
descending: true,
|
|
||||||
page: 1,
|
|
||||||
rowsPerPage: 10,
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<div class="toptitle text-dark col-12 row items-center">รายการย้าย</div>
|
|
||||||
<q-card flat bordered class="col-12 q-mt-sm">
|
|
||||||
<q-separator />
|
|
||||||
<div class="row q-pa-md">
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="row col-12">
|
|
||||||
<q-btn
|
|
||||||
@click="openModalOrder"
|
|
||||||
size="14px"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
color="add"
|
|
||||||
icon="mdi-account-arrow-right"
|
|
||||||
>
|
|
||||||
<q-tooltip>ส่งไปออกคำสั่งย้าย</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
<q-input
|
|
||||||
class="col-xs-12 col-sm-3 col-md-2"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
v-model="filterKeyword"
|
|
||||||
ref="filterRef"
|
|
||||||
outlined
|
|
||||||
debounce="300"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon v-if="filterKeyword == ''" name="search" />
|
|
||||||
<q-icon
|
|
||||||
v-if="filterKeyword !== ''"
|
|
||||||
name="clear"
|
|
||||||
class="cursor-pointer"
|
|
||||||
@click="resetFilter"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
|
|
||||||
<q-select
|
|
||||||
v-model="visibleColumns"
|
|
||||||
multiple
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
options-dense
|
|
||||||
:display-value="$q.lang.table.columns"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
:options="columns"
|
|
||||||
option-value="name"
|
|
||||||
options-cover
|
|
||||||
style="min-width: 150px"
|
|
||||||
class="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-12 q-pt-sm">
|
|
||||||
<d-table
|
|
||||||
:columns="columns"
|
|
||||||
:rows="rows"
|
|
||||||
:filter="filterKeyword"
|
|
||||||
row-key="id"
|
|
||||||
:visible-columns="visibleColumns"
|
|
||||||
v-model:pagination="pagination"
|
|
||||||
>
|
|
||||||
<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 key="no" :props="props" @click="openDetail(props.row.id)">
|
|
||||||
{{ props.rowIndex + 1 }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="citizenId"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
{{ props.row.citizenId !== null ? props.row.citizenId : "-" }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="fullname"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
{{ props.row.fullname !== null ? props.row.fullname : "-" }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="organizationName"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
v-if="
|
|
||||||
props.row.organizationName !== null ||
|
|
||||||
props.row.positionPath !== null
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{
|
|
||||||
props.row.organizationName !== null
|
|
||||||
? props.row.organizationName
|
|
||||||
: "-"
|
|
||||||
}}
|
|
||||||
{{
|
|
||||||
props.row.organizationShortName !== null
|
|
||||||
? `(${props.row.organizationShortName})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div class="text-weight-light">
|
|
||||||
{{
|
|
||||||
props.row.positionPath !== null
|
|
||||||
? props.row.positionPath
|
|
||||||
: "-"
|
|
||||||
}}
|
|
||||||
{{
|
|
||||||
props.row.positionNumber !== null
|
|
||||||
? `(${props.row.positionNumber})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="text-weight-medium">-</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="dateOfBirth"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
{{
|
|
||||||
props.row.dateOfBirth !== null ? props.row.dateOfBirth : "-"
|
|
||||||
}}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="createdAt"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
{{ props.row.createdAt }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="organizationPositionOld"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
<div class="table_ellipsis">
|
|
||||||
{{
|
|
||||||
props.row.organizationPositionOld !== null
|
|
||||||
? props.row.organizationPositionOld
|
|
||||||
: "-"
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="organization"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
<div class="table_ellipsis">
|
|
||||||
{{
|
|
||||||
props.row.organization !== null
|
|
||||||
? props.row.organization
|
|
||||||
: "-"
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="statusText"
|
|
||||||
:props="props"
|
|
||||||
@click="openDetail(props.row.id)"
|
|
||||||
>
|
|
||||||
{{
|
|
||||||
props.row.statusText !== null ? props.row.statusText : "-"
|
|
||||||
}}
|
|
||||||
</q-td>
|
|
||||||
<q-td auto-width>
|
|
||||||
<q-btn
|
|
||||||
v-if="
|
|
||||||
props.row.status !== 'DONE' &&
|
|
||||||
props.row.status !== 'REPORT'
|
|
||||||
"
|
|
||||||
icon="mdi-dots-vertical"
|
|
||||||
size="12px"
|
|
||||||
color="grey-7"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
>
|
|
||||||
<q-menu
|
|
||||||
transition-show="jump-down"
|
|
||||||
transition-hide="jump-up"
|
|
||||||
>
|
|
||||||
<q-list dense style="min-width: 100px">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
v-close-popup
|
|
||||||
@click="openModalTree(props.row.id)"
|
|
||||||
>
|
|
||||||
<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.fullname, props.row.id)"
|
|
||||||
>
|
|
||||||
<q-item-section
|
|
||||||
style="min-width: 0px"
|
|
||||||
avatar
|
|
||||||
class="q-py-sm"
|
|
||||||
>
|
|
||||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
|
||||||
<q-icon color="red" size="xs" name="mdi-delete" />
|
|
||||||
</q-item-section>
|
|
||||||
<q-item-section>ลบ</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
</q-list>
|
|
||||||
</q-menu>
|
|
||||||
</q-btn>
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
</d-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card>
|
|
||||||
|
|
||||||
<q-dialog v-model="modal">
|
|
||||||
<q-card style="width: 1200px; max-width: 80vw">
|
|
||||||
<DialogHeader :tittle="'ส่งไปออกคำสั่งย้าย'" :close="closeModal" />
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section>
|
|
||||||
<div class="row justify-end">
|
|
||||||
<div class="col-5">
|
|
||||||
<q-toolbar style="padding: 0">
|
|
||||||
<q-input
|
|
||||||
borderless
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
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="visibleColumns2"
|
|
||||||
multiple
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
options-dense
|
|
||||||
:display-value="$q.lang.table.columns"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
:options="columns2"
|
|
||||||
option-value="name"
|
|
||||||
options-cover
|
|
||||||
style="min-width: 150px"
|
|
||||||
class="gt-xs q-ml-sm"
|
|
||||||
/>
|
|
||||||
</q-toolbar>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<d-table
|
|
||||||
:columns="columns2"
|
|
||||||
:rows="rows2"
|
|
||||||
:filter="filterKeyword2"
|
|
||||||
row-key="id"
|
|
||||||
flat
|
|
||||||
:visible-columns="visibleColumns2"
|
|
||||||
selection="multiple"
|
|
||||||
v-model:selected="selected"
|
|
||||||
>
|
|
||||||
<template v-slot:header-selection="scope">
|
|
||||||
<q-checkbox
|
|
||||||
keep-color
|
|
||||||
color="primary"
|
|
||||||
dense
|
|
||||||
v-model="scope.selected"
|
|
||||||
/>
|
|
||||||
</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 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">
|
|
||||||
<div
|
|
||||||
v-if="
|
|
||||||
props.row.organizationName !== null ||
|
|
||||||
props.row.positionPath !== null
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{
|
|
||||||
props.row.organizationName !== null
|
|
||||||
? props.row.organizationName
|
|
||||||
: "-"
|
|
||||||
}}
|
|
||||||
{{
|
|
||||||
props.row.organizationShortName !== null
|
|
||||||
? `(${props.row.organizationShortName})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
<div class="text-weight-light">
|
|
||||||
{{
|
|
||||||
props.row.positionPath !== null
|
|
||||||
? props.row.positionPath
|
|
||||||
: "-"
|
|
||||||
}}
|
|
||||||
{{
|
|
||||||
props.row.positionNumber !== null
|
|
||||||
? `(${props.row.positionNumber})`
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="text-weight-medium">-</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
<q-td key="dateOfBirth" :props="props">
|
|
||||||
{{ props.row.dateOfBirth }}
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
</d-table>
|
|
||||||
</q-card-section>
|
|
||||||
<q-separator />
|
|
||||||
<q-card-actions align="right">
|
|
||||||
<q-btn
|
|
||||||
label="ส่งไปออกคำสั่ง"
|
|
||||||
@click="saveOrder"
|
|
||||||
:disable="checkSelected"
|
|
||||||
color="public"
|
|
||||||
>
|
|
||||||
<q-tooltpi>ส่งไปออกคำสั่ง</q-tooltpi>
|
|
||||||
</q-btn>
|
|
||||||
</q-card-actions>
|
|
||||||
</q-card>
|
|
||||||
</q-dialog>
|
|
||||||
<DialogOrgTree
|
|
||||||
v-model:modal="modalTree"
|
|
||||||
:close="closeModalTree"
|
|
||||||
:personal="personal"
|
|
||||||
:personalId="personalId"
|
|
||||||
/>
|
|
||||||
<!-- :personalId="personalId" -->
|
|
||||||
</template>
|
|
||||||
<style scoped lang="scss"></style>
|
|
||||||
|
|
@ -1,791 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { useQuasar, QForm } from "quasar";
|
|
||||||
import { onMounted, reactive, ref, watch } from "vue";
|
|
||||||
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
hideLoader,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
success,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin; //ฟังก์ชันกลางที่เรียกใช้
|
|
||||||
|
|
||||||
const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
|
|
||||||
const noData = ref<string>("ไม่พบข้อมูลผังโครงสร้าง");
|
|
||||||
|
|
||||||
const checkValidate = ref<boolean>(false);
|
|
||||||
const myFormPosition = ref<any>();
|
|
||||||
const selected = ref<string>("");
|
|
||||||
const selectedFile = ref<string>("");
|
|
||||||
const dataRespone = ref<any>();
|
|
||||||
|
|
||||||
// Set form field
|
|
||||||
let dataForm = reactive({
|
|
||||||
personalId: "",
|
|
||||||
containDate: new Date(),
|
|
||||||
posNoId: "",
|
|
||||||
positionId: "",
|
|
||||||
positionLevelId: "",
|
|
||||||
positionLineId: "",
|
|
||||||
positionPathSideId: "",
|
|
||||||
positionTypeId: "",
|
|
||||||
// salaryAmount: null,
|
|
||||||
// mouthSalaryAmount: null,
|
|
||||||
// positionSalaryAmount: null,
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
// await fetchPublishFile();
|
|
||||||
await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
});
|
|
||||||
// const fetchPublishFile = async () => {
|
|
||||||
// await http
|
|
||||||
// .get(config.API.getPublishFileHistory)
|
|
||||||
// .then((res) => {
|
|
||||||
// let data = res.data.result;
|
|
||||||
// selectedFile.value = data[0].fileName;
|
|
||||||
// })
|
|
||||||
// .catch((e) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
// })
|
|
||||||
// .finally(async () => {
|
|
||||||
// hideLoader();
|
|
||||||
// });
|
|
||||||
// };
|
|
||||||
|
|
||||||
// โหลดข้อมูลโครงสร้างจาก json
|
|
||||||
const treeData = ref<Array<any>>([]);
|
|
||||||
const loadTreeData = async () => {
|
|
||||||
expanded.value = [];
|
|
||||||
await http
|
|
||||||
.get(`${config.s3ClusterUrl}${selectedFile.value}`)
|
|
||||||
.then((res: any) => {
|
|
||||||
treeData.value = res.data;
|
|
||||||
dataRespone.value = res.data;
|
|
||||||
|
|
||||||
// Filter objects with "name" null
|
|
||||||
const filteredData = res.data.filter(filterByPersonIdNull);
|
|
||||||
treeData.value = filteredData;
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
function filterByPersonIdNull(obj: any) {
|
|
||||||
if (obj.name === null && obj.isCondition != true) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if (obj.children && obj.children.length > 0) {
|
|
||||||
obj.children = obj.children.filter(filterByPersonIdNull);
|
|
||||||
return obj.children.length > 0;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// โหลด position
|
|
||||||
const placementPosition = ref<any>([]);
|
|
||||||
const fetchplacementPosition = async () => {
|
|
||||||
await http
|
|
||||||
.get(config.API.relocationMainPosition())
|
|
||||||
.then((res: any) => {
|
|
||||||
placementPosition.value = res.data.result;
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const search = ref<string>("");
|
|
||||||
//reset Tree Filter
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
// const resetFilter = () => {
|
|
||||||
// search.value = "";
|
|
||||||
// filterRef.value.focus();
|
|
||||||
// };
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
personalId: String,
|
|
||||||
modal: Boolean,
|
|
||||||
close: {
|
|
||||||
type: Function,
|
|
||||||
default: () => console.log("close modal"),
|
|
||||||
},
|
|
||||||
personal: Object,
|
|
||||||
});
|
|
||||||
|
|
||||||
const myFilterMethod = (node: any, filter: string) => {
|
|
||||||
const filt = filter;
|
|
||||||
|
|
||||||
return (
|
|
||||||
// ((node.name && node.name == null) || !node.name) &&
|
|
||||||
(node.name && node.name.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationName && node.organizationName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionNum && node.positionNum.indexOf(filt) > -1) ||
|
|
||||||
(node.positionName && node.positionName.indexOf(filt) > -1) ||
|
|
||||||
(node.governmentCode &&
|
|
||||||
node.governmentCode.toString().indexOf(filt) > -1) ||
|
|
||||||
(node.agency && node.agency.indexOf(filt) > -1) ||
|
|
||||||
(node.government && node.government.indexOf(filt) > -1) ||
|
|
||||||
(node.department && node.department.indexOf(filt) > -1) ||
|
|
||||||
(node.pile && node.pile.indexOf(filt) > -1) ||
|
|
||||||
(node.organizationShortName &&
|
|
||||||
node.organizationShortName.indexOf(filt) > -1) ||
|
|
||||||
(node.positionSideName && node.positionSideName.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePosition && node.executivePosition.indexOf(filt) > -1) ||
|
|
||||||
(node.executivePositionSide &&
|
|
||||||
node.executivePositionSide.indexOf(filt) > -1) ||
|
|
||||||
(node.positionLevel && node.positionLevel.indexOf(filt) > -1)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const validateData = async () => {
|
|
||||||
checkValidate.value = true;
|
|
||||||
await myFormPosition.value.validate().then((result: boolean) => {
|
|
||||||
if (result == false) {
|
|
||||||
checkValidate.value = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const id = ref<string>("");
|
|
||||||
const saveAppoint = async () => {
|
|
||||||
myFormPosition.value.validate().then(async (result: boolean) => {
|
|
||||||
if (props.personalId !== undefined) {
|
|
||||||
id.value = props.personalId.toString();
|
|
||||||
}
|
|
||||||
if (result) {
|
|
||||||
const dataAppoint = await {
|
|
||||||
// personalId: props.personalId,
|
|
||||||
recruitDate: dataForm.containDate,
|
|
||||||
posNoId: dataForm.posNoId,
|
|
||||||
positionId: dataForm.positionId,
|
|
||||||
positionLevelId: dataForm.positionLevelId,
|
|
||||||
positionLineId: dataForm.positionLineId,
|
|
||||||
positionPathSideId: dataForm.positionPathSideId,
|
|
||||||
positionTypeId: dataForm.positionTypeId,
|
|
||||||
// salaryAmount: dataForm.salaryAmount,
|
|
||||||
// mouthSalaryAmount: dataForm.mouthSalaryAmount,
|
|
||||||
// positionSalaryAmount: dataForm.positionSalaryAmount,
|
|
||||||
};
|
|
||||||
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.relocationMainPut(id.value), dataAppoint)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await closeAndClear();
|
|
||||||
// await resetFilter();
|
|
||||||
// await fetchPublishFile();
|
|
||||||
await loadTreeData();
|
|
||||||
await fetchplacementPosition();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const editDataStatus = ref<boolean>(false);
|
|
||||||
const clickEditRow = () => {
|
|
||||||
editDataStatus.value = true;
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeModal = () => {
|
|
||||||
if (editDataStatus.value == true) {
|
|
||||||
dialogConfirm(
|
|
||||||
$q,
|
|
||||||
() => {
|
|
||||||
editDataStatus.value = false;
|
|
||||||
closeAndClear();
|
|
||||||
},
|
|
||||||
`ข้อมูลมีการแก้ไข`,
|
|
||||||
`ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?`
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
closeAndClear();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const closeAndClear = async () => {
|
|
||||||
await props.close();
|
|
||||||
editDataStatus.value = false;
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.personalId = "";
|
|
||||||
dataForm.containDate = new Date();
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
// dataForm.salaryAmount = null;
|
|
||||||
// dataForm.mouthSalaryAmount = null;
|
|
||||||
// dataForm.positionSalaryAmount = null;
|
|
||||||
};
|
|
||||||
// ตำแหน่งเลขที่
|
|
||||||
const posNoOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ตำแหน่ง
|
|
||||||
const positionOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ด้าน/สาขา
|
|
||||||
const positionPathSideOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ประเภทตำแหน่ง
|
|
||||||
const positionTypeOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// สายงาน
|
|
||||||
const positionLineOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
// ระดับ
|
|
||||||
const positionLevelOptions = ref<Object[]>([
|
|
||||||
{
|
|
||||||
label: "",
|
|
||||||
value: "",
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
const selectedPosition = async (data: any) => {
|
|
||||||
if (data.name == null && selected.value != data.keyId) {
|
|
||||||
editDataStatus.value = true;
|
|
||||||
selected.value = data.keyId;
|
|
||||||
|
|
||||||
// posNo Options
|
|
||||||
posNoOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionNum,
|
|
||||||
value: data.positionNumId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.posNoId = data.positionNumId;
|
|
||||||
|
|
||||||
// position Options
|
|
||||||
positionOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionName,
|
|
||||||
value: data.positionNameId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionId = data.positionNameId;
|
|
||||||
|
|
||||||
// positionPathSide Options
|
|
||||||
let positionPathSideArr: any = [];
|
|
||||||
if (data.positionSideNameObj && data.positionSideNameObj != null) {
|
|
||||||
data.positionSideNameObj.map((x: any) => {
|
|
||||||
positionPathSideArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionPathSideOptions.value = positionPathSideArr;
|
|
||||||
dataForm.positionPathSideId =
|
|
||||||
positionPathSideArr.length > 1 || positionPathSideArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionPathSideArr[0].value;
|
|
||||||
}
|
|
||||||
|
|
||||||
// positionType Options
|
|
||||||
positionTypeOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionType,
|
|
||||||
value: data.positionTypeId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionTypeId = data.positionTypeId;
|
|
||||||
|
|
||||||
// positionLine Options
|
|
||||||
positionLineOptions.value = [
|
|
||||||
{
|
|
||||||
label: data.positionLine,
|
|
||||||
value: data.positionLineId,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
dataForm.positionLineId = data.positionLineId;
|
|
||||||
|
|
||||||
// positionLevel Options
|
|
||||||
let positionLevelsArr: any = [];
|
|
||||||
if (data.positionLevelObj != null) {
|
|
||||||
data.positionLevelObj.map((x: any) => {
|
|
||||||
positionLevelsArr.push({
|
|
||||||
label: x.Name,
|
|
||||||
value: x.Id,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
positionLevelOptions.value = positionLevelsArr;
|
|
||||||
dataForm.positionLevelId =
|
|
||||||
positionLevelsArr.length > 1 || positionLevelsArr.length == 0
|
|
||||||
? ""
|
|
||||||
: positionLevelsArr[0].value;
|
|
||||||
dataForm.positionLevelId = data.positionLevelObj[0].Id;
|
|
||||||
}
|
|
||||||
} else if (selected.value == data.keyId) {
|
|
||||||
selected.value = "";
|
|
||||||
dataForm.posNoId = "";
|
|
||||||
dataForm.positionId = "";
|
|
||||||
dataForm.positionLevelId = "";
|
|
||||||
dataForm.positionLineId = "";
|
|
||||||
dataForm.positionPathSideId = "";
|
|
||||||
dataForm.positionTypeId = "";
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const checkPosition = (val: string) => {
|
|
||||||
const num = placementPosition.value.findIndex((e: string) => e === val);
|
|
||||||
return num;
|
|
||||||
};
|
|
||||||
const personal = ref<any>();
|
|
||||||
const expanded = ref<string[]>([]);
|
|
||||||
|
|
||||||
watch(props, () => {
|
|
||||||
expanded.value = [];
|
|
||||||
const dataPersonal = props.personal;
|
|
||||||
|
|
||||||
if (dataPersonal) {
|
|
||||||
dataPersonal.map((data: any) => {
|
|
||||||
personal.value = data;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (personal.value) {
|
|
||||||
// const findData = dataRespone.value.find(findByPerson);
|
|
||||||
let findData: any = null;
|
|
||||||
dataRespone.value.map((x: any) => {
|
|
||||||
findData = findByPerson(x);
|
|
||||||
|
|
||||||
if (findData != null) {
|
|
||||||
selectedPosition(findData);
|
|
||||||
for (let i = 3; i <= findData.keyId.length; i += 2) {
|
|
||||||
expanded.value.push(findData.keyId.slice(0, i));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// loadTreeData();
|
|
||||||
// selectedPosition(findData.children.children.children)
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function findByPerson(element: any): any {
|
|
||||||
if (
|
|
||||||
element.positionNumId &&
|
|
||||||
element.positionLineId === personal.value.positionLineId &&
|
|
||||||
element.positionTypeId === personal.value.positionTypeId &&
|
|
||||||
element.positionNumId === personal.value.posNoId &&
|
|
||||||
(element.positionLevelObj === null ||
|
|
||||||
element.positionLevelObj[0].Id === personal.value.positionLevelId)
|
|
||||||
) {
|
|
||||||
return element;
|
|
||||||
} else if (element.children) {
|
|
||||||
var i;
|
|
||||||
var result = null;
|
|
||||||
for (i = 0; result == null && i < element.children.length; i++) {
|
|
||||||
result = findByPerson(element.children[i]);
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-dialog v-model="props.modal" persistent>
|
|
||||||
<q-card style="width: 900px; max-width: 80vw">
|
|
||||||
<q-form ref="myFormPosition">
|
|
||||||
<DialogHeader tittle="เลือกหน่วยงานที่รับย้าย" :close="closeModal" />
|
|
||||||
<q-separator />
|
|
||||||
<q-card-section class="q-pa-sm bg-grey-1">
|
|
||||||
<div class="row col-12 q-col-gutter-sm">
|
|
||||||
<div class="col-xs-12 col-sm-7 row">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
ref="filterRef"
|
|
||||||
v-model="search"
|
|
||||||
placeholder="ค้นหา"
|
|
||||||
class="q-mb-sm"
|
|
||||||
>
|
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon name="mdi-magnify" />
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
<div class="q-pa-sm q-gutter-sm">
|
|
||||||
<q-tree
|
|
||||||
no-transition
|
|
||||||
dense
|
|
||||||
:nodes="treeData"
|
|
||||||
node-key="keyId"
|
|
||||||
:filter="search"
|
|
||||||
:no-results-label="notFound"
|
|
||||||
:no-nodes-label="noData"
|
|
||||||
:filter-method="myFilterMethod"
|
|
||||||
v-model:expanded="expanded"
|
|
||||||
>
|
|
||||||
<template v-slot:header-organization="prop">
|
|
||||||
<div class="col">
|
|
||||||
<div
|
|
||||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
|
||||||
>
|
|
||||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{ prop.node.organizationName }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!--แสดง Total Count PositionNum-->
|
|
||||||
<!-- <q-badge rounded color="grey-2" text-color="dark"
|
|
||||||
:label="prop.node.totalPositionCount" /> -->
|
|
||||||
<q-badge
|
|
||||||
v-if="prop.node.totalPositionVacant > 0"
|
|
||||||
rounded
|
|
||||||
color="red"
|
|
||||||
outline
|
|
||||||
:label="prop.node.totalPositionVacant"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</div>
|
|
||||||
<div class="col items-center q-px-xs q-pt-xs">
|
|
||||||
<div class="text-weight-medium text-grey-7">
|
|
||||||
{{ prop.node.governmentCode }}
|
|
||||||
{{ prop.node.organizationShortName }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-slot:header-person="prop">
|
|
||||||
<q-item
|
|
||||||
clickable
|
|
||||||
:active="selected == prop.node.keyId"
|
|
||||||
@click="selectedPosition(prop.node)"
|
|
||||||
:disable="
|
|
||||||
prop.node.name != null ||
|
|
||||||
checkPosition(prop.node.positionNumId) != -1
|
|
||||||
"
|
|
||||||
active-class="my-list-link text-primary text-weight-medium"
|
|
||||||
class="row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
v-if="
|
|
||||||
prop.node.avatar == '' ||
|
|
||||||
prop.node.avatar ==
|
|
||||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
|
||||||
"
|
|
||||||
src="@/assets/avatar_user.jpg"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<img
|
|
||||||
v-else
|
|
||||||
:src="prop.node.avatar"
|
|
||||||
class="col-xs-1 col-sm-2"
|
|
||||||
style="
|
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 50%;
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
|
||||||
<div
|
|
||||||
v-if="prop.node.name == null"
|
|
||||||
class="q-px-sm text-weight-medium text-red"
|
|
||||||
>
|
|
||||||
ว่าง
|
|
||||||
</div>
|
|
||||||
<!--=====หัวหน้า สีเขียว=====-->
|
|
||||||
<div v-else-if="prop.node.positionLeaderFlag">
|
|
||||||
<div
|
|
||||||
class="q-px-sm text-weight-medium text-primary"
|
|
||||||
>
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--=====ลูกน้อง สีปกติ=====-->
|
|
||||||
<div v-else>
|
|
||||||
<div class="q-px-sm text-weight-medium">
|
|
||||||
{{ prop.node.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--ต่อท้ายชื่อคน แสดงสีปกติ-->
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionName }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionNum }}
|
|
||||||
</div>
|
|
||||||
<div class="q-pr-sm">
|
|
||||||
{{ prop.node.positionLevel }}
|
|
||||||
</div>
|
|
||||||
<q-icon
|
|
||||||
v-if="prop.node.positionLeaderFlag"
|
|
||||||
class="q-mr-sm"
|
|
||||||
size="15px"
|
|
||||||
color="primary"
|
|
||||||
name="mdi-bookmark"
|
|
||||||
></q-icon>
|
|
||||||
|
|
||||||
<q-space />
|
|
||||||
</q-item>
|
|
||||||
</template>
|
|
||||||
</q-tree>
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-5">
|
|
||||||
<q-card flat bordered class="fit q-pa-sm">
|
|
||||||
<q-scroll-area visible style="height: 70vh">
|
|
||||||
<div class="row col-12 q-col-gutter-xs">
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12"></div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="dataForm.containDate"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
:model-value="
|
|
||||||
date2Thai(new Date(dataForm.containDate))
|
|
||||||
"
|
|
||||||
:rules="[ (val: string) =>!!val ||`${'วันที่รายงานตัว'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'วันที่รายงานตัว'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
style="color: var(--q-primary)"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
outlined
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="posNoOptions"
|
|
||||||
v-model="dataForm.posNoId"
|
|
||||||
:label="`${'ตำแหน่งเลขที่'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionOptions"
|
|
||||||
v-model="dataForm.positionId"
|
|
||||||
:label="`${'ตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
emit-value
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionPathSideOptions"
|
|
||||||
v-model="dataForm.positionPathSideId"
|
|
||||||
:label="`${'ด้าน/สาขา'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionTypeOptions"
|
|
||||||
v-model="dataForm.positionTypeId"
|
|
||||||
:label="`${'ประเภทตำแหน่ง'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
hide-bottom-space
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLineOptions"
|
|
||||||
v-model="dataForm.positionLineId"
|
|
||||||
:label="`${'สายงาน'}`"
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
||||||
<q-select
|
|
||||||
outlined
|
|
||||||
class="full-width inputgreen cursor-pointer custom-input"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:options="positionLevelOptions"
|
|
||||||
v-model="dataForm.positionLevelId"
|
|
||||||
:label="`${'ระดับ'}`"
|
|
||||||
hide-bottom-space
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับ'}`]"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<!-- <div class="col-sx-12 col-sm-12 col-md-12">
|
|
||||||
<q-separator inset size="2px" class="q-my-md" />
|
|
||||||
</div> -->
|
|
||||||
<!-- <div class="col-xs-6 col-sm-6 col-md-6">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="dataForm.salaryAmount"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
|
||||||
:label="`${'เงินเดือน'}`"
|
|
||||||
@update:modelValue="clickEditRow"
|
|
||||||
type="number"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<!-- <div class="col-xs-6 col-sm-6 col-md-6">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="dataForm.positionSalaryAmount"
|
|
||||||
:rules="[
|
|
||||||
(val) => !!val || `${'กรุณากรอกเงินประจำตำแหน่ง'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'เงินประจำตำแหน่ง'}`"
|
|
||||||
@update:modelValue="clickEditRow"
|
|
||||||
type="number"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<!-- <div class="col-xs-6 col-sm-6 col-md-6">
|
|
||||||
<q-input
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
v-model="dataForm.mouthSalaryAmount"
|
|
||||||
:rules="[
|
|
||||||
(val) =>
|
|
||||||
!!val || `${'กรุณากรอกเงินค่าตอบแทนรายเดือน'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'เงินค่าตอบแทนรายเดือน'}`"
|
|
||||||
@update:modelValue="clickEditRow"
|
|
||||||
type="number"
|
|
||||||
hide-bottom-space
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
</q-scroll-area>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
|
||||||
|
|
||||||
<q-separator />
|
|
||||||
<DialogFooter
|
|
||||||
:editvisible="true"
|
|
||||||
:validate="validateData"
|
|
||||||
:save="saveAppoint"
|
|
||||||
v-model:modalEdit="editDataStatus"
|
|
||||||
/>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
|
||||||
</q-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.q-tree__node-header {
|
|
||||||
padding: 0px;
|
|
||||||
margin-top: 0px;
|
|
||||||
border-radius: 4px;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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);
|
|
||||||
/* box-shadow: 1px 1px 7px 1px rgba(41, 95, 255, 0.15) !important; */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,526 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { onMounted, ref } from "vue";
|
|
||||||
import { useQuasar } from "quasar";
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
import CurrencyInput from "@/components/CurruncyInput.vue";
|
|
||||||
import type { QTableProps, QForm } from "quasar";
|
|
||||||
import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
|
|
||||||
|
|
||||||
const modalPersonal = ref<boolean>(false);
|
|
||||||
const personId = ref<string>("");
|
|
||||||
const $q = useQuasar();
|
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
const edit = ref<boolean>(false);
|
|
||||||
const dataId = route.params.id as string;
|
|
||||||
const {
|
|
||||||
date2Thai,
|
|
||||||
dialogMessage,
|
|
||||||
messageError,
|
|
||||||
showLoader,
|
|
||||||
hideLoader,
|
|
||||||
success,
|
|
||||||
dialogConfirm,
|
|
||||||
} = mixin;
|
|
||||||
|
|
||||||
const roleAdmin = ref<boolean>(false);
|
|
||||||
const myForm = ref<QForm | null>(null);
|
|
||||||
const name = ref<string>("นายสมคิด ยอดใจ");
|
|
||||||
const level = ref<string>("ชำนาญการพิเศษ");
|
|
||||||
const institution = ref<string>("ฝ่ายบริหารงานทั่วไป");
|
|
||||||
const fullname = ref<string>("");
|
|
||||||
const profileId = ref<string>("");
|
|
||||||
const prefix = ref<string>("");
|
|
||||||
const prefixId = ref<string>("");
|
|
||||||
const firstname = ref<string>("");
|
|
||||||
const citizenId = ref<string>("");
|
|
||||||
const lastname = ref<string>("");
|
|
||||||
const position = ref<string>("");
|
|
||||||
const posNo = ref<string>("");
|
|
||||||
const positionLevel = ref<string>("");
|
|
||||||
const educationOld = ref<string>("");
|
|
||||||
const createdAt = ref<string>("");
|
|
||||||
const organization = ref<string>("");
|
|
||||||
const reason = ref<string>("");
|
|
||||||
const status = ref<string>("");
|
|
||||||
const date = ref<Date | null>(null);
|
|
||||||
const amount = ref<number>();
|
|
||||||
const amountOld = ref<number>();
|
|
||||||
const positionTypeOld = ref<string>("");
|
|
||||||
const positionLevelOld = ref<string>("");
|
|
||||||
const dateOfBirth = ref<Date>();
|
|
||||||
const genderId = ref<string>("");
|
|
||||||
const nationality = ref<string>("");
|
|
||||||
const race = ref<string>("");
|
|
||||||
const religionId = ref<string>("");
|
|
||||||
const bloodGroupId = ref<string>("");
|
|
||||||
const relationshipId = ref<string>("");
|
|
||||||
const telephoneNumber = ref<string>("");
|
|
||||||
const positionNumberOld = ref<string>("");
|
|
||||||
const organizationPositionOld = ref<string>("");
|
|
||||||
const isActive = ref<string>("");
|
|
||||||
// const responseData = ref<ResponseDataDetail>({
|
|
||||||
// createdAt: new Date(),
|
|
||||||
// date: new Date(),
|
|
||||||
// id: "",
|
|
||||||
// organization: "",
|
|
||||||
// organizationPositionOld: "",
|
|
||||||
// positionLevelOld: "",
|
|
||||||
// positionNumberOld: "",
|
|
||||||
// positionTypeOld: "",
|
|
||||||
// reason: "",
|
|
||||||
// salary: 0,
|
|
||||||
// status: "",
|
|
||||||
// });
|
|
||||||
|
|
||||||
// const rows = ref<TypeFile[]>([]);
|
|
||||||
// const columns = ref<QTableProps["columns"]>([
|
|
||||||
// {
|
|
||||||
// name: "no",
|
|
||||||
// align: "left",
|
|
||||||
// label: "ลำดับ",
|
|
||||||
// sortable: true,
|
|
||||||
// field: "no",
|
|
||||||
// headerStyle: "font-size: 14px",
|
|
||||||
// style: "font-size: 14px",
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// name: "fileName",
|
|
||||||
// align: "left",
|
|
||||||
// label: "ชื่อไฟล์",
|
|
||||||
// sortable: true,
|
|
||||||
// field: "fileName",
|
|
||||||
// headerStyle: "font-size: 14px",
|
|
||||||
// style: "font-size: 14px",
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// name: "btnMicrosoft",
|
|
||||||
// align: "right",
|
|
||||||
// label: "ปุ่ม",
|
|
||||||
// sortable: true,
|
|
||||||
// field: "btnMicrosoft",
|
|
||||||
// headerStyle: "font-size: 14px",
|
|
||||||
// style: "font-size: 14px",
|
|
||||||
// },
|
|
||||||
// ]);
|
|
||||||
|
|
||||||
const getData = async () => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(config.API.relocationDetail(dataId))
|
|
||||||
.then((res: any) => {
|
|
||||||
const data = res.data.result;
|
|
||||||
profileId.value = data.profileId;
|
|
||||||
citizenId.value = data.citizenId;
|
|
||||||
fullname.value = `${data.prefix}${data.firstname} ${data.lastname}`;
|
|
||||||
prefixId.value = data.prefixId;
|
|
||||||
prefix.value = data.prefix;
|
|
||||||
firstname.value = data.firstname;
|
|
||||||
lastname.value = data.lastname;
|
|
||||||
educationOld.value = data.educationOld;
|
|
||||||
position.value = data.position;
|
|
||||||
posNo.value = data.posNo;
|
|
||||||
positionLevel.value = data.positionLevel;
|
|
||||||
createdAt.value = data.createdAt;
|
|
||||||
organization.value = data.organization;
|
|
||||||
reason.value = data.reason;
|
|
||||||
status.value = data.status;
|
|
||||||
date.value = data.date;
|
|
||||||
amount.value = data.amount;
|
|
||||||
amountOld.value = data.amountOld;
|
|
||||||
positionTypeOld.value = data.positionTypeOld;
|
|
||||||
positionLevelOld.value = data.positionLevelOld;
|
|
||||||
positionNumberOld.value = data.positionNumberOld;
|
|
||||||
organizationPositionOld.value = data.organizationPositionOld;
|
|
||||||
dateOfBirth.value = data.dateOfBirth;
|
|
||||||
genderId.value = data.genderId;
|
|
||||||
nationality.value = data.nationality;
|
|
||||||
race.value = data.race;
|
|
||||||
religionId.value = data.religionId;
|
|
||||||
bloodGroupId.value = data.bloodGroupId;
|
|
||||||
relationshipId.value = data.relationshipId;
|
|
||||||
telephoneNumber.value = data.telephoneNumber;
|
|
||||||
isActive.value = data.isActive;
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
// messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const getClass = (val: boolean) => {
|
|
||||||
return {
|
|
||||||
"full-width inputgreen cursor-pointer": val,
|
|
||||||
"full-width cursor-pointer": !val,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
//
|
|
||||||
const conditionSave = async () => {
|
|
||||||
if (myForm.value !== null) {
|
|
||||||
myForm.value.validate().then((success: any) => {
|
|
||||||
if (success) {
|
|
||||||
dialogConfirm(
|
|
||||||
$q,
|
|
||||||
async () => await saveData(),
|
|
||||||
"ต้องการแก้ไขข้อมูลหรือไม่?",
|
|
||||||
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
const cancelBtn = () => {
|
|
||||||
edit.value = !edit;
|
|
||||||
getData();
|
|
||||||
};
|
|
||||||
const saveData = async () => {
|
|
||||||
const body = {
|
|
||||||
educationOld: educationOld.value,
|
|
||||||
prefixId: prefixId.value,
|
|
||||||
citizenId: citizenId.value,
|
|
||||||
firstname: firstname.value,
|
|
||||||
lastname: lastname.value,
|
|
||||||
reason: reason.value,
|
|
||||||
organizationPositionOld: organizationPositionOld.value,
|
|
||||||
positionTypeOld: positionTypeOld.value,
|
|
||||||
positionLevelOld: positionLevelOld.value,
|
|
||||||
positionNumberOld: positionNumberOld.value,
|
|
||||||
amount: amount.value,
|
|
||||||
amountOld: amountOld.value,
|
|
||||||
dateOfBirth: dateOfBirth.value,
|
|
||||||
genderId: genderId.value,
|
|
||||||
nationality: nationality.value,
|
|
||||||
race: race.value,
|
|
||||||
religionId: religionId.value,
|
|
||||||
bloodGroupId: bloodGroupId.value,
|
|
||||||
relationshipId: relationshipId.value,
|
|
||||||
telephoneNumber: telephoneNumber.value,
|
|
||||||
};
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.put(config.API.relocationMainEdit(dataId), body)
|
|
||||||
.then(() => {
|
|
||||||
success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
|
|
||||||
edit.value = false;
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(async () => {
|
|
||||||
await getData();
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
function onclickViewinfo(id: string) {
|
|
||||||
modalPersonal.value = true;
|
|
||||||
personId.value = id;
|
|
||||||
}
|
|
||||||
|
|
||||||
function updatemodalPersonal(modal: boolean) {
|
|
||||||
modalPersonal.value = modal;
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
await getData();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<div class="toptitle text-dark col-12 row items-center">
|
|
||||||
<q-btn
|
|
||||||
icon="mdi-arrow-left"
|
|
||||||
unelevated
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
flat
|
|
||||||
color="primary"
|
|
||||||
class="q-mr-sm"
|
|
||||||
@click="router.go(-1)"
|
|
||||||
/>
|
|
||||||
รายละเอียดการย้าย {{ 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">{{ 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="@/assets/avatar_user.jpg" />
|
|
||||||
</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">
|
|
||||||
{{ 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">
|
|
||||||
{{ 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">
|
|
||||||
{{ organizationPositionOld }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card>
|
|
||||||
|
|
||||||
<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">
|
|
||||||
<div class="q-pl-sm text-weight-bold text-dark">
|
|
||||||
แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<div v-if="status !== 'REPORT' && status !== 'DONE'">
|
|
||||||
<div class="q-gutter-sm" v-if="!edit">
|
|
||||||
<q-btn
|
|
||||||
outline
|
|
||||||
color="primary"
|
|
||||||
dense
|
|
||||||
icon-right="mdi-file-edit-outline"
|
|
||||||
class="q-px-sm"
|
|
||||||
label="แก้ไข"
|
|
||||||
style="width: 80px"
|
|
||||||
@click="edit = !edit"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="q-gutter-sm" v-else>
|
|
||||||
<q-btn
|
|
||||||
outline
|
|
||||||
color="public"
|
|
||||||
dense
|
|
||||||
class="q-px-sm"
|
|
||||||
label="บันทึก"
|
|
||||||
style="width: 80px"
|
|
||||||
@click="conditionSave"
|
|
||||||
/>
|
|
||||||
<q-btn
|
|
||||||
outline
|
|
||||||
color="red"
|
|
||||||
dense
|
|
||||||
class="q-px-sm"
|
|
||||||
label="ยกเลิก"
|
|
||||||
style="width: 80px"
|
|
||||||
@click="cancelBtn"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12"><q-separator /></div>
|
|
||||||
<q-form ref="myForm">
|
|
||||||
<div class="row col-12 q-pa-md">
|
|
||||||
<div class="col-12 row bg-white q-col-gutter-md">
|
|
||||||
<div class="col-xs-6 col-sm-3 row items-center">
|
|
||||||
<div class="text-weight-bold text-grey">วุฒิการศึกษา</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="educationOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกประเภทตำแหน่ง'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'วุฒิ/สาขา'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 row items-center">
|
|
||||||
<div class="col-12 q-pb-sm"><q-separator /></div>
|
|
||||||
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="text-weight-bold text-grey">ตำแหน่ง/สังกัดเดิม</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="organizationPositionOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'ตำแหน่ง/สังกัด'}`"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 row items-center">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="positionTypeOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกประเภทตำแหน่ง'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'ประเภทตำแหน่ง'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 row items-center">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="positionLevelOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'ระดับ'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 row items-center">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="positionNumberOld"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'เลขที่'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-6 col-sm-3 row items-center">
|
|
||||||
<div class="col-12">
|
|
||||||
<CurrencyInput
|
|
||||||
v-model="amountOld"
|
|
||||||
:edit="edit"
|
|
||||||
:options="{
|
|
||||||
currency: 'THB',
|
|
||||||
}"
|
|
||||||
:label="`${'เงินเดือน'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12"><q-separator /></div>
|
|
||||||
|
|
||||||
<!-- <div class="col-xs-6 col-sm-6 row items-center">
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="organization"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'โอนไปสังกัด'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
<div class="col-xs-6 col-sm-3 row items-center">
|
|
||||||
<div class="text-weight-bold text-grey col-12">
|
|
||||||
เงินเดือนตำแหน่งและหน่วยงานที่รับย้าย
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<!-- <q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="amount"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'เงินเดือน'}`"
|
|
||||||
type="number"
|
|
||||||
/> -->
|
|
||||||
<CurrencyInput
|
|
||||||
v-model="amount"
|
|
||||||
:edit="edit"
|
|
||||||
:options="{
|
|
||||||
currency: 'THB',
|
|
||||||
}"
|
|
||||||
:label="`${'เงินเดือน'}`"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<q-input
|
|
||||||
:class="getClass(edit)"
|
|
||||||
:outlined="edit"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
:readonly="!edit"
|
|
||||||
:borderless="!edit"
|
|
||||||
v-model="reason"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'หมายเหตุ '}`"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
|
||||||
|
|
||||||
<PopupPersonal
|
|
||||||
:modal="modalPersonal"
|
|
||||||
:id="personId"
|
|
||||||
@update:modal="updatemodalPersonal"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="scss" scope>
|
|
||||||
.q-img {
|
|
||||||
border-radius: 5px;
|
|
||||||
height: 70px;
|
|
||||||
}
|
|
||||||
.text-top {
|
|
||||||
color: gray;
|
|
||||||
font-weight: 400;
|
|
||||||
padding-bottom: 3px;
|
|
||||||
}
|
|
||||||
.text-detail {
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,8 +1,11 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watch } from "vue";
|
import { ref, computed, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* impportType
|
* impportType
|
||||||
|
|
@ -18,8 +21,6 @@ import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
/**
|
/**
|
||||||
* importStore
|
* importStore
|
||||||
*/
|
*/
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const { statusText } = useTransferDataStore();
|
const { statusText } = useTransferDataStore();
|
||||||
|
|
@ -9,7 +9,7 @@ import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import genReport from "@/plugins/genreport";
|
import genReport from "@/plugins/genreport";
|
||||||
|
|
||||||
import type { QTableProps, QForm } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
|
import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
|
||||||
import type {
|
import type {
|
||||||
TypeFile,
|
TypeFile,
|
||||||
|
|
@ -38,15 +38,14 @@ const roleAdmin = ref<boolean>(false); //admin
|
||||||
const edit = ref<boolean>(false); //การแก่ไข
|
const edit = ref<boolean>(false); //การแก่ไข
|
||||||
const dataProfile = ref<DataProfile>(); //ข้อมูลส่วนตัว
|
const dataProfile = ref<DataProfile>(); //ข้อมูลส่วนตัว
|
||||||
|
|
||||||
const organizationPositionOld = ref<string>("");
|
const organizationPositionOld = ref<string>(""); //ตำแหน่ง/สังกัด
|
||||||
const positionTypeOld = ref<string>("");
|
const positionTypeOld = ref<string>(""); //ประเภทตำแหน่ง
|
||||||
const positionLevelOld = ref<string>("");
|
const positionLevelOld = ref<string>(""); //ระดับตำแหน่ง
|
||||||
const posNo = ref<string>("");
|
const posNo = ref<string>(""); //เลขที่
|
||||||
const salary = ref<number>(0);
|
const salary = ref<number>(0); //เงินเดือน
|
||||||
const organization = ref<string>("");
|
const organization = ref<string>(""); //โอนไปสังกัด
|
||||||
const date = ref<Date | null>(null);
|
const date = ref<Date | null>(null); //ตั้งแต่วัน
|
||||||
const reason = ref<string>("");
|
const reason = ref<string>(""); //หมายเหตุ
|
||||||
const rows = ref<TypeFile[]>([]); //รายการเอกสารเพิ่มเติม
|
|
||||||
//ข้อมูลการขอโอน
|
//ข้อมูลการขอโอน
|
||||||
const responseData = ref<ResponseDataDetail>({
|
const responseData = ref<ResponseDataDetail>({
|
||||||
profileId: "",
|
profileId: "",
|
||||||
|
|
@ -65,6 +64,7 @@ const responseData = ref<ResponseDataDetail>({
|
||||||
fullname: "",
|
fullname: "",
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const rows = ref<TypeFile[]>([]); //รายการเอกสารเพิ่มเติม
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useRouter, useRoute } from "vue-router";
|
import { useRouter, useRoute } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useRoute, useRouter } from "vue-router";
|
import { useRoute, useRouter } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useRouter, useRoute } from "vue-router";
|
import { useRouter, useRoute } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
|
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useRoute, useRouter } from "vue-router";
|
import { useRoute, useRouter } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
|
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@ import { useRouter, useRoute } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ import { useRoute, useRouter } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@ import { useRoute, useRouter } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
|
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,7 @@ import { useRouter, useRoute } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
|
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -402,6 +402,7 @@ onMounted(async () => {
|
||||||
<div class="toptitle text-dark col-12 row items-center">
|
<div class="toptitle text-dark col-12 row items-center">
|
||||||
รายการผู้ทดลองปฏิบัติหน้าที่ราชการ
|
รายการผู้ทดลองปฏิบัติหน้าที่ราชการ
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
|
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
|
||||||
<div class="row q-col-gutter-sm">
|
<div class="row q-col-gutter-sm">
|
||||||
<div class="row col-12 q-col-gutter-sm">
|
<div class="row col-12 q-col-gutter-sm">
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@ import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useRoute } from "vue-router";
|
import { useRoute } from "vue-router";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
import criterion from "@/modules/05_placement/components/Other/Criterion.vue";
|
import criterion from "@/modules/05_placement/components/probation/Criterion.vue";
|
||||||
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
import type { ListDataText } from "@/modules/05_placement/interface/index/Main";
|
||||||
|
|
||||||
const optionText = ref<ListDataText[]>([
|
const optionText = ref<ListDataText[]>([
|
||||||
|
|
|
||||||
|
|
@ -283,6 +283,14 @@ interface ListMenu {
|
||||||
type: string;
|
type: string;
|
||||||
color: string;
|
color: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface DataEducation {
|
||||||
|
university: string;
|
||||||
|
degree: string;
|
||||||
|
major: string;
|
||||||
|
graduation: string;
|
||||||
|
}
|
||||||
|
|
||||||
export type {
|
export type {
|
||||||
DataOption,
|
DataOption,
|
||||||
DataOptionInsignia,
|
DataOptionInsignia,
|
||||||
|
|
@ -307,6 +315,7 @@ export type {
|
||||||
tableType,
|
tableType,
|
||||||
ListDataText,
|
ListDataText,
|
||||||
ListMenu,
|
ListMenu,
|
||||||
|
DataEducation,
|
||||||
};
|
};
|
||||||
|
|
||||||
export { AddressDataDefualt, FamilyDataDefualt };
|
export { AddressDataDefualt, FamilyDataDefualt };
|
||||||
|
|
|
||||||
|
|
@ -2,4 +2,103 @@ interface OpType {
|
||||||
commandCode: string;
|
commandCode: string;
|
||||||
id: string;
|
id: string;
|
||||||
}
|
}
|
||||||
export type { OpType };
|
|
||||||
|
interface DataPerson {
|
||||||
|
age: string;
|
||||||
|
bloodGroup: string;
|
||||||
|
bmaOfficer: string;
|
||||||
|
certificates: [
|
||||||
|
{
|
||||||
|
certificateNo: string;
|
||||||
|
certificateType: string;
|
||||||
|
expireDate: string;
|
||||||
|
id: string;
|
||||||
|
issueDate: string;
|
||||||
|
issuer: string;
|
||||||
|
}
|
||||||
|
];
|
||||||
|
couple: boolean;
|
||||||
|
currentAddress: string;
|
||||||
|
currentDistrictId: string;
|
||||||
|
currentProvinceId: string;
|
||||||
|
currentSubDistrictId: string;
|
||||||
|
currentZipCode: string;
|
||||||
|
dateOfBirth: any;
|
||||||
|
docs: any;
|
||||||
|
draft: boolean;
|
||||||
|
education: Education[];
|
||||||
|
examNumber: number;
|
||||||
|
examRound: string;
|
||||||
|
fatherFirstName: string;
|
||||||
|
fatherLastName: string;
|
||||||
|
fatherOccupation: string;
|
||||||
|
fatherPrefix: string;
|
||||||
|
firstname: string;
|
||||||
|
fullName: string;
|
||||||
|
gender: string;
|
||||||
|
idCard: string;
|
||||||
|
isProperty: [
|
||||||
|
{
|
||||||
|
name: string;
|
||||||
|
value: boolean;
|
||||||
|
}
|
||||||
|
];
|
||||||
|
isRelief: boolean;
|
||||||
|
lastname: string;
|
||||||
|
marryFirstName: string;
|
||||||
|
marryLastName: string;
|
||||||
|
marryOccupation: string;
|
||||||
|
marryPrefix: string;
|
||||||
|
motherFirstName: string;
|
||||||
|
motherLastName: string;
|
||||||
|
motherOccupation: string;
|
||||||
|
motherPrefix: string;
|
||||||
|
nationality: string;
|
||||||
|
pass: string;
|
||||||
|
personalId: string;
|
||||||
|
point: number;
|
||||||
|
pointA: number;
|
||||||
|
pointB: number;
|
||||||
|
pointC: number;
|
||||||
|
pointTotal: number;
|
||||||
|
pointTotalA: number;
|
||||||
|
pointTotalB: number;
|
||||||
|
pointTotalC: number;
|
||||||
|
positionCandidate: string;
|
||||||
|
positionCandidateId: string;
|
||||||
|
prefix: string;
|
||||||
|
race: string;
|
||||||
|
registAddress: string;
|
||||||
|
registDistrictId: string;
|
||||||
|
registProvinceId: string;
|
||||||
|
registSame: boolean;
|
||||||
|
registSubDistrictId: string;
|
||||||
|
registZipCode: string;
|
||||||
|
relationship: string;
|
||||||
|
religion: string;
|
||||||
|
telephone: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Education {
|
||||||
|
country: string;
|
||||||
|
degree: string;
|
||||||
|
duration: string;
|
||||||
|
durationYear: string;
|
||||||
|
educationLevel: string;
|
||||||
|
educationLevelId: string;
|
||||||
|
endDate: string;
|
||||||
|
field: string;
|
||||||
|
finishDate: Date;
|
||||||
|
fundName: string;
|
||||||
|
gpa: string;
|
||||||
|
id: string;
|
||||||
|
institute: string;
|
||||||
|
isDate: boolean;
|
||||||
|
isEducation: string;
|
||||||
|
other: string;
|
||||||
|
positionPath: string;
|
||||||
|
positionPathId: string;
|
||||||
|
startDate: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export type { OpType, DataPerson, Education };
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@ const PlacementMain = () => import("@/modules/05_placement/views/01_Main.vue");
|
||||||
const PlacementDetail = () =>
|
const PlacementDetail = () =>
|
||||||
import("@/modules/05_placement/components/PersonalList/PersonalListPage.vue");
|
import("@/modules/05_placement/components/PersonalList/PersonalListPage.vue");
|
||||||
const PlacementPersonalDetail = () =>
|
const PlacementPersonalDetail = () =>
|
||||||
import("@/modules/05_placement/components/PersonalDetail/Detail.vue");
|
import("@/modules/05_placement/components/PersonalDetail/DetailMain.vue");
|
||||||
|
|
||||||
// รายการขอโอน
|
// รายการขอโอน
|
||||||
const transfer = () =>
|
const transfer = () =>
|
||||||
|
|
@ -19,27 +19,55 @@ const transferbyId = () =>
|
||||||
const receiveMain = () =>
|
const receiveMain = () =>
|
||||||
import("@/modules/05_placement/views/03_receiveMain.vue");
|
import("@/modules/05_placement/views/03_receiveMain.vue");
|
||||||
const ReceiveAdd = () =>
|
const ReceiveAdd = () =>
|
||||||
import("@/modules/05_placement/components/Receive/FormAdd.vue");
|
import("@/modules/05_placement/components/Receive/ReceiveAddPerson.vue");
|
||||||
const receiveDetail2 = () =>
|
const receiveDetail2 = () =>
|
||||||
import("@/modules/05_placement/components/Receive/receiveDetail2.vue");
|
import("@/modules/05_placement/components/Receive/ReceiveDetail.vue");
|
||||||
|
|
||||||
|
//รายการช่วยราชการ
|
||||||
|
const helpgovernment = () =>
|
||||||
|
import("@/modules/05_placement/views/04_helpGovernmentMain.vue");
|
||||||
|
const helpgovernmentbyId = () =>
|
||||||
|
import(
|
||||||
|
"@/modules/05_placement/components/Help-Government/HelpGovernmentDetail.vue"
|
||||||
|
);
|
||||||
|
|
||||||
|
//รายการส่งตัวกลับ
|
||||||
|
const repatriate = () =>
|
||||||
|
import("@/modules/05_placement/views/05_repatriateMain.vue");
|
||||||
|
const repatriatebyId = () =>
|
||||||
|
import("@/modules/05_placement/components/Repatriate/RepatriateDetail.vue");
|
||||||
|
|
||||||
|
//รายการแต่งตั้ง-เลื่อน-ย้าย
|
||||||
|
const AppointmentMain = () =>
|
||||||
|
import("@/modules/05_placement/views/06_appointPromoteMain.vue");
|
||||||
|
const AppointmentDetail = () =>
|
||||||
|
import("@/modules/05_placement/components/AppointMent/AppointMentDetail.vue");
|
||||||
|
|
||||||
|
//รายการปรับระดับชั้นงานลูกจ้าง
|
||||||
|
const AppointEmployeeMain = () =>
|
||||||
|
import("@/modules/05_placement/views/07_appointEmployeeMain.vue");
|
||||||
|
const AppointEmployeeDetail = () =>
|
||||||
|
import("@/modules/05_placement/components/AppointEmployee/AppointEmployeeDetail.vue");
|
||||||
|
|
||||||
|
//อื่นๆ
|
||||||
|
const OtherMain = () =>
|
||||||
|
import("@/modules/05_placement/views/08_otherMain.vue");
|
||||||
|
const OthertDetail = () =>
|
||||||
|
import("@/modules/05_placement/components/Other/OtherDetail.vue");
|
||||||
|
|
||||||
// ระบบทดลองงาน
|
// ระบบทดลองงาน
|
||||||
const mainProbation = () =>
|
const mainProbation = () =>
|
||||||
import("@/modules/05_placement/components/probation/MainProbation.vue");
|
import("@/modules/05_placement/components/probation/MainProbation.vue");
|
||||||
|
|
||||||
const probationDetail = () =>
|
const probationDetail = () =>
|
||||||
import("@/modules/05_placement/components/probation/ProbationDetail.vue");
|
import("@/modules/05_placement/components/probation/ProbationDetail.vue");
|
||||||
|
|
||||||
const probationFormEvaluation = () =>
|
const probationFormEvaluation = () =>
|
||||||
import("@/modules/05_placement/components/probation/MainDetail.vue");
|
import("@/modules/05_placement/components/probation/MainDetail.vue");
|
||||||
const probationFormEvaluationDetail = () =>
|
const probationFormEvaluationDetail = () =>
|
||||||
import("@/modules/05_placement/components/probation/MainDetail.vue");
|
import("@/modules/05_placement/components/probation/MainDetail.vue");
|
||||||
|
|
||||||
const probationWorkAdd = () =>
|
const probationWorkAdd = () =>
|
||||||
import("@/modules/05_placement/components/probation/MainDetail.vue");
|
import("@/modules/05_placement/components/probation/MainDetail.vue");
|
||||||
const probationFormAssign = () =>
|
const probationFormAssign = () =>
|
||||||
import("@/modules/05_placement/components/probation/FormAssign.vue");
|
import("@/modules/05_placement/components/probation/FormAssign.vue");
|
||||||
|
|
||||||
const FormSaveResultAdd = () =>
|
const FormSaveResultAdd = () =>
|
||||||
import(
|
import(
|
||||||
"@/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAdd.vue"
|
"@/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAdd.vue"
|
||||||
|
|
@ -57,41 +85,6 @@ const FormSaveResultAddCommander = () =>
|
||||||
"./components/probation/FormEvaluation/FormSaveResultAddCommander.vue"
|
"./components/probation/FormEvaluation/FormSaveResultAddCommander.vue"
|
||||||
);
|
);
|
||||||
|
|
||||||
const helpgovernment = () =>
|
|
||||||
import("@/modules/05_placement/components/helpgovernment/mainHelp.vue");
|
|
||||||
const helpgovernmentbyId = () =>
|
|
||||||
import(
|
|
||||||
"@/modules/05_placement/components/helpgovernment/governmentDetail.vue"
|
|
||||||
);
|
|
||||||
const repatriate = () =>
|
|
||||||
import("@/modules/05_placement/components/Repatriate/RepatriateMain.vue");
|
|
||||||
const repatriatebyId = () =>
|
|
||||||
import("@/modules/05_placement/components/Repatriate/RepatriatebyId.vue");
|
|
||||||
const relocation = () =>
|
|
||||||
import("@/modules/05_placement/components/Relocation/RelocationMain.vue");
|
|
||||||
const relocationbyId = () =>
|
|
||||||
import("@/modules/05_placement/components/Relocation/RelocationbyId.vue");
|
|
||||||
//รับโอน
|
|
||||||
|
|
||||||
// const receiveDetail = () =>
|
|
||||||
// import("@/modules/05_placement/components/Receive/receiveDetail.vue");
|
|
||||||
|
|
||||||
//แต่งตั้ง-เลื่อน
|
|
||||||
const AppointmentMain = () =>
|
|
||||||
import("@/modules/05_placement/components/AppointMent/Main.vue");
|
|
||||||
const AppointmentDetail = () =>
|
|
||||||
import("@/modules/05_placement/components/AppointMent/Detail.vue");
|
|
||||||
//แต่งตั้งลูกจ้างประจำ
|
|
||||||
const AppointEmployeeMain = () =>
|
|
||||||
import("@/modules/05_placement/components/AppointEmployee/Main.vue");
|
|
||||||
const AppointEmployeeDetail = () =>
|
|
||||||
import("@/modules/05_placement/components/AppointEmployee/Detail.vue");
|
|
||||||
//อื่นๆ
|
|
||||||
const OtherMain = () =>
|
|
||||||
import("@/modules/05_placement/components/Other/Main.vue");
|
|
||||||
const OthertDetail = () =>
|
|
||||||
import("@/modules/05_placement/components/Other/Detail.vue");
|
|
||||||
|
|
||||||
export default [
|
export default [
|
||||||
{
|
{
|
||||||
path: "/placement",
|
path: "/placement",
|
||||||
|
|
@ -255,6 +248,7 @@ export default [
|
||||||
Role: "STAFF",
|
Role: "STAFF",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
//รายการรับโอน
|
//รายการรับโอน
|
||||||
{
|
{
|
||||||
path: "/placement/receive",
|
path: "/placement/receive",
|
||||||
|
|
@ -286,6 +280,8 @@ export default [
|
||||||
Role: "STAFF",
|
Role: "STAFF",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
|
//รายการช่วยราชการ
|
||||||
{
|
{
|
||||||
path: "/placement/help-government",
|
path: "/placement/help-government",
|
||||||
name: "help-government",
|
name: "help-government",
|
||||||
|
|
@ -306,6 +302,8 @@ export default [
|
||||||
Role: "STAFF",
|
Role: "STAFF",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// รายการส่งตัวกลับ
|
||||||
{
|
{
|
||||||
path: "/placement/repatriate",
|
path: "/placement/repatriate",
|
||||||
name: "repatriate",
|
name: "repatriate",
|
||||||
|
|
@ -326,6 +324,8 @@ export default [
|
||||||
Role: "STAFF",
|
Role: "STAFF",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// รายการแต่งตั้ง-เลื่อน-ย้าย
|
||||||
{
|
{
|
||||||
path: "/placement/appoint-promote",
|
path: "/placement/appoint-promote",
|
||||||
name: "appoint-promote",
|
name: "appoint-promote",
|
||||||
|
|
@ -346,6 +346,8 @@ export default [
|
||||||
Role: "STAFF",
|
Role: "STAFF",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
|
//รายการปรับระดับชั้นงานลูกจ้าง
|
||||||
{
|
{
|
||||||
path: "/placement/appoint-employee",
|
path: "/placement/appoint-employee",
|
||||||
name: "appoint-employee",
|
name: "appoint-employee",
|
||||||
|
|
@ -386,54 +388,4 @@ export default [
|
||||||
Role: "STAFF",
|
Role: "STAFF",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// path: "/relocation",
|
|
||||||
// name: "relocation",
|
|
||||||
// component: relocation,
|
|
||||||
// meta: {
|
|
||||||
// Auth: true,
|
|
||||||
// Key: [6.1],
|
|
||||||
// Role: "placement",
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: "/relocation/detail/:id",
|
|
||||||
// name: "relocationId",
|
|
||||||
// component: relocationbyId,
|
|
||||||
// meta: {
|
|
||||||
// Auth: true,
|
|
||||||
// Key: [6.9],
|
|
||||||
// Role: "placement",
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: "/change-positions",
|
|
||||||
// name: "changePositions",
|
|
||||||
// component: ChangePositionMain,
|
|
||||||
// meta: {
|
|
||||||
// Auth: true,
|
|
||||||
// Key: "",
|
|
||||||
// Role: "STAFF",
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: "/change-positions/:id",
|
|
||||||
// name: "changePersonalList",
|
|
||||||
// component: ChangePersonalList,
|
|
||||||
// meta: {
|
|
||||||
// Auth: true,
|
|
||||||
// Key: "",
|
|
||||||
// Role: "placement",
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: "/change-positions/personal/:id",
|
|
||||||
// name: "changePersonalId",
|
|
||||||
// component: ChangePersonalDetail,
|
|
||||||
// meta: {
|
|
||||||
// Auth: true,
|
|
||||||
// Key: "",
|
|
||||||
// Role: "placement",
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
];
|
];
|
||||||
|
|
|
||||||
|
|
@ -312,8 +312,6 @@ async function expiredAccountFilter() {
|
||||||
await DataStore.DataMain(updatedRows);
|
await DataStore.DataMain(updatedRows);
|
||||||
}
|
}
|
||||||
|
|
||||||
/** filter ใน dropdown ครั้งที่ */
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* ฟังชั่น กรอกข้อมูลเพื่อ ค้นหา
|
* ฟังชั่น กรอกข้อมูลเพื่อ ค้นหา
|
||||||
* @param val ค่าที่กรอก
|
* @param val ค่าที่กรอก
|
||||||
|
|
@ -376,7 +374,9 @@ function paginationLabel(start: number, end: number, total: number) {
|
||||||
else return start + "-" + end + " ใน " + total;
|
else return start + "-" + end + " ใน " + total;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** เรียกใช้ฟังชั่น เมื่อเริ่มหน้านี้ */
|
/**
|
||||||
|
* เรียกใช้ฟังชั่น เมื่อเริ่มหน้านี้
|
||||||
|
*/
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await fetchYearOptions();
|
await fetchYearOptions();
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -21,14 +21,13 @@ const { statusText } = useTransferDataStore();
|
||||||
const { date2Thai, messageError, showLoader, hideLoader } = mixin;
|
const { date2Thai, messageError, showLoader, hideLoader } = mixin;
|
||||||
|
|
||||||
const modal = ref<boolean>(false); //ส่งไปออกคำสั่ง
|
const modal = ref<boolean>(false); //ส่งไปออกคำสั่ง
|
||||||
const rowsOrder = ref<ResponseData[]>([]);
|
const dataTransfer = ref<ResponseData[]>([]); //ช่อมูลรายการขอโอน
|
||||||
const filterOrder = ref<string>("");
|
|
||||||
|
|
||||||
const filterMain = ref<string>(""); //คำค้นหารายการข้อโอน
|
|
||||||
const rows = ref<ResponseData[]>([]);
|
|
||||||
const dataTransfer = ref<ResponseData[]>([]);
|
|
||||||
|
|
||||||
//Table
|
//Table
|
||||||
|
const rows = ref<ResponseData[]>([]); //รายการขอโอน
|
||||||
|
const filterMain = ref<string>(""); //คำค้นหารายการขอโอน
|
||||||
|
const rowsOrder = ref<ResponseData[]>([]); //รายการส่งไปออกคำสั่ง
|
||||||
|
const filterOrder = ref<string>(""); //คำค้นหารายการส่งไปออกคำสั่ง
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
|
||||||
|
|
@ -15,8 +15,8 @@ import type {
|
||||||
ResponseRow,
|
ResponseRow,
|
||||||
} from "@/modules/05_placement/interface/response/Receive";
|
} from "@/modules/05_placement/interface/response/Receive";
|
||||||
|
|
||||||
import Dialogbody from "@/modules/05_placement/components/Receive/Dialogbody.vue";
|
import Dialogbody from "@/modules/05_placement/components/Receive/DialogOrders.vue";
|
||||||
import DialogHeader from "@/modules/05_placement/components/Receive/DialogHeader.vue";
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue";
|
import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue";
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
|
|
@ -34,27 +34,27 @@ const {
|
||||||
} = mixin;
|
} = mixin;
|
||||||
|
|
||||||
const dataRecevice = ref<ResponseData[]>([]); //ข้อมูลรายการรับโอน
|
const dataRecevice = ref<ResponseData[]>([]); //ข้อมูลรายการรับโอน
|
||||||
|
const filters = ref<ResponseRow[]>([]); //ข้อมูลรายการรับโอน
|
||||||
|
const dataRows = ref<ResponseRow>(); //ข้อมูลที่ต้องการเลือกหน่วยงานที่รับโอน
|
||||||
|
const modal = ref<boolean>(false); //แสดง popup ส่งไปออกคำสั่งรับโอน
|
||||||
|
const modalupload = ref<boolean>(false); //แสดง popup อัปโหลดเอกสาร
|
||||||
|
const modalTree = ref<boolean>(false); //แสดง popup เลือกหน่วยงานที่รับโอน
|
||||||
|
|
||||||
const dataRows = ref<any[]>([]);
|
const personal = ref<ResponseData[]>([]); //ข้อมูลบุคคล
|
||||||
const rows2 = ref<ResponseRow[]>([]);
|
const personalId = ref<string>(""); //บุคคล
|
||||||
const modal = ref<boolean>(false);
|
|
||||||
const modalupload = ref<boolean>(false);
|
const files = ref<any>(); //ไฟล์
|
||||||
const modalTree = ref<boolean>(false);
|
|
||||||
const myForm = ref<any>();
|
const posType = ref<string>(""); //ประเภทตำแหน่ง
|
||||||
const personal = ref<ResponseData[]>([]);
|
const posLevel = ref<string>(""); //ระดับตำแหน่ง
|
||||||
const personalId = ref<string>("");
|
const position = ref<string>(""); //ตำแหน่ง
|
||||||
const filterKeyword = ref<string>("");
|
|
||||||
const filterKeyword2 = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const files = ref<any>();
|
|
||||||
const filters = ref<ResponseRow[]>([]);
|
|
||||||
const rows = ref<ResponseRow[]>([]);
|
|
||||||
const posType = ref<string>("");
|
|
||||||
const posLevel = ref<string>("");
|
|
||||||
const position = ref<string>("");
|
|
||||||
const type = ref<string | null>(null);
|
const type = ref<string | null>(null);
|
||||||
|
|
||||||
//Table
|
//Table
|
||||||
|
const rows = ref<ResponseRow[]>([]); //รายการรับโอน
|
||||||
|
const rows2 = ref<ResponseRow[]>([]); //รายการออกคำสั่ง
|
||||||
|
const filterKeyword = ref<string>(""); //คำค้นหารายการรับโอน
|
||||||
|
const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
|
||||||
const visibleColumns = ref<string[]>([
|
const visibleColumns = ref<string[]>([
|
||||||
"no",
|
"no",
|
||||||
"citizenId",
|
"citizenId",
|
||||||
|
|
@ -143,6 +143,9 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ฟังก์ชันดึงข้อมูลรายการรับโอน
|
||||||
|
*/
|
||||||
async function fecthlistRecevice() {
|
async function fecthlistRecevice() {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
@ -189,45 +192,58 @@ function onSubmitDoc() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// รีเซ็ตค่าในฟิลเตอร์
|
/**
|
||||||
const resetFilter = () => {
|
* ฟังก์ชันบรีเซ็ตค่าในฟิลเตอร์
|
||||||
|
*/
|
||||||
|
function resetFilter() {
|
||||||
filterKeyword.value = "";
|
filterKeyword.value = "";
|
||||||
filterKeyword2.value = "";
|
filterKeyword2.value = "";
|
||||||
filterRef.value.focus();
|
}
|
||||||
};
|
/**
|
||||||
|
* ฟังก์ชันปิด popup ออกคำสั่ง
|
||||||
// ปิดโมเดล
|
*/
|
||||||
const clickClose = () => {
|
function clickClose() {
|
||||||
modal.value = false;
|
modal.value = false;
|
||||||
filterKeyword2.value = "";
|
filterKeyword2.value = "";
|
||||||
};
|
}
|
||||||
// ปิดโมเดลอัปเดตไฟล์
|
|
||||||
const clickCloseUpload = () => {
|
/**
|
||||||
|
* ฟังก์ชันปิด popup อัปเดตไฟล์
|
||||||
|
*/
|
||||||
|
function clickCloseUpload() {
|
||||||
modalupload.value = false;
|
modalupload.value = false;
|
||||||
files.value = null;
|
files.value = null;
|
||||||
};
|
}
|
||||||
// ปิดโมเดลโครงสร้าง
|
|
||||||
const openModalTree = (id: string, data: any) => {
|
/**
|
||||||
|
* ฟังก์ชันเปิด popup เลือกหน่วยงานที่รับโอน
|
||||||
|
*/
|
||||||
|
function openModalTree(id: string, data: any) {
|
||||||
personalId.value = id;
|
personalId.value = id;
|
||||||
personal.value = dataRecevice.value.filter((e: ResponseData) => e.id === id);
|
personal.value = dataRecevice.value.filter((e: ResponseData) => e.id === id);
|
||||||
dataRows.value = data;
|
dataRows.value = data;
|
||||||
|
|
||||||
modalTree.value = true;
|
modalTree.value = true;
|
||||||
type.value = null;
|
type.value = null;
|
||||||
dataRows.value = data;
|
dataRows.value = data;
|
||||||
// console.log("data===>", data);
|
|
||||||
|
|
||||||
posType.value = data.posTypeOldId;
|
posType.value = data.posTypeOldId;
|
||||||
posLevel.value = data.posLevelOldId;
|
posLevel.value = data.posLevelOldId;
|
||||||
position.value = data.positionOld;
|
position.value = data.positionOld;
|
||||||
};
|
}
|
||||||
// เปิดโมเดลไฟล์
|
|
||||||
const openUpload = (id: string) => {
|
/**
|
||||||
|
* ฟังก์ชันเปิด popup อัปเดตไฟล์
|
||||||
|
* @param id รายการที่ต้องการอัปเดตไฟล์
|
||||||
|
*/
|
||||||
|
function openUpload(id: string) {
|
||||||
personalId.value = id;
|
personalId.value = id;
|
||||||
modalupload.value = true;
|
modalupload.value = true;
|
||||||
};
|
}
|
||||||
// ยินยันลบข้อมูล
|
|
||||||
const openDelete = (id: string) => {
|
/**
|
||||||
|
* ฟังก์ชันยืนยันการลบข้อมูล
|
||||||
|
* @param id รายการที่ต้องการลบ
|
||||||
|
*/
|
||||||
|
function openDelete(id: string) {
|
||||||
dialogRemove($q, async () => {
|
dialogRemove($q, async () => {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
@ -241,16 +257,24 @@ const openDelete = (id: string) => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
}
|
||||||
|
|
||||||
// ไปหน้ารายละเอียด
|
/**
|
||||||
const nextPage = (id: string) => {
|
* ฟังก์ชันไปหน้ารายละเอียด
|
||||||
|
* @param id รายการที่ต้องการดูรายละเอียก
|
||||||
|
*/
|
||||||
|
function nextPage(id: string) {
|
||||||
router.push({
|
router.push({
|
||||||
path: `/placement/receive/${id}`,
|
path: `/placement/receive/${id}`,
|
||||||
});
|
});
|
||||||
};
|
}
|
||||||
|
|
||||||
const popup = () => {
|
/**
|
||||||
|
* ฟังก์ชันส่งไปออกคำสั่ง
|
||||||
|
*
|
||||||
|
* ค้นหารายชื่อออกคำสั่งตามสถานะ อนุมัติ (APPROVE)
|
||||||
|
*/
|
||||||
|
function openModalOrder() {
|
||||||
const row = filters.value.filter(
|
const row = filters.value.filter(
|
||||||
(r: any) =>
|
(r: any) =>
|
||||||
(r.status == "WAITTING" ||
|
(r.status == "WAITTING" ||
|
||||||
|
|
@ -267,10 +291,9 @@ const popup = () => {
|
||||||
|
|
||||||
rows2.value = row;
|
rows2.value = row;
|
||||||
modal.value = true;
|
modal.value = true;
|
||||||
};
|
}
|
||||||
|
|
||||||
function onSave(data: any) {
|
function onSave(data: any) {
|
||||||
console.log("not save", data);
|
|
||||||
const dataAppoint = {
|
const dataAppoint = {
|
||||||
node: data.node,
|
node: data.node,
|
||||||
nodeId: data.nodeId,
|
nodeId: data.nodeId,
|
||||||
|
|
@ -303,6 +326,9 @@ function onSave(data: any) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fecthlistRecevice();
|
fecthlistRecevice();
|
||||||
});
|
});
|
||||||
|
|
@ -331,7 +357,7 @@ onMounted(() => {
|
||||||
round
|
round
|
||||||
color="add"
|
color="add"
|
||||||
icon="mdi-account-arrow-right"
|
icon="mdi-account-arrow-right"
|
||||||
@click="popup()"
|
@click="openModalOrder()"
|
||||||
>
|
>
|
||||||
<q-tooltip>ส่งไปออกคำสั่งรับโอน</q-tooltip>
|
<q-tooltip>ส่งไปออกคำสั่งรับโอน</q-tooltip>
|
||||||
</q-btn>
|
</q-btn>
|
||||||
|
|
@ -550,34 +576,23 @@ onMounted(() => {
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</q-card>
|
||||||
|
|
||||||
<!-- ออกคำสั่ง -->
|
|
||||||
<Dialogbody
|
|
||||||
v-model:Modal="modal"
|
|
||||||
:clickClose="clickClose"
|
|
||||||
:rows2="rows2"
|
|
||||||
v-model:filterKeyword2="filterKeyword2"
|
|
||||||
:fecthlistRecevice="fecthlistRecevice"
|
|
||||||
:nextPage="nextPage"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<!-- อัปโหลดเอกสาร -->
|
<!-- อัปโหลดเอกสาร -->
|
||||||
<q-dialog v-model="modalupload">
|
<q-dialog v-model="modalupload">
|
||||||
<q-card style="width: 600px">
|
<q-card style="width: 600px">
|
||||||
<q-form greedy @submit.prevent @validation-success="onSubmitDoc">
|
<q-form greedy @submit.prevent @validation-success="onSubmitDoc">
|
||||||
<DialogHeader title="อัปโหลดเอกสาร" :close="clickCloseUpload" />
|
<DialogHeader tittle="อัปโหลดเอกสาร" :close="clickCloseUpload" />
|
||||||
<q-separator />
|
<q-separator />
|
||||||
<q-card-section class="q-py-sm">
|
<q-card-section class="q-py-sm">
|
||||||
<div class="col-12 row items-center q-col-gutter-sm">
|
<div class="col-12 row items-center q-col-gutter-sm">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<q-file
|
<q-file
|
||||||
ref="myForm"
|
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
v-model="files"
|
v-model="files"
|
||||||
label="อัปโหลดเอกสาร"
|
label="อัปโหลดเอกสาร"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:rules="[
|
:rules="[
|
||||||
(val) => val || 'กรุณาเลือกไฟล์หนังสือถึงหน่วยงานที่รับโอน',
|
(val:string) => val || 'กรุณาเลือกไฟล์หนังสือถึงหน่วยงานที่รับโอน',
|
||||||
]"
|
]"
|
||||||
hide-bottom-space
|
hide-bottom-space
|
||||||
>
|
>
|
||||||
|
|
@ -599,6 +614,16 @@ onMounted(() => {
|
||||||
</q-card>
|
</q-card>
|
||||||
</q-dialog>
|
</q-dialog>
|
||||||
|
|
||||||
|
<!-- ออกคำสั่ง -->
|
||||||
|
<Dialogbody
|
||||||
|
v-model:modal="modal"
|
||||||
|
v-model:filter-keyword2="filterKeyword2"
|
||||||
|
:click-close="clickClose"
|
||||||
|
:rows2="rows2"
|
||||||
|
:fecthlist-recevice="fecthlistRecevice"
|
||||||
|
:next-page="nextPage"
|
||||||
|
/>
|
||||||
|
|
||||||
<!-- เลือกหน่วยงานที่รับโอน -->
|
<!-- เลือกหน่วยงานที่รับโอน -->
|
||||||
<DialogOrgSelect
|
<DialogOrgSelect
|
||||||
:title="`เลือกหน่วยงานที่รับโอน`"
|
:title="`เลือกหน่วยงานที่รับโอน`"
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,13 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* importType
|
* importType
|
||||||
|
|
@ -13,21 +18,12 @@ import type { officerType } from "@/modules/05_placement/interface/response/offi
|
||||||
/**
|
/**
|
||||||
* importComponents
|
* importComponents
|
||||||
*/
|
*/
|
||||||
import Dialogbody from "@/modules/05_placement/components/helpgovernment/Dialogbody.vue";
|
import Dialogbody from "@/modules/05_placement/components/Help-Government/DialogOrders.vue";
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
/**
|
|
||||||
* importStore
|
|
||||||
*/
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
|
|
||||||
const transferStore = useTransferDataStore();
|
|
||||||
const { statusText } = transferStore;
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
const transferStore = useTransferDataStore();
|
||||||
|
const { statusText } = transferStore;
|
||||||
const mixin = useCounterMixin();
|
const mixin = useCounterMixin();
|
||||||
const {
|
const {
|
||||||
date2Thai,
|
date2Thai,
|
||||||
|
|
@ -43,14 +39,12 @@ const {
|
||||||
/**
|
/**
|
||||||
* Table
|
* Table
|
||||||
*/
|
*/
|
||||||
const filterKeyword = ref<string>("");
|
const modal = ref<boolean>(false); //แสดง popup ส่งไปออกคำสั่งช่วยราชการ;
|
||||||
const filterKeyword2 = ref<string>("");
|
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const rows = ref<officerType[]>([]);
|
|
||||||
const rows2 = ref<officerType[]>([]);
|
|
||||||
const modal = ref<boolean>(false);
|
|
||||||
|
|
||||||
//หัวตาราง
|
const filterKeyword = ref<string>(""); //คำค้นหารายการช่วยราชการ
|
||||||
|
const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
|
||||||
|
const rows = ref<officerType[]>([]); //รายการช่วยราชการ
|
||||||
|
const rows2 = ref<officerType[]>([]); //รายการออกคำสั่ง
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
@ -191,12 +185,12 @@ const visibleColumns = ref<string[]>([
|
||||||
/**
|
/**
|
||||||
* fetch รายการช่วยราชการ
|
* fetch รายการช่วยราชการ
|
||||||
*/
|
*/
|
||||||
function getData() {
|
async function getData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
await http
|
||||||
.get(config.API.officerMain())
|
.get(config.API.officerMain())
|
||||||
.then((res: any) => {
|
.then(async (res) => {
|
||||||
const data = res.data.result;
|
const data = await res.data.result;
|
||||||
rows.value = data;
|
rows.value = data;
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
|
|
@ -209,7 +203,7 @@ function getData() {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* ยืนยันการลบรายการช่วยราชการ
|
* ยืนยันการลบรายการช่วยราชการ
|
||||||
* @param id
|
* @param id รายการที่ต้องการลบ
|
||||||
*/
|
*/
|
||||||
function clickDelete(id: string) {
|
function clickDelete(id: string) {
|
||||||
dialogRemove($q, () => {
|
dialogRemove($q, () => {
|
||||||
|
|
@ -231,7 +225,7 @@ function clickDelete(id: string) {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* rediarect หน้ารายละเอียดข้อมูล
|
* rediarect หน้ารายละเอียดข้อมูล
|
||||||
* @param id รายการช่วยราชการ
|
* @param id รายการช่วยราชการที่ต้องการดูรายละเอียด
|
||||||
*/
|
*/
|
||||||
function openDetail(id: string) {
|
function openDetail(id: string) {
|
||||||
router.push(`/placement/help-government/detail/${id}`);
|
router.push(`/placement/help-government/detail/${id}`);
|
||||||
|
|
@ -269,9 +263,11 @@ function closeModal() {
|
||||||
function resetFilter() {
|
function resetFilter() {
|
||||||
filterKeyword.value = "";
|
filterKeyword.value = "";
|
||||||
filterKeyword2.value = "";
|
filterKeyword2.value = "";
|
||||||
filterRef.value.focus();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getData();
|
getData();
|
||||||
});
|
});
|
||||||
|
|
@ -410,10 +406,10 @@ onMounted(() => {
|
||||||
|
|
||||||
<Dialogbody
|
<Dialogbody
|
||||||
v-model:Modal="modal"
|
v-model:Modal="modal"
|
||||||
:closeModal="closeModal"
|
v-model:filter-keyword2="filterKeyword2"
|
||||||
|
:get-data="getData"
|
||||||
|
:close-modal="closeModal"
|
||||||
:rows2="rows2"
|
:rows2="rows2"
|
||||||
v-model:filterKeyword2="filterKeyword2"
|
|
||||||
:getData="getData"
|
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<style scoped lang="scss"></style>
|
<style scoped lang="scss"></style>
|
||||||
|
|
@ -1,8 +1,11 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
|
@ -15,16 +18,11 @@ import type { officerType } from "@/modules/05_placement/interface/response/offi
|
||||||
/**
|
/**
|
||||||
* importComponents
|
* importComponents
|
||||||
*/
|
*/
|
||||||
import Dialogbody from "@/modules/05_placement/components/Repatriate/Dialogbody.vue"; //popup ส่งไปออกคำสั่งส่งตัวกลับ
|
import Dialogbody from "@/modules/05_placement/components/Repatriate/DialogOrders.vue"; //popup ส่งไปออกคำสั่งส่งตัวกลับ
|
||||||
|
|
||||||
/**
|
|
||||||
* importStore
|
|
||||||
*/
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
const { statusText } = useTransferDataStore();
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
|
const router = useRouter();
|
||||||
|
const { statusText } = useTransferDataStore();
|
||||||
const {
|
const {
|
||||||
date2Thai,
|
date2Thai,
|
||||||
messageError,
|
messageError,
|
||||||
|
|
@ -35,16 +33,13 @@ const {
|
||||||
findPosMasterNoOld,
|
findPosMasterNoOld,
|
||||||
} = useCounterMixin();
|
} = useCounterMixin();
|
||||||
|
|
||||||
/**
|
const modal = ref<boolean>(false); // ส่งไปออกคำสั่งส่งตัวกลับ
|
||||||
* Table
|
|
||||||
*/
|
// Table
|
||||||
const filterKeyword = ref<string>("");
|
const filterKeyword = ref<string>(""); //คำค้นหารายการส่งตัวกลับ
|
||||||
const filterKeyword2 = ref<string>("");
|
const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
|
||||||
const filterRef = ref<any>(null);
|
const rows = ref<officerType[]>([]); //รายการส่งตัวกลับ
|
||||||
const router = useRouter();
|
const rows2 = ref<officerType[]>([]); //รายการออกคำสั่ง
|
||||||
const rows = ref<officerType[]>([]);
|
|
||||||
const rows2 = ref<officerType[]>([]);
|
|
||||||
// หัวตาราง
|
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
@ -149,8 +144,6 @@ const visibleColumns = ref<string[]>([
|
||||||
"status",
|
"status",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const modal = ref<boolean>(false); // ส่งไปออกคำสั่งส่งตัวกลับ
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* rediarect ไปหน้ารายละเอียด
|
* rediarect ไปหน้ารายละเอียด
|
||||||
*/
|
*/
|
||||||
|
|
@ -161,12 +154,12 @@ function openDetail(id: string) {
|
||||||
/**
|
/**
|
||||||
* fetch รายการส่งตัวกลับ
|
* fetch รายการส่งตัวกลับ
|
||||||
*/
|
*/
|
||||||
function getData() {
|
async function getData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
await http
|
||||||
.get(config.API.repatriationMain())
|
.get(config.API.repatriationMain())
|
||||||
.then((res) => {
|
.then(async (res) => {
|
||||||
const data = res.data.result;
|
const data = await res.data.result;
|
||||||
rows.value = data;
|
rows.value = data;
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
|
|
@ -235,13 +228,16 @@ function closeModal() {
|
||||||
function resetFilter() {
|
function resetFilter() {
|
||||||
filterKeyword.value = "";
|
filterKeyword.value = "";
|
||||||
filterKeyword2.value = "";
|
filterKeyword2.value = "";
|
||||||
filterRef.value.focus();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await getData();
|
await getData();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="toptitle text-dark col-12 row items-center">รายการส่งตัวกลับ</div>
|
<div class="toptitle text-dark col-12 row items-center">รายการส่งตัวกลับ</div>
|
||||||
<q-card flat bordered class="col-12 q-mt-sm">
|
<q-card flat bordered class="col-12 q-mt-sm">
|
||||||
|
|
@ -372,10 +368,11 @@ onMounted(async () => {
|
||||||
|
|
||||||
<Dialogbody
|
<Dialogbody
|
||||||
v-model:Modal="modal"
|
v-model:Modal="modal"
|
||||||
:closeModal="closeModal"
|
v-model:filter-keyword2="filterKeyword2"
|
||||||
|
:get-data="getData"
|
||||||
|
:close-modal="closeModal"
|
||||||
:rows2="rows2"
|
:rows2="rows2"
|
||||||
v-model:filterKeyword2="filterKeyword2"
|
|
||||||
:getData="getData"
|
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
<style scoped lang="scss"></style>
|
||||||
|
|
@ -1,8 +1,11 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
|
@ -19,14 +22,11 @@ import type { QTableProps } from "quasar";
|
||||||
/**
|
/**
|
||||||
* importComponents
|
* importComponents
|
||||||
*/
|
*/
|
||||||
import Dialogbody from "@/modules/05_placement/components/AppointMent/Dialogbody.vue"; //ส่งไปออกคำสั่ง
|
import Dialogbody from "@/modules/05_placement/components/AppointMent/DialogOrders.vue"; //ส่งไปออกคำสั่ง
|
||||||
import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue"; // เลือกหน่วยงาน
|
import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue"; // เลือกหน่วยงาน
|
||||||
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const modal = ref<boolean>(false);
|
const router = useRouter();
|
||||||
const storeFn = useTransferDataStore();
|
const storeFn = useTransferDataStore();
|
||||||
const { statusText } = storeFn;
|
const { statusText } = storeFn;
|
||||||
const {
|
const {
|
||||||
|
|
@ -38,29 +38,27 @@ const {
|
||||||
dialogRemove,
|
dialogRemove,
|
||||||
} = useCounterMixin();
|
} = useCounterMixin();
|
||||||
|
|
||||||
const posType = ref<string>("");
|
const modal = ref<boolean>(false); //แสดง popup ส่งไปออกคำสั่ง
|
||||||
const posLevel = ref<string>("");
|
const modalTree = ref<boolean>(false); //แสดง popup เลือกหน่วยงานที่แต่งตั้ง - เลื่อน - ย้าย
|
||||||
const position = ref<string>("");
|
const posType = ref<string>(""); //ประเภทตำแหน่ง
|
||||||
const typeModal = ref<string | null>(null);
|
const posLevel = ref<string>(""); //ระดับตำแหน่ง
|
||||||
|
const position = ref<string>(""); //ตำแหน่ง
|
||||||
|
const typeModal = ref<string | null>(null); //ประเภท popup แต่งตั้ง , เลื่อน , ย้าย
|
||||||
const dataRows = ref<any[]>([]);
|
const dataRows = ref<any[]>([]);
|
||||||
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const modalTree = ref<boolean>(false);
|
|
||||||
const personalId = ref<string>("");
|
const personalId = ref<string>("");
|
||||||
|
|
||||||
const filterRef = ref<any>(null);
|
const filterRef = ref<any>(null);
|
||||||
const listRecevice = ref<resData[]>([]);
|
const listRecevice = ref<resData[]>([]); //ข้อมูลรายการแต่งตั้ง-เลื่อน-ย้าย
|
||||||
const optionsType = ref<OpType[]>([]);
|
const optionsType = ref<OpType[]>([]);
|
||||||
const type = ref<string>("");
|
const type = ref<string>("");
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Table
|
* Table
|
||||||
*/
|
*/
|
||||||
const rows = ref<listAppointType[]>([]);
|
const rows = ref<listAppointType[]>([]); //รายการแต่งตั้ง-เลื่อน-ย้าย
|
||||||
const rows2 = ref<listAppointType[]>([]);
|
const rows2 = ref<listAppointType[]>([]); //รายการออกคำสั่ง
|
||||||
const filterKeyword = ref<string>("");
|
const filterKeyword = ref<string>(""); //คำค้นหารายการแต่งตั้ง-เลื่อน-ย้าย
|
||||||
const filterKeyword2 = ref<string>("");
|
const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
@ -160,22 +158,22 @@ const pagination = ref({
|
||||||
page: 1,
|
page: 1,
|
||||||
rowsPerPage: 10,
|
rowsPerPage: 10,
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* รีเซ็ต input
|
* รีเซ็ตคำค้นหารายการ
|
||||||
*/
|
*/
|
||||||
const resetFilter = () => {
|
function resetFilter() {
|
||||||
filterKeyword.value = "";
|
filterKeyword.value = "";
|
||||||
filterKeyword2.value = "";
|
filterKeyword2.value = "";
|
||||||
filterRef.value.focus();
|
filterRef.value.focus();
|
||||||
};
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* fetch รายการแต่งตั้ง-เลื่อน-ย้าย
|
* fetch รายการแต่งตั้ง-เลื่อน-ย้าย
|
||||||
*/
|
*/
|
||||||
function fecthlistappointment() {
|
async function fecthlistappointment() {
|
||||||
showLoader();
|
showLoader();
|
||||||
rows.value = [];
|
await http
|
||||||
http
|
|
||||||
.get(config.API.appointmentMain())
|
.get(config.API.appointmentMain())
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
let response = res.data.result;
|
let response = res.data.result;
|
||||||
|
|
@ -300,6 +298,9 @@ function clickClose() {
|
||||||
modal.value = false;
|
modal.value = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ทำงานเมื่อมีการเรียกใช้ Components
|
||||||
|
*/
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fecthlistappointment();
|
fecthlistappointment();
|
||||||
});
|
});
|
||||||
|
|
@ -577,23 +578,23 @@ onMounted(() => {
|
||||||
|
|
||||||
<Dialogbody
|
<Dialogbody
|
||||||
v-model:Modal="modal"
|
v-model:Modal="modal"
|
||||||
:clickClose="clickClose"
|
v-model:filter-keyword2="filterKeyword2"
|
||||||
:optionsType="optionsType"
|
|
||||||
:rows2="rows2"
|
|
||||||
v-model:filterKeyword2="filterKeyword2"
|
|
||||||
v-model:type="type"
|
v-model:type="type"
|
||||||
:nextPage="nextPage"
|
:click-close="clickClose"
|
||||||
:fecthlistappointment="fecthlistappointment"
|
:options-type="optionsType"
|
||||||
|
:rows2="rows2"
|
||||||
|
:next-page="nextPage"
|
||||||
|
:fetch-data="fecthlistappointment"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<DialogOrgSelect
|
<DialogOrgSelect
|
||||||
:title="`เลือกหน่วยงานที่แต่งตั้ง - เลื่อน - ย้าย`"
|
:title="`เลือกหน่วยงานที่แต่งตั้ง - เลื่อน - ย้าย`"
|
||||||
v-model:modal="modalTree"
|
v-model:modal="modalTree"
|
||||||
v-model:type="typeModal"
|
v-model:type="typeModal"
|
||||||
:posType="posType"
|
:pos-type="posType"
|
||||||
:posLevel="posLevel"
|
:pos-level="posLevel"
|
||||||
:position="position"
|
:position="position"
|
||||||
:dataRows="dataRows"
|
:data-rows="dataRows"
|
||||||
:onSubmit="onSave"
|
:onSubmit="onSave"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -1,34 +1,27 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import type { QTableProps } from "quasar";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
import Dialogbody from "@/modules/05_placement/components/AppointEmployee/Dialogbody.vue";
|
import http from "@/plugins/http";
|
||||||
// import DialogOrgTree from "@/modules/05_placement/components/AppointEmployee/Modal.vue";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
import type { QTableProps } from "quasar";
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
listAppointType,
|
listAppointType,
|
||||||
resData,
|
resData,
|
||||||
orgFilter,
|
|
||||||
} from "@/modules/05_placement/interface/response/AppointMent";
|
} from "@/modules/05_placement/interface/response/AppointMent";
|
||||||
import type { OpType } from "@/modules/05_placement/interface/response/Main";
|
import type { OpType } from "@/modules/05_placement/interface/response/Main";
|
||||||
import http from "@/plugins/http";
|
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
|
||||||
import DialogOrgSelectEmployee from "@/components/Dialogs/DialogOrgSelectEmployee.vue"; //เลือกหน่วยงาน
|
import DialogOrgSelectEmployee from "@/components/Dialogs/DialogOrgSelectEmployee.vue"; //เลือกหน่วยงาน
|
||||||
|
import Dialogbody from "@/modules/05_placement/components/AppointEmployee/DialogOrders.vue";
|
||||||
const typeModal = ref<string>("");
|
|
||||||
const posType = ref<string>("");
|
|
||||||
const posLevel = ref<string>("");
|
|
||||||
const position = ref<string>("");
|
|
||||||
const dataRows = ref<any[]>([]);
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const modal = ref<boolean>(false);
|
const router = useRouter();
|
||||||
const storeFn = useTransferDataStore();
|
const storeFn = useTransferDataStore();
|
||||||
const { statusText } = storeFn;
|
const { statusText } = storeFn;
|
||||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
||||||
|
|
@ -40,19 +33,26 @@ const {
|
||||||
date2Thai,
|
date2Thai,
|
||||||
dialogRemove,
|
dialogRemove,
|
||||||
} = mixin;
|
} = mixin;
|
||||||
const router = useRouter();
|
|
||||||
const rows = ref<listAppointType[]>([]);
|
|
||||||
const rows2 = ref<listAppointType[]>([]);
|
|
||||||
const modalTree = ref<boolean>(false);
|
|
||||||
|
|
||||||
const personalId = ref<string>("");
|
const personalId = ref<string>("");
|
||||||
const filterKeyword = ref<string>("");
|
const modal = ref<boolean>(false); //แสดง popup ส่งไปออกคำสั่ง
|
||||||
const filterKeyword2 = ref<string>("");
|
const modalTree = ref<boolean>(false); //แสดง popup เลือกหน่วยงานที่รับการปรับระดับชั้นงาน
|
||||||
|
const typeModal = ref<string>(""); //ประเภท popup ปรับระดับชั้นงาน,รับย้าย
|
||||||
|
const posType = ref<string>(""); //ประเภทตำแหน่ง
|
||||||
|
const posLevel = ref<string>(""); //ระดับตำแหน่ง
|
||||||
|
const position = ref<string>(""); //ตำแหน่ง
|
||||||
|
const dataRows = ref<any[]>([]);
|
||||||
|
|
||||||
const filterRef = ref<any>(null);
|
const filterRef = ref<any>(null);
|
||||||
const listRecevice = ref<resData[]>([]);
|
const listRecevice = ref<resData[]>([]); //ข้อมูลรายการปรับระดับชั้นงานลูกจ้าง
|
||||||
const optionsType = ref<OpType[]>([]);
|
const optionsType = ref<OpType[]>([]);
|
||||||
const type = ref<string>("");
|
const type = ref<string>("");
|
||||||
|
|
||||||
|
// Table
|
||||||
|
const rows = ref<listAppointType[]>([]); //รายการปรับระดับชั้นงานลูกจ้าง
|
||||||
|
const rows2 = ref<listAppointType[]>([]); //รายการออกคำสั่ง
|
||||||
|
const filterKeyword = ref<string>(""); //คำค้นหารายการปรับระดับชั้นงานลูกจ้าง
|
||||||
|
const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
|
||||||
const visibleColumns = ref<string[]>([
|
const visibleColumns = ref<string[]>([
|
||||||
"no",
|
"no",
|
||||||
"citizenId",
|
"citizenId",
|
||||||
|
|
@ -145,13 +145,13 @@ function resetFilter() {
|
||||||
/**
|
/**
|
||||||
* fetch รายการปรับระดับชั้นงานลูกจ้าง
|
* fetch รายการปรับระดับชั้นงานลูกจ้าง
|
||||||
*/
|
*/
|
||||||
function fecthlistappointment() {
|
async function fecthlistappointment() {
|
||||||
showLoader();
|
showLoader();
|
||||||
rows.value = [];
|
|
||||||
http
|
await http
|
||||||
.get(config.API.appointEmployee())
|
.get(config.API.appointEmployee())
|
||||||
.then((res) => {
|
.then(async (res) => {
|
||||||
let response = res.data.result;
|
let response = await res.data.result;
|
||||||
listRecevice.value = response;
|
listRecevice.value = response;
|
||||||
rows.value = response;
|
rows.value = response;
|
||||||
|
|
||||||
|
|
@ -182,7 +182,7 @@ function fecthlistappointment() {
|
||||||
* ยืนยันลบรายการปรับระดับชั้นงานลูกจ้าง
|
* ยืนยันลบรายการปรับระดับชั้นงานลูกจ้าง
|
||||||
* @param id รายการปรับระดับชั้นงานลูกจ้าง
|
* @param id รายการปรับระดับชั้นงานลูกจ้าง
|
||||||
*/
|
*/
|
||||||
const clickDelete = (id: string) => {
|
function clickDelete(id: string) {
|
||||||
dialogRemove($q, () => {
|
dialogRemove($q, () => {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
http
|
||||||
|
|
@ -198,7 +198,7 @@ const clickDelete = (id: string) => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* redialect รายละเอียดการปรับระดับชั้นงานลูกจ้าง
|
* redialect รายละเอียดการปรับระดับชั้นงานลูกจ้าง
|
||||||
|
|
@ -259,7 +259,6 @@ function onSave(data: any) {
|
||||||
posmasterId: data.posmasterId,
|
posmasterId: data.posmasterId,
|
||||||
typeCommand: data.typeCommand,
|
typeCommand: data.typeCommand,
|
||||||
};
|
};
|
||||||
|
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
http
|
||||||
.put(config.API.appointmentPosition(personalId.value), dataAppoint)
|
.put(config.API.appointmentPosition(personalId.value), dataAppoint)
|
||||||
|
|
@ -275,6 +274,7 @@ function onSave(data: any) {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fecthlistappointment();
|
fecthlistappointment();
|
||||||
});
|
});
|
||||||
|
|
@ -523,23 +523,23 @@ onMounted(() => {
|
||||||
|
|
||||||
<Dialogbody
|
<Dialogbody
|
||||||
v-model:Modal="modal"
|
v-model:Modal="modal"
|
||||||
:clickClose="clickClose"
|
v-model:filter-keyword2="filterKeyword2"
|
||||||
:optionsType="optionsType"
|
|
||||||
:rows2="rows2"
|
|
||||||
v-model:filterKeyword2="filterKeyword2"
|
|
||||||
v-model:type="type"
|
v-model:type="type"
|
||||||
:nextPage="nextPage"
|
:click-close="clickClose"
|
||||||
:fecthlistappointment="fecthlistappointment"
|
:options-type="optionsType"
|
||||||
|
:rows2="rows2"
|
||||||
|
:next-page="nextPage"
|
||||||
|
:fetch-data="fecthlistappointment"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<DialogOrgSelectEmployee
|
<DialogOrgSelectEmployee
|
||||||
:title="`เลือกหน่วยงานที่รับการปรับระดับชั้นงาน`"
|
:title="`เลือกหน่วยงานที่รับการปรับระดับชั้นงาน`"
|
||||||
v-model:modal="modalTree"
|
v-model:modal="modalTree"
|
||||||
v-model:type="typeModal"
|
v-model:type="typeModal"
|
||||||
:posType="posType"
|
:pos-type="posType"
|
||||||
:posLevel="posLevel"
|
:pos-level="posLevel"
|
||||||
:position="position"
|
:position="position"
|
||||||
:dataRows="dataRows"
|
:data-rows="dataRows"
|
||||||
:onSubmit="onSave"
|
:onSubmit="onSave"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -1,9 +1,11 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { checkPermission } from "@/utils/permissions";
|
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import { useRouter } from "vue-router";
|
|
||||||
|
|
||||||
|
import { useRouter } from "vue-router";
|
||||||
|
import { checkPermission } from "@/utils/permissions";
|
||||||
|
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
|
@ -13,11 +15,7 @@ import type { listMain } from "@/modules/05_placement/interface/response/OhterMa
|
||||||
import type { OpType } from "@/modules/05_placement/interface/response/Main";
|
import type { OpType } from "@/modules/05_placement/interface/response/Main";
|
||||||
|
|
||||||
/** importcomopnents*/
|
/** importcomopnents*/
|
||||||
import Dialogbody from "@/modules/05_placement/components/Other/Dialogbody.vue";
|
import Dialogbody from "@/modules/05_placement/components/Other/DialogOrders.vue";
|
||||||
|
|
||||||
/** importStore*/
|
|
||||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
|
|
||||||
/** use*/
|
/** use*/
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
|
|
@ -40,11 +38,10 @@ const optionsType = ref<OpType[]>([]);
|
||||||
/**
|
/**
|
||||||
* Table
|
* Table
|
||||||
*/
|
*/
|
||||||
const rows = ref<listMain[]>([]);
|
const rows = ref<listMain[]>([]); //รายการอื่นๆ
|
||||||
const rows2 = ref<listMain[]>([]);
|
const rows2 = ref<listMain[]>([]); //รายการออกคำสั่ง
|
||||||
const filterKeyword = ref<string>("");
|
const filterKeyword = ref<string>(""); //คำค้นหารายการอื่นๆ
|
||||||
const filterKeyword2 = ref<string>("");
|
const filterKeyword2 = ref<string>(""); //คำค้นหารายการออกคำสั่ง
|
||||||
const filterRef = ref<any>(null);
|
|
||||||
const visibleColumns = ref<string[]>([
|
const visibleColumns = ref<string[]>([
|
||||||
"no",
|
"no",
|
||||||
"fullname",
|
"fullname",
|
||||||
|
|
@ -137,9 +134,9 @@ const pagination = ref({
|
||||||
/**
|
/**
|
||||||
* fetch รายการอื่นๆ
|
* fetch รายการอื่นๆ
|
||||||
*/
|
*/
|
||||||
function fecthlistOthet() {
|
async function fecthlistOthet() {
|
||||||
showLoader();
|
showLoader();
|
||||||
http
|
await http
|
||||||
.get(config.API.otherMain())
|
.get(config.API.otherMain())
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
let response = res.data.result;
|
let response = res.data.result;
|
||||||
|
|
@ -195,7 +192,6 @@ function fecthTypeOption() {
|
||||||
function resetFilter() {
|
function resetFilter() {
|
||||||
filterKeyword.value = "";
|
filterKeyword.value = "";
|
||||||
filterKeyword2.value = "";
|
filterKeyword2.value = "";
|
||||||
filterRef.value.focus();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -383,12 +379,13 @@ onMounted(() => {
|
||||||
|
|
||||||
<Dialogbody
|
<Dialogbody
|
||||||
v-model:Modal="modal"
|
v-model:Modal="modal"
|
||||||
:clickClose="clickClose"
|
v-model:filter-keyword2="filterKeyword2"
|
||||||
:optionsType="optionsType"
|
|
||||||
:rows2="rows2"
|
|
||||||
v-model:filterKeyword2="filterKeyword2"
|
|
||||||
v-model:type="type"
|
v-model:type="type"
|
||||||
|
:click-close="clickClose"
|
||||||
|
:options-type="optionsType"
|
||||||
|
:rows2="rows2"
|
||||||
:fecthlistOthet="fecthlistOthet"
|
:fecthlistOthet="fecthlistOthet"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
<style scoped lang="scss"></style>
|
||||||
Loading…
Add table
Add a link
Reference in a new issue