import React, { useState, useEffect } from 'react'
import request, { apis } from '@/utils/request'
import ScrollPage from '@/components/ScrollPage/index'
import '@/assets/css/reset.less'
import '@/assets/css/iconfont.less'
import './index.less'

export default function ScrollPageRefresh (props) {

  const { ApiName = '', ListName = 'records', RequestParams = {}, RequestData = null, RequestUrlData = null, PageSize = 10, Refresh = () => { }, Push = () => { } } = props
  const [IsPullUp, setIsPullUp] = useState(false)
  const [IsPullDown, setIsPullDown] = useState(false)
  const [HasNextPage, setHasNextPage] = useState(true)
  const [PageNum, setPageNum] = useState(1)

  useEffect(() => {
    GetPageList(() => {
      setIsPullDown(false)
      setIsPullUp(false)
    })
  }, [PageNum])

  const GetPageList = (done = () => { }) => { // 获取列表
    let RequestBody = {
      ...apis[ApiName],
      params: { ...RequestParams, pageNum: PageNum, pageSize: PageSize }
    }
    if (RequestData !== null) {
      RequestBody.data = { ...RequestData }
    }
    if (RequestUrlData !== null) {
      RequestBody.args = { ...RequestUrlData }
    }
    request({ ...RequestBody }).then((res) => {
      if (PageNum === 1) {
        if (ListName === null) {
          Refresh([...res])
        } else {
          Refresh([...res[ListName]])
        }
      } else {
        if (ListName === null) {
          Push([...res])
        } else {
          Push([...res[ListName]])
        }
      }
      if (ListName === null) {
        setHasNextPage(false)
      } else {
        if (res[ListName].length) {
          setHasNextPage(res.current - 0 < res.pages - 0)
        } else if (res.total === 0) {
          setHasNextPage(false)
        }
      }
      done()
    }).catch(() => {
      done()
    })
  }

  const OnRefresh = () => { // 页面下拉刷新
    setIsPullDown(true)
    setPageNum(1)
    if (PageNum === 1) {
      GetPageList(() => {
        setIsPullDown(false)
      })
    } else {
      setPageNum(1)
    }
  }

  const OnPullUp = () => {
    if (HasNextPage) {
      setIsPullUp(true)
      setPageNum(PageNum + 1)
    }
  }

  return (
    <view className='ScrollPageRefresh'>
      <ScrollPage OnRefresh={OnRefresh} IsPullUp={IsPullUp} IsPullDown={IsPullDown} OnPullUp={OnPullUp} HasMore={HasNextPage}>
        {
          props.children
        }
      </ScrollPage>
    </view>
  )
}
