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 DICT_KEYS = {
  // 应急防护类型字典标识
  EMERGENCY_PROTECTION_TYPE: 'emergency_protection_type',
};

// 获取应急防护类型字典选项
const getEmergencyProtectionTypes = () =>
  getDictOptions(DICT_KEYS.EMERGENCY_PROTECTION_TYPE);

// 缓存片区列表
let areaList: any[] = [];

// 获取片区列表
const getAreaList = async () => {
  if (areaList.length === 0) {
    const resp = await selectAllSysStationAreaList();
    areaList = Array.isArray(resp) ? resp : [];
  }
  return areaList;
};

// 获取片区名称
const getAreaName = (areaId: number | string) => {
  const area = areaList.find((item) => item.id === areaId);
  return area ? area.stationName : areaId;
};

// 导出获取片区列表的函数
export const loadAreaList = async () => {
  await getAreaList();
};

export const queryFormSchema: FormSchemaGetter = () => [
  // {
  //   component: 'ApiSelect',
  //   fieldName: 'belongArea',
  //   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,
  //           }))
  //         : [];
  //     },
  //     labelField: 'label',
  //     valueField: 'value',
  //   },
  // },
  {
    component: 'Select',
    componentProps: {
      placeholder: '请选择防护类型',
      options: getEmergencyProtectionTypes(),
    },
    fieldName: 'itemType',
    label: '防护类型',
  },
];

export const tableColumns: VxeGridProps['columns'] = [
  {
    type: 'checkbox',
    width: 80,
  },
  // {
  //   field: 'belongArea',
  //   title: '我方油站',
  //   minWidth: 120,
  //   formatter: (params: { cellValue: string; column: any; row: any }) => {
  //     // 确保片区列表已加载

  //     return getAreaName(params.cellValue);
  //   },
  // },
  {
    field: 'itemName',
    title: '用品名称',
    minWidth: 150,
  },
  {
    field: 'itemType',
    title: '用品类型',
    minWidth: 120,
    formatter: (params: { cellValue: string; column: any; row: any }) => {
      const options = getEmergencyProtectionTypes();
      const option = options.find(
        (item: any) => item.value === params.cellValue,
      );
      return option ? option.label : params.cellValue;
    },
  },
  // {
  //   field: 'quantity',
  //   title: '数量',
  //   minWidth: 100,
  // },
  {
    field: 'unit',
    title: '单位',
    minWidth: 100,
  },
  {
    field: 'operatedAt',
    title: '操作时间',
    minWidth: 150,
  },
  {
    field: 'operatorName',
    title: '操作人姓名',
    minWidth: 120,
  },
  {
    field: 'remark',
    title: '备注',
    minWidth: 150,
  },
  {
    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: 'belongArea',
  //   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,
  //           }))
  //         : [];
  //     },
  //     labelField: 'label',
  //     valueField: 'value',
  //     clearable: true,
  //   },
  //   rules: 'required',
  // },
  {
    component: 'Input',
    fieldName: 'itemName',
    label: '用品名称',
    componentProps: {
      placeholder: '请输入用品名称',
      maxlength: 100,
    },
    rules: 'required',
  },
  {
    component: 'Select',
    componentProps: {
      placeholder: '请选择防护类型',
      options: getEmergencyProtectionTypes(),
    },
    fieldName: 'itemType',
    label: '防护类型',
    rules: 'required',
  },
  {
    component: 'Input',
    fieldName: 'unit',
    label: '单位',
    componentProps: {
      placeholder: '请输入单位',
      maxlength: 20,
    },
    rules: 'required',
  },
  {
    component: 'Input',
    fieldName: 'remark',
    label: '备注',
    componentProps: {
      type: 'textarea',
      placeholder: '请输入备注',
      maxlength: 200,
    },
  },
];
