แก้ไขเอา columns ใส่ store

src/modules/11_discipline/components/3_InvestigateDisciplinary/AddPage.vue

@@ -3,109 +3,40 @@ import { ref, onMounted } from "vue";
 import { useQuasar, QForm } from "quasar";
 import { useRouter, useRoute } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
-import type { QTableProps } from "quasar";
-import http from "@/plugins/http";
-import config from "@/app.config";
 import Dialogbody from "@/modules/11_discipline/components/3_InvestigateDisciplinary/Dialogbody.vue";
 import Table from "@/modules/11_discipline/components/3_InvestigateDisciplinary/DirectorTable.vue";
 import { useInvestigateDisStore } from "@/modules/11_discipline/store/InvestigateDisStore";
-import type { directorType } from "@/modules/11_discipline/interface/index/Main";
 
 const investigateDis = useInvestigateDisStore();
 const { fecthDirector } = investigateDis;
 
-const visibleColumns = ref<String[]>([
-  "no",
-  "name",
-  "position",
-  "duty",
-  "email",
-  "telephone",
-]);
-const columns = ref<QTableProps["columns"]>([
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: false,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "name",
-    align: "left",
-    label: "ชื่อ - นามสกุล",
-    sortable: true,
-    field: "name",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "position",
-    align: "left",
-    label: "ตำแหน่ง",
-    sortable: true,
-    field: "position",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "duty",
-    align: "left",
-    label: "หน้าที่",
-    sortable: true,
-    field: "duty",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "email",
-    align: "left",
-    label: "อีเมล",
-    sortable: true,
-    field: "email",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "telephone",
-    align: "left",
-    label: "เบอร์โทรศัพท์",
-    sortable: true,
-    field: "telephone",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
-
 onMounted(async () => {
-  await fecthInvestigateDisDirector();
+  await fecthDirector([
+    {
+      nameDirector: "นาง เกสินี เจียรสุมัย",
+      position: "ครู",
+      duty: "ประธาน",
+      email: "e@email.com",
+      telephone: "0800808080",
+    },
+    {
+      nameDirector: "นาย สรวิชญ์ พลสิทธิ์",
+      position: "ทดลองงาน",
+      duty: "เลขานุการ",
+      email: "g@gmail.com",
+      telephone: "0614565145",
+    },
+  ]);
   await hideLoader();
 });
-const selected = ref<directorType[]>([]);
-
-const clickAdd = () => {
-  console.log("clickadd");
-};
 
 const popup = () => {
   modal.value = true;
   filterKeyword2.value = "";
-  fecthInvestigateDisDirector();
 };
 
 const mixin = useCounterMixin();
-const {
+const { date2Thai, hideLoader } = mixin;
-  date2Thai,
-  dateToISO,
-  messageError,
-  showLoader,
-  hideLoader,
-  dialogConfirm,
-  success,
-  dialogMessageNotify,
-} = mixin;
 
 const initialPagination = ref<any>({
   rowsPerPage: 0,
@@ -126,7 +57,6 @@ const filterKeyword2 = ref<string>("");
 const typefault = ref<string>("");
 const faultLevel = ref<string>("");
 const type = ref<string>("");
-const rows2 = ref<any[]>([]);
 const Complaint = ref<string>("");
 const trueDetail = ref<string>("");
 const evidence = ref<string>("");
@@ -149,26 +79,6 @@ const clickClose = () => {
   modal.value = false;
 };
 
-onMounted(async () => {});
-function fecthInvestigateDisDirector() {
-  const data = [
-    {
-      nameDirector: "นาง เกสินี เจียรสุมัย",
-      position: "ครู",
-      duty: "ประธาน",
-      email: "e@email.com",
-      telephone: "0800808080",
-    },
-    {
-      nameDirector: "นาย สรวิชญ์ พลสิทธิ์",
-      position: "ทดลองงาน",
-      duty: "เลขานุการ",
-      email: "g@gmail.com",
-      telephone: "0614565145",
-    },
-  ];
-  fecthDirector(data); // ส่งข้อมูลไป stores
-}
 // เรียกข้อมูลของรอบการเสนอขอ
 
 const filter = ref<string>(""); //search data table
@@ -179,63 +89,12 @@ const fileUploadDoc = async (files: any) => {
   });
 };
 
-// แก้ไขข้อมูล
-
 // คลิกบันทึก
-const checkSave = () => {
+const checkSave = () => {};
-  //   if (myForm.value !== null) {
-  //     myForm.value.validate().then(async (success) => {
-  //       if (success) {
-  //         dialogConfirm($q, () => SaveData());
-  //       } else if (Number(datelast.value) !== 0) {
-  //         dialogMessageNotify($q, "กรุณาเลือกรอบการเสนอขอพระราชทานเครื่องราชฯ");
-  //       }
-  //     });
-  //   }
-};
 
 const deleteData = async (id: string) => {
   console.log("delete");
 };
-// บันทึกข้อมูล
-const SaveData = async () => {
-  //   if (edit.value) {
-  //     await editData(id.value);
-  //   } else {
-  //     await addData();
-  //     clickBack();
-  //   }
-};
-// เพิ่มข้อมูลรอบการเสนอขอพระราชทานเครื่องราชฯ
-const addData = async () => {
-  //   const formData = new FormData();
-  //   const name = `รอบการเสนอขอพระราชทานเครื่องราชรอบที่ ${
-  //     roundInsig.value.value
-  //   }  ปี ${yearly.value + 543} `;
-  //   formData.append("name", name);
-  //   formData.append("year", yearly.value.toString());
-  //   formData.append("amount", datelast.value.toString());
-  //   formData.append("round", roundInsig.value.value);
-  //   if (dateInvestigate.value !== null) {
-  //     formData.append("startDate", dateToISO(dateInvestigate.value));
-  //   }
-  //   if (dateAllegation.value !== null) {
-  //     formData.append("endDate", dateToISO(dateAllegation.value));
-  //   }
-  //   formData.append("file", files.value);
-  //   showLoader();
-  //   await http
-  //     .post(config.API.listRoundInsignia(), formData)
-  //     .then(() => {
-  //       success($q, "บันทึกข้อมูลสำเร็จ");
-  //     })
-  //     .catch((e) => {
-  //       messageError($q, e);
-  //     })
-  //     .finally(async () => {
-  //       hideLoader();
-  //     });
-};
 
 const clickBack = () => {
   router.push(`/discipline/disciplinary`);
@@ -254,7 +113,7 @@ const clickBack = () => {
         class="q-mr-sm"
         @click="clickBack"
       />
-      {{ edit ? "การสอบสวนความผิดทางวินัย" : "เพิ่มการสอบสวนความผิดทางวินัย" }}
+      {{ "เพิ่มการสอบสวนความผิดทางวินัย" }}
     </div>
     <q-form ref="myForm">
       <div class="col-12">
@@ -413,11 +272,11 @@ const clickBack = () => {
                   <Table
                     style="max-height: 80vh"
                     :rows="rows"
-                    :columns="columns"
+                    :columns="investigateDis.columnsDirector"
                     :filter="filter"
-                    :visible-columns="visibleColumns"
+                    :visible-columns="investigateDis.visibleColumnsDirector"
                     v-model:inputfilter="filter"
-                    v-model:inputvisible="visibleColumns"
+                    v-model:inputvisible="investigateDis.visibleColumnsDirector"
                     :pagination="initialPagination"
                     :nornmalData="true"
                     :paging="true"

src/modules/11_discipline/store/InvestigateDisStore.ts

@@ -192,6 +192,71 @@ export const useInvestigateDisStore = defineStore(
         style: "font-size: 14px",
       },
     ]);
+
+    const visibleColumnsDirector = ref<String[]>([
+      "no",
+      "name",
+      "position",
+      "duty",
+      "email",
+      "telephone",
+    ]);
+    const columnsDirector = ref<QTableProps["columns"]>([
+      {
+        name: "no",
+        align: "left",
+        label: "ลำดับ",
+        sortable: false,
+        field: "no",
+        headerStyle: "font-size: 14px",
+        style: "font-size: 14px",
+      },
+      {
+        name: "name",
+        align: "left",
+        label: "ชื่อ - นามสกุล",
+        sortable: true,
+        field: "name",
+        headerStyle: "font-size: 14px",
+        style: "font-size: 14px",
+      },
+      {
+        name: "position",
+        align: "left",
+        label: "ตำแหน่ง",
+        sortable: true,
+        field: "position",
+        headerStyle: "font-size: 14px",
+        style: "font-size: 14px",
+      },
+      {
+        name: "duty",
+        align: "left",
+        label: "หน้าที่",
+        sortable: true,
+        field: "duty",
+        headerStyle: "font-size: 14px",
+        style: "font-size: 14px",
+      },
+      {
+        name: "email",
+        align: "left",
+        label: "อีเมล",
+        sortable: true,
+        field: "email",
+        headerStyle: "font-size: 14px",
+        style: "font-size: 14px",
+      },
+      {
+        name: "telephone",
+        align: "left",
+        label: "เบอร์โทรศัพท์",
+        sortable: true,
+        field: "telephone",
+        headerStyle: "font-size: 14px",
+        style: "font-size: 14px",
+      },
+    ]);
     return {
       fecthList,
       rows,
@@ -201,6 +266,8 @@ export const useInvestigateDisStore = defineStore(
       fecthDirector,
       visibleColumns,
       columns,
+      visibleColumnsDirector,
+      columnsDirector,
     };
   }
 );