เงินเดือน => ปรับ code รายการผังบัญชีเงินเดือน

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-04-30 11:53:57 +07:00
parent 3d784decdb
commit ff13fb1345
5 changed files with 225 additions and 356 deletions

View file

@ -7,7 +7,6 @@ import config from "@/app.config";
import type { import type {
DataOption, DataOption,
ObjectSalaryRef,
FormData, FormData,
} from "@/modules/13_salary/interface/index/Main"; } from "@/modules/13_salary/interface/index/Main";
import type { import type {
@ -28,7 +27,6 @@ const {
hideLoader, hideLoader,
messageError, messageError,
success, success,
dialogRemove,
} = useCounterMixin(); } = useCounterMixin();
const modal = defineModel<boolean>("modal", { required: true }); const modal = defineModel<boolean>("modal", { required: true });
@ -60,24 +58,10 @@ const formData = reactive<FormData>({
isSpecial: false, isSpecial: false,
}); });
/** ตัวแปร ref สำหรับแสดง validate */
const nameRef = ref<Object | null>(null);
const posTypeRef = ref<Object | null>(null);
const posLevelRef = ref<Object | null>(null);
const ObjectRef: ObjectSalaryRef = {
name: nameRef,
posTypId: posTypeRef,
posLevelId: posLevelRef,
};
const posType = ref<SalaryPosType[]>([]); const posType = ref<SalaryPosType[]>([]);
const salaryPosTypeOption = ref<DataOption[]>([]); const salaryPosTypeOption = ref<DataOption[]>([]);
const salaryPosLevelOption = ref<DataOption[]>([]); const salaryPosLevelOption = ref<DataOption[]>([]);
const documentFile = ref<any>(null);
const itemsDocument = ref<any>([]);
const title = computed(() => { const title = computed(() => {
const name = const name =
props.typeAction === "add" props.typeAction === "add"
@ -89,8 +73,9 @@ const title = computed(() => {
return name; return name;
}); });
async function fetchPosType() { /** fiunction fetch ข้อมูลประเภทตำแหน่ง*/
await http function fetchPosType() {
http
.get(config.API.salaryPosType) .get(config.API.salaryPosType)
.then((res) => { .then((res) => {
posType.value = res.data.result; posType.value = res.data.result;
@ -105,7 +90,8 @@ async function fetchPosType() {
}); });
} }
async function fetchPosLevel(id: string) { /** fiunction fetch ข้อมูลระดับตำแหน่ง*/
function fetchPosLevel(id: string) {
const filterLevel = posType.value.find((e: SalaryPosType) => e.id === id); const filterLevel = posType.value.find((e: SalaryPosType) => e.id === id);
const listOption = const listOption =
filterLevel?.posLevels.map((e: SalaryPosLevel) => ({ filterLevel?.posLevels.map((e: SalaryPosLevel) => ({
@ -119,9 +105,13 @@ async function fetchPosLevel(id: string) {
} }
} }
async function fetchSalaryDetail(id: string) { /**
* function fetch อมลผงบญชเงนเดอน
* @param id งบญชเงนเดอน
*/
function fetchSalaryDetail(id: string) {
showLoader(); showLoader();
await http http
.get(config.API.salaryChartByid(id)) .get(config.API.salaryChartByid(id))
.then((res) => { .then((res) => {
const data = res.data.result; const data = res.data.result;
@ -144,47 +134,34 @@ async function fetchSalaryDetail(id: string) {
}); });
} }
async function fetchDocumentFile(id: string) { /** callbackFunction ทำการ fetch ข้อมูลไฟล์เมื่อเปิด Dialog*/
await http
.get(config.API.salaryChartFile(id))
.then((res) => {
const list = res.data.map((e: any) => ({ name: e.fileName }));
itemsDocument.value = list;
})
.catch((err) => {});
}
watch( watch(
() => modal.value, () => modal.value,
async () => { () => {
if (modal.value) { if (modal.value) {
if (salaryPosTypeOption.value.length === 0) { if (salaryPosTypeOption.value.length === 0) {
await fetchPosType(); fetchPosType();
} }
// if (props.typeAction === "add") {
// formData.date = new Date();
// formData.startDate = new Date();
// formData.endDate = new Date();
// }
if (props.typeAction === "edit") { if (props.typeAction === "edit") {
await showLoader(); setTimeout(() => {
if (props.data) { if (props.data) {
salaryId.value = props.data.id; salaryId.value = props.data.id;
await fetchDocumentFile(props.data.id); fetchSalaryDetail(props.data.id);
await fetchSalaryDetail(props.data.id); fetchPosLevel(props.data.posTypeId);
await fetchPosLevel(props.data.posTypeId); }
} }, 100);
} }
} }
} }
); );
/** function ปืด Dialog*/
function closeDialog() { function closeDialog() {
modal.value = !modal.value; modal.value = !modal.value;
clearFormData(); clearFormData();
} }
/** function เคลียข้อมูล form*/
function clearFormData() { function clearFormData() {
formData.name = ""; formData.name = "";
formData.posTypeId = ""; formData.posTypeId = "";
@ -195,28 +172,11 @@ function clearFormData() {
formData.startDate = null; formData.startDate = null;
formData.endDate = null; formData.endDate = null;
formData.details = ""; formData.details = "";
documentFile.value = null;
itemsDocument.value = [];
isReadonly.value = false; isReadonly.value = false;
} }
function onClickSubmit() { /** function บัยทึกข้อมูลผังบัญชีเงินเดือน*/
const hasError = []; function onSubmit() {
for (const key in ObjectRef) {
if (Object.prototype.hasOwnProperty.call(ObjectRef, key)) {
const property = ObjectRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
createSalary();
}
}
function createSalary() {
dialogConfirm($q, async () => { dialogConfirm($q, async () => {
showLoader(); showLoader();
try { try {
@ -244,13 +204,12 @@ function checkEndDate() {
} }
} }
} }
</script> </script>
<template> <template>
<q-dialog v-model="modal" persistent> <q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 80%"> <q-card class="col-12" style="width: 80%">
<form @submit.prevent.stop="onClickSubmit"> <q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="title" :close="closeDialog" /> <Header :tittle="title" :close="closeDialog" />
<q-separator /> <q-separator />
<q-card-section class="scroll" style="max-height: 70vh"> <q-card-section class="scroll" style="max-height: 70vh">
@ -321,18 +280,14 @@ function checkEndDate() {
label="เฉพาะสายงานที่กำหนด" label="เฉพาะสายงานที่กำหนด"
/> />
<q-toggle <q-toggle
:disable="isReadonly" :disable="isReadonly"
color="primary" color="primary"
label="สถานะการใช้งาน" label="สถานะการใช้งาน"
v-model="formData.isActive" v-model="formData.isActive"
/> />
</div> </div>
<div class="col-xs-12 col-md-4"> <div class="col-xs-12 col-md-4">
<datepicker <datepicker
menu-class-name="modalfix" menu-class-name="modalfix"
@ -477,13 +432,14 @@ function checkEndDate() {
</div> </div>
</div> </div>
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<div class="text-right q-ma-sm"> <div class="text-right q-ma-sm">
<q-btn label="บันทึก" type="submit" color="secondary"> <q-btn label="บันทึก" type="submit" color="secondary">
<q-tooltip>นทกขอม</q-tooltip> <q-tooltip>นทกขอม</q-tooltip>
</q-btn> </q-btn>
</div> </div>
</form> </q-form>
</q-card> </q-card>
</q-dialog> </q-dialog>
</template> </template>

View file

@ -5,25 +5,24 @@ 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 type { ObjectSalaryRateRef } from "@/modules/13_salary/interface/index/Main"; /** importType*/
import type { FormSalaryRate } from "@/modules/13_salary/interface/index/Main";
/** importComponents*/
import Header from "@/components/DialogHeader.vue"; import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";
/** use*/
const $q = useQuasar(); const $q = useQuasar();
const route = useRoute(); const route = useRoute();
const { const { dialogConfirm, showLoader, hideLoader, messageError, success } =
date2Thai, useCounterMixin();
dialogConfirm,
showLoader,
hideLoader,
messageError,
success,
} = useCounterMixin();
const salaryId = ref<string>(route.params.id.toString());
/** props*/
const modal = defineModel<boolean>("modal", { required: true }); const modal = defineModel<boolean>("modal", { required: true });
const props = defineProps({ const props = defineProps({
typeAction: { typeAction: {
@ -40,7 +39,8 @@ const props = defineProps({
}, },
}); });
const formData = reactive<any>({ const salaryId = ref<string>(route.params.id.toString());
const formData = reactive<FormSalaryRate>({
salaryId: "", salaryId: "",
salary: null, salary: null,
salaryHalf: null, salaryHalf: null,
@ -52,25 +52,6 @@ const formData = reactive<any>({
isNext: false, isNext: false,
}); });
/** ตัวแปร ref สำหรับแสดง validate */
const salaryRef = ref<Object | null>(null);
const salaryHalfRef = ref<Object | null>(null);
const salaryHalfSpecialRef = ref<Object | null>(null);
const salaryFullRef = ref<Object | null>(null);
const salaryFullSpecialRef = ref<Object | null>(null);
const salaryFullHalfRef = ref<Object | null>(null);
const salaryFullHalfSpecialRef = ref<Object | null>(null);
const ObjectRef: ObjectSalaryRateRef = {
salary: salaryRef,
salaryHalf: salaryHalfRef,
salaryHalfSpecial: salaryHalfSpecialRef,
salaryFull: salaryFullRef,
salaryFullSpecial: salaryFullSpecialRef,
salaryFullHalf: salaryFullHalfRef,
salaryFullHalfSpecial: salaryFullHalfSpecialRef,
};
const title = computed(() => { const title = computed(() => {
const name = const name =
props.typeAction === "add" props.typeAction === "add"
@ -82,11 +63,13 @@ const title = computed(() => {
return name; return name;
}); });
/** function ปืด Dialog*/
function closeDialog() { function closeDialog() {
modal.value = !modal.value; modal.value = !modal.value;
clearFormData(); clearFormData();
} }
/** function เคลียข้อมูล form*/
function clearFormData() { function clearFormData() {
formData.salaryId = ""; formData.salaryId = "";
formData.salary = null; formData.salary = null;
@ -99,36 +82,20 @@ function clearFormData() {
formData.isNext = false; formData.isNext = false;
} }
function onClickSubmit() { /** function บันทึกข้อมูล*/
console.log(formData.salaryHalfSpecial); function onSubmit() {
const hasError = [];
for (const key in ObjectRef) {
if (Object.prototype.hasOwnProperty.call(ObjectRef, key)) {
const property = ObjectRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
createSalaryRate();
}
}
function createSalaryRate() {
dialogConfirm($q, async () => { dialogConfirm($q, async () => {
showLoader(); showLoader();
const body: any = { const body: any = {
salary: salary:
typeof formData.salary === "number" typeof formData.salary === "number"
? formData.salary ? formData.salary
: Number(formData.salary.replace(/,/g, "")), //* : Number(formData.salary?.replace(/,/g, "")), //*
salaryHalf: salaryHalf:
typeof formData.salaryHalf === "number" typeof formData.salaryHalf === "number"
? formData.salaryHalf ? formData.salaryHalf
: Number(formData.salaryHalf.replace(/,/g, "")), //0.5 : Number(formData.salaryHalf?.replace(/,/g, "")), //0.5
salaryHalfSpecial: salaryHalfSpecial:
formData.salaryHalfSpecial === "" || formData.salaryHalfSpecial === null formData.salaryHalfSpecial === "" || formData.salaryHalfSpecial === null
@ -140,19 +107,19 @@ function createSalaryRate() {
salaryFull: salaryFull:
typeof formData.salaryFull === "number" typeof formData.salaryFull === "number"
? formData.salaryFull ? formData.salaryFull
: Number(formData.salaryFull.replace(/,/g, "")), //1 : Number(formData.salaryFull?.replace(/,/g, "")), //1
salaryFullSpecial: salaryFullSpecial:
formData.salaryFullSpecial === "" || formData.salaryFullSpecial === null formData.salaryFullSpecial === "" || formData.salaryFullSpecial === null
? null ? null
: typeof formData.salaryFullSpecial === "number" : typeof formData.salaryFullSpecial === "number"
? formData.salaryFullSpecial ? formData.salaryFullSpecial
: Number(formData.salaryFullSpecial.replace(/,/g, "")), //1 () : Number(formData.salaryFullSpecial?.replace(/,/g, "")), //1 ()
salaryFullHalf: salaryFullHalf:
typeof formData.salaryFullHalf === "number" typeof formData.salaryFullHalf === "number"
? formData.salaryFullHalf ? formData.salaryFullHalf
: Number(formData.salaryFullHalf.replace(/,/g, "")), //1.formData5 : Number(formData.salaryFullHalf?.replace(/,/g, "")), //1.formData5
salaryFullHalfSpecial: salaryFullHalfSpecial:
formData.salaryFullHalfSpecial === "" || formData.salaryFullHalfSpecial === "" ||
@ -183,6 +150,7 @@ function createSalaryRate() {
}); });
} }
/** callbackFunction ทำการ fetch ข้อมูลไฟล์เมื่อเปิด Dialog*/
watch( watch(
() => modal.value, () => modal.value,
() => { () => {
@ -207,120 +175,122 @@ watch(
<template> <template>
<q-dialog v-model="modal" persistent> <q-dialog v-model="modal" persistent>
<q-card style="width: 700px; max-width: 80vw"> <q-card style="width: 700px; max-width: 80vw">
<Header :tittle="title" :close="closeDialog" /> <q-form greedy @submit.prevent @validation-success="onSubmit">
<q-separator /> <Header :tittle="title" :close="closeDialog" />
<q-separator />
<q-card-section > <q-card-section>
<div class="row q-gutter-sm q-pa-sm"> <div class="row q-gutter-sm q-pa-sm">
<div class="row col-xs-12 col-md-12 q-col-gutter-sm"> <div class="row col-xs-12 col-md-12 q-col-gutter-sm">
<div class="col-6"> <div class="col-6">
<q-input <q-input
ref="salaryRef" ref="salaryRef"
dense dense
outlined outlined
v-model="formData.salary" v-model="formData.salary"
label="เงินเดือนฐาน" label="เงินเดือนฐาน"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือนฐาน'}`]" :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือนฐาน'}`]"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div> </div>
<div class="col-6 row items-center"> <div class="col-6 row items-center">
<q-checkbox dense v-model="formData.isNext" label="ทะลุขั้น" /> <q-checkbox dense v-model="formData.isNext" label="ทะลุขั้น" />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-input <q-input
ref="salaryHalfRef" ref="salaryHalfRef"
dense dense
outlined outlined
v-model="formData.salaryHalf" v-model="formData.salaryHalf"
label="เลื่อน 0.5 ขั้น" label="เลื่อน 0.5 ขั้น"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเลื่อน 0.5 ขั้น'}`]" :rules="[(val) => !!val || `${'กรุณากรอกเลื่อน 0.5 ขั้น'}`]"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-input <q-input
ref="salaryHalfSpecialRef" ref="salaryHalfSpecialRef"
dense dense
outlined outlined
v-model="formData.salaryHalfSpecial" v-model="formData.salaryHalfSpecial"
label="เงินพิเศษ" label="เงินพิเศษ"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-input <q-input
ref="salaryFullRef" ref="salaryFullRef"
dense dense
outlined outlined
v-model="formData.salaryFull" v-model="formData.salaryFull"
label="เลื่อน 1 ขั้น" label="เลื่อน 1 ขั้น"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเลื่อน 1 ขั้น'}`]" :rules="[(val) => !!val || `${'กรุณากรอกเลื่อน 1 ขั้น'}`]"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-input <q-input
ref="salaryFullSpecialRef" ref="salaryFullSpecialRef"
dense dense
outlined outlined
v-model="formData.salaryFullSpecial" v-model="formData.salaryFullSpecial"
label="เงินพิเศษ" label="เงินพิเศษ"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-input <q-input
ref="salaryFullHalfRef" ref="salaryFullHalfRef"
dense dense
outlined outlined
v-model="formData.salaryFullHalf" v-model="formData.salaryFullHalf"
label="เลื่อน 1.5 ขั้น" label="เลื่อน 1.5 ขั้น"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเลื่อน 1.5 ขั้น'}`]" :rules="[(val) => !!val || `${'กรุณากรอกเลื่อน 1.5 ขั้น'}`]"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div> </div>
<div class="col-6"> <div class="col-6">
<q-input <q-input
ref="salaryFullHalfSpecialRef" ref="salaryFullHalfSpecialRef"
dense dense
outlined outlined
v-model="formData.salaryFullHalfSpecial" v-model="formData.salaryFullHalfSpecial"
label="เงินพิเศษ" label="เงินพิเศษ"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div>
</div> </div>
</div> </div>
</div> </q-card-section>
</q-card-section> <q-separator />
<q-separator />
<q-card-actions align="right" class="bg-white text-teal"> <q-card-actions align="right" class="bg-white text-teal">
<q-btn label="บันทึก" color="secondary" @click="onClickSubmit" <q-btn label="บันทึก" color="secondary" type="submit"
><q-tooltip>นทกขอม</q-tooltip></q-btn ><q-tooltip>นทกขอม</q-tooltip></q-btn
> >
</q-card-actions> </q-card-actions>
</q-form>
</q-card> </q-card>
</q-dialog> </q-dialog>
</template> </template>

View file

@ -5,22 +5,18 @@ import axios from "axios";
import http from "@/plugins/http"; import http from "@/plugins/http";
import config from "@/app.config"; import config from "@/app.config";
import type { ObjectSalaryRef } from "@/modules/13_salary/interface/index/Main"; /** importComponents*/
import Header from "@/components/DialogHeader.vue"; import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";
/**use*/
const $q = useQuasar(); const $q = useQuasar();
const { const { showLoader, hideLoader, messageError, success, dialogRemove } =
dialogConfirm, useCounterMixin();
showLoader,
hideLoader,
messageError,
success,
dialogRemove,
} = useCounterMixin();
/**props*/
const modal = defineModel<boolean>("modal", { required: true }); const modal = defineModel<boolean>("modal", { required: true });
const props = defineProps({ const props = defineProps({
typeAction: { typeAction: {
@ -54,59 +50,36 @@ const formData = reactive({
isSpecial: false, isSpecial: false,
}); });
/** ตัวแปร ref สำหรับแสดง validate */
const salaryTypeRef = ref<Object | null>(null);
const posTypeRef = ref<Object | null>(null);
const posLevelRef = ref<Object | null>(null);
const dateRef = ref<Object | null>(null);
const startDateRef = ref<Object | null>(null);
const endDateRef = ref<Object | null>(null);
const ObjectRef: ObjectSalaryRef = {
salaryType: salaryTypeRef,
posTypId: posTypeRef,
posLevelId: posLevelRef,
date: dateRef,
startDate: startDateRef,
endDate: endDateRef,
};
const documentFile = ref<any>(null); const documentFile = ref<any>(null);
const itemsDocument = ref<any>([]); const itemsDocument = ref<any>([]);
async function fetchDocumentFile(id: string) { /**
await http * function fetch อมลรายการ ไฟล
* @param id
*/
function fetchDocumentFile(id: string) {
showLoader();
http
.get(config.API.salaryChartFile(id)) .get(config.API.salaryChartFile(id))
.then((res) => { .then((res) => {
const list = res.data.map((e: any) => ({ name: e.fileName })); const list = res.data.map((e: any) => ({ name: e.fileName }));
itemsDocument.value = list; itemsDocument.value = list;
}) })
.catch((err) => {}) .catch((err) => {
messageError($q, err);
})
.finally(() => { .finally(() => {
hideLoader(); hideLoader();
}); });
} }
watch( /** function ปืด Dialog*/
() => modal.value,
async () => {
if (modal.value) {
if (props.typeAction === "edit") {
await showLoader();
if (props.id) {
salaryId.value = props.id;
await fetchDocumentFile(props.id);
}
}
}
}
);
function closeDialog() { function closeDialog() {
modal.value = !modal.value; modal.value = !modal.value;
clearFormData(); clearFormData();
} }
/** function เคลียข้อมูล form*/
function clearFormData() { function clearFormData() {
formData.salaryType = ""; formData.salaryType = "";
formData.posTypeId = ""; formData.posTypeId = "";
@ -121,42 +94,7 @@ function clearFormData() {
itemsDocument.value = []; itemsDocument.value = [];
} }
function onClickSubmit() { /** function เรียก path อัปโหลดไฟล์*/
const hasError = [];
for (const key in ObjectRef) {
if (Object.prototype.hasOwnProperty.call(ObjectRef, key)) {
const property = ObjectRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
createSalary();
}
}
function createSalary() {
dialogConfirm($q, async () => {
showLoader();
try {
const url =
props.typeAction === "add"
? config.API.salaryChart
: config.API.salaryChartByid(salaryId.value);
await http[props.typeAction === "add" ? "post" : "put"](url, formData);
success($q, "บันทีกข้อมูลสำเร็จ");
props.fetchData?.();
} catch (err) {
messageError($q, err);
} finally {
hideLoader();
closeDialog();
}
});
}
async function uploadDocumentFile() { async function uploadDocumentFile() {
const fileName = documentFile.value.name.replace(/\.(xlsx|docx|pdf)$/, ""); const fileName = documentFile.value.name.replace(/\.(xlsx|docx|pdf)$/, "");
showLoader(); showLoader();
@ -208,6 +146,10 @@ function fileUpLoad(url: string) {
.finally(() => {}); .finally(() => {});
} }
/**
* function ลบขอมลรายการไฟล
* @param fileName อไฟล
*/
function onClickDeleteFile(fileName: string) { function onClickDeleteFile(fileName: string) {
dialogRemove($q, async () => { dialogRemove($q, async () => {
showLoader(); showLoader();
@ -230,9 +172,13 @@ function onClickDeleteFile(fileName: string) {
}); });
} }
async function onClickDonwload(fileName: string) { /**
* function โหลดขอมลไฟล
* @param fileName อไฟล
*/
function onClickDonwload(fileName: string) {
showLoader(); showLoader();
await http http
.get(config.API.salaryChartDelFile(salaryId.value, fileName)) .get(config.API.salaryChartDelFile(salaryId.value, fileName))
.then((res) => { .then((res) => {
const data = res.data; const data = res.data;
@ -250,8 +196,8 @@ async function onClickDonwload(fileName: string) {
* @param type ประเภทไฟล * @param type ประเภทไฟล
* @param fileName อไฟล * @param fileName อไฟล
*/ */
async function downloadFile(url: string, type: string, fileName: string) { function downloadFile(url: string, type: string, fileName: string) {
await axios axios
.get(url, { .get(url, {
method: "GET", method: "GET",
responseType: "blob", responseType: "blob",
@ -260,7 +206,7 @@ async function downloadFile(url: string, type: string, fileName: string) {
Accept: type, // Accept: type, //
}, },
}) })
.then(async (res) => { .then((res) => {
const a = document.createElement("a"); const a = document.createElement("a");
a.href = window.URL.createObjectURL(res.data); a.href = window.URL.createObjectURL(res.data);
a.download = fileName; a.download = fileName;
@ -273,6 +219,21 @@ async function downloadFile(url: string, type: string, fileName: string) {
hideLoader(); hideLoader();
}); });
} }
/** callbackFunction ทำการ fetch ข้อมูลไฟล์เมื่อเปิด Dialog*/
watch(
() => modal.value,
() => {
if (modal.value) {
if (props.typeAction === "edit") {
if (props.id) {
salaryId.value = props.id;
fetchDocumentFile(props.id);
}
}
}
}
);
</script> </script>
<template> <template>

View file

@ -7,7 +7,7 @@ import config from "@/app.config";
/** importType*/ /** importType*/
import type { FormDataChar } from "@/modules/13_salary/interface/request/EmployeeChart"; import type { FormDataChar } from "@/modules/13_salary/interface/request/EmployeeChart";
/** importComponentes*/ /** importComponents*/
import Header from "@/components/DialogHeader.vue"; import Header from "@/components/DialogHeader.vue";
/** importStore*/ /** importStore*/

View file

@ -22,29 +22,6 @@ interface ItemsMenu {
color: string; color: string;
type: string; type: string;
} }
interface ObjectSalaryRef {
salaryType: object | null;
// name: object | null;
posTypId: object | null;
posLevelId: object | null;
date: object | null;
startDate: object | null;
endDate: object | null;
[key: string]: any;
}
interface ObjectSalaryRateRef {
salary: object | null;
salaryHalf: object | null;
salaryHalfSpecial: object | null;
salaryFull: object | null;
salaryFullSpecial: object | null;
salaryFullHalf: object | null;
salaryFullHalfSpecial: object | null;
[key: string]: any;
}
interface FormData { interface FormData {
name: string; name: string;
@ -57,12 +34,17 @@ interface FormData {
details: string; details: string;
isSpecial: boolean; isSpecial: boolean;
} }
export type {
DataOption, interface FormSalaryRate {
NewPagination, salaryId: string;
ItemsMenu, salary: null | number | string;
ObjectSalaryRef, salaryHalf: null | number | string;
ObjectSalaryRateRef, salaryHalfSpecial: null | number | string;
DataOptionShort, salaryFull: null | number | string;
FormData, salaryFullSpecial: null | number | string;
}; salaryFullHalf: null | number | string;
salaryFullHalfSpecial: null | number | string;
isNext: boolean;
}
export type { DataOption, NewPagination, ItemsMenu, DataOptionShort, FormData ,FormSalaryRate};