import {
  IColorConfigType,
  IFormItemsConfigType,
  INumberConfigType,
  ITextConfigType,
  TColorDefaultType,
  TFormItemsDefaultType,
  TNumberDefaultType,
  TSelectDefaultType,
  ISelectConfigType,
  TTextDefaultType,
} from 'editorCore/FormComponents/types';

export type TTextWeightSelectKeyType = '300' | '400' | '500' | '600';

export type TFormEditData = Array<
  | ITextConfigType
  | INumberConfigType
  | IColorConfigType
  | ITextConfigType
  | IFormItemsConfigType
  | ISelectConfigType<TTextWeightSelectKeyType>
>;
export interface IFormConfig {
  title: TTextDefaultType;
  fontSize: TNumberDefaultType;
  titColor: TColorDefaultType;
  titWeight: TSelectDefaultType<TTextWeightSelectKeyType>;
  bgColor: TColorDefaultType;
  btnColor: TColorDefaultType;
  btnTextColor: TColorDefaultType;
  api: TTextDefaultType;
  formControls: TFormItemsDefaultType;
}

export interface IFormSchema {
  editData: TFormEditData;
  config: IFormConfig;
}

const Form: IFormSchema = {
  editData: [
    // {
    //   key: 'title',
    //   name: '标题',
    //   type: 'Text',
    // },
    // {
    //   key: 'fontSize',
    //   name: '标题大小',
    //   type: 'Number',
    // },
    // {
    //   key: 'titColor',
    //   name: '标题颜色',
    //   type: 'Color',
    // },
    // {
    //   key: 'titWeight',
    //   name: '标题粗细',
    //   type: 'Select',
    //   range: [
    //     {
    //       key: '300',
    //       text: '300 x 300',
    //     },
    //     {
    //       key: '400',
    //       text: '400 x 400',
    //     },
    //     {
    //       key: '500',
    //       text: '500 x 500',
    //     },
    //     {
    //       key: '600',
    //       text: '600 x 600',
    //     },
    //   ],
    // },
    {
      key: 'bgColor',
      name: '背景色',
      type: 'Color',
    },
    {
      key: 'btnColor',
      name: '按钮颜色',
      type: 'Color',
    },
    {
      key: 'btnTextColor',
      name: '按钮文本颜色',
      type: 'Color',
    },
    // {
    //   key: 'api',
    //   name: '表单Api地址',
    //   type: 'Text',
    // },
    {
      key: 'formControls',
      name: '表单控件',
      type: 'FormItems',
      canAddItem: false
    },
  ],
  config: {
    title: '表单定制组件',
    fontSize: 18,
    titColor: 'rgba(60,60,60,1)',
    titWeight: '400',
    bgColor: 'rgba(255,255,255,1)',
    btnColor: 'rgba(69,178,175,1)',
    btnTextColor: 'rgba(255,255,255,1)',
    api: '',
    formControls: [
      {
        id: '1',
        type: 'Text',
        label: '姓名',
        keyLabel: 'name',
        placeholder: '请输入姓名',
        disabled: false,
        labelEdit: true
      },
      {
        id: '2',
        type: 'Text',
        keyLabel: 'mobile',
        label: '电话',
        placeholder: ' 请输入电话',
        disabled: false,
        labelEdit: true
      },
      {
        id: '3',
        type: 'Text',
        keyLabel: 'address',
        label: '地址',
        placeholder: ' 请输入地址',
        disabled: false,
        labelEdit: true
      },
      {
        id: '4',
        type: 'Text',
        keyLabel: 'email',
        label: '邮箱',
        placeholder: ' 请输入邮箱',
        disabled: false,
        labelEdit: false
      },
      {
        id: '5',
        type: 'Text',
        keyLabel: 'city',
        label: '城市',
        placeholder: ' 请输入城市',
        disabled: false,
        labelEdit: false
      }
    ],
  },
};
export default Form;