From 5f7bcff08ac6355458cfcf41f9f1a555eb1232dd Mon Sep 17 00:00:00 2001
From: kittapath <kittapath@frappet.com>
Date: Wed, 25 Dec 2024 01:22:31 +0700
Subject: [PATCH] edit sys SYS_TRANSFER_REQ

---
 src/modules/02_transfer/views/AddTransfer.vue | 321 ++++++++----------
 1 file changed, 144 insertions(+), 177 deletions(-)

diff --git a/src/modules/02_transfer/views/AddTransfer.vue b/src/modules/02_transfer/views/AddTransfer.vue
index e72f495..fa53bde 100644
--- a/src/modules/02_transfer/views/AddTransfer.vue
+++ b/src/modules/02_transfer/views/AddTransfer.vue
@@ -1,64 +1,60 @@
 <script setup lang="ts">
-import { ref, onMounted } from "vue";
-import { useQuasar } from "quasar";
-import { useRouter, useRoute } from "vue-router";
+import { ref, onMounted } from "vue"
+import { useQuasar } from "quasar"
+import { useRouter, useRoute } from "vue-router"
 
-import http from "@/plugins/http";
-import config from "@/app.config";
-import { useCounterMixin } from "@/stores/mixin";
+import http from "@/plugins/http"
+import config from "@/app.config"
+import { useCounterMixin } from "@/stores/mixin"
 
-import type { QForm } from "quasar";
+import type { QForm } from "quasar"
 
-import Workflow from "@/components/Workflow/Main.vue";
+import Workflow from "@/components/Workflow/Main.vue"
 
-const $q = useQuasar();
-const route = useRoute();
-const router = useRouter();
-const mixin = useCounterMixin();
-const { success, messageError, showLoader, hideLoader, dialogConfirm } = mixin;
+const $q = useQuasar()
+const route = useRoute()
+const router = useRouter()
+const mixin = useCounterMixin()
+const { success, messageError, showLoader, hideLoader, dialogConfirm } = mixin
 
-const id = ref<string>(
-  router.currentRoute.value.name === "addTransfer"
-    ? ""
-    : route.params.id.toString()
-); //id path
+const id = ref<string>(router.currentRoute.value.name === "addTransfer" ? "" : route.params.id.toString()) //id path
 
-const files = ref<any>(); //ไฟล์
-const tranferOrg = ref<string>(""); //ชื่อหน่วยงานที่ขอโอนไป
-const noteReason = ref<string>(""); //เหตุผล
-const routeName = router.currentRoute.value.name; //ชื่อ path
+const files = ref<any>() //ไฟล์
+const tranferOrg = ref<string>("") //ชื่อหน่วยงานที่ขอโอนไป
+const noteReason = ref<string>("") //เหตุผล
+const routeName = router.currentRoute.value.name //ชื่อ path
 
 /** Dialog Save */
 async function saveData() {
-  dialogConfirm(
-    $q,
-    () => {
-      createTransfer();
-    },
-    "ยืนยันการยื่นข้อมูลการโอน",
-    "ต้องการยื่นข้อมูลการโอนนี้ใช่หรือไม่"
-  );
+	dialogConfirm(
+		$q,
+		() => {
+			createTransfer()
+		},
+		"ยืนยันการยื่นข้อมูลการโอน",
+		"ต้องการยื่นข้อมูลการโอนนี้ใช่หรือไม่"
+	)
 }
 
 /** ฟังก์ชั่นสร้างขอโอน */
 async function createTransfer() {
-  showLoader();
-  const formData = new FormData();
-  formData.append("Organization", tranferOrg.value);
-  formData.append("Reason", noteReason.value);
-  formData.append("file", files.value);
-  await http
-    .post(config.API.listtransfer(), formData)
-    .then((res) => {
-      router.push(`/transfer/` + res.data.result);
-      success($q, "บันทึกข้อมูลสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
+	showLoader()
+	const formData = new FormData()
+	formData.append("Organization", tranferOrg.value)
+	formData.append("Reason", noteReason.value)
+	formData.append("file", files.value)
+	await http
+		.post(config.API.listtransfer(), formData)
+		.then(res => {
+			router.push(`/transfer/` + res.data.result)
+			success($q, "บันทึกข้อมูลสำเร็จ")
+		})
+		.catch(e => {
+			messageError($q, e)
+		})
+		.finally(() => {
+			hideLoader()
+		})
 }
 
 /**
@@ -66,21 +62,21 @@ async function createTransfer() {
  * @param id ไอดีของข้อมูล
  */
 async function fecthDataTransfer(id: string) {
-  showLoader();
-  await http
-    .get(config.API.transferByid(id))
-    .then((res: any) => {
-      let data = res.data.result;
-      tranferOrg.value = data.organization;
-      noteReason.value = data.reason;
-      files.value = data.docs;
-    })
-    .catch((e: any) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
-    });
+	showLoader()
+	await http
+		.get(config.API.transferByid(id))
+		.then((res: any) => {
+			let data = res.data.result
+			tranferOrg.value = data.organization
+			noteReason.value = data.reason
+			files.value = data.docs
+		})
+		.catch((e: any) => {
+			messageError($q, e)
+		})
+		.finally(() => {
+			hideLoader()
+		})
 }
 
 /**
@@ -88,133 +84,104 @@ async function fecthDataTransfer(id: string) {
  * @param url URL File
  */
 function fileOpen(url: string) {
-  window.open(url, "_blank");
+	window.open(url, "_blank")
 }
 
 /**
  * เรียกฟังก์ชันทั้งหมดตอนเรียกใช้ไฟล์นี้
  */
 onMounted(() => {
-  if (route.params.id !== undefined) {
-    fecthDataTransfer(id.value);
-  }
-});
+	if (route.params.id !== undefined) {
+		fecthDataTransfer(id.value)
+	}
+})
 </script>
 
 <template>
-  <div class="col-12 row justify-center">
-    <div class="col-xs-12 col-sm-12 col-md-11">
-      <div class="toptitle text-white col-12 row items-center">
-        <q-btn
-          icon="mdi-arrow-left"
-          unelevated
-          round
-          dense
-          flat
-          color="primary"
-          class="q-mr-sm"
-          @click="router.go(-1)"
-        />
-        <div v-if="routeName == 'addTransfer'">เพิ่มเรื่องขอโอน</div>
-        <div v-else>รายละเอียดเรื่องขอโอน</div>
-      </div>
-      <q-form
-        class="col-12"
-        greedy
-        @submit.prevent
-        @validation-success="saveData"
-      >
-        <q-card bordered>
-          <q-card-section>
-            <div class="row">
-              <div class="col-12 row q-col-gutter-sm">
-                <q-input
-                  :class="
-                    routeName != 'addTransfer' ? 'col-12' : 'col-12 inputgreen'
-                  "
-                  dense
-                  outlined
-                  v-model="tranferOrg"
-                  hide-bottom-space
-                  label="หน่วยงานที่ขอโอนไป"
-                  :readonly="routeName != 'addTransfer'"
-                  :rules="[(val:string) => !!val || `${'กรุณากรอกหน่วยงานที่ขอโอนไป'}`]"
-                />
+	<div class="col-12 row justify-center">
+		<div class="col-xs-12 col-sm-12 col-md-11">
+			<div class="toptitle text-white col-12 row items-center">
+				<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
+				<div v-if="routeName == 'addTransfer'">เพิ่มเรื่องขอโอน</div>
+				<div v-else>รายละเอียดเรื่องขอโอน</div>
+			</div>
+			<q-form class="col-12" greedy @submit.prevent @validation-success="saveData">
+				<q-card bordered>
+					<q-card-section>
+						<div class="row">
+							<div class="col-12 row q-col-gutter-sm">
+								<q-input
+									:class="routeName != 'addTransfer' ? 'col-12' : 'col-12 inputgreen'"
+									dense
+									outlined
+									v-model="tranferOrg"
+									hide-bottom-space
+									label="หน่วยงานที่ขอโอนไป"
+									:readonly="routeName != 'addTransfer'"
+									:rules="[(val:string) => !!val || `${'กรุณากรอกหน่วยงานที่ขอโอนไป'}`]"
+								/>
 
-                <q-input
-                  :class="
-                    routeName != 'addTransfer' ? 'col-12' : 'col-12 inputgreen'
-                  "
-                  dense
-                  outlined
-                  v-model="noteReason"
-                  label="เหตุผล"
-                  hide-bottom-space
-                  type="textarea"
-                  :readonly="routeName != 'addTransfer'"
-                  :rules="[(val:string) => !!val || `${'กรุณากรอกเหตุผล'}`]"
-                />
+								<q-input
+									:class="routeName != 'addTransfer' ? 'col-12' : 'col-12 inputgreen'"
+									dense
+									outlined
+									v-model="noteReason"
+									label="เหตุผล"
+									hide-bottom-space
+									type="textarea"
+									:readonly="routeName != 'addTransfer'"
+									:rules="[(val:string) => !!val || `${'กรุณากรอกเหตุผล'}`]"
+								/>
 
-                <div class="col-12 row" v-if="routeName == 'addTransfer'">
-                  <q-file
-                    v-model="files"
-                    class="col-xs-12 col-sm-12 inputgreen"
-                    outlined
-                    dense
-                    lazy-rules
-                    hide-bottom-space
-                    accept=".pdf"
-                    :rules="[(val: string) => !!val || 'กรุณาเลือกไฟล์เอกสารเพิ่มเติม']"
-                    label="เอกสารเพิ่มเติม"
-                  >
-                    <template v-slot:prepend>
-                      <q-icon name="attach_file" /> </template
-                  ></q-file>
-                </div>
+								<div class="col-12 row" v-if="routeName == 'addTransfer'">
+									<q-file
+										v-model="files"
+										class="col-xs-12 col-sm-12 inputgreen"
+										outlined
+										dense
+										lazy-rules
+										hide-bottom-space
+										accept=".pdf"
+										:rules="[(val: string) => !!val || 'กรุณาเลือกไฟล์เอกสารเพิ่มเติม']"
+										label="เอกสารเพิ่มเติม"
+									>
+										<template v-slot:prepend> <q-icon name="attach_file" /> </template
+									></q-file>
+								</div>
 
-                <div class="col-12 row" v-if="routeName != 'addTransfer'">
-                  <q-card bordered flat class="full-width">
-                    <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>
-                    </div>
-                    <q-separator />
-                    <q-list separator>
-                      <q-item v-for="file in files" :key="file.key">
-                        <q-item-section>
-                          {{ file.fileName }}
-                        </q-item-section>
-                        <q-item-section avatar>
-                          <q-btn
-                            color="teal-5"
-                            round
-                            flat
-                            icon="mdi-download"
-                            @click="fileOpen(file.pathName)"
-                          ></q-btn>
-                        </q-item-section>
-                      </q-item>
-                    </q-list>
-                  </q-card>
-                </div>
+								<div class="col-12 row" v-if="routeName != 'addTransfer'">
+									<q-card bordered flat class="full-width">
+										<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>
+										</div>
+										<q-separator />
+										<q-list separator>
+											<q-item v-for="file in files" :key="file.key">
+												<q-item-section>
+													{{ file.fileName }}
+												</q-item-section>
+												<q-item-section avatar>
+													<q-btn color="teal-5" round flat icon="mdi-download" @click="fileOpen(file.pathName)"></q-btn>
+												</q-item-section>
+											</q-item>
+										</q-list>
+									</q-card>
+								</div>
 
-                <!-- Workflow -->
-                <div class="col-12" v-if="routeName != 'addTransfer'">
-                  <Workflow :id="id" :sys-name="`PLACEMENT_TRANSFER`" />
-                </div>
-              </div>
-            </div>
-          </q-card-section>
+								<!-- Workflow -->
+								<div class="col-12" v-if="routeName != 'addTransfer'">
+									<Workflow :id="id" :sys-name="`SYS_TRANSFER_REQ`" />
+								</div>
+							</div>
+						</div>
+					</q-card-section>
 
-          <q-separator v-if="routeName == 'addTransfer'" />
-          <q-card-actions align="right" v-if="routeName == 'addTransfer'">
-            <q-btn color="primary" label="ยื่นเรื่องขอโอน" type="onsubmit" />
-          </q-card-actions>
-        </q-card>
-      </q-form>
-    </div>
-  </div>
+					<q-separator v-if="routeName == 'addTransfer'" />
+					<q-card-actions align="right" v-if="routeName == 'addTransfer'">
+						<q-btn color="primary" label="ยื่นเรื่องขอโอน" type="onsubmit" />
+					</q-card-actions>
+				</q-card>
+			</q-form>
+		</div>
+	</div>
 </template>