tcwm-uniapp-qsd/pages/riderMy/myAccount/myAccount.vue

177 lines
3.0 KiB
Vue

<template>
<view class="my_account">
<view class="account_top">
<view class="account_name">账户余额</view>
<view class="account_price">{{moneys}}<text></text></view>
<view class="account_btn" @click="bindTxmoney">立即提现</view>
</view>
<!-- 我的列表 -->
<view class="mylist">
<view class="list_box" v-for="(item,index) in mylist" :key="index" @click="bindTomy(item.name)">
<view class="list_left">
<view class="list_img">
<image :src="item.image"></image>
</view>
<view class="list_name">{{item.name}}</view>
</view>
<view class="list_right">
<image src="../../../static/my/icon_go.png"></image>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
moneys:0,
mylist: [{
id: 1,
name: '保证金',
image: '../../../static/rider/qqq.png'
}, {
id: 2,
name: '账户明细',
image: '../../../static/rider/qq.png'
}]
}
},
onShow() {
this.taskData()
},
methods: {
// 获取任务数据
taskData() {
this.$Request.getT('/app/userinfo/findBalance').then(res => {
if(res.code==0){
if(res.data){
this.moneys = res.data
}
}
console.log('res',res)
});
},
bindTxmoney() {
uni.navigateTo({
url: '/pages/riderMy/myAccount/Txmoney/Txmoney'
})
},
bindTomy(name) {
console.log(name)
if (name == '保证金') {
uni.navigateTo({
url: '/pages/riderMy/myAccount/AcontMoney/AcontMoney'
})
} else if (name == '账户明细') {
uni.navigateTo({
url: '/pages/riderMy/myAccount/Acontlist/Acontlist'
})
}
}
}
}
</script>
<style>
.my_account {
width: 100%;
}
.account_top {
width: 100%;
height: 280rpx;
background: #FF7F00;
position: relative;
}
.account_name {
position: absolute;
top: 80rpx;
left: 80rpx;
color: white;
font-size: 30rpx;
letter-spacing: 2rpx;
}
.account_price {
position: absolute;
top: 140rpx;
left: 80rpx;
color: white;
font-size: 50rpx;
letter-spacing: 2rpx;
}
.account_price text {
font-size: 25rpx;
margin-left: 10rpx;
}
.account_btn {
width: 190rpx;
height: 66rpx;
background: #ffffff;
color: #FF7F00;
border-radius: 66rpx;
text-align: center;
line-height: 66rpx;
position: absolute;
top: 140rpx;
right: 40rpx;
font-size: 24rpx;
}
/* 我的列表 */
.mylist {
width: 93%;
margin: 0 auto;
background-color: #FFFFFF;
margin-top: 10rpx;
border-radius: 23rpx;
}
.list_box {
width: 90%;
margin: 0 auto;
display: flex;
height: 95rpx;
}
.list_left {
flex: 1;
display: flex;
justify-content: left;
align-items: center;
}
.list_img {
margin-right: 10rpx;
}
.list_img image {
width: 50rpx;
height: 50rpx;
}
.list_name {
font-size: 25rpx;
letter-spacing: 2rpx;
}
.list_right {
flex: 1;
display: flex;
justify-content: flex-end;
align-items: center;
}
.list_right image {
width: 12rpx;
height: 20rpx;
}
</style>