--预存款部分页面完成

This commit is contained in:
li tong bao
2022-06-01 20:33:47 +08:00
parent 83f7bdac14
commit d725e5d01b
14 changed files with 667 additions and 56 deletions
+3
View File
@@ -0,0 +1,3 @@
export default {
navigationBarTitleText: '收支明细'
}
+47
View File
@@ -0,0 +1,47 @@
.credit-used{
height: 100vh;
background-color: #f3f3f3;
.credit-used-list{
background-color: white;
padding: 30px 25px;
border-bottom: 1px solid #f6f6f6;
display: flex;justify-content: space-between;
}
.credit-used-list-left{
}
.credit-used-list-type{
font-size: 26px;
font-weight: 400;
color: #000000;
margin-bottom: 20px;
}
.credit-used-list-price{
font-size: 28px;
font-weight: 400;
margin-bottom: 20px;
}
.credit-used-list-right{
display: flex;align-items: center;
text-align: right;
}
.credit-used-list-right text{
font-size: 30px;
margin-left: 10px;
}
.credit-used-list-date{
font-size: 24px;
font-weight: 400;
color: #ababab;
}
.credit-used-list-orderno{
font-size: 20px;
font-weight: 400;
color: #ababab;
}
.green{
color: #07C160;
}
.red{
color: #FF0000;
}
}
+82
View File
@@ -0,0 +1,82 @@
import AddressList from "@/components/AddressList"
import InfiniteScroll from "@/components/infiniteScroll"
import { Button, Canvas, ScrollView, Text, View } from "@tarojs/components"
import Taro, { useReady } from "@tarojs/taro"
import { useEffect, useState } from "react"
import {creditListApi} from "@/api/creditLine"
import "./index.scss"
export default ()=>{
useEffect(()=>{
getData();
}, [])
const {fetchData, state} = creditListApi();
const data = Array.from({length: 10});
const getData = async ()=>{
fetchData();
}
// 刷新
const [refreshData, setRefreshData] = useState({
refreshStatus: false,
moreStatus: false,
statusMore: 1
})
const handleRefresh = async ()=>{
setRefreshData({
...refreshData,
refreshStatus: true
})
setTimeout(()=>{
setRefreshData({
...refreshData,
refreshStatus: false
})
}, 3000)
}
const handleMoreLoad = async ()=>{
setRefreshData({
...refreshData,
moreStatus: true
})
// setTimeout(()=>{
// setRefreshData({
// ...refreshData,
// moreStatus: false
// })
// },3000)
}
return (
<View className="credit-used">
<InfiniteScroll refresherEnabled={true} refresherTriggered={refreshData.refreshStatus} moreStatus={refreshData.moreStatus}
selfOnRefresherRefresh={handleRefresh} selfonScrollToLower={handleMoreLoad} statusMore={refreshData.statusMore as any}>
{
data.map((item,index)=>{
return (
<View key={index} className="credit-used-list">
<View className="credit-used-list-left">
<View className="credit-used-list-type">下单</View>
<View className="credit-used-list-date">2022-04-24 16:10:11</View>
</View>
<View className="credit-used-list-right">
<View>
<View className={`credit-used-list-price ${index%2==0?'green':'red'}`}>-999,999.00</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>
</InfiniteScroll>
</View>
)
}