no message

2023-08-11 15:16:50 +07:00 · 2023-08-11 15:16:50 +07:00 · 42e6b26198
commit 42e6b26198
parent 5358cc3d08 84f61e70d2
12 changed files with 507 additions and 138 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -7722,7 +7722,7 @@
    },
    "node_modules/vue": {
      "version": "3.2.47",
-      "resolved": "https://npm.joolsoft.com/vue/-/vue-3.2.47.tgz",
+    //   "resolved": "https://npm.joolsoft.com/vue/-/vue-3.2.47.tgz",
      "integrity": "sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==",
      "dependencies": {
        "@vue/compiler-dom": "3.2.47",
@ -13787,7 +13787,7 @@
    },
    "vue": {
      "version": "3.2.47",
-      "resolved": "https://npm.joolsoft.com/vue/-/vue-3.2.47.tgz",
+    //   "resolved": "https://npm.joolsoft.com/vue/-/vue-3.2.47.tgz",
      "integrity": "sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==",
      "requires": {
        "@vue/compiler-dom": "3.2.47",
--- a/src/api/05_placement/api.placement.ts
+++ b/src/api/05_placement/api.placement.ts
@ -4,6 +4,11 @@ const orgTree = `${env.API_URI_ORG_TREE}`;
 const order = `${env.API_PLACEMENT_URI}`;
 const receive = `${env.API_PLACEMENT_URI}/placement/Receive`;
 const transfer = `${placement}/transfer`;
+const placemenHelpGov = `${placement}/officer`;
+const placemenRepatriation = `${placement}/repatriation`;
+const placemenRelocation = `${placement}/relocation`;
+const placemenOther = `${env.API_URI}/retirement/other`;
+const placemenAppointment = `${env.API_URI}/retirement/appointment`;

 export default {
  MainDetail: (year: number) => `${placement}/exam/${year}`,
@ -94,10 +99,26 @@ export default {
  //tranfer ระบบคำขอโอน
  transfer,
  transferId: (id: string) => `${transfer}/${id}`,
+  transferReport: `${transfer}/report`,
  transferUser: `${transfer}/user`,
  transferUserId: (id: string) => `${transfer}/user/${id}`,
  transferConfirmId: (id: string) => `${transfer}/confirm/${id}`,
  officerMain: () => `${placement}/officer`,
  officerDetail: (id:string) => `${placement}/officer/${id}`,
  officerMainDelete: (id:string) => `${placement}/officer/${id}`,
+
+  // แต่งตั้ง-เลื่อน
+  placemenAppointment,
+
+  // ช่วยราชการ
+  placemenHelpGov,
+
+  // ส่งตัวกลับ
+  placemenRepatriation,
+
+  // ขอย้าย
+  placemenRelocation,
+
+  // อื่นๆ
+  placemenOther,
 };
--- a/src/api/06_retirement/api.retirement.ts
+++ b/src/api/06_retirement/api.retirement.ts
@ -1,6 +1,8 @@
 import env from "../index";
 const retirement = `${env.API_URI}/retirement`
-
+const retirementDischarge = `${retirement}/discharge`
+const retirementExpulsion = `${retirement}/expulsion`
+const retirementOut = `${retirement}/out`

 export default {
    profile: (type: string, year: string) => `${retirement}/profile/${type}/${year}`,
@ -22,4 +24,13 @@ export default {
    resignConfirm: (id: string) => `${retirement}/resign/confirm/${id}`,
    resignReject: (id: string) => `${retirement}/resign/reject/${id}`,

+    // ปลดออก
+    retirementDischarge,
+
+    // ไล่ออก
+    retirementExpulsion,
+
+    // ให้ออก
+    retirementOut
+
 };
--- a/src/interface/request/main/main.ts
+++ b/src/interface/request/main/main.ts
@ -125,7 +125,7 @@ const menuList = readonly<any[]>([
    activeIcon: "order",
    label: "ออกคำสั่ง",
    path: "order",
-    role: "placement",
+    role: "order",
  },
  {
    key: 5,
@ -253,7 +253,7 @@ const menuList = readonly<any[]>([
      {
        key: 6.9,
        label: "รายการย้าย" /* */,
-        path: "move-list",
+        path: "relocation",
        role: "placement",
      },
      {
@ -311,13 +311,13 @@ const menuList = readonly<any[]>([
      {
        key: 7.6,
        label: "รายการปลดออก",
-        path: "dismiss-order",
+        path: "discharged",
        role: "retirement",
      },
      {
        key: 7.7,
        label: "รายการไล่ออก",
-        path: "dismiss-order",
+        path: "expulsion",
        role: "retirement",
      },
    ],
--- a/src/modules/05_placement/components/Transfer/transferMain.vue
+++ b/src/modules/05_placement/components/Transfer/transferMain.vue
@ -4,6 +4,7 @@ import type { QTableProps } from "quasar";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
+import { useTransferDataStore } from "@/modules/05_placement/store";

 import http from "@/plugins/http";
 import config from "@/app.config";
@ -13,7 +14,7 @@ import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogH

 import type { ResponseData } from "@/modules/05_placement/interface/response/Transfer";

-const selected = ref([]);
+const selected = ref<ResponseData[]>([]);
 const checkSelected = computed(() => {
  if (selected.value.length === 0) {
    return true;
@ -23,8 +24,10 @@ const checkSelected = computed(() => {
 const $q = useQuasar();
 const router = useRouter();
 const mixin = useCounterMixin();
+const transferStore = useTransferDataStore();

 const { date2Thai, messageError, showLoader, hideLoader, success } = mixin;
+const { statusText } = transferStore;

 const modal = ref<boolean>(false);
 const visibleColumns = ref<string[]>([
@ -32,18 +35,18 @@ const visibleColumns = ref<string[]>([
  "fullname",
  "position",
  "positionLevel",
-  "oc",
-  "agency",
-  "status",
+  "organizationPositionOld",
+  "organization",
+  "statustext",
 ]);
 const visibleColumns2 = ref<string[]>([
  "no",
  "fullname",
  "position",
  "positionLevel",
-  "oc",
-  "agency",
-  "status",
+  "organizationPositionOld",
+  "organization",
+  "statustext",
 ]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
@ -58,53 +61,8 @@ const resetFilter = () => {
 //   router.push("/retirement/resign/"+id);
 // };
 const rows = ref<ResponseData[]>([]);
-const rows2 = ref<any>([
-  {
-    personalId: "0a846508-4932-40de-9a9e-5b519492217c",
-    fullname: "นางสาวอย พชช",
-    position: "นักบริหาร",
-    positionLevel: "ต้น",
-    oc: "สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร",
-    agency: "กลุ่มงานกุมารเวชกรรม",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-add6-47b0-8a13-5f45d106e8d1",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-adf2-4842-8056-1abb1539356e",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-adff-47b0-8762-41cd5c991001",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-ae22-424d-8f4a-87ba30cc3ee7",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-]);
+const rows2 = ref<ResponseData[]>([]);
+const filters = ref<ResponseData[]>([]);
 const columns = ref<QTableProps["columns"]>([
  {
    name: "no",
@ -143,29 +101,29 @@ const columns = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
  {
-    name: "oc",
+    name: "organizationPositionOld",
    align: "left",
    label: "สังกัด",
    sortable: true,
-    field: "oc",
+    field: "organizationPositionOld",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
  {
-    name: "agency",
+    name: "organization",
    align: "left",
    label: "หน่วยงานที่ขอโอนไป",
    sortable: true,
-    field: "agency",
+    field: "organization",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
  {
-    name: "status",
+    name: "statustext",
    align: "left",
    label: "สถานะ",
    sortable: true,
-    field: "status",
+    field: "statustext",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
@ -208,29 +166,29 @@ const columns2 = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
  {
-    name: "oc",
+    name: "organizationPositionOld",
    align: "left",
    label: "สังกัด",
    sortable: true,
-    field: "oc",
+    field: "organizationPositionOld",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
  {
-    name: "agency",
+    name: "organization",
    align: "left",
    label: "หน่วยงานที่ขอโอนไป",
    sortable: true,
-    field: "agency",
+    field: "organization",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
  {
-    name: "status",
+    name: "statustext",
    align: "left",
    label: "สถานะ",
    sortable: true,
-    field: "status",
+    field: "statustext",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
@ -243,6 +201,15 @@ onMounted(async () => {
  await getData();
 });

+const openModalOrder = () => {
+  openModal();
+  const row = filters.value.filter(
+    (r: ResponseData) =>
+      r.status == "WAITTING" || r.status == "PENDING" || r.status == "APPROVE"
+  );
+  rows2.value = row;
+};
+
 const getData = async () => {
  showLoader();
  await http
@ -254,8 +221,10 @@ const getData = async () => {
        list.push({
          createdAt: new Date(),
          date: new Date(),
+          firstName: r.firstName ?? "",
          id: r.id ?? "",
          isActive: r.isActive ? r.isActive : false,
+          lastName: r.lastName ?? "",
          organization: r.organization ?? "",
          organizationPositionOld: r.organizationPositionOld ?? "",
          posNo: r.posNo ?? "",
@ -264,12 +233,18 @@ const getData = async () => {
          positionLevelOld: r.positionLevelOld ?? "",
          positionNumberOld: r.positionNumberOld ?? "",
          positionTypeOld: r.positionTypeOld ?? "",
-          reason: r.id ?? "",
-          salary: r.salary !== null ? r.salary : 0,
+          prefix: r.prefix ?? "",
+          reason: r.reason ?? "",
+          salary: r.salary ? r.salary : 0,
          status: r.status ?? "",
+          statustext: statusText(r.status ?? ""),
+          fullname: `${r.prefix ?? ""} ${r.firstName ?? ""} ${
+            r.lastName ?? ""
+          }`,
        });
      });
      rows.value = list;
+      filters.value = list;
    })
    .catch((e) => {
      messageError($q, e);
@ -278,6 +253,30 @@ const getData = async () => {
      hideLoader();
    });
 };
+
+const saveOrder = async () => {
+  const id = selected.value.map((r) => r.id);
+  const body = {
+    id,
+  };
+
+  showLoader();
+  await http
+    .post(config.API.transferReport, body)
+    .then((res: any) => {
+      //   const data = res.data.result;
+      //   console.log(data);
+      success($q, "ส่งไปออกคำสั่งโอนออกสำเร็จ");
+      closeModal();
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+      hideLoader();
+    });
+};
 </script>
 <template>
  <div class="toptitle text-dark col-12 row items-center">รายการขอโอน</div>
@ -287,7 +286,7 @@ const getData = async () => {
      <div class="col-12">
        <div class="row col-12">
          <q-btn
-            @click="openModal"
+            @click="openModalOrder"
            size="14px"
            flat
            round
@ -369,14 +368,24 @@ const getData = async () => {
                <q-td key="positionLevel" :props="props">
                  {{ props.row.positionLevel }}
                </q-td>
-                <q-td key="oc" :props="props">
-                  {{ props.row.oc }}
+                <q-td key="organizationPositionOld" :props="props">
+                  <div class="table_ellipsis">
+                    {{ props.row.organizationPositionOld }}
+                    <!-- <q-tooltip>
+                      {{ props.row.organizationPositionOld }}
+                    </q-tooltip> -->
+                  </div>
                </q-td>
-                <q-td key="agency" :props="props">
-                  {{ props.row.agency }}
+                <q-td key="organization" :props="props">
+                  <div class="table_ellipsis">
+                    {{ props.row.organization }}
+                    <!-- <q-tooltip>
+                      {{ props.row.organization }}
+                    </q-tooltip> -->
+                  </div>
                </q-td>
-                <q-td key="status" :props="props">
-                  {{ props.row.status }}
+                <q-td key="statustext" :props="props">
+                  {{ props.row.statustext }}
                </q-td>
              </q-tr>
            </template>
@ -436,8 +445,7 @@ const getData = async () => {
          :columns="columns2"
          :rows="rows2"
          :filter="filterKeyword2"
-          row-key="personalId"
-          class="custom-header-table"
+          row-key="id"
          :visible-columns="visibleColumns2"
          selection="multiple"
          v-model:selected="selected"
@ -450,14 +458,7 @@ const getData = async () => {
              v-model="scope.selected"
            />
          </template>
-          <!-- <template v-slot:body-selection="scope">
-            <q-checkbox
-              keep-color
-              color="primary"
-              dense
-              v-model="scope.selected"
-            />
-          </template> -->
+
          <template v-slot:body="props">
            <q-tr :props="props" class="cursor-pointer">
              <q-td>
@ -480,14 +481,18 @@ const getData = async () => {
              <q-td key="positionLevel" :props="props">
                {{ props.row.positionLevel }}
              </q-td>
-              <q-td key="oc" :props="props">
-                {{ props.row.oc }}
+              <q-td key="organizationPositionOld" :props="props">
+                <div class="table_ellipsis">
+                  {{ props.row.organizationPositionOld }}
+                </div>
              </q-td>
-              <q-td key="agency" :props="props">
-                {{ props.row.agency }}
+              <q-td key="organization" :props="props">
+                <div class="table_ellipsis">
+                  {{ props.row.organization }}
+                </div>
              </q-td>
-              <q-td key="status" :props="props">
-                {{ props.row.status }}
+              <q-td key="statustext" :props="props">
+                {{ props.row.statustext }}
              </q-td>
            </q-tr>
          </template>
@ -497,7 +502,7 @@ const getData = async () => {
      <q-card-actions align="right" class="bg-white text-teal">
        <q-btn
          label="ส่งไปออกคำสั่ง"
-          @click=""
+          @click="saveOrder"
          :disable="checkSelected"
          color="public"
        />
--- a/src/modules/05_placement/components/Transfer/transferRegistry.vue
+++ b/src/modules/05_placement/components/Transfer/transferRegistry.vue
@ -10,11 +10,13 @@
      class="q-mr-sm"
      @click="router.go(-1)"
    />
-    รายละเอียดการขอโอนของ {{ name }}
+    รายละเอียดการขอโอนของ {{ responseData.fullname }}
  </div>
  <q-card bordered class="row col-12 text-dark">
    <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
-      <div class="q-pl-sm text-weight-bold text-subtitle2">{{ name }}</div>
+      <div class="q-pl-sm text-weight-bold text-subtitle2">
+        {{ responseData.fullname }}
+      </div>
      <q-space />
      <q-btn
        outline
@ -30,7 +32,11 @@
    <div class="row col-12 q-pa-md">
      <div class="col-12 row bg-white q-col-gutter-md">
        <div class="col-xs-3 col-sm-2 col-md-1 row">
-          <q-img src="@/assets/avatar_user.jpg" />
+          <q-img
+            :src="responseData.avataPath"
+            v-if="responseData.avataPath !== ''"
+          />
+          <q-img src="@/assets/avatar_user.jpg" v-else />
        </div>
        <div class="col-xs-6 col-sm-3 row items-center">
          <div class="col-12 q-pl-md">
@ -141,6 +147,217 @@
      </d-table>
    </div>
  </q-card>
+
+  <q-card bordered class="row col-12 text-dark q-mt-sm">
+    <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
+      <div class="q-pl-sm text-weight-bold text-dark">
+        แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย
+      </div>
+      <q-space />
+      <div class="q-gutter-sm" v-if="!edit">
+        <q-btn
+          outline
+          color="primary"
+          dense
+          icon-right="mdi-file-edit-outline"
+          class="q-px-sm"
+          label="แก้ไข"
+          style="width: 80px"
+          @click="edit = !edit"
+        />
+      </div>
+      <div class="q-gutter-sm" v-else>
+        <q-btn
+          outline
+          color="public"
+          dense
+          class="q-px-sm"
+          label="บันทึก"
+          style="width: 80px"
+          @click="conditionSave"
+        />
+        <q-btn
+          outline
+          color="red"
+          dense
+          class="q-px-sm"
+          label="ยกเลิก"
+          style="width: 80px"
+          @click="edit = !edit"
+        />
+      </div>
+    </div>
+    <div class="col-12"><q-separator /></div>
+    <q-form ref="myForm">
+      <div class="row col-12 q-pa-md">
+        <div class="col-12 row bg-white q-col-gutter-md">
+          <div class="col-xs-12 row items-center">
+            <div class="col-12">
+              <div class="text-weight-bold text-grey">
+                ตำแหน่งและหน่วยงานเดิม
+              </div>
+            </div>
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organizationPositionOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่ง/สังกัด'}`"
+                type="textarea"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionTypeOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
+                hide-bottom-space
+                :label="`${'ตำแหน่งประเภท'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="positionLevelOld"
+                :rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
+                hide-bottom-space
+                :label="`${'ระดับ'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="posNo"
+                :rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
+                hide-bottom-space
+                :label="`${'เลขที่'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-3 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="salary"
+                :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
+                hide-bottom-space
+                :label="`${'เงินเดือน'}`"
+                type="number"
+              />
+            </div>
+          </div>
+          <div class="col-12"><q-separator /></div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="organization"
+                :rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]"
+                hide-bottom-space
+                :label="`${'โอนไปสังกัด'}`"
+              />
+            </div>
+          </div>
+          <div class="col-xs-6 col-sm-6 row items-center">
+            <div class="col-12">
+              <datepicker
+                menu-class-name="modalfix"
+                :readonly="!edit"
+                v-model="date"
+                :locale="'th'"
+                autoApply
+                :enableTimePicker="false"
+                week-start="0"
+              >
+                <template #year="{ year }">{{ year + 543 }}</template>
+                <template #year-overlay-value="{ value }">{{
+                  parseInt(value + 543)
+                }}</template>
+                <template #trigger>
+                  <q-input
+                    :class="getClass(edit)"
+                    :outlined="edit"
+                    dense
+                    lazy-rules
+                    :borderless="!edit"
+                    :model-value="date !== null ? date2Thai(date) : null"
+                    :rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
+                    hide-bottom-space
+                    :label="`${'ตั้งแต่วัน'}`"
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        :style="
+                          edit
+                            ? 'color: var(--q-primary)'
+                            : 'color: var(--q-grey)'
+                        "
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+          </div>
+          <div class="col-12">
+            <q-input
+              :class="getClass(edit)"
+              :outlined="edit"
+              dense
+              lazy-rules
+              :readonly="!edit"
+              :borderless="!edit"
+              v-model="reason"
+              :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
+              hide-bottom-space
+              :label="`${'หมายเหตุ '}`"
+              type="textarea"
+            />
+          </div>
+        </div>
+      </div>
+    </q-form>
+  </q-card>
 </template>
 <script setup lang="ts">
 import { onMounted, ref } from "vue";
@ -152,7 +369,7 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import keycloak from "@/plugins/keycloak";

-import type { QTableProps } from "quasar";
+import type { QTableProps, QForm } from "quasar";
 import type {
  TypeFile,
  ResponseDataDetail,
@ -173,17 +390,21 @@ const {
  success,
 } = mixin;

+const myForm = ref<QForm | null>(null);
 const roleAdmin = ref<boolean>(false);
+const edit = ref<boolean>(false);

-const name = ref<string>("นายสมคิด ยอดใจ");
-const position = ref<string>("นักจัดการงานทั่วไป");
-const level = ref<string>("ชำนาญการพิเศษ");
-const institution = ref<string>("ฝ่ายบริหารงานทั่วไป");
-const status = ref<string>("อยู่ระหว่างการทดลองงาน");
-const organization = ref<string>("ก.ก.");
-const reason = ref<string>("เพราะxxx");
+const organizationPositionOld = ref<string>("");
+const positionTypeOld = ref<string>("");
+const positionLevelOld = ref<string>("");
+const posNo = ref<string>("");
+const salary = ref<number>(0);
+const organization = ref<string>("");
+const date = ref<Date | null>(null);
+const reason = ref<string>("");

 const responseData = ref<ResponseDataDetail>({
+  avataPath: "",
  createdAt: new Date(),
  date: new Date(),
  id: "",
@ -195,6 +416,7 @@ const responseData = ref<ResponseDataDetail>({
  reason: "",
  salary: 0,
  status: "",
+  fullname: "",
 });

 const rows = ref<TypeFile[]>([]);
@ -239,7 +461,7 @@ onMounted(async () => {
 const getData = async () => {
  showLoader();
  await http
-    .get(config.API.transferUserId(personId.toString()))
+    .get(config.API.transferId(personId.toString()))
    .then((res: any) => {
      const data = res.data.result;
      //   console.log(data);
@ -251,20 +473,34 @@ const getData = async () => {
            fileName: doc.fileName ?? "",
          });
        });
-        rows.value = list;
-        responseData.value.createdAt = data.createdAt;
-        responseData.value.date = new Date();
-        responseData.value.id = data.id ?? "";
-        responseData.value.organization = data.organization ?? "";
-        responseData.value.organizationPositionOld =
-          data.organizationPositionOld ?? "";
-        responseData.value.positionLevelOld = data.positionLevelOld ?? "";
-        responseData.value.positionNumberOld = data.positionNumberOld ?? "";
-        responseData.value.positionTypeOld = data.positionTypeOld ?? "";
-        responseData.value.reason = data.reason ?? "";
-        responseData.value.salary = data.salary !== null ? data.salary : 0;
-        responseData.value.status = data.status ?? "";
      }
+      rows.value = list;
+      responseData.value.createdAt = data.createdAt;
+      responseData.value.date =
+        data.date !== null ? new Date(data.date) : new Date();
+      responseData.value.id = data.id ?? "";
+      responseData.value.organization = data.organization ?? "";
+      responseData.value.organizationPositionOld =
+        data.organizationPositionOld ?? "";
+      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
+      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
+      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
+      responseData.value.reason = data.reason ?? "";
+      responseData.value.salary = data.salary !== null ? data.salary : 0;
+      responseData.value.status = data.status ?? "";
+      responseData.value.avataPath = data.avataPath ?? "";
+      responseData.value.fullname = `${data.prefix ?? "-"} ${
+        data.firstName ?? "-"
+      } ${data.lastName ?? "-"}`;
+
+      organizationPositionOld.value = data.organizationPositionOld ?? "";
+      positionTypeOld.value = data.positionTypeOld ?? "";
+      positionLevelOld.value = data.positionLevelOld ?? "";
+      posNo.value = data.posNo ?? "";
+      salary.value = data.salary ?? "";
+      organization.value = data.organization ?? "";
+      date.value = data.date !== null ? new Date(data.date) : null;
+      reason.value = data.reason ?? "";
    })
    .catch((e) => {
      messageError($q, e);
@ -304,6 +540,61 @@ const sendConfirm = async () => {
      hideLoader();
    });
 };
+
+const conditionSave = async () => {
+  if (myForm.value !== null) {
+    myForm.value.validate().then((success) => {
+      if (success) {
+        dialogMessage(
+          $q,
+          "ต้องการแก้ไขข้อมูลหรือไม่?",
+          "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
+          "mdi-help-circle-outline",
+          "ตกลง",
+          "public",
+          async () => await saveData(),
+          undefined
+        );
+      }
+    });
+  }
+};
+
+const saveData = async () => {
+  const body = {
+    organization: organization.value,
+    reason: reason.value,
+    organizationPositionOld: organizationPositionOld.value,
+    date: date.value,
+    positionTypeOld: positionTypeOld.value,
+    positionLevelOld: positionLevelOld.value,
+    positionNumberOld: posNo.value,
+    amountOld: salary.value,
+  };
+  showLoader();
+  await http
+    .put(config.API.transferId(personId.toString()), body)
+    .then((res: any) => {
+      //   const data = res.data.result;
+      //   console.log(data);
+      success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
+      edit.value = false;
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+      hideLoader();
+    });
+};
+
+const getClass = (val: boolean) => {
+  return {
+    "full-width inputgreen cursor-pointer": val,
+    "full-width cursor-pointer": !val,
+  };
+};
 </script>
 <style lang="scss" scope>
 .q-img {
--- a/src/modules/05_placement/interface/response/Transfer.ts
+++ b/src/modules/05_placement/interface/response/Transfer.ts
@ -1,8 +1,10 @@
 interface ResponseData {
  createdAt: Date;
  date: Date;
+  firstName: string;
  id: string;
  isActive: boolean;
+  lastName: string;
  organization: string;
  organizationPositionOld: string;
  posNo: string;
@ -11,9 +13,12 @@ interface ResponseData {
  positionLevelOld: string;
  positionNumberOld: string;
  positionTypeOld: string;
+  prefix: string;
  reason: string;
  salary: number;
  status: string;
+  fullname: string;
+  statustext: string;
 }

 interface TypeFile {
@ -22,6 +27,7 @@ interface TypeFile {
 }

 interface ResponseDataDetail {
+  avataPath: string;
  createdAt: Date;
  date: Date;
  id: string;
@ -33,6 +39,7 @@ interface ResponseDataDetail {
  reason: string;
  salary: number;
  status: string;
+  fullname: string;
 }

 export type { ResponseData, ResponseDataDetail, TypeFile };
--- a/src/modules/05_placement/store.ts
+++ b/src/modules/05_placement/store.ts
@ -311,3 +311,29 @@ export const useProbationDataStore = defineStore("probationDataStore", () => {
    setStepOrder,
  };
 });
+
+export const useTransferDataStore = defineStore("transferDataStore", () => {
+  const statusText = (val: string) => {
+    switch (val) {
+      case "WAITTING":
+        return "รออนุมัติ";
+      case "PENDING":
+        return "รออนุมัติ";
+      case "APPROVE":
+        return "ผ่านการอนุมัติ";
+      case "REJECT":
+        return "ไม่ผ่านการอนุมัติ";
+      case "REPORT":
+        return "ส่งไปออกคำสั่ง";
+      case "DONE":
+        return "ออกคำสั่งสำเร็จ";
+
+      default:
+        return "-";
+    }
+  };
+
+  return {
+    statusText,
+  };
+});
--- a/src/modules/07_insignia/components/1_Proposals/addProposals.vue
+++ b/src/modules/07_insignia/components/1_Proposals/addProposals.vue
@ -295,6 +295,7 @@ const checkSave = async () => {
          await editData(id.value);
        } else {
          await addData();
+          clickBack();
        }
      }
    });
--- a/src/modules/07_insignia/components/1_Proposals/listProposals.vue
+++ b/src/modules/07_insignia/components/1_Proposals/listProposals.vue
@ -102,7 +102,7 @@
              </q-td>
              <q-td key="status" :props="props" @click="clickEdit(props.row)">
                <q-icon
-                  v-if="props.row.status == 'ยังไม่ได้เสนอ'"
+                  v-if="props.row.status == true"
                  name="mdi-close"
                  color="grey-5"
                  class="text-h5"
@ -139,7 +139,7 @@
                  flat
                  round
                  color="light-blue-8"
-                  @click.stop.prevent="clickProposals(props.row.id)"
+                  @click.stop.prevent="clickProposals(props.row.file)"
                  icon="mdi-file-download"
                >
                  <q-tooltip>ดาวน์โหลดเอกสารประกอบ </q-tooltip>
@ -297,7 +297,7 @@ const rows = ref<FormProprsalsRound[]>([
    year: "2566",
    startDate: "2566",
    endDate: "31 พ.ค. 2566",
-    status: "เสนอเเล้ว",
+    status: true,
    statusRoyal: "เสนอเเล้ว",
  },
  {
@ -305,7 +305,7 @@ const rows = ref<FormProprsalsRound[]>([
    year: "2566",
    startDate: "2566",
    endDate: "31 พ.ค. 2566",
-    status: "เสนอเเล้ว",
+    status: true,
    statusRoyal: "เสนอเเล้ว",
  },
  {
@ -313,7 +313,7 @@ const rows = ref<FormProprsalsRound[]>([
    year: "2566",
    startDate: "2566",
    endDate: "31 พ.ค. 2566",
-    status: "เสนอเเล้ว",
+    status: true,
    statusRoyal: "เสนอเเล้ว",
  },
  {
@ -329,7 +329,7 @@ const rows = ref<FormProprsalsRound[]>([
    year: "2566",
    startDate: "2566",
    endDate: "31 พ.ค. 2566",
-    status: "เสนอเเล้ว",
+    status: true,
    statusRoyal: "ยังไม่ได้เสนอ",
  },
 ]);
@ -350,13 +350,14 @@ const fetchData = async () => {
        rows.value.push({
          id: e.period_id,
          round: e.period_name,
-          year: e.period_year,
+          year: e.period_year + 543,
          amount: e.period_amount,
          startDate:
            e.period_start == null ? null : date2Thai(new Date(e.period_start)),
          endDate:
            e.period_end == null ? null : date2Thai(new Date(e.period_end)),
-          status: e.period_status,
+          status: e.period_isActive,
+          file: e.period_doc,
        });
      });
    })
@ -406,8 +407,10 @@ const clickAdd = () => {
  router.push({ name: "roundAdd" });
 };

-const clickProposals = (id: string) => {
-  //   window.open(config.API.exportInsigniaDoc(id));
+const clickProposals = (file: string) => {
+  if (file !== null) {
+    window.open(file);
+  }
 };

 // ค้นหาในตาราง
--- a/src/modules/09_coin/components/1_Proposals/addProposals.vue
+++ b/src/modules/09_coin/components/1_Proposals/addProposals.vue
@ -319,6 +319,7 @@ const checkSave = async () => {
          await editData(id.value);
        } else {
          await addData();
+          clickBack();
        }
      }
    });
--- a/src/modules/09_coin/components/1_Proposals/listProposals.vue
+++ b/src/modules/09_coin/components/1_Proposals/listProposals.vue
@ -139,7 +139,7 @@
                  flat
                  round
                  color="light-blue-8"
-                  @click.stop.prevent="clickProposals(props.row.id)"
+                  @click.stop.prevent="clickProposals(props.row.file)"
                  icon="mdi-file-download"
                >
                  <q-tooltip>ดาวน์โหลดเอกสารประกอบ </q-tooltip>
@ -334,13 +334,14 @@ const fetchData = async () => {
        rows.value.push({
          id: e.period_id,
          round: e.period_name,
-          year: e.period_year,
+          year: e.period_year + 543,
          amount: e.period_amount,
          startDate:
            e.period_start == null ? null : date2Thai(new Date(e.period_start)),
          endDate:
            e.period_end == null ? null : date2Thai(new Date(e.period_end)),
          status: e.period_status,
+          file: e.period_doc,
        });
      });
    })
@ -356,8 +357,10 @@ const clickEdit = (col: any) => {
  router.push(`/coin/round-add/${col.id}`);
 };

-const clickProposals = (id: string) => {
-  //   window.open(config.API.exportDisablePassExamList(id));
+const clickProposals = (file: string) => {
+  if (file !== null) {
+    window.open(file);
+  }
 };

 // หัวตาราง2