[UI] popup ดูข้อมูลคำสั่งที่คลิกจากตำแหน่ง/เงินเดือนในทะเบียนประวัติ

src/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue

@@ -24,6 +24,7 @@ import DialogHistory from "@/modules/04_registryPerson/components/detail/Salary/
 
 import { useCounterMixin } from "@/stores/mixin";
 import { useSalaryDataStore } from "@/modules/04_registryPerson/stores/salary";
+import DialogPreviewCommand from "@/modules/18_command/components/DialogPreviewCommand.vue";
 
 const $q = useQuasar();
 const route = useRoute();
@@ -54,6 +55,9 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 //Table
 const rows = ref<ResListSalary[]>([]); //รายการตำแหน่งเงินเดือน
 const keyword = ref<string>(""); //คำค้นหา
+const modalCommand = ref<boolean>(false);
+const command = ref<string>("");
+const commandId = ref<string>("");
 const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "date",
@@ -608,6 +612,12 @@ const classInput = (val: boolean) => {
   };
 };
 
+function onRefCommand(data: ResListSalary) {
+  modalCommand.value = true;
+  command.value = data.refCommandNo;
+  commandId.value = data.commandId;
+  // commandId.value = 'bdf9da91-ba45-497a-a2b7-cc49e2446d97'; //จำลอง
+}
 /**
  * ทำงานเมื่อ Components ถูกเรียกใช้งาน
  */
@@ -693,7 +703,9 @@ onMounted(() => {
           </q-btn>
 
           <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              props.isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
             flat
             dense
             round
@@ -705,7 +717,9 @@ onMounted(() => {
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
           <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              props.isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
             dense
             flat
             round
@@ -717,7 +731,9 @@ onMounted(() => {
           </q-btn>
 
           <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              props.isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
             dense
             flat
             round
@@ -730,7 +746,18 @@ onMounted(() => {
         </q-td>
 
         <q-td v-for="col in props.cols" :key="col.id">
-          <div class="table_ellipsis">
+          <div
+            v-if="col.name == 'refCommandNo'"
+            @click="col.value ? onRefCommand(props.row) : null"
+            :class="
+              col.value
+                ? 'table_ellipsis text-blue cursor-pointer'
+                : 'table_ellipsis'
+            "
+          >
+            {{ col.value ? col.value : "-" }}
+          </div>
+          <div v-else class="table_ellipsis">
             {{ col.value ? col.value : "-" }}
           </div>
         </q-td>
@@ -1088,6 +1115,11 @@ onMounted(() => {
   </q-dialog>
 
   <DialogHistory v-model:modal="modalHistory" v-model:salaryId="salaryId" />
+  <DialogPreviewCommand
+    v-model:modal="modalCommand"
+    v-model:command="command"
+    v-model:commandId="commandId"
+  />
 </template>
 
 <style scoped></style>