<script setup lang="ts">
import { useQuasar } from "quasar";
import { useRouter } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";

/**
 * importType
 */
import type { FormData } from "@/modules/12_evaluatePersonal/interface/index/meeting";

/**
 * importComponents
 */
import Form from "@/modules/12_evaluatePersonal/components/Meeting/Form.vue";

/**
 * importStore
 */
import { useCounterMixin } from "@/stores/mixin";

/**
 * use
 */
const $q = useQuasar();
const router = useRouter();
const { messageError, showLoader, dialogConfirm, success, hideLoader } =
  useCounterMixin();

/**
 * บันทึกข้อมูลการประชุม
 * @param formData ข้อมูลการประชุม
 */
function onSubmit(formData: FormData) {
  dialogConfirm($q, () => {
    showLoader();
    http
      .post(config.API.meeting(), {
        round: formData.rounded ?? "",
        title: formData.title,
        dateEnd: formData.dateMeetingEnd,
        dateStart: formData.dateMeetingStart,
        result: formData.consider,
        duration: formData.period,
      })
      .then(() => {
        router.push(`/evaluate/meeting`);
        success($q, "บันทึกข้อมูลสำเร็จ");
      })
      .catch((e) => {
        messageError($q, e);
        hideLoader();
      });
  });
}
</script>

<template>
  <div class="col-xs-12 col-sm-12 col-md-12">
    <div class="toptitle col-12 row items-center">
      <q-btn
        icon="mdi-arrow-left"
        unelevated
        round
        dense
        flat
        color="primary"
        class="q-mr-sm"
        @click="$router.push(`/evaluate/meeting`)"
      />
      เพิ่มการประชุม
    </div>

    <Form :on-submit="onSubmit" />
  </div>
</template>
