ทะเบียนประวัติ: เครื่องราชฯ (แก้ไข)

This commit is contained in:
puriphatt 2024-03-19 12:02:09 +07:00
parent 81763a632b
commit 21fd984366
4 changed files with 248 additions and 383 deletions

View file

@ -4,7 +4,7 @@ import { useRoute } from "vue-router";
import { useQuasar } from "quasar"; import { useQuasar } from "quasar";
import http from "@/plugins/http"; import http from "@/plugins/http";
import config from "@/app.config"; import config from "@/app.config";
import type { QTableProps } from "quasar"; import type { QTableProps, QForm } from "quasar";
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";
import HistoryTable from "@/components/TableHistory.vue"; import HistoryTable from "@/components/TableHistory.vue";
@ -13,13 +13,17 @@ import type {
DataOption, DataOption,
DataOptionInsignia, DataOptionInsignia,
InsigniaOps, InsigniaOps,
Pagination,
} from "@/modules/04_registryNew/interface/index/Main"; } from "@/modules/04_registryNew/interface/index/Main";
import type { import type {
RequestItemsObject, RequestItemsObject,
Columns, FormData,
DataProps,
} from "@/modules/04_registryNew/interface/request/Insignia"; } from "@/modules/04_registryNew/interface/request/Insignia";
import type {
ResponseObject,
ResponseInsigniaObject,
ResponseInsigniaType,
} from "@/modules/04_registryNew/interface/response/Insignia";
import type { ResponseObject as Insignia } from "@/modules/07_insignia/interface/response/Main";
const $q = useQuasar(); const $q = useQuasar();
const route = useRoute(); const route = useRoute();
@ -27,35 +31,17 @@ const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
success, success,
dateToISO,
messageError,
typeChangeName,
dialogMessage,
showLoader, showLoader,
hideLoader, hideLoader,
messageError,
dialogConfirm,
dialogRemove,
} = mixin; } = mixin;
const profileId = ref<string>( const profileId = ref<string>(
route.params.id ? route.params.id.toString() : "" route.params.id ? route.params.id.toString() : ""
); );
const insigniaData = reactive<{ const insigniaData = reactive<FormData>({
id: string;
isActive: boolean;
year: number | null;
receiveDate: Date | string | null;
insigniaId: string;
insigniaType: string;
no: string;
issue: string;
volumeNo: string;
volume: string;
section: string;
page: string;
dateAnnounce: Date | null | string;
refCommandNo: string;
refCommandDate: Date | null | string;
note: string;
}>({
id: "", id: "",
isActive: true, isActive: true,
year: 0, year: 0,
@ -75,7 +61,7 @@ const insigniaData = reactive<{
}); });
const editRow = ref<boolean>(false); const editRow = ref<boolean>(false);
const myForm = ref<any>(); const myForm = ref<QForm>();
const isEdit = ref<boolean>(false); const isEdit = ref<boolean>(false);
const modal = ref<boolean>(false); const modal = ref<boolean>(false);
const modeView = ref<string>("table"); const modeView = ref<string>("table");
@ -92,7 +78,7 @@ const OpsFilter = ref<InsigniaOps>({
insigniaOptions: [], insigniaOptions: [],
}); });
const rows = ref<any>([]); const rows = ref<ResponseObject[]>([]);
const columns = ref<QTableProps["columns"]>([ const columns = ref<QTableProps["columns"]>([
{ {
name: "year", name: "year",
@ -102,6 +88,7 @@ const columns = ref<QTableProps["columns"]>([
field: "year", field: "year",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => v + 543,
}, },
{ {
name: "receiveDate", name: "receiveDate",
@ -111,6 +98,7 @@ const columns = ref<QTableProps["columns"]>([
field: "receiveDate", field: "receiveDate",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -122,6 +110,7 @@ const columns = ref<QTableProps["columns"]>([
field: "insigniaId", field: "insigniaId",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => Ops.value.insigniaOptions.find((r) => r.id === v)?.name,
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -130,9 +119,10 @@ const columns = ref<QTableProps["columns"]>([
align: "left", align: "left",
label: "ลำดับชั้น", label: "ลำดับชั้น",
sortable: true, sortable: true,
field: "insigniaType", field: "insignia",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => v.name,
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -210,6 +200,7 @@ const columns = ref<QTableProps["columns"]>([
field: "dateAnnounce", field: "dateAnnounce",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -232,6 +223,7 @@ const columns = ref<QTableProps["columns"]>([
field: "refCommandDate", field: "refCommandDate",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -256,8 +248,7 @@ const columnsHistory = ref<QTableProps["columns"]>([
field: "year", field: "year",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
sort: (a: string, b: string) => format: (v) => v + 543,
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
{ {
name: "receiveDate", name: "receiveDate",
@ -267,6 +258,7 @@ const columnsHistory = ref<QTableProps["columns"]>([
field: "receiveDate", field: "receiveDate",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -275,9 +267,10 @@ const columnsHistory = ref<QTableProps["columns"]>([
align: "left", align: "left",
label: "ชื่อเครื่องราชฯ", label: "ชื่อเครื่องราชฯ",
sortable: true, sortable: true,
field: "insignia", field: "insigniaId",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => Ops.value.insigniaOptions.find((r) => r.id === v)?.name,
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -286,9 +279,10 @@ const columnsHistory = ref<QTableProps["columns"]>([
align: "left", align: "left",
label: "ลำดับชั้น", label: "ลำดับชั้น",
sortable: true, sortable: true,
field: "insigniaType", field: "insignia",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => v.name,
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -366,6 +360,7 @@ const columnsHistory = ref<QTableProps["columns"]>([
field: "dateAnnounce", field: "dateAnnounce",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -388,6 +383,7 @@ const columnsHistory = ref<QTableProps["columns"]>([
field: "refCommandDate", field: "refCommandDate",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -410,6 +406,7 @@ const columnsHistory = ref<QTableProps["columns"]>([
field: "createdAt", field: "createdAt",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
format: (v) => date2Thai(v),
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
@ -449,220 +446,110 @@ const visibleColumnsHistory = ref<String[]>([
"createdAt", "createdAt",
]); ]);
const formFilter = reactive({
page: 1,
pageSize: 10,
keyword: "",
});
const pagination = ref({
page: formFilter.page,
rowsPerPage: formFilter.pageSize,
});
async function fetchData() { async function fetchData() {
if (profileId.value) { if (!profileId.value) return;
showLoader();
await http showLoader();
.get(config.API.profileNewInsignByProfileId(profileId.value)) try {
.then((res) => { const res = await http.get(
let data = res.data.result; config.API.profileNewInsignByProfileId(profileId.value)
rows.value = []; );
data.map((e: any) => { console.log(res.data.result);
rows.value.push({
id: e.id, rows.value = res.data.result;
insigniaId: e.insigniaId, } catch (error) {
insigniaType: e.insigniaType, messageError($q, error);
year: e.year, } finally {
no: e.no, hideLoader();
issue: e.issue,
volumeNo: e.volumeNo,
volume: e.volume,
section: e.section,
page: e.page,
receiveDate: e.receiveDate,
dateAnnounce: e.dateAnnounce,
refCommandNo: e.refCommandNo,
refCommandDate: e.refCommandDate,
createdFullName: e.createdFullName,
createdAt: e.createdAt,
note: e.note,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
// store.isLoad++;
});
} }
} }
async function fetchInsignia() { async function fetchInsignia() {
showLoader(); showLoader();
await http try {
.get(config.API.insignia) const res = await http.get(config.API.insigniaOrg);
.then((res) => {
const data = res.data.result;
let option: DataOptionInsignia[] = [];
data.map((r: any) => {
option.push({
id: r.id.toString(),
name: r.name.toString() + ` (${r.shortName})`,
typeName:
r.insigniaType == null ? null : r.insigniaType.name.toString(),
});
});
Ops.value.insigniaOptions = option;
OpsFilter.value.insigniaOptions = option;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
// store.isLoad++;
});
}
async function saveData() { const data = res.data.result;
if (profileId.value) { let option: DataOptionInsignia[] = [];
showLoader(); data.map((r: Insignia) => {
await http option.push({
.post(config.API.profileNewInsign, { id: r.id.toString(),
profileId: profileId.value, name: r.name.toString() + ` (${r.shortName})`,
isActive: insigniaData.isActive, typeName: r.insigniaTypeName.toString(),
year: insigniaData.year,
no: insigniaData.no,
volume: insigniaData.volume,
section: insigniaData.section,
page: insigniaData.page,
receiveDate: dateToISO(insigniaData.receiveDate as Date),
insigniaId: insigniaData.insigniaId,
insigniaType: insigniaData.insigniaType,
dateAnnounce: insigniaData.dateAnnounce
? dateToISO(insigniaData.dateAnnounce as Date)
: null,
issue: insigniaData.issue,
volumeNo: insigniaData.volumeNo,
refCommandDate:
insigniaData.refCommandDate == null
? null
: dateToISO(insigniaData.refCommandDate as Date),
refCommandNo: insigniaData.refCommandNo,
// note: note.value,
})
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
modal.value = false;
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await fetchData();
}); });
});
Ops.value.insigniaOptions = option;
OpsFilter.value.insigniaOptions = option;
} catch (error) {
messageError($q, error);
} finally {
hideLoader();
} }
} }
async function editData() { async function addEditData(editStatus: boolean = false) {
showLoader(); if (!profileId.value) return;
await http
.patch(config.API.profileNewInsignById(insigniaData.id), { const url = editStatus
profileId: profileId.value, ? config.API.profileNewInsignById(insigniaData.id)
isActive: insigniaData.isActive, : config.API.profileNewInsign;
year: insigniaData.year, const method = editStatus ? "patch" : "post";
no: insigniaData.no, const reqBody: RequestItemsObject = {
volume: insigniaData.volume, profileId: profileId.value,
section: insigniaData.section, isActive: insigniaData.isActive,
page: insigniaData.page, year: insigniaData.year,
receiveDate: dateToISO(insigniaData.receiveDate as Date), no: insigniaData.no,
insigniaId: insigniaData.insigniaId, volume: insigniaData.volume,
insigniaType: insigniaData.insigniaType, section: insigniaData.section,
dateAnnounce: insigniaData.dateAnnounce page: insigniaData.page,
? dateToISO(insigniaData.dateAnnounce as Date) receiveDate: insigniaData.receiveDate,
: null, insigniaId: insigniaData.insigniaId,
issue: insigniaData.issue, dateAnnounce: insigniaData.dateAnnounce,
volumeNo: insigniaData.volumeNo, issue: insigniaData.issue,
refCommandDate: volumeNo: insigniaData.volumeNo,
insigniaData.refCommandDate == null refCommandDate: insigniaData.refCommandDate,
? null refCommandNo: insigniaData.refCommandNo,
: dateToISO(insigniaData.refCommandDate as Date), note: insigniaData.note,
refCommandNo: insigniaData.refCommandNo, };
// note: note.value,
}) try {
.then((res) => { await http[method](url, reqBody);
success($q, "บันทึกข้อมูลสำเร็จ"); success($q, "บันทึกข้อมูลสำเร็จ");
modal.value = false; await fetchData();
}) } catch (e) {
.catch((e) => { messageError($q, e);
messageError($q, e); } finally {
}) hideLoader();
.finally(async () => { }
await fetchData();
});
} }
async function clickDelete(dataId: string) { async function clickDelete(dataId: string) {
$q.dialog({ try {
title: `ลบข้อมูล`, await http.delete(config.API.profileNewInsignById(dataId));
message: `ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`, success($q, "ลบข้อมูลสำเร็จ");
cancel: "ยกเลิก", await fetchData();
ok: "ยืนยัน", modal.value = false;
persistent: true, } catch (error) {
}) messageError($q, error);
.onOk(async () => { } finally {
showLoader(); hideLoader();
await http }
.delete(config.API.profileNewInsignById(dataId))
.then((res) => {
success($q, "ลบข้อมูลสำเร็จ");
modal.value = false;
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await fetchData();
});
})
.onCancel(async () => {
await fetchData();
});
} }
function onClickOpenDialog(editStatus: boolean = false, props?: any) { function onClickOpenDialog(editStatus: boolean = false, row?: ResponseObject) {
modal.value = true; modal.value = true;
editRow.value = false; editRow.value = false;
isEdit.value = editStatus;
if (editStatus && props) { if (editStatus && row) {
isEdit.value = editStatus; Object.assign(insigniaData, row);
insigniaData.year = row.year == 0 ? 0 : row.year;
insigniaData.id = props.row.id; insigniaData.dateAnnounce = row.dateAnnounce as Date;
insigniaData.year = props.row.year == 0 ? 0 : props.row.year; insigniaData.refCommandDate = row.refCommandDate as Date;
insigniaData.receiveDate = props.row.receiveDate;
insigniaData.insigniaId = props.row.insigniaId;
insigniaData.insigniaType = props.row.insigniaType;
insigniaData.no = props.row.no;
insigniaData.issue = props.row.issue;
insigniaData.volumeNo = props.row.volumeNo;
insigniaData.volume = props.row.volume;
insigniaData.section = props.row.section;
insigniaData.page = props.row.page;
insigniaData.dateAnnounce =
props.row.dateAnnounce == "-" ? "" : props.row.dateAnnounce;
insigniaData.refCommandNo = props.row.refCommandNo;
insigniaData.refCommandDate =
props.row.refCommandDate == "-" ? null : props.row.refCommandDate;
insigniaData.note = props.note;
} else { } else {
isEdit.value = editStatus;
insigniaData.id = ""; insigniaData.id = "";
insigniaData.year = 0; insigniaData.year = 0;
insigniaData.receiveDate = ""; insigniaData.receiveDate = null;
insigniaData.insigniaId = ""; insigniaData.insigniaId = "";
insigniaData.insigniaType = ""; insigniaData.insigniaType = "";
insigniaData.no = ""; insigniaData.no = "";
@ -689,65 +576,44 @@ async function clickClose() {
}).onOk(async () => { }).onOk(async () => {
modal.value = false; modal.value = false;
editRow.value = false; editRow.value = false;
// next.value = false;
// previous.value = false;
}); });
} else { } else {
modal.value = false; modal.value = false;
// next.value = false;
// previous.value = false;
} }
} }
async function clickHistory(row: RequestItemsObject) { async function clickHistory(row: ResponseObject) {
modalHistory.value = true; modalHistory.value = true;
// showLoader(); filterSearch.value = "";
// await http
// .get(config.API.profileInsignHisId(row.id)) showLoader();
// .then((res) => { try {
// let data = res.data.result; const res = await http.get(config.API.profileNewInsignHisById(row.id));
// rowsHistory.value = []; rowsHistory.value = res.data.result;
// data.map((e: ResponseObject) => { } catch (e) {
// rowsHistory.value.push({ messageError($q, e);
// id: e.id, } finally {
// insignia: e.insignia, hideLoader();
// insigniaId: e.insigniaId, }
// insigniaType: e.insigniaType,
// year: e.year,
// no: e.no,
// issue: e.issue,
// volumeNo: e.volumeNo,
// volume: e.volume,
// section: e.section,
// page: e.page,
// receiveDate: new Date(e.receiveDate),
// dateAnnounce: new Date(e.dateAnnounce),
// refCommandNo: e.refCommandNo,
// refCommandDate:
// e.refCommandDate == null ? null : new Date(e.refCommandDate),
// createdFullName: e.createdFullName,
// createdAt: new Date(e.createdAt),
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// hideLoader();
// });
} }
function onSubmit() { function onSubmit() {
myForm.value.validate().then(async (result: boolean) => { dialogConfirm(
if (result) { $q,
isEdit.value ? await editData() : await saveData(); async () => {
modal.value = false; myForm.value?.validate().then(async (result: boolean) => {
} if (result) {
}); addEditData(isEdit.value);
modal.value = false;
}
});
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
);
} }
function filterSelector(val: any, update: Function, refData: string) { function filterSelector(val: string, update: Function, refData: string) {
switch (refData) { switch (refData) {
case "insigniaOptions": case "insigniaOptions":
update(() => { update(() => {
@ -763,7 +629,7 @@ function filterSelector(val: any, update: Function, refData: string) {
watch( watch(
() => insigniaData.insigniaId, () => insigniaData.insigniaId,
(count: string, prevCount: string) => { () => {
const insigniaTypeFilter = Ops.value.insigniaOptions.filter( const insigniaTypeFilter = Ops.value.insigniaOptions.filter(
(r: DataOptionInsignia) => r.id === insigniaData.insigniaId (r: DataOptionInsignia) => r.id === insigniaData.insigniaId
); );
@ -875,34 +741,24 @@ onMounted(async () => {
class="cursor-pointer" class="cursor-pointer"
:key="col.name" :key="col.name"
:props="props" :props="props"
@click="onClickOpenDialog(true, props)"
> >
<div <div class="table_ellipsis">
v-if="
col.name == 'receiveDate' ||
col.name == 'dateAnnounce' ||
col.name == 'refCommandDate'
"
class="table_ellipsis"
>
{{ col.value == null ? "-" : date2Thai(col.value) }}
</div>
<div v-else-if="col.name == 'year'" class="table_ellipsis">
{{ col.value + 543 }}
</div>
<div v-else-if="col.name == 'insignia'" class="table_ellipsis">
{{
col.value
? (Ops.insigniaOptions.find((r) => r.id === col.value) || {})
.name
: "-"
}}
</div>
<div v-else class="table_ellipsis">
{{ col.value ? col.value : "-" }} {{ col.value ? col.value : "-" }}
</div> </div>
</q-td> </q-td>
<q-td auto-width> <q-td auto-width>
<q-btn
flat
dense
round
class="q-mr-xs"
size="14px"
color="primary"
icon="edit"
@click="onClickOpenDialog(true, props.row)"
>
<q-tooltip>ลบขอม</q-tooltip>
</q-btn>
<q-btn <q-btn
flat flat
dense dense
@ -914,17 +770,19 @@ onMounted(async () => {
> >
<q-tooltip>ประวแกไขเครองราชอสรยาภรณ</q-tooltip> <q-tooltip>ประวแกไขเครองราชอสรยาภรณ</q-tooltip>
</q-btn> </q-btn>
<q-btn <!-- <q-btn
flat flat
dense dense
round round
size="14px" size="14px"
color="red" color="red"
icon="mdi-delete" icon="mdi-delete"
@click="clickDelete(props.row.id)" @click="
dialogRemove($q, async () => await clickDelete(props.row.id))
"
> >
<q-tooltip>ลบขอม</q-tooltip> <q-tooltip>ลบขอม</q-tooltip>
</q-btn> </q-btn> -->
</q-td> </q-td>
</q-tr> </q-tr>
</template> </template>
@ -940,7 +798,7 @@ onMounted(async () => {
round round
color="primary" color="primary"
icon="mdi-pencil-outline" icon="mdi-pencil-outline"
@click="onClickOpenDialog(true, props)" @click="onClickOpenDialog(true, props.row)"
> >
<q-tooltip>แกไขขอม</q-tooltip> <q-tooltip>แกไขขอม</q-tooltip>
</q-btn> </q-btn>
@ -968,32 +826,7 @@ onMounted(async () => {
</q-item-section> </q-item-section>
<q-item-section class="text-dark"> <q-item-section class="text-dark">
<q-item-label <q-item-label>
v-if="
col.name == 'receiveDate' ||
col.name == 'dateAnnounce' ||
col.name == 'refCommandDate'
"
>
{{ col.value ? date2Thai(col.value) : "-" }}
</q-item-label>
<q-item-label v-else-if="col.name == 'year'">
{{ col.value + 543 }}
</q-item-label>
<q-item-label
v-else-if="col.name == 'insignia'"
class="table_ellipsis"
>
{{
col.value
? (
Ops.insigniaOptions.find((r) => r.id === col.value) ||
{}
).name
: "-"
}}
</q-item-label>
<q-item-label v-else>
{{ col.value ? col.value : "-" }} {{ col.value ? col.value : "-" }}
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
@ -1113,7 +946,7 @@ onMounted(async () => {
:label="`${'ชื่อเครื่องราชฯ'}`" :label="`${'ชื่อเครื่องราชฯ'}`"
:options="Ops.insigniaOptions" :options="Ops.insigniaOptions"
:rules="[(val:string) => !!val || `${'กรุณาเลือกชื่อเครื่องราชฯ'}`]" :rules="[(val:string) => !!val || `${'กรุณาเลือกชื่อเครื่องราชฯ'}`]"
@filter="(inputValue:any, @filter="(inputValue:string,
doneFn:Function) => filterSelector(inputValue, doneFn,'insigniaOptions' doneFn:Function) => filterSelector(inputValue, doneFn,'insigniaOptions'
) " ) "
@update:modelValue="() => (editRow = true)" @update:modelValue="() => (editRow = true)"
@ -1289,7 +1122,7 @@ onMounted(async () => {
:model-value=" :model-value="
date2Thai(insigniaData.refCommandDate as Date) date2Thai(insigniaData.refCommandDate as Date)
" "
@clear="insigniaData.refCommandDate = ''" @clear="insigniaData.refCommandDate = null"
@update:modelValue="() => (editRow = true)" @update:modelValue="() => (editRow = true)"
> >
<template v-slot:prepend> <template v-slot:prepend>
@ -1347,21 +1180,7 @@ onMounted(async () => {
<template #columns="props"> <template #columns="props">
<q-tr :props="props"> <q-tr :props="props">
<q-td v-for="col in props.cols" :key="col.name" :props="props"> <q-td v-for="col in props.cols" :key="col.name" :props="props">
<div <div class="table_ellipsis">
v-if="
col.name == 'receiveDate' ||
col.name == 'dateAnnounce' ||
col.name == 'createdAt' ||
col.name == 'refCommandDate'
"
class="table_ellipsis"
>
{{ col.value ? date2Thai(col.value) : "-" }}
</div>
<div v-else-if="col.name == 'year'" class="table_ellipsis">
{{ col.value ? col.value + 543 : "-" }}
</div>
<div v-else class="table_ellipsis">
{{ col.value ? col.value : "-" }} {{ col.value ? col.value : "-" }}
</div> </div>
</q-td> </q-td>

View file

@ -1,40 +1,38 @@
interface DataProps { interface RequestItemsObject {
row: RequestItemsObject; profileId: string;
rowIndex: number; isActive: boolean;
year: number;
no: string;
volume: string;
section: string;
page: string;
receiveDate: Date | null;
insigniaId: string;
dateAnnounce: Date | null;
issue: string;
volumeNo: string;
refCommandDate: Date | null;
refCommandNo: string;
note: string;
} }
//ข้อมูล interface FormData {
interface RequestItemsObject {
id: string; id: string;
insigniaType: string; isActive: boolean;
insignia: string;
insigniaId: string;
year: number; year: number;
receiveDate: Date | null;
insigniaId: string;
insigniaType: string;
no: string; no: string;
issue: string; issue: string;
volumeNo: string; volumeNo: string;
volume: string; volume: string;
section: string; section: string;
page: string; page: string;
receiveDate: Date; dateAnnounce: Date | null;
dateAnnounce: Date|string|null;
refCommandNo: string; refCommandNo: string;
refCommandDate: Date | null|string; refCommandDate: Date | null;
createdFullName: string; note: string;
createdAt: Date;
} }
//columns export type { RequestItemsObject, FormData };
interface Columns {
[index: number]: {
name: String;
align: String;
label: String;
sortable: Boolean;
field: String;
headerStyle: String;
style: String;
};
}
export type { RequestItemsObject, Columns, DataProps };

View file

@ -1,22 +1,58 @@
//ข้อมูล
interface ResponseObject { interface ResponseObject {
id: string; id: string;
insigniaType: string; createdAt: string;
insignia: string; createdUserId: Date | string;
insigniaId: string; lastUpdatedAt: Date | string;
lastUpdateUserId: string;
createdFullName: string;
lastUpdateFullName: string;
profileId: string;
isActive: boolean;
year: number; year: number;
no: string; no: string;
issue: string;
volumeNo: string;
volume: string; volume: string;
section: string; section: string;
page: string; page: string;
receiveDate: Date; receiveDate: Date | string;
dateAnnounce: Date; insigniaId: string;
insignia: ResponseInsigniaObject;
dateAnnounce: Date | string;
issue: string;
volumeNo: string;
refCommandDate: Date | string;
refCommandNo: string; refCommandNo: string;
refCommandDate: Date | null; note: string;
createdFullName: string;
createdAt: Date; insigniaName?: string
} }
export type { ResponseObject }; interface ResponseInsigniaObject {
createdAt: Date;
createdFullName: string;
createdUserId: string;
id: string;
insigniaType: ResponseInsigniaType;
insigniaTypeId: string;
isActive: boolean;
lastUpdateFullName: string;
lastUpdateUserId: string;
lastUpdatedAt: Date;
level: null;
name: string;
note: string;
shortName: string;
}
interface ResponseInsigniaType {
createdAt: Date;
createdFullName: string;
createdUserId: string;
id: string;
isActive: boolean;
lastUpdateFullName: string;
lastUpdateUserId: string;
lastUpdatedAt: Date;
name: string;
}
export type { ResponseObject, ResponseInsigniaObject, ResponseInsigniaType };

View file

@ -1 +1,13 @@
export type {}; interface ResponseObject {
id: string
name: string
shortName: string
insigniaTypeName: string
createdAt: Date
lastUpdatedAt: Date
lastUpdateFullName: string
isActive: boolean
note: string
}
export type {ResponseObject};