Merge branch 'develop' into dev

src/api/index.ts

@@ -17,7 +17,7 @@ const config = ref<any>({
     MEET_URI: "meet.frappet.com",
     LINK_EVALUATE_PUBLISH: "https://bma-ehr-publish.frappet.synology.me",
     API_REPORT_TEMPLATE_URI:
-      "https://report-server.frappet.synology.me/api/v1/report-template",
+      "https://hrmsbkk.case-collection.com/api/v1/report-template",
   },
   test: {
     API_URI: "http://localhost:5010/api/v1",
@@ -36,10 +36,10 @@ const API_URI = ref<string>(config.value[env.value].API_URI);
 const API_URL_SUPPORT = ref<string>(config.value[env.value].API_URL_SUPPORT);
 const MEET_URI = ref<string>(config.value[env.value].MEET_URI);
 const LINK_EVALUATE_PUBLISH = ref<string>(
-  config.value[env.value].LINK_EVALUATE_PUBLISH
+  config.value[env.value].LINK_EVALUATE_PUBLISH,
 );
 const API_REPORT_TEMPLATE_URI = ref<string>(
-  config.value[env.value].API_REPORT_TEMPLATE_URI
+  config.value[env.value].API_REPORT_TEMPLATE_URI,
 );
 
 export default {

src/api/org/api.org.ts

@@ -175,6 +175,7 @@ export default {
   changePassword: `${org}/keycloak/user/change-password`,
 
   orgAssistance: (id: string) => `${profileOrg}/assistance/${id}`,
+  orgIssues: `${env.API_URI}/org/issues`,
 
   // ตรวจสอบข้อมูลตำแหน่งและเงินเดือน
   profileSalaryTemp: `${profileOrg}/salaryTemp`,

src/components/DialogDebug.vue

@@ -0,0 +1,373 @@
+<script setup lang="ts">
+import { computed, reactive, ref } from "vue";
+import { useQuasar } from "quasar";
+import axios from "axios";
+import { storeToRefs } from "pinia";
+
+import { useCounterMixin } from "@/stores/mixin";
+import { usePositionKeycloakStore } from "@/stores/positionKeycloak";
+import { useDataStore } from "@/stores/data";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+import type { MenuMainList } from "@/modules/01_dashboard/interface/Main";
+
+import DialogHeader from "@/components/DialogHeader.vue";
+
+const $q = useQuasar();
+const store = usePositionKeycloakStore();
+const dataStore = useDataStore();
+const { findOrgName } = store;
+const { dataprofilePosition, menuList } = storeToRefs(dataStore);
+
+const { dialogConfirm, showLoader, hideLoader, messageError, success } =
+  useCounterMixin();
+
+const modal = defineModel<boolean>("modal", {
+  default: false,
+});
+
+interface OptionSelect {
+  label: string;
+  value: string;
+}
+
+const title = computed(() => "แจ้งปัญหาการใช้งานระบบ");
+const orgName = computed(() => findOrgName(dataprofilePosition.value) || "");
+const optionData = computed(() => {
+  return menuList.value.map((menu: MenuMainList) => ({
+    label: menu.title,
+    value: menu.title,
+  }));
+});
+
+const optionsMenu = ref(optionData.value);
+const formData = reactive({
+  title: "",
+  description: "",
+  system: "user",
+  fileAttachments: [] as File[],
+  menu: "",
+  email: "",
+  phone: "",
+});
+
+/** ฟังก์ชันบันทึกข้อมูล */
+function onSubmit() {
+  dialogConfirm($q, async () => {
+    try {
+      showLoader();
+      const payload = {
+        title: formData.title,
+        description: formData.description,
+        system: formData.system,
+        menu: formData.menu,
+        org: orgName.value,
+        email: formData.email,
+        phone: formData.phone,
+      };
+
+      const res = await http.post(config.API.orgIssues, payload);
+
+      const issueCode = res.data.result.codeIssue;
+      await uploadProfile(issueCode);
+      success($q, "บันทึกข้อมูลเรียบร้อย");
+
+      onClose();
+    } catch (error) {
+      messageError($q, error);
+    } finally {
+      hideLoader();
+    }
+  });
+}
+
+/**
+ * ฟังก์ชันเพิ่มไฟล์
+ * @param files ไฟล์ที่ต้องการเพิ่ม
+ */
+async function onAddfile(files: any) {
+  files.forEach((file: any) => {
+    formData.fileAttachments.push(file);
+  });
+}
+
+/**
+ * ฟังก์ชันลบไฟล์
+ * @param files ไฟล์ที่ต้องการลบ
+ */
+async function onRemoveFile(files: any) {
+  files.forEach((file: any) => {
+    const index = formData.fileAttachments.findIndex(
+      (x: any) => x.__key == file.__key,
+    );
+    if (index > -1) {
+      formData.fileAttachments.splice(index, 1);
+    }
+  });
+}
+
+/**
+ * ฟังก์ชันสร้าง url อัปโหลดไฟล์
+ * @param code รหัส issue
+ */
+async function uploadProfile(code: string) {
+  if (formData.fileAttachments.length === 0) {
+    return;
+  }
+  try {
+    const fileName = formData.fileAttachments.map((file) => ({
+      fileName: file.name,
+    }));
+    const res = await http.post(
+      config.API.file("issueAttachments", formData.system, code),
+      {
+        replace: false,
+        fileList: fileName,
+      },
+    );
+
+    for (const file of formData.fileAttachments) {
+      const fileInfo = res.data[file.name];
+      if (fileInfo && fileInfo.uploadUrl) {
+        await uploadFileDoc(fileInfo.uploadUrl, file);
+      }
+    }
+  } catch (e) {
+    messageError($q, e);
+  }
+}
+
+/**
+ * ฟังก์ชันอัปโหลดไฟล์เอกสาร
+ * @param uploadUrl ลิงก์อัปโหลดไฟล์
+ * @param file ไฟล์ที่ต้องการอัปโหลด
+ */
+async function uploadFileDoc(uploadUrl: string, file: any) {
+  try {
+    await axios.put(uploadUrl, file, {
+      headers: {
+        "Content-Type": file.type,
+      },
+    });
+  } catch (e) {
+    messageError($q, e);
+  }
+}
+
+/**
+ * ฟังก์ชันกรองข้อมูลใน select
+ * @param val ค่าที่กรอง
+ * @param update ฟังก์ชันอัปเดตค่าหลังกรอง
+ */
+function filterSelector(val: string, update: Function) {
+  update(() => {
+    if (!val) {
+      optionsMenu.value = optionData.value;
+      return;
+    }
+    optionsMenu.value = optionData.value.filter((item: OptionSelect) =>
+      item.label.toLowerCase().includes(val.toLowerCase()),
+    );
+  });
+}
+
+/** ฟังก์ชันปิด dialog และรีเซ็ตข้อมูล */
+function onClose() {
+  modal.value = false;
+  formData.menu = "";
+  formData.title = "";
+  formData.description = "";
+  formData.fileAttachments = [];
+  formData.email = "";
+  formData.phone = "";
+}
+</script>
+
+<template>
+  <q-dialog v-model="modal" persistent>
+    <q-card style="width: 700px; max-width: 80vw">
+      <q-form greedy @submit.prevent @validation-success="onSubmit">
+        <DialogHeader :tittle="title" :close="onClose" />
+        <q-separator />
+
+        <q-card-section>
+          <div class="row col q-col-gutter-md">
+            <div class="col-12">
+              <q-select
+                dense
+                outlined
+                label="ระบบ"
+                v-model="formData.menu"
+                :options="optionsMenu"
+                class="inputgreen"
+                :rules="[ (val: string) => !!val || 'กรุณาเลือกระบบ' ]"
+                hide-bottom-space
+                emit-value
+                map-options
+                use-input
+                @filter="(inputValue: string,
+              doneFn: Function) => filterSelector(inputValue, doneFn, 
+              )"
+              />
+            </div>
+            <div class="col-12">
+              <q-input
+                dense
+                outlined
+                label="หัวข้อปัญหา"
+                v-model="formData.title"
+                class="inputgreen"
+                :rules="[ (val: string) => !!val || 'กรุณากรอกหัวข้อปัญหา' ]"
+                hide-bottom-space
+              />
+            </div>
+            <div class="col-12">
+              <q-input
+                dense
+                outlined
+                type="textarea"
+                label="รายละเอียดปัญหา"
+                v-model="formData.description"
+                class="inputgreen"
+                :rules="[ (val: string) => !!val || 'กรุณากรอกรายละเอียดปัญหา' ]"
+                hide-bottom-space
+              />
+            </div>
+            <div class="col-12">
+              <q-uploader
+                color="gray"
+                type="file"
+                flat
+                ref="uploader"
+                class="full-width"
+                text-color="dark"
+                accept=".jpg,.png,.pdf,.csv,.doc"
+                bordered
+                label="[ไฟล์ jpg,png,pdf,csv,doc ขนาดไม่เกิน 5MB]"
+                multiple
+                max-file-size="5000000"
+                @added="onAddfile"
+                @removed="onRemoveFile"
+              >
+                <template v-slot:header="scope">
+                  <div
+                    class="row no-wrap items-center q-pa-sm q-gutter-xs text-white"
+                  >
+                    <q-btn
+                      v-if="scope.queuedFiles.length > 0"
+                      icon="clear_all"
+                      @click="scope.removeQueuedFiles"
+                      round
+                      dense
+                      flat
+                    >
+                      <q-tooltip>ลบทั้งหมด</q-tooltip>
+                    </q-btn>
+                    <q-btn
+                      v-if="scope.uploadedFiles.length > 0"
+                      icon="done_all"
+                      @click="scope.removeUploadedFiles"
+                      round
+                      dense
+                      flat
+                    >
+                      <q-tooltip>ลบไฟล์ที่อัปโหลด</q-tooltip>
+                    </q-btn>
+                    <q-spinner
+                      v-if="scope.isUploading"
+                      class="q-uploader__spinner"
+                    />
+                    <div class="col">
+                      <div class="q-uploader__title">
+                        {{ "[ไฟล์ jpg,png,pdf,csv,doc ขนาดไม่เกิน 5MB]" }}
+                      </div>
+                      <div class="q-uploader__subtitle">
+                        {{ scope.uploadSizeLabel }}
+                        /
+                        {{ scope.uploadProgressLabel }}
+                      </div>
+                    </div>
+                    <q-btn
+                      v-if="scope.canAddFiles"
+                      type="a"
+                      icon="add_box"
+                      @click="scope.pickFiles"
+                      round
+                      dense
+                      flat
+                    >
+                      <q-uploader-add-trigger />
+                      <q-tooltip>เลือกไฟล์</q-tooltip>
+                    </q-btn>
+                    <q-btn
+                      v-if="scope.isUploading"
+                      icon="clear"
+                      @click="scope.abort"
+                      round
+                      dense
+                      flat
+                    >
+                      <q-tooltip>ยกเลิกการอัปโหลด</q-tooltip>
+                    </q-btn>
+                  </div>
+                </template>
+              </q-uploader>
+            </div>
+            <div class="col-12">
+              <div class="row col-12 q-col-gutter-sm">
+                <div class="col-xs-12 col-md-6 col-lg-6">
+                  <q-input
+                    dense
+                    outlined
+                    label="อีเมลติดต่อกลับ"
+                    v-model="formData.email"
+                    class="inputgreen"
+                    hide-bottom-space
+                    :rules="[
+                      () =>
+                        !!formData.email ||
+                        !!formData.phone ||
+                        'กรุณากรอกอีเมลหรือเบอร์โทรติดต่อกลับ',
+                    ]"
+                  />
+                </div>
+                <div class="col-xs-12 col-md-6 col-lg-6">
+                  <q-input
+                    dense
+                    outlined
+                    label="เบอร์โทรติดต่อกลับ"
+                    v-model="formData.phone"
+                    class="inputgreen"
+                    hide-bottom-space
+                    :rules="[
+                      () =>
+                        !!formData.email ||
+                        !!formData.phone ||
+                        'กรุณากรอกอีเมลหรือเบอร์โทรติดต่อกลับ',
+                    ]"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </q-card-section>
+
+        <q-separator />
+        <q-card-actions align="right">
+          <q-btn
+            type="submit"
+            for="#submitForm"
+            class="q-px-md items-center"
+            color="public"
+            label="บันทึก"
+          >
+            <q-tooltip>บันทึกข้อมูล</q-tooltip>
+          </q-btn>
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style scoped></style>

src/modules/01_dashboard/views/Dashboard.vue

@@ -8,6 +8,7 @@ import http from "@/plugins/http";
 import { tokenParsed } from "@/plugins/auth";
 import { useCounterMixin } from "@/stores/mixin";
 import { useDataStore } from "@/stores/data";
+import { usePositionKeycloakStore } from "@/stores/positionKeycloak";
 
 import type {
   InboxDetail,
@@ -20,6 +21,7 @@ import PopupDetailInbox from "@/components/PopupDetailInbox.vue";
 
 const $q = useQuasar();
 const dataStore = useDataStore();
+const positionKeycloakStore = usePositionKeycloakStore();
 const mixin = useCounterMixin();
 const { showLoader, hideLoader, date2Thai, messageError } = mixin;
 
@@ -28,123 +30,6 @@ const inboxList = ref<InboxDetail[]>([]); // รายการกล่อง
 const idInboxActive = ref<string>(); // Id ข้อความที่เลือก
 const isLoadingInbox = ref<boolean>(true); // สถานะการโหลดกล่องข้อความ
 
-// รายการเมนูหลักของระบบ
-const filteredItems = computed(() => {
-  const isOfficer = dataStore.officerType === "OFFICER";
-  const conditions: Record<string, boolean> = {
-    ทดลองปฏิบัติหน้าที่ราชการ: dataStore.isProbation,
-    ประเมินบุคคล: isOfficer,
-    ผลงาน: isOfficer,
-    ขอโอน: isOfficer,
-    "ผู้ขอรับการประเมิน (KPI)": isOfficer,
-    "ผู้ประเมิน (KPI)": isOfficer,
-    "ทุนการศึกษา/ฝึกอบรม": isOfficer,
-    การพัฒนารายบุคคล: isOfficer,
-  };
-
-  return items.value.filter((item) => conditions[item.title] ?? true);
-});
-
-const items = ref<MenuMainList[]>([
-  {
-    icon: "mdi-account-group-outline",
-    title: "แผนผังองค์กร",
-    sub: "ดูแผนผังองค์กร",
-    // color: "blue-3",
-    color: "grey-3",
-    path: "/organization-chart",
-    active: false,
-  },
-  {
-    icon: "mdi-clipboard-account-outline",
-    title: "ทะเบียนประวัติ",
-    sub: "ข้อมูลทะเบียนประวัติ",
-    color: "blue-4",
-    path: "/registry",
-    active: false,
-  },
-  {
-    icon: "mdi-clipboard-account-outline",
-    title: "ประเมินบุคคล",
-    sub: "ข้อมูลการประเมินบุคคล",
-    color: "lime-4",
-    path: "/evaluate",
-    active: false,
-  },
-  {
-    icon: "mdi-calendar-account-outline",
-    title: "การลา",
-    sub: "ดู/ลงเวลา ทำเรื่องลา",
-    color: "cyan-3",
-    path: "/leave",
-    active: false,
-  },
-  {
-    icon: "mdi-folder-account-outline",
-    title: "ผลงาน",
-    sub: "ดูผลงาน",
-    color: "light-green-3",
-    path: "/portfolio",
-    active: false,
-  },
-  {
-    icon: "mdi-account-arrow-right-outline",
-    title: "ขอโอน",
-    sub: "ทำเรื่องขอโอนย้าย",
-    color: "deep-purple-3",
-    path: "/transfer",
-    active: false,
-  },
-  {
-    icon: "mdi-scale-balance",
-    title: "อุทธรณ์/ร้องทุกข์",
-    sub: "ทำเรื่องขออุทธรณ์ หรือร้องทุกข์",
-    color: "green-3",
-    path: "/appeal-complain",
-    active: false,
-  },
-  {
-    icon: "mdi-account-box-outline",
-    title: "ผู้ขอรับการประเมิน (KPI)",
-    sub: "ประเมินผลการปฏิบัติหน้าที่ราชการ",
-    color: "red-2",
-    path: "/KPI",
-    active: false,
-  },
-  {
-    icon: "mdi-elevator",
-    title: "ผู้ประเมิน (KPI)",
-    sub: "ประเมินผลการปฏิบัติหน้าที่ราชการ",
-    color: "red-2",
-    path: "/KPI-evaluator",
-    active: false,
-  },
-  {
-    icon: "mdi-school",
-    title: "ทุนการศึกษา/ฝึกอบรม",
-    sub: "รายการทุนการศึกษา/ฝึกอบรม",
-    color: "teal-2",
-    path: "/scholarship",
-    active: false,
-  },
-  {
-    icon: "mdi-human-handsup",
-    title: "การพัฒนารายบุคคล",
-    sub: "Individual Development Plan",
-    color: "orange-3",
-    path: "/IDP",
-    active: false,
-  },
-  {
-    icon: "mdi-poll",
-    title: "ทดลองปฏิบัติหน้าที่ราชการ",
-    sub: "ผลการทดลองปฏิบัติหน้าที่ราชการและแบบสำรวจความคิดเห็น",
-    color: "yellow-3",
-    path: "/probation-report",
-    active: false,
-  },
-]);
-
 /**
  * ฟังก์ชั่นดึงข้อมูลกล่องข้อความ
  * @param index หน้าที่โหลดข้อมูล
@@ -292,7 +177,7 @@ onMounted(async () => {
       <div class="row justify-start q-col-gutter-md">
         <div
           class="col-xs-6 col-sm-4 col-md-4 col-lg-3 col-xl-2 row"
-          v-for="(item, j) in filteredItems"
+          v-for="(item, j) in dataStore.menuList"
           :key="j"
         >
           <q-card v-if="dataStore.isLoadingMenu" bordered class="col-12">

src/modules/10_registry/01_Information/01_Information.vue

@@ -351,7 +351,7 @@ async function onSavePhone() {
             getData();
           });
       },
-      "ยืนยันการแก้ไขเบอร์โทร"
+      "ยืนยันการแก้ไขเบอร์โทร",
     );
   }
 }
@@ -381,7 +381,7 @@ async function onSaveEmail() {
           })
           .finally(() => {});
       },
-      "ยืนยันการแก้ไขอีเมล"
+      "ยืนยันการแก้ไขอีเมล",
     );
   }
 }
@@ -588,7 +588,26 @@ onMounted(async () => {
             </div>
           </div>
           <div class="row">
-            <div class="col-4 text-grey-6 text-weight-medium">อีเมล</div>
+            <div class="col-4 text-grey-6 text-weight-medium">
+              อีเมล
+
+              <q-icon
+                v-if="emailVerify == 'NOT_VERIFIED'"
+                name="mdi-alert-box"
+                color="warning"
+                size="sm"
+              >
+                <q-tooltip>รอยืนยันอีเมล</q-tooltip>
+              </q-icon>
+              <q-icon
+                v-if="emailVerify == 'VERIFIED'"
+                name="mdi-check-decagram"
+                color="green"
+                size="sm"
+              >
+                <q-tooltip>ยืนยันอีเมลแล้ว</q-tooltip>
+              </q-icon>
+            </div>
             <div class="col-8">
               <div class="row q-col-gutter-sm">
                 <div class="col-9">
@@ -606,62 +625,50 @@ onMounted(async () => {
                     @change="isValidEmail = true"
                   />
                 </div>
-                <div v-if="emailVerify == null" class="self-center col-3">
-                  <div v-if="editEmail == false">
-                    <q-btn
-                      dense
-                      flat
-                      round
-                      icon="edit"
-                      color="edit"
-                      @click="() => (editEmail = true)"
-                    >
-                      <q-tooltip>แก้ไขข้อมูล</q-tooltip>
-                    </q-btn>
-                  </div>
-                  <div v-else class="self-center">
-                    <q-btn
-                      :disable="isCheckEmail"
-                      :color="isCheckEmail ? 'grey-6' : 'primary'"
-                      dense
-                      flat
-                      round
-                      icon="save"
-                      @click="onSaveEmail"
-                    >
-                      <q-tooltip>บันทึก</q-tooltip>
-                    </q-btn>
-                    <q-btn
-                      dense
-                      flat
-                      round
-                      icon="undo"
-                      color="red"
-                      @click="
-                        () => {
-                          editEmail = false;
-                          formDataInformation.email = email;
-                          isValidEmail = true;
-                        }
-                      "
-                    >
-                      <q-tooltip>ยกเลิก</q-tooltip>
-                    </q-btn>
-                  </div>
-                </div>
-                <div
-                  v-else-if="emailVerify == 'NOT_VERIFIED'"
-                  class="self-center col-3"
-                >
-                  <q-icon
-                    name="mdi-alert-box"
-                    color="warning"
-                    size="sm"
-                    class="selft-center"
+
+                <!-- <div v-if="emailVerify == null" class="self-center col-3"> -->
+                <div v-if="editEmail == false">
+                  <q-btn
+                    dense
+                    flat
+                    round
+                    icon="edit"
+                    color="edit"
+                    @click="() => (editEmail = true)"
                   >
-                    <q-tooltip>รอยืนยันอีเมล</q-tooltip>
-                  </q-icon>
+                    <q-tooltip>แก้ไขข้อมูล</q-tooltip>
+                  </q-btn>
                 </div>
+                <div v-else class="self-center">
+                  <q-btn
+                    :disable="isCheckEmail"
+                    :color="isCheckEmail ? 'grey-6' : 'primary'"
+                    dense
+                    flat
+                    round
+                    icon="save"
+                    @click="onSaveEmail"
+                  >
+                    <q-tooltip>บันทึก</q-tooltip>
+                  </q-btn>
+                  <q-btn
+                    dense
+                    flat
+                    round
+                    icon="undo"
+                    color="red"
+                    @click="
+                      () => {
+                        editEmail = false;
+                        formDataInformation.email = email;
+                        isValidEmail = true;
+                      }
+                    "
+                  >
+                    <q-tooltip>ยกเลิก</q-tooltip>
+                  </q-btn>
+                </div>
+                <!-- </div> -->
               </div>
             </div>
           </div>

src/modules/10_registry/views/main.vue

@@ -58,7 +58,7 @@ async function onClickDownloadKp7(type: string) {
           store.profileId,
           dataStore.officerType == "OFFICER" ? "profile" : "profile-employee",
         );
-  const fileName = type === "FULL" ? "ทปอ. สามัญ" : "ประวัติแบบย่อ";
+  const fileName = type === "FULL" ? "ทปอ สามัญ" : "ประวัติแบบย่อ";
   await http
     .get(url)
     .then(async (res) => {

src/plugins/genreport.ts

@@ -10,17 +10,13 @@ async function genReport(data: any, fileName: string, type: string = "docx") {
   showLoader();
   await axios
     .post(config.API.reportTemplate + `/docx`, data, {
-      headers:
-        type == "docx"
-          ? {
-              accept:
-                "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
-              "content-Type": "application/json",
-            }
-          : {
-              accept: "application/pdf",
-              "content-Type": "application/json",
-            },
+      headers: {
+        "content-Type": "application/json",
+        accept:
+          type === "docx"
+            ? "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+            : "application/pdf",
+      },
       responseType: "arraybuffer",
     })
     .then((res) => {
@@ -34,10 +30,17 @@ async function genReport(data: any, fileName: string, type: string = "docx") {
         // สร้าง URL สำหรับไฟล์ Blob
         const url = URL.createObjectURL(blob);
 
+        // 1. ตัดนามสกุลเดิมที่ติดมากับ fileName ออก (ถ้ามี)
+        const baseName = fileName.replace(/\.[^/.]+$/, "");
+
+        // 2. กำหนดนามสกุลใหม่ตามเงื่อนไข
+        const extension = type === "docx" ? "docx" : "pdf";
+
         // สร้างลิงก์เพื่อดาวน์โหลดไฟล์
         const link = document.createElement("a");
         link.href = url;
-        link.download = `${fileName}.${type === "docx" ? "docx" : "pdf"}`; // กำหนดชื่อไฟล์ที่จะดาวน์โหลด
+        link.download = `${baseName}.${extension}`;
+        // link.download = `${fileName}.${type === "docx" ? "docx" : "pdf"}`; // กำหนดชื่อไฟล์ที่จะดาวน์โหลด
         document.body.appendChild(link);
         link.click();
 

src/stores/data.ts

@@ -7,6 +7,7 @@ import { useQuasar } from "quasar";
 import { useRegistryInFormationStore } from "@/modules/10_registry/store/registry";
 import { useCounterMixin } from "./mixin";
 import type { ProfileData, DataProfile } from "@/interface/Main";
+import type { MenuMainList } from "@/modules/01_dashboard/interface/Main";
 
 export const useDataStore = defineStore("dataMain", () => {
   const isLoadingMenu = ref<boolean>(false);
@@ -154,6 +155,127 @@ export const useDataStore = defineStore("dataMain", () => {
     return convertEmType(officerType.value);
   }
 
+  // รายการเมนูหลักของระบบ
+  const menuDataMain = ref<MenuMainList[]>([
+    {
+      icon: "mdi-account-group-outline",
+      title: "แผนผังองค์กร",
+      sub: "ดูแผนผังองค์กร",
+      // color: "blue-3",
+      color: "grey-3",
+      path: "/organization-chart",
+      active: false,
+    },
+    {
+      icon: "mdi-clipboard-account-outline",
+      title: "ทะเบียนประวัติ",
+      sub: "ข้อมูลทะเบียนประวัติ",
+      color: "blue-4",
+      path: "/registry",
+      active: false,
+    },
+    {
+      icon: "mdi-clipboard-account-outline",
+      title: "ประเมินบุคคล",
+      sub: "ข้อมูลการประเมินบุคคล",
+      color: "lime-4",
+      path: "/evaluate",
+      active: false,
+    },
+    {
+      icon: "mdi-calendar-account-outline",
+      title: "การลา",
+      sub: "ดู/ลงเวลา ทำเรื่องลา",
+      color: "cyan-3",
+      path: "/leave",
+      active: false,
+    },
+    {
+      icon: "mdi-folder-account-outline",
+      title: "ผลงาน",
+      sub: "ดูผลงาน",
+      color: "light-green-3",
+      path: "/portfolio",
+      active: false,
+    },
+    {
+      icon: "mdi-account-arrow-right-outline",
+      title: "ขอโอน",
+      sub: "ทำเรื่องขอโอนย้าย",
+      color: "deep-purple-3",
+      path: "/transfer",
+      active: false,
+    },
+    {
+      icon: "mdi-scale-balance",
+      title: "อุทธรณ์/ร้องทุกข์",
+      sub: "ทำเรื่องขออุทธรณ์ หรือร้องทุกข์",
+      color: "green-3",
+      path: "/appeal-complain",
+      active: false,
+    },
+    {
+      icon: "mdi-account-box-outline",
+      title: "ผู้ขอรับการประเมิน (KPI)",
+      sub: "ประเมินผลการปฏิบัติหน้าที่ราชการ",
+      color: "red-2",
+      path: "/KPI",
+      active: false,
+    },
+    {
+      icon: "mdi-elevator",
+      title: "ผู้ประเมิน (KPI)",
+      sub: "ประเมินผลการปฏิบัติหน้าที่ราชการ",
+      color: "red-2",
+      path: "/KPI-evaluator",
+      active: false,
+    },
+    {
+      icon: "mdi-school",
+      title: "ทุนการศึกษา/ฝึกอบรม",
+      sub: "รายการทุนการศึกษา/ฝึกอบรม",
+      color: "teal-2",
+      path: "/scholarship",
+      active: false,
+    },
+    {
+      icon: "mdi-human-handsup",
+      title: "การพัฒนารายบุคคล",
+      sub: "Individual Development Plan",
+      color: "orange-3",
+      path: "/IDP",
+      active: false,
+    },
+    {
+      icon: "mdi-poll",
+      title: "ทดลองปฏิบัติหน้าที่ราชการ",
+      sub: "ผลการทดลองปฏิบัติหน้าที่ราชการและแบบสำรวจความคิดเห็น",
+      color: "yellow-3",
+      path: "/probation-report",
+      active: false,
+    },
+  ]);
+
+  // กรองเมนู ตามประเภทบุคลากร
+  const menuList = computed(() => {
+    const isOfficer = officerType.value === "OFFICER";
+    const conditions: Record<string, boolean> = {
+      ทดลองปฏิบัติหน้าที่ราชการ: isProbation.value,
+      ประเมินบุคคล: isOfficer,
+      ผลงาน: isOfficer,
+      ขอโอน: isOfficer,
+      "ผู้ขอรับการประเมิน (KPI)": isOfficer,
+      "ผู้ประเมิน (KPI)": isOfficer,
+      "ทุนการศึกษา/ฝึกอบรม": isOfficer,
+      การพัฒนารายบุคคล: isOfficer,
+    };
+
+    const data = menuDataMain.value.filter(
+      (item: MenuMainList) => conditions[item.title] ?? true,
+    );
+    return data;
+  });
+
   return {
     count,
     doubleCount,
@@ -181,6 +303,8 @@ export const useDataStore = defineStore("dataMain", () => {
     dataprofilePosition,
     isLoadingMenu,
     isLoadingProfile,
+
+    menuList,
   };
 });
 

src/stores/positionKeycloak.ts

@@ -0,0 +1,53 @@
+import { defineStore } from "pinia";
+
+export const usePositionKeycloakStore = defineStore("positionKeycloak", () => {
+  function findOrgName(obj: any) {
+    if (obj) {
+      let name =
+        obj.child4 != null &&
+        obj.child4 !== "" &&
+        obj.child3 != null &&
+        obj.child3 !== ""
+          ? obj.child4 + (obj.child3 ? "/" : "")
+          : obj.child4 != null && obj.child4 !== ""
+          ? obj.child4
+          : "";
+
+      name +=
+        obj.child3 != null &&
+        obj.child3 !== "" &&
+        obj.child2 != null &&
+        obj.child2 !== ""
+          ? obj.child3 + (obj.child2 ? "/" : "")
+          : obj.child3 != null && obj.child3 !== ""
+          ? obj.child3
+          : "";
+
+      name +=
+        obj.child2 != null &&
+        obj.child2 !== "" &&
+        obj.child1 != null &&
+        obj.child1 !== ""
+          ? obj.child2 + (obj.child1 ? "/" : "")
+          : obj.child2 != null && obj.child2 !== ""
+          ? obj.child2
+          : "";
+
+      name +=
+        obj.child1 != null &&
+        obj.child1 !== "" &&
+        obj.root != null &&
+        obj.root !== ""
+          ? obj.child1 + (obj.root ? "/" : "")
+          : obj.child1 != null && obj.child1 !== ""
+          ? obj.child1
+          : "";
+      name += obj.root != null && obj.root !== "" ? obj.root : "";
+      return name == "" ? "-" : name;
+    } else {
+      return "";
+    }
+  }
+
+  return { findOrgName };
+});

src/views/MainLayout.vue

@@ -19,6 +19,7 @@ import { useDataStore } from "@/stores/data";
 import { useKpiDataStore } from "@/modules/08_KPI/store";
 
 import DialogResetPass from "@/components/DialogResetPass.vue";
+import DialogDebug from "@/components/DialogDebug.vue";
 
 // landing page config url
 const configParam = {
@@ -50,6 +51,7 @@ const currentRouteName = router.currentRoute.value.name;
 const tab = ref<any>(currentRouteName);
 const isSsoToken = ref(false);
 const modalResetPass = ref(false); // ตัวแปรควบคุมการเปิดปิด Dialog เปลี่ยนรหัสผ่าน
+const modalDebug = ref(false); // ตัวแปรควบคุมการเปิดปิด Dialog แจ้งปัญหา
 
 /**
  * เรียกฟังก์ชันทั้งหมดตอนเรียกใช้ไฟล์นี้
@@ -165,7 +167,7 @@ const doLogout = () => {
       logoutSSO();
     },
     "ยืนยันการออกจากระบบ",
-    "ต้องการออกจากระบบใช่หรือไม่"
+    "ต้องการออกจากระบบใช่หรือไม่",
   );
 };
 
@@ -216,7 +218,7 @@ watch(
       notiList.value = updatedNotifications;
       fetchTotolNotificate();
     }
-  }
+  },
 );
 
 const thaiOptions: Intl.DateTimeFormatOptions = {
@@ -260,7 +262,7 @@ watch(
   () => route.name,
   (newVal) => {
     tab.value = newVal;
-  }
+  },
 );
 </script>
 
@@ -416,7 +418,7 @@ watch(
                       {{
                         new Date(item.receiveDate).toLocaleTimeString(
                           "th-TH",
-                          thaiOptions
+                          thaiOptions,
                         )
                       }}
                       น.</q-item-label
@@ -536,6 +538,16 @@ watch(
               </q-item-section>
               <q-item-section> Landing Page </q-item-section>
             </q-item>
+            <q-item clickable v-close-popup @click.prevent="modalDebug = true">
+              <q-item-section avatar style="min-width: 30px">
+                <q-icon color="yellow-8" size="18px" name="mdi-bug" />
+              </q-item-section>
+              <q-item-section
+                ><q-item-label
+                  >แจ้งปัญหาการใช้งานระบบ
+                </q-item-label></q-item-section
+              >
+            </q-item>
 
             <q-item clickable v-close-popup @click="onInfo">
               <q-item-section avatar style="min-width: 30px">
@@ -592,6 +604,20 @@ watch(
                   </q-item-section>
                   <q-item-section> Landing Page </q-item-section>
                 </q-item>
+                <q-item
+                  clickable
+                  v-close-popup
+                  @click.prevent="modalDebug = true"
+                >
+                  <q-item-section avatar style="min-width: 30px">
+                    <q-icon color="yellow-8" size="18px" name="mdi-bug" />
+                  </q-item-section>
+                  <q-item-section
+                    ><q-item-label
+                      >แจ้งปัญหาการใช้งานระบบ
+                    </q-item-label></q-item-section
+                  >
+                </q-item>
                 <q-item clickable v-close-popup @click="onInfo">
                   <q-item-section avatar style="min-width: 30px">
                     <q-icon
@@ -744,6 +770,7 @@ watch(
   </q-layout>
 
   <DialogResetPass v-model="modalResetPass" />
+  <DialogDebug v-model:modal="modalDebug" />
 </template>
 
 <style>