<script setup lang="ts">
import { onMounted, reactive, watch } from "vue";

const props = defineProps({
  data: {
    type: Object,
    default: {},
  },
});

const formData = reactive<any>({
  isEducationalQft: props.data.isEducationalQft, // คุณวุฒิการศึกษา
  isGovermantServiceHtr: props.data.isGovermantServiceHtr, // ประวัติการรับราชการ
  isOperatingExp: props.data.isOperatingExp, // ประสบการณ์ในการปฏิบัติงาน
  isMinPeriodOfTenure: props.data.isMinPeriodOfTenure, // ระยะเวลาขั้นต่ำในการดำรงตำแหน่งในสายงานที่ขอเข้ารับการคัดเลือก
  isHaveSpecificQft: props.data.isHaveSpecificQft, // มีคุณสมบัติตรงตามคุณสมบัติเฉพาะสำหรับตำแหน่งที่กำหนด ในมาตราฐานกำหนดตำแหน่ง
  isHaveProLicense: props.data.isHaveProLicense, // มีใบอนุญาตประกอบวิชาชีพของสายงานต่างๆ
  isHaveMinPeriodOrHoldPos: props.data.isHaveMinPeriodOrHoldPos, // มีระยะเวลาขั้นต่ำในการดำรงตำแหน่งหรือเคยดำรงตำแหน่งในสายงานที่จะคัดเลือกตามคุณวุฒิของบุคคลและระดับตำแหน่งที่จะคัดเลือก]
});

// watch(props, () => {
//   formData.isEducationalQft = props.data.isEducationalQft;
//   formData.isGovermantServiceHtr = props.data.isGovermantServiceHtr;
//   formData.isOperatingExp = props.data.isOperatingExp;
//   formData.isMinPeriodOfTenure = props.data.isMinPeriodOfTenure;
//   formData.isHaveSpecificQft = props.data.isHaveSpecificQft;
//   formData.isHaveProLicense = props.data.isHaveProLicense;
//   formData.isHaveMinPeriodOrHoldPos = props.data.isHaveMinPeriodOrHoldPos;
// });
</script>

<template>
  <q-list>
    <q-item v-ripple>
      <q-item-section avatar>
        <q-checkbox
          disable
          keep-color
          color="primary"
          v-model="formData.isEducationalQft"
        />
      </q-item-section>
      <q-item-section>
        <q-item-label>คุณวุฒิการศึกษา </q-item-label>
      </q-item-section>
    </q-item>
    <q-item v-ripple>
      <q-item-section avatar>
        <q-checkbox
          disable
          keep-color
          color="primary"
          v-model="formData.isGovermantServiceHtr"
        />
      </q-item-section>
      <q-item-section>
        <q-item-label>ประวัติการรับราชการ </q-item-label>
      </q-item-section>
    </q-item>
    <q-item v-ripple>
      <q-item-section avatar>
        <q-checkbox
          disabled
          keep-color
          color="primary"
          v-model="formData.isOperatingExp"
        />
      </q-item-section>
      <q-item-section>
        <q-item-label>ประสบการณ์ในการปฏิบัติงาน </q-item-label>
      </q-item-section>
    </q-item>
    <q-item v-ripple>
      <q-item-section avatar>
        <q-checkbox
          disable
          keep-color
          color="primary"
          v-model="formData.isMinPeriodOfTenure"
        />
      </q-item-section>
      <q-item-section>
        <q-item-label
          >ระยะเวลาขั้นต่ำในการดำรงตำแหน่งในสายงานที่ขอเข้ารับการคัดเลือก</q-item-label
        >
      </q-item-section>
    </q-item>
    <q-item v-ripple>
      <q-item-section avatar>
        <q-checkbox
          disable
          keep-color
          color="primary"
          v-model="formData.isHaveSpecificQft"
        />
      </q-item-section>
      <q-item-section>
        <q-item-label
          >มีคุณสมบัติตรงตามคุณสมบัติเฉพาะ สำหรับตำแหน่งที่กำหนด
          ในมาตรฐานกำหนดตำแหน่ง</q-item-label
        >
      </q-item-section>
    </q-item>
    <q-item v-ripple>
      <q-item-section avatar>
        <q-checkbox
          disable
          keep-color
          color="primary"
          v-model="formData.isHaveProLicense"
        />
      </q-item-section>
      <q-item-section>
        <q-item-label
          >มีใบอนุญาตประกอบวิชาชีพของสายงานต่างๆ และ/หรือ
          คุณวุฒิเพิ่มเติมครบถ้วนตามที่ ก.ก. กำหนด (แพทย์พยาบาล วิศวกรโยธา
          สถาปนิก ฯลฯ)</q-item-label
        >
      </q-item-section>
    </q-item>
    <q-item v-ripple>
      <q-item-section avatar>
        <q-checkbox
          disable
          keep-color
          color="primary"
          v-model="formData.isHaveMinPeriodOrHoldPos"
        />
      </q-item-section>
      <q-item-section>
        <q-item-label
          >มีระยะเวลาขั้นต่ำในการดำรงตำแหน่งหรือเคยดำรงตำแหน่งในสายงานที่จะคัดเลือกตามคุณวุฒิของบุคคลและระดับตำแหน่งที่จะคัดเลือก</q-item-label
        >
      </q-item-section>
    </q-item>
  </q-list>
</template>

<style scoped></style>
