import {useEffect, useState} from "react";
import Taro from '@tarojs/taro';
import {pageCmsArticle} from "@/api/cms/cmsArticle";
import {CmsArticle} from "@/api/cms/cmsArticle/model";
import {NavBar} from '@nutui/nutui-react-taro'
import './find.scss'

/**
 * 文章终极列表
 * @constructor
 */
const Find = () => {
  const [statusBarHeight, setStatusBarHeight] = useState<number>()
  const [loading, setLoading] = useState<boolean>(false)
  const [list, setList] = useState<CmsArticle[]>()

  const reload = async () => {
    setLoading(true)
    const article = await pageCmsArticle({categoryId: 4289, status: 0})
    if(article){
      setList(article?.list)
      setLoading(false)
    }
  }

  useEffect(() => {
    Taro.getSystemInfo({
      success: (res) => {
        setStatusBarHeight(res.statusBarHeight)
      },
    })
    reload().then(() => {
      console.log('初始化完成')
    })
  }, [])

  return (
    <>
      {loading && (<div>暂无数据</div>)}
      <NavBar
        fixed={true}
        style={{marginTop: `${statusBarHeight}px`, backgroundColor: 'transparent'}}
        onBackClick={() => {
        }}
        left={
          <>
            <div className={'flex justify-between items-center w-full'}>

            </div>
            {/*<SearchBar shape="round" maxLength={5} style={{paddingLeft: '1px'}}/>*/}
            {/*<div className={'flex flex-col text-center justify-center items-center'}>*/}
            {/*  <Filter size={14}/>*/}
            {/*  <div className={'text-xs text-gray-600 whitespace-nowrap'}>筛选</div>*/}
            {/*</div>*/}
          </>
        }
      >
        <span>发现</span>
      </NavBar>
      {list && (
        <>
        </>
      )}
    </>
  )
}
export default Find