Refactoring code module 07_insignia
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
208d867dfd
commit
6fb6024f53
31 changed files with 1158 additions and 2444 deletions
|
|
@ -1,22 +1,25 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from "vue";
|
||||
import { QForm, useQuasar } from "quasar";
|
||||
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*/
|
||||
import type { DataOption } from "@/modules/04_registry/components/profileType";
|
||||
import type { DataStructureTree } from "@/interface/main";
|
||||
|
||||
/**
|
||||
* import Components
|
||||
*/
|
||||
import DialogHeader from "../DialogHeader.vue";
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
/** import Stores */
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useRoute } from "vue-router";
|
||||
|
||||
/** useStore*/
|
||||
/** use*/
|
||||
const route = useRoute();
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const {
|
||||
date2Thai,
|
||||
|
|
@ -28,23 +31,9 @@ const {
|
|||
dateToISO,
|
||||
} = mixin;
|
||||
|
||||
const route = useRoute();
|
||||
const $q = useQuasar();
|
||||
const myForm = ref<any>();
|
||||
|
||||
const files = ref<any>();
|
||||
const filesReturn = ref<any>();
|
||||
const OrganazationId = ref<string>("");
|
||||
const OrganazationId2 = ref<string>("");
|
||||
const OrgList = ref<DataOption[]>([]);
|
||||
const OrgList2 = ref<DataOption[]>([]);
|
||||
const Datereceive = ref<Date | null>();
|
||||
const Datereturn = ref<Date | null>();
|
||||
const remark = ref<string>("");
|
||||
const nullii = ref<any>(null);
|
||||
const filesCheck = ref<string>("");
|
||||
const filesReturnCheck = ref<string>("");
|
||||
|
||||
/**
|
||||
* props
|
||||
*/
|
||||
const props = defineProps({
|
||||
modal: Boolean,
|
||||
personId: String,
|
||||
|
|
@ -52,16 +41,31 @@ const props = defineProps({
|
|||
fecthlistInsignia: Function,
|
||||
dateCheckReceive: String,
|
||||
dateCheckReturn: String,
|
||||
|
||||
dataModal: Object,
|
||||
});
|
||||
|
||||
/** function clearDate */
|
||||
const files = ref<any>(); //ไฟล์รับ
|
||||
const filesReturn = ref<any>(); //ไฟล์คืน
|
||||
const OrganazationId = ref<string>(""); //id หน่วยงานที่รับ
|
||||
const OrganazationId2 = ref<string>(""); //id หน่วยงานที่คือ
|
||||
const OrgList = ref<DataOption[]>([]); //รายการหน่วยงาน
|
||||
const OrgList2 = ref<DataOption[]>([]); ////รายการหน่วยงาน
|
||||
const Datereceive = ref<Date | null>(); //วันที่รับ
|
||||
const Datereturn = ref<Date | null>(); //วันที่คืน
|
||||
const nullii = ref<any>(null);
|
||||
const filesCheck = ref<string>("");
|
||||
const filesReturnCheck = ref<string>("");
|
||||
|
||||
/**
|
||||
* function clearDate
|
||||
*/
|
||||
function clearReturnDate() {
|
||||
Datereturn.value = null;
|
||||
}
|
||||
|
||||
/** function Colsepopup*/
|
||||
/**
|
||||
* function Colsepopup
|
||||
*/
|
||||
function close() {
|
||||
props.close?.();
|
||||
Datereceive.value = null;
|
||||
|
|
@ -83,11 +87,9 @@ function onSubmit(type: string, id: string) {
|
|||
if (props.dateCheckReceive === null) {
|
||||
formData.append("Date", dateToISO((Datereceive.value as Date) ?? nullii));
|
||||
formData.append("File", files.value);
|
||||
// formData.append("OrgId", OrganazationId.value);
|
||||
} else {
|
||||
formData.append("Date", dateToISO((Datereturn.value as Date) ?? nullii));
|
||||
formData.append("File", filesReturn.value);
|
||||
// formData.append("OrgId", OrganazationId2.value);
|
||||
}
|
||||
showLoader();
|
||||
http
|
||||
|
|
@ -110,32 +112,26 @@ function onSubmit(type: string, id: string) {
|
|||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.modal,
|
||||
() => {
|
||||
if (props.modal == true) {
|
||||
fetchOrgList();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
/** function เรียกหน่วยงาน*/
|
||||
function fetchOrgList() {
|
||||
/**
|
||||
* function เรียกหน่วยงาน
|
||||
*/
|
||||
async function fetchOrgList() {
|
||||
showLoader();
|
||||
http
|
||||
await http
|
||||
.get(config.API.activeOrganization)
|
||||
.then((res) => {
|
||||
.then(async (res) => {
|
||||
const data = res.data.result;
|
||||
|
||||
http
|
||||
await http
|
||||
.get(config.API.orgByIdSystem(data.activeId, route.meta.Key as string))
|
||||
.then(async (res) => {
|
||||
const data = await res.data.result.map((item: any) => ({
|
||||
id: item.orgTreeId,
|
||||
name: item.orgName,
|
||||
}));
|
||||
OrgList.value = data;
|
||||
OrgList2.value = data;
|
||||
const dataSystem = await res.data.result.map(
|
||||
(item: DataStructureTree) => ({
|
||||
id: item.orgTreeId,
|
||||
name: item.orgName,
|
||||
})
|
||||
);
|
||||
OrgList.value = dataSystem;
|
||||
OrgList2.value = dataSystem;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
|
|
@ -149,7 +145,21 @@ function fetchOrgList() {
|
|||
});
|
||||
}
|
||||
|
||||
/** callback function จำทำงานเมื่อ props มีการเปลี่ยนแปลง*/
|
||||
/**
|
||||
* callback function จะทำงานเมื่อ modal มีการเปลี่ยนแปลง
|
||||
*/
|
||||
watch(
|
||||
() => props.modal,
|
||||
() => {
|
||||
if (props.modal == true) {
|
||||
fetchOrgList();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
/**
|
||||
* callback function จะทำงานเมื่อ props มีการเปลี่ยนแปลง
|
||||
*/
|
||||
watch(props, () => {
|
||||
if (props.dataModal) {
|
||||
Datereceive.value = props.dataModal.dateReceiveInsignia;
|
||||
|
|
@ -172,7 +182,6 @@ watch(props, () => {
|
|||
<q-dialog v-model="props.modal" persistent>
|
||||
<q-card style="min-width: 900px">
|
||||
<q-form
|
||||
ref="myForm"
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="
|
||||
|
|
@ -212,7 +221,7 @@ watch(props, () => {
|
|||
dense
|
||||
borderless
|
||||
outlined
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่ได้รับ']"
|
||||
:rules="[(val:string) => !!val || 'กรุณาเลือกวันที่ได้รับ']"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
:model-value="
|
||||
|
|
@ -256,7 +265,7 @@ watch(props, () => {
|
|||
v-model="files"
|
||||
label="ไฟล์หลักฐานการรับ"
|
||||
lazy-rules
|
||||
:rules="[(val) => val || 'กรุณาเลือกไฟล์หลักฐานการรับ']"
|
||||
:rules="[(val:string) => val || 'กรุณาเลือกไฟล์หลักฐานการรับ']"
|
||||
hide-bottom-space
|
||||
:disable="dateCheckReceive !== null"
|
||||
>
|
||||
|
|
@ -279,7 +288,7 @@ watch(props, () => {
|
|||
v-model="OrganazationId"
|
||||
lazy-rules
|
||||
:label="`หน่วยงานที่รับ`"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่รับ']"
|
||||
:rules="[(val:string) => !!val || 'กรุณาเลือกหน่วยงานที่รับ']"
|
||||
:disable="dateCheckReceive !== null"
|
||||
class="inputgreen"
|
||||
/>
|
||||
|
|
@ -317,7 +326,7 @@ watch(props, () => {
|
|||
borderless
|
||||
outlined
|
||||
class="inputgreen"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่คืน']"
|
||||
:rules="[(val:string) => !!val || 'กรุณาเลือกวันที่คืน']"
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
Datereturn != null ? date2Thai(Datereturn) : undefined
|
||||
|
|
@ -362,7 +371,7 @@ watch(props, () => {
|
|||
v-model="filesReturn"
|
||||
label="ไฟล์หลักฐานการคืน"
|
||||
lazy-rules
|
||||
:rules="[(val) => val || 'กรุณาเลือกไฟล์หลักฐานการคืน']"
|
||||
:rules="[(val:string) => val || 'กรุณาเลือกไฟล์หลักฐานการคืน']"
|
||||
hide-bottom-space
|
||||
:disable="dateCheckReturn !== null"
|
||||
>
|
||||
|
|
@ -385,7 +394,7 @@ watch(props, () => {
|
|||
v-model="OrganazationId2"
|
||||
lazy-rules
|
||||
:label="`หน่วยงานที่คืน`"
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกหน่วยงานที่คืน']"
|
||||
:rules="[(val:string) => !!val || 'กรุณาเลือกหน่วยงานที่คืน']"
|
||||
:disable="dateCheckReturn !== null"
|
||||
class="inputgreen"
|
||||
/>
|
||||
|
|
@ -1,6 +1,9 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watch, computed, reactive } from "vue";
|
||||
import { QForm, useQuasar } from "quasar";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useResultDataStore } from "@/modules/07_insignia/storeResult";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
|
|
@ -8,13 +11,8 @@ import config from "@/app.config";
|
|||
* import Type
|
||||
*/
|
||||
import type { DataOption } from "@/modules/04_registry/components/profileType";
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
/**
|
||||
* import Stores
|
||||
*/
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useResultDataStore } from "@/modules/07_insignia/storeResult";
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
/**
|
||||
* use
|
||||
|
|
@ -38,9 +36,7 @@ const {
|
|||
*/
|
||||
const props = defineProps({
|
||||
modal: Boolean,
|
||||
save: {
|
||||
type: Function,
|
||||
},
|
||||
|
||||
close: {
|
||||
type: Function,
|
||||
},
|
||||
|
|
@ -63,29 +59,31 @@ const props = defineProps({
|
|||
* ตัวแปร
|
||||
*/
|
||||
const status = ref<string>("");
|
||||
const Advertise = ref<string>("");
|
||||
const issue = ref<string>("");
|
||||
const brand = ref<string>("");
|
||||
const cardid = ref<string>("");
|
||||
const fullName = ref<string>("");
|
||||
const volume = ref<string>("");
|
||||
const episode = ref<string>("");
|
||||
const duty = ref<string>("");
|
||||
const announced = ref<string>("");
|
||||
const position = ref<string>("");
|
||||
const payment = ref<string>("");
|
||||
const addressPayment = ref<string | null>(null);
|
||||
const affiliationRequest = ref<string>("");
|
||||
const affiliationReceived = ref<string>("");
|
||||
const receivedate = ref<Date | null>();
|
||||
const announceDate = ref<Date | null>();
|
||||
const invoiceDate = ref<Date | null>(null);
|
||||
const filterinsigniaOp2 = ref<any[]>([]);
|
||||
const employeeClass = ref<string>("");
|
||||
const Advertise = ref<string>(""); //หมายเลขประกาศนีย์บัตรกำกับเครื่องราชอิสริยาภรณ์
|
||||
const issue = ref<string>(""); //ทะเบียนฐานันดร
|
||||
const brand = ref<string>(""); //ชั้นตราเครื่องราชอิสริยาภรณ์
|
||||
const cardid = ref<string>(""); //เลขประจำตัวประชาชน
|
||||
const fullName = ref<string>(""); //ชื่อ-นามสกุล
|
||||
const volume = ref<string>(""); //เล่มที่
|
||||
const episode = ref<string>(""); //ตอนที่
|
||||
const duty = ref<string>(""); //หน้าที่
|
||||
const announced = ref<string>(""); //ลำดับที่
|
||||
const position = ref<string>(""); //ตำเเหน่ง
|
||||
const payment = ref<string>(""); //รูปแบบการจ่าย
|
||||
const addressPayment = ref<string | null>(null); //ที่อยู่ที่จ่าย
|
||||
const affiliationRequest = ref<string>(""); //สังกัด ณ วันที่ขอพระราชทานเครื่องราชอิสริยาภรณ์
|
||||
const affiliationReceived = ref<string>(""); //สังกัด ณ วันที่ได้รับประกาศนียบัตรกำกับเครื่องราชอิสริยาภรณ์
|
||||
const receivedate = ref<Date | null>(); //วันที่ได้รับพระราชทานเครื่องราชอิสริยาภรณ์
|
||||
const announceDate = ref<Date | null>(); //วันที่
|
||||
const invoiceDate = ref<Date | null>(null); //วันที่จ่ายใบกำกับ
|
||||
const filterinsigniaOp2 = ref<DataOption[]>([]); //ตัวเลือกเครื่องราชอิสริยาภรณ์
|
||||
const employeeClass = ref<string>(""); //ขรก.สามัญ/ลูกจ้างประจำ
|
||||
//ประเภท ขรก.สามัญ/ลูกจ้างประจำ
|
||||
const employeeClassOps = ref<DataOption[]>([
|
||||
{ id: "officer", name: "ข้าราชการ กทม.สามัญ" },
|
||||
{ id: "employee", name: "ลูกจ้างประจำ" },
|
||||
]);
|
||||
//ประเภทรูปแบบการจ่าย
|
||||
const paymentOp = [
|
||||
{ label: "จัดส่งทางไปรษณีย์", value: "จัดส่งทางไปรษณีย์" },
|
||||
{ label: "มารับด้วยตัวเอง", value: "มารับด้วยตัวเอง" },
|
||||
|
|
@ -97,45 +95,13 @@ const formFilter = reactive({
|
|||
searchKeyword: "",
|
||||
});
|
||||
|
||||
/** function reset วันที่จ่ายใบกำกับ*/
|
||||
/**
|
||||
* function reset วันที่จ่ายใบกำกับ
|
||||
*/
|
||||
function clearDateInvoiceDate() {
|
||||
invoiceDate.value = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* callback function จำทำงานเมื่อ props.modal = true เปิด popup เพิ่มรายชื่อบันทึกผล
|
||||
*/
|
||||
watch(props, () => {
|
||||
if (props.modal === true) {
|
||||
filterinsigniaOp2.value = DataStore.insigniaOp2;
|
||||
employeeClass.value = "";
|
||||
cardid.value = "";
|
||||
fullName.value = "";
|
||||
position.value = "";
|
||||
Advertise.value = "";
|
||||
brand.value = "";
|
||||
receivedate.value = null;
|
||||
issue.value = "";
|
||||
affiliationRequest.value = "";
|
||||
affiliationReceived.value = "";
|
||||
announceDate.value = null;
|
||||
volume.value = "";
|
||||
episode.value = "";
|
||||
duty.value = "";
|
||||
announced.value = "";
|
||||
invoiceDate.value = null;
|
||||
payment.value = "";
|
||||
if (props.personId !== undefined) {
|
||||
if (props.action === "editData") {
|
||||
fectDataByid(props.personId); // เมือแก้ไข เรียกข้อมูลบันทึกผล
|
||||
}
|
||||
}
|
||||
} else {
|
||||
status.value = "";
|
||||
selectType();
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* disbleStatus
|
||||
*/
|
||||
|
|
@ -241,7 +207,9 @@ function fectDataByid(id: string) {
|
|||
});
|
||||
}
|
||||
|
||||
/** function บักทึกผล*/
|
||||
/**
|
||||
* function บักทึกผล
|
||||
*/
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
if (props.roundId !== undefined) {
|
||||
|
|
@ -293,17 +261,51 @@ function searchcardid() {
|
|||
* @param update function
|
||||
* @param name ชื่อ selec
|
||||
*/
|
||||
const filterSelector = (val: any, update: Function, name: any) => {
|
||||
function filterSelector(val: string, update: Function, name: string) {
|
||||
update(() => {
|
||||
const needle = val.toLowerCase();
|
||||
if (name === "insigniaOp2") {
|
||||
brand.value = "";
|
||||
brand.value = val ? "" : brand.value;
|
||||
filterinsigniaOp2.value = DataStore.insigniaOp2.filter(
|
||||
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
(v: DataOption) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
);
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* callback function จำทำงานเมื่อ props.modal = true เปิด popup เพิ่มรายชื่อบันทึกผล
|
||||
*/
|
||||
watch(props, () => {
|
||||
if (props.modal === true) {
|
||||
filterinsigniaOp2.value = DataStore.insigniaOp2;
|
||||
employeeClass.value = "";
|
||||
cardid.value = "";
|
||||
fullName.value = "";
|
||||
position.value = "";
|
||||
Advertise.value = "";
|
||||
brand.value = "";
|
||||
receivedate.value = null;
|
||||
issue.value = "";
|
||||
affiliationRequest.value = "";
|
||||
affiliationReceived.value = "";
|
||||
announceDate.value = null;
|
||||
volume.value = "";
|
||||
episode.value = "";
|
||||
duty.value = "";
|
||||
announced.value = "";
|
||||
invoiceDate.value = null;
|
||||
payment.value = "";
|
||||
if (props.personId !== undefined) {
|
||||
if (props.action === "editData") {
|
||||
fectDataByid(props.personId); // เมือแก้ไข เรียกข้อมูลบันทึกผล
|
||||
}
|
||||
}
|
||||
} else {
|
||||
status.value = "";
|
||||
selectType();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -322,7 +324,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
<div class="col-4">
|
||||
<q-select
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณาเลือก ขรก.สามัญ/ลูกจ้างประจำ',
|
||||
(val:string) => !!val || 'กรุณาเลือก ขรก.สามัญ/ลูกจ้างประจำ',
|
||||
]"
|
||||
hide-bottom-space
|
||||
:options="employeeClassOps"
|
||||
|
|
@ -406,7 +408,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
<q-input
|
||||
:disable="disbleStatus || status == 'DONE'"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val:string) =>
|
||||
!!val ||
|
||||
'กรุณากรอกหมายเลขประกาศนีย์บัตรกำกับเครื่องราชอิสริยาภรณ์',
|
||||
]"
|
||||
|
|
@ -440,9 +442,9 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
class="inputgreen"
|
||||
style="min-width: 150px"
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอกชื่อชั้นตราเครื่องราชอิสริยาภรณ์',
|
||||
(val:string) => !!val || 'กรุณากรอกชื่อชั้นตราเครื่องราชอิสริยาภรณ์',
|
||||
]"
|
||||
@filter="(inputValue:any,doneFn:Function) =>
|
||||
@filter="(inputValue:string,doneFn:Function) =>
|
||||
filterSelector(inputValue, doneFn,'insigniaOp2') "
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -469,7 +471,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
dense
|
||||
borderless
|
||||
outlined
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
|
||||
:rules="[(val:string) => !!val || 'กรุณาเลือกวันที่']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
|
|
@ -491,7 +493,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input
|
||||
:disable="disbleStatus || status == 'DONE'"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกทะเบียนฐานันดร']"
|
||||
:rules="[(val:string) => !!val || 'กรุณากรอกทะเบียนฐานันดร']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
dense
|
||||
|
|
@ -507,7 +509,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
:disable="
|
||||
disbleStatus || status == 'DONE' || status == 'PENDING'
|
||||
"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
|
||||
:rules="[(val:string) => !!val || 'กรุณากรอกสังกัด']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
dense
|
||||
|
|
@ -523,7 +525,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
:disable="
|
||||
disbleStatus || status == 'DONE' || status == 'PENDING'
|
||||
"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
|
||||
:rules="[(val:string) => !!val || 'กรุณากรอกสังกัด']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
dense
|
||||
|
|
@ -561,7 +563,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
dense
|
||||
borderless
|
||||
outlined
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
|
||||
:rules="[(val:string) => !!val || 'กรุณาเลือกวันที่']"
|
||||
class="inputgreen"
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
|
|
@ -591,7 +593,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
borderless
|
||||
v-model="volume"
|
||||
:label="`เล่มที่`"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกเล่มที่']"
|
||||
:rules="[(val:string) => !!val || 'กรุณากรอกเล่มที่']"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-4">
|
||||
|
|
@ -605,7 +607,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
borderless
|
||||
v-model="episode"
|
||||
:label="`ตอนที่`"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกตอนที่']"
|
||||
:rules="[(val:string) => !!val || 'กรุณากรอกตอนที่']"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
|
|
@ -619,7 +621,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
borderless
|
||||
v-model="duty"
|
||||
:label="`หน้าที่`"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกหน้าที่']"
|
||||
:rules="[(val:string) => !!val || 'กรุณากรอกหน้าที่']"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
|
|
@ -633,7 +635,7 @@ const filterSelector = (val: any, update: Function, name: any) => {
|
|||
borderless
|
||||
v-model="announced"
|
||||
:label="`ลำดับที่`"
|
||||
:rules="[(val) => !!val || 'กรุณากรอกลำดับที่']"
|
||||
:rules="[(val:string) => !!val || 'กรุณากรอกลำดับที่']"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 q-my-xs"><q-separator size="2px" /></div>
|
||||
|
|
@ -1,30 +1,41 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import { checkPermission } from "@/utils/permissions";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { checkPermission } from "@/utils/permissions";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** import Type*/
|
||||
import type { QTableProps, QForm } from "quasar";
|
||||
import type { TypeData } from "@/modules/07_insignia/interface/index/Main";
|
||||
import type {
|
||||
TypeData,
|
||||
DataDocuments,
|
||||
} from "@/modules/07_insignia/interface/index/Main";
|
||||
|
||||
/** import Stores */
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
/** useStore*/
|
||||
/** use*/
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const { success, messageError, hideLoader, dialogConfirm, showLoader } = mixin;
|
||||
|
||||
const $q = useQuasar();
|
||||
const myForm = ref<any>();
|
||||
/**
|
||||
* props
|
||||
*/
|
||||
const props = defineProps({
|
||||
roundId: {
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
|
||||
const fileUpload = ref<any>(null);
|
||||
const reason = ref<string>("");
|
||||
const documentTitle = ref<string>("");
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterDoc = ref<any>(null);
|
||||
const myForm = ref<any>();
|
||||
const fileUpload = ref<any>(null); //ไฟล์เอกสาร
|
||||
const documentTitle = ref<string>(""); //ชื่อเอกสาร
|
||||
const reason = ref<string>(""); //หมายเหตุ
|
||||
const filterKeyword = ref<string>(""); //คำค้นหา
|
||||
|
||||
/** คอลัมน์ตาราง*/
|
||||
const rows2 = ref<DataDocuments[]>([]);
|
||||
const colums2 = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
|
|
@ -61,15 +72,10 @@ const visibleColumnsReference = ref<String[]>([
|
|||
"annotation",
|
||||
"file",
|
||||
]);
|
||||
const rows2 = ref<any>([]);
|
||||
|
||||
const props = defineProps({
|
||||
roundId: {
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
|
||||
/** function ดึงข้อมูลรายการเอกสารอ้างอิง */
|
||||
/**
|
||||
* function ดึงข้อมูลรายการเอกสารอ้างอิง
|
||||
*/
|
||||
async function getRequest() {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -93,46 +99,46 @@ async function getRequest() {
|
|||
});
|
||||
}
|
||||
|
||||
/** function เช็คฟอร์มก่อนบันทึก และยืนยันการบันทึกข้อมูล */
|
||||
/**
|
||||
* function เช็คฟอร์มก่อนบันทึก และยืนยันการบันทึกข้อมูล
|
||||
*/
|
||||
function save() {
|
||||
myForm.value.validate().then((result: boolean) => {
|
||||
if (result) {
|
||||
dialogConfirm($q, () => putRequest());
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
const dataAppend = new FormData();
|
||||
dataAppend.append("Name", documentTitle.value);
|
||||
dataAppend.append("Reason", reason.value);
|
||||
dataAppend.append("File", fileUpload.value);
|
||||
await http
|
||||
.put(config.API.requestDocNote(props.roundId as string), dataAppend)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
documentTitle.value = "";
|
||||
reason.value = "";
|
||||
fileUpload.value = null;
|
||||
|
||||
// reset เพื่อไม่ให้ฟอร์มแจ้งเตือ validate หลังบันทึกเสร็จแล้วล้างค่าฟิลด์ต่างๆ
|
||||
myForm.value.reset();
|
||||
getRequest();
|
||||
hideLoader();
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** function บันทึกเอกสาร */
|
||||
async function putRequest() {
|
||||
showLoader();
|
||||
const dataAppend = new FormData();
|
||||
dataAppend.append("Name", documentTitle.value);
|
||||
dataAppend.append("Reason", reason.value);
|
||||
dataAppend.append("File", fileUpload.value);
|
||||
await http
|
||||
.put(config.API.requestDocNote(props.roundId as string), dataAppend)
|
||||
.then(() => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
documentTitle.value = "";
|
||||
reason.value = "";
|
||||
fileUpload.value = null;
|
||||
|
||||
// reset เพื่อไม่ให้ฟอร์มแจ้งเตือ validate หลังบันทึกเสร็จแล้วล้างค่าฟิลด์ต่างๆ
|
||||
myForm.value.reset();
|
||||
getRequest();
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/** function resetFilter */
|
||||
/**
|
||||
* function resetFilter
|
||||
*/
|
||||
function resetFilterRef() {
|
||||
filterKeyword.value = "";
|
||||
filterDoc.value.focus();
|
||||
}
|
||||
|
||||
const pagination = ref({
|
||||
|
|
@ -169,7 +175,7 @@ onMounted(async () => {
|
|||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
:rules="[(val) => !!val || `กรุณาเลือกไฟล์เอกสาร`]"
|
||||
:rules="[(val:string) => !!val || `กรุณาเลือกไฟล์เอกสาร`]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" color="primary" />
|
||||
|
|
@ -185,7 +191,7 @@ onMounted(async () => {
|
|||
v-model="documentTitle"
|
||||
:label="`${'ชื่อเอกสาร'}`"
|
||||
hide-bottom-space
|
||||
:rules="[(val) => !!val || `กรุณากรอกชื่อเอกสาร`]"
|
||||
:rules="[(val:string) => !!val || `กรุณากรอกชื่อเอกสาร`]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-6 row no-wrap">
|
||||
|
|
@ -217,7 +223,6 @@ onMounted(async () => {
|
|||
standout
|
||||
dense
|
||||
v-model="filterKeyword"
|
||||
ref="filterDoc"
|
||||
outlined
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
Loading…
Add table
Add a link
Reference in a new issue