You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
551 lines
13 KiB
551 lines
13 KiB
<template> |
|
<view class="user"> |
|
<view v-if="$store.getters.token || userInfo.uid" class="content"> |
|
<view class="header acea-row row-between-wrapper"> |
|
<image src="../../../static/user-index-bg.png" mode="" class="header-bg"></image> |
|
<view class="picTxt acea-row row-between-wrapper"> |
|
<view class="pictrue"> |
|
<image :src="userInfo.avatar" /> |
|
</view> |
|
<view class="text"> |
|
<view class="acea-row row-middle"> |
|
<view class="name line1">{{ userInfo.nickname }}</view> |
|
<view class="member acea-row row-middle"> |
|
<!-- <image :src="userInfo.vipIcon" /> --> |
|
<text>{{ userInfo.levelName}}</text> |
|
</view> |
|
</view> |
|
<view @click="goPersonalData()" class="id" v-if="userInfo.phone"> |
|
<text>ID：{{ userInfo.uid || 0 }}</text> |
|
<text class="iconfont icon-bianji1"></text> |
|
</view> |
|
<!-- #ifdef MP-WEIXIN --> |
|
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="binding" v-else> |
|
<text>点击绑定手机号</text> |
|
</button> |
|
<!-- #endif --> |
|
|
|
<!-- #ifndef MP-WEIXIN --> |
|
<button class="binding" @click="goBindPhone()" v-else> |
|
<text>点击绑定手机号</text> |
|
</button> |
|
<!-- #endif --> |
|
</view> |
|
</view> |
|
<view class="jifen-box" @click="goIntegral">积分：{{userInfo.integral}}</view> |
|
<!-- <text class="iconfont icon-shezhi" @click="goPersonalData()"></text> --> |
|
</view> |
|
<view class="wrapper"> |
|
<view class="myService"> |
|
<view class="serviceList acea-row row-middle"> |
|
|
|
<view class="item" @click="goUserCourse()"> |
|
<view class="pictrue"> |
|
<image src="../../../static/user-menu1.png" /> |
|
</view> |
|
<view class="cell">我的课程</view> |
|
<text class="iconfont icon-jiantou"></text> |
|
</view> |
|
<view class="item" @click="goUserBangdan()"> |
|
<view class="pictrue"> |
|
<image src="../../../static/user-menu2.png" /> |
|
</view> |
|
<view class="cell">打卡榜打卡</view> |
|
<text class="iconfont icon-jiantou"></text> |
|
</view> |
|
<view class="item" @click="goUserFeedBack()"> |
|
<view class="pictrue"> |
|
<image src="../../../static/user-menu3.png" /> |
|
</view> |
|
<view class="cell">建议反馈</view> |
|
<text class="iconfont icon-jiantou"></text> |
|
</view> |
|
|
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<Authorization v-else /> |
|
</view> |
|
</template> |
|
<script> |
|
import { mapState, mapGetters, mapMutations, mapActions } from 'vuex' |
|
import { getUserInfo, getMenuUser, bindingPhone, wxappBindingPhone } from '@/api/user' |
|
import { isWeixin, VUE_APP_RESOURCES_URL } from '@/utils' |
|
import cookie from '@/utils/store/cookie' |
|
import SwitchWindow from '@/components/SwitchWindow' |
|
import Authorization from '@/pages/authorization/index' |
|
import { signCourse } from '@/api/knowledge' |
|
const NAME = 'User' |
|
|
|
export default { |
|
name: NAME, |
|
components: { |
|
SwitchWindow, |
|
Authorization, |
|
}, |
|
props: {}, |
|
data() { |
|
return { |
|
MyMenus: [], |
|
switchActive: false, |
|
isWeixin: false |
|
} |
|
}, |
|
computed: mapGetters(['userInfo']), |
|
watch: {}, |
|
methods: { |
|
...mapMutations(['updateAuthorizationPage']), |
|
call(){ |
|
uni.makePhoneCall({ |
|
phoneNumber: this.userInfo.sellerPhone || this.userInfo.customerPhone |
|
}) |
|
}, |
|
goAddressManagement(){ |
|
this.$yrouter.push('/pagesB/pages/user/address/AddressManagement/index') |
|
// this.$yrouter.push('/pagesB/pages/shop/Live/LiveList/index') |
|
}, |
|
goBindPhone() { |
|
this.$yrouter.push({ |
|
path: '/pages/user/BindingPhone/index', |
|
}) |
|
}, |
|
goUserCoupon() { |
|
this.$yrouter.push('/pages/user/coupon/UserCoupon/index') |
|
}, |
|
goIntegral() { |
|
if(this.userInfo.phone){ |
|
this.$yrouter.push('/pagesB/pages/user/signIn/Integral/index') |
|
} else{ |
|
uni.showToast({ |
|
title: '请先绑定手机号', |
|
icon: 'none', |
|
duration: 2000 |
|
}) |
|
} |
|
|
|
}, |
|
goUserPromotion() { |
|
this.$yrouter.push('/pages/user/promotion/UserPromotion/index') |
|
}, |
|
goUserAccount() { |
|
this.$yrouter.push({ |
|
path: '/pages/user/UserAccount/index', |
|
}) |
|
}, |
|
goPersonalData() { |
|
this.$yrouter.push('/pages/user/PersonalData/index') |
|
}, |
|
getPhoneNumber: function(e) { |
|
let thit = this |
|
// 判断一下这里是不是小程序 如果是小程序，走获取微信手机号进行绑定 |
|
if (e.mp.detail.errMsg == 'getPhoneNumber:ok') { |
|
uni.showLoading({ |
|
title: '绑定中', |
|
}) |
|
wxappBindingPhone({ |
|
encryptedData: e.mp.detail.encryptedData, |
|
iv: e.mp.detail.iv, |
|
}) |
|
.then(res => { |
|
// this.User(); |
|
if(res.success){ |
|
thit.$store.dispatch('userInfo', true) |
|
uni.hideLoading() |
|
uni.showToast({ |
|
title: res.msg, |
|
icon: 'success', |
|
duration: 2000, |
|
}) |
|
} else{ |
|
uni.hideLoading() |
|
uni.showModal({ |
|
title:'提示！', |
|
content:'授权已过期，请重新授权后绑定手机号', |
|
success:function(res){ |
|
if(res.confirm){ |
|
thit.$store.commit('logout') |
|
} |
|
}, |
|
}) |
|
} |
|
}) |
|
// .catch(error => { |
|
// uni.hideLoading() |
|
// thit.$store.dispatch('userInfo', true) |
|
// console.log(error) |
|
// uni.showToast({ |
|
// title: error.msg || error.response.data.msg || error.response.data.message, |
|
// icon: 'none', |
|
// duration: 2000, |
|
// }) |
|
// }) |
|
// // 获取当前环境的服务商 |
|
// uni.getProvider({ |
|
// service: "oauth", |
|
// success: function (res) { |
|
// // 此处可以排除h5 |
|
// if (res.provider) { |
|
// uni.login({ |
|
// success: loginRes => { |
|
// bindingPhone({ |
|
// code: loginRes.code, |
|
// encryptedData: e.mp.detail.encryptedData, |
|
// iv: e.mp.detail.iv |
|
// }) |
|
// .then(res => { |
|
// // this.User(); |
|
// thit.$store.dispatch("userInfo", true); |
|
// uni.hideLoading(); |
|
// uni.showToast({ |
|
// title: res.msg, |
|
// icon: "success", |
|
// duration: 2000 |
|
// }); |
|
// }) |
|
// .catch(error => { |
|
// uni.hideLoading(); |
|
// thit.$store.dispatch("userInfo", true); |
|
// console.log(error); |
|
// uni.showToast({ |
|
// title: error.msg || |
|
// error.response.data.msg || |
|
// error.response.data.message, |
|
// icon: "none", |
|
// duration: 2000 |
|
// }); |
|
// }); |
|
// }, |
|
// fail() { |
|
// reject("绑定失败"); |
|
// } |
|
// }); |
|
// } |
|
// }, |
|
// fail() { |
|
// reject("获取环境服务商失败"); |
|
// } |
|
// }); |
|
} else { |
|
uni.showToast({ |
|
title: '已拒绝授权', |
|
icon: 'none', |
|
duration: 2000, |
|
}) |
|
} |
|
}, |
|
changeswitch: function(data) { |
|
this.switchActive = data |
|
}, |
|
MenuUser: function() { |
|
let that = this |
|
getMenuUser() |
|
.then(res => { |
|
uni.hideLoading() |
|
that.MyMenus = res.data.routine_my_menus |
|
}) |
|
.catch(error => { |
|
uni.hideLoading() |
|
console.log(error) |
|
}) |
|
}, |
|
goPages: function(index) { |
|
let url = this.MyMenus[index].uniapp_url |
|
if (url === '/pages/user/promotion/UserPromotion/index' && this.userInfo.statu === 1) { |
|
if (!this.userInfo.isPromoter) { |
|
uni.showToast({ |
|
title: '您还没有推广权限！！', |
|
icon: 'none', |
|
duration: 2000, |
|
}) |
|
return |
|
} |
|
} |
|
|
|
if (url === '/pages/orderAdmin/OrderIndex/index' && !this.userInfo.adminid) { |
|
uni.showToast({ |
|
title: '您还不是管理员！！', |
|
icon: 'none', |
|
duration: 2000, |
|
}) |
|
return |
|
} |
|
if (url === '/pages/orderAdmin/OrderCancellation/index' && !this.userInfo.checkStatus) { |
|
uni.showToast({ |
|
title: '您没有核销权限,请后台店员设置！！', |
|
icon: 'none', |
|
duration: 2000, |
|
}) |
|
return |
|
} |
|
|
|
this.$yrouter.push({ |
|
path: this.MyMenus[index].uniapp_url, |
|
}) |
|
}, |
|
goPages2: function() { |
|
this.$yrouter.push({ |
|
path: '/pages/shop/GoodsList/index', |
|
query: { |
|
// id: 0, |
|
title: '积分商城', |
|
isIntegral: true, |
|
}, |
|
}) |
|
}, |
|
}, |
|
watch: { |
|
userInfo() { |
|
// this.MenuUser() |
|
}, |
|
}, |
|
onShow() { |
|
if (this.$store.getters.token) { |
|
this.$store.dispatch('getUser', true) |
|
// this.MenuUser() |
|
this.isWeixin = isWeixin() |
|
} |
|
}, |
|
|
|
onHide() { |
|
console.log('离开用户中心') |
|
this.updateAuthorizationPage(false) |
|
}, |
|
} |
|
</script> |
|
|
|
<style lang="less"> |
|
.header{ |
|
width: 100%; |
|
height: 336rpx !important; |
|
padding: 0 !important; |
|
position: relative !important; |
|
.header-bg{ |
|
width: 100%; |
|
height: 100%; |
|
position: absolute; |
|
top: 0; |
|
z-index: 2; |
|
} |
|
.picTxt{ |
|
position: absolute !important; |
|
left: 32rpx; |
|
z-index: 3; |
|
.text { |
|
.name { |
|
font-size: 36rpx; |
|
max-width: 260rpx; |
|
color: #A8873D; |
|
} |
|
} |
|
.binding{ |
|
background: #BF922B !important; |
|
border-color: #BF922B !important; |
|
} |
|
} |
|
.jifen-box{ |
|
width: 200rpx; |
|
height: 62rpx; |
|
background: #BF922B; |
|
border-radius: 30rpx; |
|
text-align: center; |
|
line-height: 62rpx; |
|
position: absolute; |
|
right: 30rpx; |
|
top: 30rpx; |
|
z-index: 4; |
|
color: #fff; |
|
font-size: 28rpx; |
|
} |
|
} |
|
|
|
.teacher-box{ |
|
width: 690rpx; |
|
height: 112rpx; |
|
padding-left: 28rpx; |
|
padding-right: 40rpx; |
|
background: linear-gradient(180deg, #332810 0%, #4E4229 100%); |
|
border-radius: 10rpx; |
|
position: relative; |
|
left: 50%; |
|
top: -56rpx; |
|
margin-left: -345rpx; |
|
z-index: 7; |
|
.teacher-box-l { |
|
color: #FFFADD; |
|
font-size: 28rpx; |
|
.call-icon{ |
|
width: 56rpx; |
|
height: 56rpx; |
|
} |
|
text{ |
|
display: inline-block; |
|
margin-left:20rpx; |
|
margin-right:14rpx; |
|
} |
|
.vertical-line{ |
|
width: 2rpx; |
|
height: 34rpx; |
|
background: #FFFADD; |
|
} |
|
} |
|
.teacher-box-r{ |
|
color: #F9EDCC; |
|
font-size: 24rpx; |
|
image{ |
|
width: 88rpx; |
|
height: 88rpx; |
|
border: 1px solid #fff; |
|
border-radius: 25px; |
|
margin-right: 30rpx; |
|
} |
|
} |
|
} |
|
.myjoin-box{ |
|
width: 690rpx; |
|
// height: 506rpx; |
|
background: #FFFFFF; |
|
border-radius: 10rpx; |
|
padding: 30rpx; |
|
margin: -26rpx auto 0; |
|
.t-word{ |
|
font-size: 32rpx; |
|
color: #222; |
|
margin-bottom: 30rpx; |
|
} |
|
.course-box{ |
|
width: 94%; |
|
height: 190rpx; |
|
background: #FFF5DE; |
|
border-radius: 10rpx; |
|
padding: 26rpx 20rpx 20rpx 42rpx; |
|
color: #C89560; |
|
font-size: 24rpx; |
|
display: inline-block; |
|
margin-bottom: 30rpx; |
|
margin-right: 20rpx; |
|
.course-item{ |
|
width: 100%; |
|
display: inline-block; |
|
} |
|
.course-info{ |
|
|
|
margin-bottom: 10rpx; |
|
.course-name{ |
|
color: #C89560; |
|
font-size: 28rpx; |
|
line-height: 40rpx; |
|
margin-bottom: 4rpx; |
|
font-weight: 500; |
|
} |
|
} |
|
.address-box{ |
|
.address{ |
|
width: calc(100% - 190rpx); |
|
} |
|
.btn{ |
|
width: 172rpx; |
|
height: 56rpx; |
|
background: linear-gradient(180deg, #FFCC5D 0%, #FCA535 100%); |
|
border-radius: 28rpx; |
|
text-align: center; |
|
line-height: 56rpx; |
|
font-size: 32rpx; |
|
color: #fff; |
|
} |
|
} |
|
} |
|
.scroll-view_H{ |
|
white-space: nowrap; |
|
width: 100%; |
|
} |
|
.bangdan-box{ |
|
width: 100%; |
|
box-sizing: border-box; |
|
.bangdan-item{ |
|
width: 310rpx; |
|
height: 152rpx; |
|
box-sizing: border-box; |
|
padding: 20rpx; |
|
color: #fff; |
|
display: inline-block; |
|
background: linear-gradient(143deg, #FDAF97 0%, #ED5E48 100%); |
|
border-radius: 10rpx; |
|
font-size: 28rpx; |
|
margin-right: 20rpx; |
|
.bangdan-name{ |
|
margin-bottom: 28rpx; |
|
} |
|
.signin-day{ |
|
font-size: 24rpx; |
|
} |
|
.signin-btn{ |
|
width: 122rpx; |
|
height: 48rpx; |
|
background: linear-gradient(180deg, #FEECCB 0%, #FCAB3B 100%); |
|
border-radius: 8px; |
|
border-radius: 8rpx; |
|
text-align: center; |
|
line-height: 48rpx; |
|
color: #C71A00; |
|
font-size: 24rpx; |
|
} |
|
} |
|
} |
|
} |
|
.content{ |
|
padding-bottom: 100rpx; |
|
} |
|
.user .wrapper { |
|
background:#F5F6F7; |
|
padding: 0 30rpx; |
|
} |
|
|
|
.footer-line-height { |
|
height: 1 * 100rpx; |
|
} |
|
|
|
.order-status-num { |
|
background-color: #fff; |
|
color: #eb3729; |
|
border-radius: 15px; |
|
position: absolute; |
|
right: -0.14 * 100rpx; |
|
top: -0.15 * 100rpx; |
|
font-size: 0.2 * 100rpx; |
|
padding: 0 0.08 * 100rpx; |
|
border: 1px solid #eb3729; |
|
} |
|
|
|
.pictrue { |
|
position: relative; |
|
} |
|
|
|
.switch-h5 { |
|
margin-left: 0.2 * 100rpx; |
|
} |
|
|
|
.binding { |
|
margin-top: 0.1 * 100rpx; |
|
display: inline-block; |
|
padding: 0.05 * 100rpx 0.2 * 100rpx; |
|
background-color: #ca1f10; |
|
border-radius: 50px; |
|
font-size: 0.22 * 100rpx; |
|
line-height: 1.5; |
|
border: 1px solid #e8695e; |
|
color: #ffffff; |
|
} |
|
.noBorder{ |
|
border: none !important; |
|
} |
|
.by { |
|
text-align: center; |
|
padding: 30rpx 0; |
|
} |
|
|
|
.by-text { |
|
text-align: center; |
|
font-size: 24rpx; |
|
} |
|
</style>
|
|
|