update => API ออกคำสั่ง
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
342529d979
commit
f876abf651
4 changed files with 352 additions and 184 deletions
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { onBeforeMount, ref } from "vue";
|
||||
import { onMounted, ref } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useRoute } from "vue-router";
|
||||
|
|
@ -79,7 +79,7 @@ function onConfirmSignature() {
|
|||
);
|
||||
}
|
||||
|
||||
onBeforeMount(async () => {
|
||||
onMounted(async () => {
|
||||
await fetchData();
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, ref } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import axios from "axios";
|
||||
|
||||
import { useRoute } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
|
@ -107,6 +108,8 @@ const reason = ref<string>("");
|
|||
//รอออกคำสั่ง
|
||||
const isCheckOrder = ref<boolean>(true); //เช็ครอออกคำสั่ง
|
||||
|
||||
const isLoad = ref<boolean>(false); //แสดงโหลด
|
||||
|
||||
/**
|
||||
* ฟังก์ชันยืนยันการส่งให้ผู้มีอำนาจลงนามอนุมัติ
|
||||
*/
|
||||
|
|
@ -173,11 +176,125 @@ function onCloseDialog() {
|
|||
modalComment.value = false;
|
||||
}
|
||||
|
||||
onMounted(() => {});
|
||||
async function fetchDoc(group: string) {
|
||||
showLoader();
|
||||
let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
|
||||
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;
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function onUploadFile(group: string) {
|
||||
showLoader();
|
||||
let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
|
||||
let file = group === "order" ? fileUploadOrder.value : fileUploadTailer.value;
|
||||
const fileName = { fileName: type };
|
||||
http
|
||||
.post(config.API.file("ระบบออกคำสั่ง", type, commandId.value), {
|
||||
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, group));
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่นสำหรับอัพโหลดไฟล์เอกสารหลักฐาน
|
||||
*/
|
||||
async function uploadFileDoc(uploadUrl: string, file: any, group: string) {
|
||||
const formData = new FormData();
|
||||
formData.append("file", file);
|
||||
showLoader();
|
||||
await axios
|
||||
.put(uploadUrl, file, {
|
||||
headers: {
|
||||
"Content-Type": file.type,
|
||||
},
|
||||
})
|
||||
.then(async () => {
|
||||
await fetchDoc(group);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
if (group === "order") {
|
||||
fileUploadOrder.value = null;
|
||||
} else {
|
||||
fileUploadTailer.value = null;
|
||||
}
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ดาวน์โหลดลิงก์ไฟล์
|
||||
* @param fileName file name
|
||||
*/
|
||||
function downloadFile(file: any, group: string) {
|
||||
let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
|
||||
showLoader();
|
||||
http
|
||||
.get(
|
||||
config.API.fileByFile(
|
||||
"ระบบออกคำสั่ง",
|
||||
type,
|
||||
commandId.value,
|
||||
file.fileName
|
||||
)
|
||||
)
|
||||
.then((res) => {
|
||||
const data = res.data.downloadUrl;
|
||||
window.open(data, "_blank");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
isLoad.value = false;
|
||||
let promises = [fetchDoc("order")];
|
||||
if (isAttachment.value) {
|
||||
promises.push(fetchDoc("tailer"));
|
||||
}
|
||||
await Promise.all(promises).finally(() => {
|
||||
isLoad.value = true;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="q-px-lg q-py-md">
|
||||
<div class="q-px-lg q-py-md" v-if="isLoad">
|
||||
<q-timeline :color="store.status === 'CANCEL' ? 'grey-4' : 'blue-5'">
|
||||
<!-- แบบร่าง -->
|
||||
<q-timeline-entry
|
||||
|
|
@ -185,112 +302,121 @@ onMounted(() => {});
|
|||
:icon="step === 1 ? 'mdi-pencil' : step > 1 ? 'done' : 'mdi-numeric-1'"
|
||||
>
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div :class="isAttachment ? 'col-12' : 'col-6'">
|
||||
<fieldset class="border q-px-lg q-py-sm">
|
||||
<legend class="text-header q-px-sm">
|
||||
อัปโหลดเอกสารสแกนกลับเข้าสู่ระบบ
|
||||
</legend>
|
||||
<div class="row q-col-gutter-md q-mb-md">
|
||||
<!-- คำสั่ง -->
|
||||
<div :class="isAttachment ? 'col-6' : 'col-12'">
|
||||
<label class="text-file">คำสั่ง</label>
|
||||
<div class="text-right" v-if="fileOrder">
|
||||
<q-btn flat dense color="primary" icon="mdi-eye" rounded>
|
||||
<q-tooltip>ดูไฟล์คำสั่ง</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- :href="OrderPDFUpload" -->
|
||||
<q-btn
|
||||
rounded
|
||||
type="a"
|
||||
flat
|
||||
dense
|
||||
color="red"
|
||||
icon="mdi-download"
|
||||
target="_blank"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลดไฟล์คำสั่ง</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<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"
|
||||
>
|
||||
คำสั่ง
|
||||
<q-space />
|
||||
<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 === 1">
|
||||
<q-file
|
||||
v-if="step === 1"
|
||||
outlined
|
||||
dense
|
||||
v-model="fileUploadOrder"
|
||||
label="เลือกไฟล์คำสั่ง"
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => val || 'กรุณาเลือกไฟล์ไฟล์คำสั่ง']"
|
||||
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>
|
||||
|
||||
<!-- เอกสารแนบท้าย -->
|
||||
<div v-if="isAttachment" class="col-6">
|
||||
<label class="text-file">เอกสารแนบท้าย</label>
|
||||
<div class="text-right" v-if="fileTailer">
|
||||
<q-btn flat dense color="primary" icon="mdi-eye" rounded>
|
||||
<q-tooltip>ดูเอกสารแนบท้าย</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- :href="TailerPDFUpload" -->
|
||||
<q-btn
|
||||
type="a"
|
||||
rounded
|
||||
flat
|
||||
dense
|
||||
color="red"
|
||||
icon="mdi-download"
|
||||
target="_blank"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลดเอกสารแนบท้าย</q-tooltip>
|
||||
</q-btn>
|
||||
</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"
|
||||
>
|
||||
เอกสารแนบท้าย
|
||||
<q-space />
|
||||
<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 === 1">
|
||||
<q-file
|
||||
v-if="step === 1"
|
||||
outlined
|
||||
dense
|
||||
v-model="fileUploadTailer"
|
||||
label="เลือกไฟล์เอกสารแนบท้าย"
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']"
|
||||
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>
|
||||
|
||||
<div class="row col-12" v-if="!store.readonly">
|
||||
<q-space />
|
||||
<q-btn
|
||||
icon="mdi-upload"
|
||||
label="อัปโหลดเอกสารส"
|
||||
:color="
|
||||
fileUploadOrder == null ||
|
||||
(isAttachment && fileUploadTailer === null)
|
||||
? 'grey-5'
|
||||
: 'blue-5'
|
||||
"
|
||||
:disable="
|
||||
fileUploadOrder == null ||
|
||||
(isAttachment && fileUploadTailer === null)
|
||||
"
|
||||
>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="col-12"
|
||||
v-if="!isCheckDraft && fileOrder && (isAttachment || fileTailer)"
|
||||
v-if="!isCheckDraft && fileOrder && (!isAttachment || fileTailer)"
|
||||
>
|
||||
<q-btn
|
||||
v-if="!store.readonly"
|
||||
|
|
@ -401,6 +527,23 @@ onMounted(() => {});
|
|||
</q-timeline>
|
||||
</div>
|
||||
|
||||
<div class="full-width row flex-center text-accent q-gutter-sm" v-else>
|
||||
<span
|
||||
><div
|
||||
style="
|
||||
height: 50vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
"
|
||||
class="text-grey-5"
|
||||
>
|
||||
<q-spinner color="primary" size="3em" :thickness="10" />
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- เลือกผู้บังคับบัญชา/ผู้มีอำนาจออกคำสั่ง -->
|
||||
<q-dialog v-model="modalSelect" persistent>
|
||||
<q-card style="min-width: 70%">
|
||||
|
|
@ -554,11 +697,6 @@ onMounted(() => {});
|
|||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.border {
|
||||
border-radius: 10px;
|
||||
border: 1px solid #e9eaec;
|
||||
}
|
||||
|
||||
.text-header {
|
||||
color: #34373c;
|
||||
font-size: 1rem;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { onBeforeMount, onMounted, ref } from "vue";
|
||||
import { onMounted, ref } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import axios from "axios";
|
||||
|
||||
|
|
@ -42,8 +42,7 @@ const fileUploadTailer = ref<any>(null); //ไฟล์เอกสารแน
|
|||
const fileOrder = ref<any>(null); //ไฟล์คำสั่ง
|
||||
const fileTailer = ref<any>(null); //ไฟล์เอกสารแนบท้าย
|
||||
|
||||
//รอออกคำสั่ง
|
||||
const isCheckOrder = ref<boolean>(false); //เช็ครอออกคำสั่ง
|
||||
const isLoad = ref<boolean>(false); //แสดงโหลด
|
||||
|
||||
/**
|
||||
* ฟังก์ชันยืนยันการส่งให้ผู้มีอำนาจลงนามอนุมัติ
|
||||
|
|
@ -73,6 +72,10 @@ function onConfirmDraft() {
|
|||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันเลือกผู้มีอำนาจลงนามอนุมัติแล้ว
|
||||
* @param val ค่าที่เลือก เป็น boolean
|
||||
*/
|
||||
async function updateCheckboxAuthority(val: boolean) {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -88,6 +91,10 @@ async function updateCheckboxAuthority(val: boolean) {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันสร้าง URL อัปโหลดไฟล์
|
||||
* @param group ประเภพไฟล์ "คำสั่ง","แนบท้าย"
|
||||
*/
|
||||
function onUploadFile(group: string) {
|
||||
showLoader();
|
||||
let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
|
||||
|
|
@ -116,7 +123,10 @@ function onUploadFile(group: string) {
|
|||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่นสำหรับอัพโหลดไฟล์เอกสารหลักฐาน
|
||||
* ฟังก์ชั่นสำหรับอัพโหลดไฟล์ "คำสั่ง","แนบท้าย"
|
||||
* @param uploadUrl URL อัปโหลดไฟล์
|
||||
* @param file ไฟล์ที่ต้องการอัปโหลด
|
||||
* @param group ประเภพไฟล์ "คำสั่ง","แนบท้าย"
|
||||
*/
|
||||
async function uploadFileDoc(uploadUrl: string, file: any, group: string) {
|
||||
const formData = new FormData();
|
||||
|
|
@ -144,6 +154,10 @@ async function uploadFileDoc(uploadUrl: string, file: any, group: string) {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันดึงข่อมูลไฟล์ "คำสั่ง","แนบท้าย"
|
||||
* @param group ประเภพไฟล์ "คำสั่ง","แนบท้าย"
|
||||
*/
|
||||
async function fetchDoc(group: string) {
|
||||
showLoader();
|
||||
let type = group === "order" ? "คำสั่ง" : "แนบท้าย";
|
||||
|
|
@ -236,21 +250,21 @@ onMounted(async () => {
|
|||
isCheckDraft.value = isDraft.value;
|
||||
isCheckAuthority.value = isAuthority.value;
|
||||
|
||||
if (step.value > 1) {
|
||||
showLoader();
|
||||
if (step.value !== 1) {
|
||||
isLoad.value = false;
|
||||
let promises = [fetchDoc("order")];
|
||||
if (isAttachment.value) {
|
||||
promises.push(fetchDoc("tailer"));
|
||||
}
|
||||
await Promise.all(promises).finally(() => {
|
||||
hideLoader();
|
||||
isLoad.value = true;
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="q-px-lg q-py-md">
|
||||
<div class="q-px-lg q-py-md" v-if="isLoad">
|
||||
<q-timeline :color="store.status === 'CANCEL' ? 'grey-4' : 'blue-5'">
|
||||
<!-- แบบร่าง -->
|
||||
<q-timeline-entry
|
||||
|
|
@ -294,51 +308,53 @@ onMounted(async () => {
|
|||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-6" style="padding-left: 50px" v-if="isAuthority">
|
||||
<fieldset class="border q-px-lg q-py-sm">
|
||||
<legend class="text-header q-px-sm">
|
||||
อัปโหลดเอกสารสแกนกลับเข้าสู่ระบบ
|
||||
</legend>
|
||||
<div class="row q-col-gutter-md q-mb-md">
|
||||
<!-- คำสั่ง -->
|
||||
<div class="col-12">
|
||||
<label class="text-file">คำสั่ง</label>
|
||||
<div v-if="fileOrder">
|
||||
<q-btn
|
||||
flat
|
||||
dense
|
||||
color="primary"
|
||||
icon="mdi-eye"
|
||||
rounded
|
||||
@click.prevent="downloadFile(fileOrder, 'order')"
|
||||
>
|
||||
<q-tooltip>ดูไฟล์คำสั่ง</q-tooltip>
|
||||
</q-btn>
|
||||
<div
|
||||
class="row col-12 q-col-gutter-sm"
|
||||
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"
|
||||
>
|
||||
คำสั่ง
|
||||
<q-space />
|
||||
<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-btn rounded flat dense color="red" icon="mdi-download">
|
||||
<q-tooltip>ดาวน์โหลดไฟล์คำสั่ง</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-11">
|
||||
<q-file
|
||||
v-if="step === 2 && !store.readonly"
|
||||
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-file>
|
||||
</div>
|
||||
|
||||
<div class="col-1" v-if="!store.readonly && step === 2">
|
||||
<template v-slot:after>
|
||||
<q-btn
|
||||
@click.prevent="onUploadFile('order')"
|
||||
flat
|
||||
|
|
@ -347,49 +363,51 @@ onMounted(async () => {
|
|||
:color="fileUploadOrder == null ? 'grey-5' : 'blue-5'"
|
||||
:disable="fileUploadOrder == null"
|
||||
/>
|
||||
<q-tooltip>อัปโหลดไฟล์คำสั่ง</q-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<!-- เอกสารแนบท้าย -->
|
||||
<div v-if="isAttachment" class="col-12">
|
||||
<label class="text-file">เอกสารแนบท้าย</label>
|
||||
<div v-if="fileTailer">
|
||||
<q-btn
|
||||
flat
|
||||
dense
|
||||
color="primary"
|
||||
icon="mdi-eye"
|
||||
rounded
|
||||
@click.prevent="downloadFile(fileTailer, 'tailer')"
|
||||
>
|
||||
<q-tooltip>ดูเอกสารแนบท้าย</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn rounded flat dense color="red" icon="mdi-download">
|
||||
<q-tooltip>ดาวน์โหลดเอกสารแนบท้าย</q-tooltip>
|
||||
</q-btn>
|
||||
</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"
|
||||
>
|
||||
เอกสารแนบท้าย
|
||||
<q-space />
|
||||
<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>
|
||||
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-11">
|
||||
<q-file
|
||||
v-if="step === 2 && !store.readonly"
|
||||
outlined
|
||||
dense
|
||||
v-model="fileUploadTailer"
|
||||
label="เลือกไฟล์เอกสารแนบท้าย"
|
||||
hide-bottom-space
|
||||
accept=".pdf"
|
||||
:readonly="store.readonly"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
|
||||
<div class="col-1" v-if="!store.readonly && step === 2">
|
||||
<template v-slot:after>
|
||||
<q-btn
|
||||
@click.prevent="onUploadFile('tailer')"
|
||||
flat
|
||||
|
|
@ -399,11 +417,11 @@ onMounted(async () => {
|
|||
:disable="fileUploadTailer == null"
|
||||
/>
|
||||
<q-tooltip>อัปโหลดไฟล์เอกสารแนบท้าย</q-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
|
|
@ -459,14 +477,26 @@ onMounted(async () => {
|
|||
</q-timeline-entry>
|
||||
</q-timeline>
|
||||
</div>
|
||||
|
||||
<div class="full-width row flex-center text-accent q-gutter-sm" v-else>
|
||||
<span
|
||||
><div
|
||||
style="
|
||||
height: 50vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
"
|
||||
class="text-grey-5"
|
||||
>
|
||||
<q-spinner color="primary" size="3em" :thickness="10" />
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.border {
|
||||
border-radius: 10px;
|
||||
border: 1px solid #e9eaec;
|
||||
}
|
||||
|
||||
.text-header {
|
||||
color: #34373c;
|
||||
font-size: 1rem;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue