UI โครงสร้างอัตรากำลัง

src/modules/02_organizationalNew/components/StructureDetail.vue

@@ -50,7 +50,11 @@ async function fetchDetailTree(id: string, type: string) {
       formData.orgType = range != "DEPARTMENT" ? "ส่วนราชการ" : "หน่วยงาน";
       formData.orgLevel = store.convertType(range);
       formData.status =
-        store.typeOrganizational === "current" ? "ปัจจุบัน" : "แบบร่าง";
+        store.typeOrganizational === "current"
+          ? "ปกติ"
+          : store.typeOrganizational === "draft"
+          ? "แบบร่าง"
+          : "ยุบ";
       formData.orgPhoneEx = data[`org${type}PhoneEx`];
       formData.orgPhoneIn = data[`org${type}PhoneIn`];
       formData.orgFax = data[`org${type}Fax`];

src/modules/02_organizationalNew/views/main.vue

@@ -120,8 +120,10 @@ function onClickDateTime() {
 
 const modalHistory = ref<boolean>(false);
 const count = ref<number>(0);
-function onClickHistory(id: string) {
+const labelHistory = ref<string>("ประวัติโครงสร้าง");
+function onClickHistory(id: string, name: string) {
   historyId.value = id;
+  labelHistory.value = name;
   count.value++;
   // modalHistory.value = !modalHistory.value;
 }
@@ -193,19 +195,25 @@ onMounted(async () => {
                 :outline="stroe.typeOrganizational === 'current' ? false : true"
                 color="blue"
                 label="ปัจจุบัน"
-                @click="stroe.typeOrganizational = 'current'"
+                @click="
+                  (stroe.typeOrganizational = 'current'),
+                    (labelHistory = 'ประวัติโครงสร้าง')
+                "
                 :disable="ishasActive"
               />
               <q-btn
                 :outline="stroe.typeOrganizational === 'draft' ? false : true"
                 color="blue"
                 label="แบบร่าง"
-                @click="stroe.typeOrganizational = 'draft'"
+                @click="
+                  (stroe.typeOrganizational = 'draft'),
+                    (labelHistory = 'ประวัติโครงสร้าง')
+                "
                 :disable="ishasDraft"
               />
               <q-btn-dropdown
                 color="blue"
-                label="โครงสร้างแบบเก่า"
+                :label="labelHistory"
                 @click="stroe.typeOrganizational = 'old'"
                 :outline="stroe.typeOrganizational === 'old' ? false : true"
               >
@@ -216,7 +224,7 @@ onMounted(async () => {
                     v-close-popup
                     v-for="(item, index) in itemHistory"
                     :key="index"
-                    @click="onClickHistory(item.id)"
+                    @click="onClickHistory(item.id, item.name)"
                   >
                     <q-item-section>
                       <q-item-label>{{ item.name }}</q-item-label>