hrms-mgt/src/modules/11_discipline/components/2_InvestigateFacts/CalandarDialog.vue

<script setup lang="ts">
import { ref, defineProps } from "vue";
import Calendar from "@/modules/11_discipline/components/2_InvestigateFacts/Calendar.vue";

const props = defineProps({
  modal: {
    type: Boolean,
    default: false,
  },
  close: {
    type: Boolean,
    default: true,
  },
});
</script>
<template>
  <q-dialog v-model="props.modal">
    <q-card style="min-width: 60vw">
      <q-toolbar>
        <q-toolbar-title class="text-subtitle2 text-bold"
          >ปฎิทิน</q-toolbar-title
        >
        <q-btn
          icon="close"
          unelevated
          round
          dense
          @click="props.close"
          style="color: #ff8080; background-color: #ffdede"
        />
      </q-toolbar>

      <q-separator />
      <q-card-section class="q-pa-md bg-grey-1 scroll">
        <Calendar />
      </q-card-section>
    </q-card>
  </q-dialog>
</template>