api workflow

src/components/Workflow/DialogSelectPerson.vue

@@ -22,14 +22,7 @@ const { stateId, fetchData } = defineProps({
 
 /** table*/
 const selected = ref<any[]>([]);
-const rows = ref<any[]>([
-  {
-    fullName: "นายศรัณย์ ศิลาดี",
-    position: "นักบริหาร",
-    posType: "บริหาร(สูง)",
-    organization: "",
-  },
-]);
+const rows = ref<any[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "fullName",
@@ -37,6 +30,9 @@ const columns = ref<QTableProps["columns"]>([
     label: "ชื่อ-นามสกุล",
     sortable: true,
     field: "fullName",
+    format(val, row) {
+      return `${row.prefix}${row.firstName} ${row.lastName}`;
+    },
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
@@ -49,15 +45,15 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
-    name: "posType",
-    align: "left",
-    label: "ประเภทตำแหน่ง",
-    sortable: true,
-    field: "posType",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
+  // {
+  //   name: "posType",
+  //   align: "left",
+  //   label: "ประเภทตำแหน่ง",
+  //   sortable: true,
+  //   field: "posType",
+  //   headerStyle: "font-size: 14px",
+  //   style: "font-size: 14px",
+  // },
   {
     name: "organization",
     align: "left",
@@ -73,7 +69,20 @@ const isAcceptSetting = ref<boolean>(false);
 const isApproveSetting = ref<boolean>(false);
 const isReasonSetting = ref<boolean>(false);
 
-function fetchLists() {}
+async function fetchLists() {
+  showLoader();
+  await http
+    .get(config.API.workflow + `commander`)
+    .then(async (res) => {
+      rows.value = res.data.result;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
 
 function onSubmit() {
   dialogConfirm($q, async () => {

src/components/Workflow/Main.vue

@@ -6,6 +6,8 @@ import { useCounterMixin } from "@/stores/mixin";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
+import type { DataListState } from "@/interface/response/workflow/Main";
+
 import DialogSelectPerson from "@/components/Workflow/DialogSelectPerson.vue";
 import DialogApprove from "@/components/Workflow/DialogApprove.vue";
 
@@ -19,7 +21,7 @@ const { id, sysName } = defineProps({
 });
 
 const stateId = ref<string>(""); //id state ปัจุบัน
-const state = ref<number>(2); //state ปัจุบัน
+const state = ref<number>(1); //state ปัจุบัน
 
 const isChangeState = ref<boolean>(false); //ส่งไปยังผู้บังคับบัญชา/ผู้มีอำนาจ
 const isOperate = ref<boolean>(true); //เปลี่ยนสถานะ (state) เอกสารได้
@@ -31,10 +33,9 @@ const isCancel = ref<boolean>(true); //ลบเอกสารได้ (ถ้
 const modalSelectPerson = ref<boolean>(false);
 const modalApprove = ref<boolean>(false);
 
-const itemState = ref<any[]>([]);
+const itemState = ref<DataListState[]>([]);
 
 async function fetchData() {
-  console.log(id, sysName);
   await http
     .post(config.API.workflow + `check-state-all`, {
       refId: id,
@@ -129,7 +130,7 @@ onMounted(async () => {
             :color="state < index + 1 ? 'grey-4' : ''"
           >
             <!-- Darft -->
-            <div class="row q-col-gutter-sm" v-if="state === 1">
+            <div class="row q-col-gutter-sm" v-if="state === 1 && index === 0">
               <div>
                 <q-btn
                   v-if="isChangeState"
@@ -152,8 +153,8 @@ onMounted(async () => {
                     :key="index"
                   >
                     <q-item-section>
-                      <q-item-label
-                        >{{ item.createdFullName }}
+                      <q-item-label>
+                        {{ `${item.prefix}${item.firstName} ${item.lastName}` }}
                         <!-- {{ `(${item.position})` }} -->
                       </q-item-label>
                       <q-item-label caption lines="2">{{

src/interface/response/workflow/Main.ts

@@ -0,0 +1,39 @@
+interface DataListState {
+  stateId: string;
+  stateName: string;
+  stateNo: number;
+  stateUserComments: StateUserComments[];
+}
+
+interface StateUserComments {
+  createdAt: string;
+  createdFullName: string;
+  createdUserId: string;
+  id: string;
+  isAccept: boolean | null;
+  isAcceptSetting: boolean | null;
+  isApprove: boolean | null;
+  isApproveSetting: boolean | null;
+  isReasonSetting: boolean | null;
+  lastUpdateFullName: string;
+  lastUpdateUserId: string;
+  lastUpdatedAt: string;
+  order: null;
+  profileId: string;
+  reason: string;
+  stateId: string;
+  firstName: string;
+  lastName: string;
+  prefix: string;
+}
+
+interface DataCommander {
+  firstName: string;
+  id: string;
+  lastName: string;
+  orgRoot: string;
+  position: string;
+  prefix: string;
+}
+
+export type { DataListState, DataCommander };