แยกการลา

src/modules/09_leave/components/2_Leave/DetailLeave.vue

@@ -581,7 +581,7 @@ function formattedNumber(x: number) {
                 <div class="col-12 row">
                   <div class="col-xs-5 col-sm-3 text-grey-8">ประเภทการลา</div>
                   <div class="col text-primary">
-                    {{ formData.leaveTypeName }}
+                    {{ checkForm !== 'FormUpasom' && checkForm !== 'FormHajj' ? formData.leaveTypeName:(formData.hajjDayStatus ? 'ลาประกอบพิธีฮัจญ์':'ลาอุปสมบท') }}
                   </div>
                 </div>
                 <div class="col-12 row">
@@ -640,7 +640,7 @@ function formattedNumber(x: number) {
           <div class="col-xs-12 col-sm-5 row">
             <!-- card ซ้าย -->
             <q-card flat bordered class="col-12">
-              <FormMain :data="formData" />
+              <FormMain :data="formData" :checkForm="checkForm"/>
             </q-card>
           </div>
           <div class="col-xs-12 col-sm-7 row">

src/modules/09_leave/components/2_Leave/Tab1.vue

@@ -21,7 +21,7 @@ import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
 const $q = useQuasar(); //ใช้ noti quasar
 const mixin = useCounterMixin();
 const leaveStore = useLeavelistDataStore();
-
+const dataToobar = ref<any[]>([]);
 const { showLoader, hideLoader, messageError } = mixin;
 
 const querySting = reactive<QuerySting>({
@@ -86,7 +86,23 @@ async function updatePaging(
   await fecthLeaveList();
 }
 
+/** function เรียกข้อมูลสถานะ*/
+async function fetchOption() {
+  await http
+    .get(config.API.leaveType())
+    .then((res) => {
+      dataToobar.value = res.data.result;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+
+    });
+}
+
 onMounted(async () => {
+  await fetchOption();
   await fecthLeaveList();
 });
 
@@ -140,6 +156,7 @@ watch(
     <ToolBar
       :rowsPerPage="querySting.pageSize"
       @update:querySting="updatePaging"
+      :dataToobar="dataToobar"
     />
     <TableList
       :page="querySting.page"
@@ -147,6 +164,7 @@ watch(
       :maxPage="maxPage"
       :totalList="totalList"
       @update:querySting="updatePaging"
+      :dataToobar="dataToobar"
     />
   </div>
   <div v-if="leaveStore.tabView === 'calendar'"><CalendarView /></div>

src/modules/09_leave/components/2_Leave/Tab2.vue

@@ -21,7 +21,7 @@ const mixin = useCounterMixin();
 const leaveStore = useLeavelistDataStore();
 const { showLoader, hideLoader, messageError } = mixin;
 const { fetchListLeaveReject } = leaveStore;
-
+const dataToobar = ref<any[]>([]);
 const $q = useQuasar(); //ใช้ noti quasar
 
 const querySting = reactive<QuerySting>({
@@ -85,7 +85,21 @@ async function updatePaging(
   await fecthLeaveList();
 }
 
+/** function เรียกข้อมูลสถานะ*/
+async function fetchOption() {
+  await http
+    .get(config.API.leaveType())
+    .then((res) => {
+      dataToobar.value = res.data.result;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {});
+}
+
 onMounted(async () => {
+  await fetchOption();
   await fecthLeaveList();
 });
 </script>
@@ -93,6 +107,7 @@ onMounted(async () => {
   <ToolBar
     :rowsPerPage="querySting.pageSize"
     @update:querySting="updatePaging"
+    :dataToobar="dataToobar"
   />
   <TableList
     :page="querySting.page"
@@ -100,6 +115,7 @@ onMounted(async () => {
     :maxPage="maxPage"
     :totalList="totalList"
     @update:querySting="updatePaging"
+    :dataToobar="dataToobar"
   />
 </template>
 

src/modules/09_leave/components/2_Leave/TableList.vue

@@ -8,7 +8,7 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
 const mixin = useCounterMixin();
 const leaveStore = useLeavelistDataStore();
-
+const checkForm = ref<string>("");
 const router = useRouter();
 
 /** เรียน funtion จาก stores*/
@@ -206,6 +206,7 @@ const props = defineProps({
     type: Number,
     require: true,
   },
+  dataToobar: Object,
 });
 
 const emit = defineEmits(["update:querySting"]);
@@ -237,8 +238,22 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
     updateQuerySting(currentPage.value, pagination.value.rowsPerPage);
 });
 
+function convert(val: any) {
+  const filtertype = props.dataToobar?.find(
+      (e: any) => e.id === val.leaveTypeId
+    );
+    const type = filtertype?.code;
+if(type == 'LV-006'&&val.hajjDayStatus == false){
+  return 'ลาอุปสมบท'
+}else if(type == 'LV-006'&&val.hajjDayStatus == true){
+  return 'ลาประกอบพิธีฮัจญ์'
+}else{
+  return val.leaveTypeName
+}
+}
 /** Hook*/
 onMounted(() => {
+
   if (leaveStore.tabMenu === "1") {
     leaveStore.visibleColumns = visibleColumnsLeave.value;
     leaveStore.columns = columnsLeave.value;
@@ -287,6 +302,9 @@ onMounted(() => {
               1
             }}
           </div>
+          <div v-else-if="col.name == 'leaveTypeName'">
+            {{ convert(props.row) }}
+          </div>
 
           <div v-else class="table_ellipsis">
             {{ col.value }}

src/modules/09_leave/components/2_Leave/ToolBarLeave.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted } from "vue";
+import { ref, onMounted, watch } from "vue";
 import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
@@ -22,6 +22,7 @@ const props = defineProps({
     type: Number,
     require: true,
   },
+  dataToobar: Array,
 });
 
 const emit = defineEmits(["update:querySting"]);
@@ -102,28 +103,6 @@ const optionStatusMain = ref<DataOption[]>(
   leaveStore.tabMenu == "1" ? optionStatus.value : optionStatus2.value
 );
 
-/** function เรียกข้อมูลสถานะ*/
-async function fetchOption() {
-  await http
-    .get(config.API.leaveType())
-    .then((res) => {
-      const data = res.data.result;
-      leaveStore.leaveType = data;
-      optionTypeMain.value = [
-        { id: "00000000-0000-0000-0000-000000000000", name: "ทั้งหมด" },
-      ];
-      const option = data.map((e: DataOption) => ({
-        id: e.id,
-        name: e.name,
-      }));
-      optionTypeMain.value.push(...option);
-      optionType.value = optionTypeMain.value;
-    })
-    .catch((err) => {
-      messageError($q, err);
-    });
-}
-
 /**
  * ฟังก์ชั่นค้นหาข้อมูลของ Option Filter
  * @param val คำที่ค้นหา
@@ -145,9 +124,26 @@ function filterOption(val: string, update: any, name: string) {
   });
 }
 
-onMounted(async () => {
+watch(
-  await fetchOption();
+  async () => props.dataToobar,
-});
+  () => {
+    if (props.dataToobar) {
+      const data = props.dataToobar;
+      leaveStore.leaveType = data;
+      optionTypeMain.value = [
+        { id: "00000000-0000-0000-0000-000000000000", name: "ทั้งหมด" },
+      ];
+
+      const option = data.map((e: any) => ({
+        id: e.id,
+        name: e.name,
+      }));
+      
+      optionTypeMain.value.push(...option);
+      optionType.value = optionTypeMain.value;
+    }
+  }
+);
 </script>
 
 <template>
@@ -210,11 +206,19 @@ onMounted(async () => {
             <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
           </q-item>
         </template>
-        <template v-if="leaveStore.filter.type !== '00000000-0000-0000-0000-000000000000'" v-slot:append>
+        <template
+          v-if="
+            leaveStore.filter.type !== '00000000-0000-0000-0000-000000000000'
+          "
+          v-slot:append
+        >
           <q-icon
             name="cancel"
             @click.stop.prevent="
-              (optionType = optionTypeMain), (leaveStore.filter.type = '00000000-0000-0000-0000-000000000000'), filterListLeave()
+              (optionType = optionTypeMain),
+                (leaveStore.filter.type =
+                  '00000000-0000-0000-0000-000000000000'),
+                filterListLeave()
             "
             class="cursor-pointer"
           />
@@ -249,13 +253,14 @@ onMounted(async () => {
           <q-icon
             name="cancel"
             @click.stop.prevent="
-              (optionStatus = optionStatusMain), (leaveStore.filter.status = 'ALL'), filterListLeave()
+              (optionStatus = optionStatusMain),
+                (leaveStore.filter.status = 'ALL'),
+                filterListLeave()
             "
             class="cursor-pointer"
           />
         </template>
-        </q-select
+      </q-select>
-      >
     </div>
     <q-space />
     <div class="col-xs-12 col-sm-3 col-md-2">

src/modules/09_leave/components/2_Leave/formDetail/formMain.vue

@@ -4,8 +4,8 @@ const props = defineProps({
     type: Object,
     required: true,
   },
+  checkForm: String,
 });
-console.log(props.data);
 </script>
 <template>
   <q-card-section>
@@ -16,7 +16,16 @@ console.log(props.data);
       </div>
       <div class="row">
         <div class="col-4 text-grey-8">เรื่อง</div>
-        <div class="col">{{ props.data.leaveTypeName }}</div>
+
+        <div class="col">
+          {{
+            props.checkForm !== "FormUpasom" && props.checkForm !== "FormHajj"
+              ? props.data.leaveTypeName
+              : props.data.hajjDayStatus
+              ? "ลาประกอบพิธีฮัจญ์"
+              : "ลาอุปสมบท"
+          }}
+        </div>
       </div>
       <div class="row">
         <div class="col-4 text-grey-8">เรียน</div>

src/modules/09_leave/interface/response/leave.ts

@@ -20,6 +20,7 @@ interface ListLeave {
   org?: string;
   position?: string;
   level?: string;
+  hajjDayStatus?: boolean;
 }
 interface FormData {
   id: string;

src/modules/09_leave/stores/LeaveStore.ts

@@ -57,6 +57,7 @@ export const useLeavelistDataStore = defineStore("leave", () => {
       org: e.org !== undefined && e.org !== null && e.org !== "" ? e.org : "-",
       position: e.position ?? "-",
       level: e.level ?? "-",
+      hajjDayStatus: e.hajjDayStatus ,
       dateSendLeave: e.dateSendLeave && date2Thai(e.dateSendLeave),
       dateLeave:
         e.leaveStartDate && e.leaveEndDate