117 lines
4.2 KiB
Vue
117 lines
4.2 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">{{userInfo.nickname}}</view>
|
|
</view>
|
|
<view class="disac pad-zy12 pad-sx8 radius4" 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">
|
|
<view class="fon20" style="color: #3e3e3e;">我的积分</view>
|
|
<view class="fon36 bold">{{userInfo.score}}</view>
|
|
</view>
|
|
<view class="width33 disjcac fc" 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:'我的推广'},
|
|
], // 导航列表
|
|
userInfo:{}, //用户信息
|
|
}
|
|
},
|
|
onLoad() {
|
|
|
|
},
|
|
onShow() {
|
|
// 获取用户信息
|
|
this.getUserInfo();
|
|
},
|
|
methods: {
|
|
// 获取用户信息
|
|
getUserInfo(){
|
|
uni.showLoading({
|
|
title:'加载中'
|
|
});
|
|
this.$requst.get('/api/user/info').then(res=>{
|
|
console.log(res,'用户信息')
|
|
if(res.code==0) {
|
|
this.userInfo = res.data;
|
|
}
|
|
uni.hideLoading();
|
|
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-extend/my-extend',
|
|
]
|
|
uni.navigateTo({
|
|
url:list[index]
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style></style>
|