index.js 2.13 KB
import Taro, {Component} from '@tarojs/taro';
import {View, Text, ScrollView, Image} from '@tarojs/components';
import {getImgUrl} from '../../utils';
import './index.scss';
import router from '../../router/index';
import event from '../../utils/event';

export default class HotSeries extends Component {
    constructor(props) {
        super(props);

        this.state = {};
    }

    static defaultProps = {
        floor: [],
        title: '热门系列',
        isShow: false
    }

    goToList(item, idx) {
      const {
        floorId,
        floorName,
        floorIdx
      } = this.props;

      const params = {
        F_ID: floorId,
        F_NAME: floorName,
        F_INDEX: floorIdx,
        F_URL: `/pages/searchList/index?name=${item.series_name}&series=${item.series_id}`,
        I_INDEX: idx
      };

      event.emit('report-main-event', params);
      router.go('productList', {
        series: item.series_id,
        name: item.series_name
      });
    }

    render() {
        let {floor, title, isShow} = this.props;

        return (
            <View className="hot-series">
                <Text className="title">{title}</Text>
                <ScrollView
                    className='scrollview'
                    scrollX
                    scrollWithAnimation
                    scrollLeft='0'
                    lowerThreshold='20'
                    upperThreshold='20'
                >
                    {
                        floor.map((item, index) => {
                            return (
                                <View className="item" key={item.series_id}>
                                  <Image onClick={this.goToList.bind(this, item, index + 1)} src={getImgUrl(item.image_url, 140, 140)} mode="aspectFill" className="item-img" />
                                        <View className="item-name">{item.series_name}</View>
                                </View>
                            )
                        })
                    }
                </ScrollView>
                <View className={isShow ? "category-line" : "category-line hidden"}></View>
            </View>
        )
    }
}