import AddressList from "@/components/AddressList"
import InfiniteScrollPaging from "@/components/InfiniteScrollPaging"
import { Button, Canvas, ScrollView, Text, View } from "@tarojs/components"
import Taro, { useReady } from "@tarojs/taro"
import { useCallback, useEffect, useState } from "react"
import { depositListApi } from "@/api/deposit"
import "./index.scss"
import { formatDateTime, formatPriceDiv } from "@/common/fotmat"

export default ()=>{
  const {fetchData, state} = depositListApi();
  // 渲染（数据）
  const [data, setData] = useState({
    list: [],
    total: 0
  });
  // 数据更新
  const handleChange = useCallback((result)=>{
    setData({
      list: result.data.list,
      total: result.data.total
    })
  }, [])

  return (
    <View className="credit-used">
      <InfiniteScrollPaging fetchData={fetchData} change={handleChange}>
        {
          data.list?.map((item,index)=>{
            return (
              <View key={index} className="credit-used-list">
                <View className="credit-used-list-left">
                  <View className="credit-used-list-type">{(item as any).type_name}</View>
                  <View className="credit-used-list-date">{formatDateTime((item as any).create_time)}</View>

                </View>
                <View className="credit-used-list-right">
                  <View className="credit-used-list-right-price">
                    <View className={`credit-used-list-price ${[1,2,3].includes((item as any).type as never)?'red':'green'}`}>
                      {[1,2,3].includes((item as any).type as never)?"+":"-"}{formatPriceDiv((item as any).amount_received_this_time)}
                    </View>
                    {/* <View className="credit-used-list-orderno">处理中</View> */}
                  </View>
                  <Text className="iconfont icon-a-moreback"></Text>
                </View>
              </View>
            )
          })
        }
        {/* {data.length>0&&<View className="credit-used-list"></View>} */}
        <View className="credit-used-list"></View>
      </InfiniteScrollPaging>
    </View>
  )
}