API สร้างโครงสร้าง

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-01-30 14:18:44 +07:00
parent cf69df74ac
commit f236159522
5 changed files with 338 additions and 265 deletions

View file

@ -1,5 +1,8 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { ref, onMounted, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
/** importType*/
import type { DataActive } from "@/modules/02_organizationalNew/interface/response/organizational";
@ -7,158 +10,59 @@ import type { DataActive } from "@/modules/02_organizationalNew/interface/respon
import TreeView from "@/modules/02_organizationalNew/components/mainTree.vue";
import TableView from "@/modules/02_organizationalNew/components/tableTree.vue";
import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
import { useCounterMixin } from "@/stores/mixin";
const store = useOrganizational();
const $q = useQuasar();
const { showLoader, hideLoader, messageError } = useCounterMixin();
const showData = ref<boolean>(false);
const nodeTree = ref<any>();
// defineProps<{ dataActive: DataActive }>();
async function fetchDataTree() {
const data = [
{
organizationName: "สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร",
organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx01",
organizationLevel: 0,
lazy: true,
},
{
organizationName: "สำนักปลัดกรุงเทพมหานคร",
organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx02",
organizationLevel: 0,
lazy: true,
},
];
// const data = [
// {
// orgRootId: "00000000-0000-0000-0000-000000000000",
// orgLevel: 0,
// orgRootName: "",
// orgRootShortName: "..",
// orgRootCode: "04",
// orgCode: "0400",
// orgRootOrder: 1,
// orgRootPhoneEx: "0849562355",
// orgRootPhoneIn: "0845124512",
// orgRootFax: "021576452",
// orgRevisionId: "00000000-0000-0000-0000-000000000000",
// orgChild1: [
// {
// orgChild1Id: "00000000-0000-0000-0000-000000000000",
// orgLevel: 1,
// orgChild1Name: "",
// orgChild1ShortName: "..",
// orgChild1Code: "01",
// orgCode: "0401",
// orgChild1Order: 1,
// orgRootCode: "04",
// orgChild1PhoneEx: "0849562355",
// orgChild1PhoneIn: "0845124512",
// orgChild1Fax: "021576452",
// orgRevisionId: "00000000-0000-0000-0000-000000000000",
// orgChild2: [
// {
// orgChild2Id: "00000000-0000-0000-0000-000000000000",
// orgLevel: 2,
// orgChild2Name: "",
// orgChild2ShortName: "..",
// orgChild2Code: "01",
// orgCode: "0401",
// orgChild2Order: 1,
// orgRootCode: "04",
// orgChild2PhoneEx: "0849562355",
// orgChild2PhoneIn: "0845124512",
// orgChild2Fax: "021576452",
// orgRevisionId: "00000000-0000-0000-0000-000000000000",
// orgChild3: [
// {
// orgChild3Id: "00000000-0000-0000-0000-000000000000",
// orgLevel: 3,
// orgChild3Name: "",
// orgChild3ShortName: "..",
// orgChild3Code: "01",
// orgCode: "0401",
// orgChild3Order: 1,
// orgRootCode: "04",
// orgChild3PhoneEx: "0849562355",
// orgChild3PhoneIn: "0845124512",
// orgChild3Fax: "021576452",
// orgRevisionId: "00000000-0000-0000-0000-000000000000",
// lazy: true,
// orgChild4: [
// {
// orgChild4Id: "00000000-0000-0000-0000-000000000000",
// orgLevel: 4,
// orgChild4Name: "",
// orgChild4ShortName: "..",
// orgChild4Code: "01",
// orgCode: "0401",
// orgChild4Order: 1,
// orgChild4PhoneEx: "0849562355",
// orgChild4PhoneIn: "0845124512",
// orgChild4Fax: "021576452",
// orgRevisionId: "00000000-0000-0000-0000-000000000000",
// lazy: true,
// orgRootCode: "04",
// },
// ],
// },
// ],
// },
// ],
// },
// ],
// },
// {
// orgRootId: "00000000-0000-0000-0000-000000000001",
// orgLevel: 0,
// orgRootName: "2",
// orgRootShortName: "..",
// orgRootCode: "04",
// orgCode: "0400",
// orgRootOrder: 1,
// orgRootPhoneEx: "0849562355",
// orgRootPhoneIn: "0845124512",
// orgRootFax: "021576452",
// orgRevisionId: "00000000-0000-0000-0000-000000000000",
// orgChild1: [
// {
// orgChild1Id: "00000000-0000-0000-0000-000000000000",
// orgLevel: 1,
// orgChild1Name: "2",
// orgChild1ShortName: "..",
// orgChild1Code: "01",
// orgCode: "0401",
// orgChild1Order: 1,
// orgRootCode: "04",
// orgChild1PhoneEx: "0849562355",
// orgChild1PhoneIn: "0845124512",
// orgChild1Fax: "021576452",
// orgRevisionId: "00000000-0000-0000-0000-000000000000",
// orgChild2: [],
// },
// ],
// },
// ];
nodeTree.value = data;
console.log(nodeTree.value);
showLoader();
const id =
store.typeOrganizational === "current" ? store.activeId : store.draftId;
id &&
(await http
.get(config.API.orgByid(id.toString()))
.then((res) => {
const data = res.data.result;
nodeTree.value = data;
console.log(res);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
}));
// console.log(nodeTree.value);
}
onMounted(() => {
fetchDataTree();
onMounted(async () => {
await fetchDataTree();
});
watch(
() => store.typeOrganizational,
() => {
fetchDataTree();
}
);
</script>
<template>
<div class="col-12">
<q-card bordered class="col-12 row caedNone">
<div class="col-xs-12 col-sm-3 row">
<div class="col-12 row no-wrap bg-grey-1">
<TreeView v-model:nodeTree="nodeTree" />
<TreeView
v-model:nodeTree="nodeTree"
:fetchDataTree="fetchDataTree"
/>
<div class="col-12 row">
<q-separator :vertical="!$q.screen.lt.md" />