|
@@ -2,56 +2,78 @@
|
|
|
<view>
|
|
|
<ujp-navbar title="我的余额">
|
|
|
<view class="slot-wrap">
|
|
|
- <span class="navBtn oldTextjp2" oldstyle="font-size: 16px;" @click="toRefundList">退余额</span>
|
|
|
+ <span class="navBtn oldTextjp222" oldstyle="font-size: 16px;" @click="toRefundList">退余额</span>
|
|
|
</view>
|
|
|
</ujp-navbar>
|
|
|
+
|
|
|
+ <u-modal v-model="show" :confirm-text="confirmText" confirm-color="#00B962">
|
|
|
+ <view class="slot-content">
|
|
|
+ <rich-text :nodes="content"></rich-text>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
+ <u-modal v-model="show2" :confirm-text="confirmText" confirm-color="#00B962">
|
|
|
+ <view class="slot-content">
|
|
|
+ <rich-text :nodes="content2"></rich-text>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
<view class="balance">
|
|
|
<view class="balanceHead">
|
|
|
<view class="balanceCard">
|
|
|
<view class="balanceCard-head">
|
|
|
- <font>总金额</font><u-icon name="question-line" custom-prefix="custom-icon" color="#fff" size="32" @click="show=true"></u-icon>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <u-modal v-model="show" :confirm-text="confirmText" confirm-color="#00B962">
|
|
|
- <view class="slot-content">
|
|
|
- <rich-text :nodes="content"></rich-text>
|
|
|
+ <view class="balanceCard-head-item">
|
|
|
+ <view>
|
|
|
+ 总金额(元)<u-icon name="question-line" custom-prefix="custom-icon" color="#fff" size="36" @click="show=true"></u-icon>
|
|
|
+ </view>
|
|
|
+ <view class="h2" v-if="personAccount.availableAmount != null">{{personAccount.availableAmount.toFixed(2)}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="balanceCard-head-item" v-if="personAccount.chargingFunds" >
|
|
|
+ <view>
|
|
|
+ 充电金(元)<u-icon name="question-line" custom-prefix="custom-icon" color="#fff" size="36" @click="show2=true"></u-icon>
|
|
|
</view>
|
|
|
- </u-modal>
|
|
|
+
|
|
|
+ <view class="h2" v-if="personAccount.chargingFunds != null">{{personAccount.chargingFunds.toFixed(2)}}</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="balanceCard-main oldTextjp2" oldstyle="font-size: 16px;">
|
|
|
+
|
|
|
+ <!-- <view class="balanceCard-main oldTextjp222" oldstyle="font-size: 16px;">
|
|
|
<h2 v-if="personAccount.availableAmount != null">{{personAccount.availableAmount.toFixed(2)}}元</h2>
|
|
|
<view class="balanceCard-btn" @click="rechargeNow">立即充值</view>
|
|
|
+ </view> -->
|
|
|
+ <view class="balanceCard-foot oldTextjp222" oldstyle="font-size: 16px;">
|
|
|
+ <view class="balanceCard-item" v-if="personAccount.availableAmount != null">可用余额{{personAccount.availableAmount.toFixed(2)}}</view>
|
|
|
+ <view class="balanceCard-item" v-if="personAccount.frozenTotal != null">冻结金额{{personAccount.frozenTotal.toFixed(2)}}</view>
|
|
|
</view>
|
|
|
- <view class="balanceCard-foot oldTextjp2" oldstyle="font-size: 16px;">
|
|
|
- <view class="balanceCard-item" v-if="personAccount.availableAmount != null">可用余额{{personAccount.availableAmount.toFixed(2)}}元</view>
|
|
|
- <view class="balanceCard-item" v-if="personAccount.frozenTotal != null">冻结金额{{personAccount.frozenTotal.toFixed(2)}}元</view>
|
|
|
- </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="new-balanceCard-foot" @click="rechargeNow">
|
|
|
+ 立即充值
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="balanceMain">
|
|
|
<view class="balanceMain-title">
|
|
|
<view class="title">
|
|
|
<u-icon name="todo-fill" custom-prefix="custom-icon" color="#6BC6A7" size="40"></u-icon>
|
|
|
- <span class="oldTextjp" oldstyle="font-size: 20px;">充值明细</span>
|
|
|
+ <span class="oldTextjp222" oldstyle="font-size: 20px;">充值明细</span>
|
|
|
</view>
|
|
|
- <view class="more oldTextjp2" oldstyle="font-size: 16px;" @click="seeAll">
|
|
|
+ <view class="more oldTextjp222" oldstyle="font-size: 16px;" @click="seeAll">
|
|
|
<span>查看全部</span>
|
|
|
<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="32"></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="balanceMain-list" v-if="accountList.length > 0">
|
|
|
- <view class="balanceMain-item" v-for="(item,index) in accountList" :key="item.id" @click="gotoUrl('pages/user/finance/rechargeDet?id=' + item.id)">
|
|
|
+ <view class="balanceMain-item" v-for="(item,index) in accountList " :key="item.id" @click="gotoUrl('pages/user/finance/rechargeDet?type='+item.type+'&id=' + item.id)">
|
|
|
<view class="title">
|
|
|
- <font class="oldTextjp2" oldstyle="font-size: 18px;">{{item.payNameStr}}</font>
|
|
|
- <p class="oldTextjp2" oldstyle="font-size: 14px;">{{item.createTime}}</p>
|
|
|
+ <font class="oldTextjp222" oldstyle="font-size: 18px;">{{item.remark}}</font>
|
|
|
+ <p class="oldTextjp222" oldstyle="font-size: 14px;">{{item.createTime}}</p>
|
|
|
</view>
|
|
|
- <h4 class="oldTextjp2" oldstyle="font-size: 24px;">{{item.amount.toFixed(2)}}元</h4>
|
|
|
+ <h4 class="oldTextjp222" oldstyle="font-size: 24px;">{{item.amount?item.amount.toFixed(2):0}}元</h4>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="carNone" v-if="accountList.length == 0">
|
|
|
<img src="static/img/暂无数据-缺省页.png" alt="">
|
|
|
- <p class="oldTextjp2" oldstyle="font-size: 18px;">本月暂无充值记录</p>
|
|
|
+ <p class="oldTextjp222" oldstyle="font-size: 18px;">本月暂无充值记录</p>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -67,8 +89,10 @@
|
|
|
dateMonth: '',
|
|
|
userId: '',
|
|
|
show: false,
|
|
|
+ show2: false,
|
|
|
confirmText: '知道了',
|
|
|
content: `总金额=可用余额+冻结金额。使用预付费充电时,在充电过程中会冻结部分金额,充电完成后将剩余金额返还至余额账户,每笔预充金额的冻结时间不超过96小时。`,
|
|
|
+ content2:"充电金:只可用于平台内所有自营站充电使用,不能提现",
|
|
|
personAccount: {},
|
|
|
accountList: [],
|
|
|
elderStatus: false,
|
|
@@ -92,7 +116,7 @@
|
|
|
monthN = "0" + monthN;
|
|
|
}
|
|
|
this.dateMonth = year + '-' + monthN + '-01';
|
|
|
-
|
|
|
+ //this.dateMonth = year + '-10-01';
|
|
|
this.getCarPersonAccount();
|
|
|
this.getAccountRecordData();
|
|
|
|
|
@@ -108,7 +132,7 @@
|
|
|
title: "加载中",
|
|
|
mask: true,
|
|
|
})
|
|
|
- API.accountRecordData({
|
|
|
+ API.rechargeAmountRecordList({
|
|
|
queryDate: this.dateMonth
|
|
|
}).then((res) => {
|
|
|
uni.hideLoading();
|
|
@@ -152,6 +176,9 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+ .oldTextClassF{
|
|
|
+
|
|
|
+ }
|
|
|
.slot-content {
|
|
|
font-size: 28rpx;
|
|
|
color: $u-content-color;
|
|
@@ -164,6 +191,7 @@
|
|
|
flex: 1;
|
|
|
}
|
|
|
.navBtn{
|
|
|
+ font-size: 36rpx;
|
|
|
float: right;
|
|
|
margin-right: 15px;
|
|
|
color:#3fbd70;
|
|
@@ -183,16 +211,32 @@
|
|
|
}
|
|
|
.balanceHead{
|
|
|
background-color: #fff;
|
|
|
- padding: 16px;
|
|
|
+ margin: 16px;
|
|
|
+ background-color: #00B962;
|
|
|
+ border-radius: 12px;
|
|
|
+ .new-balanceCard-foot{
|
|
|
+ font-size: 18px;
|
|
|
+ margin-top: 24rpx;
|
|
|
+ padding:4px;
|
|
|
+ color: rgba(84, 69, 47, 1);
|
|
|
+
|
|
|
+ border-radius:0 0 12px 12px;
|
|
|
+ text-align: center;
|
|
|
+ background: linear-gradient(88.81deg, rgba(224,207,180,1) 1.89%,rgba(207,167,106,1) 99.99%);
|
|
|
+ }
|
|
|
.balanceCard{
|
|
|
- background-color: #00B962;
|
|
|
- border-radius: 12px;
|
|
|
- padding: 16px;
|
|
|
+
|
|
|
+ padding: 16px 16px 0 16px;
|
|
|
.balanceCard-head{
|
|
|
- font{
|
|
|
- font-size: 18px;
|
|
|
- color:#fff;
|
|
|
- margin-right: 8px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ font-size: 36rpx;
|
|
|
+ color:#fff;
|
|
|
+ .h2{
|
|
|
+ font-size:72rpx
|
|
|
+ }
|
|
|
+ .balanceCard-head-item{
|
|
|
+ width: 49%;
|
|
|
}
|
|
|
}
|
|
|
.balanceCard-main{
|
|
@@ -201,7 +245,7 @@
|
|
|
justify-content: space-between;
|
|
|
margin-top: 8px;
|
|
|
h2{
|
|
|
- font-size: 40px;
|
|
|
+ font-size: 80rpx;
|
|
|
color:#fff;
|
|
|
font-weight: normal;
|
|
|
}
|
|
@@ -214,8 +258,9 @@
|
|
|
}
|
|
|
.balanceCard-foot{
|
|
|
display: flex;
|
|
|
- margin-top: 16px;
|
|
|
+ margin-top: 8rpx;
|
|
|
.balanceCard-item{
|
|
|
+ font-size: 32rpx;
|
|
|
flex: 1;
|
|
|
color:#fff;
|
|
|
}
|
|
@@ -232,13 +277,17 @@
|
|
|
justify-content: space-between;
|
|
|
height: 48px;
|
|
|
border-bottom: 1px solid #f7f7f7;
|
|
|
- padding: 0 16PX;
|
|
|
+ padding: 0 16px;
|
|
|
+
|
|
|
.title{
|
|
|
+ font-weight: bold;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+
|
|
|
+
|
|
|
span{
|
|
|
margin-left: 8px;
|
|
|
- font-size: 16px;
|
|
|
+ font-size: 36rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -247,8 +296,11 @@
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
padding: 12px 16px;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: rgba(16, 16, 16, 1);
|
|
|
+
|
|
|
p{
|
|
|
- font-size: 12px;
|
|
|
+ font-size: 32rpx;
|
|
|
color:#888;
|
|
|
margin-top: 3px;
|
|
|
}
|