feat: add position and salary review

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

@@ -52,11 +52,11 @@ async function onClickDownloadKp7(type: string) {
     type === "FULL"
       ? config.API.profileReportId(
           store.profileId,
-          dataStore.officerType == "OFFICER" ? "profile" : "profile-employee"
+          dataStore.officerType == "OFFICER" ? "profile" : "profile-employee",
         )
       : config.API.profileKp7ShortId(
           store.profileId,
-          dataStore.officerType == "OFFICER" ? "profile" : "profile-employee"
+          dataStore.officerType == "OFFICER" ? "profile" : "profile-employee",
         );
   const fileName = type === "FULL" ? "ทปอ. สามัญ" : "ประวัติแบบย่อ";
   await http
@@ -78,11 +78,6 @@ const clickBack = () => {
   router.push(`/`);
 };
 
-/** ฟังก์ชัน redirect ไปหน้ารายการคำร้องขอแก้ไขข้อมูล*/
-function redirectToPagePetition() {
-  router.push(`/registry/request-edit`);
-}
-
 function onMobile(type: string) {
   router.push(`/registry/${type}`);
 }
@@ -103,10 +98,20 @@ function onMobile(type: string) {
           @click="clickBack"
         />
         ข้อมูลทะเบียนประวัติ <q-space />
+        <q-btn
+          color="blue-6"
+          icon="mdi-eye"
+          label="ตรวจสอบข้อมูลตำแหน่งและเงินเดือน"
+          class="q-mr-sm"
+          @click="() => router.push('/registry/position-review')"
+        >
+          <q-tooltip>ไปยังหน้าตรวจสอบข้อมูลตำแหน่งและเงินเดือน</q-tooltip>
+        </q-btn>
+
         <q-btn
           color="primary"
           label="ยื่นคำร้องขอแก้ไขข้อมูล"
-          @click="redirectToPagePetition"
+          @click="() => router.push('/registry/request-edit')"
         >
           <q-tooltip>ยื่นคำร้องขอแก้ไขข้อมูล</q-tooltip>
         </q-btn>

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

@@ -0,0 +1,197 @@
+<script setup lang="ts">
+import { ref, onMounted } from "vue";
+// import { useQuasar } from "quasar";
+
+// import http from "@/plugins/http";
+// import config from "@/app.config";
+// import { useCounterMixin } from "@/stores/mixin";
+import { useRoute, useRouter } from "vue-router";
+// import { useDataStore } from "@/stores/data";
+
+/** importType*/
+// import type { DataProfile } from "@/modules/04_registryPerson/interface/index/Edit";
+
+import Table from "@/modules/10_registry/components/PositionReview/Table.vue";
+// import DialogEdit from "@/modules/04_registryPerson/views/edit/components/DialogEdit.vue";
+
+// const dataStore = useDataStore();
+// const $q = useQuasar();
+// const { showLoader, hideLoader, messageError, dialogConfirm, success } =
+//   useCounterMixin();
+// const route = useRoute();
+const router = useRouter();
+
+const tabs = ref<string>("CHECKED");
+const statusCheckEdit = ref<string>("");
+// const empType = ref<string>(dataStore.officerType);
+// const profileId = ref<string>(dataStore.profileId);
+const isConfirmEdit = ref<boolean>(false); //สิทธิ์การแก้ไขข้อมูล
+// const isConfirmDone = ref<boolean>(false); //สิทธิ์การยืนยันข้อมูล
+// const modalEdit = ref<boolean>(false);
+// const modalHistory = ref<boolean>(false);
+
+/** function ยืนยันเสร็จสิ้นการแก้ไข*/
+// function onConfirmEdit() {
+//   dialogConfirm(
+//     $q,
+//     () => {
+//       showLoader();
+//       http
+//         .post(config.API.salaryTemp + `/confirm-edit`, {
+//           profileId: profileId.value,
+//           type: empType.value?.toLocaleUpperCase(),
+//         })
+//         .then(async () => {
+//           success($q, "ยืนยันเสร็จสิ้นการแก้ไขสำเร็จ");
+//         })
+//         .catch((err) => {
+//           messageError($q, err);
+//         })
+//         .finally(() => {
+//           hideLoader();
+//         });
+//     },
+//     "ยืนยันเสร็จสิ้นการแก้ไข",
+//     "ต้องการยืนยันเสร็จสิ้นการแก้ไขใช่หรือไม่?",
+//   );
+// }
+
+/** function ยืนยันข้อมูลถูกต้อง*/
+// function onConfirmDone() {
+//   dialogConfirm(
+//     $q,
+//     () => {
+//       showLoader();
+//       http
+//         .post(config.API.salaryTemp + `/confirm-done`, {
+//           profileId: profileId.value,
+//           type: empType.value?.toLocaleUpperCase(),
+//         })
+//         .then(async () => {
+//           success($q, "ยืนยันข้อมูลถูกต้องสำเร็จ");
+//         })
+//         .catch((err) => {
+//           messageError($q, err);
+//         })
+//         .finally(() => {
+//           hideLoader();
+//         });
+//     },
+//     "ยืนยันข้อมูลถูกต้อง",
+//     "ต้องการยืนยันข้อมูลถูกต้องใช่หรือไม่",
+//   );
+// }
+</script>
+
+<template>
+  <div class="row items-center q-gutter-sm q-mb-xs">
+    <div class="toptitle text-white row items-center q-py-xs">
+      <q-btn
+        icon="mdi-arrow-left"
+        unelevated
+        round
+        dense
+        flat
+        color="primary"
+        class="q-mr-sm"
+        @click="router.go(-1)"
+      />
+      รายการประวัติตำแหน่ง/เงินเดือน
+    </div>
+  </div>
+
+  <q-card flat bordered>
+    <!-- <q-separator v-if="isConfirmEdit || isConfirmDone" />
+
+    <q-card-section v-if="isConfirmEdit || isConfirmDone">
+      <div class="row q-col-gutter-sm justify-center">
+        <div class="row items-center" v-if="isConfirmEdit">
+          <q-btn
+            :disable="
+              statusCheckEdit === 'EDITED' || statusCheckEdit === 'CHECKED'
+            "
+            :color="
+              statusCheckEdit === 'EDITED' || statusCheckEdit === 'CHECKED'
+                ? 'grey'
+                : 'public'
+            "
+            outline
+            label="ยืนยันการแก้ไขสำเร็จ"
+            @click.stop.prevent="onConfirmEdit"
+          />
+          <q-btn
+            flat
+            label="ประวัติการดำเนินการ"
+            class="q-ml-md"
+            color="blue"
+            @click="modalHistory = true"
+          />
+        </div>
+        <div
+          class="row items-center"
+          v-if="isConfirmDone && statusCheckEdit === 'EDITED'"
+        >
+          <q-btn
+            color="public"
+            outline
+            label="ยืนยันข้อมูลถูกต้อง"
+            @click.stop.prevent="onConfirmDone"
+          />
+          <q-btn
+            flat
+            label="ตีกลับให้แก้ไข"
+            class="q-ml-md"
+            color="blue"
+            @click="modalEdit = true"
+          />
+        </div>
+      </div>
+    </q-card-section> -->
+
+    <q-separator />
+
+    <q-card-section>
+      <!-- <q-tabs
+        v-model="tabs"
+        dense
+        align="left"
+        inline-label
+        class="bg-white text-grey"
+        active-color="primary"
+        indicator-color="primary"
+      >
+        <q-tab name="PENDING" label="รายการตำแหน่ง/เงินเดือนที่กำลังแก้ไข" />
+        <q-tab
+          name="CHECKED"
+          label="แสดงรายการตำแหน่ง/เงินเดือนหลังจากแก้ไขแล้ว"
+        />
+      </q-tabs>
+      <q-separator />
+
+      <q-tab-panels v-model="tabs" animated>
+        <q-tab-panel name="PENDING">
+          <Table
+            :tabs="tabs"
+            :status-check-edit="statusCheckEdit"
+            :is-confirm-edit="isConfirmEdit"
+          />
+        </q-tab-panel>
+        <q-tab-panel name="CHECKED"> -->
+      <Table
+        :tabs="tabs"
+        :status-check-edit="statusCheckEdit"
+        :is-confirm-edit="isConfirmEdit"
+      />
+      <!-- </q-tab-panel>
+      </q-tab-panels> -->
+    </q-card-section>
+  </q-card>
+
+  <!-- <DialogEdit
+    v-model:modal="modalEdit"
+    :emp-type="empType"
+    :fetch-data="fetchDataProfile"
+  /> -->
+</template>
+
+<style scoped></style>