<template>
  <BasicModal
    v-bind="$attrs"
    @register="register"
    title="发货登记"
    @cancel="resetFields"
    :confirmLoading="loading"
    @ok="handleSubmit"
  >
    <div class="pt-2px pr-3px">
      <BasicForm @register="registerForm">
        <template #text="{ model, field }">
          {{ model[field] }}
        </template>
      </BasicForm>
      <div v-show="fileFlow.tips" style="padding-left:120px">请确保取回后再做登记。</div>
    </div>
  </BasicModal>
</template>
<script lang="ts">
import { defineComponent, onMounted, reactive, ref } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
import { useMessage } from '/@/hooks/web/useMessage';
import { sendRegister } from '/@/api/spares';
import { useI18n } from '/@/hooks/web/useI18n';
import { uploadApi } from '/@/api/product/index';

const { t } = useI18n();
export default defineComponent({
  components: { BasicModal, BasicForm },
  props: {
    userData: { type: Object },
  },
  emits: ['update', 'register'],
  setup(props, { emit }) {
    const fileFlow = reactive({
      file: null,
      type: 2, //2-普通发票，3-专用发票
      tips:false,
    });
    const loading = ref(false);
    const { createMessage } = useMessage();
    const schemas: FormSchema[] = [
      {
        field: 'repairId',
        slot: 'text',
        component: 'Input',
        label: '维修单号',
      },
      {
        field: 'deviceInfo',
        component: 'Input',
        label: '设备信息',
        slot: 'text',
        colProps: {
          span: 18,
        },
      },
      {
        field: 'getType',
        component: 'RadioGroup',
        label: '取回方式',
        defaultValue: 1,
        componentProps: {
          placeholder: '请填写姓名',
          options: [
            { label: '前台取回', value: 0 },
            { label: '快递寄回', value: 1 },
          ],
          onChange: (e) => {
            fileFlow.tips = e.target.value != 1
            updateSchema(
              {
                field: 'trackingNum',
                ifShow: e.target.value == 1,
              });
          },
        },
      },
      {
        field: 'trackingNum',
        component: 'Input',
        label: '快递单号',
        required: true,
        colProps: {
          span: 18,
        },
      },
    ];

    const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
      labelWidth: 120,
      schemas: schemas,
      showActionButtonGroup: false,
      actionColOptions: {
        span: 24,
      },
    });
    onMounted(() => {});
    let addListFunc = () => {};
    const [register, { closeModal }] = useModalInner((data) => {
      data && onDataReceive(data);
    });
    function onDataReceive(data) {
      resetFields();
      updateSchema({
                field: 'trackingNum',
                ifShow: true,
              });
      setFieldsValue({
        ...data,
        getType:1,
        deviceInfo: t(`routes.scene.tableType.${data.cameraType}`) + data.cameraSnCode,
      });
    }
    const handleSubmit = async () => {
      loading.value = true;
      try {
        const params = await validate();
        await sendRegister(params);
        closeModal();
        resetFields();
        createMessage.success(t('common.optSuccess'));
        emit('update');
        loading.value = false;
      } catch (error) {
        loading.value = false;
        console.log('not passing', error);
      }
    };
    return {
      register,
      registerForm,
      fileFlow,
      handleSubmit,
      addListFunc,
      resetFields,
      loading,
      t,
    };
  },
});
</script>
