import React from 'react';
import "./index.less";
import List from '../../components/VList/CheckList';
import IconFont from '../../themeComponents/IconFont';
import DeviceIcon from '../DeviceIcon';


export default class DeviceList extends React.Component {
  whatIcon = item => {
    const { getIconStyle } = this.props;
    return <DeviceIcon style={getIconStyle ? getIconStyle(item) : undefined} type={item.deviceType} status={item.deviceStatus} />;
  };

  deleteItem = (item, e) => {
    e.stopPropagation(e);
    e.preventDefault();
    const { deleteItem } = this.props;
    deleteItem && deleteItem(item);
  };

  render() {
    const { className = "", deviceList = [], deleteItem, setDeviceType, componentsType, renderItemExt, deleteDeviceAll, selectDevicesType, showVideoSet,showData,onMouseOverItem, ...props } = this.props;
    return (
       <List
        {...props}
        className={`lm-c-device-list-wrapper ${className}`}
        list={deviceList}
        itemNameKey="deviceName"
        rowHeight={30}
        whatIcon={this.whatIcon}
        onMouseOverItem={onMouseOverItem}
        renderItemExt={item =>
          renderItemExt
            ? renderItemExt(item)
            : deleteItem && (
                <span className="clear-item" onClick={e => this.deleteItem(item, e)}>
                  <IconFont type="icon-S_Edit_LineClose" title="删除" />
                </span>
              )
        }
      />
    );
  }
}
