autumn/jsowell-charger-web
1
0
Fork 0
mirror of https://codeup.aliyun.com/67c68d4e484ca2f0a13ac3c1/ydc/jsowell-charger-web.git synced 2026-05-04 01:50:17 +08:00
Code Issues Packages Projects Releases Wiki Activity

修改样式

Browse Source
This commit is contained in:
JS-LM
2023-06-26 14:29:01 +08:00
parent e10e54ffb2
commit 7c60d8eab6
2 changed files with 126 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

132
jsowell-ui/src/views/pile/merchant/components/walletSummary.vue
View File

@@ -1,57 +1,36 @@
<template>
<div class="app-container">
<div style="display: flex; padding: 10px">
<!-- <div style="width: 25%">
<h2>钱包汇总</h2>
<p>运营商：举视新能源</p>
<p>商家性质：企业</p>
<p>开户状态：进件成功</p>
<p>开户行名称：中国农业银行股份有限公司</p>
<p>收款卡号：46456412</p>
<p>预留手机号：452584</p>
</div> -->
<div class="main" style="flex: 1; align-items: baseline">
<div class="bord"></div>
<div class="card">
<p class="center">账户余额</p>
<div class="center" >
<span class="number">{{adapayMember.acctBalance}}</span>
（元）</div>
<p style="text-align: justify">
账户余额 = 可用余额 + 冻结余额
</p>
</div>
<div class="bord"></div>
<div class="card">
<p class="center">可用余额</p>
<div class="center">
<span class="number">{{adapayMember.avlBalance}} </span>
（元）</div>
<p>该余额大于0时，才可发起取现</p>
</div>
<div class="bord"></div>
<div class="card">
<p class="center">冻结余额</p>
<div class="center" style="margin-top:20px">
<span class="number">{{adapayMember.frzBalance}}</span>
（元）</div>
<p>当配置了自动结算功能，在每日发起结算时会将可用余额转为冻结金额。该部分金额不允许取现。</p>
</div>
<div class="bord"></div>
<div class="card">
<p class="center">昨日日终余额</p>
<div class="center" style="margin-top:20px">
<span class="number">{{adapayMember.lastAvlBalance}}</span>
元
</div>
<!-- <button>昨</button> -->
</div>
<div class="bord"></div>
<!-- <div class="card">
<p>已提现</p>
<p>165（元）</p>
<p>以成功提现到绑定银行卡的金额汇总</p>
</div> -->
<div class="main">
<div class="main-right">
<p class="center">账户余额(元)</p>
<p class="center number">{{adapayMember.acctBalance}}</p>
<p class="center">注:
<span class="text">账户余额 = 可用余额 + 冻结余额</span>
</p>
</div>
<div class="main-right">
<p class="center">可用余额(元)</p>
<p class="center number">{{adapayMember.avlBalance}}</p>
<!-- <el-button type="primary" style="margin-left: 25%;" v-if="adapayMember.avlBalance > 0" @click="dialogVisible = true">提现申请</el-button> -->
<!-- <p class="center " v-else>注: -->
<p class="center">注:
<span class="text">该余额大于0时，才可发起取现</span>
</p>
</div>
<div class="main-right">
<p class="center">冻结金额(元)</p>
<p class="center number">{{adapayMember.frzBalance}}</p>
<p class="center ">注:
<span class="text">当配置了自动结算功能，在每日发起结算时会将可用余额转为冻结金额。该部分金额不允许取现。</span>
</p>
</div>
<div class="main-right">
<p class="center">昨日日终余额(元)</p>
<p class="center number">{{adapayMember.lastAvlBalance}}</p>
<p class="center">注:
<span class="text">一</span>
</p>
</div>
</div>
<el-tabs
@@ -133,6 +112,28 @@
</el-tab-pane>
<el-tab-pane label="订单流水" name="second">订单流水</el-tab-pane>
</el-tabs>
<el-dialog title="提现申请" :visible.sync="dialogVisible" width="33%" :before-close="handleClose">
温馨提示
<div style="font-size:12px;color:gray">
<p>1.提现将在3个工作日内审核到账,节假日审核顺延</p>
<p>2.部分流量方的充电订单存在账期,需要一定周期后才开始执行清分</p>
<p>3.提现为银行自动付款,根据银行要求会收取手续费,请知悉</p>
<p>4.订单收入包含了第三方的分成收入金额,已自动扣除万车充分成金额</p>
</div>
<p>可提现(元):
<span class="number">{{adapayMember.avlBalance}}</span>
</p>
<p>实际到账(元):
<span class="number">0</span>
</p>
<p>手续费(元):
<span class="number">10.00</span>
</p>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false">提交</el-button>
</span>
</el-dialog>
</div>
</template>
@@ -150,10 +151,18 @@ export default {
//图标，可根据自己的需求匹配
icon: "el-icon-caret-bottom",
createTimeRange:'',
adapayMember:{}
adapayMember:{},
dialogVisible: false
};
},
methods: {
handleClose(done) {
this.$confirm('确认关闭？')
.then(_ => {
done();
})
.catch(_ => {});
},
handleClick(tab, event) {
console.log(tab, event);
},
@@ -193,10 +202,25 @@ export default {
.center{
text-align: center;
}
.text{
font-size: 12px;
color: red;
}
.main {
display: flex;
justify-content: space-between;
align-items: baseline;
// align-items: baseline;
.main-right{
width: 310px;
margin-right: 20px;
border: 1px solid #e6ebf5;
border-radius: 10px;
padding: 10px;
transition: all .2s linear;
}
}
.main-right:hover{
box-shadow: 0 0 5px 3px #999;
}
.bord {
position: relative;