import type { FormSchema } from '/@/components/Form/index';
import { getAreaList } from '/@/api/oem/index';
import { emailRule, phoneRule } from '/@/utils/rules';
import { useI18n } from '/@/hooks/web/useI18n';

const { t } = useI18n();
import { uploadThumbnail } from '/@/api/configuration/center/configurationCenter';
import { FileItem } from '../types';
import { createImgPreview } from '/@/components/Preview';

export enum Level {
  PROVINCE = 'PROVINCE',
  CITY = 'CITY',
  COUNTY = 'COUNTY',
  TOWN = 'TOWN',
}

export const schemas: FormSchema[] = [
  {
    field: 'name',
    component: 'Input',
    label: t('system.platform.companyNameText'),
    colProps: {
      span: 24,
    },
    required: true,
    componentProps: {
      maxLength: 100,
    },
  },
  {
    field: 'abbreviation',
    component: 'Input',
    label: t('system.platform.companyAbbreviationText'),
    colProps: {
      span: 24,
    },
    componentProps: {
      maxLength: 100,
    },
  },
  {
    field: 'officialWebsite',
    component: 'Input',
    label: t('system.platform.companyWebsiteText'),
    colProps: {
      span: 24,
    },
    componentProps: {
      maxLength: 255,
    },
  },
  {
    field: 'email',
    component: 'Input',
    label: t('system.platform.companyEmailText'),
    colProps: {
      span: 24,
    },
    componentProps: {},
    rules: emailRule,
  },
  {
    field: 'synopsis',
    component: 'InputTextArea',
    label: t('system.platform.companySynopsisText'),
    colProps: {
      span: 24,
    },
    componentProps: {
      maxLength: 500,
      autoSize: { minRows: 8, maxRows: 12 },
    },
  },
  {
    field: 'nameCountry',
    component: 'Select',
    label: t('system.platform.countryWithRegionText'),
    colProps: {
      span: 24,
    },
    // componentProps: {
    //   api: getAreaList,
    //   params: { parentId: 0 },
    //   labelField: 'name',
    //   valueField: 'code',
    //   placeholder: '国家/地区',
    // },
    componentProps: {
      options: [{ label: '中国', value: 1 }],
    },
  },
  {
    field: 'prov',
    label: t('system.platform.homeCityText'),
    required: true,
    component: 'Select',
    colProps: {
      span: 24,
    },
    slot: 'customProv',
  },
  {
    field: 'address',
    component: 'Input',
    label: t('system.platform.detailAddressText'),
    colProps: {
      span: 24,
    },
    required: true,
    componentProps: {
      maxLength: 100,
    },
  },

  {
    field: 'contacts',
    label: t('system.platform.contactText'),
    component: 'Input',
    colProps: {
      span: 24,
    },
    required: true,
    componentProps: {
      maxLength: 25,
    },
  },
  {
    field: 'tel',
    component: 'Input',
    label: t('system.platform.telephoneText'),
    colProps: {
      span: 24,
    },
    componentProps: {},
    rules: phoneRule,
  },
  {
    field: 'qrCode',
    label: t('system.platform.contactUsText'),
    required: true,
    // component: 'Select',
    // slot: 'qrcode',
    component: 'ApiUpload',
    changeEvent: 'update:fileList',
    valueField: 'fileList',
    colProps: {
      span: 24,
    },
    helpMessage: [t('common.limitUploadText5')],
    componentProps: ({ formModel }) => {
      return {
        listType: 'picture-card',
        maxFileLimit: 1,
        accept: '.png,.jpg,.jpeg,.gif',
        api: async (file: File) => {
          try {
            const formData = new FormData();
            formData.set('file', file);
            const { fileStaticUri, fileName } = await uploadThumbnail(formData);
            return {
              uid: fileStaticUri,
              name: fileName,
              url: fileStaticUri,
            } as FileItem;
          } catch (error) {
            return {};
          }
        },
        // showUploadList: true,
        onDownload() {},
        onPreview: (fileList: FileItem) => {
          createImgPreview({ imageList: [fileList.url!] });
        },
        onDelete(url: string) {
          formModel.deleteUrl = url!;
        },
      };
    },
  },
  {
    field: 'deleteUrl',
    label: '',
    component: 'Input',
    show: false,
  },
  {
    field: 'id',
    label: '唯一id',
    component: 'Input',
    show: false,
    componentProps: {
      maxLength: 36,
      placeholder: '请输入唯一id',
    },
  },
];

export const provSchemas: FormSchema[] = [
  {
    field: 'nameProv',
    component: 'ApiSelect',
    label: '',
    colProps: {
      span: 6,
    },
    componentProps({ formActionType }) {
      const { setFieldsValue } = formActionType;
      return {
        api: getAreaList,
        labelField: 'name',
        valueField: 'code',
        placeholder: t('common.province'),
        params: { parentId: 1, level: Level.PROVINCE },
        onChange: () => {
          setFieldsValue({ nameCity: null, nameCoun: null, nameTown: null });
        },
      };
    },
  },
  {
    field: 'nameCity',
    component: 'ApiSelect',
    label: '',
    colProps: {
      span: 6,
    },
    componentProps: ({ formActionType, formModel }) => {
      const nameProv = Reflect.get(formModel, 'nameProv');
      const { setFieldsValue } = formActionType;
      return {
        api: async (params: Recordable) => {
          try {
            if (!nameProv) return;
            const result = await getAreaList(params);
            return result;
          } catch (error) {
            return [];
          }
        },
        labelField: 'name',
        valueField: 'code',
        placeholder: t('common.city'),
        params: { parentId: nameProv, level: Level.CITY },
        onChange: () => {
          setFieldsValue({ nameCoun: null, nameTown: null });
        },
      };
    },
  },
  {
    field: 'nameCoun',
    component: 'ApiSelect',
    label: '',
    colProps: {
      span: 6,
    },
    componentProps: ({ formActionType, formModel }) => {
      const nameCity = Reflect.get(formModel, 'nameCity');
      const { setFieldsValue } = formActionType;
      return {
        api: async (params: Recordable) => {
          try {
            if (!nameCity) return;
            const result = await getAreaList(params);
            return result;
          } catch (error) {
            return [];
          }
        },
        labelField: 'name',
        valueField: 'code',
        placeholder: t('common.district'),
        params: { parentId: nameCity, level: Level.COUNTY },
        onChange: () => {
          setFieldsValue({ nameTown: null });
        },
      };
    },
  },
  {
    field: 'nameTown',
    component: 'ApiSelect',
    label: '',
    colProps: {
      span: 6,
    },
    componentProps: ({ formModel }) => {
      const nameCoun = Reflect.get(formModel, 'nameCoun');
      return {
        api: async (params: Recordable) => {
          try {
            if (!nameCoun) return;
            const result = await getAreaList(params);
            return result;
          } catch (error) {
            return [];
          }
        },
        labelField: 'name',
        valueField: 'code',
        placeholder: t('common.town'),
        params: { parentId: nameCoun, level: Level.TOWN },
      };
    },
  },
];