import { useState, useEffect } from "react";
import { useSelector } from "react-redux";
import withLayout from "@/layout";
import { ScrollView } from "@tarojs/components";
import "@/assets/css/iconfont.css";
import { fetch } from "@/utils/request";
import { API_NEWS_LIST } from "@/constants/api";
import { getbkNotice } from "@/services/broker";
import MessageTime from "./components/messageTime";
import MessageItem from "./components/messageItem";
import "./index.scss";

export default withLayout((props) => {
  const [PageList, setPageList] = useState([]);

  const [pageNumber, setPageNumber] = useState(1);
  const [HasNextPage, setHasNextPage] = useState(true);

  useEffect(() => {
    GetPageList();
  }, [pageNumber]);

  const GetPageList = () => {
    setHasNextPage(false);
    getbkNotice({
      pageNumber,
      pageSize: 10,
      noticeType: "status-change",
      mine: true,
    })
      .then((res) => {
        setPageList(
          pageNumber === 1
            ? res.records || []
            : PageList.concat(res.records || [])
        );
        setHasNextPage(res.current < res.pages);
      })
      .catch(() => {
        change(0);
      });
  };

  const PageLoadMore = () => {
    // 页面上拉加载更多
    if (HasNextPage) {
      setPageNumber(pageNumber + 1);
    }
  };

  return (
    <view className="Page myMessage">
      <ScrollView
        scroll-y
        refresher-background="#F8F8F8"
        onscrolltolower={PageLoadMore}
      >
        <view className="PageContent">
          {PageList.map((item, index) => (
            <view>
              <MessageTime item={item} time={item.createDate} />
              <MessageItem item={item} />
            </view>
          ))}

          {/* bottom */}
          <view className="PageBottom">
            <text>已经到底了~</text>
          </view>
        </view>
      </ScrollView>
    </view>
  );
});