import {BasicColumn, FormSchema} from "/@/components/Table";
import {useI18n} from "/@/hooks/web/useI18n";
const { t } = useI18n();
import { uploadThumbnail } from '/@/api/configuration/center/configurationCenter';
import { FileItem } from '/@/components/Upload/src/typing';
import {createImgPreview} from "/@/components/Preview";

const statusOptions = [

];
export const columns: BasicColumn[] = [
  {
    title: t('faultReport.facility.nameCode'),
    dataIndex: 'code',
  },
  {
    title: t('faultReport.facility.themeText'),
    dataIndex: 'name',
  },
  {
    title: t('faultReport.facility.status'),
    dataIndex: 'status',
    slots: { customRender: 'status' },
  },
  {
    title: t('faultReport.facility.reportText'),
    dataIndex: 'reportText',
    slots: { customRender: 'reportText' },
  },
  {
    title: t('faultReport.facility.departmentText'),
    dataIndex: 'departmentText',
    slots: { customRender: 'departmentText' },
  },
  {
    title: t('faultReport.facility.remarks'),
    dataIndex: 'remarks',
    slots: { customRender: 'remarks' },
  },
  {
    title: t('faultReport.facility.creatorText'),
    dataIndex: 'creator',
    slots: { customRender: 'creator' },
  },
  {
    title: t('faultReport.facility.creatorDate'),
    dataIndex: 'creatorDate',
  }
];

export const formSchema: FormSchema[] = [
  {
    field: 'deviceName',
    label: t('faultReport.facility.deviceNameText'),
    component: 'Input',
    required: true,
    colProps: { span: 12 },
  },
  {
    field: 'deviceCode',
    label: t('faultReport.facility.deviceCodeText'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    required: true,
    colProps: { span: 12 },
  },
  {
    field: 'model',
    label: t('faultReport.facility.modelText'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    colProps: { span: 12 },
 },
  {
    field: 'deviceType',
    label: t('faultReport.facility.deviceTypeText'),
    component: 'Input',
    required: true,
    componentProps: {
      disabled: true,
    },
    colProps: { span: 12 },
 },{
    field: 'storageLocation',
    label: t('faultReport.facility.storageLocationText'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    colProps: { span: 12 },
 },{
    field: 'useDepartment',
    label: t('faultReport.facility.useDepartmentText'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    required: true,
    colProps: { span: 12 },
 },{
    field: 'nameCode',
    label: t('faultReport.facility.nameCode'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    required: true,
    colProps: { span: 12 },
 },{
    field: 'report',
    label: t('faultReport.facility.reportText'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    required: true,
    colProps: { span: 12 },
 },{
    field: 'department',
    label: t('faultReport.facility.departmentText'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    required: true,
    colProps: { span: 12 },
 },{
    field: 'phone',
    label: t('faultReport.facility.phoneText'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    colProps: { span: 12 },
 },{
    field: 'themeText',
    label: t('faultReport.facility.themeText'),
    component: 'Input',
    required: true,
    colProps: { span: 24 },
  },{
    field: 'faultDate',
    label: t('faultReport.facility.faultDate'),
    component: 'DatePicker',
    componentProps: {
      style: { width: '100%' },
    },
    colProps: { span: 12 },
  },
  {
    field: 'faultLevel',
    label: t('faultReport.facility.faultLevel'),
    component: 'Select',
    colProps: { span: 12 },
  },{
    field: 'faultType',
    label: t('faultReport.facility.faultType'),
    component: 'Select',
    colProps: { span: 12 },
  },{
    field: 'serviceStatus',
    label: t('faultReport.facility.serviceStatus'),
    component: 'Checkbox',
    colProps: { span: 12 },
  },{
    field: 'faultDescription',
    label: t('faultReport.facility.faultDescription'),
    component: 'InputTextArea',
    colProps: { span: 24 },
  },{
    field: 'img',
    label: t('faultReport.facility.imgText'),
    component: 'ApiUpload',
    changeEvent: 'update:fileList',
    valueField: 'fileList',
    componentProps: ({ formModel }) => {
      return {
        listType: 'picture',
        maxFileLimit: 10,
        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: 'parentId',
    //     label: t('routes.common.organization.parentOrganization'),
    //     component: 'ApiTreeSelect',
    //     componentProps: {
    //       placeholder: t('common.chooseText') + t('business.organizationText'),
    //       api: async () => {
    //         const data = await getOrganizationList();
    //         copyTransFun(data as any as any[]);
    //         return data;
    //       },
    //       multiple: 2
    //   },
    // },
]

export const searchFormSchema: FormSchema[] = [
  {
    field: 'deviceNameText',
    label: t('faultReport.facility.nameText'),
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'nameCode',
    label: t('faultReport.facility.nameCode'),
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'nameText',
    label: t('faultReport.facility.nameText'),
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'status',
    label: t('faultReport.facility.status'),
    component: 'Select',
    colProps: { span: 6 },
    componentProps: {
      options: statusOptions,
    },
  },
];