import { BasicColumn } from '/@/components/Table';
import { FormSchema } from '/@/components/Table';
import { h } from 'vue';
import { Ref } from 'vue';

// 1. 颜色映射（修正原拼写错误，统一规则）
export const colorHexMap: Record<string, string> = {
  blue: '#1890ff',
  green: '#208840',
  gold: '#faad14',
  red: '#f5222d',
  gray: '#8c8c8c',
  black: '#000000',
};

// 2. 定义生产状态映射类型（和dataQuality保持一致）
export type ProductionStatusMap = Record<string | number, { 
  label: string; 
  value: number | string; 
  color: string; 
}>;

// 3. 生成动态表格列（接收动态状态映射）
export function getColumns(dynamicStatusMap: Ref<ProductionStatusMap>): BasicColumn[] {
  return [
    {
      title: '煤矿编号',
      dataIndex: 'mineCode',
      width: 100,
    },
    {
      title: '所属执法处',
      dataIndex: 'managementName',
      width: 100,
    },
    {
      title: '煤矿名称',
      dataIndex: 'mineName',
      width: 200,
    },
    {
      title: '煤矿简称',
      dataIndex: 'mineNameAbbr',
      width: 100,
      ifShow: false,
    },
    {
      title: '生产状态',
      dataIndex: 'productionStatus',
      width: 100,
      customRender: ({ record }) => {
        // 空值/异常值处理
        const status = String(record.productionStatus || '');
        // 从动态映射取值，兜底未知状态
        const { label, color } = dynamicStatusMap.value[status] || { 
          label: '-', 
        };
        // 渲染带颜色的文字
        return h('span', { 
          style: { color: colorHexMap[color] } 
        }, label);
      },
    },
    {
      title: '自燃情况',
      dataIndex: 'alarmLevel',
      width: 100,
    },
    {
      title: '接入状态',
      dataIndex: 'accessStatus',
      width: 100,
      customRender: ({ record }) => {
        // 空值/异常值处理
        const status = String(record.accessStatus || '');
        if (!status || status === 'undefined' || status === 'null') {
          return h('span', { style: { color: colorHexMap.black } }, '/');
        }
        const text = status === '1' ? '接入' : '未接入';
        const textColor = status === '1' ? colorHexMap.green : colorHexMap.gold;
        return h('span', { style: { color: textColor } }, text);
      },
    },
    {
      title: '在线状态',
      dataIndex: 'status',
      width: 100,
      customRender: ({ record }) => {
        const status = String(record.status || '');
        if (!status || status === 'undefined' || status === 'null') {
          return h('span', { style: { color: colorHexMap.black } }, '/');
        }
        const text = status === '1' ? '在线' : '离线';
        const textColor = status === '1' ? colorHexMap.green : colorHexMap.red;
        return h('span', { style: { color: textColor } }, text);
      },
    },
    {
      title: '应接数量',
      dataIndex: 'yingjieNum',
      width: 100,
    },
    {
      title: '已接数量',
      dataIndex: 'accessGoafNum',
      width: 100,
    },
    {
      title: '未接数量',
      dataIndex: 'notAccessGoafNum',
      width: 100,
    },
  ];
}

// 4. 生成动态搜索表单配置（接收动态下拉选项）
export function getSearchFormSchema(dynamicStatusOptions: Ref<{ label: string; value: string | number }[]>): FormSchema[] {
  return [
    {
      field: 'mineCode',
      label: '煤矿名称',
      component: 'MineCascader',
      colProps: { span: 6 },
    },
    {
      field: 'mineNameAbbr',
      label: '煤矿简称',
      component: 'Input',
      colProps: { span: 6 },
      show: false,
    },
    {
      field: 'productionStatus',
      label: '生产状态',
      component: 'Select',
      componentProps: {
        // 动态绑定下拉选项
        options: dynamicStatusOptions,
      },
      colProps: { span: 6 },
    },
    {
      field: 'accessStatus',
      label: '接入状态',
      component: 'Select',
      componentProps: {
        options: [
          { label: '接入', value: 1 },
          { label: '未接入', value: 0 },
        ],
      },
      colProps: { span: 6 },
    },
    {
      field: 'status',
      label: '在线状态',
      component: 'Select',
      componentProps: {
        options: [
          { label: '离线', value: '0' },
          { label: '在线', value: '1' },
        ],
      },
      colProps: { span: 6 },
    },
    {
      field: 'riskLevel',
      label: '风险等级',
      component: 'Select',
      componentProps: {
        options: [
          { label: 'Ⅰ类容易自燃', value: '0' },
          { label: 'Ⅱ类自燃', value: '1' },
          { label: 'Ⅲ类不易自燃', value: '2' },
        ],
      },
      colProps: { span: 6 },
      show: false,
    },
  ];
}