import type { FormSchemaGetter } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';

import { selectAllSysStationAreaList } from '#/api/system/infoEntry/stationInfo/stationInfo';
import { getDictOptions } from '#/utils/dict';

const placementAreaOptions = getDictOptions('placement_area');

export const queryFormSchema: FormSchemaGetter = () => [
  {
    component: 'ApiSelect',
    fieldName: 'stationId',
    label: '油站',
    componentProps: {
      placeholder: '请选择油站',
      api: async () => {
        const resp = await selectAllSysStationAreaList();
        const data = resp || [];
        return Array.isArray(data)
          ? data.map((item: any) => ({
              label: item.stationName,
              value: item.id.toString(),
            }))
          : [];
      },
    },
  },
  {
    component: 'DatePicker',
    componentProps: {
      type: 'daterange',
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
      startPlaceholder: '开始日期',
      endPlaceholder: '结束日期',
      style: {
        width: '100%',
      },
    },
    fieldName: 'validDate',
    label: '有效日期',
  },

  {
    component: 'Input',
    fieldName: 'extinguisherNumber',
    label: '灭火器编号',
    componentProps: {
      placeholder: '请输入灭火器编号',
    },
  },
];

export const tableColumns: VxeGridProps['columns'] = [
  {
    type: 'checkbox',
    width: 80,
  },
  {
    field: 'stationName',
    title: '油站',
    minWidth: 120,
  },
  {
    field: 'extinguisherNumber',
    title: '灭火器编号',
    minWidth: 150,
    formatter: (params: { cellValue: string; column: any; row: any }) =>
      params.cellValue,
  },
  {
    field: 'extinguisherModel',
    title: '灭火器型号',
    minWidth: 120,
    formatter: (params: { cellValue: string; column: any; row: any }) =>
      params.cellValue,
  },
  {
    field: 'placementLocation',
    title: '摆放位置',
    minWidth: 120,
    formatter: (params: { cellValue: string; column: any; row: any }) =>
      params.cellValue,
  },
  {
    field: 'placementAreaName',
    title: '摆放区域',
    minWidth: 120,
    formatter: (params: { cellValue: string; column: any; row: any }) =>
      params.cellValue,
  },
  {
    field: 'productionDate',
    title: '生产日期',
    minWidth: 120,
    formatter: (params: { cellValue: string; column: any; row: any }) =>
      params.cellValue,
  },
  {
    field: 'validDate',
    title: '有效日期',
    minWidth: 120,
    formatter: (params: { cellValue: string; column: any; row: any }) =>
      params.cellValue,
  },
  {
    field: 'createBy',
    title: '操作人姓名',
    minWidth: 120,
    formatter: (params: { cellValue: string; column: any; row: any }) =>
      params.cellValue,
  },
  {
    field: 'action',
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
    width: 150,
  },
];

export const drawerFormSchema: FormSchemaGetter = () => [
  {
    component: 'Input',
    dependencies: {
      show: () => false,
      triggerFields: [''],
    },
    fieldName: 'id',
  },
  {
    component: 'ApiSelect',
    fieldName: 'stationId',
    label: '油站',
    componentProps: {
      placeholder: '请选择油站',
      api: async () => {
        const resp = await selectAllSysStationAreaList();
        const data = resp || [];
        return Array.isArray(data)
          ? data.map((item: any) => ({
              label: item.stationName,
              value: item.id.toString(),
            }))
          : [];
      },
    },
    rules: 'required',
  },
  {
    component: 'Input',
    fieldName: 'extinguisherNumber',
    label: '灭火器编号',
    componentProps: {
      placeholder: '请输入灭火器编号',
      maxlength: 100,
    },
    rules: 'required',
  },
  {
    component: 'Input',
    fieldName: 'extinguisherModel',
    label: '灭火器型号',
    componentProps: {
      placeholder: '请输入灭火器型号',
      maxlength: 100,
    },
    rules: 'required',
  },
  {
    component: 'Input',
    fieldName: 'placementLocation',
    label: '摆放位置',
    componentProps: {
      placeholder: '请输入摆放位置',
      maxlength: 100,
    },
    rules: 'required',
  },
  {
    component: 'ApiSelect',
    fieldName: 'placementArea',
    label: '摆放区域',
    componentProps: {
      placeholder: '请选择摆放区域',
      options: placementAreaOptions,
      labelField: 'label',
      valueField: 'value',
    },
    rules: 'required',
  },
  {
    component: 'DatePicker',
    componentProps: {
      type: 'date',
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
      placeholder: '生产日期',
      style: {
        width: '100%',
      },
    },
    fieldName: 'productionDate',
    label: '生产日期',
    rules: 'required',
  },
  {
    component: 'DatePicker',
    componentProps: {
      type: 'date',
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
      placeholder: '有效日期',
      style: {
        width: '100%',
      },
    },
    fieldName: 'validDate',
    label: '有效日期',
    rules: 'required',
  },
];
