localhost_oa_front/src/views/materials-inventory/in-out/formSchemas.ts

import type { FormSchema } from '@/components/core/schema-form/';
import { ContractStatusEnum } from '@/enums/contractEnum';
import { formatStatus } from './columns';
import Api from '@/api';
import { debounce } from 'lodash-es';
import { MaterialsInOutEnum } from '@/enums/materialsInventoryEnum';

export const formSchemas: FormSchema<API.MaterialsInOutEntity>[] = [
  {
    field: 'productId',
    component: 'Select',
    label: '产品',
    colProps: {
      span: 16,
    },
    helpMessage:'如未找到对应产品，请先去产品管理添加产品。',
    rules: [{ required: true, type: 'number' }],
    componentProps: ({ formInstance, schema, formModel }) => ({
      showSearch: true,
      filterOption: false,
      fieldNames: {
        label: 'label',
        value: 'value',
      },
      options: [],
      getPopupContainer: () => document.body,
      defaultActiveFirstOption: true,
      onChange: async (value) => {
        if (!value) {
          const options = await getProductOptions();
          const newSchema = {
            field: schema.field,
            componentProps: {
              options,
            },
          };
          formInstance?.updateSchema([newSchema]);
        }
      },
      request: () => {
        return getProductOptions();
      },
      onSearch: debounce(async (keyword) => {
        schema.loading = true;
        const newSchema = {
          field: schema.field,
          componentProps: {
            options: [] as LabelValueOptions,
          },
        };
        formInstance?.updateSchema([newSchema]);
        const options = await getProductOptions(keyword).finally(() => (schema.loading = false));
        newSchema.componentProps.options = options;
        formInstance?.updateSchema([newSchema]);
      }, 500),
    }),
  },

  {
    field: 'inOrOut',
    component: 'Select',
    label: '出入库',
    rules: [{ required: true, type: 'number' }],
    defaultValue: MaterialsInOutEnum.In,
    colProps: {
      span: 8,
    },
    componentProps: {
      options: [
        { label: '出库', value: MaterialsInOutEnum.Out },
        { label: '入库', value: MaterialsInOutEnum.In },
      ],
    },
  },
  // {
  //   field: 'title',
  //   component: 'Input',
  //   label: '合同标题',
  //   rules: [{ required: true, type: 'string' }],
  //   colProps: {
  //     span: 12,
  //   },
  // },
  // {
  //   field: 'partyA',
  //   component: 'Input',
  //   label: '甲方',
  //   rules: [{ required: true, type: 'string' }],
  //   colProps: {
  //     span: 12,
  //   },
  // },
  // {
  //   field: 'partyB',
  //   component: 'Input',
  //   label: '乙方',
  //   rules: [{ required: true, type: 'string' }],
  //   colProps: {
  //     span: 12,
  //   },
  // },
  // {
  //   field: 'signingDate',
  //   label: '签订时间',
  //   component: 'DatePicker',
  //   // defaultValue: new Date(),
  //   colProps: { span: 12 },
  //   componentProps: {},
  // },
  // {
  //   field: 'deliveryDeadline',
  //   label: '交付期限',
  //   component: 'DatePicker',
  //   // defaultValue: new Date(),
  //   colProps: { span: 12 },
  // },
  // {
  //   field: 'type',
  //   label: '合同类型',
  //   component: 'Select',
  //   required: true,
  //   colProps: {
  //     span: 12,
  //   },
  //   componentProps: {
  //     options: contractTypes.map(({ label, id }) => ({ value: id, label })),
  //   },
  // },
  // {
  //   field: 'status',
  //   label: '审核结果',
  //   component: 'Select',
  //   required:true,
  //   defaultValue: 0,
  //   colProps: {
  //     span: 12,
  //   },
  //   componentProps: {
  //     allowClear: false,
  //     options: Object.values(ContractStatusEnum)
  //       .filter((value) => typeof value === 'number')
  //       .map((item) => formatStatus(item as ContractStatusEnum)),
  //   },
  // },
  // {
  //   field: 'remark',
  //   component: 'InputTextArea',
  //   label: '备注',
  // },
  // {
  //   field: 'menuIds',
  //   component: 'Tree',
  //   label: '菜单权限',
  //   componentProps: {
  //     checkable: true,
  //     vModelKey: 'checkedKeys',
  //     fieldNames: {
  //       title: 'name',
  //       key: 'id',
  //     },
  //     style: {
  //       height: '350px',
  //       paddingTop: '5px',
  //       overflow: 'auto',
  //       borderRadius: '6px',
  //       border: '1px solid #dcdfe6',
  //       resize: 'vertical',
  //     },
  //   },
  // },
];

const getProductOptions = async (keyword?: string): Promise<LabelValueOptions> => {
  const { items: result } = await Api.product.productList({ pageSize: 100, name: keyword });
  return (
    result?.map((item) => ({
      label: `${item.name}` + (item.company?.name ? `(${item.company?.name})` : ''),
      value: item.id,
    })) || []
  );
};

const getCompanyOptions = async ({ keyword, id }): Promise<LabelValueOptions> => {
  const { items: result } = await Api.company.companyList({ pageSize: 100, name: keyword });
  return (
    result?.map((item) => ({
      label: item.name,
      value: item.id,
    })) || []
  );
};