index.js 1.19 KB
import React from 'react'
import { Row, Col} from 'antd';
import IconConfig from './../../../config/IconConfig'
import './index.less'


class IconOptionsForm extends React.Component {
  state = {}
  
  selectedUser= (data)=> {

    console.log(data);
    if (data) {
      this.props.getIconObj(
        data
      )
    }
    this.setState({
      iconCheckedObj: data
    })
  }
  renderIconLists = (data) => {
   const iconCheckedObj = this.props.iconCheckedObj
    let _this = this
   
    return data.map(
      function (item ,index) { 
        item.key = index
        return <Col key={index} className="iconCol"span={4} style={{backgroundColor:(iconCheckedObj == item.name ) ? "#00a0e9" : "#fff"}}  onClick={()=>{_this.selectedUser(item.name)}}>
             <div className={ ` iconfont ${item.className}`}></div>
              <div>{item.name}</div>
         </Col>
      }
    )
      
  }

  render(){
    return(

      <div className="iconlist">
          <div className="iconRow">
             <Row type="flex" justify="left" align="middle">
               {this.renderIconLists(IconConfig)}
            </Row>
           
          </div>
      </div>
     
    )
  }
}
export default IconOptionsForm