From cdf697e761bd50f9df4dc507d49219163e3f03e4 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 25 Aug 2023 14:27:34 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A=20ui=20?=
 =?UTF-8?q?=E0=B8=9A=E0=B8=B1=E0=B8=99=E0=B8=97=E0=B8=B6=E0=B8=81=E0=B8=9C?=
 =?UTF-8?q?=E0=B8=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/3_result/DialogForm.vue        |  14 +-
 src/modules/07_insignia/storeResult.ts        |  58 +++++-
 src/modules/07_insignia/views/ResultPage.vue  | 194 ++++++++++--------
 src/modules/10_order/components/Detail.vue    |   2 -
 4 files changed, 167 insertions(+), 101 deletions(-)

diff --git a/src/modules/07_insignia/components/3_result/DialogForm.vue b/src/modules/07_insignia/components/3_result/DialogForm.vue
index 269c3d687..c58e12f63 100644
--- a/src/modules/07_insignia/components/3_result/DialogForm.vue
+++ b/src/modules/07_insignia/components/3_result/DialogForm.vue
@@ -340,6 +340,7 @@ const searchcardid = () => {
                 v-model="employeeClass"
                 :label="`ขรก.สามัญ/ลูกจ้างประจำ`"
                 @update:model-value="selectType"
+                :disable="status !== ''"
               />
             </div>
             <div class="col-12 text-weight-bold text-grey">
@@ -347,7 +348,7 @@ const searchcardid = () => {
             </div>
             <div class="col-xs-12 col-sm-4">
               <q-input
-                :disable="disbleStatus || status == 'DONE'"
+                :disable="disbleStatus || status == 'DONE' ||  status == 'PENDING'"
                 hide-bottom-space
                 outlined
                 class="inputgreen"
@@ -549,7 +550,9 @@ const searchcardid = () => {
             </div>
             <div class="col-xs-12 col-sm-6">
               <q-input
-                :disable="disbleStatus || status == 'DONE'"
+                :disable="
+                  disbleStatus || status == 'DONE' || status == 'PENDING'
+                "
                 :rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
                 hide-bottom-space
                 dense
@@ -575,7 +578,9 @@ const searchcardid = () => {
             </div>
             <div class="col-xs-12 col-sm-6">
               <q-input
-                :disable="disbleStatus || status == 'DONE'"
+                :disable="
+                  disbleStatus || status == 'DONE' || status == 'PENDING'
+                "
                 :rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
                 hide-bottom-space
                 dense
@@ -794,7 +799,6 @@ const searchcardid = () => {
                 <template #trigger>
                   <q-input
                     :disable="disbleStatus"
-                    :rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
                     dense
                     borderless
                     outlined
@@ -833,13 +837,11 @@ const searchcardid = () => {
                 map-options
                 v-model="payment"
                 :label="`เลือกรูปแบบการจ่าย`"
-                :rules="[(val) => !!val || 'เลือกรูปแบบการจ่าย']"
               />
             </div>
             <div v-if="payment === 'จัดส่งทางไปรษณี'" class="col-12">
               <q-input
                 :disable="disbleStatus"
-                :rules="[(val) => !!val || 'กรุณากรอกที่อยู่ที่จ่าย']"
                 label="ที่อยู่ที่จ่าย"
                 class="bg-white"
                 dense
diff --git a/src/modules/07_insignia/storeResult.ts b/src/modules/07_insignia/storeResult.ts
index d02a4c94a..1bebf583c 100644
--- a/src/modules/07_insignia/storeResult.ts
+++ b/src/modules/07_insignia/storeResult.ts
@@ -1,27 +1,76 @@
 import { defineStore } from "pinia";
 import { ref, } from "vue";
+import { useCounterMixin } from "@/stores/mixin";
 
-
+const mixin = useCounterMixin();
+const {
+  date2Thai,
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+} = mixin;
 
 export const useResultDataStore = defineStore("insigniaResult", () => {
   const insignia = ref<string>('')
   const insigniaOp = ref<any[]>([{ name: "ทั้งหมด", id: "" }])
   const insigniaOp2 = ref<any[]>([])
   const insigniaType = ref<any>()
+  const invoiceType = ref<string>('all')
+  const invoiceTypeop = ref<any>([{ name: "ทั้งหมด", id: "all" }, { name: "ใบกำกับที่ค้างจ่าย", id: "noDate" }, { name: "ใบกำกับที่จ่ายแล้ว", id: "haveDate" }])
+  const rows = ref<any>([])
+  const listInsignia = ref<any>([])
 
 
   const fetchDatainsignia = async (data: any) => {
+    insignia.value = ''
+    invoiceType.value = 'all'
     data.forEach((e: any) => {
       insigniaOp.value.push({ name: e.name, id: e.id })
     });
     data.forEach((e: any) => {
       insigniaOp2.value.push({ name: e.name, id: e.id })
     });
-
   }
   const fetchDatainsigniaType = async (data: any) => {
     insigniaType.value = data.map((e: any) => ({ name: e.id, label: e.name }))
   }
+  const fetchlistinsignia = async (data: any) => {
+    rows.value = [];
+    let alllist = await data.map((e: any) => ({
+      id: e.id,
+      citizenId: e.citizenId,
+      prefix: e.prefix,
+      position: e.position,
+      status: status(e.status),
+      dateReceive: date2Thai(e.dateReceive),
+      name: e.fullName,
+      type: e.requestInsignia,
+      employeeType: profileType(e.profileType),
+      profileType: e.profileType,
+      page: e.page,
+      number: e.no,
+      vatnumber: e.number,
+      datepay: date2Thai(e.datePayment),
+      typepay: e.typePayment,
+      address: e.address,
+    }));
+    rows.value = alllist
+    listInsignia.value = alllist
+    selectInvoice(invoiceType.value)
+
+  }
+  const selectInvoice = (invoice: string) => {
+    console.log(invoice);
+    if (invoice === "noDate") {
+      let list = listInsignia.value.filter((e: any) => e.datepay === null)
+      rows.value = list
+    } else if (invoice === "haveDate") {
+      let list = listInsignia.value.filter((e: any) => e.datepay !== null)
+      rows.value = list
+    } else rows.value = listInsignia.value
+  }
   const status = (val: string) => {
     switch (val) {
       case "PENDING":
@@ -43,13 +92,18 @@ export const useResultDataStore = defineStore("insigniaResult", () => {
     }
   }
   return {
+    rows,
     insignia,
     insigniaOp,
     insigniaOp2,
     insigniaType,
+    invoiceType,
+    invoiceTypeop,
     fetchDatainsignia,
     fetchDatainsigniaType,
     status,
     profileType,
+    fetchlistinsignia,
+    selectInvoice,
   };
 });
diff --git a/src/modules/07_insignia/views/ResultPage.vue b/src/modules/07_insignia/views/ResultPage.vue
index 572138b01..09e6b6f11 100644
--- a/src/modules/07_insignia/views/ResultPage.vue
+++ b/src/modules/07_insignia/views/ResultPage.vue
@@ -45,6 +45,8 @@ const fecthRound = async () => {
     .get(config.API.noteround())
     .then((res) => {
       let data = res.data.result;
+      // console.log(data);
+
       selectRoundOption.value = data;
       selectRound.value = data[0].id;
       // console.log(selectRound.value);
@@ -57,7 +59,7 @@ const fecthInsignia = async () => {
   await http
     .get(config.API.insignia)
     .then((res) => {
-      // console.log(res);
+      console.log(res);
       let data = res.data.result;
       DataStore.fetchDatainsignia(data);
     })
@@ -80,8 +82,10 @@ const fecthInsigniaType = async () => {
 const visibleColumns = ref<String[]>([
   "no",
   "status",
+  "citizenId",
   "name",
   "type",
+  "dateReceive",
   "employeeType",
   "page",
   "number",
@@ -101,6 +105,7 @@ const columns = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+
   {
     name: "status",
     align: "left",
@@ -110,6 +115,15 @@ const columns = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "citizenId",
+    align: "left",
+    label: "เลขบัตรประชาชน",
+    field: "citizenId",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "name",
     align: "left",
@@ -122,12 +136,21 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "type",
     align: "left",
-    label: "ประเภทเครื่องราชฯ",
+    label: "เครื่องราชฯ",
     field: "type",
     sortable: true,
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "dateReceive",
+    align: "left",
+    label: "วันที่ได้รับพระราชทาน",
+    field: "dateReceive",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "employeeType",
     align: "left",
@@ -198,24 +221,7 @@ const columns = ref<QTableProps["columns"]>([
     field: "",
   },
 ]);
-const rows = ref<any>([
-  // {
-  //   no: "1",
-  //   status: "รอบันทึกข้อมูล",
-  //   name: "นางสาวรัชภรณ์ ภักดี",
-  //   type: "ทั้งหมด",
-  //   page: "8",
-  //   number: "11",
-  //   vatnumber: "5647833",
-  //   datepay: null,
-  //   typepay: null,
-  //   address: "เลขที่ 2/3 หมู่ที่ 14 ถนนบ...",
-  // },
-]);
 watch(tab, () => {
-  console.log(tab.value);
-  console.log(DataStore.insigniaType);
-
   if (tab.value !== "doc") {
     fecthlistInsignia();
   }
@@ -242,24 +248,28 @@ const fecthlistInsignia = async () => {
     .post(config.API.noteSearch(), data)
     .then((res) => {
       let data = res.data.result;
-      rows.value = [];
-      rows.value = data.map((e: any) => ({
-        id: e.id,
-        citizenId: e.citizenId,
-        prefix: e.prefix,
-        position: e.position,
-        status: DataStore.status(e.status),
-        name: e.fullName,
-        type: e.requestInsignia,
-        employeeType: DataStore.profileType(e.profileType),
-        profileType: e.profileType,
-        page: e.page,
-        number: e.no,
-        vatnumber: e.number,
-        datepay: date2Thai(e.datePayment),
-        typepay: e.typePayment,
-        address: e.address,
-      }));
+      console.log(data);
+      DataStore.fetchlistinsignia(data);
+
+      // rows.value = [];
+      // rows.value = data.map((e: any) => ({
+      //   id: e.id,
+      //   citizenId: e.citizenId,
+      //   prefix: e.prefix,
+      //   position: e.position,
+      //   status: DataStore.status(e.status),
+      //   dateReceive: date2Thai(e.dateReceive),
+      //   name: e.fullName,
+      //   type: e.requestInsignia,
+      //   employeeType: DataStore.profileType(e.profileType),
+      //   profileType: e.profileType,
+      //   page: e.page,
+      //   number: e.no,
+      //   vatnumber: e.number,
+      //   datepay: date2Thai(e.datePayment),
+      //   typepay: e.typePayment,
+      //   address: e.address,
+      // }));
     })
     .catch((err) => {
       console.log(err);
@@ -392,38 +402,6 @@ const resetFilter = () => {
       >
         <div class="q-pa-md">
           <div class="row col-12 q-pb-sm q-col-gutter-x-xs">
-            <div>
-              <q-select
-                v-model="DataStore.insignia"
-                dense
-                outlined
-                lazy-rules
-                hide-bottom-space
-                :label="`${'เครื่องราชฯ'}`"
-                emit-value
-                map-options
-                option-label="name"
-                :options="DataStore.insigniaOp"
-                option-value="id"
-                :readonly="false"
-                :borderless="false"
-                style="min-width: 150px"
-                @update:model-value="selectorInsignia"
-              />
-            </div>
-
-            <div>
-              <q-btn
-                @click="addData()"
-                size="12px"
-                flat
-                round
-                color="add"
-                icon="mdi-plus"
-              >
-                <q-tooltip>เพิ่ม</q-tooltip>
-              </q-btn>
-            </div>
             <div>
               <q-file
                 dense
@@ -441,27 +419,6 @@ const resetFilter = () => {
                   >อัพโหลดไฟล์บันทึกผลการได้รับพระราชทานเครื่องราชย์อิสริยสภรณ์</q-tooltip
                 >
               </q-file>
-
-              <!-- <q-btn flat round color="light-blue" icon="upload">
-            <q-menu>
-              <q-list style="min-width: 150px">
-                <q-item clickable v-close-popup>
-                  <q-item-section avatar
-                    ><q-icon color="green-7" name="mdi-file-excel"
-                  /></q-item-section>
-                  <q-item-section
-                    >บันทึกผลการได้รับพระราชทานเครื่องราชย์อิสริยสภรณ์</q-item-section
-                  >
-                </q-item>
-                <q-item clickable v-close-popup>
-                  <q-item-section avatar
-                    ><q-icon color="green-7" name="mdi-file-excel"
-                  /></q-item-section>
-                  <q-item-section>บันทึกผลการจ่ายใบกำกับ</q-item-section>
-                </q-item>
-              </q-list>
-            </q-menu>
-          </q-btn> -->
             </div>
             <div v-if="fileResult !== null">
               <q-btn
@@ -505,6 +462,61 @@ const resetFilter = () => {
                 <q-tooltip>อัพโหลดไฟล์บันทึกผลการจ่ายใบกำกับ</q-tooltip>
               </q-btn>
             </div>
+          </div>
+          <div class="row col-12 q-pb-sm q-col-gutter-x-xs">
+            <div>
+              <q-select
+                v-model="DataStore.insignia"
+                dense
+                outlined
+                lazy-rules
+                hide-bottom-space
+                :label="`${'เครื่องราชฯ'}`"
+                emit-value
+                map-options
+                option-label="name"
+                :options="DataStore.insigniaOp"
+                option-value="id"
+                :readonly="false"
+                :borderless="false"
+                style="min-width: 150px"
+                @update:model-value="selectorInsignia"
+              />
+            </div>
+            <div>
+              <q-select
+                v-model="DataStore.invoiceType"
+                dense
+                outlined
+                lazy-rules
+                hide-bottom-space
+                :label="`${'ใบกำกับ'}`"
+                emit-value
+                map-options
+                option-label="name"
+                :options="DataStore.invoiceTypeop"
+                option-value="id"
+                :readonly="false"
+                :borderless="false"
+                style="min-width: 150px"
+                @update:model-value="
+                  DataStore.selectInvoice(DataStore.invoiceType)
+                "
+              />
+            </div>
+
+            <div>
+              <q-btn
+                @click="addData()"
+                size="12px"
+                flat
+                round
+                color="add"
+                icon="mdi-plus"
+              >
+                <q-tooltip>เพิ่ม</q-tooltip>
+              </q-btn>
+            </div>
 
             <q-space />
 
@@ -549,7 +561,7 @@ const resetFilter = () => {
             </div>
           </div>
           <d-table
-            :rows="rows"
+            :rows="DataStore.rows"
             :columns="columns"
             :visible-columns="visibleColumns"
             :filter="filter"
diff --git a/src/modules/10_order/components/Detail.vue b/src/modules/10_order/components/Detail.vue
index b29d17980..24d78b017 100644
--- a/src/modules/10_order/components/Detail.vue
+++ b/src/modules/10_order/components/Detail.vue
@@ -7,9 +7,7 @@
   <q-card flat bordered class="col-12 q-my-sm q-mt-sm">
     <q-stepper v-model="step" ref="stepper" color="primary" animated class="step" header-class="bg-grey-1">
       <q-step :name="1" title="รายละเอียดการออกคำสั่ง" prefix="1" :done="step > 1" :header-nav="step > 1" />
-
       <q-step :name="2" title="เลือกรายชื่อ" prefix="2" :done="step > 2" :header-nav="step > 2" />
-
       <q-step :name="3" title="เลือกรายชื่อส่งสำเนาคำสั่ง" prefix="3" :done="step > 3" :header-nav="step > 3" />
       <q-step :name="4" title="รายละเอียดคำสั่งและแนบท้าย" prefix="4" :done="step > 4" :header-nav="step > 4" />
       <template v-slot:message>