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 { showLoader, hideLoader, messageError, date2Thai } = mixin;
+const { 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() {
-//   router.push(`/registry-${empType.value}/${props.id}`);
-//   modal.value = 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;
+    });
+}
 
 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
-                      class="col-xs-6 col-md-6"
-                      v-if="props.type !== 'employee'"
-                    >
+                    <div class="col-xs-6 col-md-6">
                       <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
-                      class="col-xs-6 col-md-6"
-                      v-if="props.type !== 'employee'"
-                    >
+                    <div class="col-xs-6 col-md-6">
                       <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>(
-  "dataTemplateDetail",
-  {
+const dataTemplate = defineModel<DataTemplateDetail>("dataTemplateDetail", {
   required: true,
-  }
-);
+});
 
 const documentFile = ref<File | null>(null); // file อัปโหลด
 const isLoadPDF = ref<boolean>(false); // Loading display pdf
@@ -57,11 +54,12 @@ const { fetchDataTemplate } = defineProps({
  * @param dataTemple รายละเอียดคำสั่ง
  */
 async function fetchDocumentTemplate(dataTemple: DataTemplateDetail) {
+  if (dataTemple) {
     showLoader();
     isLoadPDF.value = false;
     pdfSrc.value = undefined;
     page.value = 1;
-  const reportName = await `${dataTemplateDetail.value.code}_${type.value}`;
+    const reportName = `${dataTemple.code}_${type.value}`;
     const body = {
       template: reportName,
       reportName: `${typeFile.value}-report`,
@@ -121,6 +119,7 @@ async function fetchDocumentTemplate(dataTemple: DataTemplateDetail) {
         hideLoader();
       });
   }
+}
 
 /**
  * ฟังชั่นอัปโหลดไฟล์ Template คำสั่ง/บัญชีแนบท้าย
@@ -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
-    : dataTemplateDetail.value.fileAttachment);
+    ? dataTemplate.value.fileCover
+    : 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, () => {
-  fetchDocumentTemplate(dataTemplateDetail.value);
-});
+watch(
+  () => dataTemplate.value,
+  async (newValue, oldValue) => {
+    await fetchDocumentTemplate(newValue);
+  }
+);
 
 // working on change tab
 onMounted(() => {
-  fetchDocumentTemplate(dataTemplateDetail.value);
-});
-
-defineExpose({
-  fetchDocumentTemplate,
+  fetchDocumentTemplate(dataTemplate.value);
 });
 </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
-              v-ripple
+              :clickable="item.code !== 'C-PM-47'"
+              :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