78 changed files with 4570 additions and 699 deletions
@ -0,0 +1,78 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
/** |
||||||
|
* 完善资料 |
||||||
|
*/ |
||||||
|
export function editSelfData(data) { |
||||||
|
return request.post("/user/sellerActive", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取会员管理列表 |
||||||
|
*/ |
||||||
|
export function getSellerMembers(data) { |
||||||
|
return request.post("/user/sellerMembers", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取会员管理列表 |
||||||
|
*/ |
||||||
|
export function getMembersList(data) { |
||||||
|
return request.post("/user/getSellerMembersByLevel"); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 课程添加会员 |
||||||
|
*/ |
||||||
|
export function addMembers(data) { |
||||||
|
return request.post("/user/addMembers",data); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 获取会员等级列表 |
||||||
|
*/ |
||||||
|
export function getMyMemberLevels(data) { |
||||||
|
return request.get("/user/getMyMemberLevels"); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 获取会员详情 |
||||||
|
*/ |
||||||
|
export function getMemberDetail(data) { |
||||||
|
return request.post("/user/sellerMembersDetail", data); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/** |
||||||
|
* 获取课程管理列表 |
||||||
|
*/ |
||||||
|
export function sellerCourses(data) { |
||||||
|
return request.post("/user/sellerCourses", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取课程详情 |
||||||
|
*/ |
||||||
|
export function getCourseDetail(data) { |
||||||
|
return request.get("/user/sellerCoursesDetail?id="+data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 设置座位 |
||||||
|
*/ |
||||||
|
export function setMemberSeat(data) { |
||||||
|
return request.post("/user/addMembersCourseSeat",data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 发送验证码 |
||||||
|
*/ |
||||||
|
export function getVerificationCode(data) { |
||||||
|
return request.post("/user/getVerificationCode",data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取会员榜单日记 |
||||||
|
*/ |
||||||
|
export function myMemberStudylist(data) { |
||||||
|
return request.post("/user/myMemberStudylist", data); |
||||||
|
} |
||||||
@ -0,0 +1,163 @@ |
|||||||
|
<template> |
||||||
|
<view class="unlock-box"> |
||||||
|
<view class="lock-list acea-row row-between"> |
||||||
|
<view class="lock-item" :class="active == 0 ? 'lock-item-active' : ''" @click="tabClick(0)" v-if="chargeType == 1"> |
||||||
|
<view>解锁单篇文章</view> |
||||||
|
<view class="price"><text>￥</text>{{articleCharge}}</view> |
||||||
|
<view class="sm-word line1">{{articleName}}</view> |
||||||
|
<view class="sm-word">永久阅读权</view> |
||||||
|
</view> |
||||||
|
<view class="lock-item" :class="active == 0 ? 'lock-item-active' : ''" @click="tabClick(0)" v-if="chargeType == 2"> |
||||||
|
<view>解锁单篇文章</view> |
||||||
|
<view class="price">{{articleCharge}}<text>积分</text></view> |
||||||
|
<view class="sm-word line1">{{articleName}}</view> |
||||||
|
<view class="sm-word">永久阅读权</view> |
||||||
|
</view> |
||||||
|
<view class="lock-item" :class="active == 1 ? 'lock-item-active' : ''" @click="tabClick(1)"> |
||||||
|
<view>解锁所有文章</view> |
||||||
|
<view class="price"><text>￥</text>{{total}}</view> |
||||||
|
<view class="sm-word">海量文章永久畅读</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="submit-btn" @click="submitClick">确认支付</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { getUnlockAllArticlePrice, unlockArticle } from '@/api/knowledge'; |
||||||
|
export default{ |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
id:'', |
||||||
|
articleName:'', |
||||||
|
active: 0, |
||||||
|
total:0, |
||||||
|
chargeType:0, |
||||||
|
articleCharge:0, |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(){ |
||||||
|
this.id = this.$yroute.query.id; |
||||||
|
this.articleName = this.$yroute.query.name; |
||||||
|
this.chargeType = this.$yroute.query.chargeType; |
||||||
|
this.articleCharge = this.$yroute.query.articleCharge; |
||||||
|
getUnlockAllArticlePrice().then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
this.total = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
tabClick(idx){ |
||||||
|
this.active = idx |
||||||
|
}, |
||||||
|
submitClick(){ |
||||||
|
let data = {}; |
||||||
|
let that = this; |
||||||
|
if(this.active == 0){ |
||||||
|
data.articleId = this.id; |
||||||
|
data.isLockAll = false |
||||||
|
} else{ |
||||||
|
data.isLockAll = true |
||||||
|
} |
||||||
|
uni.showModal({ |
||||||
|
title: '提示', |
||||||
|
content: '是否确认支付？', |
||||||
|
success: function (res) { |
||||||
|
if (res.confirm) { |
||||||
|
unlockArticle(data).then((response)=>{ |
||||||
|
if(response.success){ |
||||||
|
// console.log(response.data.result.jsConfig)? |
||||||
|
// return |
||||||
|
let orderInfo = response.data.result.jsConfig; |
||||||
|
that.payment(orderInfo) |
||||||
|
} |
||||||
|
}) |
||||||
|
} else if (res.cancel) { |
||||||
|
console.log('用户点击取消'); |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
payment(orderInfo){ |
||||||
|
// 调用支付接口 |
||||||
|
uni.requestPayment({ |
||||||
|
provider: 'wxpay', |
||||||
|
...orderInfo, |
||||||
|
signType: 'MD5', |
||||||
|
success: success => { |
||||||
|
console.log(success) |
||||||
|
uni.showToast({ |
||||||
|
title: '支付成功', |
||||||
|
icon: 'success', |
||||||
|
duration: 3000, |
||||||
|
}) |
||||||
|
let time = setTimeout(() => { |
||||||
|
clearTimeout(time) |
||||||
|
uni.navigateBack({ |
||||||
|
delta:1 |
||||||
|
}) |
||||||
|
}, 3000) |
||||||
|
}, |
||||||
|
fail: error => { |
||||||
|
console.log(error) |
||||||
|
if (error.errMsg == 'requestPayment:fail cancel') { |
||||||
|
uni.showToast({ title: '已取消支付', icon: 'none', duration: 5000 }) |
||||||
|
} else { |
||||||
|
uni.showToast({ title: error || error.msg, icon: 'none', duration: 5000 }) |
||||||
|
} |
||||||
|
}, |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped lang="less"> |
||||||
|
.unlock-box{ |
||||||
|
width: 100%; |
||||||
|
min-height: 100%; |
||||||
|
background: #fff; |
||||||
|
padding: 30rpx; |
||||||
|
.lock-list{ |
||||||
|
.lock-item{ |
||||||
|
width: 340rpx; |
||||||
|
height: 324rpx; |
||||||
|
background: #F4F4F4; |
||||||
|
color: #222; |
||||||
|
font-size: 32rpx; |
||||||
|
padding-top: 60rpx; |
||||||
|
padding-left: 40rpx; |
||||||
|
.price{ |
||||||
|
font-size: 60rpx; |
||||||
|
color: #EB5744; |
||||||
|
line-height: 82rpx; |
||||||
|
margin: 10rpx 0; |
||||||
|
text{ |
||||||
|
font-size: 40rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.sm-word{ |
||||||
|
font-size: 24rpx; |
||||||
|
color: #666666; |
||||||
|
} |
||||||
|
} |
||||||
|
.lock-item-active{ |
||||||
|
|
||||||
|
background: #FDFBEB; |
||||||
|
border: 3rpx solid #FFC46B; |
||||||
|
} |
||||||
|
} |
||||||
|
.submit-btn{ |
||||||
|
width: 340rpx; |
||||||
|
height: 80rpx; |
||||||
|
text-align: center; |
||||||
|
line-height: 80rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
color: #fff; |
||||||
|
background: #F99C10; |
||||||
|
border-radius: 44rpx; |
||||||
|
margin: 72rpx auto; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,355 @@ |
|||||||
|
<template> |
||||||
|
<view class="member-box"> |
||||||
|
<view class="search-box"> |
||||||
|
<view class="search-input-box acea-row row-middle"> |
||||||
|
<text class="iconfont icon-xiazai5"></text> |
||||||
|
<input type="text" placeholder="请输入会员真实姓名" v-model="keyWord" @input="search"> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<uni-collapse accordion="true"> |
||||||
|
<uni-collapse-item title="会员列表" showAnimation="true" open="true" style="border-top: 1px solid #f3f3f3;"> |
||||||
|
<view style="padding: 20rpx;"> |
||||||
|
<view class="checkAll-box acea-row row-middle"> |
||||||
|
<checkbox-group @change="allChoose"> |
||||||
|
<label class="acea-row row-middle"> |
||||||
|
<checkbox value="all" :checked="allChecked?true:false" style="transform:scale(0.7);" |
||||||
|
color="#fff" /> |
||||||
|
<text>全选</text> |
||||||
|
</label> |
||||||
|
</checkbox-group> |
||||||
|
</view> |
||||||
|
<view class="member-list"> |
||||||
|
<checkbox-group @change="changeCheckbox"> |
||||||
|
<label class="member-item acea-row row-middle" v-for="item in memberList" :key="item.value" > |
||||||
|
<checkbox |
||||||
|
:value="JSON.stringify(item)" |
||||||
|
:checked="checkedArr.includes(JSON.stringify(item))" |
||||||
|
style="transform:scale(0.7);" |
||||||
|
color="#fff" class="member-item acea-row row-middle"></checkbox> |
||||||
|
<view class="img-box"> |
||||||
|
<image :src="item.avatar"></image> |
||||||
|
</view> |
||||||
|
<view class="memberInfo-box"> |
||||||
|
<view class="name">{{item.realName}}</view> |
||||||
|
<view class="jifen">{{item.level}}级会员</view> |
||||||
|
</view> |
||||||
|
</label> |
||||||
|
</checkbox-group> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</uni-collapse-item> |
||||||
|
</uni-collapse> |
||||||
|
<view class="footer-box"> |
||||||
|
<view class="selected-box acea-row row-middle"> |
||||||
|
<!-- <image :src="item.avatar" mode="" ></image> --> |
||||||
|
<view class="member-name-box" v-for="(item,index) in checkedAllArr" :key="index"> |
||||||
|
<text>{{item.realName}}</text> |
||||||
|
<view class="close" @click="delSelect(item)">×</view> |
||||||
|
</view> |
||||||
|
<text>已选择{{checkedAllArr.length}}名会员</text> |
||||||
|
</view> |
||||||
|
<view class="submit-btn" @click="submitAdd">确认添加</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
getMyMemberLevels, |
||||||
|
getSellerMembers, |
||||||
|
addMembers |
||||||
|
} from "@/api/serverTeacher" |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
keyWord:'', |
||||||
|
searchType:false, |
||||||
|
courseId: '', |
||||||
|
isChecked: false, |
||||||
|
levelList: [], |
||||||
|
checkedArr: [], //复选框选中的值 |
||||||
|
allChecked: false, //是否全选 |
||||||
|
checkedAllArr: [], //所有选中 |
||||||
|
memberList: [], |
||||||
|
showMask: false |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
this.courseId = this.$yroute.query.id; |
||||||
|
this.getSellerMembers() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
search(){ |
||||||
|
console.log(this.checkedAllArr) |
||||||
|
let arr = [] |
||||||
|
this.checkedAllArr.forEach((item)=>{ |
||||||
|
arr.push(JSON.stringify(item)) |
||||||
|
}) |
||||||
|
this.checkedArr = arr; |
||||||
|
if(this.keyWord == '') { |
||||||
|
this.searchType = false; |
||||||
|
} else{ |
||||||
|
this.searchType = true; |
||||||
|
} |
||||||
|
this.getSellerMembers() |
||||||
|
}, |
||||||
|
getSellerMembers() { |
||||||
|
getSellerMembers({courseId:this.courseId,realName:this.keyWord}).then(res => { |
||||||
|
if (res.success) { |
||||||
|
this.memberList = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
//删除选中 |
||||||
|
delSelect(item){ |
||||||
|
let info = JSON.stringify(item); |
||||||
|
let sele = item; |
||||||
|
this.checkedArr.splice(this.checkedArr.findIndex(item => item === info), 1); |
||||||
|
this.checkedAllArr.splice(this.checkedAllArr.findIndex(item => item === sele), 1); |
||||||
|
}, |
||||||
|
// 全选事件 |
||||||
|
allChoose(e){ |
||||||
|
let chooseItem = e.detail.value; |
||||||
|
// 全选 |
||||||
|
if(chooseItem[0]=='all'){ |
||||||
|
this.allChecked=true; |
||||||
|
for(let item of this.memberList){ |
||||||
|
let itemVal = JSON.stringify(item); |
||||||
|
if(!this.checkedArr.includes(itemVal)){ |
||||||
|
var arr = []; |
||||||
|
this.checkedArr.push(itemVal); |
||||||
|
this.checkedArr.forEach((item)=>{ |
||||||
|
arr.push(JSON.parse(item)) |
||||||
|
}) |
||||||
|
this.checkedAllArr = arr; |
||||||
|
} |
||||||
|
} |
||||||
|
}else{ |
||||||
|
// 取消全选 |
||||||
|
this.allChecked=false; |
||||||
|
this.checkedArr=[]; |
||||||
|
this.checkedAllArr = []; |
||||||
|
} |
||||||
|
}, |
||||||
|
// 多选复选框改变事件 |
||||||
|
changeCheckbox(e) { |
||||||
|
this.checkedArr = e.detail.value; |
||||||
|
let arr = [] |
||||||
|
this.checkedArr.forEach((item)=>{ |
||||||
|
arr.push(JSON.parse(item)) |
||||||
|
}) |
||||||
|
if(this.searchType){ |
||||||
|
let temp = this.checkedAllArr; |
||||||
|
temp.push(...arr); |
||||||
|
let obj = {}; |
||||||
|
this.checkedAllArr = temp.reduce((cur,next) => { |
||||||
|
obj[next.uid] ? "" : obj[next.uid] = true && cur.push(next); |
||||||
|
return cur; |
||||||
|
},[]) |
||||||
|
} else{ |
||||||
|
this.checkedAllArr = arr; |
||||||
|
} |
||||||
|
|
||||||
|
// 如果选择的数组中有值，并且长度等于列表的长度，就是全选 |
||||||
|
if (this.checkedArr.length > 0 && this.checkedArr.length == this.memberList.length) { |
||||||
|
this.allChecked = true; |
||||||
|
} else { |
||||||
|
this.allChecked = false; |
||||||
|
} |
||||||
|
}, |
||||||
|
submitAdd(){ |
||||||
|
let data = { |
||||||
|
courseId: this.courseId, |
||||||
|
memberIds: this.checkedAllArr |
||||||
|
} |
||||||
|
if(this.checkedAllArr.length == 0){ |
||||||
|
uni.showToast({ |
||||||
|
title:'请选择至少选择一个会员', |
||||||
|
icon:'none', |
||||||
|
duration:2000 |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
addMembers(data).then((res)=>{ |
||||||
|
console.log('res',res) |
||||||
|
if(res.success){ |
||||||
|
uni.showToast({ |
||||||
|
title: "添加成功！" |
||||||
|
}) |
||||||
|
this.getSellerMembers(); |
||||||
|
this.checkedArr = []; |
||||||
|
this.checkedAllArr = []; |
||||||
|
} else{ |
||||||
|
uni.showToast({ |
||||||
|
title: res.msg, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.member-box { |
||||||
|
width: 100%; |
||||||
|
padding-bottom: 350rpx; |
||||||
|
.search-box { |
||||||
|
background: #fff; |
||||||
|
width: 100%; |
||||||
|
padding: 20rpx 30rpx; |
||||||
|
|
||||||
|
.search-input-box { |
||||||
|
width: 100%; |
||||||
|
height: 70rpx; |
||||||
|
background: #F2F2F2; |
||||||
|
font-size: 28rpx; |
||||||
|
color: #999999; |
||||||
|
border-radius: 25px; |
||||||
|
padding-left: 26rpx; |
||||||
|
input{ |
||||||
|
width: 70%; |
||||||
|
height: 100%; |
||||||
|
margin-left: 20rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.checkAll-box { |
||||||
|
margin-bottom: 20rpx; |
||||||
|
} |
||||||
|
.member-list { |
||||||
|
.member-item { |
||||||
|
position: relative; |
||||||
|
background: #fff; |
||||||
|
padding: 28rpx 20rpx 10rpx; |
||||||
|
border-radius: 10rpx; |
||||||
|
margin-bottom: 20rpx; |
||||||
|
.img-box { |
||||||
|
width: 100rpx; |
||||||
|
height: 100rpx; |
||||||
|
margin: 0 20rpx; |
||||||
|
margin-top: -20rpx; |
||||||
|
image { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
border-radius: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.memberInfo-box { |
||||||
|
font-size: 28rpx; |
||||||
|
color: #222; |
||||||
|
margin-top: -20rpx; |
||||||
|
|
||||||
|
.jifen { |
||||||
|
font-size: 24rpx; |
||||||
|
color: #fff; |
||||||
|
// padding:0 10rpx; |
||||||
|
text-align: center; |
||||||
|
width: 110rpx; |
||||||
|
padding: 0 10rpx; |
||||||
|
margin-top: 10rpx; |
||||||
|
box-sizing: content-box; |
||||||
|
height: 36rpx; |
||||||
|
line-height: 36rpx; |
||||||
|
background: linear-gradient(180deg, #FFCF61 0%, #FCA333 100%); |
||||||
|
box-shadow: 0px 4rpx 8rpx 0rpx rgba(253, 169, 57, 0.19); |
||||||
|
border-radius: 20rpx 20rpx 20rpx 0px; |
||||||
|
} |
||||||
|
|
||||||
|
.record-box { |
||||||
|
margin-top: 22rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.course-record { |
||||||
|
color: #666; |
||||||
|
font-size: 28rpx; |
||||||
|
margin-right: 60rpx; |
||||||
|
|
||||||
|
image { |
||||||
|
width: 24rpx; |
||||||
|
height: 24rpx; |
||||||
|
margin-right: 8rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.call-btn { |
||||||
|
position: absolute; |
||||||
|
right: 28rpx; |
||||||
|
top: 28rpx; |
||||||
|
width: 120rpx; |
||||||
|
height: 60rpx; |
||||||
|
line-height: 60rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
color: #fff; |
||||||
|
text-align: center; |
||||||
|
background: #F4C076; |
||||||
|
border-radius: 30rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
/deep/.uni-collapse-cell__title { |
||||||
|
background: #fff !important; |
||||||
|
} |
||||||
|
|
||||||
|
.footer-box { |
||||||
|
background: #fff; |
||||||
|
padding: 44rpx; |
||||||
|
position: fixed; |
||||||
|
bottom: 0; |
||||||
|
left: 0; |
||||||
|
width: 100%; |
||||||
|
|
||||||
|
.selected-box { |
||||||
|
font-size: 28rpx; |
||||||
|
color: #999; |
||||||
|
.member-name-box{ |
||||||
|
position: relative; |
||||||
|
padding: 10rpx 16rpx; |
||||||
|
font-size: 24rpx; |
||||||
|
border: 1px solid #FDBF68; |
||||||
|
color: #FDBF68; |
||||||
|
border-radius: 6rpx; |
||||||
|
margin-right: 10rpx; |
||||||
|
margin-bottom: 10rpx; |
||||||
|
.close{ |
||||||
|
font-size: 28rpx; |
||||||
|
position: absolute; |
||||||
|
top: -20rpx; |
||||||
|
right: -10rpx; |
||||||
|
width: 30rpx; |
||||||
|
height: 30rpx; |
||||||
|
border-radius: 25px; |
||||||
|
color: #fff; |
||||||
|
background: #FDBF68; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
} |
||||||
|
image { |
||||||
|
width: 60rpx; |
||||||
|
height: 60rpx; |
||||||
|
margin-right: 10rpx; |
||||||
|
margin-bottom: 10rpx; |
||||||
|
border-radius: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.submit-btn { |
||||||
|
width: 646rpx; |
||||||
|
height: 80rpx; |
||||||
|
text-align: center; |
||||||
|
line-height: 80rpx; |
||||||
|
color: #fff; |
||||||
|
background: #FDBF68; |
||||||
|
border-radius: 44rpx; |
||||||
|
margin-top: 20rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,406 @@ |
|||||||
|
<template> |
||||||
|
<view class="index-box"> |
||||||
|
<view class="swiper-box"> |
||||||
|
<image :src="detail.imageArr[0]" mode="aspectFill"></image> |
||||||
|
</view> |
||||||
|
<view class="course-detail-box"> |
||||||
|
<view class="course-name-box acea-row row-middle"> |
||||||
|
<view class="state-box colY" v-if="detail.courseState == 0">未开始</view> |
||||||
|
<view class="state-box colG" v-if="detail.courseState == 1">进行中</view> |
||||||
|
<view class="state-box colR" v-if="detail.courseState == 2">已结束</view> |
||||||
|
<view class="state-box default" v-if="detail.courseState == 3">已取消</view> |
||||||
|
<view class="name">{{detail.courseName}}</view> |
||||||
|
</view> |
||||||
|
<view class="desc">{{detail.courseIntroduce}}</view> |
||||||
|
</view> |
||||||
|
<view class="course-active-box"> |
||||||
|
<view class="title-box acea-row row-middle">活动时间及地点</view> |
||||||
|
<view class="address-box acea-row row-middle"> |
||||||
|
<!-- <text class="iconfont icon-dizhi"></text> --> |
||||||
|
<image src="../../static/dizhi.png" mode=""></image> |
||||||
|
<text>{{detail.coursePlace}}</text> |
||||||
|
</view> |
||||||
|
<view class="address-box acea-row row-middle"> |
||||||
|
<!-- <text class="iconfont icon-shijian"></text> --> |
||||||
|
<image src="../../static/time.png" mode=""></image> |
||||||
|
<text>{{detail.courseStartTime}} 至 {{detail.courseEndTime}}</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="btn-box" :class="isFixedTop?'fixed':''"> |
||||||
|
<!-- <view class="btn-item"> |
||||||
|
<image src="../../static/message.png"></image> |
||||||
|
<text>一键通知</text> |
||||||
|
</view> --> |
||||||
|
<view class="btn-item" @click="submitPlace()" v-if="detail.seatArrange == 1"> |
||||||
|
<image src="../../static/success.png"></image> |
||||||
|
<text>保存座位</text> |
||||||
|
</view> |
||||||
|
<view class="btn-item" @click="toAddMemeber()"> |
||||||
|
<image src="../../static/addMenber.png"></image> |
||||||
|
<text>添加学员</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="member-list-box"> |
||||||
|
<view class="title-box acea-row row-between"> |
||||||
|
<view>学员列表（{{detail.courseMemberList.length || 0}}）</view> |
||||||
|
<view class="title-box-r"> |
||||||
|
<view @click="showSort = !this.showSort" class="acea-row row-middle"> |
||||||
|
<image src="../../static/sort-icon.png" mode="" style="width: 48rpx;height:48rpx;margin-right: 10rpx;"></image> |
||||||
|
<text>排序</text> |
||||||
|
</view> |
||||||
|
<view class="sort-box" v-if="showSort"> |
||||||
|
<view class="sort-item" :class="sortNum == 1 ? 'bgR' : ''" @click.stop="sortClick(1)">未安排/已安排</view> |
||||||
|
<view class="sort-item" :class="sortNum == 2 ? 'bgR' : ''" @click.stop="sortClick(2)">签到情况</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="member-list"> |
||||||
|
<view class="member-item" v-for="(item,index) in detail.courseMemberList" :key="index"> |
||||||
|
<view class="item-top acea-row row-between row-middle"> |
||||||
|
<view class="member-info acea-row row-middle"> |
||||||
|
<view class="img-box"><image :src="item.avatar" mode=""></image></view> |
||||||
|
<view class="name-box"> |
||||||
|
<view class="name">{{item.memberName}}</view> |
||||||
|
<view class="state" v-if="item.signState == 0">未签到</view> |
||||||
|
<view class="state colG" v-if="item.signState == 1">已签到</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="call" @click="call(item.memberPhone)">拨号</view> |
||||||
|
</view> |
||||||
|
<view class="item-btm acea-row row-middle"> |
||||||
|
<view class="dot"></view> |
||||||
|
<view class="mrl">座位安排</view> |
||||||
|
<input type="text" placeholder="请输入座位信息" :disabled="detail.seatArrange == 2" v-model="item.seat"> |
||||||
|
<!-- <view class="submit-btn">修改</view> --> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { getCourseDetail , setMemberSeat } from '@/api/serverTeacher' |
||||||
|
import { mapState, mapGetters, mapMutations, mapActions } from 'vuex' |
||||||
|
export default{ |
||||||
|
computed: mapGetters(['userInfo']), |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
id:'', |
||||||
|
tabInitTop:'', |
||||||
|
detail:{ |
||||||
|
courseStartTime:[], |
||||||
|
courseEndTime:[], |
||||||
|
}, |
||||||
|
isFixedTop:false, |
||||||
|
showSort:false, |
||||||
|
sortNum:null |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
//获取节点距离顶部的距离 |
||||||
|
uni.createSelectorQuery().select('.btn-box').boundingClientRect((res) => { |
||||||
|
if (res && res.top > 0) { |
||||||
|
var tabInitTop= res.top; |
||||||
|
this.tabInitTop= tabInitTop |
||||||
|
} |
||||||
|
}).exec(); |
||||||
|
this.id = this.$yroute.query.id; |
||||||
|
this.getDetail(); |
||||||
|
}, |
||||||
|
onShow(){ |
||||||
|
this.getDetail(); |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
sortClick(type){ |
||||||
|
this.sortNum = type |
||||||
|
console.log(type) |
||||||
|
}, |
||||||
|
onShareAppMessage: function(res) { |
||||||
|
return { |
||||||
|
title: this.detail.courseName, |
||||||
|
imageUrl:this.detail.imageArr[0], |
||||||
|
path: '/pages/course/detail?teacherId=' + this.userInfo.uid + '&courseId=' + this.id + '&validCode=' + this.detail.validCode, |
||||||
|
} |
||||||
|
}, |
||||||
|
onPageScroll(res) { |
||||||
|
let scrollTop = res.scrollTop; |
||||||
|
var isSatisfy = scrollTop >= this.tabInitTop? true : false; |
||||||
|
//只有处于吸顶的临界值才会不相等 |
||||||
|
if (this.isFixedTop === isSatisfy) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
this.isFixedTop = isSatisfy |
||||||
|
}, |
||||||
|
getDetail(){ |
||||||
|
getCourseDetail(this.id).then(res=>{ |
||||||
|
if(res.success){ |
||||||
|
this.detail = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
toAddMemeber(){ |
||||||
|
if(this.detail.courseState == 2 || this.detail.courseState == 3){ |
||||||
|
uni.showToast({ |
||||||
|
title:'课程已结束！', |
||||||
|
icon:'none' |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/serviceTeacher/addMember', |
||||||
|
query:{ |
||||||
|
id: this.id |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
submitPlace(){ |
||||||
|
let courseMemberList = this.detail.courseMemberList; |
||||||
|
if(this.detail.courseState == 2 || this.detail.courseState == 3){ |
||||||
|
uni.showToast({ |
||||||
|
title:'课程已结束！', |
||||||
|
icon:'none' |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
setMemberSeat(courseMemberList).then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
uni.showToast({ |
||||||
|
title:'操作成功！' |
||||||
|
}); |
||||||
|
this.getDetail() |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
call(phone){ |
||||||
|
uni.makePhoneCall({ |
||||||
|
phoneNumber:phone, |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.fixed{ |
||||||
|
position: -webkit-sticky; |
||||||
|
position: sticky; |
||||||
|
top: 0; |
||||||
|
z-index: 99; |
||||||
|
} |
||||||
|
.index-box{ |
||||||
|
padding-bottom: 100rpx; |
||||||
|
.swiper-box{ |
||||||
|
width: 100%; |
||||||
|
height: 340rpx; |
||||||
|
image{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
.course-detail-box{ |
||||||
|
width: 750rpx; |
||||||
|
background: #F7F8FC; |
||||||
|
border-radius: 60rpx 60rpx 0px 0px; |
||||||
|
padding: 46rpx 40rpx; |
||||||
|
margin-top: -55rpx; |
||||||
|
position: relative; |
||||||
|
.course-name-box{ |
||||||
|
margin-bottom: 24rpx; |
||||||
|
.state-box{ |
||||||
|
height: 44rpx; |
||||||
|
line-height: 44rpx; |
||||||
|
padding: 0rpx 6rpx; |
||||||
|
background: #F4C076; |
||||||
|
color: #fff; |
||||||
|
border-radius: 4rpx; |
||||||
|
font-size: 26rpx; |
||||||
|
margin-right: 26rpx; |
||||||
|
border-radius: 10rpx; |
||||||
|
} |
||||||
|
.name{ |
||||||
|
font-size: 40rpx; |
||||||
|
color: #333; |
||||||
|
} |
||||||
|
} |
||||||
|
.desc{ |
||||||
|
font-size: 24rpx; |
||||||
|
color: #333; |
||||||
|
line-height: 40rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.course-active-box{ |
||||||
|
background: #fff; |
||||||
|
padding: 56rpx 40rpx; |
||||||
|
font-size: 28rpx; |
||||||
|
.title-box{ |
||||||
|
font-weight: bold; |
||||||
|
margin-bottom: 30rpx; |
||||||
|
} |
||||||
|
.title-box::before{ |
||||||
|
content: ''; |
||||||
|
display: block; |
||||||
|
width: 6rpx; |
||||||
|
height: 28rpx; |
||||||
|
background: #F4C076; |
||||||
|
margin-right: 20rpx; |
||||||
|
} |
||||||
|
image{ |
||||||
|
width: 28rpx; |
||||||
|
height: 28rpx; |
||||||
|
margin-right: 20rpx; |
||||||
|
} |
||||||
|
.address-box{ |
||||||
|
margin-bottom: 10rpx; |
||||||
|
color: #222; |
||||||
|
} |
||||||
|
} |
||||||
|
.btn-box{ |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
justify-content: space-around; |
||||||
|
padding: 0rpx 0 40rpx; |
||||||
|
background: #fff; |
||||||
|
.btn-item{ |
||||||
|
width: 206rpx; |
||||||
|
height: 80rpx; |
||||||
|
padding:0 20rpx; |
||||||
|
background: #FFFFFF; |
||||||
|
border: 1px solid #E4E4E4; |
||||||
|
box-shadow: 0px 4px 8px rgba(240, 240, 240, 0.5); |
||||||
|
border-radius: 66rpx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: space-between; |
||||||
|
font-size: 28rpx; |
||||||
|
image{ |
||||||
|
width: 40rpx; |
||||||
|
height: 40rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.member-list-box{ |
||||||
|
width: 100%; |
||||||
|
padding: 0 20rpx; |
||||||
|
font-size: 28rpx; |
||||||
|
color: #222; |
||||||
|
.title-box{ |
||||||
|
margin: 40rpx 0 28rpx; |
||||||
|
.title-box-r{ |
||||||
|
position: relative; |
||||||
|
font-size: 28rpx; |
||||||
|
color: #222; |
||||||
|
.sort-box{ |
||||||
|
width: 230rpx; |
||||||
|
background: #fff; |
||||||
|
padding: 16rpx 20rpx 0; |
||||||
|
position: absolute; |
||||||
|
bottom: -150rpx; |
||||||
|
left: -180rpx; |
||||||
|
border-radius: 10rpx; |
||||||
|
box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.16); |
||||||
|
.sort-item{ |
||||||
|
padding: 0rpx; |
||||||
|
font-size: 20rpx; |
||||||
|
height: 42rpx; |
||||||
|
line-height: 42rpx; |
||||||
|
text-align: center; |
||||||
|
color: #B9B9B9; |
||||||
|
background: #F5F6F7; |
||||||
|
border-radius: 24rpx; |
||||||
|
margin-bottom: 16rpx; |
||||||
|
} |
||||||
|
.bgR{ |
||||||
|
background: #EB5744; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.member-list{ |
||||||
|
background-color: #fff; |
||||||
|
padding: 0 20rpx; |
||||||
|
border-radius: 20rpx; |
||||||
|
.member-item{ |
||||||
|
padding: 28rpx 0; |
||||||
|
.item-top{ |
||||||
|
image{ |
||||||
|
width: 144rpx; |
||||||
|
height: 144rpx; |
||||||
|
border-radius: 50px; |
||||||
|
margin-right: 20rpx; |
||||||
|
} |
||||||
|
.name{ |
||||||
|
font-size: 32rpx; |
||||||
|
line-height: 44rpx; |
||||||
|
margin-bottom: 12rpx; |
||||||
|
} |
||||||
|
.state{ |
||||||
|
width: 112rpx; |
||||||
|
height: 40rpx; |
||||||
|
background: #EB5744; |
||||||
|
border-radius: 23rpx; |
||||||
|
line-height: 40rpx; |
||||||
|
text-align: center; |
||||||
|
color: #fff; |
||||||
|
font-size: 24rpx; |
||||||
|
} |
||||||
|
.signIn-btn{ |
||||||
|
background: #67FC55; |
||||||
|
} |
||||||
|
|
||||||
|
.call{ |
||||||
|
width: 120rpx; |
||||||
|
height: 60rpx; |
||||||
|
line-height: 60rpx; |
||||||
|
text-align: center; |
||||||
|
background: #F4C076; |
||||||
|
border-radius: 30rpx; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
.item-btm{ |
||||||
|
width: 100%; |
||||||
|
height: 90rpx; |
||||||
|
border-radius: 10rpx; |
||||||
|
background: #F6F6F6; |
||||||
|
padding-left: 30rpx; |
||||||
|
margin-top: 50rpx; |
||||||
|
.dot{ |
||||||
|
width: 16rpx; |
||||||
|
height: 16rpx; |
||||||
|
background: #EB5744; |
||||||
|
border-radius: 50px; |
||||||
|
} |
||||||
|
.mrl{ |
||||||
|
margin: 0 40rpx 0 20rpx; |
||||||
|
} |
||||||
|
input{ |
||||||
|
width: 360rpx; |
||||||
|
} |
||||||
|
.submit-btn{ |
||||||
|
color: #EB5744; |
||||||
|
font-size: 28rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.default{ |
||||||
|
background: #B5B5B5 !important; |
||||||
|
color: #fff !important; |
||||||
|
} |
||||||
|
.colY{ |
||||||
|
background: #E8C77D !important; |
||||||
|
color: #fff !important; |
||||||
|
} |
||||||
|
.colG{ |
||||||
|
background: #A5CF70 !important; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
.colR{ |
||||||
|
background: #ED5E48 !important; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,195 @@ |
|||||||
|
<template> |
||||||
|
<view class="member-box"> |
||||||
|
<view class="search-box"> |
||||||
|
<view class="search-input-box acea-row row-middle"> |
||||||
|
<text class="iconfont icon-xiazai5"></text> |
||||||
|
<input type="text" placeholder="请输入课程名称"> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="tabs-box acea-row row-middle row-between"> |
||||||
|
<view class="tab-item" :class="active == 1 ? 'tab-item-active' : ''" @click="tabClick(1)">未完成</view> |
||||||
|
<view class="tab-item" :class="active == 2 ? 'tab-item-active' : ''" @click="tabClick(2)">已完成</view> |
||||||
|
</view> |
||||||
|
<view class="course-list-box"> |
||||||
|
<view class="course-item acea-row-nowrap row-between" |
||||||
|
v-for="(item,index) in courseList" |
||||||
|
:key="index" |
||||||
|
@click="toCourdeDetail(item.id)" |
||||||
|
> |
||||||
|
<view class="item-l"> |
||||||
|
<view class="name line1">{{item.courseName}}</view> |
||||||
|
<view class="desc line2">{{item.courseIntroduce}}</view> |
||||||
|
<view class="time">时间：{{(item.courseStartTime.split(' ')[0]).replace(/\-/g, '.')}} 至 {{(item.courseEndTime.split(' ')[0]).replace(/\-/g,'.')}}</view> |
||||||
|
<view class="time">地点：{{item.coursePlace}}</view> |
||||||
|
<view class="time">报名总人数：{{item.courseEnterPerson}}</view> |
||||||
|
</view> |
||||||
|
<view class="item-r acea-row row-column row-between"> |
||||||
|
<view class="img-box"> |
||||||
|
<image :src="item.imageArr[0]" mode="aspectFill"></image> |
||||||
|
</view> |
||||||
|
<view class="state-box"> |
||||||
|
<view class="tip">{{item.signedNum}}/{{item.realEnterPerson}}</view> |
||||||
|
<view class="handle-btn default" v-if="item.courseStateSeller == 0">未开始</view> |
||||||
|
<view class="handle-btn" v-if="item.courseStateSeller == 1">报名中</view> |
||||||
|
<view class="handle-btn" v-if="item.courseStateSeller == 2">签到中</view> |
||||||
|
<view class="handle-btn default" v-if="item.courseStateSeller == 3">已结束</view> |
||||||
|
<view class="handle-btn default" v-if="item.courseStateSeller == 4">已取消</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { sellerCourses } from "@/api/serverTeacher" |
||||||
|
export default{ |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
active: 1, |
||||||
|
courseList:[], |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
this.getList(); |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
getList(){ |
||||||
|
sellerCourses({type:this.active}).then((res)=>{ |
||||||
|
this.courseList = res.data |
||||||
|
}) |
||||||
|
}, |
||||||
|
tabClick(idx){ |
||||||
|
this.active = idx; |
||||||
|
this.getList(); |
||||||
|
}, |
||||||
|
toCourdeDetail(id){ |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/serviceTeacher/courseDetail', |
||||||
|
query:{ |
||||||
|
id: id |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.member-box{ |
||||||
|
width: 100%; |
||||||
|
.search-box{ |
||||||
|
background: #fff; |
||||||
|
width: 100%; |
||||||
|
padding: 20rpx 30rpx; |
||||||
|
.search-input-box{ |
||||||
|
width: 100%; |
||||||
|
height: 70rpx; |
||||||
|
background: #F2F2F2; |
||||||
|
font-size: 28rpx; |
||||||
|
color: #999999; |
||||||
|
border-radius: 25px; |
||||||
|
padding-left: 26rpx; |
||||||
|
.iconfont{ |
||||||
|
margin-right: 12rpx; |
||||||
|
} |
||||||
|
input{ |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.tabs-box{ |
||||||
|
border-top: 1px solid #d8d8d8; |
||||||
|
width: 100%; |
||||||
|
height: 90rpx; |
||||||
|
padding: 0 122rpx; |
||||||
|
background-color: #fff; |
||||||
|
color: #999; |
||||||
|
font-size: 32rpx; |
||||||
|
.tab-item{ |
||||||
|
height: 100%; |
||||||
|
line-height: 90rpx; |
||||||
|
border-bottom: 6rpx solid #fff; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
.tab-item-active{ |
||||||
|
color: #222; |
||||||
|
height: 100%; |
||||||
|
line-height: 90rpx; |
||||||
|
border-bottom: 4rpx solid #f4c076; |
||||||
|
font-weight: bold; |
||||||
|
} |
||||||
|
// .tab-item-active::after{ |
||||||
|
// content: ''; |
||||||
|
// display: block; |
||||||
|
// width: 124rpx; |
||||||
|
// height: 6rpx; |
||||||
|
// background: #F4C076; |
||||||
|
// border-radius: 3rpx; |
||||||
|
// position: absolute; |
||||||
|
// bottom: 0; |
||||||
|
// } |
||||||
|
} |
||||||
|
.course-list-box{ |
||||||
|
width: 100%; |
||||||
|
padding: 20rpx; |
||||||
|
.course-item{ |
||||||
|
width: 100%; |
||||||
|
padding: 24rpx; |
||||||
|
background: #fff; |
||||||
|
border-radius: 10rpx; |
||||||
|
margin-bottom: 22rpx; |
||||||
|
.item-l{ |
||||||
|
width: 70%; |
||||||
|
font-size: 28rpx; |
||||||
|
color: #222; |
||||||
|
.name{ |
||||||
|
font-size: 32rpx; |
||||||
|
color: #333; |
||||||
|
line-height: 44rpx; |
||||||
|
font-weight: bold; |
||||||
|
} |
||||||
|
.desc{ |
||||||
|
color: #999; |
||||||
|
line-height: 36rpx; |
||||||
|
margin-top: 20rpx; |
||||||
|
margin-bottom: 60rpx; |
||||||
|
} |
||||||
|
.time{ |
||||||
|
line-height: 34rpx; |
||||||
|
margin-bottom: 4rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.item-r{ |
||||||
|
image{ |
||||||
|
width: 180rpx; |
||||||
|
height: 180rpx; |
||||||
|
border-radius: 12rpx; |
||||||
|
} |
||||||
|
.tip{ |
||||||
|
width: 156rpx; |
||||||
|
font-size: 24rpx; |
||||||
|
color: #786133; |
||||||
|
text-align: center; |
||||||
|
margin: 20rpx 0 0; |
||||||
|
} |
||||||
|
.handle-btn{ |
||||||
|
width: 156rpx; |
||||||
|
height: 60rpx; |
||||||
|
background: #FEF2D9; |
||||||
|
border-radius: 12rpx; |
||||||
|
text-align: center; |
||||||
|
line-height: 60rpx; |
||||||
|
color: #786133; |
||||||
|
font-size: 32rpx; |
||||||
|
margin: 0rpx auto; |
||||||
|
} |
||||||
|
.default{ |
||||||
|
background: #F6F6F6; |
||||||
|
color: #666; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,121 @@ |
|||||||
|
<template> |
||||||
|
<view class="index-box"> |
||||||
|
<view class="back-home-btn" @click="toUserIndex"><image src="../../static/backhome-icon.png" ></image></view> |
||||||
|
<view class="userInfo-box acea-row row-column row-center-wrapper"> |
||||||
|
<view class="headerimg-box"> |
||||||
|
<image :src="userInfo.avatar" mode="aspectFill" v-if="userInfo.isPromoter == 0"></image> |
||||||
|
<image :src="userInfo.workPhoto" mode="aspectFill" v-else></image> |
||||||
|
</view> |
||||||
|
<view class="name">{{userInfo.realName || userInfo.nickname}}</view> |
||||||
|
<text class="iconfont icon-bianji1" @click.stop="eidtInfo()"></text> |
||||||
|
</view> |
||||||
|
<view class="btn-box acea-row row-center row-middle" @click="toSetSelfData" v-if="userInfo.isPromoter == 0">请先完善个人信息</view> |
||||||
|
<view class="btn-box acea-row row-center row-middle" @click="toCourseManagement" v-if="userInfo.isPromoter == 1"> |
||||||
|
<image src="../../static/kecheng-icon.png" mode=""></image> |
||||||
|
<text>课程管理</text> |
||||||
|
</view> |
||||||
|
<view class="btn-box acea-row row-center row-middle" @click="toMemberManagement" v-if="userInfo.isPromoter == 1"> |
||||||
|
<image src="../../static/vipmanage-icon.png" mode=""></image> |
||||||
|
<text>会员管理</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { mapState, mapGetters, mapMutations, mapActions } from 'vuex' |
||||||
|
import { getUserInfo, getMenuUser, bindingPhone, wxappBindingPhone } from '@/api/user' |
||||||
|
export default{ |
||||||
|
computed: mapGetters(['userInfo']), |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(){ |
||||||
|
console.log(this.userInfo) |
||||||
|
}, |
||||||
|
|
||||||
|
methods:{ |
||||||
|
toUserIndex () { |
||||||
|
this.$yrouter.switchTab({ |
||||||
|
path: '/pages/home/index', |
||||||
|
}) |
||||||
|
}, |
||||||
|
eidtInfo(){ |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/serviceTeacher/setSelfData' |
||||||
|
}) |
||||||
|
}, |
||||||
|
toSetSelfData(){ |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/serviceTeacher/setSelfData' |
||||||
|
}) |
||||||
|
}, |
||||||
|
toCourseManagement(){ |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/serviceTeacher/courseManagement' |
||||||
|
}) |
||||||
|
}, |
||||||
|
toMemberManagement(){ |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/serviceTeacher/memberManagement' |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scope> |
||||||
|
.index-box{ |
||||||
|
width: 100%; |
||||||
|
height: 100vh; |
||||||
|
background: #F5F6F7; |
||||||
|
font-size: 32rpx; |
||||||
|
color: #222; |
||||||
|
position: relative; |
||||||
|
background: url(https://www.cyjyyjy.com:8081/static/teacher-index-bg.png); |
||||||
|
background-size: cover; |
||||||
|
.back-home-btn{ |
||||||
|
width: 80rpx; |
||||||
|
height: 80rpx; |
||||||
|
position: absolute; |
||||||
|
right: 30rpx; |
||||||
|
top: 30rpx; |
||||||
|
image{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
.userInfo-box{ |
||||||
|
.headerimg-box{ |
||||||
|
width: 156rpx; |
||||||
|
height: 156rpx; |
||||||
|
border-radius: 50px; |
||||||
|
border: 8rpx solid #d9d9d9; |
||||||
|
overflow: hidden; |
||||||
|
margin: 150rpx 0 30rpx; |
||||||
|
image{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
border-radius: 50rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.name{ |
||||||
|
margin-bottom: 12rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.btn-box{ |
||||||
|
width: 590rpx; |
||||||
|
height: 264rpx; |
||||||
|
background-color: #fff; |
||||||
|
border-radius: 10rpx; |
||||||
|
font-size: 38rpx; |
||||||
|
margin: 60rpx auto; |
||||||
|
image{ |
||||||
|
width: 104rpx; |
||||||
|
height: 104rpx; |
||||||
|
margin-right: 40rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,203 @@ |
|||||||
|
<template> |
||||||
|
<view class="dabang-index"> |
||||||
|
<view class="top-box"> |
||||||
|
<view class="dabang-name">{{studyListDto.listName}}</view> |
||||||
|
<view class="time-box acea-row row-column"> |
||||||
|
<text>时间：{{studyListDto.listStartTime.split(' ')[0]}} 至 {{studyListDto.listEndTime.split(' ')[0]}}（共{{studyListDto.clockTimes}}天）</text> |
||||||
|
<text>进行中：{{studyListDto.signTimes}}/{{studyListDto.clockTimes}}</text> |
||||||
|
<view class="sanjiao"></view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<!-- <view class="join-num">参与人数：{{detail.enterNum}}人</view> --> |
||||||
|
<!-- 打榜分享 --> |
||||||
|
<view class="dabang-share-box"> |
||||||
|
<view class="dabang-share-item" v-for="(item,index) in dataList" :key="index"> |
||||||
|
<view class="user-info-box acea-row row-middle"> |
||||||
|
<view class="header-img"> |
||||||
|
<image :src="item.avatar" mode=""></image> |
||||||
|
</view> |
||||||
|
<view class="acea-row row-column row-center"> |
||||||
|
<view class="name">{{item.realName}}</view> |
||||||
|
<view class="create-time">{{item.recordTime}}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="share-word"> |
||||||
|
{{item.content}} |
||||||
|
</view> |
||||||
|
<view class="img-box acea-row"> |
||||||
|
<image :src="imgUrl" mode="aspectFill" v-for="(imgUrl,idx) in item.imgPaths" :key="idx"></image> |
||||||
|
</view> |
||||||
|
<view class="zan-box acea-row row-middle row-right" @click="voteClick(item)"> |
||||||
|
<image src="../../static/zan.png" v-if="!item.isVote"></image> |
||||||
|
<image src="../../static/like.png" v-else></image> |
||||||
|
<text class="zan-conunt">{{item.voteNum}}</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { studyListVote} from '@/api/knowledge'; |
||||||
|
import { myMemberStudylist} from '@/api/serverTeacher'; |
||||||
|
export default{ |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
active: 0, |
||||||
|
studyId: '', |
||||||
|
memberId:'', |
||||||
|
studyListDto:{}, |
||||||
|
dataList:[] |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
this.studyId = this.$yroute.query.studyId; |
||||||
|
this.memberId = this.$yroute.query.memberId; |
||||||
|
console.log( this.$yroute.query.studyId) |
||||||
|
console.log( this.$yroute.query.memberId) |
||||||
|
this.myMemberStudylist(); |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
myMemberStudylist(){ |
||||||
|
myMemberStudylist({memberId:this.memberId,studyId:this.studyId}).then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
this.studyListDto = res.data.studyListDto |
||||||
|
this.dataList = res.data.recordDtos; |
||||||
|
uni.stopPullDownRefresh(); |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
voteClick(item){ |
||||||
|
let id = item.id, |
||||||
|
voteNum = item.voteNum, |
||||||
|
isVote = !item.isVote; |
||||||
|
this.dataList.map((item)=>{ |
||||||
|
if(item.id == id){ |
||||||
|
if(item.isVote){ |
||||||
|
item.voteNum = item.voteNum - 1 |
||||||
|
} else{ |
||||||
|
item.voteNum = item.voteNum + 1 |
||||||
|
} |
||||||
|
item.isVote = !item.isVote |
||||||
|
} |
||||||
|
}) |
||||||
|
let data = { |
||||||
|
"studylistRecordId": id, |
||||||
|
"type": isVote ? '1' : '0' |
||||||
|
} |
||||||
|
studyListVote(data).then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
uni.showToast({ |
||||||
|
title: '操作成功！' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
tabClick(idx){ |
||||||
|
this.active = idx; |
||||||
|
}, |
||||||
|
onPullDownRefresh() { |
||||||
|
this.myMemberStudylist(); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.dabang-index{ |
||||||
|
min-height: 100vh; |
||||||
|
background: #fff; |
||||||
|
padding-bottom: 100rpx; |
||||||
|
.top-box{ |
||||||
|
width: 100%; |
||||||
|
height: 344rpx; |
||||||
|
background: linear-gradient(135deg, #E5B964 0%, #CE9F45 100%); |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 40rpx 0; |
||||||
|
color: #fff; |
||||||
|
position: relative; |
||||||
|
.dabang-name{ |
||||||
|
width: 80%; |
||||||
|
font-size: 50rpx; |
||||||
|
font-weight: 600; |
||||||
|
color: #FFFFFF; |
||||||
|
line-height: 72rpx; |
||||||
|
margin: 40rpx auto; |
||||||
|
} |
||||||
|
.time-box{ |
||||||
|
width: 100%; |
||||||
|
background: rgba(0,0,0,.1); |
||||||
|
font-size: 28rpx; |
||||||
|
padding: 20rpx 20rpx; |
||||||
|
position: absolute; |
||||||
|
bottom: 0; |
||||||
|
text{ |
||||||
|
display: inline-block; |
||||||
|
margin:6rpx 0; |
||||||
|
} |
||||||
|
} |
||||||
|
.sanjiao{ |
||||||
|
width:0; |
||||||
|
height:0; |
||||||
|
border-right:14rpx solid transparent; |
||||||
|
border-left:14rpx solid transparent; |
||||||
|
border-bottom:16rpx solid #fff; |
||||||
|
position: absolute; |
||||||
|
left: 50%; |
||||||
|
bottom: 0; |
||||||
|
transform: translateX(-50%); |
||||||
|
} |
||||||
|
} |
||||||
|
.dabang-share-box{ |
||||||
|
width: 100%; |
||||||
|
padding: 30rpx; |
||||||
|
.dabang-share-item{ |
||||||
|
color: #222; |
||||||
|
padding:20rpx 0; |
||||||
|
border-bottom: 1px solid #ececec; |
||||||
|
.header-img{ |
||||||
|
width: 76rpx; |
||||||
|
height: 76rpx; |
||||||
|
border-radius: 50%; |
||||||
|
overflow: hidden; |
||||||
|
margin-right: 10rpx; |
||||||
|
} |
||||||
|
.name{ |
||||||
|
font-size: 28rpx; |
||||||
|
line-height: 40rpx; |
||||||
|
} |
||||||
|
.create-time{ |
||||||
|
font-size: 24rpx; |
||||||
|
color: #999; |
||||||
|
line-height: 34rpx; |
||||||
|
} |
||||||
|
.share-word{ |
||||||
|
font-size: 28rpx; |
||||||
|
line-height: 46rpx; |
||||||
|
margin: 22rpx 0 30rpx; |
||||||
|
} |
||||||
|
.img-box{ |
||||||
|
image{ |
||||||
|
width: 224rpx; |
||||||
|
height: 206rpx; |
||||||
|
margin-right: 10rpx; |
||||||
|
border-radius: 10rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.zan-box{ |
||||||
|
margin-top: 20rpx; |
||||||
|
image{ |
||||||
|
width: 30rpx; |
||||||
|
height: 32rpx; |
||||||
|
margin-right: 20rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
image{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,248 @@ |
|||||||
|
<template> |
||||||
|
<view class="member-box"> |
||||||
|
<view class="member-info-box acea-row row-middle row-between"> |
||||||
|
<view class="info-l acea-row"> |
||||||
|
<view><image :src="member.avatar"></image></view> |
||||||
|
<view class="name-box"> |
||||||
|
<view class="acea-row row-middle mt26"> |
||||||
|
<view class="name">{{member.realName}}</view> |
||||||
|
<view class="vip-box">{{member.level}}级会员</view> |
||||||
|
</view> |
||||||
|
<view class="acea-row"> |
||||||
|
<!-- <view class="tips-box">湖北 武汉</view> --> |
||||||
|
<view class="tips-box">{{member.integral}}积分</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="call-btn" @click="call">拨号</view> |
||||||
|
</view> |
||||||
|
<view class="tab-box acea-row row-around" :class="isFixedTop?'fixed':''"> |
||||||
|
<view class="tab-item" :class="active == '0' ? 'tab-item-active' : ''" @click="handelScroll('0')">课程({{detail.cyCourseDtos.length}})</view> |
||||||
|
<view class="tab-item" :class="active == '1' ? 'tab-item-active' : ''" @click="handelScroll('1')">打榜({{detail.studyListDtos.length}})</view> |
||||||
|
</view> |
||||||
|
<view class="content-box" v-if="active == 0"> |
||||||
|
<view class="course-list-box"> |
||||||
|
<view class="course-item" v-for="item in detail.cyCourseDtos" :key="item" @click="toCourseDetail(item.id)"> |
||||||
|
<view class="top-box acea-row row-between"> |
||||||
|
<view class="top-l-box"> |
||||||
|
<view class="name line1">{{item.courseName}}</view> |
||||||
|
<view class="time-box">时间：{{item.courseStartTime.split(' ')[0]}} 至 {{item.courseEndTime.split(' ')[0]}}</view> |
||||||
|
<view class="time-box">地点：{{item.coursePlace}}</view> |
||||||
|
</view> |
||||||
|
<view class="state-box" v-if="item.signState == 0">未签到</view> |
||||||
|
<view class="state-box" v-if="item.signState == 1">已签到</view> |
||||||
|
<view class="state-box" v-if="item.signState == 2">签到未开放</view> |
||||||
|
<view class="state-box" v-if="item.signState == 3">缺席</view> |
||||||
|
<view class="state-box" v-if="item.signState == 4">课程已取消</view> |
||||||
|
</view> |
||||||
|
<view class="btm-box">座位:{{item.seat || '暂未安排座位'}}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="dabang-list-box" v-else> |
||||||
|
<view class="dabang-item" v-for="(item,index) in detail.studyListDtos" @click="bangdanDetail(item.id)"> |
||||||
|
<view class="dabang-info"> |
||||||
|
<view class="bangdan-name line1">{{item.listName}}</view> |
||||||
|
<view class="time">{{item.listStartTime.split(' ')[0]}}-{{item.listEndTime.split(' ')[0]}}</view> |
||||||
|
<view class="time">{{item.integral}}积分</view> |
||||||
|
</view> |
||||||
|
<view class="dabang-btm colR acea-row row-between-wrapper" v-if="item.listState == 2"> |
||||||
|
<view>{{item.signState == 2 ? '+' : '-'}} {{item.integral}}积分</view> |
||||||
|
<view v-if="item.signState == 2">打榜成功 {{item.signTimes}}/{{item.clockTimes}}</view> |
||||||
|
<view v-if="item.signState == 3">打榜失败 {{item.signTimes}}/{{item.clockTimes}}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { getMemberDetail } from "@/api/serverTeacher" |
||||||
|
export default{ |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
active: 0, |
||||||
|
member:{}, |
||||||
|
detail:{} |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
this.member = JSON.parse(decodeURIComponent(this.$yroute.query.item)); |
||||||
|
// this.uid = this.$yroute.query.uid; |
||||||
|
this.getDetail() |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
toCourseDetail(id){ |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/serviceTeacher/courseDetail', |
||||||
|
query:{ |
||||||
|
id: id |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
getDetail(){ |
||||||
|
getMemberDetail({uid:this.member.uid}).then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
this.detail = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
bangdanDetail(id){ |
||||||
|
this.$yrouter.push({ |
||||||
|
path:'/pages/serviceTeacher/memberDabang', |
||||||
|
query:{ |
||||||
|
studyId: id, |
||||||
|
memberId:this.member.uid |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
handelScroll(idx){ |
||||||
|
this.active = idx |
||||||
|
}, |
||||||
|
call(){ |
||||||
|
uni.makePhoneCall({ |
||||||
|
phoneNumber:this.member.phone |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.member-box{ |
||||||
|
.member-info-box{ |
||||||
|
padding: 36rpx 30rpx 50rpx; |
||||||
|
background: #fff; |
||||||
|
.info-l{ |
||||||
|
image{ |
||||||
|
width: 124rpx; |
||||||
|
height: 124rpx; |
||||||
|
border-radius: 50px; |
||||||
|
margin-right: 30rpx; |
||||||
|
} |
||||||
|
.name-box{ |
||||||
|
font-size: 24rpx; |
||||||
|
.mt26{ |
||||||
|
margin-bottom: 26rpx; |
||||||
|
} |
||||||
|
.name{ |
||||||
|
font-size: 36rpx; |
||||||
|
color: #222; |
||||||
|
} |
||||||
|
.vip-box{ |
||||||
|
// width: 100rpx; |
||||||
|
height: 36rpx; |
||||||
|
line-height: 36rpx; |
||||||
|
text-align: center; |
||||||
|
padding: 0 10rpx; |
||||||
|
color: #fff; |
||||||
|
background: linear-gradient(180deg, #FFCF61 0%, #FCA333 100%); |
||||||
|
box-shadow: 0px 4rpx 8rpx 0px rgba(253,169,57,0.19); |
||||||
|
border-radius: 20rpx 20rpx 20rpx 0px; |
||||||
|
margin-left: 10rpx; |
||||||
|
} |
||||||
|
.tips-box{ |
||||||
|
padding: 4rpx 12rpx; |
||||||
|
height: 40rpx; |
||||||
|
background: #FFF5E6; |
||||||
|
border-radius: 23rpx; |
||||||
|
color: #FFA726; |
||||||
|
font-size: 24rpx; |
||||||
|
margin-right: 16rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.call-btn{ |
||||||
|
width: 120rpx; |
||||||
|
height: 60rpx; |
||||||
|
line-height: 60rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
color: #fff; |
||||||
|
text-align: center; |
||||||
|
background: #F4C076; |
||||||
|
border-radius: 30rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.tab-box{ |
||||||
|
white-space: nowrap; |
||||||
|
width: 100%; |
||||||
|
background: #fff; |
||||||
|
padding: 18rpx 34rpx 0; |
||||||
|
.tab-item{ |
||||||
|
width: 50%; |
||||||
|
text-align: center; |
||||||
|
display: inline-block; |
||||||
|
padding-bottom: 26rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
color: #222; |
||||||
|
} |
||||||
|
.tab-item-active{ |
||||||
|
font-weight: bold; |
||||||
|
border-bottom: 4rpx solid #EB5744; |
||||||
|
} |
||||||
|
} |
||||||
|
.content-box{ |
||||||
|
padding: 30rpx; |
||||||
|
.course-list-box{ |
||||||
|
.course-item{ |
||||||
|
background: #fff; |
||||||
|
padding: 30rpx; |
||||||
|
color: #333; |
||||||
|
font-size: 24rpx; |
||||||
|
border-radius: 10px; |
||||||
|
margin-bottom: 30rpx; |
||||||
|
.name{ |
||||||
|
font-size: 32rpx; |
||||||
|
margin-bottom: 20rpx; |
||||||
|
} |
||||||
|
.state-box{ |
||||||
|
min-width: 152rpx; |
||||||
|
height: 52rpx; |
||||||
|
background: #FEF2D9; |
||||||
|
border-radius: 4rpx; |
||||||
|
border: 1px solid #D89200; |
||||||
|
text-align: center; |
||||||
|
line-height: 52rpx; |
||||||
|
color: #695121; |
||||||
|
} |
||||||
|
.btm-box{ |
||||||
|
padding-top: 20rpx; |
||||||
|
border-top: 1px solid #ececec; |
||||||
|
margin-top: 20rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.dabang-list-box{ |
||||||
|
width: 100%; |
||||||
|
padding: 0 32rpx; |
||||||
|
.dabang-item{ |
||||||
|
width: 100%; |
||||||
|
background: #fff; |
||||||
|
color: #fff; |
||||||
|
margin-top: 28rpx; |
||||||
|
font-size: 28rpx; |
||||||
|
border-radius: 10rpx; |
||||||
|
overflow: hidden; |
||||||
|
.dabang-info{ |
||||||
|
height: 200rpx; |
||||||
|
padding-left: 24rpx; |
||||||
|
padding-top: 24rpx; |
||||||
|
background: linear-gradient(148deg, #B4B6C4 0%, #C5CAD6 100%); |
||||||
|
.bangdan-name{ |
||||||
|
font-size: 50rpx; |
||||||
|
line-height: 80rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.dabang-btm{ |
||||||
|
padding: 0 56rpx 0 24rpx; |
||||||
|
height: 80rpx; |
||||||
|
color: #8FB85B; |
||||||
|
} |
||||||
|
.colR{ |
||||||
|
color:#EB5744; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,185 @@ |
|||||||
|
<template> |
||||||
|
<view class="member-box"> |
||||||
|
<view class="search-box"> |
||||||
|
<view class="search-input-box acea-row row-middle"> |
||||||
|
<text class="iconfont icon-xiazai5"></text> |
||||||
|
<input type="text" placeholder="请输入会员真实姓名"> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<uni-collapse accordion="true" @change="openChange()"> |
||||||
|
<uni-collapse-item |
||||||
|
:title="`${item.levelName} (${item.memberNum})`" |
||||||
|
:show-animation="true" |
||||||
|
ref="add" |
||||||
|
v-for="(item,index) in levelList" |
||||||
|
:key="index" |
||||||
|
style="border-top: 1px solid #f3f3f3;"> |
||||||
|
<view style="padding: 20rpx;"> |
||||||
|
<view class="member-list"> |
||||||
|
<view class="member-item acea-row" v-for="(member,idx) in memberList" :key="idx" @click="toMemberDetail(member)"> |
||||||
|
<view class="img-box"><image :src="member.avatar" mode="aspectFill"></image></view> |
||||||
|
<view class="memberInfo-box"> |
||||||
|
<view class="name">{{member.realName}}</view> |
||||||
|
<view class="jifen">{{member.integral}}积分</view> |
||||||
|
<view class="record-box acea-row"> |
||||||
|
<view class="course-record"> |
||||||
|
<image src="../../static/kecheng-icon2.png"></image> |
||||||
|
<text>课程 {{member.finishCourseNum}}/{{member.enterCourseNum}}</text> |
||||||
|
</view> |
||||||
|
<view class="course-record"> |
||||||
|
<image src="../../static/dabang-icon.png"></image> |
||||||
|
<text>打榜 {{member.finishStudylistNm}}/{{member.enterStudylistNum}}</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="call-btn" @click.stop="call(member.phone)">拨号</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</uni-collapse-item> |
||||||
|
</uni-collapse> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { getMyMemberLevels , getSellerMembers } from "@/api/serverTeacher" |
||||||
|
export default{ |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
levelList:[], |
||||||
|
memberList: [] |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
this.getMyMemberLevels() |
||||||
|
// this.getList() |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
getMyMemberLevels(){ |
||||||
|
getMyMemberLevels().then(res=>{ |
||||||
|
if(res.success){ |
||||||
|
this.levelList = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
openChange(e){ |
||||||
|
this.memberList = []; |
||||||
|
if(e.length > 0){ |
||||||
|
uni.showLoading({ |
||||||
|
title: '正在加载中...' |
||||||
|
}) |
||||||
|
let level = this.levelList[e[0]].level; |
||||||
|
getSellerMembers({level:level}).then((res)=>{ |
||||||
|
uni.hideLoading() |
||||||
|
if(res.success){ |
||||||
|
this.memberList = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
}, |
||||||
|
getList(){ |
||||||
|
getSellerMembers().then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
this.memberList = res.data |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
toMemberDetail(item){ |
||||||
|
console.log(item) |
||||||
|
this.$yrouter.push({ |
||||||
|
path:'/pages/serviceTeacher/memberDetail', |
||||||
|
query:{ |
||||||
|
item: encodeURIComponent(JSON.stringify(item)) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
call(phone){ |
||||||
|
uni.makePhoneCall({ |
||||||
|
phoneNumber:phone |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.member-box{ |
||||||
|
width: 100%; |
||||||
|
.search-box{ |
||||||
|
background: #fff; |
||||||
|
width: 100%; |
||||||
|
padding: 20rpx 30rpx; |
||||||
|
.search-input-box{ |
||||||
|
width: 100%; |
||||||
|
height: 70rpx; |
||||||
|
background: #F2F2F2; |
||||||
|
font-size: 28rpx; |
||||||
|
color: #999999; |
||||||
|
border-radius: 25px; |
||||||
|
padding-left: 26rpx; |
||||||
|
.iconfont{ |
||||||
|
margin-right: 12rpx; |
||||||
|
} |
||||||
|
input{ |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.member-list{ |
||||||
|
.member-item{ |
||||||
|
position: relative; |
||||||
|
background: #fff; |
||||||
|
padding: 28rpx 20rpx; |
||||||
|
border-radius: 10rpx; |
||||||
|
margin-bottom: 20rpx; |
||||||
|
.img-box{ |
||||||
|
width: 144rpx; |
||||||
|
height: 144rpx; |
||||||
|
margin-right: 20rpx; |
||||||
|
image{ |
||||||
|
width: 144rpx; |
||||||
|
height: 144rpx; |
||||||
|
border-radius: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
.memberInfo-box{ |
||||||
|
font-size: 32rpx; |
||||||
|
color: #222; |
||||||
|
.jifen{ |
||||||
|
font-size: 24rpx; |
||||||
|
color: #EB5744; |
||||||
|
} |
||||||
|
.record-box{ |
||||||
|
margin-top: 22rpx; |
||||||
|
} |
||||||
|
.course-record{ |
||||||
|
color: #666; |
||||||
|
font-size: 28rpx; |
||||||
|
margin-right: 60rpx; |
||||||
|
image{ |
||||||
|
width: 24rpx; |
||||||
|
height: 24rpx; |
||||||
|
margin-right: 8rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.call-btn{ |
||||||
|
position: absolute; |
||||||
|
right: 28rpx; |
||||||
|
top: 28rpx; |
||||||
|
width: 120rpx; |
||||||
|
height: 60rpx; |
||||||
|
line-height: 60rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
color: #fff; |
||||||
|
text-align: center; |
||||||
|
background: #F4C076; |
||||||
|
border-radius: 30rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
/deep/.uni-collapse-cell__title{ |
||||||
|
background: #fff !important; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,324 @@ |
|||||||
|
<template> |
||||||
|
<view class="index-box"> |
||||||
|
<view class="upload-img-box"> |
||||||
|
<view class="label-box"> |
||||||
|
<view class="label-l acea-row-nowrap row-middle"> |
||||||
|
<text class="label">工作照</text> |
||||||
|
<text class="sm-word">请上传正面免冠半身照图像大小不超过200kb</text> |
||||||
|
</view> |
||||||
|
<view class="label-r acea-row row-middle"> |
||||||
|
<view class="img-box" @tap="chooseImage"> |
||||||
|
<image :src="form.imgPath == '' ? '../../static/default-headerimg.png' : form.imgPath " mode=""></image> |
||||||
|
</view> |
||||||
|
<text class="iconfont icon-jiantou"></text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="form-box"> |
||||||
|
<view class="form-item acea-row row-middle row-between"> |
||||||
|
<view class="label">姓名</view> |
||||||
|
<view class="input-box acea-row row-middle"> |
||||||
|
<input type="text" v-model="form.realName" placeholder="请输入真实姓名" /> |
||||||
|
<text class="iconfont icon-jiantou"></text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="form-item acea-row row-middle row-between"> |
||||||
|
<view class="label">注册口令</view> |
||||||
|
<view class="input-box acea-row row-middle"> |
||||||
|
<input type="text" v-model="form.code" placeholder="请输入注册口令" /> |
||||||
|
<text class="iconfont icon-jiantou"></text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="form-item acea-row row-middle row-between "> |
||||||
|
<view class="label">性别</view> |
||||||
|
<view class="input-box acea-row row-middle"> |
||||||
|
<radio-group @change="radioChange"> |
||||||
|
<label class="radio"> |
||||||
|
<radio value="0" color="#E5270F" style="transform:scale(0.7)" :checked="form.gender == 0" /><text>男</text> |
||||||
|
</label> |
||||||
|
<label class="radio"> |
||||||
|
<radio value="1" color="#E5270F" style="transform:scale(0.7)" :checked="form.gender == 1" /><text>女</text> |
||||||
|
</label> |
||||||
|
</radio-group> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="form-item acea-row row-middle row-between"> |
||||||
|
<view class="label">手机号</view> |
||||||
|
<view class="input-box acea-row row-middle"> |
||||||
|
<input type="text" v-model="form.phone" maxlength="11" @blur="editPhone(form.phone)" placeholder="请输入手机号" /> |
||||||
|
<text class="iconfont icon-jiantou"></text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="form-item acea-row row-middle row-between no-border"> |
||||||
|
<view class="label">验证码</view> |
||||||
|
<view class="acea-row row-middle "> |
||||||
|
<view class="input-box acea-row row-middle"> |
||||||
|
<input type="text" v-model="form.verifyCode" maxlength="6" placeholder="请输入短信验证码" /> |
||||||
|
</view> |
||||||
|
<view class="countdown" :class="disabled ? 'default' : ''" @click="sendCode"> |
||||||
|
{{disabled ? second + '秒后重新发送' : '发送验证码'}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="submit-btn" @click="submitClick">{{userInfo.isPromoter == 1 ? '保存修改' : '保存'}}</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { chooseImage } from "@/utils"; |
||||||
|
import { editSelfData , getVerificationCode } from "@/api/serverTeacher" |
||||||
|
import { mapState, mapGetters, mapMutations, mapActions } from 'vuex' |
||||||
|
export default{ |
||||||
|
computed: mapGetters(['userInfo']), |
||||||
|
data(){ |
||||||
|
return { |
||||||
|
disabled: false, |
||||||
|
second: 60, |
||||||
|
time:null, |
||||||
|
form: { |
||||||
|
imgPath:'', |
||||||
|
realName:'', |
||||||
|
code:'', |
||||||
|
gender: 0, |
||||||
|
phone: '', |
||||||
|
verifyCode:'' |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(){ |
||||||
|
if(this.userInfo.isPromoter == 1){ |
||||||
|
let info = this.userInfo; |
||||||
|
this.form.imgPath = info.workPhoto; |
||||||
|
this.form.realName = info.realName; |
||||||
|
this.form.gender = info.gender; |
||||||
|
this.form.phone = info.phone; |
||||||
|
} |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
sendCode(){ |
||||||
|
var reg=/^1[3456789]\d{9}$/; |
||||||
|
if (this.form.phone === '') { |
||||||
|
uni.showModal({ |
||||||
|
title: '手机号码不能为空', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} else if(!reg.test(this.form.phone)){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请输入有效的手机号码', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} else{ |
||||||
|
getVerificationCode({phone:this.form.phone}).then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
uni.showToast({ |
||||||
|
title:'短信已发送！' |
||||||
|
}) |
||||||
|
if(this.disabled == false){ |
||||||
|
clearInterval(this.timer) |
||||||
|
this.disabled = true; |
||||||
|
this.timer = setInterval(()=>{ //设置延迟执行 |
||||||
|
this.timeup() |
||||||
|
},1000); |
||||||
|
} |
||||||
|
} else{ |
||||||
|
uni.showToast({ |
||||||
|
title:res.msg, |
||||||
|
icon:'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
timeup(){ |
||||||
|
this.second = this.second - 1; |
||||||
|
if (this.second == 0) { |
||||||
|
this.second = 60; |
||||||
|
this.disabled = false |
||||||
|
clearInterval(this.timer) |
||||||
|
return; |
||||||
|
} |
||||||
|
}, |
||||||
|
chooseImage() { |
||||||
|
chooseImage((img) => { |
||||||
|
this.form.imgPath = img; |
||||||
|
}); |
||||||
|
}, |
||||||
|
radioChange(e){ |
||||||
|
// console.log(e) |
||||||
|
this.form.gender = e.detail.value |
||||||
|
}, |
||||||
|
editPhone(phone){ |
||||||
|
if (phone === '') { |
||||||
|
uni.showModal({ |
||||||
|
title: '手机号码不能为空', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
} |
||||||
|
else { |
||||||
|
if (phone !== '') { |
||||||
|
var reg=/^1[3456789]\d{9}$/; |
||||||
|
if(!reg.test(phone)){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请输入有效的手机号码', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
submitClick(){ |
||||||
|
if(this.form.imgPath == ''){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请上传工作照', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} else if(this.form.realName == ''){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请输入真实姓名', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} else if(this.form.code == ''){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请输入注册口令', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} else if(this.form.phone == ''){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请输入手机号', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} else if(!(/^1[3456789]\d{9}$/.test(this.form.phone))){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请输入正确手机号', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} else if(this.form.verifyCode == ''){ |
||||||
|
uni.showModal({ |
||||||
|
title: '请输入手机短信验证码', |
||||||
|
type: 'none' |
||||||
|
}); |
||||||
|
return |
||||||
|
} |
||||||
|
editSelfData(this.form).then((res)=>{ |
||||||
|
if(res.success){ |
||||||
|
this.$store.dispatch("userInfo", true); |
||||||
|
uni.showToast({ |
||||||
|
title: res.msg, |
||||||
|
icon: "none", |
||||||
|
duration: 2000, |
||||||
|
}); |
||||||
|
setTimeout(()=>{ |
||||||
|
this.$yrouter.back(); |
||||||
|
},2000) |
||||||
|
} else{ |
||||||
|
uni.showToast({ |
||||||
|
title:res.msg, |
||||||
|
icon:'none', |
||||||
|
duration:2000 |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.index-box{ |
||||||
|
width: 100%; |
||||||
|
height: 100vh; |
||||||
|
background-color: #fff; |
||||||
|
padding: 0 30rpx; |
||||||
|
font-size: 32rpx; |
||||||
|
color: #222; |
||||||
|
.upload-img-box{ |
||||||
|
width: 100%; |
||||||
|
padding: 40rpx 0; |
||||||
|
} |
||||||
|
.label-box{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
.label{ |
||||||
|
width: 110rpx; |
||||||
|
} |
||||||
|
.sm-word{ |
||||||
|
width: 270rpx; |
||||||
|
font-size: 24rpx; |
||||||
|
color: #999; |
||||||
|
margin-left: 12rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.label-r{ |
||||||
|
.img-box{ |
||||||
|
border-radius: 50px; |
||||||
|
overflow: hidden; |
||||||
|
image{ |
||||||
|
width: 116rpx; |
||||||
|
height: 116rpx; |
||||||
|
border-radius: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
.iconfont{ |
||||||
|
color: #999; |
||||||
|
margin-left: 12rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.form-box{ |
||||||
|
.form-item{ |
||||||
|
padding: 30rpx 0; |
||||||
|
border-bottom: 1px solid #ececec; |
||||||
|
.input-box{ |
||||||
|
input{ |
||||||
|
text-align: right; |
||||||
|
margin-right: 12rpx; |
||||||
|
} |
||||||
|
.radio{ |
||||||
|
margin-left: 20rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.no-border{ |
||||||
|
border: none; |
||||||
|
} |
||||||
|
.countdown{ |
||||||
|
min-width: 140rpx; |
||||||
|
height: 70rpx; |
||||||
|
padding: 0 10rpx; |
||||||
|
font-size: 24rpx; |
||||||
|
background-color: #E2B35D; |
||||||
|
color: #fff; |
||||||
|
line-height: 70rpx; |
||||||
|
text-align: center; |
||||||
|
border-radius: 10rpx; |
||||||
|
} |
||||||
|
.default{ |
||||||
|
background: #999; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
.submit-btn{ |
||||||
|
width: 646rpx; |
||||||
|
height: 80rpx; |
||||||
|
text-align: center; |
||||||
|
line-height: 80rpx; |
||||||
|
background: #F4C076; |
||||||
|
border-radius: 44rpx; |
||||||
|
color: #fff; |
||||||
|
position: absolute; |
||||||
|
bottom: 100rpx; |
||||||
|
left: 50%; |
||||||
|
margin-left: -320rpx; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
</style> |
||||||
|
After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 344 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 911 B |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
Before Width: | Height: | Size: 336 KiB |
|
Before Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 973 B |
|
After Width: | Height: | Size: 888 B |
|
After Width: | Height: | Size: 932 B |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 694 B |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 885 B |
|
After Width: | Height: | Size: 823 B |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 691 B |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
Loading…
Reference in new issue