Merge branch 'develop' into dev

2026-02-03 16:36:19 +07:00 · 2026-02-03 16:36:19 +07:00 · a40fe7605e
commit a40fe7605e
parent b1609de979 2c25c2838e
13 changed files with 362 additions and 165 deletions
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/05_ActingPos.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/05_ActingPos.vue
@ -40,6 +40,9 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 const isLeave = defineModel<boolean>("isLeave", {
  required: true,
 });
+const citizenId = defineModel<string>("citizenId", {
+  required: true,
+});

 const baseColumns = ref<QTableColumn[]>([
  {
@ -614,7 +617,7 @@ onMounted(() => {
                disable
                v-model="formData.status"
                label="ใช้งาน"
-                keep-color="primary"
+                keep-color
              />
            </div>
          </div>
@ -642,6 +645,7 @@ onMounted(() => {
    v-model:modal="modalCommand"
    v-model:command="command"
    v-model:command-id="commandId"
+    :citizen-id="citizenId"
  />
 </template>

--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/06_HelpGovernment.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/06_HelpGovernment.vue
@ -46,6 +46,9 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 const isLeave = defineModel<boolean>("isLeave", {
  required: true,
 });
+const citizenId = defineModel<string>("citizenId", {
+  required: true,
+});

 const baseColumns = ref<QTableColumn[]>([
  {
@ -977,6 +980,7 @@ onMounted(() => {
    v-model:modal="modalCommand"
    v-model:command="command"
    v-model:command-id="commandId"
+    :citizen-id="citizenId"
  />
 </template>

--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/07_Position.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/07_Position.vue
@ -39,6 +39,9 @@ const profileId = ref<string>(
 const isLeave = defineModel<boolean>("isLeave", {
  required: true,
 });
+const citizenId = defineModel<string>("citizenId", {
+  required: true,
+});

 const store = useGovernmentPosDataStore();
 const {
@ -1621,6 +1624,7 @@ onMounted(async () => {
    v-model:modal="modalCommand"
    v-model:command="command"
    v-model:commandId="commandId"
+    :citizen-id="citizenId"
  />
 </template>

--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/Main.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/Main.vue
@ -65,13 +65,22 @@ const storeRegistry = useRegistryNewDataStore();
      <PerformSpecialWork :is-leave="storeRegistry.isLeave" />
    </q-tab-panel>
    <q-tab-panel v-if="empType != '-employee'" name="5">
-      <ActingPos :is-leave="storeRegistry.isLeave" />
+      <ActingPos
+        :is-leave="storeRegistry.isLeave"
+        :citizen-id="storeRegistry.citizenId"
+      />
    </q-tab-panel>
    <q-tab-panel v-if="empType != '-employee'" name="6">
-      <HelpGovernmentDetail :is-leave="storeRegistry.isLeave" />
+      <HelpGovernmentDetail
+        :is-leave="storeRegistry.isLeave"
+        :citizen-id="storeRegistry.citizenId"
+      />
    </q-tab-panel>
    <q-tab-panel name="7">
-      <Postion :is-leave="storeRegistry.isLeave" />
+      <Postion
+        :is-leave="storeRegistry.isLeave"
+        :citizen-id="storeRegistry.citizenId"
+      />
    </q-tab-panel>
  </q-tab-panels>
 </template>
--- a/src/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue
+++ b/src/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue
@ -39,6 +39,9 @@ const profileId = ref<string>(
 const isLeave = defineModel<boolean>("isLeave", {
  required: true,
 });
+const citizenId = defineModel<string>("citizenId", {
+  required: true,
+});

 const store = useSalaryDataStore();
 const {
@ -1624,6 +1627,7 @@ onMounted(async () => {
    v-model:modal="modalCommand"
    v-model:command="command"
    v-model:commandId="commandId"
+    :citizen-id="citizenId"
  />
 </template>

--- a/src/modules/04_registryPerson/components/detail/Salary/Main.vue
+++ b/src/modules/04_registryPerson/components/detail/Salary/Main.vue
@ -45,7 +45,10 @@ const tab = ref<string>("1");

  <q-tab-panels v-model="tab" animated>
    <q-tab-panel name="1">
-      <PositionSalary :is-leave="storeRegistry.isLeave" />
+      <PositionSalary
+        :is-leave="storeRegistry.isLeave"
+        :citizen-id="storeRegistry.citizenId"
+      />
    </q-tab-panel>
    <q-tab-panel name="2">
      <NotReceiveSalary :is-leave="storeRegistry.isLeave" />
--- a/src/modules/04_registryPerson/components/requestEdit/Page01_Detail.vue
+++ b/src/modules/04_registryPerson/components/requestEdit/Page01_Detail.vue
@ -553,12 +553,17 @@ onMounted(async () => {
          </q-form>

          <div class="col-12">
+            {{ typeEmp }}
+            <!-- v-if="typeEmp != 'employee'" -->
            <Workflow
-              v-if="typeEmp != 'employee'"
              v-model:is-check-data="isCheckData"
              ref="workflowRef"
              :id="requestId"
-              sys-name="REGISTRY_PROFILE"
+              :sys-name="
+                typeEmp !== 'employee'
+                  ? 'REGISTRY_PROFILE'
+                  : 'REGISTRY_PROFILE_EMP'
+              "
            />
          </div>
        </div>
--- a/src/modules/05_placement/components/PersonalList/Table.vue
+++ b/src/modules/05_placement/components/PersonalList/Table.vue
@ -53,6 +53,7 @@ const props = defineProps({
 const modalCommand = ref<boolean>(false);
 const command = ref<string>("");
 const commandId = ref<string>("");
+const commandCitizenId = ref<string>("");

 let roleAdmin = ref<boolean>(false);
 const edit = ref<boolean>(true);
@ -912,9 +913,10 @@ function onSearchAdd() {
 }

 function onRefCommand(data: any) {
-  modalCommand.value = true;
  command.value = data.refCommandNo;
  commandId.value = data.commandId;
+  commandCitizenId.value = data.citizenId;
+  modalCommand.value = true;
  // commandId.value = 'bdf9da91-ba45-497a-a2b7-cc49e2446d97'; //จำลอง
 }

@ -1787,6 +1789,7 @@ onMounted(async () => {
    v-model:modal="modalCommand"
    v-model:command="command"
    v-model:commandId="commandId"
+    v-model:citizen-id="commandCitizenId"
  />
 </template>

--- a/src/modules/13_salary/components/DialogInfoMain.vue
+++ b/src/modules/13_salary/components/DialogInfoMain.vue
@ -36,6 +36,7 @@ const props = defineProps({
 const avatar = ref<string>("");
 const fullName = ref<string>("");
 const position = ref<string>("");
+const citizenId = ref<string>("");
 const isLoading = ref<boolean>(true);

 /** function เรียกข้อมูลส่วนตัว*/
@ -48,6 +49,7 @@ function fetchInformation() {

      fullName.value = `${data.prefix}${data.firstName} ${data.lastName}`;
      position.value = data.position;
+      citizenId.value = data.citizenId;

      if (data.avatarName) {
        await fetchProfile(data.id as string, data.avatarName);
@ -220,6 +222,7 @@ watch(
                    v-if="type === 'posSalary'"
                    v-model:profileId="profileId"
                    :employeeClass="employeeClass"
+                    :citizenId="citizenId"
                  />
                  <InfoDiscipline
                    v-if="type === 'discipline'"
--- a/src/modules/13_salary/components/InfoSalary.vue
+++ b/src/modules/13_salary/components/InfoSalary.vue
@ -26,6 +26,7 @@ const {
 /** props*/
 const profileId = defineModel<string>("profileId", { required: true });
 const employeeClass = defineModel<string>("employeeClass", { required: true });
+const citizenId = defineModel<string>("citizenId", { required: true });

 const modalCommand = ref<boolean>(false);
 const command = ref<string>("");
@ -470,6 +471,7 @@ onMounted(() => {
    v-model:modal="modalCommand"
    v-model:command="command"
    v-model:commandId="commandId"
+    :citizen-id="citizenId"
  />
 </template>

--- a/src/modules/18_command/components/DialogPreviewCommand.vue
+++ b/src/modules/18_command/components/DialogPreviewCommand.vue
@ -19,6 +19,7 @@ const { showLoader, hideLoader, messageError } = useCounterMixin();
 const modal = defineModel<boolean>("modal", { required: true });
 const command = defineModel<string>("command", { required: true });
 const commandId = defineModel<string>("commandId", { required: true });
+const citizenId = defineModel<string>("citizenId", { required: true });
 const promises = ref<any>([]);

 const tab = ref<string>("main"); //tab
@ -37,6 +38,7 @@ function closeDialog() {
  modal.value = false;
  command.value = "";
  commandId.value = "";
+  citizenId.value = "";
 }

 /**
@ -88,13 +90,25 @@ async function downloadCover(type: string) {
 */
 async function fetchDataCommand(type: string) {
  let newType = type === "cover" ? "คำสั่ง" : "แนบท้าย";
+  const pathAPI =
+    type === "cover"
+      ? config.API.fileByFile(
+          "ระบบออกคำสั่ง",
+          newType,
+          commandId.value,
+          newType
+        )
+      : config.API.subFileByFileName(
+          "ระบบออกคำสั่ง",
+          newType,
+          commandId.value,
+          citizenId.value,
+          newType
+        );
  await http
-    .get(
-      config.API.fileByFile("ระบบออกคำสั่ง", newType, commandId.value, newType)
-    )
+    .get(pathAPI)
    .then(async (res) => {
      const data = res.data;
-      console.log(res);

      if (type === "cover") {
        dataCover.value = data;
--- a/src/modules/18_command/components/Step/0_Main.vue
+++ b/src/modules/18_command/components/Step/0_Main.vue
@ -43,7 +43,7 @@ async function fetchData() {
          ? "Live"
          : data.isSignature === false
          ? "Digital"
-          : "";
+          : "Live";
      isStatus.value = data.status;
      isDraft.value = data.isDraft;
      isSign.value = data.isSign;
@ -174,11 +174,12 @@ onMounted(async () => {

            <q-item tag="label" v-ripple>
              <q-item-section avatar>
+                <!-- :disable="isSignature !== null || store.readonly" -->
                <q-radio
                  v-model="signaturetype"
                  val="Digital"
                  color="primary"
-                  :disable="isSignature !== null || store.readonly"
+                  disable
                />
              </q-item-section>
              <q-item-section>
--- a/src/modules/18_command/components/Step/View0_Live.vue
+++ b/src/modules/18_command/components/Step/View0_Live.vue
@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref } from "vue";
+import { onMounted, ref, computed } from "vue";
 import { useQuasar } from "quasar";
 import axios from "axios";

@ -42,12 +42,23 @@ const isAuthority = defineModel<boolean>("isAuthority", { required: true }); //
 const isCheckAuthority = ref<boolean>(false); //เช็ครอผู้มีอำนาจลงนามอนุมัติ
 const isAttachment = defineModel<boolean>("isAttachment", { required: true }); //เช็คบัญชีแนบท้าย
 const fileUploadOrder = ref<any>(null); //ไฟล์คำสั่ง
-const fileUploadTailer = ref<any>(null); //ไฟล์เอกสารแนบท้าย
+// const fileUploadTailer = ref<any>(null); //ไฟล์เอกสารแนบท้าย
 const fileOrder = ref<any>(null); //ไฟล์คำสั่ง
-const fileTailer = ref<any>(null); //ไฟล์เอกสารแนบท้าย
+// const fileTailer = ref<any>(null); //ไฟล์เอกสารแนบท้าย

 const isLoad = ref<boolean>(true); //แสดงโหลด
 const modalPerView = ref<boolean>(false);
+// สมมติว่ามีรายชื่อ
+const attachmentList = ref<any[]>([]);
+const attachmentFiles = ref<Record<number, any>>({});
+
+const isFileTailer = computed(() => {
+  // จำนวนไฟล์ที่อัปโหลดครบทุกคน
+  return (
+    attachmentList.value.length > 0 &&
+    attachmentList.value.every((person) => !!attachmentFiles.value[person.id])
+  );
+});

 /**
 * ฟังก์ชันยืนยันการส่งให้ผู้มีอำนาจลงนามอนุมัติ
@ -88,7 +99,9 @@ async function updateCheckboxAuthority(val: boolean) {
    .put(config.API.command + `/pending-check/${commandId.value}`, {
      sign: val,
    })
-    .then(() => {})
+    .then(() => {
+      isAttachment.value && fetchLists();
+    })
    .catch((err) => {
      messageError($q, err);
    })
@ -104,7 +117,7 @@ async function updateCheckboxAuthority(val: boolean) {
 function onUploadFile(group: string) {
  showLoader();
  let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
-  let file = group === "order" ? fileUploadOrder.value : fileUploadTailer.value;
+  // let file = group === "order" ? fileUploadOrder.value : fileUploadTailer.value;
  const fileName = { fileName: type };
  http
    .post(config.API.file("ระบบออกคำสั่ง", type, commandId.value), {
@ -118,7 +131,11 @@ function onUploadFile(group: string) {
          res.data[key]?.fileName !== ""
      );
      foundKey &&
-        (await uploadFileDoc(res.data[foundKey]?.uploadUrl, file, group));
+        (await uploadFileDoc(
+          res.data[foundKey]?.uploadUrl,
+          fileUploadOrder.value,
+          group
+        ));
    })
    .catch((err) => {
      messageError($q, err);
@ -134,7 +151,12 @@ function onUploadFile(group: string) {
 * @param file ไฟล์ที่ต้องการอัปโหลด
 * @param group ประเภพไฟล์ "คำสั่ง","แนบท้าย"
 */
-async function uploadFileDoc(uploadUrl: string, file: any, group: string) {
+async function uploadFileDoc(
+  uploadUrl: string,
+  file: any,
+  group: string,
+  id?: string
+) {
  const formData = new FormData();
  formData.append("file", file);
  showLoader();
@ -154,7 +176,11 @@ async function uploadFileDoc(uploadUrl: string, file: any, group: string) {
      if (group === "order") {
        fileUploadOrder.value = null;
      } else {
-        fileUploadTailer.value = null;
+        attachmentList.value.forEach((e) => {
+          if (e.id === id) {
+            e.file = null;
+          }
+        });
      }
      hideLoader();
    });
@ -167,15 +193,40 @@ async function uploadFileDoc(uploadUrl: string, file: any, group: string) {
 async function fetchDoc(group: string) {
  showLoader();
  let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
+  if (group === "order") {
+    await fetchDocOrder(type);
+  } else {
+    attachmentList.value.forEach(async (e) => {
+      await fetchDocTailer(type, e.id);
+    });
+  }
+}
+
+async function fetchDocOrder(type: string) {
  await http
    .get(config.API.file("ระบบออกคำสั่ง", type, commandId.value))
    .then((res) => {
      const data = res.data[0];
-      if (group === "order") {
-        fileOrder.value = data;
-      } else {
-        fileTailer.value = data;
-      }
+      fileOrder.value = data;
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+async function fetchDocTailer(type: string, id: string) {
+  await http
+    .get(config.API.subFile("ระบบออกคำสั่ง", type, commandId.value, id))
+    .then((res) => {
+      const data = res.data[0];
+      attachmentList.value.forEach((e) => {
+        if (e.id === id) {
+          attachmentFiles.value[e.id] = data;
+        }
+      });
    })
    .catch((e) => {
      messageError($q, e);
@ -190,18 +241,33 @@ const dataFile = ref<DataFileDownload>();
 * ดาวน์โหลดลิงก์ไฟล์
 * @param fileName file name
 */
-function downloadFile(file: any, group: string, isView: boolean = false) {
+function downloadFile(
+  file: any,
+  group: string,
+  isView: boolean = false,
+  id: string
+) {
  let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
+
+  const pathApi =
+    group === "order"
+      ? config.API.fileByFile(
+          "ระบบออกคำสั่ง",
+          type,
+          commandId.value,
+          file.fileName
+        )
+      : config.API.subFileByFileName(
+          "ระบบออกคำสั่ง",
+          type,
+          commandId.value,
+          id,
+          file.fileName
+        );
+
  showLoader();
  http
-    .get(
-      config.API.fileByFile(
-        "ระบบออกคำสั่ง",
-        type,
-        commandId.value,
-        file.fileName
-      )
-    )
+    .get(pathApi)
    .then((res) => {
      const data = res.data;
      dataFile.value = data;
@ -257,6 +323,49 @@ function onConfirmOrder() {
  }
 }

+/** ดึงข้อมูล บุคคล */
+async function fetchLists() {
+  await http
+    .get(config.API.commandAction(commandId.value, "tab2"))
+    .then(async (res) => {
+      const data = await res.data.result;
+      attachmentList.value = data.commandRecives.map((item: any) => ({
+        id: item.citizenId,
+        name: item.prefix + item.firstName + " " + item.lastName,
+        file: null,
+      }));
+    })
+    .catch((e) => {
+      messageError($q, e);
+    });
+}
+
+function onUploadFileTailer(id: string, file: any) {
+  const type = "แนบท้าย";
+  const fileName = { fileName: type };
+
+  http
+    .post(config.API.subFile("ระบบออกคำสั่ง", type, commandId.value, id), {
+      replace: true,
+      fileList: fileName,
+    })
+    .then(async (res) => {
+      const foundKey: string | undefined = Object.keys(res.data).find(
+        (key) =>
+          res.data[key]?.fileName !== undefined &&
+          res.data[key]?.fileName !== ""
+      );
+      foundKey &&
+        (await uploadFileDoc(res.data[foundKey]?.uploadUrl, file, type, id));
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
 onMounted(async () => {
  isCheckDraft.value = isDraft.value;
  isCheckAuthority.value = isAuthority.value;
@ -264,6 +373,7 @@ onMounted(async () => {
    isLoad.value = false;
    let promises = [fetchDoc("order")];
    if (isAttachment.value) {
+      await fetchLists();
      promises.push(fetchDoc("tailer"));
    }
    await Promise.all(promises).finally(() => {
@ -318,141 +428,172 @@ onMounted(async () => {
            />
          </div>

-          <div
-            class="row col-12 q-col-gutter-sm"
-            style="padding-left: 50px"
-            v-if="isAuthority"
-          >
+          <div class="row col-12" style="padding-left: 50px" v-if="isAuthority">
            <div class="col-12 text-header">
              อัปโหลดเอกสารสแกนกลับเข้าสู่ระบบ
            </div>
-            <div class="col-6">
-              <q-card
-                bordered
-                class="row col-12"
-                style="border: 1px solid #d6dee1"
-              >
-                <div
-                  class="row items-center col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
+            <div class="col-6 q-col-gutter-sm">
+              <div class="col-6">
+                <q-card
+                  bordered
+                  class="row col-12"
+                  style="border: 1px solid #d6dee1"
                >
-                  คำสั่ง
-                  <q-space />
-                  <q-btn
-                    v-if="fileOrder"
-                    rounded
-                    flat
-                    dense
-                    color="primary"
-                    icon="mdi-eye"
-                    @click.prevent="downloadFile(fileOrder, 'order', true)"
+                  <div
+                    class="row items-center col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
                  >
-                    <q-tooltip>ดูไฟล์คำสั่ง</q-tooltip>
-                  </q-btn>
-                  <q-btn
-                    v-if="fileOrder"
-                    rounded
-                    flat
-                    dense
-                    color="red"
-                    icon="mdi-download"
-                    @click.prevent="downloadFile(fileOrder, 'order')"
-                  >
-                    <q-tooltip>ดาวน์โหลดไฟล์คำสั่ง</q-tooltip>
-                  </q-btn>
-                </div>
-                <div class="col-12"><q-separator /></div>
-                <div class="col-12 q-pa-md" v-if="step === 2">
-                  <q-file
-                    outlined
-                    dense
-                    v-model="fileUploadOrder"
-                    label="เลือกไฟล์คำสั่ง"
-                    hide-bottom-space
-                    accept=".pdf"
-                    :readonly="store.readonly"
-                  >
-                    <template v-slot:prepend>
-                      <q-icon name="attach_file" />
-                    </template>
+                    คำสั่ง
+                    <q-space />
+                    <q-btn
+                      v-if="fileOrder"
+                      rounded
+                      flat
+                      dense
+                      color="primary"
+                      icon="mdi-eye"
+                      @click.prevent="
+                        downloadFile(fileOrder, 'order', true, '')
+                      "
+                    >
+                      <q-tooltip>ดูไฟล์คำสั่ง</q-tooltip>
+                    </q-btn>
+                    <q-btn
+                      v-if="fileOrder"
+                      rounded
+                      flat
+                      dense
+                      color="red"
+                      icon="mdi-download"
+                      @click.prevent="
+                        downloadFile(fileOrder, 'order', false, '')
+                      "
+                    >
+                      <q-tooltip>ดาวน์โหลดไฟล์คำสั่ง</q-tooltip>
+                    </q-btn>
+                  </div>
+                  <div class="col-12"><q-separator /></div>
+                  <div class="col-12 q-pa-md" v-if="step === 2">
+                    <q-file
+                      outlined
+                      dense
+                      v-model="fileUploadOrder"
+                      label="เลือกไฟล์คำสั่ง"
+                      hide-bottom-space
+                      accept=".pdf"
+                      :readonly="store.readonly"
+                    >
+                      <template v-slot:prepend>
+                        <q-icon name="attach_file" />
+                      </template>

-                    <template v-slot:after>
-                      <q-btn
-                        @click.prevent="onUploadFile('order')"
-                        flat
-                        round
-                        icon="mdi-upload"
-                        :color="fileUploadOrder == null ? 'grey-5' : 'blue-5'"
-                        :disable="fileUploadOrder == null"
-                      />
-                    </template>
-                  </q-file>
-                </div>
-              </q-card>
-            </div>
+                      <template v-slot:after>
+                        <q-btn
+                          @click.prevent="onUploadFile('order')"
+                          flat
+                          round
+                          icon="mdi-upload"
+                          :color="fileUploadOrder == null ? 'grey-5' : 'blue-5'"
+                          :disable="fileUploadOrder == null"
+                        />
+                      </template>
+                    </q-file>
+                  </div>
+                </q-card>
+              </div>

-            <div class="col-6" v-if="isAttachment">
-              <q-card
-                bordered
-                class="row col-12"
-                style="border: 1px solid #d6dee1"
-              >
-                <div
-                  class="row items-center col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
+              <div class="col-6" v-if="isAttachment">
+                <q-card
+                  bordered
+                  class="row col-12"
+                  style="border: 1px solid #d6dee1"
                >
-                  เอกสารแนบท้าย
-                  <q-space />
-                  <q-btn
-                    v-if="fileTailer"
-                    rounded
-                    flat
-                    dense
-                    color="primary"
-                    icon="mdi-eye"
-                    @click.prevent="downloadFile(fileTailer, 'tailer', true)"
+                  <div
+                    class="row items-center col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
                  >
-                    <q-tooltip>ดูไฟล์เอกสารแนบท้าย</q-tooltip>
-                  </q-btn>
-                  <q-btn
-                    v-if="fileTailer"
-                    rounded
-                    flat
-                    dense
-                    color="red"
-                    icon="mdi-download"
-                    @click.prevent="downloadFile(fileTailer, 'tailer')"
-                  >
-                    <q-tooltip>ดาวน์โหลดไฟล์แนบท้าย</q-tooltip>
-                  </q-btn>
-                </div>
-                <div class="col-12"><q-separator /></div>
-                <div class="col-12 q-pa-md" v-if="step === 2">
-                  <q-file
-                    outlined
-                    dense
-                    v-model="fileUploadTailer"
-                    label="เลือกไฟล์เอกสารแนบท้าย"
-                    hide-bottom-space
-                    accept=".pdf"
-                    :readonly="store.readonly"
-                  >
-                    <template v-slot:prepend>
-                      <q-icon name="attach_file" />
-                    </template>
-
-                    <template v-slot:after>
-                      <q-btn
-                        @click.prevent="onUploadFile('tailer')"
-                        flat
-                        round
-                        icon="mdi-upload"
-                        :color="fileUploadTailer == null ? 'grey-5' : 'blue-5'"
-                        :disable="fileUploadTailer == null"
-                      />
-                      <q-tooltip>อัปโหลดไฟล์เอกสารแนบท้าย</q-tooltip>
-                    </template>
-                  </q-file>
-                </div>
-              </q-card>
+                    เอกสารแนบท้าย
+                  </div>
+                  <div class="col-12"><q-separator /></div>
+                  <div class="row col-12 q-pa-md q-col-gutter-sm">
+                    <div
+                      v-for="(person, idx) in attachmentList"
+                      :key="person.id"
+                      class="col-12"
+                    >
+                      <q-card flat bordered class="q-pa-sm">
+                        <div class="row items-center">
+                          <div class="text-weight-medium">
+                            {{ person.name }}
+                          </div>
+                          <q-space />
+                          <q-btn
+                            v-if="attachmentFiles[person.id]"
+                            @click.prevent="
+                              downloadFile(
+                                attachmentFiles[person.id],
+                                'tailer',
+                                true,
+                                person.id
+                              )
+                            "
+                            flat
+                            dense
+                            color="primary"
+                            icon="mdi-eye"
+                            class="q-mr-xs"
+                          >
+                            <q-tooltip>ดูไฟล์เอกสารแนบท้าย</q-tooltip>
+                          </q-btn>
+                          <q-btn
+                            v-if="attachmentFiles[person.id]"
+                            @click.prevent="
+                              downloadFile(
+                                attachmentFiles[person.id],
+                                'tailer',
+                                false,
+                                person.id
+                              )
+                            "
+                            flat
+                            dense
+                            color="red"
+                            icon="mdi-download"
+                          >
+                            <q-tooltip>ดาวน์โหลดไฟล์เอกสารแนบท้าย</q-tooltip>
+                          </q-btn>
+                        </div>
+                        <q-file
+                          v-if="step === 2"
+                          outlined
+                          dense
+                          v-model="person.file"
+                          label="เลือกไฟล์เอกสารแนบท้าย"
+                          hide-bottom-space
+                          accept=".pdf"
+                          :readonly="store.readonly"
+                          class="full-width"
+                        >
+                          <template v-slot:prepend>
+                            <q-icon name="attach_file" />
+                          </template>
+                          <template v-slot:after>
+                            <q-btn
+                              @click.prevent="
+                                onUploadFileTailer(person.id, person.file)
+                              "
+                              flat
+                              round
+                              icon="mdi-upload"
+                              :color="person.file == null ? 'grey-5' : 'blue-5'"
+                              :disable="person.file == null"
+                            />
+                            <q-tooltip>อัปโหลดไฟล์เอกสารแนบท้าย</q-tooltip>
+                          </template>
+                        </q-file>
+                      </q-card>
+                    </div>
+                  </div>
+                </q-card>
+              </div>
            </div>
          </div>

@ -462,7 +603,7 @@ onMounted(async () => {
              step === 2 &&
              isAuthority &&
              fileOrder &&
-              (!isAttachment || fileTailer)
+              (!isAttachment || isFileTailer)
            "
          >
            <q-btn
@ -472,14 +613,14 @@ onMounted(async () => {
              :color="
                !isAuthority ||
                fileOrder === null ||
-                (fileTailer === null && isAttachment)
+                (!isFileTailer && isAttachment)
                  ? 'grey-5'
                  : 'public'
              "
              :disable="
                !isAuthority ||
                fileOrder === null ||
-                (fileTailer === null && isAttachment)
+                (!isFileTailer && isAttachment)
              "
            />
          </div>