ออกคำสั่งลงโทษทางวินัย

src/modules/11_discipline/components/9_Order/TableOrder.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
+import router from "@/router";
 /** importType */
 import type { QTableProps } from "quasar";
 /** importStroe */
@@ -18,69 +19,89 @@ const props = defineProps({
 /** ข้อมูลที่เเสดงใน คอลัม */
 const columns = ref<QTableProps["columns"]>([
   {
-    name: "subject",
+    name: "orderName",
     align: "left",
-    label: "เรื่อง",
+    label: "คำสั่ง",
     sortable: true,
-    field: "subject",
+    field: "orderName",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "ordernumber",
+    name: "orderNo",
     align: "left",
     label: "เลขที่คำสั่ง",
     sortable: true,
-    field: "ordernumber",
+    field: "orderNo",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
   {
-    name: "dateOrder",
+    name: "orderTypeName",
+    align: "left",
+    label: "ประเภท",
+    sortable: false,
+    field: "orderTypeName",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "orderDate",
     align: "left",
     label: "สั่ง ณ วันที่/วันที่คำสั่งมีผล",
     sortable: true,
-    field: "dateOrder",
+    field: "orderDate",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a, b) => parseInt(a) - parseInt(b),
   },
   {
-    name: "orderby",
+    name: "orderByOrganization",
     align: "left",
     label: "คำสั่งโดย",
     sortable: true,
-    field: "orderby",
+    field: "orderByOrganization",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "signer",
+    name: "signatoryBy",
     align: "left",
     label: "ผู้ลงนาม",
     sortable: true,
-    field: "signer",
+    field: "signatoryBy",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "statusorder",
-    align: "left",
-    label: "สถานะของคำสั่ง",
+    name: "orderStatusName",
+    align: "center",
+    label: "สถานะคำสั่ง",
     sortable: true,
-    field: "statusorder",
+    field: "orderStatusName",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
 ]);
-
 /** หัวตาราง */
 const visibleColumns = ref<string[]>([
-  "subject",
-  "ordernumber",
-  "dateOrder",
-  "orderby",
-  "signer",
-  "statusorder",
+  "orderName",
+  "orderNo",
+  "orderTypeName",
+  "orderDate",
+  "orderByOrganization",
+  "signatoryBy",
+  "orderStatusName",
 ]);
 
 /** โหลดข้อมูลเมื่อเข้าหน้านี้ */
@@ -95,13 +116,33 @@ const pagination = ref({
   page: 1,
   rowsPerPage: 10,
 });
+
+// redirect ไปยัง step ปัจจุบัน
+const redirectToPage = (id?: string, status?: string) => {
+  let step = 1;
+  switch (status) {
+    case "จัดทำร่างคำสั่ง":
+      step = 1;
+      break;
+    case "บัญชีแนบท้าย":
+      step = 2;
+      break;
+    case "เลือกผู้ได้รับสำเนาคำสั่ง":
+      step = 3;
+      break;
+    default:
+      step = 4;
+      break;
+  }
+  router.push(`/discipline-order/detail/${id}?step=${step}`);
+};
 </script>
 
 <template>
   <d-table
     for="table"
     ref="table"
-    :columns="columns"
+    :columns="OrderStore.columns"
     :rows="OrderStore.rows"
     :filter="props.filterTable"
     row-key="subject"
@@ -120,13 +161,16 @@ const pagination = ref({
       </q-tr>
     </template>
     <template v-slot:body="props">
-      <q-tr :props="props" class="cursor-pointer" style="height: 40px">
-        <q-td v-for="col in props.cols" :key="col.name" :props="props">
-          <div>
-            {{ col.value }}
-          </div>
-        </q-td>
-      </q-tr>
+      <q-td
+        v-for="col in props.cols"
+        :key="col.name"
+        :props="props"
+        @click="redirectToPage(props.row.orderId, props.row.OrderStatus)"
+      >
+        <div>
+          {{ col.value }}
+        </div>
+      </q-td>
     </template>
   </d-table>
 </template>