<template>
  <div>
    <BasicModal
      v-bind="$attrs"
      width="30rem"
      :title="getTitle"
      @register="register"
      @cancel="handleCancel"
      @ok="handleOk"
      destroyOnClose
    >
      <div>
        <BasicForm @register="registerForm" />
      </div>
    </BasicModal>
  </div>
</template>
<script setup lang="ts">
import {computed, ref, unref} from "vue";
import {useI18n} from "/@/hooks/web/useI18n";
import {useForm} from "/@/components/Form";
import {schemas} from "../index";
import {useModalInner} from "/@/components/Modal";
const { t } = useI18n();
const isUpdate = ref<Boolean>(false);
const recordInfo = ref<any>({});
const emit = defineEmits(['handleReload', 'register']);

const getTitle = computed(() =>
  !unref(isUpdate)
    ? t('inspection.servicePlan.createPlanText')
    : t('inspection.servicePlan.editPlanText')
);

const [registerForm, { getFieldsValue, setFieldsValue, validate, updateSchema }] = useForm({
  labelWidth: 140,
  schemas,
  actionColOptions: {
    span: 14,
  },
  showActionButtonGroup: false,
});

const [register, { closeModal, setModalProps }] = useModalInner(async (data) => {
  setModalProps({ confirmLoading: false, loading: true });
  isUpdate.value = data?.isUpdate;
  recordInfo.value = data?.record;
  if (data?.record) {
    setFieldsValue(data?.record);
  }
  setModalProps({ loading: false });
});

const handleCancel = () => {
  closeModal();
};

const handleOk = async () => {

}
</script>