ปรับการแสดง reason ของการจัดการคำขอ

src/modules/07_insignia/components/2_Manage/Tab3.vue

@@ -4,6 +4,7 @@ import { useQuasar } from "quasar";
 import type { QTableProps } from "quasar";
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
 import { useRouter } from "vue-router";
+import DialogInformation from "@/components/Dialogs/Information.vue";
 
 const router = useRouter();
 const DataStore = useInsigniaDataStore();
@@ -185,9 +186,16 @@ const paginationLabel = (start: number, end: number, total: number) => {
 };
 
 const dialogNote = ref<boolean>(false);
-const showNote = (requestNote: string) => {
+const note = ref<string>("");
+const noteTitle = ref<string>("");
+const showNote = (row: any) => {
+  note.value = row.requestNote;
+  noteTitle.value = "เหตุผลกรลบออกของ" + " " + row.name;
   dialogNote.value = true;
 };
+const closeReson = () => {
+  dialogNote.value = false;
+};
 </script>
 <template>
   <div class="col-12 row q-pa-md">
@@ -327,7 +335,7 @@ const showNote = (requestNote: string) => {
               <q-td key="insigniaLevel" :props="props">
                 {{ props.row.insigniaLevel }}
               </q-td>
-              <q-td v-if="props.row.requestNote != ''" auto-width>
+              <q-td v-if="props.row.requestNote != null" auto-width>
                 <q-btn
                   dense
                   size="12px"
@@ -335,7 +343,7 @@ const showNote = (requestNote: string) => {
                   round
                   color="blue"
                   @click.stop
-                  @click="showNote(props.row.requestNote)"
+                  @click="showNote(props.row)"
                   icon="mdi-information-outline"
                 >
                   <q-tooltip>เหตุผลการลบ</q-tooltip>
@@ -359,4 +367,10 @@ const showNote = (requestNote: string) => {
       </div>
     </div>
   </div>
+  <DialogInformation
+    :modal="dialogNote"
+    :title="noteTitle"
+    :desc="note"
+    :click-close="closeReson"
+  />
 </template>