หน้ารายการประเมิน

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-01-03 17:03:25 +07:00
parent 0b4a87e293
commit 9f247273c1
12 changed files with 334 additions and 89 deletions

View file

@ -52,8 +52,6 @@ function onClickPopupHistory() {
}
async function onCilckNextStep() {
console.log(store.step);
const functionCreateDoc: (() => Promise<void>) | null =
store.step === 1
? await saveStep1
@ -94,6 +92,13 @@ async function onCilckNextStep() {
}
async function validateForm() {
console.log(downloadFileRef.value);
store.checkFileupload = !store.checkFileupload;
console.log(store.checkFileupload);
const emptyValues = downloadFileRef.value.filter((e: any) => e === "");
const hasError = [];
for (const key in formCommandRef) {
if (Object.prototype.hasOwnProperty.call(formCommandRef, key)) {
@ -105,13 +110,21 @@ async function validateForm() {
}
}
if (hasError.every((result) => result === true)) {
store.step === 2 ? saveStep2() : saveStep6();
if (emptyValues.length > 0) {
console.log("There are empty values in the array.");
} else {
store.step === 2 ? saveStep2() : saveStep6();
}
// store.step === 2 && emptyValues.length > 0 ? saveStep2() : saveStep6();
}
}
const pdfSrc = ref<any>();
async function updateFilePDF(url: any) {
const urlDownloadFile = ref<string>("");
async function updateFilePDF(url: any, urlDownload: string) {
pdfSrc.value = url;
urlDownloadFile.value = urlDownload;
}
/** function เช็คการยื่นข้อประเมิน*/
@ -123,7 +136,6 @@ async function fetchCheckStatus() {
const data = res.data.result;
const id =
route.params.type === "expert" ? data.expertId : data.specialExpertId;
router.push(`/evaluate/detail/${route.params.type}/${id}`);
})
.catch((err) => {
@ -324,13 +336,13 @@ const formCommandRef: FormCommandRef = {
fileEvaluation5: fileEvaluation5Ref,
fileEvaluation6: fileEvaluation6Ref,
};
const downloadFileRef = ref<any>();
function updateformCommand(val: any, ref: any) {
formCommand.commanderFullname = val.commanderFullname;
formCommand.commanderPosition = val.commanderPosition;
formCommand.commanderAboveFullname = val.commanderAboveFullname;
formCommand.commanderAbovePosition = val.commanderAbovePosition;
commanderFullnameRef.value = ref.commanderFullnameRef;
commanderPositionRef.value = ref.commanderPositionRef;
commanderAboveFullnameRef.value = ref.commanderAboveFullnameRef;
@ -341,7 +353,9 @@ function updateformCommand(val: any, ref: any) {
fileEvaluation4Ref.value = ref.fileEvaluation4Ref;
fileEvaluation5Ref.value = ref.fileEvaluation5Ref;
fileEvaluation6Ref.value = ref.fileEvaluation6Ref;
downloadFileRef.value = ref.downloadFile;
}
async function saveStep2() {
dialogConfirm(
$q,
@ -572,10 +586,12 @@ onMounted(async () => {
<ViewStep3
v-if="store.step === 3 && pdfSrc"
:pdfSrc="pdfSrc"
:urlDownloadFile="urlDownloadFile"
/>
<ViewStep7
v-if="store.step === 7 && pdfSrc"
:pdfSrc="pdfSrc"
:urlDownloadFile="urlDownloadFile"
/>
</div>

View file

@ -74,7 +74,7 @@ const store = useEvaluateStore();
<q-step
:name="7"
prefix="7"
title="ตรวจสอบเอกสารเล่ม 2"
title="รอพิจารณาผลการประเมิน 2"
:done="store.currentStep >= 7"
:disable="store.currentStep < 7"
>
@ -83,7 +83,7 @@ const store = useEvaluateStore();
<q-step
:name="8"
prefix="8"
title="รอพิจารณาผล"
title="ตรวจสอบความถูกต้องของเอกสารเล่ม 2"
:done="store.currentStep >= 8"
:disable="store.currentStep < 8"
>

View file

@ -1,17 +1,12 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import type { QTableProps } from "quasar";
import { useRouter } from "vue-router";
import { useEvaluateStore } from "@/modules/06_evaluate/store";
const store = useEvaluateStore();
const props = defineProps({
row: {
type: Array as () => any[],
require: true,
},
});
const router = useRouter();
/** ค้นหาคอลัม */
const visibleColumns = ref<string[]>(["no", "type", "dateSend", "status"]);
@ -23,7 +18,7 @@ const columns = ref<QTableProps["columns"]>([
sortable: true,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px; width:5px;",
style: "font-size: 14px; ",
},
{
name: "type",
@ -32,7 +27,7 @@ const columns = ref<QTableProps["columns"]>([
sortable: true,
field: "type",
headerStyle: "font-size: 14px",
style: "font-size: 14px; width:15%;",
style: "font-size: 14px; ",
},
{
name: "dateSend",
@ -41,7 +36,7 @@ const columns = ref<QTableProps["columns"]>([
sortable: true,
field: "dateSend",
headerStyle: "font-size: 14px",
style: "font-size: 14px; width:15%;",
style: "font-size: 14px; ",
},
{
name: "status",
@ -53,6 +48,16 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const pagination = ref({
sortBy: "",
descending: true,
page: 1,
rowsPerPage: 10,
});
function redirectToDetail(data: any) {
router.push(`/evaluate/detail/${data.typeparam.toLowerCase()}/${data.id}`);
}
onMounted(() => {
store.columns = columns.value;
@ -71,6 +76,7 @@ onMounted(() => {
:rows-per-page-options="[10, 25, 50, 100]"
:visible-columns="store.visibleColumns"
:filter="store.filterKeyword"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
@ -81,7 +87,12 @@ onMounted(() => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="redirectToDetail(props.row)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
@ -91,6 +102,17 @@ onMounted(() => {
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="dark"
size="sm"
boundary-links
direction-links
:max="scope.pagesNumber"
></q-pagination>
</template>
</q-table>
</template>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, onMounted, reactive } from "vue";
import { ref, watch, onMounted, reactive } from "vue";
import { useRouter, useRoute } from "vue-router";
import { VuePDF, usePDF } from "@tato30/vue-pdf";
import { useQuasar } from "quasar";
@ -51,8 +51,8 @@ const fileEvaluation3Ref = ref<object | null>(null);
const fileEvaluation4Ref = ref<object | null>(null);
const fileEvaluation5Ref = ref<object | null>(null);
const fileEvaluation6Ref = ref<object | null>(null);
const performanceRef = ref<object | null>(null);
const performanceOwnerRef = ref<object | null>(null);
const performanceRef = ref<any>(null);
const performanceOwnerRef = ref<any>(null);
/**
* function updateFormref
@ -70,6 +70,14 @@ function updateInput(val: any) {
fileEvaluation4Ref: fileEvaluation4Ref.value,
fileEvaluation5Ref: fileEvaluation5Ref.value,
fileEvaluation6Ref: fileEvaluation6Ref.value,
downloadFile: [
downloadFile1.value,
downloadFile2.value,
downloadFile3.value,
downloadFile4.value,
downloadFile5.value,
downloadFile6.value,
],
};
emit("update:form", val, ref); //
}
@ -212,29 +220,43 @@ async function fetchPathUpload(
type: string,
file: any
) {
const body = {
fileList: { fileName: type, metadata: {} },
};
performanceRef.value.validate();
performanceOwnerRef.value.validate();
if (id && file) {
showLoader();
await http
.post(config.API.loadPathDocument(volume, id), body)
.then((res) => {
const foundKey: string | undefined = Object.keys(res.data).find(
(key) =>
res.data[key]?.fileName !== undefined &&
res.data[key]?.fileName !== ""
);
foundKey && uploadfile(res.data[foundKey]?.uploadUrl, file);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
downloadFile(type);
hideLoader();
});
if (
performanceRef.value.hasError === false &&
performanceOwnerRef.value.hasError === false
) {
const body = {
fileList: {
fileName: type,
metadata: {
subject: performance.value,
author: performanceOwner.value,
},
},
};
if (id && file) {
showLoader();
await http
.post(config.API.loadPathDocument(volume, id), body)
.then((res) => {
const foundKey: string | undefined = Object.keys(res.data).find(
(key) =>
res.data[key]?.fileName !== undefined &&
res.data[key]?.fileName !== ""
);
foundKey && uploadfile(res.data[foundKey]?.uploadUrl, file);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
downloadFile(type);
hideLoader();
});
}
}
}
@ -311,6 +333,7 @@ const downloadFile3 = ref<string>("");
const downloadFile4 = ref<string>("");
const downloadFile5 = ref<string>("");
const downloadFile6 = ref<string>("");
const emptyValues = ref<any>();
/**
* function ดาวนโหลดไฟล
* @param fileName อไฟล
@ -346,29 +369,53 @@ async function downloadFile(fileName: string) {
}
})
.finally(() => {
const ref = {
commanderFullnameRef: commanderFullnameRef.value,
commanderPositionRef: commanderPositionRef.value,
commanderAboveFullnameRef: commanderAboveFullnameRef.value,
commanderAbovePositionRef: commanderAbovePositionRef.value,
fileEvaluation1Ref: fileEvaluation1Ref.value,
fileEvaluation2Ref: fileEvaluation2Ref.value,
fileEvaluation3Ref: fileEvaluation3Ref.value,
fileEvaluation4Ref: fileEvaluation4Ref.value,
fileEvaluation5Ref: fileEvaluation5Ref.value,
fileEvaluation6Ref: fileEvaluation6Ref.value,
downloadFile: [
downloadFile1.value,
downloadFile2.value,
downloadFile3.value,
downloadFile4.value,
downloadFile5.value,
downloadFile6.value,
],
};
emptyValues.value = ref.downloadFile.filter((e: any) => e === "");
// if (emptyValues.value.length < 6) {
// console.log("There are empty values in the array.");
// }
emit("update:form", formCommand, ref);
hideLoader();
});
}
const statusUpload = ref<boolean>(false);
function onClickCheckUploadStatus() {
statusUpload.value = true;
}
/**lifecycle Hooks*/
onMounted(async () => {
const ref = {
commanderFullnameRef: commanderFullnameRef.value,
commanderPositionRef: commanderPositionRef.value,
commanderAboveFullnameRef: commanderAboveFullnameRef.value,
commanderAbovePositionRef: commanderAbovePositionRef.value,
fileEvaluation1Ref: fileEvaluation1Ref.value,
fileEvaluation2Ref: fileEvaluation2Ref.value,
fileEvaluation3Ref: fileEvaluation3Ref.value,
fileEvaluation4Ref: fileEvaluation4Ref.value,
fileEvaluation5Ref: fileEvaluation5Ref.value,
fileEvaluation6Ref: fileEvaluation6Ref.value,
};
if (keycloak.tokenParsed != null) {
performanceOwner.value = keycloak.tokenParsed.name;
}
if (store.currentStep > 2) {
fetcheSigner(evaluateId.value);
}
fetchCheckSpec(evaluateId.value);
emit("update:form", formCommand, ref);
downloadFile("1-แบบพิจารณาคุณสมบัติบุคคล");
downloadFile("2-แบบแสดงรายละเอียดการเสนอผลงาน");
downloadFile(
@ -378,6 +425,33 @@ onMounted(async () => {
downloadFile("5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)");
downloadFile("6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)");
});
watch(
() => store.checkFileupload,
() => {
const fileEvaluationValues = [
fileEvaluation1,
fileEvaluation2,
fileEvaluation3,
fileEvaluation4,
fileEvaluation5,
fileEvaluation6,
];
const downloadFileValues = [
downloadFile1,
downloadFile2,
downloadFile3,
downloadFile4,
downloadFile5,
downloadFile6,
];
for (let i = 0; i < downloadFileValues.length; i++) {
if (downloadFileValues[i].value === "") {
fileEvaluationValues[i].value = null;
}
}
}
);
</script>
<template>
@ -394,9 +468,12 @@ onMounted(async () => {
<!-- <div class="text-weight-medium q-py-sm">
งคบบญชาชนต
</div> -->
<div class="row col-12 q-col-gutter-md q-pa-sm">
<q-input
:readonly="store.currentStep != 2"
:readonly="
store.currentStep != 2 || emptyValues?.length < 6
"
ref="performanceRef"
dense
class="col-xs-12 col-sm-6"
@ -408,7 +485,9 @@ onMounted(async () => {
lazy-rules
/>
<q-input
:readonly="store.currentStep != 2"
:readonly="
store.currentStep != 2 || emptyValues?.length < 6
"
ref="performanceOwnerRef"
class="col-xs-12 col-sm-6"
dense
@ -422,6 +501,14 @@ onMounted(async () => {
</div>
</div>
</div>
<!-- <div align="right">
<q-btn
unelevated
label="อัปโหลไฟล์"
color="public"
@click="onClickCheckUploadStatus"
/>
</div> -->
</div>
</div>
</q-card>

View file

@ -61,10 +61,13 @@ async function downloadFile(url: string) {
},
})
.then((res) => {
console.log(url);
const blob = new Blob([res.data]);
const objectUrl = URL.createObjectURL(blob);
console.log(objectUrl);
emit("update:file", objectUrl);
emit("update:file", objectUrl, url);
})
.catch((err) => {
messageError($q, err);

View file

@ -1,5 +1,6 @@
<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { ref, reactive, watch, onMounted } from "vue";
import keycloak from "@/plugins/keycloak";
import { useRoute } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
@ -28,6 +29,11 @@ const pdfSrc = ref<any>();
const performance = ref<string>("");
const performanceOwner = ref<string>("");
const position = ref<string>("");
const performanceRef = ref<object | null>(null);
const performanceOwnerRef = ref<object | null>(null);
const positionRef = ref<object | null>(null);
const formCommand = reactive<FormCommand>({
commanderFullname: "",
@ -55,6 +61,7 @@ const updateInput = (value: any) => {
commanderAboveFullnameRef: commanderAboveFullnameRef.value,
commanderAbovePositionRef: commanderAbovePositionRef.value,
fileEvaluation1Ref: fileEvaluation1Ref.value,
downloadFile: [downloadUrl.value],
};
emit("update:form", value, ref);
};
@ -66,14 +73,14 @@ async function fetchPathUpload(
file: any
) {
const body = {
fileList: { fileName: type, metadata: {} },
// "1-",
// "2-",
// "3- ( .)",
// "4-",
// "5- ( 9)",
// "6- ( 11)",
fileList: {
fileName: type,
metadata: {
subject: performance.value,
author: performanceOwner.value,
position: position.value
},
},
};
if (id && file) {
showLoader();
@ -105,6 +112,7 @@ async function uploadfile(uploadUrl: string, file: any) {
},
})
.then(() => {
checkDoc();
success($q, "อัปโหลไฟล์สำเร็จ");
})
.catch((err) => {
@ -152,18 +160,15 @@ async function fetchCheckDate() {
}
onMounted(async () => {
const ref = {
commanderFullnameRef: commanderFullnameRef.value,
commanderPositionRef: commanderPositionRef.value,
commanderAboveFullnameRef: commanderAboveFullnameRef.value,
commanderAbovePositionRef: commanderAbovePositionRef.value,
fileEvaluation1Ref: fileEvaluation1Ref.value,
};
if (keycloak.tokenParsed != null) {
performanceOwner.value = keycloak.tokenParsed.name;
}
checkDoc();
if (store.currentStep > 2) {
fetcheSigner(evaluateId.value);
}
await fetchCheckDate();
emit("update:form", formCommand, ref);
// props.evaluateId && (await fetchPathUpload(" 2", props.evaluateId));
});
@ -172,7 +177,7 @@ function checkDoc() {
showLoader();
http
.get(
config.API.loadFileDocument("เล่ม 2", store.evaluateId, "1-เอกสารเล่ม 2")
config.API.loadFileDocument("เล่ม 2", evaluateId.value, "1-เอกสารเล่ม 2")
)
.then((res: any) => {
downloadUrl.value = res.data.downloadUrl;
@ -182,12 +187,29 @@ function checkDoc() {
// })
.finally(() => {
hideLoader();
const ref = {
commanderFullnameRef: commanderFullnameRef.value,
commanderPositionRef: commanderPositionRef.value,
commanderAboveFullnameRef: commanderAboveFullnameRef.value,
commanderAbovePositionRef: commanderAbovePositionRef.value,
fileEvaluation1Ref: fileEvaluation1Ref.value,
downloadFile: [downloadUrl.value],
};
emit("update:form", formCommand, ref);
});
}
onMounted(() => {
checkDoc();
});
watch(
() => store.checkFileupload,
() => {
downloadUrl.value === ""
? (fileEvaluation1.value = "")
: fileEvaluation1.value;
}
);
// onMounted(() => {});
</script>
<template>
@ -214,7 +236,7 @@ onMounted(() => {
</div> -->
<div class="row col-12 q-col-gutter-md q-pa-sm">
<q-input
:readonly="store.currentStep != 2"
:readonly="store.currentStep != 6"
ref="performanceRef"
dense
class="col-xs-12 col-sm-6"
@ -226,7 +248,7 @@ onMounted(() => {
lazy-rules
/>
<q-input
:readonly="store.currentStep != 2"
:readonly="store.currentStep != 6"
ref="performanceOwnerRef"
class="col-xs-12 col-sm-6"
dense
@ -237,6 +259,20 @@ onMounted(() => {
:rules="[(val) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
lazy-rules
/>
<q-input
:readonly="store.currentStep != 6"
ref="positionRef"
class="col-xs-12 col-sm-6"
dense
outlined
v-model="position"
@update:model-value="updateInput(formCommand)"
label="ตำแหน่งที่ได้รับ"
:rules="[
(val) => !!val || `${'กรุณากรอกตำแหน่งที่ได้รับ'}`,
]"
lazy-rules
/>
</div>
</div>
</div>

View file

@ -59,7 +59,7 @@ async function downloadFile(url: string) {
const blob = new Blob([res.data]);
const objectUrl = URL.createObjectURL(blob);
emit("update:file", objectUrl);
emit("update:file", objectUrl, url);
})
.catch((err) => {
messageError($q, err);

View file

@ -8,6 +8,9 @@ const props = defineProps({
pdfSrc: {
type: String,
},
urlDownloadFile: {
type: String,
},
});
const modalPerview = ref<boolean>(false);
@ -18,7 +21,14 @@ const store = useEvaluateStore();
<template>
<div class="col-12 row">
<q-space />
<q-btn flat round color="primary" icon="download">
<q-btn
flat
round
color="primary"
icon="download"
target="_blank"
:href="props.urlDownloadFile"
>
<q-tooltip>ดาวนโหลด</q-tooltip>
</q-btn>
<q-btn

View file

@ -8,6 +8,9 @@ const props = defineProps({
pdfSrc: {
type: String,
},
urlDownloadFile: {
type: String,
},
});
const modalPerview = ref<boolean>(false);
</script>
@ -15,7 +18,14 @@ const modalPerview = ref<boolean>(false);
<template>
<div class="col-12 row">
<q-space />
<q-btn flat round color="primary" icon="download">
<q-btn
flat
round
color="primary"
icon="download"
target="_blank"
:href="props.urlDownloadFile"
>
<q-tooltip>ดาวนโหลด</q-tooltip>
</q-btn>
<q-btn

View file

@ -1,6 +1,10 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import type { QTableProps } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
const mixin = useCounterMixin();
const { date2Thai } = mixin;
export const useEvaluateStore = defineStore("evaluateStore", () => {
const filterKeyword = ref<string>("");
@ -8,7 +12,20 @@ export const useEvaluateStore = defineStore("evaluateStore", () => {
const visibleColumns = ref<string[]>([]);
const row = ref<any>();
async function fetchEvaluateList(data: any) {
const list = data.map((e: any) => ({
id: e.id,
typeparam: e.type,
type: e.type === "EXPERT" ? "ชำนาญการ" : "ชำนาญการพิเศษ",
dateSend: date2Thai(e.updatedAt),
status: convertStatus(e.step),
}));
row.value = list;
}
const tabMenu = ref<string>("1");
const checkFileupload = ref<boolean>(false);
const showLoadStatus = ref<boolean>(false);
const step = ref<number>(1);
const currentStep = ref<number>(1);
@ -19,11 +36,34 @@ export const useEvaluateStore = defineStore("evaluateStore", () => {
"รอตรวจสอบคุณสมบัติ",
"ประกาศบนเว็บไซต์",
"จัดเตรียมเอกสารเล่ม 2",
"ตรวจสอบเอกสารเล่ม 2",
"รอพิจารณาผล",
"รอพิจารณาผลการประเมิน 2",
"ตรวจสอบความถูกต้องของเอกสารเล่ม 2",
"เสร็จสิ้น",
]);
function convertStatus(val: string) {
switch (val) {
case "CHECK_SPEC":
return "ตรวจสอบคุณสมบัติด้วยตนเอง";
case "PREPARE_DOC_V1":
return "จัดเตรียมเอกสารเล่ม 1";
case "CHECK_DOC_V1":
return "ตรวจสอบความถูกต้องของเอกสารเล่ม 1";
case "WAIT_CHECK_DOC_V1":
return "รอตรวจสอบคุณสมบัติ";
case "ANNOUNCE_WEB":
return "ประกาศบนเว็บไซต์";
case "PREPARE_DOC_V2":
return "จัดเตรียมเอกสารเล่ม 2";
case "WAIT_CHECK_DOC_V2":
return "รอพิจารณาผลการประเมิน 2";
case "CHECK_DOC_V2":
return "ตรวจสอบความถูกต้องของเอกสารเล่ม 2";
case "DONE":
return "เสร็จสิ้น";
}
}
const tabPanels = ref<string>("1");
const evaluateId = ref<string>("");
@ -33,8 +73,10 @@ export const useEvaluateStore = defineStore("evaluateStore", () => {
columns,
visibleColumns,
row,
fetchEvaluateList,
tabMenu,
checkFileupload,
step,
currentStep,
title,

View file

@ -32,11 +32,29 @@ const listMenu = ref<ListMenu[]>([
]);
const modal = ref<boolean>(false);
const menu = ref<ListMenu>();
function onclickAddEvaluate(data: ListMenu) {
modal.value = !modal.value;
menu.value = data;
}
async function fetchEvaluteList() {
showLoader();
await http
.get(config.API.evaluationList())
.then((res) => {
store.fetchEvaluateList(res.data.result.data);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
onMounted(() => {
fetchEvaluteList();
});
</script>
<template>
<div class="col-12 row justify-center">