/**
 * @Classname QywxSearch
 * @Description TODO
 * @Date 2019/8/27 16:53
 * @Created by Administrator
 */

import React from 'react';
import * as PropTypes from 'prop-types';
import { connectAlita } from 'redux-alita';
import { Input,Tag } from 'antd';
import './qywx.less'

class QywxSearch extends React.Component {

    static propTypes = {};

    static defaultProps = {};

    tagColors=['#f50','#2db7f5','#87d068','#108ee9'];

    constructor(props) {
        super(props);
        this.state = {};
    }

    componentDidMount() {

    }


    getRandomTagColor(){
        let i =  Math.round(Math.random()*(3));
        return this.tagColors[i];
    }

    handleOnSearch(keywords, event) {
        this.props.setAlitaState({ funcName: 'qywxSearch', stateName: 'searchResults', params: { keywords } })
            .then(resp => {
                console.log('handleOnSearch resp=>', resp);
            })
            .catch(e => {
                console.log('error=>', e);
            });
    }


    _renderSearchItem(item={message:'',data:[]}){
        if (!item.data||item.data.length<1){
            return  null;
        }
        return (<div key={item.message} className="qywx-results">
            <h3 className="result-title">{item.message}</h3>
            <div className="result-content">{item.data.map(result=>
                <Tag key={result.title} color={this.getRandomTagColor()}>{result.title}</Tag>)}</div>
        </div>)
    }

    render() {
        let { data: results = [], isFetching } = this.props.searchResults || {};
        console.log('qywx search data=> ', isFetching, results);
        return (<div>
            <div className="qywx-search">
                <h3 className="search-title">搜索</h3>
                <Input.Search
                    placeholder="输入关键词查询，比如：值班"
                    onSearch={this.handleOnSearch.bind(this)}/>
            </div>
            <div>
                {results.map&&results.map(item=>this._renderSearchItem(item))}
            </div>


        </div>);
    }


}


export default connectAlita(['searchResults'])(QywxSearch);
