import React, { Component } from "react";
import styles from "../index.less";
import $ from 'jquery';
import { windowEventHandler,setFontColorSize } from '@utils/tools';
import checkOff from '@common/images/check_off.png';
import checkOn from '@common/images/check_on.png';

class AssistName extends Component {
	constructor(props) {
		super(props);
		this.state = {

		};
		this.$assistName = React.createRef();
		this.splitName = this.splitName.bind(this);
    this.checkOnOff = this.checkOnOff.bind(this);
	}
	splitName(name){
		let wid = this.props.winWidth;
		if(name.length>15 && wid>1150){
			let tmpStr = name.substr(0,15)
			return tmpStr+'...'
		}else{
			return name
		}
	}
  checkOnOff(item,idx){
    const {checkOnOff,handlePush} = this.props
    checkOnOff(item,idx)
    handlePush && handlePush({mode:8});       //右侧推送
  }
	render() {
		const { winWidth, name, getInfomation,normal,item,idx } = this.props;
		return (
				<span className={`${styles.assistName} ${setFontColorSize(2)}`} style={{ width: winWidth < 1150 ? '120px' : 'auto',fontWeight:normal?'normal':'bold'}} ref={this.$assistName}>
          <img className={styles.imgCheck} src={item.check?checkOn:checkOff} onClick={()=>this.checkOnOff(item,idx)} alt=""/>
					<span className={styles.tagSpan} title={name}>
						{name&&this.splitName(name)}：
					</span>
				</span>
		);
	}
}

export default AssistName;
