<template>
|
|
<view class="">
|
|
<view class="nav_box">
|
|
<!-- <u-navbar :title="null" bgColor="transparent" @rightClick="rightClick" :autoBack="true" ></u-navbar> -->
|
|
<view class="barHeight" :style="'height:'+sumHeight+'px'">
|
|
<view class="left_back" @click="toback" >
|
|
<u-icon name="arrow-left" color="#fff" size="45"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="head_portrait">
|
|
<view class="img_box">
|
|
<image :src="userInfo.headUrl|| ''" mode=""></image>
|
|
</view>
|
|
<view class="name_title">
|
|
|
|
<text class="name">{{userInfo.nickName|| ''}}</text>
|
|
<text class="id">ID: {{userInfo.invitationCode || ''}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="card">
|
|
<view class="item" v-for="(item,index) in card_list" :key="index" @click="handleClick(item.key)">
|
|
<text class="num">{{item.num}}</text>
|
|
<text class="title">{{item.title}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="grid_box">
|
|
<view class="item" v-for="(item,index) in config.grid_list" :key="index" @click="todetale(item.url)">
|
|
<text class="item_text">{{item.name}}</text>
|
|
<image :src="item.src_url" mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import config from "./config.js"
|
|
export default {
|
|
data() {
|
|
return {
|
|
sumHeight: null,
|
|
config: config,
|
|
card_list: [],
|
|
userInfo: {},
|
|
type: 0
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.type = options.type
|
|
// 状态栏高度
|
|
const barHeight = uni.getSystemInfoSync().statusBarHeight;
|
|
|
|
// #ifdef MP-WEIXIN
|
|
// 获取微信胶囊的位置信息 width,height,top,right,left,bottom
|
|
const custom = wx.getMenuButtonBoundingClientRect()
|
|
// 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
|
|
const navigationBarHeight = custom.height + (custom.top - barHeight) * 2;
|
|
// 总体高度 = 状态栏高度 + 导航栏高度
|
|
this.sumHeight = navigationBarHeight + barHeight;
|
|
// #endif
|
|
console.log(custom, navigationBarHeight, this.sumHeight);
|
|
this.userInfo = uni.getStorageSync("__user_info");
|
|
this.getStationmaster();
|
|
},
|
|
methods: {
|
|
handleClick (key) {
|
|
///pagesA/my_other_list/webmaster/reward_centers/index?type=1
|
|
let url = key === 'money' ? '/pagesA/my_other_list/webmaster/reward_centers/index2?type=2' : '/pagesA/my_other_list/webmaster/reward_centers/index?type=1'
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
|
|
},
|
|
getStationmaster() {
|
|
uni.showLoading();
|
|
this.$api('getStationmaster').then(res => {
|
|
let { code, result, message} = res;
|
|
uni.hideLoading();
|
|
if(code == 200) {
|
|
this.card_list = [
|
|
{
|
|
key: 'money',
|
|
num: result.money,
|
|
title: '佣金余额与明细'
|
|
},
|
|
{
|
|
key: 'team',
|
|
num: result.moneySum,
|
|
title: '业绩总额与明细'
|
|
},
|
|
]
|
|
console.log(result);
|
|
}else{
|
|
this.$Toast(message);
|
|
if(message == '您不是站长,无权限访问'){
|
|
setTimeout(()=> {
|
|
uni.switchTab({
|
|
url: '/pages/my/my'
|
|
})
|
|
},1000);
|
|
}
|
|
}
|
|
}).catch(err => {
|
|
uni.hideLoading();
|
|
this.$Toast(err.message)
|
|
})
|
|
},
|
|
// 返回
|
|
toback() {
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
},
|
|
todetale(url) {
|
|
console.log(url)
|
|
if(url == '/pagesA/my_other_list/webmaster/wallet/index') {
|
|
this.$tools.navigateTo({
|
|
url: url+ '?momey='+this.card_list[0].num
|
|
})
|
|
}else {
|
|
this.$tools.navigateTo({
|
|
url
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
page {
|
|
position: relative;
|
|
}
|
|
|
|
.nav_box {
|
|
height: 423rpx;
|
|
background: -webkit-linear-gradient(-90deg, #01aeea, #f1fbff);
|
|
.barHeight{
|
|
display: flex;
|
|
align-items: flex-end;
|
|
.left_back {
|
|
width: 120rpx;
|
|
height: 60rpx;
|
|
padding-left: 32rpx;
|
|
padding-bottom: 10rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.head_portrait {
|
|
display: flex;
|
|
padding-top: 68rpx;
|
|
padding-left: 40rpx;
|
|
.img_box{
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
overflow: hidden;
|
|
border-radius: 50%;
|
|
margin-right: 20rpx;
|
|
}
|
|
image {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
}
|
|
|
|
.name_title {
|
|
display: flex;
|
|
flex-direction: column;
|
|
color: #fff;
|
|
|
|
.name {
|
|
padding-top: 18rpx;
|
|
padding-bottom: 10rpx;
|
|
font-size: 38rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.id {
|
|
font-size: 32rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.card {
|
|
position: absolute;
|
|
top: 424rpx;
|
|
left: 20rpx;
|
|
width: 711rpx;
|
|
height: 192rpx;
|
|
margin: 0 auto;
|
|
border-radius: 20rpx;
|
|
// 背景图
|
|
background-color: #01aeea;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
|
|
view {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: #fff;
|
|
|
|
.num {
|
|
font-size: 35rpx;
|
|
font-weight: bold;
|
|
padding-bottom: 34rpx;
|
|
}
|
|
|
|
.title {
|
|
font-size: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.grid_box {
|
|
margin-top: 220rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
|
|
.item {
|
|
width: 326rpx;
|
|
height: 176rpx;
|
|
margin-top: 20rpx;
|
|
margin-left: 30rpx;
|
|
border-radius: 19rpx;
|
|
box-shadow: 0 3rpx 6rpx 0 rgba(0, 0, 0, 0.16);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
.item_text{
|
|
font-size: 35rpx;
|
|
font-weight: bold;
|
|
}
|
|
image {
|
|
width: 100rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|