xuan/TestEShopDist
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

--预存款部分完成

Browse Source
This commit is contained in:
li tong bao
2022-06-06 16:20:03 +08:00
parent d725e5d01b
commit 0114259106
21 changed files with 401 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/depositBeforehandDetail/index.config.ts
+2 -1
View File
@@ -1,3 +1,4 @@
export default {
navigationBarTitleText: '交易详情'
navigationBarTitleText: '交易详情',
enableShareAppMessage: true,
}
src/pages/depositBeforehandDetail/index.scss
+116 -1
View File
@@ -1,12 +1,108 @@
.deposit-detail{
// height: 100vh;
// background-color: #f3f3f3;
.deposit-detail-tips{
width: 100%;
height: 66px;
background: #FFE6CE;
border: 2px solid #ffe6ce;
padding: 0 30px;
display: flex;align-items: center;
font-size: 24px;
font-weight: 400;
color: #EE7500;
margin: 0;
}
.deposit-detail-tips text{
margin-right: 10px;
font-size: 30px;
}
&>view{
padding: 30px 0;
margin: 0 25px;
border-bottom: 1px solid #F6F6F6;
}
&>view:last-child{
border-bottom: 0;
}
.deposit-amount{
text-align: center;
}
.deposit-type{
font-size: 28px;
font-weight: 400;
color: #000000;
margin-bottom: 35px;
}
.deposit-price{
font-size: 40px;
font-weight: 700;
color: #000000;
}
.deposit-status{
display: flex;
}
.deposit-status-title{
font-size: 24px;
font-weight: 400;
color: #707070;
margin-right: 105px;
}
.deposit-voucher-title{
font-size: 24px;
font-weight: 400;
color: #707070;
margin-bottom: 28px;
}
.deposit-voucher-title::before{
content: "*";
color: #007AFF;
}
.deposit-voucher-content{
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 30px;
height: 98px;
}
.deposit-voucher-content image{
width: 100%;
height: 100%;
object-fit: cover;
}
.deposit-info-list{
display: flex;
margin-bottom: 20px;
}
.deposit-info-list-title{
width: 140px;
font-size: 24px;
font-weight: 400;
color: #707070;
border-right: 1px solid #F0F0F0;
}
.deposit-info-list-content{
width: 468px;
font-size: 24px;
font-weight: 400;
color: #000000;
padding-left: 25px;
box-sizing: border-box;
}
.deposit-info-list-copy{
font-size: 20px;
font-weight: 400;
color: #ababab;
padding-left: 18px;
border-left: 1px solid #F0F0F0;
}
.deposit-timeline{
}
.deposit-timeline-item{
display: flex;
margin-left: 50px;
height: 100px;
}
.deposit-timeline-item-title{
font-size: 24px;
@@ -17,11 +113,11 @@
font-size: 24px;
font-weight: 400;
color: #ababab;
margin-bottom: 55px;
}
.deposit-timeline-item-left{
position: relative;
margin-right: 55px;
width: 12px;
}
.deposit-timeline-item-left::before{
content: " ";
@@ -38,4 +134,23 @@
position: absolute;top: 25px;bottom: -8px;
left: 50%;transform: translateX(-50%);
}
.deposit-timeline-item-success,.deposit-timeline-item-error{
position: relative;
margin-right: 55px;
width: 12px;
}
.deposit-timeline-item-error Text,.deposit-timeline-item-success Text{
display: inline-block;
width: 38px;
height: 38px;
background: #007aff;
border-radius: 50%;
position: absolute;left: 50%;transform: translateX(-50%);
color: white;
font-size: 30px;
display: flex;align-items: center;justify-content: center;
}
.deposit-timeline-item-error Text{
background: #cccccc;
}
}
src/pages/depositBeforehandDetail/index.tsx
+51 -2
View File
@@ -1,7 +1,7 @@
import AddressList from "@/components/AddressList"
import InfiniteScroll from "@/components/infiniteScroll"
import { Button, Canvas, ScrollView, Text, View } from "@tarojs/components"
import { Button, Canvas, Image, ScrollView, Text, View } from "@tarojs/components"
import Taro, { useReady } from "@tarojs/taro"
import { useEffect, useState } from "react"
import {creditListApi} from "@/api/creditLine"
@@ -11,7 +11,48 @@ export default ()=>{
return (
<View className="deposit-detail">
<TimeLine/>
<View className="deposit-detail-tips">
<Text className="iconfont icon-zhuyi"></Text> 转入失败原因：付款凭证与实际转入信息不符，请重新上传。
</View>
<View className="deposit-amount">
<View className="deposit-type">转入 (元)</View>
<View className="deposit-price">999,999.20</View>
</View>
<View className="deposit-status">
<View className="deposit-status-title">状态</View>
<TimeLine/>
</View>
<View className="deposit-voucher">
<View className="deposit-voucher-title">付款凭证</View>
<View className="deposit-voucher-content">
<Image src="https://seopic.699pic.com/photo/40216/8643.jpg_wh1200.jpg"/>
<Image src="https://seopic.699pic.com/photo/40216/8643.jpg_wh1200.jpg"/>
</View>
</View>
<View className="deposit-info">
<View className="deposit-info-list">
<View className="deposit-info-list-title">银行流水号</View>
<View className="deposit-info-list-content">2278204399678121212121288</View>
<View className="deposit-info-list-copy">复制</View>
</View>
<View className="deposit-info-list">
<View className="deposit-info-list-title">付款人</View>
<View className="deposit-info-list-content">带生</View>
</View>
<View className="deposit-info-list">
<View className="deposit-info-list-title">付款账号</View>
<View className="deposit-info-list-content">带生</View>
<View className="deposit-info-list-copy">复制</View>
</View>
<View className="deposit-info-list">
<View className="deposit-info-list-title">联系方式</View>
<View className="deposit-info-list-content">带生</View>
</View>
<View className="deposit-info-list">
<View className="deposit-info-list-title">备注信息</View>
<View className="deposit-info-list-content">带生</View>
</View>
</View>
</View>
)
}
@@ -28,6 +69,14 @@ const TimeLine = ()=>{
</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>
</View>
<View className="deposit-timeline-item">
<View className="deposit-timeline-item-success">
<Text className="iconfont icon-tick" />
</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>