zm/medicine_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

课程价格重新写

Browse Source
This commit is contained in:
@fawn-nine
2024-06-25 17:06:30 +08:00
parent 8e58d4af88
commit 0374ef034a
9 changed files with 487 additions and 196 deletions
Download Patch File Download Diff File Expand all files Collapse all files

429
pages/course/coursePrice.vue
View File

@@ -4,71 +4,73 @@
<public-module></public-module>
<z-nav-bar title="课程价格"></z-nav-bar>
<view class="addVip">
<u-alert
v-if=""
style="
<u-alert v-if="" style="
width: 100%;
"
:title="goBuyTitle"
type="warning"
:show-icon="true"
>
<template slot="rightSlot" slot-scope="slotProps">
<text class="saveBtn vipBtn flexbox buyBtn" style="color: #fff;" @click="onPageJump('/pages/mine/vip/index')">
开通VIP
</text>
<view> </view>
</template>
" :title="goBuyTitle" type="warning" :show-icon="true">
<template slot="rightSlot" slot-scope="slotProps">
<text class="saveBtn vipBtn flexbox buyBtn" style="color: #fff;"
@click="onPageJump('/pages/mine/vip/index')">
开通VIP
</text>
<view> </view>
</template>
</u-alert>
</view>
<view class="container">
<view class="" v-if="courseList.length > 0">
<uni-collapse accordion>
<uni-collapse-item v-for="(item,index) in courseList" :key="index" :title="item.courseMedicine.title"
:thumb="item.courseMedicine.icon">
<view class="content" v-if="item.courseList.length > 1">
<view :class="['courseItemleve1',userMsg.vip != 0 ? 'isVip' :'']" v-for="(item1, index1) in item.courseList" :key="index1"
@click="onPageJump('/pages/course/courseDetail',item1.id)"
>
<view class="vipSee" v-if="userMsg.vip != 0">
<text>VIP畅学权益生效中</text>
</view>
<view :class="['text','courseItem','flexbox']"><u-icon name="pushpin" color="#2979ff"
size="24"></u-icon><text>{{item1.title}}</text>
</view>
<view class="" v-for="(item2, index2) in item1.courseCatalogueEntityList" :key="index2">
<view :class="['priceItem', item2.isBuy == 1 && userMsg.vip == 0 ? 'isBuy' : '']" >
<text class="text mname" v-if="item1.courseCatalogueEntityList.length > 1"
style="font-weight: bold; margin-right: 10rpx;">【{{item2.title}}】</text>
<view class="pbox flexbox">
<text class="text">半年：￥{{item2.halfFee}} 元</text><text class="text"
style="margin-left: 20rpx;">整年：￥{{item2.fee}} 元</text>
<text class="buybtns" @click.stop="goBuy(item2)" v-if="item2.isBuy == 0 && userMsg.vip == 0">立即购买</text>
</view>
<i class="haveBuy" v-if="item2.isBuy == 1 && userMsg.vip == 0">已购买</i>
</view>
</view>
<!-- <view class="buyBox" v-if="!item1.allBuy">
<view class="saveBtn buybtn flexbox" @click="goBuy('halfFee')">
<u-icon name="bag" color="#fff" size="24"></u-icon>
<text>立即购买</text>
</view>
</view> -->
</view>
<!-- 新的 -->
<uni-collapse accordion @change="collapseChange">
<uni-collapse-item v-for="(item,index) in courseList" :key="index" :title="item.courseMedicine.title"
:thumb="item.courseMedicine.icon">
<view class="content" v-show="item.courseList.length > 1" style="padding:20rpx;">
<view :class="['courseItemleve1',userMsg.vip != 0 ? 'isVip' :'']"
v-for="(item1, index1) in item.courseList" :key="index1"
@click="onPageJump('/pages/course/courseDetail',item1.id)">
<view class="vipSee" v-if="userMsg.vip != 0">
<text>VIP畅学权益生效中</text>
</view>
</uni-collapse-item>
</uni-collapse>
</view>
<u-divider v-if="status == 1" text="暂无数据"></u-divider>
<u-divider v-if="status == 0" text="加载中..."></u-divider>
</view>
<u-back-top :scroll-top="scrollTop" bottom="150" :customStyle='bgiStyle'
:iconStyle="iconStyle"></u-back-top>
<view :class="['text','courseItem','flexbox']"><u-icon name="pushpin" color="#2979ff"
size="24"></u-icon><text>{{item1.title}}</text>
</view>
<template v-if="item1.courseCatalogueEntityList && item1.courseCatalogueEntityList.length > 0">
<view class="" v-for="(item2, index2) in item1.courseCatalogueEntityList" :key="index2">
<view :class="['priceItem', item2.isBuy == 1 && userMsg.vip == 0 ? 'isBuy' : '']">
<text class="text mname" v-if="item1.courseCatalogueEntityList.length > 1"
style="font-weight: bold; margin-right: 10rpx;">【{{item2.title}}】</text>
<view class="pbox flexbox">
<text class="text">半年：￥{{item2.halfFee}} 元</text><text class="text"
style="margin-left: 20rpx;">整年：￥{{item2.fee}} 元</text>
<text class="buybtns" @click.stop="goBuy(item2)"
v-if="item2.isBuy == 0 && userMsg.vip == 0">立即购买</text>
</view>
<i class="haveBuy" v-if="item2.isBuy == 1 && userMsg.vip == 0">已购买</i>
</view>
</view>
</template>
<!-- <view class="buyBox" v-if="!item1.allBuy">
<view class="saveBtn buybtn flexbox" @click="goBuy('halfFee')">
<u-icon name="bag" color="#fff" size="24"></u-icon>
<text>立即购买</text>
</view>
</view> -->
</view>
<view class="" style="text-align: center; margin-bottom: 20rpx;">
<text class="" v-if="item.subpage < item.pages" style="color: #55aaff; display: inline-block; font-size: 28rpx;"
@click="loadMoreCourse(item, index)">加载更多</text>
<text class="" v-else style="color: #55aaff; display: inline-block; font-size: 28rpx;"
>已全部加载完毕</text>
</view>
</view>
</uni-collapse-item>
</uni-collapse>
<!-- -->
<u-back-top :scroll-top="scrollTop" bottom="150" :customStyle='bgiStyle' :iconStyle="iconStyle"></u-back-top>
<z-navigation></z-navigation>
<buy-pup v-if="pricespop" :proPriceList="proPriceList" @closePup="closePup" @oprate="oprate"></buy-pup>
<!-- <music-play :playData="playData"></music-play> -->
@@ -87,9 +89,10 @@
data() {
return {
playData: {},
goBuyTitle : "购买VIP,即可免费观看吴门医述所有课程",
goBuyTitle: "购买VIP,即可免费观看吴门医述所有课程",
courseList: [],
status:0,
courseList1: [], // 新的
status: 0,
scrollTop: 0,
bgiStyle: {
background: '#fff'
@@ -99,10 +102,10 @@
fontWeight: 'bold',
color: '#258feb',
},
proPriceList:[],
pricespop:false,
userMsg:{},
cartList:[]
proPriceList: [],
pricespop: false,
userMsg: {},
cartList: []
};
},
//第一次加载
@@ -110,6 +113,8 @@
// 隐藏原生的tabbar
uni.hideTabBar();
// console.log(e, '------')
this.getUserInfo()
this.getCoursePriceList1()
},
computed: {
...mapState(['userInfo'])
@@ -118,12 +123,11 @@
onShow() {
// 隐藏原生的tabbar
uni.hideTabBar();
this.getUserInfo()
this.getCoursePriceList()
// this.getCoursePriceList()
},
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
onPullDownRefresh() {
uni.stopPullDownRefresh()
@@ -134,19 +138,65 @@
},
//方法
methods: {
loadMoreCourse(val, i) {
console.log(val, 'val',i,'++++++++++++++++')
let _page = val.subpage
_page += 1
this.getSubCourse(this.courseList[i].medicineList, i, _page)
},
collapseChange(e) {
console.log('e', e)
if (e && this.courseList[e].medicineList.length > 0) {
if (this.courseList[e].courseList.length <= 0)
this.getSubCourse(this.courseList[e].medicineList, e,1)
}
},
// 获取子课程
getSubCourse(ids, index, page) {
console.log('ids------------------', index)
$http.request({
url: "medical/home/getMedicalCoursePriceIsBuy",
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
data: {
page: page,
limit: 10,
"ids": ids
},
header: { //默认 无 说明：请求头
'Content-Type': 'application/json'
},
})
.then(res => {
if (res.code == 0) {
if (res.res.records.length > 0) {
let _list = res.res.records
// console.log(_list,'_list')
// this.courseList[index].courseList = _list
this.courseList[index].courseList = this.courseList[index].courseList.concat(_list)
this.courseList[index].subpage = res.res.current
this.courseList[index].pages = res.res.pages
console.log(this.courseList[index].courseList, 'this.courseList[index]')
}
}
}).catch(e => {
console.log(e, '报错')
})
},
// 获取购物车数据
addCart(val){
console.log(val)
addCart(val) {
console.log(val)
if (val.productStock == 0) {
uni.showToast({
title: '商品库存不足',
icon: "none"
icon: "none"
});
} else {
console.log(this.userInfo, '222')
this.$http
.post(`book/ordercart/getCartList?userId=${this.userInfo.id}`)
.then(res => {
.then(res => {
// console.log(
this.cartList = res.cartList
this.isAddLink(val)
@@ -211,7 +261,7 @@
}
})
}
} else {
// 购物车列表为空时直接加入购物车
$http.request({
@@ -231,38 +281,35 @@
})
}
},
oprate(data){
console.log(data,'得到的内容')
if(data.name == 'buy'){
oprate(data) {
console.log(data, '得到的内容')
if (data.name == 'buy') {
this.buy(data.item)
}
else if(data.name == 'gouwuche'){
} else if (data.name == 'gouwuche') {
this.addCart(data.item)
}
},
buy(val){
buy(val) {
var mynavData = JSON.stringify({
        goods: [
          {
            productImages: val.productImages,
            productId: val.productId,
            productName: val.productName,
            price: val.activityPrice && val.activityPrice != 0 ? val.activityPrice:val.price,
            goodsType: val.goodsType,
          },
        ],
        navTitle: this.options.navTitle,
        title: this.options.title,
        typeId: 0,
      }); // 这里转换成 字符串
      uni.navigateTo({
        url: `/pages/goods/order/index?data=${mynavData}`,
      });
},
onPageJump(path, id){
goods: [{
productImages: val.productImages,
productId: val.productId,
productName: val.productName,
price: val.activityPrice && val.activityPrice != 0 ? val.activityPrice : val.price,
goodsType: val.goodsType,
}, ],
navTitle: this.options.navTitle,
title: this.options.title,
typeId: 0,
}); // 这里转换成 字符串
uni.navigateTo({
url:`${path}?id=${id}`
url: `/pages/goods/order/index?data=${mynavData}`,
});
},
onPageJump(path, id) {
uni.navigateTo({
url: `${path}?id=${id}`
})
},
getUserInfo() {
@@ -271,15 +318,15 @@
this.$http
.post('book/user/info/' + this.userInfo.id)
.then(res => {
this.userMsg = res.user
this.userMsg = res.user
});
// }
},
closePup(e){
closePup(e) {
this.pricespop = false
},
goBuy(val){
console.log(val,'val')
goBuy(val) {
console.log(val, 'val')
$http.request({
url: "sociology/product/getProductListForCourse",
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
@@ -294,54 +341,53 @@
if (res.code == 0) {
if (res.productList.length > 0) {
this.proPriceList = res.productList
this.pricespop = true
this.pricespop = true
// this.curProId = this.proPriceList[0].productId
} else {
this.proPriceList = []
uni.showToast({
title:'课程未绑定商品',
icon:'none'
title: '课程未绑定商品',
icon: 'none'
})
}
}
}).catch(e => {
console.log(e, '获取商品列表报错')
uni.showToast({
title:'获取商品失败',
icon:'none'
title: '获取商品失败',
icon: 'none'
})
});
},
getCoursePriceList() {
getCoursePriceList1() {
this.$http
.post('medical/home/getMedicalCoursePrice')
.then(res => {
if (res.code == 0 && res.res.length > 0) {
let _list = res.res
let _allBuy = false
_list.map(item => {
item.courseList.forEach(item2 => {
let _number = 0
item2.courseCatalogueEntityList.forEach(item3 => {
if(item3.isBuy == 1){
_number++
}
})
if(_number == item2.courseCatalogueEntityList.length){
_allBuy = true
}else{
_allBuy = false
}
item2.allBuy = _allBuy
})
})
this.courseList = res.res
item.courseList = []
// item.courseList.forEach(item2 => {
// let _number = 0
// item2.courseCatalogueEntityList.forEach(item3 => {
// if(item3.isBuy == 1){
// _number++
// }
// })
// if(_number == item2.courseCatalogueEntityList.length){
// _allBuy = true
// }else{
// _allBuy = false
// }
// item2.allBuy = _allBuy
// })
})
this.courseList = _list
this.status = 2
} else {
this.courseList = []
@@ -361,54 +407,78 @@
</script>
<style lang="scss" scoped>
@import '@/style/mixin.scss';
.isVip{position: relative; padding-top: 50rpx !important; border: 1px solid #6429db; box-sizing: border-box;}
.vipSee{
position: absolute; right:0; top:0;
font-size: 24rpx;
background-image: linear-gradient(90deg, #6429db 0%, #0075ed 100%);
// @include theme("btn_bg");
color: #fff; padding: 10rpx; border-radius: 50rpx 0 0 50rpx;
.isVip {
position: relative;
padding-top: 50rpx !important;
border: 1px solid #6429db;
box-sizing: border-box;
}
.vipSee {
position: absolute;
right: 0;
top: 0;
font-size: 24rpx;
background-image: linear-gradient(90deg, #6429db 0%, #0075ed 100%);
// @include theme("btn_bg");
color: #fff;
padding: 10rpx;
border-radius: 50rpx 0 0 50rpx;
}
.flexbox {
display: flex;
}
.buybtns{
@include theme("btn_bg"); border-radius: 30rpx; color: #fff; font-size: 28rpx; padding: 0 10rpx; margin-left: 10rpx;
.buybtns {
@include theme("btn_bg");
border-radius: 30rpx;
color: #fff;
font-size: 28rpx;
padding: 0 10rpx;
margin-left: 10rpx;
}
.addVip{
.saveBtn{
.addVip {
.saveBtn {
width: 150rpx;
}
}
.buyBox{
.saveBtn{ margin: 0 auto;}
.buyBox {
.saveBtn {
margin: 0 auto;
}
}
.saveBtn {
width: 260rpx;
align-items: center;
justify-content: center;
@include theme("btn_bg");
height: 60rpx;
// width: 46%;
overflow: hidden;
border-radius: 30rpx;
text {
padding-left: 10rpx;
font-size: 28rpx;
color: #fff;
}
}
.courseItemleve1 {
padding: 20rpx;
border-radius: 20rpx;
// border: 1px solid #eee;
overflow: hidden;
margin-bottom: 30rpx;
@include mshadow(10px,8);
@include mshadow(10px, 8);
background: $containerColor;
}
@@ -417,24 +487,57 @@
margin-bottom: 20rpx;
font-size: 28rpx;
// background-color: #82aee2;
border-radius: 20rpx; padding:10rpx;
border-radius: 20rpx;
padding: 10rpx;
border: 2px solid #82aee2;
.pbox{
justify-content: center;
width: 100%; text-align: center;}
text{
.pbox {
justify-content: center;
width: 100%;
text-align: center;
}
text {
// color: #fff;
}
.mname{display: block; text-align: center; margin-bottom: 10rpx; color: #694bc6;}
.mname {
display: block;
text-align: center;
margin-bottom: 10rpx;
color: #694bc6;
}
}
.priceItem.isBuy{position: relative; border-color:#b3b3b3; overflow: hidden; background-color: #f3f3f3;}
.isBuy{
.haveBuy{position: absolute; padding:2rpx 6rpx; border-radius:0 0 0 20rpx ; right: 0; top: 0; z-index: 1; background-color: #e1e1e1; font-style: normal; font-size: 24rpx;}
.mname{color: inherit;}
.priceItem.isBuy {
position: relative;
border-color: #b3b3b3;
overflow: hidden;
background-color: #f3f3f3;
}
.isBuy {
.haveBuy {
position: absolute;
padding: 2rpx 6rpx;
border-radius: 0 0 0 20rpx;
right: 0;
top: 0;
z-index: 1;
background-color: #e1e1e1;
font-style: normal;
font-size: 24rpx;
}
.mname {
color: inherit;
}
}
.courseItem {
// background: #b9d4f2;
font-weight: bold; border-bottom: 1px solid #e1e1e1;
font-weight: bold;
border-bottom: 1px solid #e1e1e1;
// border-radius: 20rpx;
align-items: center;
margin-bottom: 20rpx;
@@ -442,6 +545,7 @@
padding: 10rpx 10rpx;
width: 100%;
color: $themeColor;
.u-icon {
display: inline-block;
}
@@ -454,6 +558,7 @@
.container {
background-color: $containerColor;
.content {
padding: 0 20rpx;
}