hrms-mgt/src/modules/05_placement/components/probation/FormEvaluation.vue

131 lines
4.2 KiB
Vue

<!-- card อมลสวนต -->
<template>
<div class="q-pb-md">
<!-- <div class="toptitle text-dark col-12 row items-center">
<q-btn
icon="mdi-arrow-left"
unelevated
round
dense
flat
color="primary"
class="q-mr-sm"
@click="router.go(-1)"
/>
ฟอรมแบบประเมนสำหรบผแล
</div> -->
<div class="col-12 text-dark">
<div class="row col-12 q-gutter-lg q-pa-lg">
<div class="col-12 row">
<div class="col-12 text-top0 row items-center">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
นเรมทดลองปฎหนาทราชการ งแตนท
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
งวนท
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
</div>
<div class="col-12 text-top0 row items-center">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
การทดลองปฏหนาทราชการมผล งน
<span class="text-black q-px-sm">{{ "ครั้งที่" + period }}</span>
ระหวางวนท
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
งวนท
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
</div>
<div class="col-12 q-pt-md">
<q-separator size="3px" color="grey-2" />
</div>
</div>
<!--------------------- 1 --------------------->
<FormEva1 />
<div class="col-12">
<q-separator size="3px" color="grey-2" />
</div>
<!--------------------- 2 --------------------->
<FormEva2 />
<div class="col-12">
<q-separator size="3px" color="grey-2" />
</div>
<!--------------------- 3 --------------------->
<FormEva3 />
<div class="col-12">
<q-separator size="3px" color="grey-2" />
</div>
<!--------------------- งคบบญชาผมอบหมายงาน --------------------->
<FormEvaOrder />
</div>
<q-separator />
<div class="flex justify-end q-px-sm q-pt-sm">
<q-footer class="bg-white q-px-lg q-py-sm flex justify-end">
<q-btn
dense
class="q-px-md"
unelevated
label="บันทึก"
color="public"
/>
</q-footer>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, defineAsyncComponent } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useRoute } from "vue-router";
import { useQuasar } from "quasar";
import router from "@/router";
const FormEva1 = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/form/formEva1.vue")
);
const FormEva2 = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/form/formEva2.vue")
);
const FormEva3 = defineAsyncComponent(
() => import("@/modules/05_placement/components/probation/form/formEva3.vue")
);
const FormEvaOrder = defineAsyncComponent(
() =>
import("@/modules/05_placement/components/probation/form/formEvaOrder.vue")
);
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai } = mixin;
const dateToday = ref<Date>(new Date("10-10-2023"));
const dateEnd = ref<Date>(new Date("12-10-2023"));
const period = ref<number>(1);
const onSubmit = () => {
$q.notify({
color: "green-4",
textColor: "white",
icon: "cloud_done",
message: "ส่งแบบประเมินเเล้ว",
});
};
const onReset = () => {
router.push({ name: "probation" });
};
</script>
<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);
}
</style>