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

import { emergencyInfoAll } from '#/api/system/infoEntry/emergencyInfo/emergencyInfo';
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);

export const queryFormSchema: FormSchemaGetter = () => [
  {
    component: 'ApiSelect',
    fieldName: 'stationId',
    label: '油站',
    componentProps: {
      placeholder: '请选择油站',
      api: async () => {
        const response = await selectAllSysStationAreaList({});
        const data = response || [];
        return Array.isArray(data)
          ? data.map((item) => ({
              label: item.stationName,
              value: item.id.toString(),
            }))
          : [];
      },
    },
  },
  {
    component: 'Select',
    fieldName: 'itemType',
    label: '用品类型',
    componentProps: {
      placeholder: '请选择用品类型',
      options: getEmergencyProtectionTypes(),
    },
  },
];

export const tableColumns: VxeGridProps['columns'] = [
  {
    type: 'checkbox',
    width: 80,
    fixed: 'left',
  },

  {
    field: 'itemName',
    title: '名称',
    minWidth: 120,
    fixed: 'left',
  },
  {
    field: 'itemTypeName',
    title: '类型',
    minWidth: 120,
  },
  {
    field: 'stationName',
    title: '油站',
    minWidth: 120,
  },
  {
    field: 'unit',
    title: '单位',
    minWidth: 80,
  },
  {
    field: 'quantity',
    title: '数量',
    minWidth: 80,
  },
  {
    field: 'createBy',
    title: '操作人',
    minWidth: 120,
  },
  {
    field: 'createTime',
    title: '操作时间',
    minWidth: 180,
  },
  {
    field: 'remark',
    title: '备注',
    minWidth: 200,
  },
  {
    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 response = await selectAllSysStationAreaList({});
        const data = response || [];
        return Array.isArray(data)
          ? data.map((item) => ({
              label: item.stationName,
              value: item.id.toString(),
            }))
          : [];
      },
    },
    rules: 'required',
  },
  {
    component: 'ApiSelect',
    fieldName: 'protectionId',
    label: '用品名称',
    componentProps: {
      placeholder: '请选择用品名称',
      api: async () => {
        try {
          // 调用真实的用品名称接口
          const response = await emergencyInfoAll();
          const data = response || [];
          console.log('获取到的用品数据:', data);
          return Array.isArray(data)
            ? data.map((item: any) => ({
                label: item.name || item.itemName || `用品${item.id}`,
                value: item.id.toString(),
              }))
            : [];
        } catch (error) {
          console.error('获取用品名称列表失败:', error);
          return [];
        }
      },
    },
    rules: 'required',
  },
  {
    component: 'InputNumber',
    fieldName: 'quantity',
    label: '数量',
    componentProps: {
      placeholder: '请输入数量',
      min: 0,
      step: 1,
      style: {
        width: '100%',
      },
    },
    rules: 'required',
  },
  {
    component: 'Input',
    fieldName: 'remark',
    label: '备注',
    componentProps: {
      type: 'textarea',
      placeholder: '请输入备注',
      maxlength: 200,
    },
  },
];
