ปรับ Eva

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2025-04-24 15:05:48 +07:00
parent 965304339d
commit 6813d496e8
8 changed files with 317 additions and 92 deletions

View file

@ -1,5 +1,6 @@
div
<script setup lang="ts">
import { reactive, onMounted } from "vue";
import { reactive, onMounted, ref } from "vue";
import { useRoute } from "vue-router";
import { useQuasar } from "quasar";
@ -7,6 +8,7 @@ import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useEvaluateDetailStore } from "@/modules/06_evaluate/stores/evaluteDetail";
import { useEvaluateStore } from "@/modules/06_evaluate/store";
/** importType*/
import type {
@ -16,10 +18,12 @@ import type {
/** importComponents*/
import TableData from "@/modules/06_evaluate/components/viewstep/tableStep1.vue";
import HeaderDialog from "@/components/DialogHeader.vue";
/** use*/
const mixin = useCounterMixin();
const store = useEvaluateDetailStore();
const storeEva = useEvaluateStore();
const $q = useQuasar();
const route = useRoute();
const { showLoader, hideLoader, messageError, date2Thai, findOrgNameHtml } =
@ -140,7 +144,10 @@ async function fetchDataAllDetail() {
});
http.get(config.API.dataUserPerformance).then((res) => {
formDetail.assessments = res.data.result;
formDetail.assessments = res.data.result.map((e: any) => ({
...e,
isAdd: false,
}));
});
http.get(config.API.dataUserPortfolio).then((res) => {
@ -217,6 +224,70 @@ function getData() {
});
}
/** ผลงานที่เคยเสนอขอ*/
const modalPerformance = ref<boolean>(false);
const isEdit = ref<boolean>(false);
const isIndex = ref<number>();
const formPerformance = reactive<any>({
year: null,
type: "",
subject: "",
evaluationResult: "",
});
const typeOptions = ref<string[]>([
"ประเมินชำนาญการ",
"ประเมินชำนาญการพิเศษ",
"ประเมินเชี่ยวชาญ",
]);
const resultOptions = ref<any[]>([
{ label: "ผ่าน", value: "ผ่าน" },
{ label: "ไม่ผ่าน", value: "ไม่ผ่าน" },
]);
function onOpenDialogPerformance(
stetusEdit: boolean = false,
index: number | null = null
) {
if (stetusEdit && index) {
isIndex.value = index;
const data = formDetail.assessments[index];
formPerformance.year = data.year ? Number(data.year) - 543 : null;
formPerformance.type = data.type;
formPerformance.subject = data.subject;
formPerformance.evaluationResult = data.evaluationResult;
}
isEdit.value = stetusEdit;
modalPerformance.value = true;
}
function onCloseDialogPerformance() {
modalPerformance.value = false;
formPerformance.year = null;
formPerformance.type = "";
formPerformance.subject = "";
formPerformance.evaluationResult = "";
}
function onSubmitPerformance() {
const body = {
...formPerformance,
year: formPerformance.year ? Number(formPerformance.year) + 543 : null,
isAdd: true,
};
if (isEdit.value && isIndex.value) {
formDetail.assessments[isIndex.value] = body;
} else {
formDetail.assessments.push(body);
}
onCloseDialogPerformance();
}
function onDeletePerformance(index: number) {
formDetail.assessments.splice(index, 1);
}
onMounted(async () => {
try {
showLoader();
@ -575,18 +646,178 @@ onMounted(async () => {
<q-card class="col-12 cardSp1" bordered>
<div class="text-weight-bold row items-center bg-grey-2 col-12">
<span class="q-ml-lg q-my-sm">ผลงานทเคยเสนอขอประเม (าม)</span>
<span class="q-ml-lg q-my-sm">ผลงานทเคยเสนอขอประเม (าม) </span>
<q-btn
v-if="storeEva.currentStep === 1"
class="q-ml-sm"
flat
round
dense
color="primary"
icon="add"
@click.stop="onOpenDialogPerformance(false)"
>
<q-tooltip>เพมขอม </q-tooltip>
</q-btn>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-10">
<TableData
:columns="columnAssessments"
:row="formDetail.assessments"
/>
<div class="q-pa-sm row col-12">
<d-table
flat
bordered
:columns="columnAssessments"
:rows="formDetail.assessments"
dense
:rows-per-page-options="[10, 25, 50, 100]"
virtual-scroll
class="row col-12"
:style="$q.screen.lt.sm ? 'width: 80vw' : 'width: 50vw;'"
>
<template v-slot:header="props">
<q-tr :props="props" class="bg-grey-2">
<q-th auto-widt v-if="storeEva.currentStep === 1" />
<q-th
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<span class="text-body2 text-black">{{ col.label }}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props">
<q-td auto-widt v-if="storeEva.currentStep === 1">
<q-btn
v-if="props.row.isAdd"
flat
dense
round
color="edit"
icon="edit"
@Click.stop.prevent="
onOpenDialogPerformance(true, props.rowIndex)
"
>
<q-tooltip>แกไข</q-tooltip>
</q-btn>
<q-btn
v-if="props.row.isAdd"
flat
dense
round
color="red"
icon="delete"
@click.stop.pervent="onDeletePerformance(props.rowIndex)"
>
<q-tooltip>ลบ</q-tooltip>
</q-btn>
</q-td>
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div>
{{ !col.value ? "-" : col.value }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</div>
</div>
</q-card>
</div>
</q-card>
<q-dialog v-model="modalPerformance" persistent>
<q-card style="min-width: 35%">
<q-form greedy @submit.prevent @validation-success="onSubmitPerformance">
<HeaderDialog
:tittle="'ผลงานที่เคยเสนอขอประเมิน (ถ้ามี)'"
:close="onCloseDialogPerformance"
/>
<q-separator />
<q-card-section>
<div class="row q-col-gutter-sm">
<div class="col-12">
<datepicker
menu-class-name="modalfix"
v-model="formPerformance.year"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
:model-value="
!formPerformance.year
? null
: Number(formPerformance.year) + 543
"
:label="`${'ปี พ.ศ.'}`"
:rules="[(val:string) => !!val || 'กรุณาเลือกปี พ.ศ.']"
hide-bottom-space
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-12">
<q-select
dense
outlined
label="ระดับตอนที่ยืนขอ"
hide-bottom-space
v-model="formPerformance.type"
:options="typeOptions"
/>
</div>
<div class="col-12">
<q-input
v-model="formPerformance.subject"
label="เรื่อง/ชื่อเรื่อง"
outlined
dense
hide-bottom-space
/>
</div>
<div class="col-12">
<q-option-group
:options="resultOptions"
type="radio"
v-model="formPerformance.evaluationResult"
inline
/>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn label="บันทึก" color="public" type="submit" />
</q-card-actions>
</q-form>
</q-card>
</q-dialog>
</template>
<style>