--预存款部分页面完成

src/app.config.ts

@@ -128,6 +128,24 @@ export default {
       pages: [
         "index"
       ]
+    },
+    {
+      root: "pages/depositBeforehandDetail",
+      pages: [
+        "index"
+      ]
+    },
+    {
+      root: "pages/depositBeforehand",
+      pages: [
+        "index"
+      ]
+    },
+    {
+      root: "pages/depositList",
+      pages: [
+        "index"
+      ]
     }
   ]
 }

src/components/InfiniteScrollPaging/index.module.scss

@@ -0,0 +1,21 @@
+
+.scroll_main{
+    height: 100%;
+    .infinite_scroll{
+        font-size: $font_size_medium;
+        color: $color_font_two;
+        width: 100%;
+        display: flex;
+        justify-content: center;
+        .loading_more{
+            display: flex;
+            align-items: center;
+        }
+        .noMore{
+            padding-top: 20px;
+        }
+    }
+    .scrollViewCon {
+        // height: 100%;
+    }
+}

src/components/InfiniteScrollPaging/index.tsx

@@ -0,0 +1,124 @@
+
+import InfiniteScroll from "@/components/infiniteScroll"
+import { ReactNode, useEffect, useMemo, useRef, useState } from "react"
+import { dataLoadingStatus, getFilterData } from "@/common/util";
+import { isEmptyObject } from "@/common/common";
+
+interface Params{
+    children?: ReactNode,
+    query?: object,
+    fetchData: (data: object)=>any,
+    change?: (data: any)=>void
+}
+
+export default (props: Params)=>{
+	const { query={} } = props;
+  useEffect(()=>{
+    refreshDataRef.current = refreshData;
+    dataRef.current = data;
+    getData({moreStatus: true},{moreStatus: true});
+  }, [])
+	useEffect(()=>{
+		if(!isEmptyObject(query)){
+			setData({list: [],total: 0});
+			getData({moreStatus: true},{moreStatus: true});
+		}
+	},[query])
+  const getData = async (startStatus, endStatus)=>{
+    const tRefreshDataRef = refreshDataRef.current as any;
+    setRefreshData({
+      ...tRefreshDataRef,
+      ...startStatus,
+			loading: true
+    })
+    const result = await props.fetchData({
+			...query,
+      page: tRefreshDataRef.page,
+      size: tRefreshDataRef.size,
+    });
+    // 返回数据
+    props.change&&props.change(result);
+    if(result.success){
+      if(result.data.total<=0){
+        setRefreshData({
+          ...tRefreshDataRef,
+          ...endStatus,
+					loading: false
+        })
+      }else{
+        setData({
+          list: result.data.list,
+          // list: tRefreshDataRef.page>1?(dataRef.current as any).list.concat(result.data.list):result.data.list,
+          total: result.data.total
+        })
+        setRefreshData({
+          ...tRefreshDataRef,
+          refreshStatus: false,
+          moreStatus: false,
+					loading: false
+        })
+      }
+    }else{
+			setRefreshData({
+				...tRefreshDataRef,
+				refreshStatus: false,
+				moreStatus: true,
+				loading: false
+			})
+		}
+  }
+  // 加载刷新数据
+  const [refreshData, setRefreshData] = useState({
+    refreshStatus: false,
+    moreStatus: false,
+    page: 1,
+    size: 10,
+		loading: false
+  })
+  const refreshDataRef = useRef({});
+  // 渲染（数据）
+  const [data, setData] = useState({
+    list: [],
+    total: 0
+  });
+  const dataRef = useRef({});
+  // 下拉刷新
+  const handleRefresh = async ()=>{
+    let tRefreshData = refreshDataRef.current as any;
+    setRefreshData({
+      ...tRefreshData,
+      page: 1,
+      size: 10,
+    })
+    getData({refreshStatus: true,moreStatus: false},{refreshStatus: false,moreStatus: true});
+  }
+  // 加载更多
+  const handleMoreLoad = async ()=>{
+    let t = (dataRef.current as any);
+    let tRefreshData = refreshDataRef.current as any;
+    if(t.list.length<t.total){
+      setRefreshData({
+        ...tRefreshData,
+        page: ++tRefreshData.page,
+        size: ++tRefreshData.page*tRefreshData.size,
+      })
+      getData({
+        moreStatus: true
+      },{
+        moreStatus: true
+      });
+    }
+  }
+  //数据加载状态
+  const statusMore = useMemo(() => {
+    return dataLoadingStatus({list:data.list, total: data.total, status: refreshData.loading})
+  }, [refreshData.loading])
+  
+
+  return (
+    <InfiniteScroll refresherEnabled={true} refresherTriggered={refreshData.refreshStatus} moreStatus={refreshData.moreStatus} 
+    selfOnRefresherRefresh={handleRefresh} selfonScrollToLower={handleMoreLoad} statusMore={statusMore}>
+        {props.children}
+    </InfiniteScroll>
+  )
+}

src/pages/creditLine/index.tsx

@@ -6,6 +6,7 @@ import { useEffect, useState } from "react"
 import {creditInfoApi} from "@/api/creditLine"
 import "./index.scss"
 import { useSelector } from "@/reducers/hooks";
+import { formatPriceDiv } from "@/common/fotmat"
 
 export default ()=>{
   
@@ -24,10 +25,11 @@ export default ()=>{
   // 获取数据
   const getData = async ()=>{
     const result = await fetchData();
-    const progress = result.data.credit_quota_used_line / result.data.credit_quota_line * 100;
+    const credit_quota_used_line = convertPrice(formatPriceDiv(result.data.credit_quota_used_line));
-    const credit_quota_used_line = convertPrice(result.data.credit_quota_used_line);
+    const credit_quota_line = convertPrice(formatPriceDiv(result.data.credit_quota_line));
-    const credit_quota_line = convertPrice(result.data.credit_quota_line);
+    const credit_quota_available_line = convertPrice(formatPriceDiv(result.data.credit_quota_available_line));
-    const credit_quota_available_line = convertPrice(result.data.credit_quota_available_line);
+    const progress = credit_quota_line[0] / credit_quota_available_line[0] * 100;
+    
     setData({
       ...result.data,
       progress,
@@ -53,8 +55,8 @@ export default ()=>{
         <View className="credit-line-card-top">
           <View><Progress progress={data.progress} /></View>
           <View className="credit-line-card-top-info">
-            <View className="credit-line-card-top-info-title">已用额度</View>
+            <View className="credit-line-card-top-info-title">可用额度</View>
-            <View className="credit-line-card-top-info-price"><Text>¥</Text>{data?.credit_quota_used_line[0]}<Text>.{data.credit_quota_used_line[1]}</Text></View>
+            <View className="credit-line-card-top-info-price"><Text>¥</Text>{data.credit_quota_available_line[0]}<Text>.{data.credit_quota_available_line[1]}</Text></View>
             <View className="credit-line-card-top-info-date">有效期: {data.create_time} 2022-03-09至2022-05-13</View>
           </View>
         </View>
@@ -69,9 +71,9 @@ export default ()=>{
           <View className="credit-line-card-bottom-item">
             <View className="credit-line-card-bottom-item-title">
               <Text className="iconfont icon-tick-pressed"></Text>
-              <View>可用额度</View>
+              <View>已用额度</View>
             </View>
-            <View className="credit-line-card-bottom-item-price"><Text>¥</Text>{data.credit_quota_available_line[0]}<Text>.{data.credit_quota_available_line[1]}</Text></View>
+            <View className="credit-line-card-bottom-item-price"><Text>¥</Text>{data?.credit_quota_used_line[0]}<Text>.{data.credit_quota_used_line[1]}</Text></View>
           </View>
         </View>
       </View>

src/pages/creditUsed/index.tsx

@@ -1,68 +1,40 @@
-
+import InfiniteScrollPaging from "@/components/InfiniteScrollPaging"
-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 { useCallback, useEffect, useMemo, useRef, useState } from "react"
 import {creditListApi} from "@/api/creditLine"
 import "./index.scss"
+import { formatDateTime } from "@/common/fotmat"
+import { dataLoadingStatus, getFilterData } from "@/common/util";
 
 export default ()=>{
-  useEffect(()=>{
-    getData();
-  }, [])
   const {fetchData, state} = creditListApi();
-  const data = Array.from({length: 10});
+  // 渲染（数据）
-  const getData = async ()=>{
+  const [data, setData] = useState({
-    fetchData();
+    list: [],
-  }
+    total: 0
-  // 刷新
+  });
-  const [refreshData, setRefreshData] = useState({
+  const handleChange = useCallback((result)=>{
-    refreshStatus: false,
+    setData({
-    moreStatus: false
+      list: result.data.list,
-  })
+      total: result.data.total
-  const handleRefresh = async ()=>{
-    setRefreshData({
-      ...refreshData,
-      refreshStatus: true
     })
-    
+  }, [])
-
-    setTimeout(()=>{
-      setRefreshData({
-        ...refreshData,
-        moreStatus: false
-      })
-    }, 3000)
-  }
-  const handleMoreLoad = async ()=>{
-    setRefreshData({
-      ...refreshData,
-      moreStatus: true
-    })
-
-    setTimeout(()=>{
-      setRefreshData({
-        ...refreshData,
-        refreshStatus: false
-      })
-    },3000)
-  }
 
   return (
     <View className="credit-used">
-      <InfiniteScroll refresherEnabled={true} refresherTriggered={refreshData.refreshStatus} moreStatus={refreshData.moreStatus} selfOnRefresherRefresh={handleRefresh} selfonScrollToLower={handleMoreLoad}>
+      <InfiniteScrollPaging fetchData={fetchData} change={handleChange}>
         {
-          data.map((item,index)=>{
+          (data as any)?.list?.map((item,index)=>{
             return (
               <View key={index} className="credit-used-list">
                 <View className="credit-used-list-top">
                   <View className="credit-used-list-type">下单</View>
-                  <View className={`credit-used-list-price ${index%2==0?'green':'red'}`}>-999,999.00</View>
+                  <View className={`credit-used-list-price ${item.amount>0?'green':item.amount<0?'red':''}`}>{item.amount.toLocaleString()}</View>
                 </View>
                 <View className="credit-used-list-bottom">
-                  <View className="credit-used-list-date">2022-04-24 16:10:11</View>
+                  <View className="credit-used-list-date">{formatDateTime(item.order_pay_time)}</View>
-                  <View className="credit-used-list-orderno">订单号：LY2278204399678</View>
+                  <View className="credit-used-list-orderno">订单号：{item.order_no}</View>
                 </View>
               </View>
             )
@@ -70,7 +42,129 @@ export default ()=>{
         }
         {/* {data.length>0&&<View className="credit-used-list"></View>} */}
         <View className="credit-used-list"></View>
-      </InfiniteScroll>
+      </InfiniteScrollPaging>
     </View>
   )
 }
+
+// export default ()=>{
+//   useEffect(()=>{
+//     refreshDataRef.current = refreshData;
+//     dataRef.current = data;
+//     getData({
+//       moreStatus: true
+//     },{
+//       moreStatus: true
+//     });
+//   }, [])
+//   const {fetchData, state} = creditListApi();
+//   const getData = async (startStatus, endStatus)=>{
+//     const tRefreshDataRef = refreshDataRef.current as any;
+//     setRefreshData({
+//       ...tRefreshDataRef,
+//       ...startStatus
+//     })
+//     const result = await fetchData({
+//       page: tRefreshDataRef.page,
+//       size: tRefreshDataRef.size,
+//     });
+//     if(result.success){
+//       if(result.data.total<=0){
+//         setRefreshData({
+//           ...tRefreshDataRef,
+//           ...endStatus
+//         })
+//       }else{
+//         setData({
+//           list: result.data.list,
+//           // list: tRefreshDataRef.page>1?(dataRef.current as any).list.concat(result.data.list):result.data.list,
+//           total: result.data.total
+//         })
+//         setRefreshData({
+//           ...tRefreshDataRef,
+//           refreshStatus: false,
+//           moreStatus: false
+//         })
+//       }
+//     }
+//   }
+//   // 加载刷新数据
+//   const [refreshData, setRefreshData] = useState({
+//     refreshStatus: false,
+//     moreStatus: false,
+//     page: 1,
+//     size: 10
+//   })
+//   const refreshDataRef = useRef({});
+//   // 渲染（数据）
+//   const [data, setData] = useState({
+//     list: [],
+//     total: 0
+//   });
+//   const dataRef = useRef({});
+//   // 下拉刷新
+//   const handleRefresh = async ()=>{
+//     let tRefreshData = refreshDataRef.current as any;
+//     setRefreshData({
+//       ...tRefreshData,
+//       page: 1,
+//       size: 10,
+//     })
+//     getData({
+//       refreshStatus: true,
+//       moreStatus: false
+//     },{
+//       refreshStatus: false,
+//       moreStatus: true
+//     });
+//   }
+//   // 加载更多
+//   const handleMoreLoad = async ()=>{
+//     let t = (dataRef.current as any);
+//     let tRefreshData = refreshDataRef.current as any;
+//     if(t.list.length<t.total){
+//       setRefreshData({
+//         ...tRefreshData,
+//         page: ++tRefreshData.page,
+//         size: ++tRefreshData.page*tRefreshData.size,
+//       })
+//       getData({
+//         moreStatus: true
+//       },{
+//         moreStatus: true
+//       });
+//     }
+//   }
+//   //数据加载状态
+//   const statusMore = useMemo(() => {
+    
+//     return dataLoadingStatus({list:data.list, total: data.total, status: refreshData.moreStatus})
+//   }, [data])
+  
+
+//   return (
+//     <View className="credit-used">
+//       <InfiniteScroll refresherEnabled={true} refresherTriggered={refreshData.refreshStatus} moreStatus={refreshData.moreStatus} 
+//       selfOnRefresherRefresh={handleRefresh} selfonScrollToLower={handleMoreLoad} statusMore={statusMore}>
+//         {
+//           (data as any)?.list?.map((item,index)=>{
+//             return (
+//               <View key={index} className="credit-used-list">
+//                 <View className="credit-used-list-top">
+//                   <View className="credit-used-list-type">下单</View>
+//                   <View className={`credit-used-list-price ${item.amount>0?'green':item.amount<0?'red':''}`}>{item.amount.toLocaleString()}</View>
+//                 </View>
+//                 <View className="credit-used-list-bottom">
+//                   <View className="credit-used-list-date">{formatDateTime(item.order_pay_time)}</View>
+//                   <View className="credit-used-list-orderno">订单号：{item.order_no}</View>
+//                 </View>
+//               </View>
+//             )
+//           })
+//         }
+//         {/* {data.length>0&&<View className="credit-used-list"></View>} */}
+//         <View className="credit-used-list"></View>
+//       </InfiniteScroll>
+//     </View>
+//   )
+// }

src/pages/depositBeforehand/index.config.ts

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '预存款'
+}

src/pages/depositBeforehand/index.scss

@@ -0,0 +1,87 @@
+.deposit-beforehand{
+  height: 100vh;
+  background-color: #f3f3f3;
+  display: flex;
+  flex-direction: column;
+  .deposit-beforehand-card{
+    width: 702px;
+    background: #ffffff;
+    border-radius: 20px;
+    margin: 30px auto;
+    padding: 30px;
+    box-sizing: border-box;
+  }
+  .deposit-beforehand-balance{
+    display: flex;flex-direction: column;align-items: center;
+  }
+  .deposit-beforehand-balance-title{
+    font-size: 28px;
+    font-weight: 400;
+    color: #000000;
+    margin-bottom: 35px;
+  }
+  .deposit-beforehand-balance-price{
+    font-size: 40px;
+    font-weight: 700;
+    color: #000000;
+    margin-bottom: 70px;
+  }
+  .deposit-beforehand-balance-button{
+    width: 276px;
+    height: 74px;
+    background: #007aff;
+    border-radius: 38px;
+    display: flex;align-items: center;justify-content: center;
+    color: white;
+    margin-bottom: 10px;
+  }
+
+  .deposit-beforehand-info-title{
+    display: flex;justify-content: space-between;
+    margin-bottom: 50px;
+  }
+  .deposit-beforehand-info-title-left{
+    font-size: 28px;
+    font-weight: 700;
+    color: #000000;
+  }
+  .deposit-beforehand-info-title-copy{
+    font-size: 24px;
+    font-weight: 400;
+    color: #007aff;
+  }
+  .deposit-beforehand-info-list{
+    display: flex;align-items: center;
+    line-height: 60px;
+  }
+  .deposit-beforehand-info-list-left{
+    width: 160px;
+    font-size: 24px;
+    font-weight: 400;
+    color: #3c3c3c;
+    border-right: 1px solid #dddddd;
+    margin-right: 25px;
+  }
+  .deposit-beforehand-info-list-right{
+    font-size: 26px;
+    font-weight: 400;
+    color: #000000;
+  }
+
+  .deposit-beforehand-particulars{
+    display: flex;align-items: center;justify-content: space-between;
+  }
+  .deposit-beforehand-particulars-left{
+    font-size: 28px;
+    font-weight: 700;
+    color: #000000;
+  }
+  .deposit-beforehand-particulars-right{
+    font-size: 24px;
+    font-weight: 400;
+    color: #ababab;
+  }
+  .deposit-beforehand-particulars-right text{
+    font-size: 28px;
+  }
+}

src/pages/depositBeforehand/index.tsx

@@ -0,0 +1,49 @@
+
+
+import { Button, Canvas, Navigator, ScrollView, Text, View } from "@tarojs/components"
+import "./index.scss"
+
+export default ()=>{
+
+  return (
+    <View className="deposit-beforehand">
+      <View className="deposit-beforehand-card">
+        <View className="deposit-beforehand-balance">
+          <View className="deposit-beforehand-balance-title">余额 (元)</View>
+          <Text className="deposit-beforehand-balance-price">999,999.20</Text>
+          <View className="deposit-beforehand-balance-button">转出</View>
+        </View>
+      </View>
+      <View className="deposit-beforehand-card">
+        <View className="deposit-beforehand-info">
+          <View className="deposit-beforehand-info-title">
+            <View className="deposit-beforehand-info-title-left"><Text></Text> 预存款充值</View>
+            <View className="deposit-beforehand-info-title-copy">复制</View>
+          </View>
+          <View className="deposit-beforehand-info-content">
+            <View className="deposit-beforehand-info-list">
+              <View className="deposit-beforehand-info-list-left">开户名称</View>
+              <View className="deposit-beforehand-info-list-right">佛山市浩川盛世科技有限公司</View>
+            </View>
+            <View className="deposit-beforehand-info-list">
+              <View className="deposit-beforehand-info-list-left">开户银行</View>
+              <View className="deposit-beforehand-info-list-right">招商银行汾江支行</View>
+            </View>
+            <View className="deposit-beforehand-info-list">
+              <View className="deposit-beforehand-info-list-left">专属汇款账号</View>
+              <View className="deposit-beforehand-info-list-right">62062342120001221231212</View>
+            </View>
+          </View>
+        </View>
+      </View>
+      <View className="deposit-beforehand-card">
+        <View className="deposit-beforehand-particulars">
+          <View className="deposit-beforehand-particulars-left">收支明细</View>
+          <Navigator hoverClass="none" url="/pages/depositList/index" className="deposit-beforehand-particulars-right">
+            全部 <Text className="iconfont icon-a-moreback"></Text>
+          </Navigator>
+        </View>
+      </View>
+    </View>
+  )
+}

src/pages/depositBeforehandDetail/index.config.ts

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '交易详情'
+}

src/pages/depositBeforehandDetail/index.scss

@@ -0,0 +1,41 @@
+.deposit-detail{
+  // height: 100vh;
+  // background-color: #f3f3f3;
+  .deposit-timeline{
+
+  }
+  .deposit-timeline-item{
+    display: flex;
+    margin-left: 50px;
+  }
+  .deposit-timeline-item-title{
+    font-size: 24px;
+    font-weight: 400;
+    color: #3c3c3c;
+  }
+  .deposit-timeline-item-date{
+    font-size: 24px;
+    font-weight: 400;
+    color: #ababab;
+    margin-bottom: 55px;
+  }
+  .deposit-timeline-item-left{
+    position: relative;
+    margin-right: 55px;
+  }
+  .deposit-timeline-item-left::before{
+    content: " ";
+    width: 12px;
+    height: 12px;
+    background: #007aff;
+    border-radius: 50%;
+    display: block;
+    margin-top: 10px;
+  }
+  .deposit-timeline-item-left::after{
+    content: " ";
+    border-right: 1px dashed #007aff;
+    position: absolute;top: 25px;bottom: -8px;
+    left: 50%;transform: translateX(-50%);
+  }
+}

src/pages/depositBeforehandDetail/index.tsx

@@ -0,0 +1,37 @@
+
+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 ()=>{
+
+  return (
+    <View className="deposit-detail">
+      <TimeLine/>
+    </View>
+  )
+}
+
+const TimeLine = ()=>{
+  return(
+  <View className="deposit-timeline">
+    <View className="deposit-timeline-item">
+      <View className="deposit-timeline-item-left"></View>
+      <View className="deposit-timeline-item-right">
+        <View className="deposit-timeline-item-title">申请提交</View>
+        <View className="deposit-timeline-item-date">2022-04-24 16:10:11</View>
+      </View>
+    </View>
+    <View className="deposit-timeline-item">
+      <View className="deposit-timeline-item-left"></View>
+      <View className="deposit-timeline-item-right">
+        <View className="deposit-timeline-item-title">申请提交</View>
+        <View className="deposit-timeline-item-date">2022-04-24 16:10:11</View>
+      </View>
+    </View>
+  </View>)
+}

src/pages/depositList/index.config.ts

@@ -0,0 +1,3 @@
+export default {
+  navigationBarTitleText: '收支明细'
+}

src/pages/depositList/index.scss

@@ -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;
+  }
+}

src/pages/depositList/index.tsx

@@ -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>
+  )
+}