fix workflow

src/components/Workflow/DialogApprove.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, watch } from "vue";
+import { ref, watch, computed } from "vue";
 import { useQuasar } from "quasar";
 
 import { useCounterMixin } from "@/stores/mixin";
@@ -15,9 +15,16 @@ const { dialogConfirm, showLoader, hideLoader, messageError } =
 const modal = defineModel<boolean>("modal", { required: true });
 const props = defineProps({
   dataUserComment: { type: Object, require: true },
+  sysName: { type: String, require: true },
   fetchData: { type: Function, require: true },
 });
 
+const rejectName = computed(() =>
+  props.sysName && ["SYS_RESIGN", "SYS_RESIGN_EMP"].includes(props.sysName)
+    ? "ยับยั้ง"
+    : "ไม่อนุมัติ"
+);
+
 const isAcceptSetting = ref<boolean>(false);
 const isApproveSetting = ref<boolean>(false);
 const isReasonSetting = ref<boolean>(false);
@@ -107,8 +114,10 @@ watch(modal, (val) => {
                 label="รับทราบ"
               />
             </div>
-            <div v-if="!isAcceptSetting && isApproveSetting">
-              <div class="text-weight-bold">พิจารณา (อนุมัติ/ไม่อนุมัติ)</div>
+            <div v-if="isApproveSetting">
+              <div class="text-weight-bold">
+                {{ `พิจารณา (อนุมัติ/${rejectName})` }}
+              </div>
               <div class="q-pa-sm q-gutter-sm">
                 <q-radio
                   dense
@@ -123,13 +132,13 @@ watch(modal, (val) => {
                   keep-color
                   color="primary"
                   v-model="isApprove"
-                  label="ไม่อนุมัติ"
+                  :label="rejectName"
                   val="reject"
                 />
               </div>
             </div>
 
-            <div v-if="!isAcceptSetting && isReasonSetting">
+            <div v-if="isReasonSetting">
               <div class="text-weight-bold">แสดงความเห็นในเอกสาร</div>
               <div class="q-pa-sm q-gutter-sm">
                 <div class="col-12">

src/components/Workflow/DialogSelectPerson.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, watch } from "vue";
+import { ref, watch, computed } from "vue";
 import { useQuasar } from "quasar";
 
 import { useCounterMixin } from "@/stores/mixin";
@@ -19,10 +19,18 @@ const search = ref<string>("");
 const modal = defineModel<boolean>("modal", { required: true });
 const props = defineProps({
   stateId: { type: String, require: true },
+  keycloakId: { type: String, require: true },
+  sysName: { type: String, require: true },
   fetchData: { type: Function, require: true },
   type: { type: String, require: true },
 });
 
+const rejectName = computed(() =>
+  props.sysName && ["SYS_RESIGN", "SYS_RESIGN_EMP"].includes(props.sysName)
+    ? "ยับยั้ง"
+    : "ไม่อนุมัติ"
+);
+
 /** table*/
 const selected = ref<any[]>([]);
 const rows = ref<any[]>([]);
@@ -88,6 +96,7 @@ async function fetchLists() {
       keyword: search.value,
       page: pagination.value.page,
       pageSize: pagination.value.rowsPerPage,
+      keycloakId: props.keycloakId,
     })
     .then(async (res) => {
       totalList.value = Math.ceil(
@@ -136,8 +145,8 @@ function onCloseModal() {
   isApproveSetting.value = false;
   isReasonSetting.value = false;
 
-  search.value = ''
-  isAct.value = false
+  search.value = "";
+  isAct.value = false;
 }
 
 function onSearchData() {
@@ -174,7 +183,6 @@ watch(modal, (val) => {
       <q-form q-form greedy @submit.prevent @validation-success="onSubmit">
         <DialogHeader :tittle="`เลือกรายชื่อ`" :close="onCloseModal" />
         <q-separator />
-
         <q-card-section>
           <div class="row q-col-gutter-sm items-start q-mb-sm">
             <div class="col-12 col-sm-4 col-md-4">
@@ -271,8 +279,8 @@ watch(modal, (val) => {
                       props.rowIndex +
                       1
                     }}
-                  </div v-else>
-                  <div>
+                  </div>
+                  <div v-else>
                     {{ col.value ? col.value : "-" }}
                   </div>
                 </q-td>
@@ -298,10 +306,10 @@ watch(modal, (val) => {
                 keep-color
                 color="primary"
                 v-model="isApproveSetting"
-                label="ให้เลือกพิจารณา (อนุมัติ/ไม่อนุมัติ)"
+                :label="`ให้เลือกพิจารณา (อนุมัติ/${rejectName})`"
               />
             </div>
-            <div v-if="!isAcceptSetting">
+            <div>
               <q-checkbox
                 dense
                 keep-color

src/components/Workflow/Main.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref } from "vue";
+import { onMounted, ref, computed } from "vue";
 import { useQuasar } from "quasar";
 
 import { useCounterMixin } from "@/stores/mixin";
@@ -30,8 +30,15 @@ const props = defineProps({
   },
 });
 
+const rejectName = computed(() =>
+  props.sysName && ["SYS_RESIGN", "SYS_RESIGN_EMP"].includes(props.sysName)
+    ? "ยับยั้ง"
+    : "ไม่อนุมัติ"
+);
+
 const stateId = ref<string>(""); //id state ปัจุบัน
 const state = ref<number>(1); //state ปัจุบัน
+const keycloakId = ref<string>("");
 const dataUserComment = ref<any>();
 
 const isPermission = ref<boolean>(true); //การเข้าถึง Workflow
@@ -82,6 +89,8 @@ async function fetchCheckState() {
         isCancel: data.can_cancel,
         isSign: data.can_sign,
       };
+      keycloakId.value = data.keycloakId;
+      console.log(keycloakId.value);
     })
     .catch(() => {
       isPermission.value = false;
@@ -208,7 +217,7 @@ defineExpose({
                             ? item.isApprove === true
                               ? "อนุมัติ"
                               : item.isApprove === false
-                              ? "ไม่อนุมัติ"
+                              ? `${rejectName}`
                               : ""
                             : ""
                         }}
@@ -280,11 +289,14 @@ defineExpose({
     :state-id="stateId"
     :fetch-data="fetchCheckState"
     :type="typeSelectPerson"
+    :sys-name="props.sysName"
+    :keycloak-id="keycloakId"
   />
 
   <DialogApprove
     v-model:modal="modalApprove"
     :data-user-comment="dataUserComment"
     :fetch-data="fetchCheckState"
+    :sys-name="props.sysName"
   />
 </template>