เพิ่มแบบสำรวจการทดลองงาน

This commit is contained in:
Warunee Tamkoo 2023-08-24 18:06:51 +07:00
parent 837c338546
commit 7c8a9c77c0
2 changed files with 243 additions and 0 deletions

View file

@ -21,6 +21,9 @@ const TabsTemplate3 = defineAsyncComponent(
const SummaryScore = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/SummaryScore.vue")
);
const SummarySurvey = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/SummarySurvey.vue")
);
const router = useRouter();
const route = useRoute();
@ -105,6 +108,12 @@ const personalId = ref<string>(route.params.personalId.toString());
ผลการประเมนการ
</q-item-section>
</q-item>
<q-item active-class="text-primary bg-teal-1 text-weight-medium" clickable class="q-py-sm" dense v-ripple
:active="activeTab == 'tab7'" @click="activeTab = 'tab7'">
<q-item-section>
แบบสารวจความคดเห
</q-item-section>
</q-item>
</q-list>
</q-scroll-area>
@ -135,6 +144,10 @@ const personalId = ref<string>(route.params.personalId.toString());
<q-tab-panel name="tab6">
<SummaryScore />
</q-tab-panel>
<q-tab-panel name="tab7">
<SummarySurvey />
</q-tab-panel>
</q-tab-panels>
</q-layout>

View file

@ -0,0 +1,230 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { QForm, useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useRoute, useRouter } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
const $q = useQuasar();
const myForm = ref<QForm>();
const mixin = useCounterMixin();
const router = useRouter();
const {
date2Thai,
notifyError,
messageError,
success,
showLoader,
hideLoader,
dialogConfirm,
} = mixin;
const route = useRoute();
const assignId = ref<string>(route.params.form.toString());
const action = ref<string>("edit");
const status = ref<boolean>(true);
const score1 = ref<number>(0);
const score2 = ref<number>(0);
const score3 = ref<number>(0);
const Allscore = ref<number>(0);
const result = ref<any>();
const result_option = ref<any>([
{ name: "ผ่าน", value: 1 },
{ name: "ไม่ผ่าน", value: 0 },
]);
const note = ref<string>("");
const date = ref<Date>(new Date());
const saveEdit = (id: string) => {
dialogConfirm($q, () => console.log("save"));
};
const edit = () => {
status.value = true;
// console.log(status.value);
};
const cancel = () => {
status.value = false;
};
onMounted(() => {
// fecthResult(assignId.value);
});
// const fecthResult = async (id: string) => {
// await http
// .get(config.API.createformReport(id))
// .then((res: any) => {
// let data = res.data.data.evaluate;
// console.log(data);
// date_start.value = data.date_start;
// date_finish.value = data.date_finish;
// develop.value = Number(data.develop_complete);
// result.value = Number(data.pass_result);
// reson.value = data.reson;
// chairman_dated.value = data.chairman_dated;
// director1_dated.value = data.director1_dated;
// director2_dated.value = data.director2_dated;
// status.value = false;
// action.value = 'edit';
// })
// .catch((e) => {
// console.log(e);
// });
// };
</script>
<template>
<div class="row col-12 q-ma-xs">
<div class="toptitle text-dark col-12 row items-center q-gutter-md">
<div>แบบสารวจความคดเหนการทดลองปฏหนาทราชการ</div>
<!-- <q-space /> -->
<!-- <div v-if="action == 'edit'">
<div v-if="status == false">
<q-btn
dense
flat
round
color="primary"
@click="edit()"
icon="mdi-pencil-outline"
>
<q-tooltip>แกไขขอม</q-tooltip>
</q-btn>
</div>
<div v-else>
<q-btn dense flat @click="cancel()" round color="red" icon="mdi-undo">
<q-tooltip>ยกเล</q-tooltip>
</q-btn>
<q-btn
dense
flat
round
class="q-ml-sm"
color="public"
@click="saveEdit(assignId)"
icon="mdi-content-save-outline"
>
<q-tooltip>นทกขอม</q-tooltip>
</q-btn>
</div>
</div> -->
</div>
<div class="row col-12 q-gutter-lg">
<div class=" col-xs-12 col-sm-11 ">
<div class="col-12 text-top0 row items-center">
เหตผลอ ในการพจารณา
</div>
<q-input
outlined
dense
class="col-12"
v-model="note"
lazy-rules
autogrow
hide-bottom-space
label="กรอกเหตุผลอื่น ๆ ในการพิจารณา"
:row="5"
:disable="!status"
/>
</div>
<div class=" col-xs-12 col-sm-11">
<div class="col-12 row q-col-gutter-md">
<div class="col-xs-12 col-sm-6">
<div class="col-12 text-top0 items-center">
สรปผลการทดลองปฏหนาทราชการ
</div>
<div class="col-12">
<q-select
class="col-12"
dense
v-model="result"
outlined
:options="result_option"
option-label="name"
option-value="value"
label="เลือกสรุปผลการทดลองปฏิบัติหน้าที่ราชการ"
map-options
emit-value
:disable="!status"
/>
</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="col-12 text-top0 items-center">
เดอน ประเม
</div>
<div class="col-12">
<datepicker
menu-class-name="modalfix"
v-model="date"
:locale="'th'"
autoApply
:readonly="!status"
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker"
:model-value="
date != null ? date2Thai(date) : null
"
:label="`${'วัน เดือน ปี ที่ประเมิน'}`"
:rules="[(val) => !!val || `${'วัน เดือน ปี ที่ประเมิน'}`]"
>
<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>
</div>
</div>
</div>
</div>
</template>
<style lang="scss" scoped>
.text-top2 {
font-weight: 500;
padding-bottom: 8px;
color: rgb(70, 68, 68);
}
.text-top0 {
font-weight: 600;
padding-bottom: 8px;
color: rgb(70, 68, 68);
}
.q-rating__icon {
text-shadow: transparent !important;
}
.q-card {
box-shadow: 0px 0px 0px 0px !important;
}
</style>