166 lines
4 KiB
Vue
166 lines
4 KiB
Vue
<script setup lang="ts">
|
|
import { ref, defineAsyncComponent, onMounted } from "vue";
|
|
import { useQuasar } from "quasar";
|
|
|
|
import { useRoute, useRouter } from "vue-router";
|
|
import { useCounterMixin } from "@/stores/mixin";
|
|
import http from "@/plugins/http";
|
|
import config from "@/app.config";
|
|
import genReport from "@/plugins/genreport";
|
|
|
|
const Header = defineAsyncComponent(
|
|
() =>
|
|
import(
|
|
"@/modules/05_placement/components/probation/FormEvaluation/Header.vue"
|
|
)
|
|
);
|
|
const FormReport = defineAsyncComponent(
|
|
() =>
|
|
import(
|
|
"@/modules/05_placement/components/probation/FormEvaluation/FormReport.vue"
|
|
)
|
|
);
|
|
|
|
import { useProbationDataStore } from "@/modules/05_placement/storeProbation";
|
|
|
|
const $q = useQuasar();
|
|
const router = useRouter();
|
|
const route = useRoute();
|
|
const probationStore = useProbationDataStore();
|
|
const {
|
|
date2Thai,
|
|
messageError,
|
|
success,
|
|
showLoader,
|
|
hideLoader,
|
|
dialogConfirm,
|
|
dialogMessageNotify,
|
|
} = useCounterMixin();
|
|
|
|
const tab = ref<string>("save1");
|
|
const tabs = ref<any[]>([{ no: 1 }, { no: 2 }]);
|
|
const dataArrayNumber = ref<number>(1);
|
|
const evaluate = ref<any>([]);
|
|
const assignId = ref<string>(route.params.form.toString());
|
|
const personalId = ref<string>(route.params.personalId.toString());
|
|
const isLoad = ref<boolean>(false);
|
|
const fullName = ref<string>("");
|
|
|
|
const dataResult = ref<any>();
|
|
|
|
/**
|
|
* @param id assignId
|
|
*/
|
|
async function fecthAssign(id: string) {
|
|
isLoad.value = false;
|
|
showLoader();
|
|
await http
|
|
.get(config.API.evaluateReportcreate(id))
|
|
.then((res) => {
|
|
dataResult.value = res.data.result;
|
|
fullName.value = res.data.result.person.name;
|
|
console.log();
|
|
|
|
tabs.value = res.data.result.result.map((e: any, index: number) => {
|
|
return { no: index + 1, ...e };
|
|
});
|
|
})
|
|
.catch((e) => {
|
|
messageError($q, e);
|
|
})
|
|
.finally(() => {
|
|
hideLoader();
|
|
isLoad.value = true;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* download file
|
|
* @param type type
|
|
*/
|
|
async function onDownloadFile(type: string) {
|
|
const noNumber = tab.value ? Number(tab.value.charAt(4)) : "";
|
|
showLoader();
|
|
await http
|
|
.get(config.API.reportEvaluateResult(type, assignId.value) + `/${noNumber}`)
|
|
.then(async (res) => {
|
|
const data = res.data.result;
|
|
await genReport(
|
|
data,
|
|
`แบบรายงานการประเมินฯ${fullName.value}.${type}`,
|
|
type
|
|
);
|
|
})
|
|
.catch(async (e) => {
|
|
messageError($q, JSON.parse(await e.response.data.text()));
|
|
})
|
|
.finally(() => {
|
|
hideLoader();
|
|
});
|
|
}
|
|
|
|
const changeTab = (tabVal: string) => {
|
|
tab.value = tabVal;
|
|
dataArrayNumber.value = Number(tabVal.charAt(4));
|
|
};
|
|
|
|
/** ไปหน้า page add */
|
|
function addData() {
|
|
tabs.value.push({ no: 2 });
|
|
}
|
|
|
|
onMounted(() => {
|
|
fecthAssign(assignId.value);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<Header
|
|
v-if="tabs.length > 0"
|
|
:change-tab="changeTab"
|
|
:add-data="addData"
|
|
:loop="tabs.length"
|
|
:FileDownload="onDownloadFile"
|
|
:checkPermission="
|
|
probationStore?.dataPermissions?.tab6?.isEdit && tabs.length === 1
|
|
"
|
|
/>
|
|
|
|
<q-tab-panels
|
|
v-model="tab"
|
|
animated
|
|
swipeable
|
|
vertical
|
|
transition-prev="jump-up"
|
|
transition-next="jump-up"
|
|
v-if="tabs.length > 0"
|
|
class="mt"
|
|
>
|
|
<q-tab-panel v-for="item in tabs" :name="`save${item.no}`" :key="item.no">
|
|
<FormReport :tab="tab" :data="dataResult" action="edit" v-if="isLoad" />
|
|
</q-tab-panel>
|
|
</q-tab-panels>
|
|
|
|
<!-- <div class="q-gutter-md" v-if="tabs.length === 0">
|
|
<div class="flex justify-center items-center q-my-md q-gutter-md">
|
|
<q-btn
|
|
v-if="!checkRoutePermisson"
|
|
outline
|
|
color="primary"
|
|
label="สร้างแบบประเมิน"
|
|
@click="addData"
|
|
:disable="probationStore.dataPermissions?.tab5.isEdit == false"
|
|
/>
|
|
</div>
|
|
</div> -->
|
|
|
|
<!-- <div class="col-12 q-ma-sm">
|
|
<FormReport />
|
|
</div> -->
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.mt {
|
|
margin-top: 25px;
|
|
}
|
|
</style>
|