เพิ่ม ui การประเมิน

src/modules/12_Evaluate/components/Table.vue

@@ -161,6 +161,7 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
         <q-th v-for="col in props.cols" :key="col.name" :props="props">
           <span class="text-weight-medium" v-html="col.label" />
         </q-th>
+        <q-th auto-width />
       </q-tr>
     </template>
     <template #body="props">

src/modules/12_Evaluate/store/Evaluate.ts

@@ -10,17 +10,37 @@ export const useEvalutuonStore = defineStore("EvalutuonStore", () => {
   /** function สถานะ*/
   function convertStatus(val: string) {
     switch (val) {
-      // case "NEW":
+      case "CHECK_SPEC":
-      //   return "กำลังสรุปผลการพิจารณา";
+        return "ตรวจสอบคุณสมบัติด้วยตนเอง";
-      // case "STOP":
+      case "PREPARE_DOC_V1":
-      //   return "ยุติเรื่อง";
+        return "จัดเตรียมเอกสารเล่ม";
+      case "CHECK_DOC_V1":
+        return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
+      case "WAIT_CHECK_DOC_V1":
+        return "รอตรวจสอบคุณสมบัติ";
+      case "ANNOUNCE_WEB":
+        return "ประกาศบนเว็บไซต์";
+      case "PREPARE_DOC_V2":
+        return "จัดเตรียมเอกสารเล่ม";
+      case "WAIT_CHECK_DOC_V2":
+        return "รอพิจารณาผลการประเมิน";
+      case "CHECK_DOC_V2":
+        return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
       case "DONE":
-        return "กำลังสรุปผลการพิจารณา";
+        return "เสร็จสิ้น";
-      case "REPORT":
-        return "ส่งไปออกคำสั่ง";
     }
   }
 
+  // ตรวจสอบคุณสมบัติด้วยตนเอง -> CHECK_SPEC
+  // จัดเตรียมเอกสารเล่ม 1-> PREPARE_DOC_V1
+  // ตรวจสอบความถูกต้องของเอกสารเล่ม 1 -> CHECK_DOC_V1
+  // รอตรวจสอบคุณสมบัติ -> WAIT_CHECK_DOC_V1
+  // ประกาศบนเว็บไซต์ -> ANNOUNCE_WEB
+  // จัดเตรียมเอกสารเล่ม 2 -> PREPARE_DOC_V2
+  // ตรวจสอบความถูกต้องของเอกสารเล่ม 2 -> CHECK_DOC_V2
+  // รอพิจารณาผลการประเมิน -> WAIT_CHECK_DOC_V2
+  // เสร็จสิ้น -> DONE
+
   const visibleColumns = ref<String[]>([
     "citizanId",
     "fullName",
@@ -31,6 +51,19 @@ export const useEvalutuonStore = defineStore("EvalutuonStore", () => {
     "status",
   ]);
   const rows = ref<any[]>([]);
+  function fetchData(data: any[]) {
+    const dataList: any[] = data.map((data: any) => ({
+      citizanId: data.citizanId,
+      fullName: data.fullName,
+      position: data.position,
+      level: data.level,
+      positionNumber: data.positionNumber,
+      agency: data.agency,
+      status: convertStatus(data.status),
+    }));
+    rows.value = dataList;
+    console.log(dataList);
+  }
 
   const columns = ref<QTableProps["columns"]>([
     {
@@ -110,5 +143,7 @@ export const useEvalutuonStore = defineStore("EvalutuonStore", () => {
     visibleColumns,
     columns,
     rows,
+    convertStatus,
+    fetchData,
   };
 });

src/modules/12_Evaluate/views/MainPage.vue

@@ -20,16 +20,103 @@ const { showLoader, hideLoader, messageError } = mixin;
 const initialPagination = ref<Pagination>({
   rowsPerPage: 0,
 });
+function Detailpage() {
+  router.push("/evaluate/detail");
+}
 
 const page = ref<number>(1);
-const pageSize = ref<number>(5);
+const pageSize = ref<number>(10);
 const maxPage = ref<number>(1);
 const filter = ref<string>("");
 
 /**เมื่อเริ่มโหลดหน้า
  * ส่งข้อมูลจำลองไปยัง store
  */
-onMounted(async () => {});
+onMounted(async () => {
+  store.fetchData([
+    {
+      citizanId: "1230030004001",
+      fullName: "นางวัศยา ศรีสร้อย",
+      position: "ผู้อำนวยการสถาบัน",
+      level: "ปฏิบัติการ",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มงานกฎหมาย",
+      status: "WAIT_CHECK_DOC_V1",
+    },
+    {
+      citizanId: "172223000401",
+      fullName: "นางธัญพร ปัทมเดชา",
+      position: "หัวหน้าสำนักงาน",
+      level: "ปฏิบัติการ",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มงานกฎหมาย",
+      status: "WAIT_CHECK_DOC_V1",
+    },
+    {
+      citizanId: "122222000401",
+      fullName: "นายสิริศักดิ์ พรมบุตร",
+      position: "นักบริหาร",
+      level: "ชำนาญการพิเศษ",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มงานกฎหมายอาคาร",
+      status: "WAIT_CHECK_DOC_V2",
+    },
+    {
+      citizanId: "111111100401",
+      fullName: "นายเอกฉัท วีระโชติ ",
+      position: "นักบริหาร",
+      level: "อำนวยการ",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มงานการคลัง",
+      status: "DONE",
+    },
+    {
+      citizanId: "122203000401",
+      fullName: "นางธนิดา มั่นคงประสิทธิ์",
+      position: "ผู้อำนวยการกอง",
+      level: "อาวุโส",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มกิจการสภา",
+      status: "WAIT_CHECK_DOC_V1",
+    },
+    {
+      citizanId: "123003111401",
+      fullName: "นางณิชมน ลือขำ ",
+      position: "ผู้อำนวยการสถาบัน",
+      level: "ชำนาญงาน",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มกิจการสภา",
+      status: "WAIT_CHECK_DOC_V2",
+    },
+    {
+      citizanId: "111111100401",
+      fullName: "นายเอกฉัท วีระโชติ ",
+      position: "นักบริหาร",
+      level: "อำนวยการ",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มงานการคลัง",
+      status: "ANNOUNCE_WEB",
+    },
+    {
+      citizanId: "111111100401",
+      fullName: "นายเอกฉัท วีระโชติ ",
+      position: "นักบริหาร",
+      level: "อำนวยการ",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มงานการคลัง",
+      status: "PREPARE_DOC_V2",
+    },
+    {
+      citizanId: "111111100401",
+      fullName: "นายเอกฉัท วีระโชติ ",
+      position: "นักบริหาร",
+      level: "อำนวยการ",
+      positionNumber: "สก.ก412",
+      agency: "กลุ่มงานการคลัง",
+      status: "CHECK_DOC_V2",
+    },
+  ]);
+});
 </script>
 
 <template>
@@ -63,6 +150,79 @@ onMounted(async () => {});
                 {{ col.value }}
               </div>
             </q-td>
+            <q-td auto-width>
+              <q-btn
+                icon="mdi-dots-vertical"
+                size="12px"
+                color="grey-7"
+                flat
+                round
+                dense
+              >
+                <q-menu transition-show="jump-down" transition-hide="jump-up">
+                  {{ props.rows && props.rows.status }}
+                  <q-list dense style="min-width: 100px">
+                    <q-item
+                      clickable
+                      v-close-popup
+                      @click="Detailpage()"
+                      v-if="props.row.status === 'รอตรวจสอบคุณสมบัติ'"
+                    >
+                      <q-item-section
+                        style="min-width: 0px"
+                        avatar
+                        class="q-py-sm"
+                      >
+                        <q-icon
+                          color="primary"
+                          size="xs"
+                          name="mdi-bookmark-outline"
+                        />
+                      </q-item-section>
+                      <q-item-section>ตรวจสอบคุณสมบัติ</q-item-section>
+                    </q-item>
+
+                    <q-separator />
+
+                    <q-item clickable v-close-popup>
+                      <q-item-section
+                        style="min-width: 0px"
+                        avatar
+                        class="q-py-sm"
+                      >
+                        <q-icon
+                          color="blue"
+                          size="xs"
+                          name="mdi-account-details-outline"
+                        />
+                      </q-item-section>
+                      <q-item-section>ประวัติการเปลี่ยนสถานะ</q-item-section>
+                    </q-item>
+
+                    <q-separator />
+                    <q-item
+                      clickable
+                      v-close-popup
+                      @click="Detailpage()"
+                      v-if="props.row.status === 'รอพิจารณาผลการประเมิน'"
+                    >
+                      <q-item-section
+                        style="min-width: 0px"
+                        avatar
+                        class="q-py-sm"
+                      >
+                        <q-icon
+                          color="primary"
+                          size="xs"
+                          name="mdi-account-outline"
+                        />
+                      </q-item-section>
+                      <q-item-section>พิจารณาผลการประเมิน </q-item-section>
+                    </q-item>
+                  </q-list>
+                </q-menu>
+              </q-btn>
+            </q-td>
           </q-tr>
         </template>
       </Table>