<template>
  <div class="col-12 row">
    <div class="row col-12" style="padding-top: 80px">
      <div id="information" name="1" class="row col-12 information">
        <Information v-model:statusEdit="statusEdit" :statusAdd="false" />
      </div>
      <div id="government" name="16" class="row col-12 q-mt-md">
        <Government v-model:statusEdit="statusEdit" :statusAdd="false" />
      </div>
      <div id="address" name="17" class="row col-12 q-mt-md">
        <Address v-model:statusEdit="statusEdit" :statusAdd="false" />
      </div>
      <div id="family" name="18" class="row col-12 q-mt-md">
        <Family v-model:statusEdit="statusEdit" :statusAdd="false" />
      </div>
      <div id="certicate" name="15" class="row col-12 q-mt-md">
        <Certicate />
      </div>
    </div>
    <Image />
  </div>
</template>
<script setup lang="ts">
import { ref } from "vue";
import Image from "@/components/information/Image.vue";
import Information from "@/components/information/Information.vue";
import Government from "@/components/information/Government.vue";
import Address from "@/components/information/Address.vue";
import Family from "@/components/information/Family.vue";
import Certicate from "@/components/information/Certicate.vue";

const statusEdit = ref<boolean>(false);
</script>
<style lang="scss" scoped>
.information:target {
  padding-top: 84px;
}
</style>
>
