canrd-outside / order-erp-front · Files

<template>
  <BasicDrawer
    v-cloakv-bind="$attrs"
    @register="register"
    title="新增邮件发送"
    width="35%"
    showFooter
    @ok="handleSubmit"
    ref="formRef"
    okText="保存"
    :destroyOnClose="true"
    :isDetail="true"
    :showDetailBack="false"
    :mask="false"
    class="z-20"
  >
    <div>
      <BasicForm @register="registerForm" />
    </div>
    <!-- <div>客户编码</div>
    <textarea></textarea> -->
  </BasicDrawer>
</template>
<script lang="ts" setup>
  import { BasicDrawer, useDrawerInner } from '@/components/Drawer';
  import { BasicForm, FormSchema, useForm } from '@/components/Form';
  import { defineComponent, ref, computed, unref, toRaw, reactive } from 'vue';
  import { getEmailList } from '/@/api/sys/config';

  const emit = defineEmits(['success']);
  // const isUpdate = ref(true);
  const schemas: FormSchema[] = [
    {
      field: 'typeValue',
      component: 'Select',
      label: '客户编码',
      componentProps: {
        disabled: 'Select',
      },
      colProps: {
        span: 23,
      },
      defaultValue: '',

      rules: [{ required: true }],

    },
    {
      field: 'configSample',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },

      label: '确认样品确认状态(填写邮箱,请用逗号隔开)',

      rules: [{ required: true }],
    },

    {
      field: 'otherSample',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '其他需求样品发送时间(填写邮箱)',
      rules: [{ required: true }],
    },
    {
      field: 'bigSample',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '大货样确认意见(填写邮箱)',
      rules: [{ required: true }],
    },

    {
      field: 'aitexSgsTest',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: 'AITEX/SGS测试状态(填写邮箱)',
      rules: [{ required: true }],
    },

    {
      field: 'barcodeArrival',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '要求包装到货日期(填写邮箱)',
      rules: [{ required: true }],
    },
    {
      field: 'latestDc',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '最晚订舱时间(填写邮箱)',
      rules: [{ required: true }],
    },

    {
      field: 'endCheckDate',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '尾期验货日期(填写邮箱)',
      rules: [{ required: true }],
    },
    {
      field: 'midCheckReport',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '中期验货报告(填写邮箱)',
      rules: [{ required: true }],
    },
    {
      field: 'endCheckReport',
      component: 'InputTextArea',
      labelWidth: 250,
      colProps: {
        span: 23,
      },
      label: '尾期验货报告(填写邮箱)',
      rules: [{ required: true }],
    },

    {
      field: 'id',
    },
    {
      field: 'type',
    },
  ];
  const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
    labelWidth: 120,
    schemas,
    layout: 'vertical',
    showActionButtonGroup: false,
    actionColOptions: {
      span: 24,
    },
  });
  const [register, { setDrawerProps, closeDrawer }] = useDrawerInner((data) => {
    // 方式1
    resetFields();
    setDrawerProps({ confirmLoading: false });
    setFieldsValue({
      ...toRaw(data.data),
    });
  });

  //获取现有的列表

  async function getData() {
    const emailAll = await getEmailList({});
    return emailAll;
  }

  interface NewValues {
    id: string;
    type: string;
    typeValue: string;
    configInfos: any[];
  }

  //完成编辑

  async function handleSubmit() {
    try {
      const values = await validate();

      const newValues = ref<NewValues>({
        id: '',
        type: '',
        typeValue: '',
        configInfos: [],
      });

      //将编辑后的值赋值给新对象

      newValues.value.id = values.id;
      newValues.value.type = values.type;
      newValues.value.typeValue = values.typeValue;

      //获取所有数据
      //找出需要修改的数据，并将修改后的configInfos赋值给新对象

      getData().then((res) => {
        for (const value1 of res) {

          //循环整个列表，找出编辑行
          if (value1.id == values.id) {
            // test.value = value1;
            newValues.value.configInfos = value1.configInfos;
            for (const value2 of newValues.value.configInfos) {
              //遍历所有邮件事件
              for (const value3 in values) {
                //遍历编辑框传递数据
                if (value2.fieldValue == value3) {
                  const arr: string[] = values[value3].split(/[,|，]/);
                  value2.emails = arr;
                }
              }
            }

          }
        }
        emit('success', {

          values: { ...newValues.value },

        });
      });
      setDrawerProps({ confirmLoading: true });
      closeDrawer();
    } finally {
      setDrawerProps({ confirmLoading: false });
    }
  }
</script>