import Taro, { Component } from '@tarojs/taro';
import './index.scss'
import { getWindowHeight } from '@utils/style'
import { queryChatFriends } from '@services/chat'

import EmptyPage from '@components/empty-page'
import Item from './item'
import ready from '@utils/ready'
import { connect } from '@tarojs/redux'
@connect(state => state.user)
export default class Index extends Component {
  config = {
    navigationBarTitleText: '我的聊天记录'
  }
  state = {
    list: [],
    scrollTop: 0,
    loading: false,
    pagination: {
      pageNumber: 1,
      pageSize: 50,
    },
    loaded: false,
    params: {
      id: 0,
      type: 'card'
    }
  }
  componentDidShow() {
    ready.queue(() => {
      this.loadList()
    })
  }
  loadList() {
    Taro.showLoading()
    const { pagination } = this.state
    queryChatFriends(pagination).then(res => {
      const { current, records, size, total } = res
      Taro.hideLoading()
      this.setState({
        loaded: true,
        list: records,
        pagination: {
          pageSize: size,
          pageNumber: current,
        }
      })
    })
  }

  onScrolltolower() {
    !this.state.lastPage && !this.state.loading && this.loadList()
  }

  toChat(person) {
    const { userInfo: { person: { personId, nickname, name } } } = this.props
    const { friendId: receivePersonId, name: receivePersonName } = person
    // debugger
    Taro.navigateTo({
      url: `/pages/im/index?sendId=${personId}&sendName=${encodeURIComponent(name || nickname)}&receiverId=${receivePersonId}&receiverName=${encodeURIComponent(receivePersonName)}`
    })
  }

  render() {
    const { list } = this.state
    return (
      <ScrollView
        scrollY
        scroll-with-animation
        enable-back-to-top
        className="list"
        style={{
          height: getWindowHeight()
        }}>

        {(loaded && list.length === 0) ? <EmptyPage text="暂无好友哦~" /> : list.map(item => <Item key={item.sendPerson} data={item} onClick={this.toChat.bind(this)} />)}

        {/* <Loadmore nodata={!list.length} loading={loading} loadend={loadend}></Loadmore> */}
      </ScrollView>
    );
  }
}