<!-- card รวม ข้อมูลส่วนตัว กับ ที่อยู่ -->
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import Information from "@/modules/05_placement/components/PersonalDetail/Information/Information.vue";
import Address from "@/modules/05_placement/components/PersonalDetail/Information/Address.vue";
import { useCounterMixin } from "@/stores/mixin";

const props = defineProps({
  statusEdit: {
    type: Boolean,
    required: true,
  },
  profileType: {
    type: String,
    required: true,
  },
});
const emit = defineEmits(["update:statusEdit"]);

const mixin = useCounterMixin();
const { showLoader, hideLoader } = mixin;
const statusEdit = ref<boolean>(false);
const modalNoEdit = ref<boolean>(false);
const modalNoEditTittle = ref<string>("ไม่สามารถไม่สามารถแก้ไขข้อมูลได้?");
const modalNoEditDetail = ref<string>("มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล");

watch(statusEdit, (count: boolean, prevCount: boolean) => {
  emit("update:statusEdit", count);
});

watch(props, (count: any, prevCount: any) => {
  statusEdit.value = props.statusEdit;
});

onMounted(() => {
  // hideLoader();
});

const notiNoEdit = () => {
  modalNoEdit.value = true;
};

const closeModalError = () => {
  modalNoEdit.value = false;
};
</script>
<template>
  <div class="row col-12 items-center">
    <div>
      <Information :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
    </div>

    <div class="col-12 q-px-md"><q-separator size="4px" /></div>

    <div>
      <Address :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
    </div>
  </div>
</template>
<style lang="scss" scoped>
.horizontal-line {
  background-color: #f4f4f4;
  height: 5px;
}
</style>
