From 7cce2fd1fbc360bbf31883ab520456200afdbee2 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 26 Apr 2024 14:23:14 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=A7=E0=B8=B4=E0=B8=99=E0=B8=B1=E0=B8=A2?=
 =?UTF-8?q?=20=3D>=20=E0=B9=81=E0=B8=AA=E0=B8=94=E0=B8=87=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=B2=E0=B8=A2=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=97=E0=B8=B1?=
 =?UTF-8?q?=E0=B9=89=E0=B8=87=E0=B8=AB=E0=B8=A1=E0=B8=94=20,=20=E0=B8=95?=
 =?UTF-8?q?=E0=B8=B1=E0=B8=A7=E0=B8=8A=E0=B8=B5=E0=B9=89=E0=B8=A7=E0=B8=B1?=
 =?UTF-8?q?=E0=B8=94=E0=B8=95=E0=B8=B2=E0=B8=A1=E0=B9=81=E0=B8=9C=E0=B8=99?=
 =?UTF-8?q?=20=3D>=20=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A=20tree?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/1_Complaint/MainPage.vue       |   3 +
 .../components/1_Complaint/TableComplaint.vue |  27 +++--
 .../2_InvestigateFacts/MainPage.vue           |  26 +++--
 .../3_InvestigateDisciplinary/MainPage.vue    |   6 +-
 .../3_InvestigateDisciplinary/Table.vue       |   5 +
 .../components/4_Result/MainPage.vue          |   3 +
 .../components/4_Result/Table.vue             |   4 +
 .../6_BasicInformation/Channel/MainPage.vue   |  14 +--
 .../6_BasicInformation/Director/MainPage.vue  |  14 ++-
 .../components/7_ListSuspend/ListsPage.vue    |  10 +-
 .../components/8_AppealComplain/MainPage.vue  | 107 +++++++++---------
 .../components/9_Order/TableOrder.vue         |   6 +-
 .../components/indicatorByRole/DetailView.vue |  47 ++++----
 13 files changed, 157 insertions(+), 115 deletions(-)

diff --git a/src/modules/11_discipline/components/1_Complaint/MainPage.vue b/src/modules/11_discipline/components/1_Complaint/MainPage.vue
index 2c49e0645..76818f859 100644
--- a/src/modules/11_discipline/components/1_Complaint/MainPage.vue
+++ b/src/modules/11_discipline/components/1_Complaint/MainPage.vue
@@ -28,6 +28,7 @@ const filterKeyword = ref<string>("");
 const maxPage = ref<number>(1);
 const page = ref<number>(1);
 const rowsPerPage = ref<number>(10);
+const toptitle = ref<number>(0);
 const statusFilter = ref<string>("NEW");
 
 async function updatePagingProp(rowPerpage: number, pageCurrent: number) {
@@ -50,6 +51,7 @@ async function getList() {
     //
     .then((res) => {
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
+      toptitle.value = res.data.result.total;
       const data = res.data.result.data;
       fetchComplainst(data);
     })
@@ -166,6 +168,7 @@ onMounted(async () => {
         :page="page"
         :maxPage="maxPage"
         @update:pagination="updatePagingProp"
+        :toptitle="toptitle"
       />
     </div>
   </q-card>
diff --git a/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue b/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
index 77d5e1c75..7043da5b9 100644
--- a/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
+++ b/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
@@ -27,6 +27,10 @@ const props = defineProps({
     type: Number,
     require: true,
   },
+  toptitle: {
+    type: Number,
+    require: true,
+  },
 });
 
 /** หัวข้อที่เเสดงในตาราง */
@@ -178,17 +182,6 @@ onMounted(() => {
     v-model:pagination="pagination"
     :rows-per-page-options="[10, 25, 50, 100]"
   >
-    <template v-slot:pagination="scope">
-      <q-pagination
-        v-model="currentPage"
-        active-color="primary"
-        color="dark"
-        :max="Number(props.maxPage)"
-        size="sm"
-        boundary-links
-        direction-links
-      ></q-pagination>
-    </template>
     <template v-slot:header="props">
       <q-tr :props="props">
         <q-th v-for="col in props.cols" :key="col.name" :props="props">
@@ -220,6 +213,18 @@ onMounted(() => {
         </q-td>
       </q-tr>
     </template>
+    <template v-slot:pagination="scope">
+      ทั้งหมด {{ props.toptitle }}รายการ
+      <q-pagination
+        v-model="currentPage"
+        active-color="primary"
+        color="dark"
+        :max="Number(props.maxPage)"
+        size="sm"
+        boundary-links
+        direction-links
+      ></q-pagination>
+    </template>
   </d-table>
 </template>
 
diff --git a/src/modules/11_discipline/components/2_InvestigateFacts/MainPage.vue b/src/modules/11_discipline/components/2_InvestigateFacts/MainPage.vue
index 6e32a2f55..106b26497 100644
--- a/src/modules/11_discipline/components/2_InvestigateFacts/MainPage.vue
+++ b/src/modules/11_discipline/components/2_InvestigateFacts/MainPage.vue
@@ -30,6 +30,7 @@ const currentPage = ref<number>(1);
 const maxPage = ref<number>(1);
 const page = ref<number>(1);
 const rowsPerPage = ref<number>(10);
+const toptitle = ref<number>(0);
 
 /**
  *pagination ของตาราง
@@ -70,6 +71,8 @@ async function getList() {
     )
     .then((res) => {
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
+      toptitle.value = res.data.result.total;
+
       const data = res.data.result.data;
       dataInvestigate.fecthList(data);
     })
@@ -181,17 +184,6 @@ onMounted(async () => {
         v-model:pagination="pagination"
         :rows-per-page-options="[10, 25, 50, 100]"
       >
-        <template v-slot:pagination="scope">
-          <q-pagination
-            v-model="currentPage"
-            active-color="primary"
-            color="dark"
-            :max="Number(maxPage)"
-            size="sm"
-            boundary-links
-            direction-links
-          ></q-pagination>
-        </template>
         <template v-slot:header="props">
           <q-tr :props="props">
             <q-th
@@ -236,6 +228,18 @@ onMounted(async () => {
             </q-td>
           </q-tr>
         </template>
+        <template v-slot:pagination="scope">
+          ทั้งหมด {{ toptitle }}รายการ
+          <q-pagination
+            v-model="currentPage"
+            active-color="primary"
+            color="dark"
+            :max="Number(maxPage)"
+            size="sm"
+            boundary-links
+            direction-links
+          ></q-pagination>
+        </template>
       </d-table>
     </div>
   </q-card>
diff --git a/src/modules/11_discipline/components/3_InvestigateDisciplinary/MainPage.vue b/src/modules/11_discipline/components/3_InvestigateDisciplinary/MainPage.vue
index 5756dd897..83a53d4f2 100644
--- a/src/modules/11_discipline/components/3_InvestigateDisciplinary/MainPage.vue
+++ b/src/modules/11_discipline/components/3_InvestigateDisciplinary/MainPage.vue
@@ -22,6 +22,8 @@ const router = useRouter();
 const filter = ref<string>(""); //search data table
 const page = ref<number>(1);
 const maxPage = ref<number>(1);
+const totalList = ref<number>();
+
 const status = ref<string>("NEW");
 async function fetchListDisciplinary() {
   showLoader();
@@ -33,6 +35,7 @@ async function fetchListDisciplinary() {
     .then((res) => {
       const data = res.data.result.data;
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
+      totalList.value = res.data.result.total;
       fetchList(data);
     })
     .catch((err) => {})
@@ -57,7 +60,7 @@ async function updatePagingProp(rowPerpage: number, pageCurrent: number) {
 
 function filterStatus(statusReturn: string) {
   status.value = statusReturn;
-  fetchListDisciplinary()
+  fetchListDisciplinary();
 }
 
 /**เมื่อเริ่มโหลดหน้า
@@ -88,6 +91,7 @@ onMounted(async () => {
         :rowsPerPage="rowsPerPage"
         :page="page"
         :maxPage="maxPage"
+        :totalList="totalList"
         :fetchListDisciplinary="fetchListDisciplinary"
         @update:pagination="updatePagingProp"
         v-model:open-edit="openEdit"
diff --git a/src/modules/11_discipline/components/3_InvestigateDisciplinary/Table.vue b/src/modules/11_discipline/components/3_InvestigateDisciplinary/Table.vue
index 0029abe53..32f31e61a 100644
--- a/src/modules/11_discipline/components/3_InvestigateDisciplinary/Table.vue
+++ b/src/modules/11_discipline/components/3_InvestigateDisciplinary/Table.vue
@@ -61,6 +61,10 @@ const props = defineProps({
     type: Number,
     require: true,
   },
+  totalList: {
+    type: Number,
+    require: true,
+  },
 });
 
 const emit = defineEmits([
@@ -195,6 +199,7 @@ function filterFn() {
     :rows-per-page-options="[10, 25, 50, 100]"
   >
     <template v-slot:pagination="scope">
+      ทั้งหมด {{ props.totalList }} รายการ
       <q-pagination
         v-model="currentPage"
         active-color="primary"
diff --git a/src/modules/11_discipline/components/4_Result/MainPage.vue b/src/modules/11_discipline/components/4_Result/MainPage.vue
index 3df375880..aaec6a94d 100644
--- a/src/modules/11_discipline/components/4_Result/MainPage.vue
+++ b/src/modules/11_discipline/components/4_Result/MainPage.vue
@@ -25,6 +25,7 @@ const initialPagination = ref<Pagination>({
 const page = ref<number>(1);
 const pageSize = ref<number>(10);
 const maxPage = ref<number>(1);
+const totalList = ref<number>(0);
 const filter = ref<string>("");
 const status = ref<string>("DONE");
 /** function เรียกรายการสรุปผลการพิจารณาทางวินัย*/
@@ -38,6 +39,7 @@ async function fetchListResult() {
     .then(async (res) => {
       const data = res.data.result.data;
       maxPage.value = Math.ceil(res.data.result.total / pageSize.value);
+      totalList.value = res.data.result.total;
       await fetchList(data);
     })
     .catch((err) => {
@@ -97,6 +99,7 @@ onMounted(async () => {
         :fetchListResult="fetchListResult"
         :pageSize="pageSize"
         :maxPage="maxPage"
+        :totalList="totalList"
         @update:queryString="updateQueryString"
         v-model:open-edit="openEdit"
         :filterStatus="filterStatus"
diff --git a/src/modules/11_discipline/components/4_Result/Table.vue b/src/modules/11_discipline/components/4_Result/Table.vue
index fd7d8a705..abd020d5a 100644
--- a/src/modules/11_discipline/components/4_Result/Table.vue
+++ b/src/modules/11_discipline/components/4_Result/Table.vue
@@ -51,6 +51,9 @@ const props = defineProps({
   maxPage: {
     type: Number,
   },
+  totalList: {
+    type: Number,
+  },
 });
 
 const currentPage = ref<number>(1);
@@ -208,6 +211,7 @@ function filterFn() {
       </q-tr>
     </template>
     <template v-slot:pagination="scope">
+      ทั้งหมด {{ props.totalList }} รายการ
       <q-pagination
         v-model="currentPage"
         active-color="primary"
diff --git a/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue b/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue
index 0cb312bc9..1d2295d12 100644
--- a/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue
+++ b/src/modules/11_discipline/components/6_BasicInformation/Channel/MainPage.vue
@@ -38,10 +38,10 @@ const pagination = ref({
 /**
  * clickไปหน้าเพิ่มchanel
  */
-function clickAdd(){
-  dataStore.getType('')
+function clickAdd() {
+  dataStore.getType("");
   router.push(`/discipline/channel/add`);
-};
+}
 
 /** get data */
 async function getComplaintChanal() {
@@ -91,9 +91,9 @@ async function deleteData(id: string) {
  * ไปหน้า แก้ไข
  * @param id type
  */
-function editPage(data:typeItem){
-  dataStore.getType(data.name)
-  router.push(`/discipline/channel/${data.id}`)
+function editPage(data: typeItem) {
+  dataStore.getType(data.name);
+  router.push(`/discipline/channel/${data.id}`);
 }
 /**เมื่อเริ่มโหลดหน้า เรียกใช้ฟังชั่น*/
 onMounted(() => {
@@ -188,7 +188,7 @@ onMounted(() => {
                 {{ props.rowIndex + 1 }}
               </div>
               <div v-else>
-                {{ col.value}}
+                {{ col.value ?? "-" }}
               </div>
             </q-td>
             <q-td>
diff --git a/src/modules/11_discipline/components/6_BasicInformation/Director/MainPage.vue b/src/modules/11_discipline/components/6_BasicInformation/Director/MainPage.vue
index 11d3d3e5a..455ab8c7f 100644
--- a/src/modules/11_discipline/components/6_BasicInformation/Director/MainPage.vue
+++ b/src/modules/11_discipline/components/6_BasicInformation/Director/MainPage.vue
@@ -18,9 +18,11 @@ const currentPage = ref<number>(1);
 const maxPage = ref<number>(1);
 const page = ref<number>(1);
 const rowsPerPage = ref<number>(10);
+const totalList = ref<number>(0);
+
 const modalDetail = ref<boolean>(false);
-const type = ref<string>('')
-const dataPopUp = ref<DirectorRowsResponse>()
+const type = ref<string>("");
+const dataPopUp = ref<DirectorRowsResponse>();
 /**
  * ค้นหาในตาราง
  */
@@ -64,6 +66,7 @@ async function getList() {
     )
     .then((res) => {
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
+      totalList.value = res.data.result.total;
       const data = res.data.result.data;
       dataStore.fetchData(data);
     })
@@ -120,9 +123,9 @@ function openDetail(data: DirectorRowsResponse, typeChange: string) {
   } else if (typeChange == "disciplinary") {
     titleInvestigate.value = `รายการสอบสวนความผิดทางวินัยของ ${data.fullName}`;
   }
-  dataPopUp.value = data
+  dataPopUp.value = data;
   modalDetail.value = true;
-  type.value = typeChange
+  type.value = typeChange;
 }
 
 function closeDetail() {
@@ -207,6 +210,7 @@ onMounted(() => {
         :visible-columns="dataStore.visibleColumns"
       >
         <template v-slot:pagination="scope">
+          ทั้งหมด {{ totalList }} รายการ
           <q-pagination
             v-model="currentPage"
             active-color="primary"
@@ -258,7 +262,7 @@ onMounted(() => {
                 v-else
                 @click="$router.push(`/discipline/director/${props.row.id}`)"
               >
-                {{ col.value }}
+                {{ col.value ?? "-" }}
               </div>
             </q-td>
             <q-td auto-width>
diff --git a/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue b/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
index 6cbd1cbd8..f33e8fefa 100644
--- a/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
+++ b/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
@@ -139,7 +139,9 @@ function resetFilter() {
 const currentPage = ref<number>(1);
 const maxPage = ref<number>(1);
 const page = ref<number>(1);
+
 const rowsPerPage = ref<number>(10);
+const totalList = ref<number>(0);
 
 /**
  *pagination ของตาราง
@@ -180,6 +182,7 @@ async function getList() {
     .then((res) => {
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
       const data = res.data.result.data;
+      totalList.value = res.data.result.total;
       dataStore.getData(data);
     })
     .catch((e) => {
@@ -311,6 +314,7 @@ onMounted(() => {
             :rows-per-page-options="[10, 25, 50, 100]"
           >
             <template v-slot:pagination="scope">
+              ทั้งหมด {{ totalList }} รายการ
               <q-pagination
                 v-model="currentPage"
                 active-color="primary"
@@ -345,16 +349,16 @@ onMounted(() => {
                     }}
                   </div>
                   <div v-else-if="col.name === 'title'" class="table_ellipsis">
-                    {{ props.row.title }}
+                    {{ props.row.title ? props.row.title : "-" }}
                   </div>
                   <div
                     v-else-if="col.name === 'organization'"
                     class="table_ellipsis"
                   >
-                    {{ props.row.organization }}
+                    {{ props.row.organization ? props.row.organization : "-" }}
                   </div>
                   <div v-else>
-                    {{ col.value }}
+                    {{ col.value ?? "-" }}
                   </div>
                 </q-td>
               </q-tr>
diff --git a/src/modules/11_discipline/components/8_AppealComplain/MainPage.vue b/src/modules/11_discipline/components/8_AppealComplain/MainPage.vue
index aaf281727..815118a8f 100644
--- a/src/modules/11_discipline/components/8_AppealComplain/MainPage.vue
+++ b/src/modules/11_discipline/components/8_AppealComplain/MainPage.vue
@@ -34,6 +34,8 @@ const dataRow = ref<RowList[]>([]);
 const currentPage = ref<number>(1);
 const maxPage = ref<number>(1);
 const page = ref<number>(1);
+const totalList = ref<number>(0);
+
 const rowsPerPage = ref<number>(10);
 
 /**
@@ -236,6 +238,7 @@ async function getData() {
     )
     .then((res) => {
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
+      totalList.value = res.data.result.total;
       fetchAppealComplain(res.data.result.data);
     })
     .catch((e) => {
@@ -277,57 +280,57 @@ onMounted(async () => {
   </div>
   <q-card flat bordered class="col-12 q-mt-sm q-pa-md">
     <div class="row q-mb-sm q-col-gutter-sm">
-        <div>
-          <q-btn
-            id="addComplaints"
-            for="addComplaints"
-            size="12px"
-            flat
-            round
-            color="primary"
-            icon="mdi-plus"
-            @click="redirectToPageadd()"
-            ><q-tooltip>เพิ่มการอุทธรณ์/ร้องทุกข์</q-tooltip></q-btn
-          >
-        </div>
-        <q-space />
-        <q-input
-          for="#search"
-          class="col-xs-12 col-sm-3 col-md-2"
-          standout
-          dense
-          v-model="filterKeyword"
-          ref="filterRef"
-          outlined
-          placeholder="ค้นหา"
-          @keydown.enter.prevent="filterFn"
+      <div>
+        <q-btn
+          id="addComplaints"
+          for="addComplaints"
+          size="12px"
+          flat
+          round
+          color="primary"
+          icon="mdi-plus"
+          @click="redirectToPageadd()"
+          ><q-tooltip>เพิ่มการอุทธรณ์/ร้องทุกข์</q-tooltip></q-btn
         >
-          <template v-slot:append>
-            <q-icon
-              v-if="filterKeyword !== ''"
-              name="clear"
-              class="cursor-pointer"
-              @click="resetFilter"
-            />
-          </template>
-        </q-input>
+      </div>
+      <q-space />
+      <q-input
+        for="#search"
+        class="col-xs-12 col-sm-3 col-md-2"
+        standout
+        dense
+        v-model="filterKeyword"
+        ref="filterRef"
+        outlined
+        placeholder="ค้นหา"
+        @keydown.enter.prevent="filterFn"
+      >
+        <template v-slot:append>
+          <q-icon
+            v-if="filterKeyword !== ''"
+            name="clear"
+            class="cursor-pointer"
+            @click="resetFilter"
+          />
+        </template>
+      </q-input>
 
-        <q-select
-          id="visibleColumns"
-          for="visibleColumns"
-          v-model="dataStore.visibleColumns"
-          multiple
-          outlined
-          dense
-          options-dense
-          :display-value="$q.lang.table.columns"
-          emit-value
-          map-options
-          :options="dataStore.columns"
-          option-value="name"
-          options-cover
-          class="col-xs-12 col-sm-3 col-md-2"
-        />
+      <q-select
+        id="visibleColumns"
+        for="visibleColumns"
+        v-model="dataStore.visibleColumns"
+        multiple
+        outlined
+        dense
+        options-dense
+        :display-value="$q.lang.table.columns"
+        emit-value
+        map-options
+        :options="dataStore.columns"
+        option-value="name"
+        options-cover
+        class="col-xs-12 col-sm-3 col-md-2"
+      />
     </div>
     <div class="col-12 row q-mb-sm">
       <q-card bordered class="col-12 filter-card q-pa-sm">
@@ -404,7 +407,6 @@ onMounted(async () => {
               @update:model-value="dataUpdate"
             />
           </div>
-          
         </div>
       </q-card>
     </div>
@@ -425,6 +427,7 @@ onMounted(async () => {
         :rows-per-page-options="[10, 25, 50, 100]"
       >
         <template v-slot:pagination="scope">
+          ทั้งหมด {{ totalList }} รายการ
           <q-pagination
             v-model="currentPage"
             active-color="primary"
@@ -469,10 +472,10 @@ onMounted(async () => {
                 v-else-if="col.name === 'description'"
                 class="table_ellipsis"
               >
-                {{ props.row.description }}
+                {{ props.row.description ? props.row.description : "-" }}
               </div>
               <div v-else>
-                {{ col.value }}
+                {{ col.value ?? "-" }}
               </div>
             </q-td>
           </q-tr>
diff --git a/src/modules/11_discipline/components/9_Order/TableOrder.vue b/src/modules/11_discipline/components/9_Order/TableOrder.vue
index bbb933eba..6627312bb 100644
--- a/src/modules/11_discipline/components/9_Order/TableOrder.vue
+++ b/src/modules/11_discipline/components/9_Order/TableOrder.vue
@@ -186,7 +186,7 @@ const pagination = ref({
 });
 
 /**
- * ฟังชั่น redirect 
+ * ฟังชั่น redirect
  * @param id id ออกคำสั่ง
  * @param status status
  */
@@ -249,8 +249,8 @@ onMounted(() => {
           <div v-if="col.name === 'no'">
             {{ props.rowIndex + 1 }}
           </div>
-          <div>
-            {{ col.value }}
+          <div v-else>
+            {{ col.value ?? "-" }}
           </div>
         </q-td>
       </q-tr>
diff --git a/src/modules/14_KPI/components/indicatorByRole/DetailView.vue b/src/modules/14_KPI/components/indicatorByRole/DetailView.vue
index 0e04eaf02..faacbbbda 100644
--- a/src/modules/14_KPI/components/indicatorByRole/DetailView.vue
+++ b/src/modules/14_KPI/components/indicatorByRole/DetailView.vue
@@ -17,22 +17,17 @@ const router = useRouter();
 const heightSize = ref<string>("224");
 const filter = ref<string>("");
 const node = ref<any>([]);
-const expanded = ref<any>([]);
-const ticked = ref<any>([]);
+const expanded = ref<string[]>([]);
 const orgName = ref<string>("");
 const nodeId = ref<string>("");
 
-const notFound = ref<string>("ไม่พบข้อมูลที่ค้นหา");
-const noData = ref<string>("ไม่มีข้อมูล");
 const id = ref<string>(route.params.id ? route.params.id.toLocaleString() : "");
 const {
-  dialogConfirm,
   showLoader,
   hideLoader,
   messageError,
   success,
-  date2Thai,
-  calculateDurationYmd,
+  dialogConfirm,
   dialogMessageNotify,
 } = useCounterMixin();
 const title = ref<string>(route.params.id ? "แก้ไข" : "เพิ่ม");
@@ -149,15 +144,20 @@ function onSubmit() {
   if (form.nodeId == null) {
     dialogMessageNotify($q, "กรุณาเลือกหน่วยงาน/ส่วนราชการ");
   } else {
-    showLoader();
-    http[id.value ? "put" : "post"](url, body)
-      .then((res) => {
-        success($q, "บันทึกสำเร็จ");
-        id.value ? getDetail() : router.push(`/KPI-indicator-role`);
-      })
-      .finally(() => {
-        hideLoader();
-      });
+    dialogConfirm($q, () => {
+      showLoader();
+      http[id.value ? "put" : "post"](url, body)
+        .then(() => {
+          success($q, "บันทึกสำเร็จ");
+          id.value ? getDetail() : router.push(`/KPI-indicator-role`);
+        })
+        .catch((err) => {
+          messageError($q, err);
+        })
+        .finally(() => {
+          hideLoader();
+        });
+    });
   }
 }
 
@@ -189,6 +189,14 @@ function getDetail() {
       form.node = data.node;
       form.nodeId = data.nodeId;
       form.orgRevisionId = data.orgRevisionId;
+      const arrayExpanded = [
+        data.root,
+        data.child1,
+        data.child2,
+        data.child3,
+        data.child4,
+      ];
+      expanded.value = arrayExpanded.filter((e) => e !== null).slice(0, -1);
     })
     .catch((e) => {
       messageError($q, e);
@@ -228,11 +236,6 @@ async function fetchTree(id: string) {
     });
 }
 
-function updateTicked(val: any) {
-  ticked.value = [];
-  ticked.value.push(val[val.length - 1]);
-}
-
 function updateSelected(data: any) {
   nodeId.value = data.orgTreeId;
   orgName.value = data.orgTreeName;
@@ -482,7 +485,7 @@ onMounted(() => {
                   <q-tree
                     dense
                     :nodes="node"
-                    node-key="orgTreeName"
+                    node-key="orgTreeId"
                     label-key="orgTreeName"
                     v-model:expanded="expanded"
                     :filter="filter"