Merge branch 'develop' into nice_dev

src/modules/12_Evaluate/components/Detail/Tab2.vue

@@ -1,122 +0,0 @@
-<script setup lang="ts">
-import { ref, onMounted } from "vue";
-import { useQuasar } from "quasar";
-
-import Stepper from "@/modules/12_evaluate/components/Detail/Stepper.vue";
-import Step1 from "@/modules/12_evaluate/components/Detail/step/step1.vue";
-import Step2 from "@/modules/12_evaluate/components/Detail/step/step2.vue";
-import Step3 from "@/modules/12_evaluate/components/Detail/step/step3.vue";
-import Step4 from "@/modules/12_evaluate/components/Detail/step/step4.vue";
-import Step5 from "@/modules/12_evaluate/components/Detail/step/step5.vue";
-import Step6 from "@/modules/12_evaluate/components/Detail/step/step6.vue";
-import Step7 from "@/modules/12_evaluate/components/Detail/step/step7.vue";
-import Step8 from "@/modules/12_evaluate/components/Detail/step/step8.vue";
-import Step9 from "@/modules/12_evaluate/components/Detail/step/step9.vue";
-
-import ViewStep1 from "@/modules/12_evaluate/components/Detail/viewstep/viewStep1.vue";
-import ViewStep3 from "@/modules/12_evaluate/components/Detail/viewstep/viewStep3.vue";
-import ViewStep7 from "@/modules/12_evaluate/components/Detail/viewstep/viewStep7.vue";
-
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
-import { useCounterMixin } from "@/stores/mixin";
-
-const store = useEvaluateDetailStore();
-const mixin = useCounterMixin();
-const { dialogConfirm } = mixin;
-
-const $q = useQuasar();
-
-function onCilckNextStep() {
-  store.step < 9 &&
-    dialogConfirm($q, () => {
-      store.step++;
-    });
-}
-
-function onCilckprPeviousStep() {
-  store.step > 1 &&
-    dialogConfirm($q, () => {
-      store.step--;
-    });
-}
-
-onMounted(() => {
-  store.step = 1;
-});
-</script>
-
-<template>
-  <div class="row q-col-gutter-md">
-    <div class="col-xs-12 col-sm-3">
-      <div class="toptitle">ประเมินชำนาญการพิเศษ</div>
-      <Stepper />
-    </div>
-
-    <div class="col-xs-12 col-sm-9">
-      <div class="toptitle">
-        {{ store.step }}.{{ store.titel[store.step - 1] }}
-      </div>
-      <div class="row q-col-gutter-md col-12">
-        <div
-          :class="
-            store.step === 2 ||
-            store.step === 4 ||
-            store.step === 5 ||
-            store.step === 6 ||
-            store.step === 8 ||
-            store.step === 9
-              ? 'col-xs-12 col-sm-12 row'
-              : 'col-xs-12 col-sm-5 row'
-          "
-        >
-          <q-card flat bordered class="col-12 q-pa-md">
-            <q-card-section>
-              <Step1 v-if="store.step === 1" />
-              <Step2 v-if="store.step === 2" />
-              <Step3 v-if="store.step === 3" />
-              <Step4 v-if="store.step === 4" />
-              <Step5 v-if="store.step === 5" />
-              <Step6 v-if="store.step === 6" />
-              <Step7 v-if="store.step === 7" />
-              <Step8 v-if="store.step === 8" />
-              <Step9 v-if="store.step === 9" />
-            </q-card-section>
-          </q-card>
-        </div>
-        <div
-          class="col-xs-12 col-sm-7 row"
-          v-if="store.step === 1 || store.step === 3 || store.step === 7"
-        >
-          <q-card flat bordered class="col-12">
-            <q-card-section>
-              <ViewStep1 v-if="store.step === 1" />
-              <ViewStep3 v-if="store.step === 3" />
-              <ViewStep7 v-if="store.step === 7" /> </q-card-section
-          ></q-card>
-        </div>
-      </div>
-      <div class="q-mt-md q-gutter-md" align="right">
-        <q-btn
-          v-if="store.step !== 1"
-          unelevated
-          outline
-          label="ย้อนกลับ"
-          color="public"
-          @click="onCilckprPeviousStep"
-        />
-        <q-btn
-          unelevated
-          label="ดำเนินการต่อ"
-          color="public"
-          @click="onCilckNextStep"
-        />
-      </div>
-    </div>
-  </div>
-</template>
-
-<style>
-.q-stepper--vertical .q-stepper__step-inner {
-  padding: 0;
-}
-</style>

src/modules/12_evaluate/components/Detail/viewstep/viewStep1.vue

@@ -1,7 +0,0 @@
-<script setup lang="ts"></script>
-
-<template>
-  <div>ข้อมูลคุณสมบัติ</div>
-</template>
-
-<style scoped></style>

src/modules/12_evaluate/store/Evaluate.ts

@@ -1,149 +0,0 @@
-import { defineStore } from "pinia";
-import { ref } from "vue";
-import type { QTableProps } from "quasar";
-import type { DataOption } from "@/modules/12_Evaluate/interface/index/Main";
-import { useCounterMixin } from "@/stores/mixin";
-
-const mixin = useCounterMixin();
-const { date2Thai } = mixin;
-export const useEvalutuonStore = defineStore("EvalutuonStore", () => {
-  /** function สถานะ*/
-  function convertStatus(val: string) {
-    switch (val) {
-      case "CHECK_SPEC":
-        return "ตรวจสอบคุณสมบัติด้วยตนเอง";
-      case "PREPARE_DOC_V1":
-        return "จัดเตรียมเอกสารเล่ม";
-      case "CHECK_DOC_V1":
-        return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
-      case "WAIT_CHECK_DOC_V1":
-        return "รอตรวจสอบคุณสมบัติ";
-      case "ANNOUNCE_WEB":
-        return "ประกาศบนเว็บไซต์";
-      case "PREPARE_DOC_V2":
-        return "จัดเตรียมเอกสารเล่ม";
-      case "WAIT_CHECK_DOC_V2":
-        return "รอพิจารณาผลการประเมิน";
-      case "CHECK_DOC_V2":
-        return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
-      case "DONE":
-        return "เสร็จสิ้น";
-    }
-  }
-
-  // ตรวจสอบคุณสมบัติด้วยตนเอง -> CHECK_SPEC
-  // จัดเตรียมเอกสารเล่ม 1-> PREPARE_DOC_V1
-  // ตรวจสอบความถูกต้องของเอกสารเล่ม 1 -> CHECK_DOC_V1
-  // รอตรวจสอบคุณสมบัติ -> WAIT_CHECK_DOC_V1
-  // ประกาศบนเว็บไซต์ -> ANNOUNCE_WEB
-  // จัดเตรียมเอกสารเล่ม 2 -> PREPARE_DOC_V2
-  // ตรวจสอบความถูกต้องของเอกสารเล่ม 2 -> CHECK_DOC_V2
-  // รอพิจารณาผลการประเมิน -> WAIT_CHECK_DOC_V2
-  // เสร็จสิ้น -> DONE
-
-  const visibleColumns = ref<String[]>([
-    "citizanId",
-    "fullName",
-    "position",
-    "level",
-    "positionNumber",
-    "agency",
-    "status",
-  ]);
-  const rows = ref<any[]>([]);
-  function fetchData(data: any[]) {
-    const dataList: any[] = data.map((data: any) => ({
-      citizanId: data.citizanId,
-      fullName: data.fullName,
-      position: data.position,
-      level: data.level,
-      positionNumber: data.positionNumber,
-      agency: data.agency,
-      status: convertStatus(data.status),
-    }));
-    rows.value = dataList;
-    console.log(dataList);
-  }
-
-  const columns = ref<QTableProps["columns"]>([
-    {
-      name: "citizanId",
-      align: "center",
-      label: "เลขประจำตัวประชาชน",
-      sortable: false,
-      field: "citizanId",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-    },
-    {
-      name: "fullName",
-      align: "left",
-      label: "ชื่อ-นามสกุล",
-      sortable: true,
-      field: "fullName",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-    },
-    {
-      name: "position",
-      align: "left",
-      label: "ตำแหน่ง",
-      sortable: true,
-      field: "position",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-      name: "level",
-      align: "left",
-      label: "ระดับ",
-      sortable: true,
-      field: "level",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-      name: "positionNumber",
-      align: "left",
-      label: "ตำแหน่งเลขที่",
-      sortable: true,
-      field: "positionNumber",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-      name: "agency",
-      align: "left",
-      label: "สังกัด",
-      sortable: true,
-      field: "agency",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-      name: "status",
-      align: "left",
-      label: "สถานะ(ตรวจสอบคุณสมบัติ)",
-      sortable: true,
-      field: "status",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-    },
-  ]);
-
-  return {
-    visibleColumns,
-    columns,
-    rows,
-    convertStatus,
-    fetchData,
-  };
-});

src/modules/12_evaluatePersonal/components/Detail/Stepper.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref } from "vue";
 
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
 
 const store = useEvaluateDetailStore();
 </script>

src/modules/12_evaluatePersonal/components/Detail/Tab1.vue

@@ -2,22 +2,22 @@
 import { onMounted } from "vue";
 import { useQuasar } from "quasar";
 
-import Stepper from "@/modules/12_evaluate/components/Detail/Stepper.vue";
+import Stepper from "@/modules/12_evaluatePersonal/components/Detail/Stepper.vue";
-import Step1 from "@/modules/12_evaluate/components/Detail/step/step1.vue";
+import Step1 from "@/modules/12_evaluatePersonal/components/Detail/step/step1.vue";
-import Step2 from "@/modules/12_evaluate/components/Detail/step/step2.vue";
+import Step2 from "@/modules/12_evaluatePersonal/components/Detail/step/step2.vue";
-import Step3 from "@/modules/12_evaluate/components/Detail/step/step3.vue";
+import Step3 from "@/modules/12_evaluatePersonal/components/Detail/step/step3.vue";
-import Step4 from "@/modules/12_evaluate/components/Detail/step/step4.vue";
+import Step4 from "@/modules/12_evaluatePersonal/components/Detail/step/step4.vue";
-import Step5 from "@/modules/12_evaluate/components/Detail/step/step5.vue";
+import Step5 from "@/modules/12_evaluatePersonal/components/Detail/step/step5.vue";
-import Step6 from "@/modules/12_evaluate/components/Detail/step/step6.vue";
+import Step6 from "@/modules/12_evaluatePersonal/components/Detail/step/step6.vue";
-import Step7 from "@/modules/12_evaluate/components/Detail/step/step7.vue";
+import Step7 from "@/modules/12_evaluatePersonal/components/Detail/step/step7.vue";
-import Step8 from "@/modules/12_evaluate/components/Detail/step/step8.vue";
+import Step8 from "@/modules/12_evaluatePersonal/components/Detail/step/step8.vue";
-import Step9 from "@/modules/12_evaluate/components/Detail/step/step9.vue";
+import Step9 from "@/modules/12_evaluatePersonal/components/Detail/step/step9.vue";
 
-import ViewStep1 from "@/modules/12_evaluate/components/Detail/viewstep/viewStep1.vue";
+import ViewStep1 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue";
-import ViewStep3 from "@/modules/12_evaluate/components/Detail/viewstep/viewStep3.vue";
+import ViewStep3 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep3.vue";
-import ViewStep7 from "@/modules/12_evaluate/components/Detail/viewstep/viewStep7.vue";
+import ViewStep7 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep7.vue";
 
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
 import { useCounterMixin } from "@/stores/mixin";
 
 const store = useEvaluateDetailStore();
@@ -67,21 +67,8 @@ onMounted(() => {
 
     <div class="col-xs-12 col-sm-9">
       <div class="col-12 row">
-        <div class="col-9">
+        <div class="toptitle">
-          <div class="toptitle">
+          {{ store.step }}.{{ store.titel[store.step - 1] }}
-            {{ store.step }}.{{ store.titel[store.step - 1] }}
-          </div>
-        </div>
-        <div v-if="store.step === 1" class="col-3 text-right">
-          <q-btn
-            :href="externalLink"
-            target="_blank"
-            outline
-            color="blue"
-            no-caps
-          >
-            ตรวจสอบคุณสมบัติกับ ก.พ.
-          </q-btn>
         </div>
       </div>
       <div class="row q-col-gutter-md col-12">

src/modules/12_evaluatePersonal/components/Detail/Tab2.vue

@@ -0,0 +1,62 @@
+<script setup lang="ts">
+import { ref, onMounted } from "vue";
+import { useQuasar } from "quasar";
+
+import Stepper from "@/modules/12_evaluatePersonal/components/Detail/Stepper.vue";
+import Step1 from "@/modules/12_evaluatePersonal/components/Detail/step/step1.vue";
+import Step2 from "@/modules/12_evaluatePersonal/components/Detail/step/step2.vue";
+import Step3 from "@/modules/12_evaluatePersonal/components/Detail/step/step3.vue";
+import Step4 from "@/modules/12_evaluatePersonal/components/Detail/step/step4.vue";
+import Step5 from "@/modules/12_evaluatePersonal/components/Detail/step/step5.vue";
+import Step6 from "@/modules/12_evaluatePersonal/components/Detail/step/step6.vue";
+import Step7 from "@/modules/12_evaluatePersonal/components/Detail/step/step7.vue";
+import Step8 from "@/modules/12_evaluatePersonal/components/Detail/step/step8.vue";
+import Step9 from "@/modules/12_evaluatePersonal/components/Detail/step/step9.vue";
+
+import ViewStep1 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue";
+import ViewStep3 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep3.vue";
+import ViewStep7 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep7.vue";
+
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
+import { useCounterMixin } from "@/stores/mixin";
+
+const store = useEvaluateDetailStore();
+const mixin = useCounterMixin();
+const { dialogConfirm } = mixin;
+
+const $q = useQuasar();
+
+function onCilckNextStep() {
+  store.step < 9 &&
+    dialogConfirm($q, () => {
+      store.step++;
+    });
+}
+
+function onCilckprPeviousStep() {
+  store.step > 1 &&
+    dialogConfirm($q, () => {
+      store.step--;
+    });
+}
+
+onMounted(() => {
+  store.step = 1;
+});
+</script>
+
+<template>
+  <div class="row col-12">
+    <div class="toptitle">กรรมการและการประชุม</div>
+
+    <div class="row col-12">
+      <q-card> xx </q-card>
+    </div>
+  </div>
+</template>
+
+<style>
+.q-stepper--vertical .q-stepper__step-inner {
+  padding: 0;
+}
+</style>

src/modules/12_evaluatePersonal/components/Detail/step/step3.vue

@@ -2,7 +2,7 @@
 import { reactive, ref } from "vue";
 
 import { useCounterMixin } from "@/stores/mixin";
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
 
 const store = useEvaluateDetailStore();
 const mixin = useCounterMixin();

src/modules/12_evaluatePersonal/components/Detail/step/step6.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import ViewPDF from "@/modules/12_evaluate/components/Detail/viewstep/viewPDF.vue";
+import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";
 
 const fileEvaluation1 = ref<any>();
 

src/modules/12_evaluatePersonal/components/Detail/step/step7.vue

@@ -2,7 +2,7 @@
 import { reactive, ref } from "vue";
 
 import { useCounterMixin } from "@/stores/mixin";
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
 
 const store = useEvaluateDetailStore();
 const mixin = useCounterMixin();

src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue

@@ -0,0 +1,304 @@
+<script setup lang="ts">
+import { storeToRefs } from "pinia";
+import { useEvalutuonStore } from "@/modules/12_evaluatePersonal/store/Evaluate";
+
+const storageEvalutuon = useEvalutuonStore();
+const {
+  rows,
+  columnsLicense,
+  columnPeriodhistory,
+  columnTrainingHistory,
+  columnProjectsProposed,
+} = storeToRefs(storageEvalutuon);
+</script>
+
+<template>
+  <q-card class="bg-grey-2">
+    <div class="text-weight-bold row items-center">
+      <span class="q-ml-lg q-my-sm">ข้อมูลส่วนตัว</span>
+    </div>
+
+    <q-separator />
+
+    <q-card-actions class="q-ml-md">
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="นาย" label="คำนำหน้าชื่อ" />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input
+          borderless
+          readonly
+          model-value="ธนพนธ์ แสงจันทร์"
+          label="ชื่อ - นามสกุล"
+        />
+      </div>
+
+      <div class="col-xs-6 col-sm-6 col-md-6">
+        <q-input
+          borderless
+          model-value="19/03/44"
+          readonly
+          label="วันเดือนปีเกิด"
+        >
+          <template v-slot:prepend>
+            <q-icon class="size-icon" name="o_calendar_today" />
+          </template>
+        </q-input>
+      </div>
+
+   
+    </q-card-actions>
+
+    <q-card-actions class="q-ml-md">
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="ไม่มี" label="ตำแหน่ง" />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input
+          borderless
+          readonly
+          model-value="กย.11"
+          label="ตำแหน่งเลขที่"
+        />
+      </div>
+
+      <div class="col-xs-9 col-sm-6 col-md-6">
+        <q-input
+          borderless
+          readonly
+          model-value="หน่วยใหม่กับหน่วยเก่า"
+          label="สังกัด"
+        />
+      </div>
+    </q-card-actions>
+
+    <q-card-actions class="q-ml-md">
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="" label="เงินเดือน" />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="" label="ระดับปัจจุบัน" />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="" label="ระดับที่ประเมิน" />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="1000 ปี" label="อายุราชการ" />
+      </div>
+    </q-card-actions>
+  </q-card>
+
+  <q-card class="bg-grey-2 q-mt-xl">
+    <div class=" text-weight-bold row items-center">
+      <span class="q-ml-lg q-my-sm">ประวัติการศึกษา</span>
+    </div>
+
+    <q-separator />
+
+    <q-card-actions class="q-ml-md">
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input
+          borderless
+          readonly
+          model-value="ปริญญาตรี"
+          label="ระดับศึกษา"
+        />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input
+          borderless
+          readonly
+          model-value="มหาวิทยาลัยก."
+          label="สถานศึกษา"
+        />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless model-value="19/03/44" readonly label="ตั้งแต่">
+          <template v-slot:prepend>
+            <q-icon class="size-icon" name="o_calendar_today" />
+          </template>
+        </q-input>
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless model-value="19/03/44" readonly label="ถึง">
+          <template v-slot:prepend>
+            <q-icon class="size-icon" name="o_calendar_today" />
+          </template>
+        </q-input>
+      </div>
+    </q-card-actions>
+
+    <q-card-actions class="q-ml-md">
+      <div class="col-xs-6 col-sm-6 col-md-6">
+        <q-input
+          borderless
+          model-value="19/03/44"
+          readonly
+          label="วันทราสำเร็จการศึกษา"
+        >
+          <template v-slot:prepend>
+            <q-icon class="size-icon" name="o_calendar_today" />
+          </template>
+        </q-input>
+      </div>
+
+      <div class="col-xs-6 col-sm-6 col-md-6">
+        <q-input
+          borderless
+          readonly
+          model-value="ปริญญาตรี"
+          label="วุฒิการศึกษาในตําแหน่ง"
+        />
+      </div>
+
+      <div class="col-xs-6 col-sm-6 col-md-6">
+        <q-input
+          borderless
+          readonly
+          model-value="ปริญญาตรี"
+          label="วุฒิการศึกษา"
+        />
+      </div>
+
+      <div class="col-xs-6 col-sm-6 col-md-6">
+        <q-input borderless readonly model-value="-" label="สาขาวิชา/ทาง" />
+      </div>
+    </q-card-actions>
+
+    <q-card-actions class="q-ml-md">
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="-" label="ทุน" />
+      </div>
+
+      <div class="col-xs-6 col-sm-3 col-md-3">
+        <q-input borderless readonly model-value="3.33" label="เกรดเฉลี่ย" />
+      </div>
+
+      <div class="col-xs-6 col-sm-6 col-md-6">
+        <q-input borderless readonly model-value="ไทย" label="ประเทศ" />
+      </div>
+    </q-card-actions>
+  </q-card>
+
+  <q-card class="bg-grey-2 q-mt-xl">
+    <div class=" text-weight-bold row items-center">
+      <span class="q-ml-lg q-my-sm">ใบอนุญาตประกอบวิชาชีพ</span>
+    </div>
+
+    <q-separator />
+
+    <q-card-actions class="q-ma-md">
+      <div class="col-xs-12 col-sm-12 col-md-12">
+        <q-table
+          table-header-class="bg-grey-4 "
+          flat
+          bordered
+          :rows="rows"
+          :columns="columnsLicense"
+        >
+        </q-table>
+      </div>
+    </q-card-actions>
+  </q-card>
+
+  <q-card class="bg-grey-2 q-mt-xl">
+    <div class=" text-weight-bold row items-center">
+      <span class="q-ml-lg q-my-sm">ประวัติการรับราชการ</span>
+    </div>
+
+    <q-separator />
+
+    <q-card-actions class="q-ma-md">
+      <div class="col-xs-12 col-sm-12 col-md-12">
+        <q-table
+          table-header-class="bg-grey-4 "
+          flat
+          bordered
+          :rows="rows"
+          :columns="columnPeriodhistory"
+        >
+        </q-table>
+      </div>
+    </q-card-actions>
+  </q-card>
+
+  <q-card class="bg-grey-2 q-mt-xl">
+    <div class=" text-weight-bold row items-center">
+      <span class="q-ml-lg q-my-sm">ประวัติการฝึกอบรมดูงาน</span>
+    </div>
+
+    <q-separator />
+
+    <q-card-actions class="q-ma-md">
+      <div class="col-xs-12 col-sm-12 col-md-12">
+        <q-table
+          table-header-class="bg-grey-4 "
+          flat
+          bordered
+          :rows="rows"
+          :columns="columnTrainingHistory"
+        >
+        </q-table>
+      </div>
+    </q-card-actions>
+  </q-card>
+
+  <q-card class="bg-grey-2 q-mt-xl">
+    <div class=" text-weight-bold row items-center">
+      <span class="q-ml-lg q-my-sm">ประสบการณ์ในการปฏิบัติงาน</span>
+    </div>
+
+    <q-separator />
+
+    <q-card-actions class="q-ma-md">
+      <div class="col-xs-12 col-sm-12 col-md-12">
+        <q-table
+          table-header-class="bg-grey-4 "
+          flat
+          bordered
+          :rows="rows"
+          :columns="columnTrainingHistory"
+        >
+        </q-table>
+      </div>
+    </q-card-actions>
+  </q-card>
+
+  <q-card class="bg-grey-2 q-mt-xl">
+    <div class=" text-weight-bold row items-center">
+      <span class="q-ml-lg q-my-sm">ผลงานทีเคยเสนอขอประเมิน (ถ้ามี)</span>
+    </div>
+
+    <q-separator />
+
+    <q-card-actions class="q-ma-md">
+      <div class="col-xs-12 col-sm-12 col-md-12">
+        <q-table
+          table-header-class="bg-grey-4 "
+          flat
+          bordered
+          :rows="rows"
+          :columns="columnProjectsProposed"
+        >
+        </q-table>
+      </div>
+    </q-card-actions>
+  </q-card>
+</template>
+
+<style scoped lang="scss">
+
+.size-icon {
+    font-size: 20px; /* ปรับขนาดตามที่คุณต้องการ */
+  }
+
+</style>
+@/modules/12_evaluatePersonal/store/evaluate

src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep3.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import ViewPDF from "@/modules/12_evaluate/components/Detail/viewstep/viewPDF.vue";
+import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";
 
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
 
 const store = useEvaluateDetailStore();
 </script>

src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep7.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import ViewPDF from "@/modules/12_evaluate/components/Detail/viewstep/viewPDF.vue";
+import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";
 
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
 
 const store = useEvaluateDetailStore();
 </script>

src/modules/12_evaluatePersonal/router.ts

@@ -1,6 +1,6 @@
-const mainPage = () => import("@/modules/12_evaluate/views/MainPage.vue");
+const mainPage = () => import("@/modules/12_evaluatePersonal/views/MainPage.vue");
 const detailPage = () =>
-  import("@/modules/12_evaluate/views/DetailPage.vue");
+  import("@/modules/12_evaluatePersonal/views/DetailPage.vue");
 
 export default [
   {

src/modules/12_evaluatePersonal/store/Evaluate.ts

@@ -0,0 +1,426 @@
+import { defineStore } from "pinia";
+import { ref } from "vue";
+import type { QTableProps } from "quasar";
+import type { DataOption } from "@/modules/12_evaluatePersonal/interface/index/Main";
+import { useCounterMixin } from "@/stores/mixin";
+
+const mixin = useCounterMixin();
+const { date2Thai } = mixin;
+export const useEvalutuonStore = defineStore("EvalutuonStore", () => {
+  /** function สถานะ*/
+  function convertStatus(val: string) {
+    switch (val) {
+      case "CHECK_SPEC":
+        return "ตรวจสอบคุณสมบัติด้วยตนเอง";
+      case "PREPARE_DOC_V1":
+        return "จัดเตรียมเอกสารเล่ม";
+      case "CHECK_DOC_V1":
+        return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
+      case "WAIT_CHECK_DOC_V1":
+        return "รอตรวจสอบคุณสมบัติ";
+      case "ANNOUNCE_WEB":
+        return "ประกาศบนเว็บไซต์";
+      case "PREPARE_DOC_V2":
+        return "จัดเตรียมเอกสารเล่ม";
+      case "WAIT_CHECK_DOC_V2":
+        return "รอพิจารณาผลการประเมิน";
+      case "CHECK_DOC_V2":
+        return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
+      case "DONE":
+        return "เสร็จสิ้น";
+        
+    }
+  }
+
+  // ตรวจสอบคุณสมบัติด้วยตนเอง -> CHECK_SPEC
+  // จัดเตรียมเอกสารเล่ม 1-> PREPARE_DOC_V1
+  // ตรวจสอบความถูกต้องของเอกสารเล่ม 1 -> CHECK_DOC_V1
+  // รอตรวจสอบคุณสมบัติ -> WAIT_CHECK_DOC_V1
+  // ประกาศบนเว็บไซต์ -> ANNOUNCE_WEB
+  // จัดเตรียมเอกสารเล่ม 2 -> PREPARE_DOC_V2
+  // ตรวจสอบความถูกต้องของเอกสารเล่ม 2 -> CHECK_DOC_V2
+  // รอพิจารณาผลการประเมิน -> WAIT_CHECK_DOC_V2
+  // เสร็จสิ้น -> DONE
+
+  const visibleColumns = ref<String[]>([
+    "citizanId",
+    "fullName",
+    "position",
+    "level",
+    "positionNumber",
+    "agency",
+    "status",
+  ]);
+  const rows = ref<any[]>([]);
+  function fetchData(data: any[]) {
+    const dataList: any[] = data.map((data: any) => ({
+      citizanId: data.citizanId,
+      fullName: data.fullName,
+      position: data.position,
+      level: data.level,
+      positionNumber: data.positionNumber,
+      agency: data.agency,
+      status: convertStatus(data.status),
+    }));
+    rows.value = dataList;
+    console.log(dataList);
+  }
+
+  const columns = ref<QTableProps["columns"]>([
+    {
+      name: "citizanId",
+      align: "center",
+      label: "เลขประจำตัวประชาชน",
+      sortable: false,
+      field: "citizanId",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "fullName",
+      align: "left",
+      label: "ชื่อ-นามสกุล",
+      sortable: true,
+      field: "fullName",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "position",
+      align: "left",
+      label: "ตำแหน่ง",
+      sortable: true,
+      field: "position",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "level",
+      align: "left",
+      label: "ระดับ",
+      sortable: true,
+      field: "level",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "positionNumber",
+      align: "left",
+      label: "ตำแหน่งเลขที่",
+      sortable: true,
+      field: "positionNumber",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "agency",
+      align: "left",
+      label: "สังกัด",
+      sortable: true,
+      field: "agency",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "status",
+      align: "left",
+      label: "สถานะ(ตรวจสอบคุณสมบัติ)",
+      sortable: true,
+      field: "status",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+  ]);
+
+  const columnsLicense = ref<QTableProps["columns"]>([
+    {
+      name: "",
+      align: "center",
+      label: "ชื่อใบอนุณาต",
+      sortable: false,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "หน่วยงานผู้ออกใบอนุญาต",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "เลขที่ใบอนุญาต",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "วันที่ออกใบอนุญาต",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "",
+      align: "left",
+      label: "วันที่หมดอายุ",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+  ]);
+
+  const columnPeriodhistory = ref<QTableProps["columns"]>([
+    {
+      name: "",
+      align: "center",
+      label: "วัน เดือน ปี",
+      sortable: false,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "",
+      align: "left",
+      label: "สังกัด",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ตำแหน่ง",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ตำแหน่งเลขที่",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "",
+      align: "left",
+      label: "สายงาน",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ด้าน/สาขา",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ตำแหน่งประเภท",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ระดับ",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ตำแหน่งทางการบริหาร",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ด้านทางการบริหาร",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+  ]);
+
+  const columnTrainingHistory = ref<QTableProps["columns"]>([
+    {
+      name: "",
+      align: "center",
+      label: "ชื่อโครงการ/หลักสูตรการฝึกอบรม",
+      sortable: false,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "หัวข้อการฝึกอบรม/ดูงาน",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "วันเริ่มต้นการฝึกอบรม/ดูงาน",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "",
+      align: "left",
+      label: "วันสิ้นสุดการฝึกอบรม/ดูงาน",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ปีที่อบรม/ดูงาน",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "รวมระยะเวลาในการฝึกอบรม/ดูงาน",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "หน่วยงานที่รับผิดชอบจัดการฝึกอบรม/ดูงาน",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+  ]);
+
+  const columnProjectsProposed = ref<QTableProps["columns"]>([
+    {
+      name: "",
+      align: "center",
+      label: "วันที่ได้รับ",
+      sortable: false,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "",
+      align: "left",
+      label: "ผู้มีอำนาจลงนาม",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+    {
+      name: "",
+      align: "left",
+      label: "รายละเอียด",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+     
+    },
+    {
+      name: "",
+      align: "left",
+      label: "เลขที่คำสั่ง",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "",
+      align: "left",
+      label: "เอกสารอ้างอิง",
+      sortable: true,
+      field: "",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+    },
+  ]);
+
+  return {
+    visibleColumns,
+    columns,
+    rows,
+    convertStatus,
+    fetchData,
+    columnsLicense,
+    columnPeriodhistory,
+    columnTrainingHistory,
+    columnProjectsProposed,
+  };
+});

src/modules/12_evaluatePersonal/views/DetailPage.vue

@@ -5,10 +5,10 @@ import { useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import Tab1 from "@/modules/12_evaluate/components/Detail/Tab1.vue"; // ชำนาญการ
+import Tab1 from "@/modules/12_evaluatePersonal/components/Detail/Tab1.vue"; // ชำนาญการ
-import Tab2 from "@/modules/12_evaluate/components/Detail/Tab2.vue"; // ชำนาญการพิเศษ
+import Tab2 from "@/modules/12_evaluatePersonal/components/Detail/Tab2.vue"; // ชำนาญการพิเศษ
 
-import { useEvaluateDetailStore } from "@/modules/12_evaluate/store/EvaluateDetail";
+import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
 
 const store = useEvaluateDetailStore();
 const router = useRouter();
@@ -34,8 +34,8 @@ const $q = useQuasar();
               active-bg-color="teal-1"
               active-class="text-primary"
             >
-              <q-tab name="1" label="ชำนาญการ" />
+              <q-tab name="1" label="รายละเอียดการประเมิน" />
-              <q-tab name="2" label="ชำนาญการพิเศษ" />
+              <q-tab name="2" label="กรรมการและการประชุม" />
             </q-tabs>
             <q-separator />
             <q-tab-panels v-model="store.tabMenu" animated>

src/modules/12_evaluatePersonal/views/MainPage.vue

@@ -5,9 +5,9 @@ import { useRouter } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 
-import Table from "@/modules/12_evaluate/components/Table.vue";
+import Table from "@/modules/12_evaluatePersonal/components/Table.vue";
 import { useCounterMixin } from "@/stores/mixin";
-import { useEvalutuonStore } from "@/modules/12_evaluate/store/Evaluate";
+import { useEvalutuonStore } from "@/modules/12_evaluatePersonal/store/Evaluate";
 import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
 
 const $q = useQuasar(); // show dialog

src/router/index.ts

@@ -15,7 +15,7 @@ import ModuleRegistryEmployee from "@/modules/08_registryEmployee/router";
 import ModuleOrder from "@/modules/10_order/router";
 import ModuleLeave from "@/modules/09_leave/router";
 import ModuleDiscipline from "@/modules/11_discipline/router";
-import ModuleEvaluate from "@/modules/12_evaluate/router";
+import ModuleEvaluate from "@/modules/12_evaluatePersonal/router";
 
 // TODO: ใช้หรือไม่?
 import keycloak from "@/plugins/keycloak";