ปรับ ทดลองงาน
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
72529c5d6c
commit
328dd6e1a3
6 changed files with 492 additions and 184 deletions
|
|
@ -16,14 +16,6 @@ const $q = useQuasar(); //ใช้ noti quasar
|
|||
const mixin = useCounterMixin();
|
||||
const { messageError, success, showLoader, hideLoader, dialogConfirm } = mixin;
|
||||
|
||||
const modal = ref<boolean>(false);
|
||||
const pagination = ref({
|
||||
sortBy: "desc",
|
||||
descending: false,
|
||||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
});
|
||||
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"name",
|
||||
|
|
@ -33,8 +25,7 @@ const visibleColumns = ref<string[]>([
|
|||
"probation_no",
|
||||
"order_number",
|
||||
"probation_status",
|
||||
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
||||
|
||||
]);
|
||||
// หัวตาราง
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -110,10 +101,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
const rows = ref<FormMainProbation[]>([]);
|
||||
|
||||
// หัวตาราง2
|
||||
const columns2 = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -161,21 +150,26 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
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",
|
||||
},
|
||||
]);
|
||||
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
const rows2 = ref<FormMainProbation2[]>([]);
|
||||
|
||||
const modal = ref<boolean>(false);
|
||||
const probationlist = ref<any>([]);
|
||||
|
||||
onMounted(async () => {
|
||||
getpersonalList();
|
||||
});
|
||||
|
||||
watch(modal, () => {
|
||||
if (modal.value === true) {
|
||||
fecthlistPersonal();
|
||||
}
|
||||
});
|
||||
|
||||
const getpersonalList = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -192,7 +186,7 @@ const getpersonalList = async () => {
|
|||
organization: item.organization,
|
||||
probation_no: item.probation_no,
|
||||
order_number: item.order_number,
|
||||
probation_status: item.probation_status,
|
||||
probation_status: statusProbationMain(item.probation_status),
|
||||
}));
|
||||
})
|
||||
.catch(() => {})
|
||||
|
|
@ -200,7 +194,6 @@ const getpersonalList = async () => {
|
|||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
// fecth profile
|
||||
const fecthlistPersonal = async () => {
|
||||
showLoader();
|
||||
|
|
@ -215,45 +208,53 @@ const fecthlistPersonal = async () => {
|
|||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
.finally(() => {});
|
||||
};
|
||||
const fecthlistProbation = async (id: string, data: any) => {
|
||||
try {
|
||||
probationlist.value = [];
|
||||
const res = await http.post(
|
||||
config.API.profileSearchNewOcIdType(id, "officer"),
|
||||
{
|
||||
criterias: data,
|
||||
}
|
||||
);
|
||||
return res.data.result;
|
||||
} catch (err) {
|
||||
messageError($q, err);
|
||||
} finally {
|
||||
hideLoader();
|
||||
}
|
||||
};
|
||||
const findlist = async (id: string) => {
|
||||
let data = [
|
||||
{ criteriaType: "is_retire", criteriaValue: "false" },
|
||||
{ criteriaType: "is_probation", criteriaValue: "true" },
|
||||
];
|
||||
let data2 = [
|
||||
{ criteriaType: "is_retire", criteriaValue: "false" },
|
||||
{ criteriaType: "is_probation", criteriaValue: "false" },
|
||||
];
|
||||
await http
|
||||
.post(config.API.profileSearchNewOcIdType(id, "officer"), {
|
||||
criterias: data,
|
||||
})
|
||||
.then((res) => {
|
||||
rows2.value = res.data.result.map((e: any) => ({
|
||||
id: e.id,
|
||||
fullname: e.fullname,
|
||||
position: e.position,
|
||||
level: e.positionEmployeeLevel,
|
||||
organizationOrganization: e.oc,
|
||||
}));
|
||||
});
|
||||
};
|
||||
let response1 = await fecthlistProbation(id, data);
|
||||
let response2 = await fecthlistProbation(id, data2);
|
||||
|
||||
const clickDelete = (id: string) => {
|
||||
$q.dialog({
|
||||
title: "ยืนยันการลบข้อมูล",
|
||||
message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
|
||||
cancel: {
|
||||
flat: true,
|
||||
color: "negative",
|
||||
},
|
||||
persistent: true,
|
||||
})
|
||||
.onOk(async () => {})
|
||||
.onCancel(() => {})
|
||||
.onDismiss(() => {});
|
||||
response1.forEach((e: any) =>
|
||||
probationlist.value.push({ ...e, probation: true })
|
||||
);
|
||||
response2.forEach((e: any) =>
|
||||
probationlist.value.push({ ...e, probation: false })
|
||||
);
|
||||
console.log(probationlist.value);
|
||||
rows2.value = probationlist.value.map((e: any) => ({
|
||||
id: e.id,
|
||||
fullname: e.fullname,
|
||||
position: e.position,
|
||||
level: e.positionEmployeeLevel,
|
||||
organizationOrganization: e.oc,
|
||||
status: statusProbation(e.probation),
|
||||
}));
|
||||
modal.value = true;
|
||||
};
|
||||
|
||||
const clickAdd = (id: string) => {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
|
|
@ -279,25 +280,36 @@ const clickAdd = (id: string) => {
|
|||
"ยันยันการเพิ่มข้อมูล",
|
||||
"ต้องการเพิ่มข้อมูลนี้หรือไม่ ?"
|
||||
);
|
||||
// $q.dialog({
|
||||
// title: "ยืนยันการเพิ่มข้อมูล",
|
||||
// message: "ต้องการเพิ่มข้อมูลนี้ใช่หรือไม่?",
|
||||
// cancel: {
|
||||
// flat: true,
|
||||
// color: "negative",
|
||||
// },
|
||||
// persistent: true,
|
||||
// })
|
||||
// .onOk(async () => {
|
||||
|
||||
// })
|
||||
// .onCancel(() => {})
|
||||
// .onDismiss(() => {});
|
||||
};
|
||||
|
||||
const clickClose = async () => {
|
||||
modal.value = false;
|
||||
};
|
||||
const statusProbationMain = (val: string) => {
|
||||
switch (val) {
|
||||
case "1":
|
||||
return "อยู่ระหว่างการทดลองปฏิบัติหน้าที่ราชการ";
|
||||
case "2":
|
||||
return "พ้นการทดลองปฏิบัติหน้าที่ราชการ";
|
||||
case "3":
|
||||
return "ไม่พ้นการทดลองปฏิบัติหน้าที่ราชการ";
|
||||
case "4":
|
||||
return "ยุติการทดลองปฏิบัติหน้าที่ราชการเนื่องจากเปลี่ยนตำแหน่ง";
|
||||
case "5":
|
||||
return "ยุติการทดลองปฏิบัติหน้าที่ราชการเนื่องจากลาออก";
|
||||
case "6":
|
||||
return "ยุติการทดลองปฏิบัติหน้าที่ราชการเนื่องจากถึงแก่กรรม";
|
||||
default:
|
||||
return " ";
|
||||
}
|
||||
};
|
||||
const statusProbation = (val: boolean) => {
|
||||
switch (val) {
|
||||
case true:
|
||||
return "ทดลองงาน";
|
||||
default:
|
||||
return " ";
|
||||
}
|
||||
};
|
||||
|
||||
// ค้นหาในตาราง
|
||||
const filterKeyword = ref<string>("");
|
||||
|
|
@ -313,14 +325,30 @@ const resetFilter2 = () => {
|
|||
filterKeyword2.value = "";
|
||||
filterRef2.value.focus();
|
||||
};
|
||||
const pagination = ref({
|
||||
sortBy: "desc",
|
||||
descending: false,
|
||||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
});
|
||||
const pagination2 = ref({
|
||||
sortBy: "desc",
|
||||
descending: false,
|
||||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
});
|
||||
|
||||
const attrs = ref<any>(useAttrs());
|
||||
|
||||
const paging = ref<boolean>(true);
|
||||
const paginationLabel = (start: string, end: string, total: string) => {
|
||||
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
|
||||
else return start + "-" + end + " ใน " + total;
|
||||
};
|
||||
const paging2 = ref<boolean>(true);
|
||||
const paginationLabel2 = (start: string, end: string, total: string) => {
|
||||
if (paging2.value == true) return " " + start + "-" + end + " ใน " + total;
|
||||
else return start + "-" + end + " ใน " + total;
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -332,7 +360,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div>
|
||||
<q-btn
|
||||
@click="modal = true"
|
||||
@click="fecthlistPersonal"
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
|
|
@ -415,7 +443,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name === 'probation_status'">
|
||||
<!-- <div v-else-if="col.name === 'probation_status'">
|
||||
<q-icon
|
||||
size="20px"
|
||||
v-if="props.row.probation_status === 'PENDING'"
|
||||
|
|
@ -451,7 +479,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
? "ไม่ผ่านการทดลองงาน"
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
</div> -->
|
||||
<div v-else>
|
||||
{{ col.value }}
|
||||
</div>
|
||||
|
|
@ -517,8 +545,8 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
dense
|
||||
class="custom-header-table"
|
||||
v-bind="attrs"
|
||||
:pagination-label="paginationLabel"
|
||||
v-model:pagination="pagination"
|
||||
:pagination-label="paginationLabel2"
|
||||
v-model:pagination="pagination2"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
|
|
@ -561,7 +589,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
</template>
|
||||
<template v-slot:pagination="scope">
|
||||
<q-pagination
|
||||
v-model="pagination.page"
|
||||
v-model="pagination2.page"
|
||||
active-color="primary"
|
||||
color="dark"
|
||||
:max="scope.pagesNumber"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue