hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

API เครื่องราช

Browse source
This commit is contained in:
oat 2024-01-26 16:32:52 +07:00
parent 0dd2915db7
commit 8cd40e69aa
5 changed files with 183 additions and 156 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/api/manage/api.insignia.ts
View file

@ -32,4 +32,7 @@ export default {
// listInsigniaHistoryId: (id: string) => `${insignia}history/${id}`,
// listInsigniaPublished: `${insignia}history/published`,
// listInsigniaPublishedHistory: `${insignia}history/published-history`,
insigniaTypeNew: `${insigniaType}draft`,
insigniaTypeNewId: (id: string) => `${insigniaType}${id}`,
insigniaNewId: (id: string) => `${insignia}${id}`,
};

137
src/modules/01_metadataNew/components/insignia/InsigniaDetail.vue
View file

@ -2,118 +2,45 @@
import { ref, onMounted } from "vue";
import { useRouter, useRoute } from "vue-router";
import InsigniaList from "@/modules/01_metadataNew/components/insignia/InsigniaList.vue";
const router = useRouter();
const route = useRoute();
const nameType = ref<string>("");
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
import { useQuasar } from "quasar";
import { useInsigniaDataStore } from "@/modules/01_metadataNew/stores/InsigniaStore";
import type {
DetailResponse,
DetailRow,
} from "@/modules/01_metadataNew/interface/response/insignia/Insignia";
const nameType = ref<string>("");
const router = useRouter();
const route = useRoute();
const $q = useQuasar();
const store = useInsigniaDataStore();
const row = ref<DetailRow[]>();
const mixin = useCounterMixin();
const { date2Thai } = mixin;
const { date2Thai, messageError, hideLoader, showLoader } = mixin;
const id = ref<string>(route.params.id.toString());
function fetchName(name: string) {
nameType.value = name;
const insigniaTypeId = ref<string>("");
async function fetchData(id: string) {
showLoader();
await http
.get(config.API.insigniaTypeNewId(id))
.then(async (res) => {
insigniaTypeId.value = res.data.result.name;
store.fetchData(res.data.result.insignias, res.data.result.name);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
const data = ref<DetailResponse[]>([
{
id: "1",
level: 1,
shortName: "จ.ม.",
insigniaType: "ชั้นต่ำกว่าสายสะพาย",
insigniaTypeId: "1",
note: "-",
name: "จัตุรถาภรณ์มงกุฎไทย",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
isActive: true,
},
{
id: "2",
level: 1,
shortName: "จ.ช.",
insigniaType: "ชั้นต่ำกว่าสายสะพาย",
insigniaTypeId: "1",
note: "-",
name: "จัตุรถาภรณ์ช้างเผือก",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
isActive: false,
},
{
id: "1",
level: 1,
shortName: "บ.ม.",
insigniaType: "ชั้นสายสะพาย",
insigniaTypeId: "2",
note: "-",
name: "เบญจมาภรณ์มงกุฎไทย",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
isActive: true,
},
{
id: "2",
level: 1,
shortName: "ท.ม.",
insigniaType: "ชั้นสายสะพาย",
insigniaTypeId: "2",
note: "-",
name: "ทวีติยาภรณ์มงกุฎไทย",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
isActive: true,
},
{
id: "1",
level: 1,
shortName: "บ.ช.",
insigniaType: "เหรียญบำเหน็จในราชการ",
insigniaTypeId: "3",
note: "-",
name: "เบญจมาภรณ์ช้างเผือก",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "สาวิตรี ศรีสมัย",
isActive: true,
},
{
id: "2",
level: 1,
shortName: "ท.ม.",
insigniaType: "เหรียญบำเหน็จในราชการ",
insigniaTypeId: "3",
note: "-",
name: "ทวีติยาภรณ์มงกุฎไทย",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
isActive: true,
},
]);
function fetchData() {
const datafilter = data.value.find((e) => e.insigniaTypeId === id.value);
console.log(datafilter);
datafilter && fetchName(datafilter.insigniaType);
const list = data.value.map((e) => ({
...e,
createdAt: e.createdAt ? date2Thai(e.createdAt) : "",
lastUpdatedAt: e.lastUpdatedAt ? date2Thai(e.lastUpdatedAt) : "",
}));
row.value = list.filter((e) => e.insigniaTypeId === id.value);
}
onMounted(() => {
fetchData();
onMounted(async () => {
fetchData(id.value);
});
</script>
<template>
@ -128,15 +55,11 @@ onMounted(() => {
class="q-mr-sm"
@click="router.go(-1)"
/>
รายละเอียดข้อมูลเครื่องราชอิสริยาภรณ์ {{ nameType }}
รายการข้อมูลเครื่องราชอิสริยาภรณ์ {{ insigniaTypeId }}
</div>
<q-card flat bordered>
<InsigniaList
:data="row"
@update:fetchName="fetchName"
:nameType="nameType"
/>
<InsigniaList :data="row" />
</q-card>
</template>

102
src/modules/01_metadataNew/components/insignia/InsigniaList.vue
View file

@ -2,13 +2,23 @@
import { ref, onMounted } from "vue";
import type { QTableProps } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useRouter } from "vue-router";
import { useRouter, useRoute } from "vue-router";
import { useInsigniaDataStore } from "@/modules/01_metadataNew/stores/InsigniaStore";
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
const store = useInsigniaDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { date2Thai, dialogRemove, dialogConfirm } = mixin;
const {
date2Thai,
dialogRemove,
dialogConfirm,
showLoader,
hideLoader,
messageError,
} = mixin;
const $q = useQuasar();
const columns = ref<QTableProps["columns"]>([
{
@ -119,7 +129,8 @@ const columns = ref<QTableProps["columns"]>([
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const route = useRoute();
const id = ref<string>(route.params.id.toString());
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const isActive = ref<boolean>(false);
@ -130,6 +141,7 @@ const insigniaTypeId = ref<string>("");
const nameRef = ref<any>(null);
const shortNameRef = ref<any>(null);
const dialogStatus = ref<string>("");
const editId = ref<string>("");
const visibleColumns = ref<string[]>([
"level",
"name",
@ -142,11 +154,6 @@ const visibleColumns = ref<string[]>([
"note",
]);
const props = defineProps({
data: { type: Object },
nameType: { type: String },
});
function closeDialog() {
dialog.value = false;
}
@ -157,21 +164,78 @@ function validateForm() {
onSubmit();
}
async function fetchData(id: string) {
showLoader();
await http
.get(config.API.insigniaTypeNewId(id))
.then(async (res) => {
insigniaTypeId.value = res.data.result.name;
store.fetchData(res.data.result.insignias, res.data.result.name);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
onMounted(async () => {
fetchData(id.value);
console.log(id.value);
});
async function onSubmit() {
if (name.value.length > 0 && shortName.value.length > 0) {
dialogConfirm(
$q,
async () => {
console.log("สำเร็จ");
dialogStatus.value === "create" ? addData() : editData(editId.value);
closeDialog();
name.value = "";
shortName.value = "";
isActive.value = false;
note.value = "";
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
);
}
}
async function addData() {
await http.post(config.API.insignia, {
name: name.value,
isActive: isActive.value,
shortName: shortName.value,
note: note.value == "" ? "-" : "",
insigniaTypeId: id.value,
});
fetchData(id.value);
}
async function editData(idData: string) {
await http.put(config.API.insigniaNewId(idData), {
name: name.value,
isActive: isActive.value,
shortName: shortName.value,
note: note.value == "" ? "-" : "",
insigniaTypeId: id.value,
});
fetchData(id.value);
}
async function deleteData(idData: string) {
await http.delete(config.API.insigniaNewId(idData));
fetchData(id.value);
}
import { defineEmits } from "vue";
const emit = defineEmits(["nameType"]);
const nameType = () => {
emit("nameType", insigniaTypeId.value);
};
</script>
<template>
@ -214,7 +278,7 @@ async function onSubmit() {
<d-table
ref="table"
:columns="columns"
:rows="props.data"
:rows="store.row"
:filter="filterKeyword"
row-key="name"
flat
@ -272,6 +336,11 @@ async function onSubmit() {
() => {
dialogStatus = 'edit';
dialog = true;
editId = props.row.id;
name = props.row.name;
shortName = props.row.shortName;
note = props.row.note;
isActive = props.row.isActive;
}
"
>
@ -284,7 +353,12 @@ async function onSubmit() {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -315,7 +389,7 @@ async function onSubmit() {
<q-card-section class="q-pa-none">
<q-input
outlined
:model-value="nameType"
:model-value="insigniaTypeId"
label="ลำดับชั้นเครื่องราชฯ"
dense
lazy-rules
@ -328,7 +402,7 @@ async function onSubmit() {
ref="nameRef"
outlined
v-model="name"
label="ชื่อเครื่องราช"
label="ชื่อเครื่องราชฯ"
dense
lazy-rules
borderless

90
src/modules/01_metadataNew/components/insignia/InsigniaType.vue
View file

@ -6,11 +6,20 @@ import { useRouter } from "vue-router";
import { useInsigniaDataStore } from "@/modules/01_metadataNew/stores/InsigniaStore";
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
const store = useInsigniaDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const {
dialogRemove,
dialogConfirm,
success,
messageError,
showLoader,
hideLoader,
} = mixin;
const columns = ref<QTableProps["columns"]>([
{
name: "name",
@ -71,6 +80,7 @@ const columns = ref<QTableProps["columns"]>([
const $q = useQuasar();
const editId = ref<string>("");
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const isActive = ref<boolean>(false);
@ -87,34 +97,20 @@ const visibleColumns = ref<string[]>([
// const row = ref([]);
function fetchData() {
const data = [
{
id: "1",
name: "ชั้นต่ำกว่าสายสะพาย",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "สาวิตรี ศรีสมัย",
isActive: true,
},
{
id: "2",
name: "ชั้นสายสะพาย",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
isActive: false,
},
{
id: "3",
name: "เหรียญบำเหน็จในราชการ",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
isActive: false,
},
];
store.fetchData(data);
async function fetchData() {
showLoader();
await http
.get(config.API.insigniaTypeNew)
.then(async (res) => {
console.log(res.data.result);
store.fetchData(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
onMounted(async () => {
@ -129,6 +125,27 @@ function onclickDetail(id: string) {
router.push(`/master-data/insignia/detail/${id}`);
}
async function addData() {
await http.post(config.API.insigniaType, {
name: name.value,
isActive: isActive.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.insigniaTypeNewId(id), {
name: name.value,
isActive: isActive.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.insigniaTypeNewId(id));
fetchData();
}
function validateForm() {
nameRef.value.validate();
onSubmit();
@ -139,9 +156,10 @@ async function onSubmit() {
dialogConfirm(
$q,
async () => {
console.log("สำเร็จ");
dialogStatus.value === "create" ? addData() : editData(editId.value);
closeDialog();
name.value = "";
isActive.value = false;
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
@ -246,6 +264,9 @@ async function onSubmit() {
() => {
dialogStatus = 'edit';
dialog = true;
editId = props.row.id;
name = props.row.name;
isActive = props.row.isActive;
}
"
>
@ -258,7 +279,12 @@ async function onSubmit() {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -280,7 +306,7 @@ async function onSubmit() {
<form @submit.prevent="validateForm">
<q-card-section class="flex justify-between" style="padding: 0">
<dialog-header
:tittle="dialogStatus == 'edit' ? 'แก้ไขข้อมูล' : 'เพิ่มข้อมูล'"
:tittle="dialogStatus === 'edit' ? 'แก้ไขข้อมูล' : 'เพิ่มข้อมูล'"
:close="closeDialog"
/>
</q-card-section>

7
src/modules/01_metadataNew/stores/InsigniaStore.ts
View file

@ -10,14 +10,15 @@ const { date2Thai } = useCounterMixin();
export const useInsigniaDataStore = defineStore("insigniaData", () => {
const row = ref<DataRow[]>();
function fetchData(data: DataResponse[]) {
console.log(data);
const name1 = ref<string>("");
function fetchData(data: DataResponse[], insigniaType?: string) {
const list = data.map((e) => ({
...e,
insigniaType: insigniaType,
createdAt: e.createdAt ? date2Thai(e.createdAt) : "",
lastUpdatedAt: e.lastUpdatedAt ? date2Thai(e.lastUpdatedAt) : "",
}));
console.log(list);
console.log("test");
row.value = list;
}