theluyuan/beelink
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

我的钱包 关于 列表

Browse Source
This commit is contained in:
asd
2020-09-29 16:51:42 +08:00
parent 8bf0188105
commit db2eec98a0
32 changed files with 2158 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

272
src/views/mine/Cashout.vue Normal file
View File

@@ -0,0 +1,272 @@
<template>
<div class="cashout">
<a-breadcrumb separator=">">
<a-breadcrumb-item>Home</a-breadcrumb-item>
<a-breadcrumb-item href=""> Application Center </a-breadcrumb-item>
<a-breadcrumb-item href=""> Application List </a-breadcrumb-item>
<a-breadcrumb-item>An Application</a-breadcrumb-item>
</a-breadcrumb>
<div class="mingxilist">
<div class="tabs">
<div class="beforetab">提现到指定账户</div>
<span class="residue">余额：￥50</span>
<div class="topbtn topbtn2">提现到指定账户</div>
<div class="topbtn topbtn1">提现记录</div>
</div>
<div class="line"></div>
<div class="choose">
<div class="chooseitem">
<div class="label">选择账户</div>
<!-- <a-radio></a-radio> -->
<div class="accountlist">
<a-radio>
<div class="accountitem">
<div class="hostinfo">
<div>
<img src="@/static/images/bank.png" alt="" class="icon" />
<span class="accounttype">银行卡</span>
</div>
</div>
<div class="zhanghao">账号：6217 **** **** **** 175</div>
</div>
</a-radio>
<a-radio>
<div class="accountitem">
<div class="hostinfo">
<div>
<img
src="@/static/images/walletzfb.png"
alt=""
class="icon icon1"
/>
<span class="accounttype">支付宝</span>
</div>
</div>
<div class="zhanghao">账号：6217 **** **** **** 175</div>
</div>
</a-radio>
<a-radio>
<div class="accountitem">
<div class="hostinfo">
<div>
<img
src="@/static/images/walletweixin.png"
alt=""
class="icon icon1"
/>
<span class="accounttype">微信</span>
</div>
</div>
<div class="zhanghao">账号：6217 **** **** **** 175</div>
</div>
</a-radio>
</div>
</div>
<div class="cashoutmoney">
<div class="label">提现金额</div>
<div class="moneynum">
<a-input v-model="money" class="shuru" @change="moneychange" />
<div>￥</div>
<div class="cashoutall">全部金额</div>
<div class="desc">注：每笔提现收取0.1%服务费，最低￥0.1</div>
</div>
</div>
<div class="ale">*您的余额只有￥50，最低提现金额￥100</div>
</div>
<div class="cashoutall submit">全部金额</div>
<NavBottom class="navbottom"></NavBottom>
</div>
</div>
</template>
<script lang="ts">
import { defineComponent, ref } from "vue";
import NavBottom from "@/components/NavBottom.vue";
export default defineComponent({
name: "Cashout",
components: {
NavBottom,
},
setup() {
const money = ref(0);
const moneychange: (e: number) => void = (e: number) => {
console.log(e);
};
return {
money,
moneychange,
};
},
});
</script>
<style lang="scss" scoped>
.cashout /deep/ .ant-breadcrumb > span:last-child {
color: #08ae98;
}
.cashout /deep/ .ant-radio-wrapper {
display: flex;
}
.cashout /deep/ .ant-radio {
top: 43px;
}
.cashout {
.mingxilist {
width: 1150px;
// height: 533px;
background: white;
border-radius: 18px;
margin-top: 18px;
.tabs {
display: flex;
flex-wrap: nowrap;
padding-top: 35px;
padding-left: 40px;
.residue {
font-size: 11px;
margin: auto 0;
color: #08ae98;
position: relative;
left: -30px;
}
.topbtn {
// width: 89px;
height: 17px;
padding-left: 14px;
padding-right: 14px;
line-height: 17px;
border: 1px solid #08ae98;
border-radius: 3px;
font-size: 10px;
color: #08ae98;
font-weight: 500;
margin: auto 0;
}
.topbtn2 {
margin-left: 642px;
}
.topbtn1 {
padding-left: 9px;
padding-right: 9px;
color: #d12c2e;
border: 1px solid #d12c2e;
margin-left: 11px;
}
}
.line {
width: 1070px;
height: 1px;
background: #eeeeee;
margin: 0 auto;
margin-top: 11px;
}
.beforetab {
color: #121212;
font-size: 13px;
line-height: 35px;
font-weight: bold;
margin-right: 57px;
}
.choose {
margin-top: 28px;
margin-left: 40px;
.label {
color: #808080;
font-size: 11px;
margin-right: 28px;
}
.chooseitem {
display: flex;
margin-bottom: 34px;
.accountlist {
display: flex;
.accountitem {
// width: 200px;
padding-bottom: 16px;
padding-right: 20px;
border: 1px solid #dcdfe0;
background: white;
border-radius: 17px;
margin-left: 17px;
margin-right: 46px;
.hostinfo {
display: flex;
padding-top: 17px;
.icon {
width: 47px;
height: 29px;
margin-right: 11px;
margin-left: 17px;
}
.icon1 {
width: 29px !important;
height: 29px !important;
}
.accounttype {
font-size: 13px;
color: #111111;
font-weight: 500;
}
}
.zhanghao {
color: #111111;
font-size: 10px;
margin-top: 38px;
margin-left: 17px;
}
}
}
}
.cashoutmoney {
display: flex;
.moneynum {
display: flex;
font-size: 11px;
line-height: 23px;
color: #808080;
.shuru {
width: 171px;
height: 23px;
margin-right: 8px;
}
.desc{
margin-left:17px
}
}
}
}
.cashoutall {
width: 67px;
height: 23px;
line-height: 23px;
background: #08ae98;
border-radius: 3px;
color:white;
text-align: center;
margin-left: 23px;
font-weight: bold;
}
.ale{
color:#D12C2E;
font-size: 10px;
position: relative;
left: 80px;
top: 11px;
}
.submit{
font-size:10px;
font-weight: 500;
position: relative;
top: 56px;
left: 20px;
}
}
.navbottom {
padding-top: 250px;
padding-bottom: 30px;
}
}
</style>