martial-arts/pages/tabbar/my/my.vue

121 lines
4.6 KiB
Vue

<template>
<view v-if="isLoading">
<view class="" :style="{paddingTop:statusBarHeight+'px'}">
<image src="/static/tabbar/my-back.png" mode="" class="width100 posia" style="top: 0;z-index: -1;" lazy-load :style="{height:newHeight+'px'}"></image>
<view class="disac colf fon42" style="height: 42px;padding: 0 30rpx;">个人中心</view>
</view>
<view class="disjbac colf pad-zy40 mar-sx30">
<view class="disac">
<image class="radius_100 flexs" :src="userInfo.headimgurl" mode="aspectFill" lazy-load style="width: 100rpx;height: 100rpx;border: 6rpx solid #FFFFFF;background-color: #FFFFFF;"></image>
<view class="fon32 mar-z20 clips1">{{userInfo.nickname}}</view>
</view>
<view class="disac pad-zy12 pad-sx8 radius4 flexs" style="border: 2rpx solid #fccf6d;" @tap="$toolAll.tools.goPage('/pagesA/my-sign/my-sign')">
<image src="/static/tabbar/icon-rili.png" mode="" style="width: 24rpx;height: 24rpx;" lazy-load></image>
<view class="fon24 mar-z10">签到</view>
</view>
</view>
<view class="pad-zy30">
<view class="disjbac pad-sx30" style="background: linear-gradient(to bottom, #fefcfc 0%, #f8efed 100%);border-radius: 24rpx 24rpx 0 0;">
<view class="width33 disjcac fc" @tap="$toolAll.tools.goPage('/pagesA/my-integral/my-integral')">
<view class="fon20" style="color: #3e3e3e;">我的积分</view>
<view class="fon36 bold">{{userInfo.score}}</view>
</view>
<view class="width33 disjcac fc" @tap="$toolAll.tools.goPage('/pagesA/my-coupon/my-coupon')" style="border-left: 2rpx solid #f1e8e7;border-right: 2rpx solid #f1e8e7;">
<view class="fon20" style="color: #3e3e3e;">我的优惠券(张)</view>
<view class="fon36 bold">{{userInfo.coupon_count}}</view>
</view>
<view class="width33 disjcac" @tap="$toolAll.tools.goPage('/pages/tabbar/shop/shop')">
<view class="fon24 col-e42417 radius30 flexs disjcac" style="width: 180rpx;height: 60rpx;border: 2rpx solid #e42417;">积分商城</view>
</view>
</view>
</view>
<!-- 八宫格 -->
<view class="pad-zy20">
<view class="posir bacf disac fw pad-x50 boxshow2" style="z-index: 1;">
<view @tap="chooseFun(index)" class="width25 disjcac fc flexs mar-s50" v-for="(item,index) in funList" :key="index">
<view class="">
<!-- 图标 -->
<image class="radius_100" :src="item.src" mode="" style="width: 86rpx;height: 86rpx;" lazy-load></image>
</view>
<!-- 标题 -->
<view class="fon24 col26 mar-s20">{{item.title}}</view>
</view>
</view>
</view>
<!-- 底部tab -->
<foot-tab current='4'></foot-tab>
</view>
</template>
<script>
// 底部组件
import footTab from '@/components/foot-tabs/foot-tab.vue';
export default {
components:{'foot-tab' :footTab},
data() {
return {
statusBarHeight: uni.getSystemInfoSync().statusBarHeight, // 状态栏高度
newHeight:uni.getSystemInfoSync().screenHeight, // 窗口高度
isLoading:false, //加载完成
funList:[
{src:'/static/tabbar/icon-set.png',title:'个人资料'},
{src:'/static/tabbar/icon-course.png',title:'我的课程'},
{src:'/static/tabbar/icon-order.png',title:'我的订单'},
{src:'/static/tabbar/icon-panh.png',title:'我的练习视频'},
{src:'/static/tabbar/icon-coupon.png',title:'我的优惠券'},
{src:'/static/tabbar/icon-score.png',title:'我的积分'},
{src:'/static/tabbar/icon-address.png',title:'我的地址'},
{src:'/static/tabbar/icon-znz.png',title:'观看记录'},
{src:'/static/tabbar/icon-znz.png',title:'我的推广'},
{src:'/static/tabbar/icon-znz.png',title:'我的分享'},
], // 导航列表
userInfo:{}, //用户信息
}
},
onLoad() {
},
onShow() {
this.$toolAll.tools.obtainPagePath();
// 获取用户信息
this.getUserInfo();
},
methods: {
// 获取用户信息
getUserInfo(){
this.$requst.get('/api/user/info').then(res=>{
if(res.code==0) {
this.userInfo = res.data;
uni.setStorageSync('userInfo',this.userInfo);
}
this.isLoading = true;
})
},
// 导航跳转
chooseFun(index){
let list = [
'/pagesA/my-data/my-data',
'/pagesA/my-course/my-course',
'/pagesA/my-order/my-order',
'/pagesA/my-video/my-video',
'/pagesA/my-coupon/my-coupon',
'/pagesA/my-integral/my-integral',
'/pagesA/my-address/my-address',
'/pagesA/my-watch/my-watch',
'',
'',
]
if(index==8){
list[8] = ['/pagesA/my-extend/my-extend','/pagesB/second-level/second-level?level=1','/pagesB/second-level/second-level?level=2' ][this.userInfo.position]
}
uni.navigateTo({
url:list[index]
})
}
}
}
</script>
<style></style>