Sanakey
3 天以前 b5c1614fe473330ceca8b7cff0f1802e19bd5039
src/views/customer/components/drawerFormData.tsx
@@ -28,9 +28,9 @@
export const schemas: FormSchema[] = [
  {
    field: 'field0',
    field: 'field001',
    component: 'Input',
    label: '公司网址',
    label: '公司网址(可通过网址/公司名称自动匹配客户信息)',
    colProps: {
      span: 24,
    },
@@ -38,36 +38,11 @@
  {
    field: 'cluesName',
    component: 'Input',
    label: '线索名称',
    label: '公司名称',
    colProps: {
      span: 24,
    },
    rules: [{required: true, trigger: 'blur'}],
  },
  {
    field: 'cluesFrom',
    component: 'ApiTreeSelect',
    label: '线索来源',
    componentProps: {
      api: treeOptionsListApi,
      treeCheckable: true,
      treeCheckStrictly: true, // 父子节点是否不再关联
      resultField: 'list',
      onChange: (e, v) => {
        console.log('ApiTreeSelect====>:', e, v);
      },
    },
    colProps: {
      span: 24,
    },
  },
  {
    field: 'abbreviation',
    component: 'Input',
    label: '简称',
    colProps: {
      span: 24,
    },
  },
  {
    field: 'field8',
@@ -92,7 +67,28 @@
        console.log('ApiCascader====>:', e, v);
      },
    },
    rules: [{required: true, trigger: 'blur'}],
  },
  {
    field: 'customerFrom',
    component: 'ApiTreeSelect',
    label: '客户来源',
    componentProps: {
      api: treeOptionsListApi,
      treeCheckable: true,
      treeCheckStrictly: true, // 父子节点是否不再关联
      resultField: 'list',
      onChange: (e, v) => {
        console.log('ApiTreeSelect====>:', e, v);
      },
    },
    colProps: {
      span: 24,
    },
    rules: [{required: true, trigger: 'blur'}],
  },
  // {
  //   field: 'field9',
  //   component: 'ApiCascader',
@@ -121,7 +117,7 @@
  {
    field: 'field30',
    component: 'ApiSelect',
    label: '线索标签',
    label: '客户标签',
    // required: true,
    componentProps: {
      // more details see /src/components/Form/src/components/ApiSelect.vue
@@ -146,21 +142,154 @@
      },
    },
    colProps: {
      span: 16,
      span:24,
    },
    // defaultValue: '0',
  },
  {
    field: 'companyName',
    component: 'Input',
    label: '公司名称',
    field: 'customerGrouping',
    component: 'ApiTreeSelect',
    label: '客户分组',
    componentProps: {
      api: treeOptionsListApi,
      // treeCheckable: true,
      treeCheckStrictly: true, // 父子节点是否不再关联
      resultField: 'list',
      onChange: (e, v) => {
        console.log('ApiTreeSelect====>:', e, v);
      },
    },
    colProps: {
      span: 16,
      span: 24,
    },
    rules: [{required: true, trigger: 'blur'}],
  },
  {
    field: 'customerStage',
    component: 'ApiSelect',
    label: '客户阶段',
    // required: true,
    componentProps: {
      // more details see /src/components/Form/src/components/ApiSelect.vue
      api: optionsListApi,
      params: {
        id: 1,
      },
      mode: 'multiple',
      resultField: 'list',
      // use name as label
      labelField: 'name',
      // use id as value
      valueField: 'id',
      // not request untill to select
      immediate: true,
      onChange: (e, v) => {
        console.log('ApiSelect====>:', e, v);
      },
      // atfer request callback
      onOptionsChange: (options) => {
        // console.log('get options', options.length, options);
      },
    },
    colProps: {
      span:24,
    },
    // defaultValue: '0',
  },
  {
    field: 'customerNumber',
    component: 'RadioGroup',
    defaultValue: '0',
    label: '客户编号',
    componentProps: {
      options: [
        {label: '自动生成', value: '0'},
        {label: '自定义', value: '1'},
      ],
    },
    colProps: {
      span: 24,
    },
  },
  {
    field: 'customerRate',
    component: 'Rate',
    label: '客户评分',
    componentProps: {
    },
    colProps: {
      span: 24,
    },
  },
  {
    field: 'field002',
    component: 'Input',
    label: '客户代码(与生产单的客户代码一致)',
    colProps: {
      span: 24,
    },
  },
  {
    component: 'Select',
    label: '客户类型',
    field: 'customerType',
    colProps: {span: 24},
    componentProps: {
      options: [
        {
          label: '原材料供应商',
          value: '1',
        },
        {
          label: '生产商',
          value: '2',
        },
        {
          label: '加盟商',
          value: '3',
        },
        {
          label: '渠道商',
          value: '4',
        },
        {
          label: '贸易商',
          value: '5',
        },
        {
          label: '代理商',
          value: '6',
        },
        {
          label: '批发商',
          value: '7',
        },
      ],
    },
    rules: [{required: true, trigger: 'blur'}],
  },
  {
    component: 'Select',
    label: '公海分组',
    field: 'publicPoolGroup',
    colProps: {span: 16},
    componentProps: {
      options: [
        {
          label: '未知',
          value: '1',
        },
        {
          label: '公共公海分组',
          value: '2',
        },
      ],
    },
    rules: [{required: true, trigger: 'blur'}],
  },
  {
    field: 'typeKey',
    defaultValue: '公司名称',
    defaultValue: '',
    fields: ['typeValue'],
    defaultValueObj: {typeValue: ''},
    component: 'Input',
@@ -175,15 +304,6 @@
          // rules={custom_typeKey2typeValueRules(model)}
        >
          <Input.Group compact>
            {/*<Select*/}
            {/*  allowClear*/}
            {/*  disabled={disabled}*/}
            {/*  style="width: 120px"*/}
            {/*  v-model:value={model[field]}*/}
            {/*>*/}
            {/*  <Select.Option value="公司名称">公司名称</Select.Option>*/}
            {/*  <Select.Option value="产品名称">产品名称</Select.Option>*/}
            {/*</Select>*/}
            <ApiSelect
              style="width: 120px"
              v-model:api={optionsListApi}
@@ -216,12 +336,13 @@
    },
  },
  {
    field: 'customerCode',
    field: 'salesman',
    component: 'Input',
    label: '客户代码(与生产单的客户代码一致)',
    label: '业务员',
    colProps: {
      span: 24,
    },
    rules: [{required: true, trigger: 'blur'}],
  },
  {
    field: '',
@@ -231,7 +352,7 @@
    /**!!!renderColContent 没有FormItem 包裹, 若想要 Form 提交需要带上数据须 <FormItem name={}></FormItem> 包裹: 示例如下*/
    renderColContent({model, field}, {disabled}) {
      return (
        <div class="font-size-16px mb-10px">其他</div>
        <div class="font-size-16px mb-10px">公司其他信息</div>
      );
    },
    colProps: {
@@ -247,6 +368,15 @@
      options: companyType,
    },
    defaultValue: '1'
  },
  {
    component: 'Select',
    label: '时区',
    field: 'timeZone',
    colProps: {span: 16},
    componentProps: {
      options: timeZone,
    },
  },
  {
    component: 'Select',
@@ -284,20 +414,20 @@
    },
  },
  {
    component: 'Select',
    label: '时区',
    field: 'timeZone',
    colProps: {span: 16},
    field: 'productGrouping',
    component: 'ApiTreeSelect',
    label: '产品分组',
    componentProps: {
      options: timeZone,
      api: treeOptionsListApi,
      treeCheckable: true,
      treeCheckStrictly: true, // 父子节点是否不再关联
      resultField: 'list',
      onChange: (e, v) => {
        console.log('ApiTreeSelect====>:', e, v);
      },
    },
  },
  {
    field: 'searchKeywords',
    component: 'Input',
    label: '搜索关键词',
    colProps: {
      span: 16,
      span: 24,
    },
  },
  {
@@ -309,275 +439,11 @@
    },
  },
  {
    field: 'image',
    component: 'ImageUpload',
    label: '上传图片',
    subLabel: '(单张图片最大3M,最多上传5张图片)',
    // required: true,
    defaultValue: [
      'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
    ],
    componentProps: {
      api: uploadApi,
      accept: ['png', 'jpeg', 'jpg'],
      helpText: '单张图片最大3M,最多上传5张图片',
      maxSize: 3, //单个文件最大体积,单位 M
      maxNumber: 5,
    },
    // rules: [
    //   {
    //     required: true,
    //     trigger: 'change',
    //     validator(_, value) {
    //       if (isArray(value) && value.length > 0) {
    //         return Promise.resolve();
    //       } else {
    //         return Promise.reject('请选择上传图片');
    //       }
    //     },
    //   },
    // ],
  },
  {
    field: 'cluesNotes',
    component: 'InputTextArea',
    label: '线索备注',
    label: '公司备注',
    colProps: {
      span: 24,
    },
  },
  {
    component: 'Select',
    label: '规模',
    field: 'numberOfPeople',
    colProps: {span: 16},
    componentProps: {
      options: [
        {
          label: '少于59人',
          value: '1',
        },
        {
          label: '60-149人',
          value: '2',
        },
        {
          label: '150-499人',
          value: '3',
        },
        {
          label: '500-999人',
          value: '4',
        },
        {
          label: '1000-4999人',
          value: '5',
        },
        {
          label: '5000人以上',
          value: '6',
        },
      ],
    },
  },
  {
    field: 'salesman',
    component: 'Input',
    label: '业务员',
    colProps: {
      span: 16,
    },
  },
  {
    component: 'Select',
    label: '访问来源',
    field: 'visitSource',
    colProps: {span: 24},
    componentProps: {
      options: [
        {
          label: '广告投放',
          value: '1',
        },
        {
          label: '自然流量',
          value: '2',
        },
        {
          label: '社交网站',
          value: '3',
        },
        {
          label: '直接访问',
          value: '4',
        },
        {
          label: '邮件',
          value: '5',
        },
        {
          label: '其他',
          value: '6',
        },
      ],
    },
  },
  {
    field: 'field12',
    component: 'ApiCascader',
    label: '主营产品',
    colProps: { span: 24 },
    componentProps: {
      api: areaRecord,
      apiParamKey: 'parentCode',
      showCheckedStrategy: 'SHOW_CHILD',
      labelField: 'name',
      valueField: 'code',
      multiple: true,
      initFetchParams: {
        parentCode: '',
      },
      isLeaf: (record) => {
        return !(record.levelType < 3);
      },
      onChange: (e, ...v) => {
        Logger.log('ApiCascader====> e:', e);
        Logger.log('ApiCascader====> v:', v);
      },
    },
  },
  {
    field: 'ipAddress',
    component: 'ApiSelect',
    label: '访客IP所在地',
    // required: true,
    componentProps: {
      // more details see /src/components/Form/src/components/ApiSelect.vue
      api: optionsListApi,
      params: {
        id: 1,
      },
      resultField: 'list',
      // use name as label
      labelField: 'name',
      // use id as value
      valueField: 'id',
      // not request untill to select
      immediate: true,
      onChange: (e, v) => {
        console.log('ApiSelect====>:', e, v);
      },
      // atfer request callback
      onOptionsChange: (options) => {
        // console.log('get options', options.length, options);
      },
    },
    colProps: {
      span: 20,
    },
    // defaultValue: '0',
  },
  {
    field: 'field1',
    component: 'RadioButtonGroup',
    componentProps: {
      options: [
        {label: 'Apple', value: 'Apple'},
        {label: 'Pear', value: 'Pear'},
        {label: 'Orange', value: 'Orange', disabled: true},
      ],
    },
    label: '',
    colProps: {
      span: 24,
    },
  },
  {
    field: 'field2',
    component: 'Checkbox',
    // suffix:'全天事件',
    subLabel: '',
    colProps: {
      span: 6,
    },
    renderComponentContent: '全天事件',
    // componentProps: {
    //   options: [
    //     {
    //       label: '全天事件',
    //       value: '1',
    //     }
    //   ],
    // },
  },
  {
    field: '[startDate, endDate]',
    label: '起止时间',
    component: 'RangePicker',
    componentProps: {
      format: 'YYYY-MM-DD',
      placeholder: ['开始日期', '结束日期'],
    },
    colProps: {span: 24},
  },
  {
    field: 'field3',
    component: 'DatePicker',
    label: '直到',
    colProps: {
      span: 10,
      offset: 2,
    },
    componentProps: {
      style: {width: '100%'},
      disabledDate: (currentDate) => {
        // Logger.log('currentDate',currentDate)
        // 禁用今天之前的天数
        return currentDate && currentDate < dayjs().subtract(1, 'day');
      }
    },
    required: true,
    ifShow: ({values}) => {
      // Logger.log('vvv',values)
      return ['2', '3', '4'].includes(values.date1);
    },
  },
  {
    field: 'remindTime2',
    component: 'DatePicker',
    label: '',
    colProps: {
      span: 6,
      offset: 2,
    },
    componentProps: {
      // disabledDate:(currentDate)=>{
      //   // Logger.log('currentDate',currentDate)
      //   // 禁用今天之前的天数
      //   return currentDate && currentDate < dayjs().subtract(1, 'day');
      // }
    },
    dynamicRules: ({values}) => {
      return [
        {
          // required: true,
          validator: (_, value) => {
            if (values.remindTime === '6') {
              if (!value) {
                return Promise.reject('不能为空');
              }
            }
            return Promise.resolve();
          },
        },
      ];
    },
    show: ({values}) => {
      // Logger.log('vvv',values)
      return values.remindTime === '6';
    },
  },
];