บันทึกวันที่ไม่ได้รับเงินดือน

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2025-03-13 10:18:43 +07:00
parent af9ce4ac1e
commit a7d629da86
3 changed files with 101 additions and 313 deletions

View file

@ -7,6 +7,9 @@ import { useRoute } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryDataStore } from "@/modules/04_registryPerson/stores/salary";
import type { QTableColumn } from "quasar";
import type {
DataPositions,
@ -22,11 +25,6 @@ import type { ResListSalary } from "@/modules/04_registryPerson/interface/respon
import DialogHeader from "@/components/DialogHeader.vue";
import DialogHistory from "@/modules/04_registryPerson/components/detail/DialogHistory.vue";
// import DialogHistory from "@/modules/04_registryPerson/components/detail/Salary/01_PositionSalaryHistory.vue";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryDataStore } from "@/modules/04_registryPerson/stores/salary";
import DialogPreviewCommand from "@/modules/18_command/components/DialogPreviewCommand.vue";
const { findOrgName } = useCounterMixin();
@ -341,7 +339,8 @@ const columns = computed<QTableColumn[]>(() => {
}
}
return baseColumns.value.filter(
(e: any) => e.name !== "lastUpdateFullName" && e.name !== "lastUpdatedAd"
(e: QTableColumn) =>
e.name !== "lastUpdateFullName" && e.name !== "lastUpdatedAd"
);
});
const visibleColumns = ref<string[]>(

View file

@ -8,12 +8,12 @@ import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
import type { QTableProps } from "quasar";
import type { QTableColumn } from "quasar";
import type { RowList } from "@/modules/04_registryPerson/interface/index/salary";
import type { RequestNoPaidObject } from "@/modules/04_registryPerson/interface/request/Salary";
import DialogHeader from "@/components/DialogHeader.vue";
import DialogHisotory from "@/modules/04_registryPerson/components/detail/Salary/02_NotReceiveSalaryHistory.vue";
import DialogHistory from "@/modules/04_registryPerson/components/detail/DialogHistory.vue";
const $q = useQuasar();
const route = useRoute();
@ -26,6 +26,7 @@ const {
success,
pathRegistryEmp,
onSearchDataTable,
convertDateToAPI,
} = useCounterMixin();
const id = ref<string>("");
@ -52,11 +53,7 @@ const formData = reactive<RequestNoPaidObject>({
refCommandDate: null, //' ()'
});
//Table
const rows = ref<RowList[]>([]); //
const rowsMain = ref<RowList[]>([]); //
const keyword = ref<string>(""); //
const columns = ref<QTableProps["columns"]>([
const baseColumns = ref<QTableColumn[]>([
{
name: "date",
align: "left",
@ -102,7 +99,6 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "refCommandDate",
align: "left",
@ -116,34 +112,92 @@ const columns = ref<QTableProps["columns"]>([
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "lastUpdatedAt",
name: "lastUpdateFullName",
align: "left",
label: "วันที่แก้ไข",
label: "ผู้ดำเนินการ",
sortable: true,
field: "lastUpdatedAt",
format: (v) => date2Thai(v, false, true),
field: "lastUpdateFullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "lastUpdatedAt",
align: "left",
label: "วันที่แก้ไข",
sortable: true,
field: "lastUpdatedAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
format: (v) => date2Thai(v, false, true),
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const visibleColumns = ref<string[]>([
const baseVisibleColumns = ref<string[]>([
"date",
"detail",
"reference",
"detail",
"refCommandNo",
"refCommandDate",
"lastUpdateFullName",
"lastUpdatedAt",
]);
//Table
const rows = ref<RowList[]>([]); //
const rowsMain = ref<RowList[]>([]); //
const keyword = ref<string>(""); //
const columns = ref<QTableColumn[]>(
baseColumns.value.filter((e: QTableColumn) => e.name !== "lastUpdateFullName")
);
const visibleColumns = ref<string[]>(
baseVisibleColumns.value.filter((e: string) => e !== "lastUpdateFullName")
);
const pagination = ref({
sortBy: "lastUpdatedAt",
});
const columnsHistory = ref<QTableColumn[]>(baseColumns.value);
const visibleColumnsHistory = ref<string[]>(baseVisibleColumns.value);
/** funciton ยืนยันการบันทึกข้อมูล*/
function onSubmit() {
dialogConfirm($q, () => {
isStatusEdit.value ? editData() : saveData();
dialogConfirm($q, async () => {
showLoader();
const url = isStatusEdit.value
? config.API.profileNewNoPaidById(id.value, empType.value)
: config.API.profileNewNoPaid(empType.value);
const methods = isStatusEdit.value ? http.patch : http.post;
await methods(url, {
...formData,
date: convertDateToAPI(formData.date),
refCommandDate: convertDateToAPI(formData.refCommandDate),
profileId: isStatusEdit.value
? undefined
: empType.value === ""
? profileId.value
: undefined,
profileEmployeeId: isStatusEdit.value
? undefined
: empType.value !== ""
? profileId.value
: undefined,
})
.then(async () => {
await getData();
success($q, "บันทึกข้อมูลสำเร็จ");
onClickCloseDialog();
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
});
}
@ -152,7 +206,10 @@ function onSubmit() {
* @param StatusEdit แกไข , เพ
* @param data อม
*/
function onClickOpenDialog(StatusEdit: boolean = false, data: any = []) {
function onClickOpenDialog(
StatusEdit: boolean = false,
data: RowList = {} as RowList
) {
isStatusEdit.value = StatusEdit;
id.value = StatusEdit ? data.id : "";
formData.date = StatusEdit ? data.date : null;
@ -186,55 +243,27 @@ async function getData() {
});
}
/** function เพิ่มข้อมูลรายการบันทึกวันที่ไม่ได้รับเงินเดือนฯ*/
function saveData() {
showLoader();
http
.post(config.API.profileNewNoPaid(empType.value), {
...formData,
profileId: empType.value === "" ? profileId.value : undefined,
profileEmployeeId: empType.value !== "" ? profileId.value : undefined,
})
.then(async () => {
await getData();
await success($q, "บันทึกข้อมูลสำเร็จ");
onClickCloseDialog();
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
/** function แก้ไขข้อมูลรายการบันทึกวันที่ไม่ได้รับเงินเดือนฯ*/
function editData() {
showLoader();
http
.patch(config.API.profileNewNoPaidById(id.value, empType.value), {
...formData,
profileId: undefined,
})
.then(async () => {
await getData();
await success($q, "บันทึกข้อมูลสำเร็จ");
onClickCloseDialog();
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
/** function เปิดข้อมูลประวัติการแก้ไช*/
function onClickHistory(rowId: string) {
id.value = rowId;
modalHistory.value = true;
}
/** fetch รายการข้อมูลประวัติการแก้ไช*/
async function fetchDataHistory() {
showLoader();
try {
const res = await http.get(
config.API.profileNewNoPaidHisById(id.value, empType.value)
);
return res.data.result;
} catch (err) {
messageError($q, err);
} finally {
hideLoader();
}
}
function serchDataTable() {
rows.value = onSearchDataTable(
keyword.value,
@ -569,7 +598,13 @@ onMounted(() => {
</q-card>
</q-dialog>
<DialogHisotory v-model:modal="modalHistory" v-model:id="id" />
<DialogHistory
v-model:modal="modalHistory"
:visible-columns="visibleColumnsHistory"
:title="`ประวัติแก้ไขบันทึกวันที่ไม่ได้รับเงินเดือนฯ`"
:columns="columnsHistory"
:fetch-data="fetchDataHistory"
/>
</template>
<style scoped></style>

View file

@ -1,246 +0,0 @@
<script setup lang="ts">
import { ref, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useRoute } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
import type { QTableProps } from "quasar";
import type { RowList } from "@/modules/04_registryPerson/interface/index/salary";
import DialogHeader from "@/components/DialogHeader.vue";
const route = useRoute();
const $q = useQuasar();
const mixin = useCounterMixin();
const {
showLoader,
hideLoader,
messageError,
date2Thai,
pathRegistryEmp,
onSearchDataTable,
} = mixin;
const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
const modal = defineModel<boolean>("modal", { required: true });
const id = defineModel<string>("id", { required: true });
//Table
const filter = ref<string>(""); //
const rows = ref<RowList[]>([]); //
const rowsMain = ref<RowList[]>([]); //
const columns = ref<QTableProps["columns"]>([
{
name: "date",
align: "left",
label: "วัน เดือน ปี",
sortable: true,
field: "date",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "reference",
align: "left",
label: "เอกสารอ้างอิง",
sortable: true,
field: "reference",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "detail",
align: "left",
label: "รายละเอียด",
sortable: true,
field: "detail",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "refCommandNo",
align: "left",
label: "เลขที่คำสั่ง",
sortable: true,
field: "refCommandNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "refCommandDate",
align: "left",
label: "เอกสารอ้างอิง (ลงวันที่)",
sortable: true,
field: "refCommandDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "lastUpdateFullName",
align: "left",
label: "ผู้ดำเนินการ",
sortable: true,
field: "lastUpdateFullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "lastUpdatedAt",
align: "left",
label: "วันที่แก้ไข",
sortable: true,
field: "lastUpdatedAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
format: (v) => date2Thai(v, false, true),
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const visibleColumns = ref<string[]>([
"date",
"reference",
"detail",
"refCommandNo",
"refCommandDate",
"lastUpdateFullName",
"lastUpdatedAt",
]);
const pagination = ref({
sortBy: "lastUpdatedAt",
});
/** fetch รายการข้อมูลประวัติการแก้ไช*/
async function getHistory() {
showLoader();
await http
.get(config.API.profileNewNoPaidHisById(id.value, empType.value))
.then(async (res) => {
rows.value = await res.data.result;
rowsMain.value = await res.data.result;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
/** ฟังก์ชันปิด Popup*/
function closeDialog() {
modal.value = false;
rows.value = [];
}
function serchDataTable() {
rows.value = onSearchDataTable(
filter.value,
rowsMain.value,
columns.value ? columns.value : []
);
}
/**
* การเปลยนแปลงของ modal
* modal เป true เรยก getHistory เพอดงขอมลประวการแกไข
*/
watch(modal, (status) => {
if (status == true) {
getHistory();
filter.value = "";
} else {
filter.value = "";
}
});
</script>
<template>
<q-dialog v-model="modal" persistent>
<q-card style="min-width: 80%">
<DialogHeader
:tittle="'ประวัติแก้ไขบันทึกวันที่ไม่ได้รับเงินเดือนฯ'"
:close="closeDialog"
/>
<q-separator color="grey-4" />
<q-card-section style="max-height: 60vh" class="scroll">
<div class="row q-gutter-sm q-mb-sm">
<q-space />
<q-input
dense
outlined
v-model="filter"
label="ค้นหา"
class="q-mr-sm"
@keydown.enter.pervent="serchDataTable"
>
<template v-slot:append>
<q-icon name="search" />
</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"
style="min-width: 140px"
/>
</div>
<d-table
ref="table"
row-key="id"
flat
bordered
dense
:columns="columns"
:rows="rows"
v-model:pagination="pagination"
:visible-columns="visibleColumns"
>
<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">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<div class="table_ellipsis">
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</q-card-section>
</q-card>
</q-dialog>
</template>
<style scoped></style>