/* eslint-disable react/no-unused-state */
import Taro, { Component, navigateBack } from '@tarojs/taro';
import { View, Text, Navigator, Button } from '@tarojs/components';
import { FilterGroup, PageTitle } from '../../components';
import {search as searchModel} from '../../models';
import { connect } from '@tarojs/redux';
import { bindActionCreators } from 'redux';
import { setFilter } from '../../actions/filterData';
import event from '../../utils/event.js'
import './index.scss';
import wx from '../../libs/wx';
import Yas from '../../utils/yas';

let yas;

@connect(({ filterData, filterMenu }) => ({
    filterData,
    filterMenu
}), (dispatch) => {
	return bindActionCreators({
		setFilter
    }, dispatch);
})

export default class Search extends Component {
	constructor() {
		super(...arguments);
		this.state = {
			filter: [],
			selectList: {}
		};
	}

	config = {
		navigationBarTitleText: '筛选'
	}

  componentWillMount() {
	  yas = new Yas(this.$scope);
    yas.pageOpenReport();
  }

  componentDidShow() {
  }

	componentDidMount () {
		console.log(this.$router);
		let { params } = this.$router;
    if (params && params.query) {
      params.query = decodeURI(params.query);
    }
		searchModel.getFilterData(params).then(ret => {
			if (ret && ret.code === 200) {
				this.setState({
					filter: ret.data && ret.data.filter || []
				});
			}
		});

		let {selectList} = this.state;
		selectList = this.props.filterData;

		let brandValue = params['brand'];
		if (brandValue) {
			selectList['brand'] = brandValue;
		}
		if (selectList) {
			this.setState({
				selectList
			});
		}
	}

	onChangeFilter(item) {
		let {selectList} = this.state;
		for (var key in item) {
			selectList[key] = item[key]
		}

		this.setState({
			selectList
		});
	}

	onResetFilter() {
		let {setFilter} = this.props;
		let {selectList} = this.state;

		for (var key in selectList) {
			selectList[key] = '';
		}
		setFilter(selectList);

		this.setState({
			selectList
		});
	}

	onConfirmSearch() {
		let {setFilter, filterMenu} = this.props;
		let {selectList} = this.state;
    event.emit('reset-page-loading', { filterMenu: filterMenu});
		setFilter(selectList);

		wx.navigateBack({
			delta: 1
		})
	}

	render () {
        let {filter, selectList} = this.state;

		return (
			<View className="filter-page">
                {/* <PageTitle pageTitle="筛选"></PageTitle> */}

                {
                    filter.map((item, index) => {
                        return (
                            <FilterGroup list={item} selectList={selectList} onChangeFilter={this.onChangeFilter.bind(this)} key={index}></FilterGroup>
                        )
                    })
                }

                <View className="filter-btn">
                    <View className="reset-btn" onClick={this.onResetFilter}>清空</View>
					<Button className="confirm-btn" onClick={this.onConfirmSearch}>确认</Button>
                </View>
            </View>
		)
	}
}