ประเมินบุคคล => รายการชื่อกรรมการ

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-08-09 10:57:07 +07:00
parent 98147fce76
commit a069805cd4
5 changed files with 256 additions and 81 deletions

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { ref, reactive, watch, onMounted, computed } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import type { QTableProps } from "quasar";
@ -37,6 +37,7 @@ const {
/**
* props มาจาก page หล
*/
const actionType = defineModel<string>("actionType", { default: "" });
const props = defineProps({
data: {
type: Object,
@ -47,8 +48,10 @@ const props = defineProps({
default: () => "",
},
});
const isReadonly = ref<boolean>(false); //
// const isReadonly = ref<boolean>(false); //
const emit = defineEmits(["formDataReturn"]);
const isReadonly = computed(() => (actionType.value === "VIEW" ? true : false));
/**
* อมลเลขประจำตวประชาชน
*/
@ -143,15 +146,15 @@ const columnsRespondent = ref<QTableProps["columns"]>([
* เมอมอม
* เกบขอมลลง formData
*/
watch(props.data, async () => {
// console.log("data==>", props.data)
formData.prefix = props.data.prefix;
formData.firstname = props.data.firstname;
formData.lastname = props.data.lastname;
formData.position = props.data.position;
formData.phone = props.data.phone;
formData.email = props.data.email;
});
// watch(props.data, async () => {
// // console.log("data==>", props.data)
// formData.prefix = props.data.prefix;
// formData.firstname = props.data.firstname;
// formData.lastname = props.data.lastname;
// formData.position = props.data.position;
// formData.phone = props.data.phone;
// formData.email = props.data.email;
// });
/**
* ตรวจสอบขอมลกอนสงไปย api
@ -280,12 +283,31 @@ watch(
await searchInput();
}
);
function fetchForm(data: any) {
formData.prefix = data.prefix;
formData.firstname = data.firstname;
formData.lastname = data.lastname;
formData.position = data.position;
formData.phone = data.phone;
formData.email = data.email;
}
onMounted(() => {
if (props.data) {
showLoader();
setTimeout(async () => {
await fetchForm(props.data);
await hideLoader();
}, 1000);
}
});
</script>
<template>
<form @submit.prevent.stop="onValidate">
<q-card bordered>
<div class="col-12 row q-pa-md">
<div class="row q-col-gutter-md">
<div class="row col-12 q-col-gutter-md">
<div class="col-12 q-gutter-y-sm" v-if="data === null">
<div class="row q-col-gutter-md items-start">
<div class="col-12 col-sm-6 col-md-3">
@ -411,10 +433,10 @@ watch(
</d-table>
</div>
</div>
<div class="col-3">
<div :class="actionType !== '' ? 'col-12' : 'col-3'">
<q-input
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
dense
outlined
v-model="formData.prefix"
@ -426,9 +448,10 @@ watch(
lazy-rules
/>
</div>
<div class="col-3">
<div :class="actionType !== '' ? 'col-12' : 'col-3'">
<q-input
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
dense
outlined
v-model="formData.firstname"
@ -440,9 +463,10 @@ watch(
lazy-rules
/>
</div>
<div class="col-3">
<div :class="actionType !== '' ? 'col-12' : 'col-3'">
<q-input
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
dense
outlined
v-model="formData.lastname"
@ -454,9 +478,10 @@ watch(
lazy-rules
/>
</div>
<div class="col-3">
<div :class="actionType !== '' ? 'col-12' : 'col-3'">
<q-input
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
dense
outlined
v-model="formData.position"
@ -468,9 +493,10 @@ watch(
lazy-rules
/>
</div>
<div class="col-3">
<div :class="actionType !== '' ? 'col-12' : 'col-3'">
<q-input
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
dense
outlined
v-model="formData.phone"
@ -482,9 +508,10 @@ watch(
hide-bottom-space
/>
</div>
<div class="col-3">
<div :class="actionType !== '' ? 'col-12' : 'col-3'">
<q-input
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
dense
outlined
v-model="formData.email"
@ -496,8 +523,8 @@ watch(
</div>
</div>
</div>
<q-separator />
<div class="row col-12 q-pa-sm">
<q-separator v-if="!isReadonly" />
<div class="row col-12 q-pa-sm" v-if="!isReadonly">
<q-space />
<q-btn
for="ButtonOnSubmit"