yanghao
/
chanyishenghuo-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
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.
13 Commits
3 Branches
0 Tags
10 MiB
 
 
 
 
Tree: 5ecf4ebd30
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '5ecf4ebd30'
${ noResults }
chanyishenghuo-uniapp/pages/user/User/index.vue

923 lines
25 KiB
Raw Blame History

<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">
<image src="../../../static/jifen-icon.png"></image>
<text>点击签到</text>
</view>
<!-- <view class="jifen-box" @click="goIntegral">积分：{{userInfo.integral}}</view> -->
<!-- <text class="iconfont icon-shezhi" @click="goPersonalData()"></text> -->
</view>
<!-- <view class="teacher-box acea-row-nowrap row-between row-middle">
<view class="teacher-box-r acea-row row-between row-middle" v-if="userInfo.isPromoter == 0">
<image :src="userInfo.workPhoto" v-if="userInfo.workPhoto"></image>
<image src="../../../static/default-headerimg.png" v-else></image>
<text @click="call">{{userInfo.sellerName || '点击联系服务老师'}} </text>
</view>
<view class=" teacher-box-l acea-row-nowrap row-between row-middle" v-if="userInfo.isPromoter == 0">
<image src="../../../static/call-icon.png" class="call-icon" @click="call"></image>
</view>
<view class="" style="color: #fff;" v-else @click="toServiceIndex()">服务老师主页</view>
</view> -->
<view class="panel-box">
<image src="https://download.cyjyyjy.com/course-bg.png" class="panel-bg"></image>
<view class="panel-content acea-row row-between">
<view class="profit-box">
<view class="mt20">
<view>今日收益</view>
<view class="fz40">200积分</view>
</view>
<view class="">
<view>累计收益</view>
<view class="fz40">200积分</view>
</view>
<view class="panel-btn">去提现</view>
</view>
<!-- <view class="col-line"></view> -->
<view class="sale-box">
<view class="mt20">
<view>推广人数</view>
<view class="fz40">20人</view>
</view>
<view class="">
<view>今日收益</view>
<view class="fz40">20人</view>
</view>
<view class="panel-btn">我的团队</view>
</view>
<!-- <view class="to-more-box">
<image src="../../images/jifen-icon.png" class="jifen-icon"></image>
<view class="col-text">积分详情</view>
<image src="../../images/arror-d.png" class="arror-r-icon"></image>
</view> -->
</view>
</view>
<view class="myjoin-box">
<view class="t-word">我参与的</view>
<scroll-view class="scroll-view_H" scroll-x="true" v-if="userInfo.memberStudyVo.courseDtos && userInfo.memberStudyVo.courseDtos.length > 0">
<view class="course-box"
v-for="(item,index) in userInfo.memberStudyVo.courseDtos" :key="index"
@click="toCourseDetail(item.id)">
<view class="course-info">
<view class="course-name line1">{{item.courseName}}</view>
<view class="time">{{item.courseStartTime.split(' ')[0]}}~{{item.courseEndTime.split(' ')[0]}}</view>
</view>
<view class="address-box acea-row row-between row-middle">
<view class="address line1">地点：{{item.coursePlace}}</view>
<!-- <view class="btn" @click.stop="startQr()" v-if="item.signState == 2">扫一扫</view> -->
<view class="btn" v-if="item.signState == 1">已签到</view>
</view>
</view>
</scroll-view>
<view class="bangdan-box" v-if="userInfo.memberStudyVo.studyListDtos && userInfo.memberStudyVo.studyListDtos.length > 0">
<view class="bangdan-list">
<scroll-view class="scroll-view_H" scroll-x="true">
<view class="bangdan-item" v-for="(item,index) in userInfo.memberStudyVo.studyListDtos" :key="index">
<view class="bangdan-name">{{item.listName}}</view>
<view class="acea-row row-between-wrapper">
<view class="signin-day">已连续{{item.signTimes}}天</view>
<view class="signin-btn" @click="toStudyDabang(item)">{{item.enterState ? '已打卡' : '立即打卡'}}</view>
</view>
</view>
</scroll-view>
</view>
</view>
</view>
<view class="wrapper">
<!-- <view class="nav acea-row row-middle">
<view @click="goUserAccount()" class="item">
<text>我的余额</text>
<text class="num">{{ userInfo.nowMoney || 0 }}</text>
</view>
<view @click="goUserPromotion()" class="item" v-if="userInfo.isPromoter === 1 || userInfo.statu === 2">
<text>当前佣金</text>
<text class="num">{{ userInfo.brokeragePrice || 0 }}</text>
</view>
<view @click="goIntegral()" class="item" v-else>
<text>当前积分</text>
<text class="num">{{ userInfo.integral || 0 }}</text>
</view>
<view @click="goUserCoupon()" class="item">
<text>优惠券</text>
<text class="num">{{ userInfo.couponCount || 0 }}</text>
</view>
</view> -->
<view class="myOrder">
<view class="title acea-row row-between-wrapper">
<text>我的订单</text>
<text @click="goMyOrder()" class="allOrder">
<text>全部订单</text>
<text class="iconfont icon-jiantou"></text>
</text>
</view>
<view class="orderState acea-row row-middle">
<view @click="goMyOrder(0)" class="item">
<view class="pictrue">
<!-- <image :src="`${$VUE_APP_RESOURCES_URL}/images/dfk.png`" /> -->
<image src="../../../static/myorder-icon1.png" />
<text class="order-status-num" v-if="userInfo.orderStatusNum.unpaidCount > 0">
{{ userInfo.orderStatusNum.unpaidCount }}
</text>
</view>
<view>待付款</view>
</view>
<view @click="goMyOrder(1)" class="item">
<view class="pictrue">
<image src="../../../static/myorder-icon2.png" />
<text class="order-status-num" v-if="userInfo.orderStatusNum.unshippedCount > 0">
{{ userInfo.orderStatusNum.unshippedCount }}
</text>
</view>
<view>待发货</view>
</view>
<view @click="goMyOrder(2)" class="item">
<view class="pictrue">
<image src="../../../static/myorder-icon3.png" />
<text class="order-status-num" v-if="userInfo.orderStatusNum.receivedCount > 0">
{{ userInfo.orderStatusNum.receivedCount }}
</text>
</view>
<text>待收货</text>
</view>
<view @click="goMyOrder(3)" class="item">
<view class="pictrue">
<image src="../../../static/myorder-icon4.png" />
<text class="order-status-num" v-if="userInfo.orderStatusNum.evaluatedCount > 0">{{ userInfo.orderStatusNum.evaluatedCount }}</text>
</view>
<text>待评价</text>
</view>
<view @click="goReturnList()" class="item">
<view class="pictrue">
<image src="../../../static/myorder-icon5.png" />
<text class="order-status-num" v-if="userInfo.orderStatusNum.refundCount > 0">{{ userInfo.orderStatusNum.refundCount }}</text>
</view>
<text>售后/退款</text>
</view>
</view>
</view>
<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 class="item" @click="goUserJoinUs()">
<view class="pictrue">
<image src="../../../static/user-menu4.png" />
</view>
<view class="cell">企业招聘</view>
<text class="iconfont icon-jiantou"></text>
</view> -->
<view class="item" @click="goAddressManagement()">
<view class="pictrue">
<image src="../../../static/user-menu5.png" />
</view>
<view class="cell">收货地址</view>
<text class="iconfont icon-jiantou"></text>
</view>
<view class="item noBorder" @click="toServiceIndex()">
<view class="pictrue">
<image src="../../../static/user-menu6.png" />
</view>
<view class="cell">我是服务老师</view>
<text class="iconfont icon-jiantou"></text>
</view>
<!-- <template v-for="(item, MyMenusIndex) in MyMenus">
<view class="item" :key="MyMenusIndex" @click="goPages(MyMenusIndex)">
<view class="pictrue">
<image :src="item.pic" />
</view>
<view class="cell">{{ item.name }}</view>
<text class="iconfont icon-jiantou"></text>
</view>
</template> -->
</view>
</view>
</view>
<!-- <SwitchWindow
v-on:changeswitch="changeswitch"
:switchActive="switchActive"
:login_type="userInfo.login_type"
></SwitchWindow>-->
</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'
import dayjs from 'dayjs'
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']),
startQr: function() {
uni.scanCode({
success: res => {
// let option = handleUrlParam(res.result)
let id = res.result;
signCourse(id).then((res)=>{
if(res.success){
uni.showModal({
title:'提示!',
content:'签到成功！您的座位号是' + res.data,
})
} else{
uni.showToast({
title:res.msg,
icon:'none',
duration:5000
})
}
})
},
})
},
call(){
uni.makePhoneCall({
phoneNumber: this.userInfo.sellerPhone || this.userInfo.customerPhone
})
},
toServiceIndex(){
this.$yrouter.push('/pages/serviceTeacher/index')
},
goUserCourse() {
this.$yrouter.push('/pages/user/myCourses/index')
},
goUserBangdan() {
this.$yrouter.push('/pages/user/myBangdan/index')
},
goUserFeedBack() {
this.$yrouter.push('/pages/user/feedBack/index')
},
goUserJoinUs() {
this.$yrouter.push('/pages/user/joinUs/index')
},
goReturnList() {
this.$yrouter.push('/pages/order/ReturnList/index')
},
goAddressManagement(){
this.$yrouter.push('/pagesB/pages/user/address/AddressManagement/index')
// this.$yrouter.push('/pagesB/pages/shop/Live/LiveList/index')
},
toCourseDetail(id){
this.$yrouter.push({
path: '/pages/course/detail',
query: {
id:id,
},
})
},
toStudyDabang(item){
if(item.enterState){
this.$yrouter.push({
path: '/pages/study/dabang',
query: {
id: item.id,
},
})
} else{
if(item.isClockTime){
this.$yrouter.push({
path: '/pages/study/editDabang',
query: {
id: item.id,
},
})
} else{
uni.showToast({
title:'未到打卡时间！',
icon:'none',
duration:2000
})
}
}
},
goMyOrder(type) {
this.$yrouter.push({
path: '/pages/order/MyOrder/index',
query: {
type,
},
})
},
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
// 判断一下这里是不是小程序 如果是小程序，走获取微信手机号进行绑定
console.log(e)
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();
console.log(res.data)
if(res.success){
thit.$store.commit('login', res.data.token, dayjs(res.data.expires_time))
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">
page{
background: #fff;
}
.header{
width: 100%;
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: #222;
font-weight: bold;
}
.member{
padding: 0 6rpx;
background: linear-gradient(180deg, #FFCF61 0%, #FCA333 100%);
}
}
.binding{
background: #BF922B !important;
border-color: #BF922B !important;
}
}
.jifen-box{
width: 176rpx;
height: 50rpx;
background: #FF4444;
border-top-left-radius: 20rpx;
border-bottom-left-radius: 20rpx;
position: absolute;
right: 0rpx;
top: 50%;
margin-top: -25rpx;
z-index: 4;
color: #fff;
font-size: 24rpx;
display: flex;
align-items: center;
justify-content: center;
image{
width: 32rpx;
height: 32rpx;
margin-right: 10rpx;
}
}
}
.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;
}
}
}
.panel-box{
width: 100%;
height: 376rpx;
position: relative;
margin-top: 32rpx;
.panel-bg{
width: 688rpx;
height: 376rpx;
position: absolute;
left: 50%;
top: 0;
margin-left: -344rpx;
}
.panel-content{
width: 688rpx;
height: 376rpx;
position: absolute;
left: 50%;
top: 0;
margin-left: -344rpx;
font-size: 28rpx;
color: #C89560;
padding: 32rpx 0;
}
.panel-btn{
width: 167rpx;
height: 54rpx;
background: linear-gradient(180deg, #FFCC5D 0%, #FCA535 100%);
border-radius: 12rpx;
text-align: center;
line-height: 54rpx;
color: #fff;
font-size: 26rpx;
margin: 20rpx auto;
}
.profit-box,.sale-box{
width: 312rpx;
text-align: center;
}
.fz40{
font-size: 32rpx;
}
.mt20{
margin: 20rpx 0;
}
.col-line{
width: 2rpx;
height: 100%;
background: #fff;
}
.to-more-box{
width: 100rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.jifen-icon{
width: 37rpx;
height: 42rpx;
}
.col-text{
width: 30rpx;
margin: 4rpx 0;
}
.arror-r-icon{
width: 28rpx;
height: 16rpx;
}
}
.myjoin-box{
width: 100%;
// height: 506rpx;
background: #FFFFFF;
border-radius: 10rpx;
padding: 32rpx;
margin: 50rpx auto 0;
.t-word{
font-size: 32rpx;
color: #222;
font-weight: bold;
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: 370rpx;
height: 222rpx;
background: url(../../../static/bangdanbg.png) no-repeat;
background-size: 100% 100%;
box-sizing: border-box;
padding: 42rpx 30rpx;
color: #191919;
display: inline-block;
border-radius: 10rpx;
font-size: 28rpx;
margin-right: 20rpx;
.bangdan-name{
margin-bottom: 46rpx;
font-weight: bold;
}
.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: #fff;
font-size: 24rpx;
}
}
}
}
.content{
padding-bottom: 100rpx;
}
.user .wrapper {
width: 100%;
background: #fff;
padding: 0 30rpx;
.myOrder{
width: 100%;
.title{
padding: 0 !important;
font-size: 32rpx;
color: #222;
font-weight: bold;
}
}
}
.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>