<template>
  <BasicForm @register="registerForm" />
</template>

<script lang="ts" setup>
  import { nextTick, watch } from 'vue';
  import { BasicForm, useForm } from '/@/components/Form/index';
  import { FormSchema } from '/@/components/Table';
  const props = defineProps({
    data: {
      type: Object,
      default: () => {},
    },
  });
  const AdviceFormSchema: FormSchema[] = [
    {
      label: '实际转运时间',
      field: 'sjzysj',
      required: true,
      component: 'Input',
      // component: 'DatePicker',
      componentProps: {
        disabled: true,
        // format: 'YYYY-MM-DD',
        // valueFormat: 'YYYY-MM-DD',
      },
    },
    {
      label: '实际转运总量',
      field: 'sjzyzl',
      required: true,
      component: 'Input',
      componentProps: {
        disabled: true,
      },
    },
    {
      label: '与转运计划是否有偏移',
      field: 'jhsfypy',
      required: true,
      component: 'Input',
      componentProps: {
        disabled: true,
      },
    },
    {
      label: '偏移情况说明',
      field: 'pyqksm',
      component: 'Input',
      componentProps: {
        disabled: true,
      },
    },
    {
      label: '转运联单',
      field: 'zyldlj',
      component: 'JUpload',
      componentProps: {
        disabled: true,
        showUploadList: false,
      },
    },
  ];
  //表单配置
  const [registerForm, { resetFields, setFieldsValue }] = useForm({
    labelWidth: 220,
    schemas: AdviceFormSchema,
    showActionButtonGroup: false,
    baseColProps: { span: 12 },
  });
  watch(
    () => props.data,
    async (val) => {
      nextTick(async () => {
        await resetFields();
        await setFieldsValue({
          ...val,
        });
      });
    },
    { deep: true, immediate: true }
  );
</script>

<style lang="less" scoped>
  :deep(.ant-input-number) {
    width: 100%;
  }
</style>
