Merge branch 'develop'

src/modules/01_metadata/components/calendar/calendarMain.vue

@@ -99,7 +99,13 @@ const updateYear = async (e: number) => {
  * ฟังก์ชันปุ่มเพิ่มวันหยุดแบบเลือกวันได้
  */
 const addCalendar = () => {
-  dateAdd.value = [new Date(), new Date()];
+  const today = new Date();
+  const { year } = dateMonth.value;
+
+  dateAdd.value = [
+    new Date(year, today.getMonth(), today.getDate()),
+    new Date(year, today.getMonth(), today.getDate()),
+  ];
   name.value = "";
   category.value = "all";
   isSpecial.value = true;

src/modules/02_users/components/RoleOrganization/DialogPersonal.vue

@@ -15,12 +15,10 @@ import type { Avatar } from "@/components/information/interface/response/avatar"
 import { useCounterMixin } from "@/stores/mixin";
 
 /** use*/
-const route = useRoute();
+
 const mixin = useCounterMixin();
-const router = useRouter();
 const $q = useQuasar();
-const retireDate = ref<Date>();
+const { messageError, date2Thai } = mixin;
-const { showLoader, hideLoader, messageError, date2Thai } = mixin;
 
 const isEmployee = defineModel("isEmployee", { type: String });
 const empType = ref<string>("officer");
@@ -42,6 +40,9 @@ const emit = defineEmits(["update:modal"]);
 
 /** ตัวแปร*/
 const modal = ref<boolean>(false);
+const isloadInformation = ref<boolean>(true);
+const isloadGoverment = ref<boolean>(true);
+const retireDate = ref<Date>();
 const avatar = reactive<Avatar>({
   avatar: "",
   fullname: "",
@@ -94,7 +95,7 @@ function calculateAge(birthDate: Date | null) {
  * @param id profileID
  */
 async function fetchInformation(id: string) {
-  showLoader();
+  isloadInformation.value = true;
   await http
     .get(
       config.API.orgProfileAdminById(
@@ -111,9 +112,7 @@ async function fetchInformation(id: string) {
       imformation.birthDate = data.birthDate ? date2Thai(data.birthDate) : "-";
       imformation.age = data.birthDate ? calculateAge(data.birthDate) : "-";
       imformation.gender = data.gender ?? "-";
-
       avatar.fullname = `${data.prefix}${data.firstName} ${data.lastName}`;
-
       avatar.position = data.position ? data.position : "-";
       if (data.avatarName) {
         await fetchProfile(data.id as string, data.avatarName);
@@ -125,7 +124,7 @@ async function fetchInformation(id: string) {
       messageError($q, err);
     })
     .finally(() => {
-      hideLoader();
+      isloadInformation.value = false;
     });
 }
 
@@ -134,7 +133,7 @@ async function fetchInformation(id: string) {
  * @param id profileID
  */
 async function fetchProfileGov(id: string) {
-  showLoader();
+  isloadGoverment.value = true;
   await http
     .get(
       config.API.profileNewGovernmentCard(
@@ -158,19 +157,21 @@ async function fetchProfileGov(id: string) {
       goverment.positionExecutiveSide =
         data.positionExecutiveField !== "" ? data.positionExecutiveField : "-";
     })
-
     .catch((err) => {
       messageError($q, err);
     })
     .finally(() => {
-      hideLoader();
+      isloadGoverment.value = false;
     });
 }
 
-// function redirecToRegistry() {
+async function fetchProfile(id: string, avatarName: string) {
-//   router.push(`/registry-${empType.value}/${props.id}`);
+  await http
-//   modal.value = false;
+    .get(config.API.fileByFile("ทะเบียนประวัติ", "โปรไฟล์", id, avatarName))
-// }
+    .then(async (res) => {
+      avatar.avatar = await res.data.downloadUrl;
+    });
+}
 
 watch(
   () => props.modal,
@@ -178,12 +179,6 @@ watch(
     modal.value = props.modal ? props.modal : false;
     if (modal.value) {
       if (props.id) {
-        // empType.value =
-        //   route.name === "appoint-employee-detail" ||
-        //   isEmployee.value == "EMPLOYEE"
-        //     ? "employee"
-        //     : "officer";
-
         await Promise.all([
           fetchInformation(props.id),
           fetchProfileGov(props.id),
@@ -198,14 +193,6 @@ watch(modal, (newValue) => {
     emit("update:modal", false);
   }
 });
-
-async function fetchProfile(id: string, avatarName: string) {
-  await http
-    .get(config.API.fileByFile("ทะเบียนประวัติ", "โปรไฟล์", id, avatarName))
-    .then(async (res) => {
-      avatar.avatar = await res.data.downloadUrl;
-    });
-}
 </script>
 
 <template>
@@ -227,7 +214,27 @@ async function fetchProfile(id: string, avatarName: string) {
 
       <q-card-section class="col q-pt-none bg-grey-12">
         <div class="q-gutter-md">
-          <q-card bordered class="text-center bg-grey-12">
+          <div v-if="isloadInformation">
+            <q-skeleton
+              type="QAvatar"
+              size="120px"
+              style="background: #e3e3e3"
+              class="q-mx-auto q-mt-md"
+            />
+            <q-skeleton
+              type="text"
+              width="150px"
+              style="background: #e3e3e3"
+              class="q-mx-auto q-mt-md"
+            />
+            <q-skeleton
+              type="text"
+              width="100px"
+              style="background: #e3e3e3"
+              class="q-mx-auto q-mt-sm"
+            />
+          </div>
+          <q-card v-else bordered class="text-center bg-grey-12">
             <div>
               <q-avatar size="120px" color="grey-4">
                 <img
@@ -244,6 +251,7 @@ async function fetchProfile(id: string, avatarName: string) {
                 />
               </q-avatar>
             </div>
+
             <div
               class="q-mt-md text-subtitle2 text-bold"
               style="font-size: 18px"
@@ -256,21 +264,6 @@ async function fetchProfile(id: string, avatarName: string) {
             >
               {{ avatar.position }}
             </div>
-            <!-- <div class="q-mt-md">
-              <q-btn
-                v-if="
-                  empType === 'employee'
-                    ? checkPermissionGet('SYS_REGISTRY_EMP')
-                    : checkPermissionGet('SYS_REGISTRY_OFFICER')
-                "
-                class="bg-white"
-                outline
-                rounded
-                label="ดูรายละเอียดเพิ่มเติมทั้งหมด"
-                color="secondary"
-                @click.prevent="redirecToRegistry"
-              />
-            </div> -->
           </q-card>
 
           <q-scroll-area style="height: 65vh; max-width: 100%">
@@ -281,7 +274,16 @@ async function fetchProfile(id: string, avatarName: string) {
                     <q-icon name="mdi-account" color="grey-7" />
                     <span class="q-ml-md">ข้อมูลส่วนตัว </span>
                   </div>
-                  <div class="row q-pa-sm">
+                  <div v-if="isloadInformation" class="row q-pa-sm">
+                    <div
+                      v-for="n in 6"
+                      :key="n"
+                      class="col-xs-6 col-md-6 q-pa-sm"
+                    >
+                      <q-skeleton type="QInput" height="40px" />
+                    </div>
+                  </div>
+                  <div v-else class="row q-pa-sm">
                     <div class="col-xs-6 col-md-6">
                       <q-input
                         borderless
@@ -360,7 +362,22 @@ async function fetchProfile(id: string, avatarName: string) {
                     <q-icon name="mdi-account-tie" color="grey-7" />
                     <span class="q-ml-md">ข้อมูลราชการ </span>
                   </div>
-                  <div class="row q-pa-sm">
+
+                  <div v-if="isloadGoverment" class="row q-pa-sm">
+                    <div
+                      v-for="n in 9"
+                      :key="n"
+                      :class="
+                        n !== 1
+                          ? 'col-xs-6 col-md-6 q-pa-sm'
+                          : 'col-xs-12 col-md-12 q-pa-sm'
+                      "
+                    >
+                      <q-skeleton type="QInput" height="40px" />
+                    </div>
+                  </div>
+
+                  <div v-else class="row q-pa-sm">
                     <div class="col-xs-12 col-md-12">
                       <q-input
                         borderless
@@ -433,13 +450,11 @@ async function fetchProfile(id: string, avatarName: string) {
                         label="ระดับตำแหน่ง"
                       />
                     </div>
-                    <div
+                    <div class="col-xs-6 col-md-6">
-                      class="col-xs-6 col-md-6"
-                      v-if="props.type !== 'employee'"
-                    >
                       <q-input
                         borderless
                         readonly
+                        autogrow
                         :model-value="
                           goverment.positionExecutive
                             ? goverment.positionExecutive
@@ -448,19 +463,17 @@ async function fetchProfile(id: string, avatarName: string) {
                         label="ตำแหน่งทางการบริหาร"
                       />
                     </div>
-                    <div
+                    <div class="col-xs-6 col-md-6">
-                      class="col-xs-6 col-md-6"
-                      v-if="props.type !== 'employee'"
-                    >
                       <q-input
                         borderless
                         readonly
+                        autogrow
                         :model-value="
                           goverment.positionExecutiveSide
                             ? goverment.positionExecutiveSide
                             : '-'
                         "
-                        label="ด้านตำแหน่งทางการบริหาร"
+                        label="ด้านทางการบริหาร"
                       />
                     </div>
                   </div>

src/modules/05_command/components/ViewPdf.vue

@@ -17,12 +17,9 @@ const { dialogConfirm, success, showLoader, hideLoader, messageError } = mixin;
 const commandId = defineModel<string>("commandId", { required: true }); // id คำสั่ง
 const type = defineModel<string>("type", { required: true }); // แยก tab
 // รายละเอียดคำสั่ง
-const dataTemplateDetail = defineModel<DataTemplateDetail>(
+const dataTemplate = defineModel<DataTemplateDetail>("dataTemplateDetail", {
-  "dataTemplateDetail",
+  required: true,
-  {
+});
-    required: true,
-  }
-);
 
 const documentFile = ref<File | null>(null); // file อัปโหลด
 const isLoadPDF = ref<boolean>(false); // Loading display pdf
@@ -57,69 +54,71 @@ const { fetchDataTemplate } = defineProps({
  * @param dataTemple รายละเอียดคำสั่ง
  */
 async function fetchDocumentTemplate(dataTemple: DataTemplateDetail) {
-  showLoader();
+  if (dataTemple) {
-  isLoadPDF.value = false;
+    showLoader();
-  pdfSrc.value = undefined;
+    isLoadPDF.value = false;
-  page.value = 1;
+    pdfSrc.value = undefined;
-  const reportName = await `${dataTemplateDetail.value.code}_${type.value}`;
+    page.value = 1;
-  const body = {
+    const reportName = `${dataTemple.code}_${type.value}`;
-    template: reportName,
+    const body = {
-    reportName: `${typeFile.value}-report`,
+      template: reportName,
-    data: {
+      reportName: `${typeFile.value}-report`,
-      issue: "............", //
+      data: {
-      title: "......", //
+        issue: "............", //
-      commandNo: "......",
+        title: "......", //
-      commandYear: "......",
+        commandNo: "......",
-      commandTitle: dataTemple.name,
+        commandYear: "......",
-      detailHeader: dataTemple.detailHeader,
+        commandTitle: dataTemple.name,
-      detailBody: dataTemple.detailBody,
+        detailHeader: dataTemple.detailHeader,
-      detailFooter: dataTemple.detailFooter,
+        detailBody: dataTemple.detailBody,
-      commandDate: "..................",
+        detailFooter: dataTemple.detailFooter,
-      commandAffectDate: "..................",
+        commandDate: "..................",
-      commandExcecuteDate: "..................",
+        commandAffectDate: "..................",
-      name: "....................................",
+        commandExcecuteDate: "..................",
-      name1: dataTemple.name1,
+        name: "....................................",
-      name2: dataTemple.name2,
+        name1: dataTemple.name1,
-      name3: dataTemple.name3,
+        name2: dataTemple.name2,
-      name4: dataTemple.name4,
+        name3: dataTemple.name3,
-      position: "ผู้อำนวยการสำนัก/เขต",
+        name4: dataTemple.name4,
-      authorizedUserFullName: "............",
+        position: "ผู้อำนวยการสำนัก/เขต",
-      authorizedPosition: "...................",
+        authorizedUserFullName: "............",
-      ...(dataTemple.persons ? { persons: dataTemple.persons } : {}),
+        authorizedPosition: "...................",
-    },
+        ...(dataTemple.persons ? { persons: dataTemple.persons } : {}),
-  };
+      },
+    };
 
-  await axios
+    await axios
-    .post(
+      .post(
-      config.API.reportTemplate + `/${typeFile.value}?folder=command`,
+        config.API.reportTemplate + `/${typeFile.value}?folder=command`,
-      body,
+        body,
-      {
+        {
-        headers: {
+          headers: {
-          accept: "application/pdf",
+            accept: "application/pdf",
-          "content-Type": "application/json",
+            "content-Type": "application/json",
-        },
+          },
-        responseType: "blob",
+          responseType: "blob",
-      }
+        }
-    )
+      )
-    .then(async (res) => {
+      .then(async (res) => {
-      const blob = new Blob([res.data]);
+        const blob = new Blob([res.data]);
-      const objectUrl = URL.createObjectURL(blob);
+        const objectUrl = URL.createObjectURL(blob);
-      const pdfData = await usePDF(`${objectUrl}`);
+        const pdfData = await usePDF(`${objectUrl}`);
 
-      // แสดง PDF หลังจากโหลดเสร็จ
+        // แสดง PDF หลังจากโหลดเสร็จ
-      setTimeout(() => {
+        setTimeout(() => {
-        pdfSrc.value = pdfData.pdf.value;
+          pdfSrc.value = pdfData.pdf.value;
-        numOfPages.value = pdfData.pages.value;
+          numOfPages.value = pdfData.pages.value;
-        isLoadPDF.value = true;
+          isLoadPDF.value = true;
+          hideLoader();
+        }, 1500);
+      })
+      .catch((e) => {
+        // ไม่พบข้อมูล Template
+        messageError($q, "", "ไม่พบข้อมูล Template");
+        isLoadPDF.value = false;
         hideLoader();
-      }, 1500);
+      });
-    })
+  }
-    .catch((e) => {
-      // ไม่พบข้อมูล Template
-      messageError($q, "", "ไม่พบข้อมูล Template");
-      isLoadPDF.value = false;
-      hideLoader();
-    });
 }
 
 /**
@@ -130,7 +129,7 @@ async function uploadTemplate() {
     $q,
     async () => {
       showLoader();
-      const reportName = await `${dataTemplateDetail.value.code}_${type.value}`;
+      const reportName = await `${dataTemplate.value.code}_${type.value}`;
       await axios
         .post(
           config.API.reportTemplate +
@@ -150,7 +149,7 @@ async function uploadTemplate() {
           hideLoader();
 
           // โหลดไฟล์ Template ที่แสดงในหน้า UI ใหม่
-          fetchDocumentTemplate(dataTemplateDetail.value);
+          fetchDocumentTemplate(dataTemplate.value);
           fetchDataTemplate(commandId.value);
         })
         .catch(async (e) => {
@@ -170,8 +169,8 @@ async function uploadTemplate() {
  */
 async function downloadTemplate() {
   const check = await (type.value == "cover"
-    ? dataTemplateDetail.value.fileCover
+    ? dataTemplate.value.fileCover
-    : dataTemplateDetail.value.fileAttachment);
+    : dataTemplate.value.fileAttachment);
   await axios
     .post(
       config.API.reportTemplate + `/${typeFile.value}/download?folder=command`,
@@ -189,7 +188,7 @@ async function downloadTemplate() {
     .then(async (res) => {
       var a = document.createElement("a");
       a.href = URL.createObjectURL(res.data);
-      a.download = `${dataTemplateDetail.value.code}_${type.value}.${typeFile.value}`;
+      a.download = `${dataTemplate.value.code}_${type.value}.${typeFile.value}`;
       a.click();
       hideLoader();
     })
@@ -217,17 +216,16 @@ async function updateReportName(name: string) {
 }
 
 // working on click command list
-watch(dataTemplateDetail, () => {
+watch(
-  fetchDocumentTemplate(dataTemplateDetail.value);
+  () => dataTemplate.value,
-});
+  async (newValue, oldValue) => {
+    await fetchDocumentTemplate(newValue);
+  }
+);
 
 // working on change tab
 onMounted(() => {
-  fetchDocumentTemplate(dataTemplateDetail.value);
+  fetchDocumentTemplate(dataTemplate.value);
-});
-
-defineExpose({
-  fetchDocumentTemplate,
 });
 </script>
 

src/modules/05_command/views/lists.vue

@@ -303,13 +303,12 @@ onMounted(async () => {
             </label>
           </div>
         </q-toolbar>
-
         <q-separator />
         <q-card-section class="q-pa-sm">
           <q-list v-for="(item, index) in listOrder" bordered :key="item.id">
             <q-item
-              clickable
+              :clickable="item.code !== 'C-PM-47'"
-              v-ripple
+              :v-ripple="item.code !== 'C-PM-47'"
               :active="activeCommandId === item.id"
               active-class="my-menu_link"
               @click="selectInbox(item)"
@@ -325,7 +324,7 @@ onMounted(async () => {
               <q-item-section side center @click.stop>
                 <q-icon
                   name="edit"
-                  class="q-pa-none q-ml-xs"
+                  class="q-pa-none q-ml-xs cursor-pointer"
                   color="edit"
                   flat
                   dense