import { mergeParameters } from '../../base/utils';
import React from 'react';
import { ICardMultiText, iCardMultiTextJSON, iConfigItem ,unitProps} from '.';
import {
  ComponentsType,
  DataType,
  getMappingType,
  iBoolProps,
  iProperty,
  TagType,
} from '../../base/type';
import iGrapesJSConfig from '../../type';
import IOTCardMultiText from './IOTCardMultiText';
import { checkLabelContainTag } from '../../index';

const grapesJSConfig: iGrapesJSConfig<iCardMultiTextJSON, ICardMultiText> = {
  type: [ComponentsType.BoolType, ComponentsType.EnumType, ComponentsType.NumberType],
  id: 'IOTCardMultiText',
  tag: TagType.IOTCardMultiText,
  access: 'r',
  render: (jsonData, ...args) => {
    const props = mergeParameters(jsonData, ...args);
    const { list } = props;
    var renderList = Array<{ title: string; text: string; label?: string; unit?:string;unitConvertFlag?: unitProps }>();
    list.forEach((item: iConfigItem) => {
      var valueDef = item.valueDef;
      if (!valueDef) {
        valueDef = {};
      }
      renderList.push({
        title: getShowTitle(valueDef.type, valueDef.specs, item?.functionName ?? '', true,item.label),
        text: getShowText(valueDef.type, valueDef.specs),
        label: item.label,
        unit: item.unit,
        unitConvertFlag: item.unitConvertFlag,
      });
    });
    props.list = renderList;
    return <IOTCardMultiText {...props}></IOTCardMultiText>;
  },

  buildData: (mock: boolean = false, property?: iProperty) => {
    if (property === undefined) return;
    const configItem = {
      id: property.id,
      streamName: property['display-name'] ?? '',
      functionName: property['display-name'],
      streamId: property.streamName,
      valueDef: property.valuedef,
      label: property.label,
      unit: property?.valuedef.specs.unit,
      unitConvertFlag: {
        hour: property?.valuedef.specs.unit === 'h',
        minute: property?.valuedef.specs.unit === 'min',
        second: property?.valuedef.specs.unit === 's',
      },
    };
    //区分类
    const props: iCardMultiTextJSON = {
      title: property['display-name'],
      streamId: property.streamName,
      type: property?.valuedef?.type,
      disabled: false,
      list: [
        {
          ...configItem,
          // desc: getDesc(configItem),
        },
      ],
    };
    if (mock) {
      props.list = [configItem, {}, {}];
    }
    return props;
  },
  traits: () => {
    return [
      {
        type: 'function-config',
        name: 'list',
        label: '添加配置',
        count: 100
      },
    ];
  },
};

export default grapesJSConfig;

// const getValuesFromEnumProperty = (property: iConfigItem) => {
//   const enumValues = [];
//   for (const key in property.valueDef.specs.values) {
//     enumValues.push({
//       value: key,
//       text: property.valueDef.specs.values[key],
//     });
//   }
//   return enumValues;
// };

// const getDesc  = (config:iConfigItem) =>  {
//   const streamType = getMappingType(config?.valueDef?.type);
//   if (streamType === DataType.EnumType) {
//     const items = getValuesFromEnumProperty(config);
//     const desc = items.reduce((accumulator: any, item: any) => {
//       return {
//         value: '0',
//         text: accumulator['text'] + ',' + item['text'],
//       };
//     });
//     return desc.text as string;
//   } else if (streamType === DataType.FloatType || streamType === DataType.IntType) {
//     return '';
//   } else if (streamType === DataType.BoolType) {
//     const desc: Array<string> = [];
//     Object.keys(config.valueDef.specs).forEach((key: string) => {
//       desc.push(config.valueDef.specs[key]);
//     });
//     return desc.join(',');
//   }
//   return '';
// }

const getShowText = (type: string, specs: any) => {
	const mappingType = getMappingType(type);
  let returnStr = '- -';
  if (specs) {
    if (mappingType === DataType.EnumType) {
      const key = Object.keys(specs.values)[0];
      if (key) {
        returnStr = specs.values[key];
      }
    } else if (mappingType === DataType.FloatType || mappingType === DataType.IntType) {
      const min = specs['min'];
      // const unit = specs['unit'];
      returnStr = `${min}`;
    } else if (mappingType === DataType.BoolType) {
      const key = Object.keys(specs)[0];
      if (key) {
        returnStr = specs[key];
      }
    }
  }
  return returnStr;
};
const getShowTitle = (type: string, specs: any, streamName: string, addUnit: Boolean,label?:string) => {
	const mappingType = getMappingType(type);
  let unit = '';
  if (specs) {
    if (mappingType === DataType.FloatType || mappingType === DataType.IntType ) {
      unit = specs['unit'];
    }
  } else {
    if (!streamName || streamName.length == 0) {
      return '功能名称';
    }
  }
  if (addUnit) {
    if(checkLabelContainTag('7', label ?? '')) {
      return `${streamName}`;
    }
    return `${streamName}${unit ?? ''}`;
  } else {
    return `${streamName}`;
  }
};