Merge branch 'nice_dev' into develop
This commit is contained in:
commit
5d0305ca77
2 changed files with 494 additions and 244 deletions
|
|
@ -5,17 +5,30 @@ import { useRoute, useRouter } from "vue-router";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
|
||||||
import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
|
import type { ResponseTitle } from "@/modules/05_placement/interface/response/Receive";
|
||||||
|
import type {
|
||||||
|
TypeFile,
|
||||||
|
ResponseDataDetail,
|
||||||
|
} from "@/modules/05_placement/interface/response/Transfer";
|
||||||
|
import type { QTableProps, QForm } from "quasar";
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
import keycloak from "@/plugins/keycloak";
|
||||||
|
|
||||||
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 paramsId = route.params.id;
|
||||||
const { messageError, showLoader, hideLoader } = mixin;
|
const {
|
||||||
|
messageError,
|
||||||
|
showLoader,
|
||||||
|
hideLoader,
|
||||||
|
date2Thai,
|
||||||
|
dialogConfirm,
|
||||||
|
success,
|
||||||
|
} = mixin;
|
||||||
|
const roleAdmin = ref<boolean>(false);
|
||||||
|
|
||||||
const title = ref<ResponseTitle>({
|
const title = ref<ResponseTitle>({
|
||||||
fullname: "",
|
fullname: "",
|
||||||
|
|
@ -23,8 +36,37 @@ const title = ref<ResponseTitle>({
|
||||||
positionLevelOld: "",
|
positionLevelOld: "",
|
||||||
positionTypeOld: "",
|
positionTypeOld: "",
|
||||||
});
|
});
|
||||||
|
const responseData = ref<ResponseDataDetail>({
|
||||||
|
avataPath: "",
|
||||||
|
createdAt: new Date(),
|
||||||
|
date: new Date(),
|
||||||
|
id: "",
|
||||||
|
organization: "",
|
||||||
|
organizationPositionOld: "",
|
||||||
|
positionLevelOld: "",
|
||||||
|
positionNumberOld: "",
|
||||||
|
positionTypeOld: "",
|
||||||
|
reason: "",
|
||||||
|
salary: 0,
|
||||||
|
status: "",
|
||||||
|
fullname: "",
|
||||||
|
});
|
||||||
|
const edit = ref<boolean>(false);
|
||||||
|
const organizationPositionOld = ref<string>("");
|
||||||
|
const positionTypeOld = ref<string>("");
|
||||||
|
const positionLevelOld = ref<string>("");
|
||||||
|
const posNo = ref<string>("");
|
||||||
|
const salary = ref<number>(0);
|
||||||
|
const organization = ref<string>("");
|
||||||
|
const date = ref<Date | null>(null);
|
||||||
|
const reason = ref<string>("");
|
||||||
|
const Otherdata = ref<any>([]);
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
|
if (keycloak.tokenParsed != null) {
|
||||||
|
roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
|
||||||
|
console.log("roleAdmin===>", roleAdmin.value);
|
||||||
|
}
|
||||||
await fecthOther();
|
await fecthOther();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -32,22 +74,92 @@ const fecthOther = async () => {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
.get(config.API.otherByid(paramsId.toString()))
|
.get(config.API.otherByid(paramsId.toString()))
|
||||||
|
// .get(config.API.transferId(paramsId.toString()))
|
||||||
.then((res: any) => {
|
.then((res: any) => {
|
||||||
const data = res.data.result;
|
const data = res.data.result;
|
||||||
|
Otherdata.value = res.data.result;
|
||||||
console.log(data);
|
console.log(data);
|
||||||
|
|
||||||
title.value.fullname = `${data.firstName ?? "-"} ${data.lastName ?? "-"}`;
|
title.value.fullname = `${data.firstName ?? "-"} ${data.lastName ?? "-"}`;
|
||||||
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
|
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
|
||||||
title.value.positionLevelOld = data.positionLevelOld ?? "-";
|
title.value.positionLevelOld = data.positionLevelOld ?? "-";
|
||||||
title.value.positionTypeOld = data.positionTypeOld ?? "-";
|
title.value.positionTypeOld = data.positionTypeOld ?? "-";
|
||||||
|
|
||||||
|
responseData.value.createdAt = data.createdAt;
|
||||||
|
responseData.value.date =
|
||||||
|
data.date !== null ? new Date(data.date) : new Date();
|
||||||
|
responseData.value.id = data.id ?? "";
|
||||||
|
responseData.value.organization = data.organization ?? "";
|
||||||
|
responseData.value.organizationPositionOld =
|
||||||
|
data.organizationPositionOld ?? "";
|
||||||
|
responseData.value.positionLevelOld = data.positionLevelOld ?? "";
|
||||||
|
responseData.value.positionNumberOld = data.positionNumberOld ?? "";
|
||||||
|
responseData.value.positionTypeOld = data.positionTypeOld ?? "";
|
||||||
|
responseData.value.reason = data.reason ?? "";
|
||||||
|
responseData.value.salary = data.salary !== null ? data.salary : 0;
|
||||||
|
responseData.value.status = data.status ?? "";
|
||||||
|
responseData.value.avataPath = data.avataPath ?? "";
|
||||||
|
responseData.value.fullname = `${data.firstName ?? "-"} ${
|
||||||
|
data.lastName ?? "-"
|
||||||
|
}`;
|
||||||
|
|
||||||
|
organizationPositionOld.value = data.organizationPositionOld ?? "";
|
||||||
|
positionTypeOld.value = data.positionTypeOld ?? "";
|
||||||
|
positionLevelOld.value = data.positionLevelOld ?? "";
|
||||||
|
posNo.value = data.positionNumberOld ?? "";
|
||||||
|
salary.value = data.amountOld ?? "";
|
||||||
|
organization.value = data.organization ?? "";
|
||||||
|
date.value =
|
||||||
|
data.positionDate !== null ? new Date(data.positionDate) : null;
|
||||||
|
reason.value = data.reason ?? "";
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
messageError($q, e);
|
messageError($q, e);
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
|
edit.value = false;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
const clickEdit = () => {
|
||||||
|
dialogConfirm($q, () => saveOther());
|
||||||
|
};
|
||||||
|
const saveOther = async () => {
|
||||||
|
// showLoader();
|
||||||
|
let data = {
|
||||||
|
citizenId: Otherdata.value.citizenId,
|
||||||
|
prefixId: Otherdata.value.prefixId,
|
||||||
|
firstname: Otherdata.value.firstname,
|
||||||
|
lastname: Otherdata.value.lastname,
|
||||||
|
reason: reason.value,
|
||||||
|
organizationPositionOld: organizationPositionOld.value,
|
||||||
|
positionDate: date.value,
|
||||||
|
positionTypeOld: positionTypeOld.value,
|
||||||
|
positionLevelOld: positionLevelOld.value,
|
||||||
|
positionNumberOld: posNo.value,
|
||||||
|
amountOld: Number(salary.value),
|
||||||
|
};
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
|
await http
|
||||||
|
.put(config.API.otherByid(paramsId.toString()), data)
|
||||||
|
.then(() => {
|
||||||
|
success($q, "แก้ไข้ข้อมูลสำเร็จ");
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
messageError($q, e);
|
||||||
|
console.log(e);
|
||||||
|
})
|
||||||
|
.finally(async () => {
|
||||||
|
await fecthOther();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const getClass = (val: boolean) => {
|
||||||
|
return {
|
||||||
|
"full-width inputgreen cursor-pointer": val,
|
||||||
|
"full-width cursor-pointer": !val,
|
||||||
|
};
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -117,6 +229,217 @@ const fecthOther = async () => {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</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 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="clickEdit"
|
||||||
|
/>
|
||||||
|
<q-btn
|
||||||
|
outline
|
||||||
|
color="red"
|
||||||
|
dense
|
||||||
|
class="q-px-sm"
|
||||||
|
label="ยกเลิก"
|
||||||
|
style="width: 80px"
|
||||||
|
@click="(edit = !edit), fecthOther()"
|
||||||
|
/>
|
||||||
|
</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-12 row items-center">
|
||||||
|
<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="posNo"
|
||||||
|
: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="salary"
|
||||||
|
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
||||||
|
hide-bottom-space
|
||||||
|
:label="`${'เงินเดือน'}`"
|
||||||
|
type="number"
|
||||||
|
/>
|
||||||
|
</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-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
|
||||||
|
lazy-rules
|
||||||
|
:borderless="!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"
|
||||||
|
:rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
|
||||||
|
hide-bottom-space
|
||||||
|
:label="`${'หมายเหตุ '}`"
|
||||||
|
type="textarea"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</q-form>
|
||||||
|
</q-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scope>
|
<style lang="scss" scope>
|
||||||
|
|
|
||||||
|
|
@ -50,19 +50,22 @@ const personal = ref<any[]>([]);
|
||||||
const personalId = ref<string>("");
|
const personalId = ref<string>("");
|
||||||
const visibleColumns = ref<string[]>([
|
const visibleColumns = ref<string[]>([
|
||||||
"no",
|
"no",
|
||||||
"citizenId",
|
|
||||||
"fullname",
|
"fullname",
|
||||||
"organizationName",
|
"position",
|
||||||
"birthday",
|
"positionLevel",
|
||||||
"status",
|
"organizationPositionOld",
|
||||||
|
"organization",
|
||||||
|
"statustext",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const visibleColumns2 = ref<string[]>([
|
const visibleColumns2 = ref<string[]>([
|
||||||
"no",
|
"no",
|
||||||
"citizenId",
|
|
||||||
"fullname",
|
"fullname",
|
||||||
"organizationName",
|
"position",
|
||||||
"birthday",
|
"positionLevel",
|
||||||
|
"organizationPositionOld",
|
||||||
|
"organization",
|
||||||
|
"statustext",
|
||||||
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
||||||
const filterKeyword = ref<string>("");
|
const filterKeyword = ref<string>("");
|
||||||
const filterKeyword2 = ref<string>("");
|
const filterKeyword2 = ref<string>("");
|
||||||
|
|
@ -78,7 +81,7 @@ const type = ref<string>("");
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fecthlistOthet();
|
fecthlistOthet();
|
||||||
});
|
});
|
||||||
const listRecevice = ref<any>([]);
|
// const listRecevice = ref<any>([]);
|
||||||
const fecthlistOthet = async () => {
|
const fecthlistOthet = async () => {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
@ -86,32 +89,36 @@ const fecthlistOthet = async () => {
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
console.log(res);
|
console.log(res);
|
||||||
let response = res.data.result;
|
let response = res.data.result;
|
||||||
listRecevice.value = response;
|
// listRecevice.value = response;
|
||||||
console.log(response);
|
console.log(response);
|
||||||
rows.value = response.map((e: any) => ({
|
rows.value = response.map((r: any) => ({
|
||||||
personalId: e.id,
|
createdAt: new Date(),
|
||||||
citizenId: e.citizenId,
|
date: new Date(),
|
||||||
fullname: e.firstName + " " + e.lastName,
|
firstName: r.firstName ?? "",
|
||||||
organizationName:
|
personalId: r.id ?? "",
|
||||||
e.organizationName +
|
isActive: r.isActive ? r.isActive : false,
|
||||||
" " +
|
lastName: r.lastName ?? "",
|
||||||
e.organizationShortName +
|
organization: r.organization ?? "",
|
||||||
" " +
|
organizationPositionOld: r.organizationPositionOld ?? "",
|
||||||
e.positionNumber +
|
posNo: r.posNo ?? "",
|
||||||
" " +
|
position: r.position ?? "",
|
||||||
e.positionPath,
|
positionLevel: r.positionLevel ?? "",
|
||||||
orgName: e.organizationName,
|
positionLevelOld: r.positionLevelOld ?? "",
|
||||||
organizationShortName: e.organizationShortName,
|
positionNumberOld: r.positionNumberOld ?? "",
|
||||||
positionNumber: e.positionNumberOld,
|
positionTypeOld: r.positionTypeOld ?? "",
|
||||||
positionPath: e.positionPath,
|
prefix: r.prefix ?? "",
|
||||||
birthday: date2Thai(e.dateOfBirth),
|
reason: r.reason ?? "",
|
||||||
status: status(e.status),
|
salary: r.salary ? r.salary : 0,
|
||||||
|
status: r.status ?? "",
|
||||||
|
statustext: status(r.status ?? ""),
|
||||||
|
fullname: `${r.prefix ?? ""} ${r.firstName ?? ""} ${r.lastName ?? ""}`,
|
||||||
}));
|
}));
|
||||||
console.log(rows.value);
|
console.log(rows.value);
|
||||||
rows2.value = rows.value.filter((e: any) => e.orgName !== null);
|
rows2.value = rows.value.filter((e: any) => e.orgName !== null);
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
console.log(typeof e);
|
messageError($q);
|
||||||
|
console.log(e);
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
|
|
@ -149,17 +156,17 @@ const rows = ref<any>([
|
||||||
// },
|
// },
|
||||||
]);
|
]);
|
||||||
const rows2 = ref<any>([
|
const rows2 = ref<any>([
|
||||||
{
|
// {
|
||||||
personalId: "08db721d-add6-47b0-8a13-5f45d106e8d1",
|
// personalId: "08db721d-add6-47b0-8a13-5f45d106e8d1",
|
||||||
citizenId: "1234444332222",
|
// citizenId: "1234444332222",
|
||||||
fullname: "นางสาวอย พชช",
|
// fullname: "นางสาวอย พชช",
|
||||||
organizationName: "นักจัดการงานทั่วไป",
|
// organizationName: "นักจัดการงานทั่วไป",
|
||||||
orgName: "กลุ่มงานช่วยนักบริหาร",
|
// orgName: "กลุ่มงานช่วยนักบริหาร",
|
||||||
organizationShortName: "สกจ.",
|
// organizationShortName: "สกจ.",
|
||||||
positionNumber: "กก. 1",
|
// positionNumber: "กก. 1",
|
||||||
positionPath: "นักจัดการงานทั่วไป",
|
// positionPath: "นักจัดการงานทั่วไป",
|
||||||
birthday: dateText(new Date("1989-09-03")),
|
// birthday: dateText(new Date("1989-09-03")),
|
||||||
},
|
// },
|
||||||
]);
|
]);
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
|
|
@ -171,15 +178,6 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
headerStyle: "font-size: 14px",
|
headerStyle: "font-size: 14px",
|
||||||
style: "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",
|
name: "fullname",
|
||||||
align: "left",
|
align: "left",
|
||||||
|
|
@ -190,31 +188,47 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "organizationName",
|
name: "position",
|
||||||
align: "left",
|
align: "left",
|
||||||
label: "หน่วยงานที่รับโอน",
|
label: "ตำแหน่งในสายงาน",
|
||||||
sortable: true,
|
sortable: true,
|
||||||
field: "organizationName",
|
field: "position",
|
||||||
headerStyle: "font-size: 14px",
|
|
||||||
style: "font-size: 14px",
|
|
||||||
sort: (a: string, b: string) =>
|
|
||||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "birthday",
|
|
||||||
align: "left",
|
|
||||||
label: "วัน/เดือน/ปี เกิด",
|
|
||||||
sortable: true,
|
|
||||||
field: "birthday",
|
|
||||||
headerStyle: "font-size: 14px",
|
headerStyle: "font-size: 14px",
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "status",
|
name: "positionLevel",
|
||||||
|
align: "left",
|
||||||
|
label: "ระดับ",
|
||||||
|
sortable: true,
|
||||||
|
field: "positionLevel",
|
||||||
|
headerStyle: "font-size: 14px",
|
||||||
|
style: "font-size: 14px",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "organizationPositionOld",
|
||||||
|
align: "left",
|
||||||
|
label: "สังกัด",
|
||||||
|
sortable: true,
|
||||||
|
field: "organizationPositionOld",
|
||||||
|
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",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "statustext",
|
||||||
align: "left",
|
align: "left",
|
||||||
label: "สถานะ",
|
label: "สถานะ",
|
||||||
sortable: true,
|
sortable: true,
|
||||||
field: "status",
|
field: "statustext",
|
||||||
headerStyle: "font-size: 14px",
|
headerStyle: "font-size: 14px",
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
|
|
@ -229,15 +243,6 @@ const columns2 = ref<QTableProps["columns"]>([
|
||||||
headerStyle: "font-size: 14px",
|
headerStyle: "font-size: 14px",
|
||||||
style: "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",
|
name: "fullname",
|
||||||
align: "left",
|
align: "left",
|
||||||
|
|
@ -248,34 +253,59 @@ const columns2 = ref<QTableProps["columns"]>([
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "organizationName",
|
name: "position",
|
||||||
align: "left",
|
align: "left",
|
||||||
label: "หน่วยงานที่รับโอน",
|
label: "ตำแหน่งในสายงาน",
|
||||||
sortable: true,
|
sortable: true,
|
||||||
field: "organizationName",
|
field: "position",
|
||||||
headerStyle: "font-size: 14px",
|
headerStyle: "font-size: 14px",
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
sort: (a: string, b: string) =>
|
|
||||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "birthday",
|
name: "positionLevel",
|
||||||
align: "left",
|
align: "left",
|
||||||
label: "วัน/เดือน/ปี เกิด",
|
label: "ระดับ",
|
||||||
sortable: true,
|
sortable: true,
|
||||||
field: "birthday",
|
field: "positionLevel",
|
||||||
|
headerStyle: "font-size: 14px",
|
||||||
|
style: "font-size: 14px",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "organizationPositionOld",
|
||||||
|
align: "left",
|
||||||
|
label: "สังกัด",
|
||||||
|
sortable: true,
|
||||||
|
field: "organizationPositionOld",
|
||||||
|
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",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "statustext",
|
||||||
|
align: "left",
|
||||||
|
label: "สถานะ",
|
||||||
|
sortable: true,
|
||||||
|
field: "statustext",
|
||||||
headerStyle: "font-size: 14px",
|
headerStyle: "font-size: 14px",
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const openModalTree = (id: string) => {
|
// const openModalTree = (id: string) => {
|
||||||
personalId.value = id;
|
// personalId.value = id;
|
||||||
console.log(personalId.value);
|
// console.log(personalId.value);
|
||||||
|
|
||||||
personal.value = listRecevice.value.filter((e: any) => e.id === id);
|
// personal.value = listRecevice.value.filter((e: any) => e.id === id);
|
||||||
modalTree.value = true;
|
// modalTree.value = true;
|
||||||
};
|
// };
|
||||||
|
|
||||||
const clickDelete = (id: string) => {
|
const clickDelete = (id: string) => {
|
||||||
dialogRemove($q, () => deleteOther(id));
|
dialogRemove($q, () => deleteOther(id));
|
||||||
|
|
@ -427,128 +457,52 @@ const status = (val: string) => {
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
<template v-slot:body="props">
|
<template v-slot:body="props">
|
||||||
<q-tr :props="props" class="cursor-pointer">
|
<q-tr
|
||||||
<q-td key="no" :props="props" @click="nextPage(props.row)">
|
:props="props"
|
||||||
|
class="cursor-pointer"
|
||||||
|
@click="nextPage(props.row)"
|
||||||
|
>
|
||||||
|
<q-td key="no" :props="props">
|
||||||
{{ props.rowIndex + 1 }}
|
{{ props.rowIndex + 1 }}
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td
|
<q-td key="fullname" :props="props">
|
||||||
key="citizenId"
|
|
||||||
:props="props"
|
|
||||||
@click="nextPage(props.row)"
|
|
||||||
>
|
|
||||||
{{ props.row.citizenId }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="fullname"
|
|
||||||
:props="props"
|
|
||||||
@click="nextPage(props.row)"
|
|
||||||
>
|
|
||||||
{{ props.row.fullname }}
|
{{ props.row.fullname }}
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td
|
<q-td key="position" :props="props">
|
||||||
key="organizationName"
|
{{ props.row.position }}
|
||||||
:props="props"
|
</q-td>
|
||||||
@click="nextPage(props.row)"
|
<q-td key="positionLevel" :props="props">
|
||||||
>
|
{{ props.row.positionLevel }}
|
||||||
<div
|
</q-td>
|
||||||
v-if="
|
<q-td key="organizationPositionOld" :props="props">
|
||||||
props.row.orgName !== null ||
|
<div class="table_ellipsis">
|
||||||
props.row.positionPath !== null
|
{{ props.row.organizationPositionOld }}
|
||||||
"
|
<!-- <q-tooltip>
|
||||||
>
|
{{ props.row.organizationPositionOld }}
|
||||||
<div class="col-4">
|
</q-tooltip> -->
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{
|
|
||||||
props.row.orgName !== null ? props.row.orgName : "-"
|
|
||||||
}}
|
|
||||||
{{
|
|
||||||
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>
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td
|
<q-td key="organization" :props="props">
|
||||||
key="birthday"
|
<div class="table_ellipsis">
|
||||||
:props="props"
|
{{ props.row.organization }}
|
||||||
@click="nextPage(props.row)"
|
<!-- <q-tooltip>
|
||||||
>
|
{{ props.row.organization }}
|
||||||
{{ props.row.birthday }}
|
</q-tooltip> -->
|
||||||
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="status" :props="props" @click="nextPage(props.row)">
|
<q-td key="statustext" :props="props">
|
||||||
{{ props.row.status }}
|
{{ props.row.statustext }}
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td auto-width>
|
<q-td key="statustext" :props="props">
|
||||||
<q-btn
|
<q-btn
|
||||||
icon="mdi-dots-vertical"
|
|
||||||
size="12px"
|
|
||||||
color="grey-7"
|
|
||||||
flat
|
flat
|
||||||
round
|
round
|
||||||
|
class="text-red-14"
|
||||||
|
icon="mdi-delete"
|
||||||
dense
|
dense
|
||||||
|
@click.stop="clickDelete(props.row.personalId)"
|
||||||
|
><q-tooltip>ลบข้อมูล</q-tooltip></q-btn
|
||||||
>
|
>
|
||||||
<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.personalId)"
|
|
||||||
>
|
|
||||||
<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.personalId)"
|
|
||||||
>
|
|
||||||
<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>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -659,54 +613,27 @@ const status = (val: string) => {
|
||||||
<q-td key="no" :props="props">
|
<q-td key="no" :props="props">
|
||||||
{{ props.rowIndex + 1 }}
|
{{ props.rowIndex + 1 }}
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="citizenId" :props="props" @click="nextPage(props.row)">
|
<q-td key="fullname" :props="props">
|
||||||
{{ props.row.citizenId }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="fullname" :props="props" @click="nextPage(props.row)">
|
|
||||||
{{ props.row.fullname }}
|
{{ props.row.fullname }}
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td
|
<q-td key="position" :props="props">
|
||||||
key="organizationName"
|
{{ props.row.position }}
|
||||||
:props="props"
|
</q-td>
|
||||||
@click="nextPage(props.row)"
|
<q-td key="positionLevel" :props="props">
|
||||||
>
|
{{ props.row.positionLevel }}
|
||||||
<div
|
</q-td>
|
||||||
v-if="
|
<q-td key="organizationPositionOld" :props="props">
|
||||||
props.row.orgName !== null ||
|
<div class="table_ellipsis">
|
||||||
props.row.positionPath !== null
|
{{ props.row.organizationPositionOld }}
|
||||||
"
|
|
||||||
>
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="text-weight-medium">
|
|
||||||
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
|
|
||||||
{{
|
|
||||||
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>
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="birthday" :props="props" @click="nextPage(props.row)">
|
<q-td key="organization" :props="props">
|
||||||
{{ props.row.birthday }}
|
<div class="table_ellipsis">
|
||||||
|
{{ props.row.organization }}
|
||||||
|
</div>
|
||||||
|
</q-td>
|
||||||
|
<q-td key="statustext" :props="props">
|
||||||
|
{{ props.row.statustext }}
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -724,12 +651,12 @@ const status = (val: string) => {
|
||||||
</q-card>
|
</q-card>
|
||||||
</q-dialog>
|
</q-dialog>
|
||||||
|
|
||||||
<DialogOrgTree
|
<!-- <DialogOrgTree
|
||||||
v-model:modal="modalTree"
|
v-model:modal="modalTree"
|
||||||
:close="closeModalTree"
|
:close="closeModalTree"
|
||||||
:personal="personal"
|
:personal="personal"
|
||||||
:personalId="personalId"
|
:personalId="personalId"
|
||||||
/>
|
/> -->
|
||||||
<!-- :personalId="personalId" -->
|
<!-- :personalId="personalId" -->
|
||||||
</template>
|
</template>
|
||||||
<style scoped lang="scss"></style>
|
<style scoped lang="scss"></style>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue