import Taro, { Component } from '@tarojs/taro';
import ListView from '@components/ListView'
import './index.scss'
import { queryActivityList, getActNewList } from '@services/activity'
import ActivityItem from './item'
import { savePoint, updatePoint } from '@services/common'
import { connect } from '@tarojs/redux'

@connect(state => state.city)
export default class Index extends Component {

  config = {
    navigationBarTitleText: '热门活动'
  }

  state = {
    list: [],
    hasMore: true,
    isEmpty: false,
    recordId: null,
    pageIndex: 1
  }

  refreshing = false

  componentWillMount() {
    // App.zhuge.track('查看活动列表页面')
    savePoint({
      event: 'list',
      eventType: 'activity',
      propertyName: '活动列表',
      data: '{}'
    }).then(res => {
      this.setState({
        recordId: res.recordId
      })
      console.log('活动列表')
    })
  }
 
  componentDidShow () {
    // // this.onPullDownRefresh()
    // console.log('----', this)
    this.loadData(1)
  }
  
  componentWillUnmount() {
    const { recordId } = this.state
    recordId && updatePoint(recordId)
  }

  loadList(pageNumber) {
    const { curCity: { id: cityId } } = this.props
    const payload = { pageSize: 10, pageNumber }

    const { params: { buildingId, from } } = this.$router
    if (cityId) {
      payload.cityId = cityId
    }
    // 从个人中心过来
    console.log(this.router, "from")
    if (from === 'mine') {
      payload.mine = true
    }
    // // 从项目详情过来
    if (buildingId) {
      payload.buildingId = buildingId
    }
    // return queryActivityList(payload)
    return getActNewList(payload)
  }

  handleItemClick(item) {
    switch (item.type) {
      case 'help':
        Taro.navigateTo({
          url: '/pages/activity/detail/assistance?id=' + item.id
        })
        return
      case 'group':
        Taro.navigateTo({
          url: '/pages/activity/detail/assemble?id=' + item.id
        })
        return
      default:
        Taro.navigateTo({
          url: '/pages/activity/detail/index?id=' + item.id
        })
        return
    }
  }

  onPullDownRefresh = (rest) => {
    // debugger
    if (this.refreshing) return
    this.refreshing = true

    this.loadData(1)

    // debugger
    rest && rest()
    
    this.refreshing = false
  }

  onScrollToLower = async (fn) => {
    const { pageIndex } = this.state;
    this.loadData(pageIndex + 1)
    fn && fn();
  }

  loadData = (page) => {
    this.loadList(page).then(res => {
      const {records, list, total, current, pages} = res || {}
      const _list = records || list || []
      const newList = current <= 1 ? _list: this.state.list.concat(_list)
console.log(res,'---res-------')
      this.setState({
        list: newList,
        isEmpty: total == 0,
        hasMore: current < pages,
        pageIndex: current >= pages ? pages : current
      })
    })
  }

  render() {
    const { isEmpty, hasMore, list } = this.state
    return (
      <ListView
        className="wrap"
        needInit
        isEmpty={isEmpty}
        emptyText="暂无活动~"
        hasMore={hasMore}
        onPullDownRefresh={fn => this.onPullDownRefresh(fn)}
        onScrollToLower={fn => this.onScrollToLower(fn)}
      >
        <View className="list">
          {
            list.map(item => (
              <ActivityItem
                data={item}
                key={item.dynamicId}
                onClick={this.handleItemClick}>
              </ActivityItem>
            ))
          }
        </View>
      </ListView>
    );
  }
}