import { FileItem } from '../types';
import { uploadThumbnail } from '/@/api/configuration/center/configurationCenter';
import type { FormSchema } from '/@/components/Form/index';
import { createImgPreview } from '/@/components/Preview';
export const schemas: FormSchema[] = [
  {
    field: 'name',
    component: 'Input',
    label: '平台名称',
    colProps: {
      span: 24,
    },
    componentProps: {
      maxLength: 255,
      placeholder: '请输入平台名称',
    },
    dynamicRules: () => {
      return [
        {
          required: false,
          validator: (_, value) => {
            if (String(value).length > 255) {
              return Promise.reject('字数不超过255个字');
            }
            return Promise.resolve();
          },
        },
      ];
    },
  },
  {
    field: 'logo',
    label: 'APP Logo',
    // component: 'Upload',
    // colProps: {
    //   span: 24,
    // },
    // slot: 'logoUpload',
    helpMessage: ['支持.PNG、.JPG格式，建议尺寸为32*32px，大小不超过5M '],
    component: 'ApiUpload',
    changeEvent: 'update:fileList',
    valueField: 'fileList',
    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.deleteLogoUrl = url!;
        },
      };
    },
  },
  {
    field: 'deleteLogoUrl',
    label: '',
    component: 'Input',
    show: false,
  },
  {
    field: 'background',
    label: '登录页背景图片',
    // component: 'Input',
    // colProps: {
    //   span: 24,
    // },
    // slot: 'bgUpload',
    helpMessage: ['支持.PNG、.JPG格式，建议尺寸为1920*1080px，大小不超过5M'],
    component: 'ApiUpload',
    changeEvent: 'update:fileList',
    valueField: 'fileList',
    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.deleteBackgroundUrl = url!;
        },
      };
    },
  },
  {
    field: 'deleteBackgroundUrl',
    label: '',
    component: 'Input',
    show: false,
  },
  {
    field: 'backgroundColor',
    component: 'AutoComplete',
    label: '登录页背景颜色',
    colProps: {
      span: 24,
    },
    slot: 'colorInput',
  },
  {
    field: 'background',
    component: 'Input',
    label: '首页轮播图',
    colProps: {
      span: 24,
    },
    slot: 'homeSwiper',
  },
];