hrms-user/src/modules/03_leave/views/result.vue

<script setup lang="ts">
import type { QTableProps } from "quasar"
import { ref, onMounted } from "vue"
import { useQuasar } from "quasar"
import { useRouter, useRoute } from "vue-router"
import { useCounterMixin } from "@/stores/mixin"
import http from "@/plugins/http"
import config from "@/app.config"

const route = useRoute()
const router = useRouter()
const $q = useQuasar()
const mixin = useCounterMixin()
const { date2Thai, dateToISO, success, messageError, showLoader, hideLoader } = mixin
const leaveReason = ref("")
const id = ref<string>("")
const noteReason = ref("")
const routeName = router.currentRoute.value.name
const questionId = route.params.id.toString()

const saveForm = () => {
	$q.dialog({
		title: "ยืนยันข้อมูลแบบสอบถาม",
		message: "ต้องการส่งข้อมูลแบบสอบถามนี้ใช่หรือไม่?",
		cancel: {
			flat: true,
			color: "negative",
		},
		persistent: true,
	})
		.onOk(async () => {
			createResult()
		})
		.onCancel(() => {})
		.onDismiss(() => {})
}

const createResult = async (questionId: string) => {
	const formData = new FormData()
	console.log(formData)

	formData.append("Location", leaveReason.value)
	formData.append("SendDate", noteReason.value)
	await http
		.post(config.API.questionnaireByid(questionId), formData)
		.then((res: any) => {
			// console.log(res);
			success($q, "บันทึกข้อมูลสำเร็จ")
			router.push(`/leave`)
		})
		.catch((e: any) => {
			messageError($q, e)
			console.log(e)
		})
	success($q, "บันทึกข้อมูลสำเร็จ")
	router.push(`/leave`)
}
</script>

<template>
	<div class="col-12 row justify-center">
		<div class="col-xs-12 col-sm-12 col-md-11">
			<div class="toptitle text-white 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>
			</div>
			<div class="col-12">
				<q-card bordered>
					<div class="col-12 row q-col-gutter-md q-pa-md">
						<div class="col-xs-12 col-sm-12">
							<q-card bordered flat>
								<div class="q-pa-xs bg-grey-2 row items-center q-py-sm q-px-md justify-center text-bold">แบบสอบถาม</div>
								<q-separator />
								<div class="col-12 row q-pa-sm q-col-gutter-sm">
									<q-input class="col-12" dense outlined v-model="leaveReason" label="ทำไมคุณถึงลาออก?" type="textarea" />
									<q-input class="col-12" dense outlined v-model="noteReason" label="สิ่งที่คุณต้องการจะบอกเรา?" type="textarea" />
									<q-separator />
								</div>
							</q-card>
						</div>
					</div>
					<div class="row col-12 q-pa-sm">
						<q-space />
						<q-btn unelevated dense class="q-px-md items-center" color="primary" label="บันทึกข้อมูลแบบสอบถาม" @click="saveForm" />
					</div>
				</q-card>
			</div>
		</div>
	</div>
</template>