超V专享加限制

pages/course/courseDetail.vue

@@ -1,8 +1,5 @@
 <template>
-  <view
+	<view class="container commonPageBox commonDetailPage" style="height: auto !important">
-    class="container commonPageBox commonDetailPage"
-    style="height: auto !important"
-  >
 		<!-- 公共组件-每个页面必须引入 -->
 		<public-module></public-module>
 		<!-- <z-nav-bar :title="pageTitle ? pageTitle : '课程详情'"> -->
@@ -13,20 +10,13 @@
 		</z-nav-bar>
 
 		<view class="contentBox commonPageContentBox">
-      <u-alert
+			<u-alert v-if="goBuyTitle && isAndorid" style="
-        v-if="goBuyTitle && isAndorid"
-        style="
           background: linear-gradient(90deg, #258feb 0%, #00e1ec 100%);
           position: fixed;
           left: 0;
           width: 100%;
           z-index: 10;
-        "
+        " type="warning" @click="handleClickGetVip" :title="goBuyTitle" :show-icon="true">
-        type="warning"
-        @click="handleClickGetVip"
-        :title="goBuyTitle"
-        :show-icon="true"
-      >
 				<template slot="rightSlot" slot-scope="slotProps">
 					<text class="saveBtn vipBtn flexbox buyBtn" v-if="goBuyType == 0">
 						立即购买
@@ -47,11 +37,7 @@
 
 			<!--  <scroll-view scroll-y="true" class="scroll-Y"> -->
 			<view class="curseImg" style="padding-top: 80rpx">
-        <image
+				<image v-if="!course.image" src="/static/nobg.jpg" mode="widthFix"></image>
-          v-if="!course.image"
-          src="/static/nobg.jpg"
-          mode="widthFix"
-        ></image>
 				<image v-else :src="course.image" mode="widthFix"></image>
 			</view>
 			<view class="containerBg1">
@@ -63,29 +49,18 @@
 							<!-- <view class="start_learn_btn PM_font"
 								@click="onPageJump('/pages/course/myCourseLearn', course.id)">进入学习</view> -->
 						</view>
-            <view
+						<view class="containerBg" v-if="course.content && course.content != ''">
-              class="containerBg"
-              v-if="course.content && course.content != ''"
-            >
 							<view class="prof">
-                <view
+								<view style="position: relative; display: flex; align-items: center">
-                  style="position: relative; display: flex; align-items: center"
+									<view :class="`${isHideCourseInfo ? 'hidden2' : ''}`"
-                >
+										style="width: calc(100% - 50rpx); font-size: 30rpx" v-html="course.content">
-                  <view
-                    :class="`${isHideCourseInfo ? 'hidden2' : ''}`"
-                    style="width: calc(100% - 50rpx); font-size: 30rpx"
-                    v-html="course.content"
-                  >
 									</view>
-                  <text
+									<text @click="isHideCourseInfo = !isHideCourseInfo" style="
-                    @click="isHideCourseInfo = !isHideCourseInfo"
-                    style="
                       position: absolute;
                       bottom: 0;
                       right: 0;
                       color: #838588;
-                    "
+                    ">
-                  >
 										{{ isHideCourseInfo ? "展开" : "收起" }}
 									</text>
 								</view>
@@ -97,37 +72,25 @@
 
 			<view class="containerBg2">
 				<!-- 目录 -->
-        <view
+				<view :class="[
-          :class="[
             'coursePart',
             'flexbox',
             userMsg.vip != 0 ? 'vipBgColor' : '',
-          ]"
+          ]" v-if="librayList.length > 1">
-          v-if="librayList.length > 1"
+					<view :class="['item', 'flexbox', curId == item.id ? 'active' : '']"
-        >
+						v-for="(item, index) in librayList" :key="index" @click="clicklib(item, index)">
-          <view
+						<view class=""><text>{{ item.title }}</text></view>
-            :class="['item', 'flexbox', curId == item.id ? 'active' : '']"
-            v-for="(item, index) in librayList"
-            :key="index"
-            @click="clicklib(item, index)"
-          >
-            <view class=""
-              ><text>{{ item.title }}</text></view
-            >
 					</view>
 				</view>
 				<!-- end -->
 				<template v-if="librayList[curIndex]">
-          <view
+					<view :class="['endBox', userMsg.vip != 0 ? 'vipBgColor' : '']"
-            :class="['endBox', userMsg.vip != 0 ? 'vipBgColor' : '']"
+						v-if="librayList[curIndex].isBuy == 1 || userMsg.vip != 0">
-            v-if="librayList[curIndex].isBuy == 1 || userMsg.vip != 0"
-          >
 						<!-- 已经可以观看的情况 -->
 						<view class="box">
 							<view class="flexbox" v-if="userMsg.vip != 0">
 								<!-- vip到期时间 -->
-                <text
+								<text>VIP畅学权益有效期截止到：{{ userMsg.userVip.endTime }}
-                  >VIP畅学权益有效期截止到：{{ userMsg.userVip.endTime }}
 								</text>
 								<!-- <uni-tag type="warning" text="去学习"></uni-tag> -->
 							</view>
@@ -137,15 +100,11 @@
 								</template>
 								<template v-else>
 									<!-- 实际购买课程到期时间 -->
-                  <text style="line-height: 50rpx"
+									<text style="line-height: 50rpx">课程有效期截止到：{{ librayList[curIndex].endTime }}
-                    >课程有效期截止到：{{ librayList[curIndex].endTime }}
 									</text>
 									<!-- 自己买的可以续费 -->
-                  <text
+									<text class="xufeiBtn"
-                    class="xufeiBtn"
+										@click="handleClickGetGoodsList(librayList[curIndex])">续费</text>
-                    @click="handleClickGetGoodsList(librayList[curIndex])"
-                    >续费</text
-                  >
 								</template>
 							</view>
 						</view>
@@ -158,21 +117,10 @@
 								即可学习本目录课程
 							</view>
 							<view class="tag-view flex_box">
-                <u-button
+								<u-button class="btn" type="warning" size="small"
-                  class="btn"
+									@click="handleClickGetGoodsList(librayList[curIndex])" text="购买课程"></u-button>
-                  type="warning"
+								<u-button size="small" v-if="isAndorid" class="btn" type="primary"
-                  size="small"
+									@click="onPageJump('/pages/mine/vip/index')" text="开通VIP"></u-button>
-                  @click="handleClickGetGoodsList(librayList[curIndex])"
-                  text="购买课程"
-                ></u-button>
-                <u-button
-                  size="small"
-                  v-if="isAndorid"
-                  class="btn"
-                  type="primary"
-                  @click="onPageJump('/pages/mine/vip/index')"
-                  text="开通VIP"
-                ></u-button>
 								<!-- <uni-tag   size="normal" style="margin-left: 20rpx;" text="" type="success" /> -->
 							</view>
 						</view>
@@ -180,81 +128,46 @@
 				</template>
 
 				<view class="shiting_content">
-          <view
+					<view :class="[
-            :class="[
               'chapter_content',
               userMsg.vip != 0 ? 'vipchapter_content' : '',
-            ]"
+            ]" v-if="chapterList.length > 0">
-            v-if="chapterList.length > 0"
-          >
 						<view class="vipSee" v-if="userMsg && userMsg.vip != 0">
 							<text>VIP畅学权益生效中</text>
 						</view>
-            <view
+						<view @click="gotoDetail(item, index)" class="item" v-for="(item, index) in chapterList"
-              @click="gotoDetail(item, index)"
+							:key="index">
-              class="item"
-              v-for="(item, index) in chapterList"
-              :key="index"
-            >
 							<view class="item_videoList">
 								<view class="flexbox" style="align-items: center">
-                  <view
+									<view :class="[
-                    :class="[
                       'textBox',
                       'flex_box',
                       librayList[curIndex].isBuy == 0 ? 'lock' : '',
-                    ]"
+                    ]">
-                  >
 										<text class="hidden1">{{ item.title }}</text>
 										<!-- {{item.isAudition}}-{{librayList[curIndex].isBuy}}-{{userMsg.vip}} -->
-                    <uni-tag
+										<uni-tag v-if="
-                      v-if="
                         item.isAudition == 1 &&
                         librayList[curIndex].isBuy == 0 &&
                         userMsg.vip == 0
-                      "
+                      " style="margin-left: 10rpx" :inverted="true" text="试听" size="mini" type="success" />
-                      style="margin-left: 10rpx"
+										<template v-if="
-                      :inverted="true"
-                      text="试听"
-                      size="mini"
-                      type="success"
-                    />
-                    <template
-                      v-if="
                         (librayList[curIndex] &&
                           librayList[curIndex].isBuy == 1) ||
                         userMsg.vip != 0
-                      "
+                      ">
-                    >
+											<uni-tag v-if="item.isLearned == 0" style="margin-left: 10rpx"
-                      <uni-tag
+												:inverted="true" text="未学" size="mini" type="primary" />
-                        v-if="item.isLearned == 0"
+											<uni-tag v-if="item.isLearned == 1" style="margin-left: 10rpx"
-                        style="margin-left: 10rpx"
+												:inverted="true" text="已学" size="mini" type="success" />
-                        :inverted="true"
-                        text="未学"
-                        size="mini"
-                        type="primary"
-                      />
-                      <uni-tag
-                        v-if="item.isLearned == 1"
-                        style="margin-left: 10rpx"
-                        :inverted="true"
-                        text="已学"
-                        size="mini"
-                        type="success"
-                      />
 										</template>
 									</view>
 									<view class="shitingTag">
-                    <u-icon
+										<u-icon v-if="
-                      v-if="
                         librayList[curIndex].isBuy == 0 &&
                         userMsg.vip == 0 &&
                         item.isAudition == 0
-                      "
+                      " name="lock" color="#258feb" size="28"></u-icon>
-                      name="lock"
-                      color="#258feb"
-                      size="28"
-                    ></u-icon>
 									</view>
 								</view>
 							</view>
@@ -264,41 +177,22 @@
 				</view>
 			</view>
 			<view class="completionBg">
-        <uni-section
+				<uni-section class="mb-10" style="padding: 0 20rpx" title="学习进度" type="line"
-          class="mb-10"
+					v-if="librayList.length > 0 && librayList[curIndex].completion > 0">
-          style="padding: 0 20rpx"
-          title="学习进度"
-          type="line"
-          v-if="librayList.length > 0 && librayList[curIndex].completion > 0"
-        >
 					<view class="progress-box">
-            <progress
+						<progress :percent="librayList[curIndex].completion" show-info stroke-width="3" />
-              :percent="librayList[curIndex].completion"
-              show-info
-              stroke-width="3"
-            />
 					</view>
 				</uni-section>
 			</view>
 			<view class="linkPro" v-if="tjProList.length > 0">
-        <uni-section
+				<uni-section style="padding: 0 20rpx" class="mb-10 graybg" title="相关书籍" type="line">
-          style="padding: 0 20rpx"
-          class="mb-10 graybg"
-          title="相关书籍"
-          type="line"
-        >
 					<!-- <template v-slot:right>
 						<span class="more" @click="pageJupm()">查看更多 >></span>
 					</template> -->
 				</uni-section>
 				<view class="list supermarketBox">
 					<scroll-view class="scroll-view_H" scroll-x="true">
-            <view
+						<view class="item" v-for="(item, index) in tjProList" :key="index" @click="goToGoodsList(item)">
-              class="item"
-              v-for="(item, index) in tjProList"
-              :key="index"
-              @click="goToGoodsList(item)"
-            >
 							<view class="imgcontainer">
 								<image :src="item.productImages" mode="aspectFit"></image>
 							</view>
@@ -306,10 +200,7 @@
 								{{ item.productName }}
 							</view>
 
-              <view
+							<view class="price" v-if="item.activityPrice && item.activityPrice > 0">
-                class="price"
-                v-if="item.activityPrice && item.activityPrice > 0"
-              >
 								￥{{ item.activityPrice }}
 							</view>
 							<view class="price" v-else> ￥{{ item.price }} </view>
@@ -318,12 +209,7 @@
 				</view>
 			</view>
 			<view style="background: rgba(255, 255, 255, 0.85) !important">
-        <uni-section
+				<uni-section style="padding: 0 20rpx" class="mb-10 graybg" title="留言板" type="line">
-          style="padding: 0 20rpx"
-          class="mb-10 graybg"
-          title="留言板"
-          type="line"
-        >
 					<template v-slot:right>
 						<view class="flexbox" style="align-items: center" @click="addSay()">
 							<u-icon name="edit-pen" color="#2979ff" size="28"></u-icon>
@@ -333,11 +219,7 @@
 				</uni-section>
 				<view class="liuyanBox">
 					<view class="" v-if="sayList.length > 0">
-            <commentsList
+						<commentsList :sayList="sayList" @support="support" @showSayModule="showSayModule">
-              :sayList="sayList"
-              @support="support"
-              @showSayModule="showSayModule"
-            >
 						</commentsList>
 					</view>
 					<u-divider v-show="status == 2" text="已加载全部"></u-divider>
@@ -350,12 +232,8 @@
 				<view class="proListPrice" v-if="proPriceList.length > 0">
 					<view class="title"> 请选择 </view>
 					<view class="list">
-            <view
+						<view :class="['item', curProId == item.productId ? 'active' : '']"
-              :class="['item', curProId == item.productId ? 'active' : '']"
+							v-for="(item, index) in proPriceList" :key="index" @click="choosePrice(item)">
-              v-for="(item, index) in proPriceList"
-              :key="index"
-              @click="choosePrice(item)"
-            >
 							{{ item.productName }} - ￥{{ item.price }}
 						</view>
 					</view>
@@ -364,11 +242,7 @@
 							<uni-icons type="cart" size="28" style="color: #666"></uni-icons>
 							<text>加入购物车</text>
 						</view>
-            <view
+						<view style="margin-left: 40rpx" class="saveBtnss buybtn flexbox" @click="openBuyInfoModal">
-              style="margin-left: 40rpx"
-              class="saveBtnss buybtn flexbox"
-              @click="openBuyInfoModal"
-            >
 							<u-icon name="bag" color="#fff" size="28"></u-icon>
 							<text>立即购买</text>
 						</view>
@@ -376,12 +250,8 @@
 				</view>
 			</u-popup>
 			<view>
-        <u-back-top
+				<u-back-top :scroll-top="scrollTop" bottom="150" :customStyle="bgiStyle"
-          :scroll-top="scrollTop"
+					:iconStyle="iconStyle"></u-back-top>
-          bottom="150"
-          :customStyle="bgiStyle"
-          :iconStyle="iconStyle"
-        ></u-back-top>
 			</view>
 			<!-- </view> -->
 			<!-- 评论弹出 -->
@@ -394,34 +264,16 @@
 					</view>
 					<view class="input_addIcon flexbox">
 						<view class="editorBox">
-              <editor
+							<editor id="editor" class="ql-container" placeholder="~ 和谐社会 友善发言 ~" show-img-size
-                id="editor"
+								show-img-toolbar show-img-resize @statuschange="onStatusChange" :read-only="readOnly"
-                class="ql-container"
+								@ready="onEditorReady">
-                placeholder="~ 和谐社会 友善发言 ~"
-                show-img-size
-                show-img-toolbar
-                show-img-resize
-                @statuschange="onStatusChange"
-                :read-only="readOnly"
-                @ready="onEditorReady"
-              >
 							</editor>
 						</view>
 						<view class="icon flexbox">
-              <u-icon
+							<u-icon v-show="!showEdit" @click="chooseImg" name="plus" color="#2979ff"
-                v-show="!showEdit"
+								size="28"></u-icon>
-                @click="chooseImg"
+							<u-icon v-show="showEdit" @click="editEditor" name="edit-pen" color="#2979ff"
-                name="plus"
+								size="28"></u-icon>
-                color="#2979ff"
-                size="28"
-              ></u-icon>
-              <u-icon
-                v-show="showEdit"
-                @click="editEditor"
-                name="edit-pen"
-                color="#2979ff"
-                size="28"
-              ></u-icon>
 						</view>
 					</view>
 					<!-- 选择表情还是图片 -->
@@ -436,21 +288,10 @@
 								</view>
 							</view>
 						</view>
-            <view
+						<view @click="checkPermision" class="picBtn item flexbox" v-show="uploadPicLIst.length < 3">
-              @click="checkPermision"
-              class="picBtn item flexbox"
-              v-show="uploadPicLIst.length < 3"
-            >
 							<view class="" style="">
-                <u-upload
+								<u-upload @afterRead="addPic" @delete="deletePic" multiple :maxCount="3" width="40"
-                  @afterRead="addPic"
+									height="40" :previewFullImage="true">
-                  @delete="deletePic"
-                  multiple
-                  :maxCount="3"
-                  width="40"
-                  height="40"
-                  :previewFullImage="true"
-                >
 								</u-upload>
 							</view>
 
@@ -465,23 +306,13 @@
 					<!-- 上传的图片 -->
 					<view class="" v-if="uploadPicLIst.length > 0">
 						<view class="" style="text-align: right">
-              <text style="font-size: 24rpx; color: #999"
+							<text style="font-size: 24rpx; color: #999">最多可上传3张图片哦</text>
-                >最多可上传3张图片哦</text
-              >
 						</view>
 
 						<view class="upimgList flexbox">
-              <view
+							<view class="item" v-for="(item, index) in uploadPicLIst" :key="index">
-                class="item"
-                v-for="(item, index) in uploadPicLIst"
-                :key="index"
-              >
 								<view class="imgbox" style="overflow: hidden">
-                  <image
+									<image @click="previewImage(item.url)" :src="item.url" mode="widthFix">
-                    @click="previewImage(item.url)"
-                    :src="item.url"
-                    mode="widthFix"
-                  >
 									</image>
 								</view>
 								<span @click="deletePic(item, index)">×</span>
@@ -491,11 +322,7 @@
 					<!-- 表情 -->
 					<view class="emoji" v-if="showEmoji">
 						<!-- <text class="" @click="closeEmoji">关闭</text> -->
-            <emotion
+						<emotion @emotion="handleEmj" :height="220" :windowWidth="windowWidth">
-              @emotion="handleEmj"
-              :height="220"
-              :windowWidth="windowWidth"
-            >
 						</emotion>
 					</view>
 					<view class="sbmitBox">
@@ -505,18 +332,12 @@
 			</u-popup>
 		</view>
 
-    <common-select-goods
+		<common-select-goods ref="commonSelectGoods" :selectGoodsData="selectGoodsData" :goodsList="goodsList"
-      ref="commonSelectGoods"
+			:buyOptions="buyOptions" :customButtonGroup1="customButtonGroup1" @selectGoods="handleClickSelectGoods"
-      :selectGoodsData="selectGoodsData"
-      :goodsList="goodsList"
-      :buyOptions="buyOptions"
-      :customButtonGroup1="customButtonGroup1"
-      @selectGoods="handleClickSelectGoods"
 			@onHandleClickBuy="
         $refs.commonSelectGoods.close();
         protocolShow = true;
-      "
+      "></common-select-goods>
-    ></common-select-goods>
 		<u-popup :show="protocolShow" mode="center" round="6">
 			<view class="popup_box">
 				<view class="title">温馨提示</view>
@@ -538,17 +359,8 @@
 					</view>
 					<view class="bottom">
 						<view class="button_box">
-              <u-button
+							<u-button size="small" text="不同意" @click="protocolShow = false"></u-button>
-                size="small"
+							<u-button text="同意" color="#258feb" size="small" @click="onHandleClickBuy"></u-button>
-                text="不同意"
-                @click="protocolShow = false"
-              ></u-button>
-              <u-button
-                text="同意"
-                color="#258feb"
-                size="small"
-                @click="onHandleClickBuy"
-              ></u-button>
 						</view>
 					</view>
 				</view>
@@ -570,15 +382,16 @@ import emotion from "@/bkhumor-emojiplus/components/bkhumor-emojiplus/bkhumor-em
 	import $http from "@/config/requestConfig.js";
 	import permission from "@/js_sdk/wa-permission/permission.js";
 	var clear;
-import { mapState } from "vuex";
+	import {
+		mapState
+	} from "vuex";
 	export default {
 		data() {
 			return {
 				goodsList: [],
 				currentCateIndex: 0,
 				protocolShow: false,
-      ordersTabs: [
+				ordersTabs: [{
-        {
 						name: "简介",
 						value: 0,
 					},
@@ -668,14 +481,12 @@ export default {
 					// 	info: 2
 					// }
 				],
-      customButtonGroup1: [
+				customButtonGroup1: [{
-        {
 					with: 200,
 					text: "立即购买",
 					backgroundColor: "linear-gradient(90deg, #3C77BE 0%,#258feb 100%)",
 					color: "#fff",
-        },
+				}, ],
-      ],
 				urlList: {
 					list: "sociology/course/getCourseDetail",
 					goodsList: "sociology/product/getProductListForCourse",
@@ -853,9 +664,9 @@ export default {
 					let noRecored = false;
 					v.isAudition == 1 &&
 						this.userMsg.vip == 0 &&
-        this.librayList[this.curIndex].isBuy == 0
+						this.librayList[this.curIndex].isBuy == 0 ?
-          ? (noRecored = true)
+						(noRecored = true) :
-          : "";
+						"";
 					uni.navigateTo({
 						url: `${_myurl}?navTitle=${this.pageTitle}&title=${v.title}&id=${v.id}&conditions=${v.conditions}&noRecored=${noRecored}`,
 					});
@@ -913,6 +724,13 @@ export default {
 							}
 							this.$forceUpdate();
 						});
+				} else if (v.type == 2 && this.userMsg.vip != 1) {
+					uni.showModal({
+						title: '提示',
+						content: '当前课程目录是超V专享,开通超V可观看',
+						confirmText: '好的',
+						showCancel: false
+					})
 				} else {
 					this.$http
 						.request({
@@ -1594,15 +1412,18 @@ export default {
 		background-color: #fff;
 		border-bottom: 1px solid #eee;
 	}
+
 	.endBox {
 		// @include theme("vipbtnbg");
 		color: #333;
 		font-size: 26rpx;
 		// margin: 20rpx 0;
 		padding: 10rpx 20rpx;
+
 		.box {
 			// background-color: #258feb;
 		}
+
 		.flexbox {
 			justify-content: space-between;
 		}
@@ -2084,13 +1905,11 @@ export default {
 		width: 100%;
 		font-size: 28rpx;
 		flex-wrap: wrap;
-  background-image: linear-gradient(
+		background-image: linear-gradient(60deg,
-    60deg,
 				#e0e9f6 0%,
 				#ece6fa 30%,
 				#d7e8f0 60%,
-    #fff 100%
+				#fff 100%);
-  );
 		// background: rgba(255, 255, 255, 0.9);
 
 		.item {
@@ -2193,8 +2012,7 @@ export default {
 		padding-bottom: 40rpx;
 	}
 
-.buyBox {
+	.buyBox {}
-}
 
 	.vipBgColor {
 		// background-color: #8265f9 !important;
@@ -2416,9 +2234,11 @@ export default {
 	/deep/.u-icon__icon--warning {
 		color: #fff !important;
 	}
+
 	/deep/.uni-tag {
 		border-width: 2rpx !important;
 	}
+
 	/deep/.uni-section {
 		background: transparent !important;
 	}
@@ -2608,8 +2428,7 @@ export default {
 		}
 	}
 
-.commonDetailPage {
+	.commonDetailPage {}
-}
 
 	.course_info_box {
 		margin-bottom: 10rpx;