购物车逻辑更改

common/httpList/goods.js

@@ -452,6 +452,13 @@ export default {
       data: data,
     });
   },
+  updateCartCheckStatus(data) {
+    return myRequest({
+      url: "/base/cart/updateBatchChoice",
+      method: "post",
+      data: data,
+    });
+  },
   cartList(data) {
     return myRequest({
       url: "/base/cart/list",

pages2/bank/detail.vue

@@ -611,6 +611,7 @@ export default {
       this.$api
         .addCart({
           goodsId: goodsId,
+          choiceStatus: 1,
         })
         .then((res) => {
           if (res.data.code == 200) {

pages3/course/detail.vue

@@ -726,6 +726,7 @@ export default {
       this.$api
         .addCart({
           goodsIds: goodsIds,
+          choiceStatus: 1,
         })
         .then((res) => {
           if (res.data.code == 200) {

pages4/shopping/shoppingCart.vue

@@ -10,10 +10,10 @@
           <uni-swipe-action>
             <u-checkbox-group @change="checkboxGroupChange" placement="column">
               <view>
+                <!-- :show="item.show" -->
                 <uni-swipe-action-item
                   :autoClose="false"
                   @change="swipeChange($event, item)"
-                  :show="item.show"
                   v-for="(item, index) in list"
                   :key="index"
                 >
@@ -21,12 +21,12 @@
                     <view class="item-wrap">
                       <view class="goods-msg">
                         <u-checkbox
-                          @change="checkboxChange"
-                          :disabled="item.goodsStatus == 0"
+                          :disabled="item.disabled"
                           style="width: 100%"
-                          v-model="list[index].checked"
+                          v-model="item.checked"
+                          @change="checkboxChange"
                           shape="circle"
-                          :name="index"
+                          :name="item.id"
                         >
                           <view class="flex">
                             <view class="goods-img">
@@ -52,7 +52,11 @@
                       </view>
                       <view
                         class="goods-select"
-                        v-if="item.templateType != null && item.goodsType == 1"
+                        v-if="
+                          item.templateType != null &&
+                          item.goodsType == 1 &&
+                          !item.disabled
+                        "
                       >
                         <u-line color="#D6D6DB" />
                         <view
@@ -282,15 +286,13 @@ export default {
     return {
       gradeValue: -1,
       isLogin: false,
-      allChecked: false,
       checkboxValue1: [],
       list: [],
-      value1: "",
+      value: "",
       show: false,
       show1: false,
-      totalPrice: 0.0,
+      allChecked: false,
       isOld: false,
-      checkboxList: [],
       gradeList: [],
       examine: [],
       provinceList: [],
@@ -305,9 +307,29 @@ export default {
       cAreaIndex: 0,
       examIndex: 0,
       current: 3,
+      indicatorStyle: `height: 50px;`,
     };
   },
-  computed: { ...mapGetters(["userInfo", "hideBuyState", "config"]) },
+  computed: {
+    ...mapGetters(["userInfo", "hideBuyState", "config"]),
+    totalPrice() {
+      let price = 0;
+      this.checkList.forEach((e) => (price += e.standPrice));
+      return price;
+    },
+    canCheckList() {
+      return this.list.filter((e) => e.status == 1 && e.goodsStatus == 1);
+    },
+    checkList() {
+      return this.canCheckList.filter((e) => e.checked == true);
+    },
+    selectGreadeId() {
+      if (this.detail.gradObj) {
+        return this.detail.gradObj.gradeId;
+      }
+      return "";
+    },
+  },
   onLoad(option) {
     // console.log(option,987)
   },
@@ -447,14 +469,17 @@ export default {
             };
             self.gradeList.push(item);
           }
+          this.gradeValue = self.gradeList.findIndex(
+            (e) => e.gradeId == this.selectGreadeId
+          );
         }
       });
     },
     openPopup(index, item, itemIndex) {
       this.detail = item;
+      console.log(this.detail, 798);
       this.detailIndex = itemIndex;
       if (index == 0) {
-        this.gradeValue = -1;
         this.show = true;
         this.goodsGradeList(item.goodsId);
       } else {
@@ -462,50 +487,72 @@ export default {
           applyAreasJson: null,
           examDateJson: null,
         };
-        (this.pAreaIndex = 0),
-          (this.cAreaIndex = 0),
-          (this.examIndex = 0),
-          (this.show1 = true);
+        this.pAreaIndex = 0;
+        this.cAreaIndex = 0;
+        this.examIndex = 0;
+        this.show1 = true;
         this.getProvinceList();
         this.getExamine(item.projectId);
       }
     },
     checkboxGroupChange(e) {
-      this.checkboxList = e;
-      if (this.checkboxList.length == this.list.length) {
-        this.allChecked = true;
-      } else {
-        this.allChecked = false;
-      }
+      this.allChecked = this.canCheckList.length === this.checkList.length;
+    },
+    checkboxChange(e) {
+      this.updateCartCheckStatus([e.name], e.value);
     },
-
     login() {
       uni.navigateTo({ url: "/pages4/login/login" });
     },
     cartList() {
       let self = this;
-      this.allChecked = false;
-      this.totalPrice = 0.0;
-      this.checkboxList = [];
       this.$api.cartList().then((res) => {
-        if (res.data.code == 200) {
-          for (let i = 0; i < res.data.rows.length; i++) {
-            let item = res.data.rows[i];
-            item.checked = false;
-            if (item.status != 1 || item.goodsStatus != 1) {
+        let { code, rows } = res.data;
+        if (code == 200) {
+          for (const item of rows) {
+            let {
+              choiceStatus,
+              goodsStatus,
+              status,
+              gradeList,
+              templateType,
+              goodsType,
+            } = item;
+            item.gradObj = {};
+            item.show = false;
+            item.applyAreas = {};
+            item.examDate = {};
+            if (status != 1 || goodsStatus != 1) {
               item.disabled = true;
             } else {
               item.disabled = false;
+              item.checked = choiceStatus == 1;
+              if (templateType === "class" && goodsType == 1) {
+                // 无返回就默认系统分班
+                if (gradeList || gradeList.length === 0) {
+                  gradeList = [
+                    {
+                      className: "系统分班",
+                      gradeId: 0,
+                    },
+                  ];
+                }
+                item.gradObj = item.gradeList[0];
+              }
             }
-            item.show = false;
-            item.gradObj = {}; //存储班级
-            item.applyAreas = {};
-            item.examDate = {};
           }
           self.list = res.data.rows;
+          this.checkboxGroupChange();
         }
       });
     },
+    updateCartCheckStatus(ids, check) {
+      let data = {
+        ids,
+        choiceStatus: check ? 1 : 0,
+      };
+      this.$api.updateCartCheckStatus(data).then((res) => {});
+    },
     delItem(item) {
       let self = this;
       this.$api.deleteCart(item.id).then((res) => {
@@ -518,7 +565,7 @@ export default {
       item.show = e;
     },
     goBuy() {
-      if (this.checkboxList.length == 0) {
+      if (this.checkList.length == 0) {
         uni.showModal({
           title: "提示",
           content: "请选择商品",
@@ -526,11 +573,7 @@ export default {
         });
         return;
       }
-      let checkGoodsList = [];
-      for (let i = 0; i < this.checkboxList.length; i++) {
-        let index = this.checkboxList[i];
-        let item = this.list[index];
-        checkGoodsList.push(item);
+      this.checkList.forEach((item) => {
         if (item.templateType == "class" && item.goodsType == 1) {
           if (!item.gradObj.className) {
             uni.showModal({
@@ -551,38 +594,19 @@ export default {
           // 	return false;
           // }
         }
-      }
+      });
       this.$store.commit("setShoppingCartList", {
-        shoppingCartList: checkGoodsList,
+        shoppingCartList: this.checkList,
       });
       this.$navTo.togo("/pages2/order/confirm_pay?fromCart=true");
     },
-    checkboxChange(n) {
-      this.$nextTick(() => {
-        this.totalPrice = 0.0;
-        for (let i = 0; i < this.list.length; i++) {
-          if (this.list[i].checked) {
-            this.totalPrice += this.list[i].standPrice;
-          }
-        }
-      });
-    },
     checkboxAllChange(n) {
-      this.$nextTick(() => {
-        this.totalPrice = 0.0;
-        this.checkboxList = [];
-        if (n.value) {
-          for (let i = 0; i < this.list.length; i++) {
-            this.list[i].checked = true;
-            this.totalPrice += this.list[i].standPrice;
-            this.checkboxList.push(i);
-          }
-        } else {
-          for (let i = 0; i < this.list.length; i++) {
-            this.list[i].checked = false;
-          }
-        }
+      let ids = [];
+      this.canCheckList.forEach((e) => {
+        e.checked = n.value;
+        ids.push(e.id);
       });
+      this.updateCartCheckStatus(ids, n.value);
     },
   },
   components: { ClassTimeTip, navLogo },

pages5/liveDetail/index.vue

@@ -1,564 +1,646 @@
 <template>
-	<view>
-		<nav-bar title="课程详情"></nav-bar>
-		<view class="videoBox" >
-			<view >
-				<view class="video_box" v-if="!startStatus">
-					<image :src="$method.splitImgHost(detail.coverUrl)" style="width: 100%;height: 460rpx;"></image>
-					<image v-if="false" class="video_play" src="/static/play.png" @click="startVideo"></image>
-				</view>
-				<view v-else class="video_box" style="width: 100%;height: 460rpx;">
-					<polyv-player
-						id="playerVideo"
-						playerId="playerVideo"
-						height="460rpx"
-						:vid="vid"
-						:showSettingBtn="true"
-						:enablePlayGesture="true"
-						:playbackRate="playbackRate"
-						:isAllowSeek="isAllowSeek"
-						:autoplay="autoplay"
-						:startTime="startTime"
-						@statechange="onStateChange"
-					></polyv-player>
-				</view>
-				<view style="padding:20rpx;">
-					<view style="display: flex;">
-						<view class="yearTag" v-if="detail.year">{{detail.year}}</view>
-						<view class="titleTag">{{detail.goodsName}}</view>
-					</view>
-					<view style="display: flex;justify-content: space-between;margin-top: 13rpx;">
-						<view class="noteTag"><image src="/static/icon/wk_icon1.png" class="wk_icon"></image>
-						共 <text class="blackFont">{{courseList.length}} 课程 {{detail.classHours}}</text> 学时</view>
-						
-					</view>
-				</view>
-			</view>
-			<u-line color="#D6D6DB" />
-			<view style="height: 80rpx;">
-				<view><u-tabs :list="list" :item-width="itemWidth()" font-size="30" bar-width="24"  :current="current" @change="change" active-color="#007AFF"></u-tabs></view>
-			</view>
-			
-		</view>
-		<view style="padding: 20rpx;padding-bottom: 100rpx;position: relative;" v-show="current==0">
-			<view class="content">
-				<view v-html="detail.mobileDetailHtml" style="width: 100%;overflow: hidden;"></view>
-			</view>
-		</view>
-		<view style="padding: 20rpx;padding-bottom: 100rpx;position: relative;" v-show="current==1">
-			<view >
-				<view v-for="(item,index) in courseList" :key="index" >
-					<view class="courseItemBox" >
-						<view class="courseItem" @click="openCourse(item)">
-							<view class="courseName">{{item.courseName}}</view>
-							<view>
-								<image src="/static/icon/up.png" class="icon_up" v-if="item.down"></image>
-								<image src="/static/icon/down.png" class="icon_up" v-if="!item.down"></image>
-							</view>
-						</view>
-						<view v-show="!item.down">
-							<view v-for="(itemM,indexM) in item.menuList"  :key="indexM">
-								<courseModule :courseId="itemM.courseId" :needOpen="(isFirstEnter && menuIndex[0] === index && menuIndex[1] === indexM) ? true : false" v-if="itemM.type==1" :menuItem="itemM"></courseModule>
-								<courseChapter :courseId="itemM.courseId" :needOpen="(isFirstEnter && menuIndex[0] === index && menuIndex[1] === indexM) ? true : false" v-if="itemM.type==2" :isBuy="false" :menuItem="itemM"></courseChapter>
-								<courseSection :courseId="itemM.courseId" v-if="itemM.type==3" :isBuy="false" :menuItem="itemM"></courseSection>
-								<u-line></u-line>
-								
-							</view>
-						</view>
-					</view>
-					
-				</view>
-			</view>
-		</view>
-		<view style="padding: 20rpx;padding-bottom: 100rpx;position: relative;" v-show="current==2">
-			<view >
-				<view v-for="(item,index) in freeMenuList" :key="index" >
-					<view class="courseItemBox" >
-						<view class="courseItem">
-							<view class="courseName">{{item.freeExamName}}</view>
-						</view>
-					</view>
-					
-				</view>
-			</view>
-		</view>
-		<view class="bottomBox" v-if="!hideBuyState">
-			<view>
-				<text class="priceTag">¥ {{toFixed(detail.standPrice)}}</text>
-				<!-- <view class="priceTag">¥ {{toFixed(detail.linePrice)}}</view> -->
-				<text v-if="detail.linePrice" class="sale"> ¥ </text>
-				<text v-if="detail.linePrice" class="price_line">&nbsp;{{ detail.linePrice }}</text>
-			</view>
-			<view style="display: flex;color: #FFFFFF;align-items: center;">
-				<view class="btn1" @click="addCart">加购物车</view>
-				<view class="btn2" @click="buy">立即购买 </view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <nav-bar title="课程详情"></nav-bar>
+    <view class="videoBox">
+      <view>
+        <view class="video_box" v-if="!startStatus">
+          <image
+            :src="$method.splitImgHost(detail.coverUrl)"
+            style="width: 100%; height: 460rpx"
+          ></image>
+          <image
+            v-if="false"
+            class="video_play"
+            src="/static/play.png"
+            @click="startVideo"
+          ></image>
+        </view>
+        <view v-else class="video_box" style="width: 100%; height: 460rpx">
+          <polyv-player
+            id="playerVideo"
+            playerId="playerVideo"
+            height="460rpx"
+            :vid="vid"
+            :showSettingBtn="true"
+            :enablePlayGesture="true"
+            :playbackRate="playbackRate"
+            :isAllowSeek="isAllowSeek"
+            :autoplay="autoplay"
+            :startTime="startTime"
+            @statechange="onStateChange"
+          ></polyv-player>
+        </view>
+        <view style="padding: 20rpx">
+          <view style="display: flex">
+            <view class="yearTag" v-if="detail.year">{{ detail.year }}</view>
+            <view class="titleTag">{{ detail.goodsName }}</view>
+          </view>
+          <view
+            style="
+              display: flex;
+              justify-content: space-between;
+              margin-top: 13rpx;
+            "
+          >
+            <view class="noteTag"
+              ><image src="/static/icon/wk_icon1.png" class="wk_icon"></image>
+              共
+              <text class="blackFont"
+                >{{ courseList.length }} 课程 {{ detail.classHours }}</text
+              >
+              学时</view
+            >
+          </view>
+        </view>
+      </view>
+      <u-line color="#D6D6DB" />
+      <view style="height: 80rpx">
+        <view
+          ><u-tabs
+            :list="list"
+            :item-width="itemWidth()"
+            font-size="30"
+            bar-width="24"
+            :current="current"
+            @change="change"
+            active-color="#007AFF"
+          ></u-tabs
+        ></view>
+      </view>
+    </view>
+    <view
+      style="padding: 20rpx; padding-bottom: 100rpx; position: relative"
+      v-show="current == 0"
+    >
+      <view class="content">
+        <view
+          v-html="detail.mobileDetailHtml"
+          style="width: 100%; overflow: hidden"
+        ></view>
+      </view>
+    </view>
+    <view
+      style="padding: 20rpx; padding-bottom: 100rpx; position: relative"
+      v-show="current == 1"
+    >
+      <view>
+        <view v-for="(item, index) in courseList" :key="index">
+          <view class="courseItemBox">
+            <view class="courseItem" @click="openCourse(item)">
+              <view class="courseName">{{ item.courseName }}</view>
+              <view>
+                <image
+                  src="/static/icon/up.png"
+                  class="icon_up"
+                  v-if="item.down"
+                ></image>
+                <image
+                  src="/static/icon/down.png"
+                  class="icon_up"
+                  v-if="!item.down"
+                ></image>
+              </view>
+            </view>
+            <view v-show="!item.down">
+              <view v-for="(itemM, indexM) in item.menuList" :key="indexM">
+                <courseModule
+                  :courseId="itemM.courseId"
+                  :needOpen="
+                    isFirstEnter &&
+                    menuIndex[0] === index &&
+                    menuIndex[1] === indexM
+                      ? true
+                      : false
+                  "
+                  v-if="itemM.type == 1"
+                  :menuItem="itemM"
+                ></courseModule>
+                <courseChapter
+                  :courseId="itemM.courseId"
+                  :needOpen="
+                    isFirstEnter &&
+                    menuIndex[0] === index &&
+                    menuIndex[1] === indexM
+                      ? true
+                      : false
+                  "
+                  v-if="itemM.type == 2"
+                  :isBuy="false"
+                  :menuItem="itemM"
+                ></courseChapter>
+                <courseSection
+                  :courseId="itemM.courseId"
+                  v-if="itemM.type == 3"
+                  :isBuy="false"
+                  :menuItem="itemM"
+                ></courseSection>
+                <u-line></u-line>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view
+      style="padding: 20rpx; padding-bottom: 100rpx; position: relative"
+      v-show="current == 2"
+    >
+      <view>
+        <view v-for="(item, index) in freeMenuList" :key="index">
+          <view class="courseItemBox">
+            <view class="courseItem">
+              <view class="courseName">{{ item.freeExamName }}</view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="bottomBox" v-if="!hideBuyState">
+      <view>
+        <text class="priceTag">¥ {{ toFixed(detail.standPrice) }}</text>
+        <!-- <view class="priceTag">¥ {{toFixed(detail.linePrice)}}</view> -->
+        <text v-if="detail.linePrice" class="sale"> ¥ </text>
+        <text v-if="detail.linePrice" class="price_line"
+          >&nbsp;{{ detail.linePrice }}</text
+        >
+      </view>
+      <view style="display: flex; color: #ffffff; align-items: center">
+        <view class="btn1" @click="addCart">加购物车</view>
+        <view class="btn2" @click="buy">立即购买 </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-import courseModule from '@/components/course/courseModule.vue';
-import courseChapter from '@/components/course/courseChapter.vue';
-import courseSection from '@/components/course/courseSection.vue';
-import { mapGetters,mapMutations  } from 'vuex';
+import courseModule from "@/components/course/courseModule.vue";
+import courseChapter from "@/components/course/courseChapter.vue";
+import courseSection from "@/components/course/courseSection.vue";
+import { mapGetters, mapMutations } from "vuex";
 export default {
-	components: {
-		courseModule,
-		courseChapter,
-		courseSection
-	},
-	data() {
-		return {
-			id:0,
-			list: [],
-			menuIndex:[],
-			current:0,
-			detail:{},
-			courseList:[],
-			menuList:[],
-			freeMenuList:[],
-			startStatus:false,
-			playbackRate: [1.0],
-			isAllowSeek:'no',
-			vid:'',
-			autoplay:true,
-			listenConfigList:[],
-			listenSecond:0,
-			isFirstEnter:true, //是否首次进入
-			timer:null,
-			businessData:{},
-			startTime:0
-		};
-	},
-	computed: { ...mapGetters(['userInfo','goodsAuditionConfigIdList','playSectionId','hideBuyState']) },
-	onLoad(option) {
-		this.id = option.id;
-		this.getDetail()
-		this.goodsCourseList()
-		this.appCommonGoodsCourseModuleFreeExamList();
-	},
-	onUnload(option) {
-		this.$store.commit('setPlaySectionId', {playSectionId  :0});
-		//移除所有的事件监听器
-		uni.$off();
-	},
-	mounted() {
-		let self = this
-		uni.$on('getSection', item => {
-			//播放试听
-			self.listenSecond = 0
-			for (var itemChild of self.listenConfigList) {
-				if(self.playSectionId == (itemChild.sectionId || itemChild.menuId) && item.courseId == itemChild.courseId){
-					if(itemChild.auditionMinute>0){
-				//		self.listenSecond = itemChild.auditionMinute *60 //试听秒数
-						self.listenSecond = itemChild.auditionMinute //试听秒数 auditionMinute调整为秒单位
-					}
-				}
-			}
-			if(self.listenSecond>0){
-				if(self.timer){
-					clearInterval(self.timer);
-				}
-				 if(self.vid){
-					 //切换视频
-					 var polyvPlayerContext = self.selectComponent('#playerVideo');
-					 polyvPlayerContext.changeVid(item.recordingUrl)
-				 }else{
-					 self.vid = item.recordingUrl
-				 }
-				
-				self.startStatus = true
-				self.startTime = 0
-			}else{
-				
-				self.$u.toast('试听配置错误');
-			}
-			
-		})
-		this.updateChapterOpen(true)
-	},
-	methods: {
-		 ...mapMutations(['updateChapterOpen']),
-		 itemWidth() {
-			 return (100/this.list.length)+'%'
-		 },
-		appCommonGoodsCourseModuleFreeExamList() {
-		 this.$api.appCommonGoodsCourseModuleFreeExamList(this.id).then(res => {
-			 if(res.data.data.length) {
-				this.freeMenuList = res.data.data;
-				 this.list =  [
-						{
-							name: '详情'
-						},
-						{
-							name: '大纲'
-						},
-						{
-							name: '赠送'
-						}
-					]
-				 } else {
-					 this.list =  [
-							{
-								name: '详情'
-							},
-							{
-								name: '大纲'
-							}
-						]
-				 }
-				 
-				 console.log(this.list)
-		 })
-		},
-		courseBusiness(){
-			this.$api.courseBusiness(this.detail.businessId).then(res => {
-				this.businessData = res.data.data;
-			})
-		},
-		toFixed(number) {
-			if(number > 0) {
-				return number.toFixed(2)
-			} else {
-				return '0.00'
-			}
-		},
-		onStateChange(newstate, oldstate) {
-			if (newstate.detail.newstate == 'playing') {
-				//开始播放
-				if(this.timer){
-					clearInterval(this.timer);
-				}
-				this.timer = setInterval(this.timeEvent, 1500);//定时器
-			}
-			
-		},
-		closePlay(){
-			this.$store.commit('setPlaySectionId', {playSectionId  :0});
-			this.vid = ""
-			this.startStatus = false
-		},
-		timeEvent() {
-			let self = this
-		        var polyvPlayerContext = this.selectComponent('#playerVideo');
-				if (polyvPlayerContext != null) {
-					let PlayCurrentTime = polyvPlayerContext.getCurrentTime();
-					if(PlayCurrentTime>=this.listenSecond){
-						polyvPlayerContext.stop();
-						polyvPlayerContext.exitFullScreen();
-						clearInterval(this.timer);
-						this.timer = null
-						uni.showModal({
-							title: '提示',
-							content: '试听结束，购买课程可学习全部',
-							showCancel:false,
-							success: function(resst) {
-								self.closePlay()
-							}
-						});
-					}
-				}
-		},
-		openCourse(item){
-			item.down = !item.down
-			if(!item.down&&item.menuList.length==0){
-				this.getMenuList(item)
-			}
-			
-		},
-		addShopCart() {
-			let self = this
-			this.$api.addCart({goodsId:this.id}).then(res => {
-				if(res.data.code==200){
-					uni.setStorageSync('updateCart',1) //提醒刷新购物车
-					uni.showToast({
-					    title: '添加成功'
-					});
-				}else{
-					this.$u.toast(res.data.msg);
-				}
-			});
-		},
-		goodsCourseList() {
-			let self = this
-			this.$api.goodsCourseList(this.id).then(res => {
-				if(res.data.code==200){
-					for(let i=0;i<res.data.rows.length;i++){
-						let item = res.data.rows[i]
-						item.down = true
-						item.menuList = []
-					}
-					self.courseList = res.data.rows;
-					this.getFirstCourse();
-				}
-			});
-		},
-		/**
-		 * 获取第一个有模块或者章的课程
-		 */
-		async getFirstCourse() {
-			for(let i = 0; i < this.courseList.length; i++) {
-				
-				let menuIndexOrFalse = await this.getCourseMenus(this.courseList[i]);
-				
-				if(menuIndexOrFalse !== false) {
-					this.menuIndex = [i,menuIndexOrFalse]
-					this.openCourse(this.courseList[i])
-					break
-				}
-			}
-		},
-		getCourseMenus(item) {
-			return new Promise(resolve => {
-				this.$api.menuList({courseId:item.courseId}).then(res => {
-					if(res.data.code==200){
-						for(let i=0;i<res.data.rows.length;i++){
-							if(res.data.rows[i].type == 1 || res.data.rows[i].type == 2) {
-								resolve(i)
-								break;
-							}
-						}
-					}
-				});
-			})
-			
-		},
-		getMenuList(item) {
-			let self = this
-			this.$api.menuList({courseId:item.courseId}).then(res => {
-				if(res.data.code==200){
-					for(let i=0;i<res.data.rows.length;i++){
-						let item = res.data.rows[i]
-						item.down = true
-						item.id = item.menuId
-						item.name = item.menuName
-						
-						if(item.type==3){
-							//判断是否试听
-							item.tryListen = false
-							if(self.goodsAuditionConfigIdList.indexOf(item.id)!==-1){
-								item.tryListen = true
-							}	
-						}
-					}
-					item.menuList = res.data.rows
-				}
-			});
-		},
-		getDetail() {
-			let self = this
-			let sectionIdList = []
-			this.$api.commonGoodsDetail(this.id).then(res => {
-				if(res.data.code==200){
-					if(res.data.data.mobileDetailHtml){
-						res.data.data.mobileDetailHtml = res.data.data.mobileDetailHtml.replace(/<img/gi,'<img style="max-width:100%;"')
-					}
-					
-					
-					self.detail = res.data.data
-					this.courseBusiness();
-					if(self.detail.goodsAuditionConfig){
-						self.listenConfigList = JSON.parse(self.detail.goodsAuditionConfig)
-						for (var itemChild of self.listenConfigList) {
-							sectionIdList.push(itemChild.sectionId)//存储试听节ID
-						}
-						self.$store.commit('setGoodsAuditionConfigIdList', {goodsAuditionConfigIdList:sectionIdList});
-					}
-				}
-			});
-		},
-		buy(){
-			if(this.$method.isGoLogin()){
-				return
-			}
-			this.$navTo.togo('/pages2/order/confirm_list?id='+this.id);
-		},
-		addCart(){
-			if(this.$method.isGoLogin()){
-				return
-			}
-			this.addShopCart()
-		},
-		open(item){
-			item.showChildren = !item.showChildren
-		},
-		change(index){
-			this.current = index;
-		}
-	}
+  components: {
+    courseModule,
+    courseChapter,
+    courseSection,
+  },
+  data() {
+    return {
+      id: 0,
+      list: [],
+      menuIndex: [],
+      current: 0,
+      detail: {},
+      courseList: [],
+      menuList: [],
+      freeMenuList: [],
+      startStatus: false,
+      playbackRate: [1.0],
+      isAllowSeek: "no",
+      vid: "",
+      autoplay: true,
+      listenConfigList: [],
+      listenSecond: 0,
+      isFirstEnter: true, //是否首次进入
+      timer: null,
+      businessData: {},
+      startTime: 0,
+    };
+  },
+  computed: {
+    ...mapGetters([
+      "userInfo",
+      "goodsAuditionConfigIdList",
+      "playSectionId",
+      "hideBuyState",
+    ]),
+  },
+  onLoad(option) {
+    this.id = option.id;
+    this.getDetail();
+    this.goodsCourseList();
+    this.appCommonGoodsCourseModuleFreeExamList();
+  },
+  onUnload(option) {
+    this.$store.commit("setPlaySectionId", { playSectionId: 0 });
+    //移除所有的事件监听器
+    uni.$off();
+  },
+  mounted() {
+    let self = this;
+    uni.$on("getSection", (item) => {
+      //播放试听
+      self.listenSecond = 0;
+      for (var itemChild of self.listenConfigList) {
+        if (
+          self.playSectionId == (itemChild.sectionId || itemChild.menuId) &&
+          item.courseId == itemChild.courseId
+        ) {
+          if (itemChild.auditionMinute > 0) {
+            //		self.listenSecond = itemChild.auditionMinute *60 //试听秒数
+            self.listenSecond = itemChild.auditionMinute; //试听秒数 auditionMinute调整为秒单位
+          }
+        }
+      }
+      if (self.listenSecond > 0) {
+        if (self.timer) {
+          clearInterval(self.timer);
+        }
+        if (self.vid) {
+          //切换视频
+          var polyvPlayerContext = self.selectComponent("#playerVideo");
+          polyvPlayerContext.changeVid(item.recordingUrl);
+        } else {
+          self.vid = item.recordingUrl;
+        }
+
+        self.startStatus = true;
+        self.startTime = 0;
+      } else {
+        self.$u.toast("试听配置错误");
+      }
+    });
+    this.updateChapterOpen(true);
+  },
+  methods: {
+    ...mapMutations(["updateChapterOpen"]),
+    itemWidth() {
+      return 100 / this.list.length + "%";
+    },
+    appCommonGoodsCourseModuleFreeExamList() {
+      this.$api.appCommonGoodsCourseModuleFreeExamList(this.id).then((res) => {
+        if (res.data.data.length) {
+          this.freeMenuList = res.data.data;
+          this.list = [
+            {
+              name: "详情",
+            },
+            {
+              name: "大纲",
+            },
+            {
+              name: "赠送",
+            },
+          ];
+        } else {
+          this.list = [
+            {
+              name: "详情",
+            },
+            {
+              name: "大纲",
+            },
+          ];
+        }
+
+        console.log(this.list);
+      });
+    },
+    courseBusiness() {
+      this.$api.courseBusiness(this.detail.businessId).then((res) => {
+        this.businessData = res.data.data;
+      });
+    },
+    toFixed(number) {
+      if (number > 0) {
+        return number.toFixed(2);
+      } else {
+        return "0.00";
+      }
+    },
+    onStateChange(newstate, oldstate) {
+      if (newstate.detail.newstate == "playing") {
+        //开始播放
+        if (this.timer) {
+          clearInterval(this.timer);
+        }
+        this.timer = setInterval(this.timeEvent, 1500); //定时器
+      }
+    },
+    closePlay() {
+      this.$store.commit("setPlaySectionId", { playSectionId: 0 });
+      this.vid = "";
+      this.startStatus = false;
+    },
+    timeEvent() {
+      let self = this;
+      var polyvPlayerContext = this.selectComponent("#playerVideo");
+      if (polyvPlayerContext != null) {
+        let PlayCurrentTime = polyvPlayerContext.getCurrentTime();
+        if (PlayCurrentTime >= this.listenSecond) {
+          polyvPlayerContext.stop();
+          polyvPlayerContext.exitFullScreen();
+          clearInterval(this.timer);
+          this.timer = null;
+          uni.showModal({
+            title: "提示",
+            content: "试听结束，购买课程可学习全部",
+            showCancel: false,
+            success: function (resst) {
+              self.closePlay();
+            },
+          });
+        }
+      }
+    },
+    openCourse(item) {
+      item.down = !item.down;
+      if (!item.down && item.menuList.length == 0) {
+        this.getMenuList(item);
+      }
+    },
+    addShopCart() {
+      let self = this;
+      this.$api.addCart({ goodsId: this.id, choiceStatus: 1 }).then((res) => {
+        if (res.data.code == 200) {
+          uni.setStorageSync("updateCart", 1); //提醒刷新购物车
+          uni.showToast({
+            title: "添加成功",
+          });
+        } else {
+          this.$u.toast(res.data.msg);
+        }
+      });
+    },
+    goodsCourseList() {
+      let self = this;
+      this.$api.goodsCourseList(this.id).then((res) => {
+        if (res.data.code == 200) {
+          for (let i = 0; i < res.data.rows.length; i++) {
+            let item = res.data.rows[i];
+            item.down = true;
+            item.menuList = [];
+          }
+          self.courseList = res.data.rows;
+          this.getFirstCourse();
+        }
+      });
+    },
+    /**
+     * 获取第一个有模块或者章的课程
+     */
+    async getFirstCourse() {
+      for (let i = 0; i < this.courseList.length; i++) {
+        let menuIndexOrFalse = await this.getCourseMenus(this.courseList[i]);
+
+        if (menuIndexOrFalse !== false) {
+          this.menuIndex = [i, menuIndexOrFalse];
+          this.openCourse(this.courseList[i]);
+          break;
+        }
+      }
+    },
+    getCourseMenus(item) {
+      return new Promise((resolve) => {
+        this.$api.menuList({ courseId: item.courseId }).then((res) => {
+          if (res.data.code == 200) {
+            for (let i = 0; i < res.data.rows.length; i++) {
+              if (res.data.rows[i].type == 1 || res.data.rows[i].type == 2) {
+                resolve(i);
+                break;
+              }
+            }
+          }
+        });
+      });
+    },
+    getMenuList(item) {
+      let self = this;
+      this.$api.menuList({ courseId: item.courseId }).then((res) => {
+        if (res.data.code == 200) {
+          for (let i = 0; i < res.data.rows.length; i++) {
+            let item = res.data.rows[i];
+            item.down = true;
+            item.id = item.menuId;
+            item.name = item.menuName;
+
+            if (item.type == 3) {
+              //判断是否试听
+              item.tryListen = false;
+              if (self.goodsAuditionConfigIdList.indexOf(item.id) !== -1) {
+                item.tryListen = true;
+              }
+            }
+          }
+          item.menuList = res.data.rows;
+        }
+      });
+    },
+    getDetail() {
+      let self = this;
+      let sectionIdList = [];
+      this.$api.commonGoodsDetail(this.id).then((res) => {
+        if (res.data.code == 200) {
+          if (res.data.data.mobileDetailHtml) {
+            res.data.data.mobileDetailHtml =
+              res.data.data.mobileDetailHtml.replace(
+                /<img/gi,
+                '<img style="max-width:100%;"'
+              );
+          }
+
+          self.detail = res.data.data;
+          this.courseBusiness();
+          if (self.detail.goodsAuditionConfig) {
+            self.listenConfigList = JSON.parse(self.detail.goodsAuditionConfig);
+            for (var itemChild of self.listenConfigList) {
+              sectionIdList.push(itemChild.sectionId); //存储试听节ID
+            }
+            self.$store.commit("setGoodsAuditionConfigIdList", {
+              goodsAuditionConfigIdList: sectionIdList,
+            });
+          }
+        }
+      });
+    },
+    buy() {
+      if (this.$method.isGoLogin()) {
+        return;
+      }
+      this.$navTo.togo("/pages2/order/confirm_list?id=" + this.id);
+    },
+    addCart() {
+      if (this.$method.isGoLogin()) {
+        return;
+      }
+      this.addShopCart();
+    },
+    open(item) {
+      item.showChildren = !item.showChildren;
+    },
+    change(index) {
+      this.current = index;
+    },
+  },
 };
 </script>
-<style >
-	page{
-		background-color: #EAEEF1;
-	}
+<style>
+page {
+  background-color: #eaeef1;
+}
 </style>
 <style scope>
-	.video_t2 {
-		font-size: 24rpx;
-		font-family: PingFang SC;
-		font-weight: 500;
-		color: #666666;
-	}
-	.video_t1 {
-		height: 80rpx;
-		color: #333333;
-		line-height: 80rpx;
-		font-size: 30rpx;
-		font-family: PingFang SC;
-		font-weight: bold;
-		color: #333333;
-		overflow: hidden;
-		text-overflow:ellipsis;
-		white-space: nowrap;
-	}
-	.video_t1_t {
-		display: flex;
-		flex-direction: column;
-		height: 80rpx;
-		color: #333333;
-		text-align: center;
-		align-items: center;
-		border-left: solid 1px #d6d6db;
-	}
-	.video_play {
-		position: absolute;
-		width: 95rpx;
-		height: 95rpx;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		margin: auto;
-	}
-	.video_box {
-		position: relative;
-	}
-	.courseName{
-		white-space:nowrap;
-		overflow:hidden;
-		text-overflow:ellipsis; 
-	}
-	.videoBox{
-		background-color: #FFFFFF;
-		width: 100%;
-		/* height: 680rpx; */
-		z-index: 999;
-	}
-	.icon_up{
-		width: 32rpx;
-		height: 32rpx;
-	}
-	.contentBox{
-		
-	}
-	.courseItemBox{
-		background: #FFFFFF;
-		border-radius: 16rpx;
-		padding: 0 10rpx;
-		margin-bottom: 20rpx;
-	}
-	.courseItem{
-		height: 80rpx;
-		color: #333333;
-		font-size: 32rpx;
-		line-height: 80rpx;
-		font-weight: bold;
-		display: flex;
-		justify-content: space-between;
-
-	}
-	.content{
-		background-color: #FFFFFF;
-		width: 100%;
-	}
-	.btn2{
-		width: 200rpx;
-		height: 64rpx;
-		background: linear-gradient(0deg, #FFB102, #FD644F);
-		box-shadow: 0rpx 10rpx 16rpx 4rpx rgba(1, 99, 235, 0.04);
-		border-radius: 32rpx;
-		line-height: 64rpx;
-		text-align: center;
-	}
-	.btn1{
-		width: 200rpx;
-		height: 64rpx;
-		background: linear-gradient(0deg, #015EEA, #00C0FA);
-		border-radius: 32rpx;
-		line-height: 64rpx;
-		text-align: center;
-		margin-right: 20rpx;
-	}
-	.bottomBox{
-		position: fixed;
-		bottom: 0;
-		width: 100%;
-		left: 0;
-		height:98rpx ;
-		background-color: #FFFFFF;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 0 30rpx;
-	}
-	.blackFont{
-		color: #333333;
-		margin: 0 4rpx;
-	}
-	.wk_icon{
-		width: 24rpx;
-		height: 24rpx;
-		margin-right: 12rpx;
-	}
-	.noteTag{
-		font-size: 24rpx;
-		font-family: PingFang SC;
-		font-weight: 500;
-		color: #999999;
-		align-items: center;
-	}
-	.priceTag{
-		font-size: 30rpx;
-		font-family: PingFang SC;
-		font-weight: bold;
-		color: #FF2D55;
-	}
-	.sale {
-		color: #999999;
-		font-size: 28rpx;
-		margin-left: 8rpx;
-	}
-	.price_line {
-		color: #999999;
-		font-size: 28rpx;
-		text-decoration:line-through;
-		font-weight: 400;
-	}
-	.titleTag{
-		font-size: 32rpx;
-		font-weight: bold;
-		color: #333333;
-		margin-left: 8rpx;
-	}
-	.yearTag{
-		width: 80rpx;
-		height: 32rpx;
-		background: #EBF5FF;
-		border: 2rpx solid #007AFF;
-		border-radius: 16rpx;
-		font-size: 24rpx;
-		color: #007AFF;
-		text-align: center;
-		line-height: 32rpx;
-	}
-	.itemBox{
-		background: #FFFFFF;
-		box-shadow: 0rpx 10rpx 9rpx 1rpx rgba(165, 196, 239, 0.1);
-		border-radius: 24rpx;
-		width: 100%;
-		padding: 20rpx;
-		margin-bottom: 20rpx;
-	}
+.video_t2 {
+  font-size: 24rpx;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: #666666;
+}
+.video_t1 {
+  height: 80rpx;
+  color: #333333;
+  line-height: 80rpx;
+  font-size: 30rpx;
+  font-family: PingFang SC;
+  font-weight: bold;
+  color: #333333;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.video_t1_t {
+  display: flex;
+  flex-direction: column;
+  height: 80rpx;
+  color: #333333;
+  text-align: center;
+  align-items: center;
+  border-left: solid 1px #d6d6db;
+}
+.video_play {
+  position: absolute;
+  width: 95rpx;
+  height: 95rpx;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+}
+.video_box {
+  position: relative;
+}
+.courseName {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.videoBox {
+  background-color: #ffffff;
+  width: 100%;
+  /* height: 680rpx; */
+  z-index: 999;
+}
+.icon_up {
+  width: 32rpx;
+  height: 32rpx;
+}
+.contentBox {
+}
+.courseItemBox {
+  background: #ffffff;
+  border-radius: 16rpx;
+  padding: 0 10rpx;
+  margin-bottom: 20rpx;
+}
+.courseItem {
+  height: 80rpx;
+  color: #333333;
+  font-size: 32rpx;
+  line-height: 80rpx;
+  font-weight: bold;
+  display: flex;
+  justify-content: space-between;
+}
+.content {
+  background-color: #ffffff;
+  width: 100%;
+}
+.btn2 {
+  width: 200rpx;
+  height: 64rpx;
+  background: linear-gradient(0deg, #ffb102, #fd644f);
+  box-shadow: 0rpx 10rpx 16rpx 4rpx rgba(1, 99, 235, 0.04);
+  border-radius: 32rpx;
+  line-height: 64rpx;
+  text-align: center;
+}
+.btn1 {
+  width: 200rpx;
+  height: 64rpx;
+  background: linear-gradient(0deg, #015eea, #00c0fa);
+  border-radius: 32rpx;
+  line-height: 64rpx;
+  text-align: center;
+  margin-right: 20rpx;
+}
+.bottomBox {
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  left: 0;
+  height: 98rpx;
+  background-color: #ffffff;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0 30rpx;
+}
+.blackFont {
+  color: #333333;
+  margin: 0 4rpx;
+}
+.wk_icon {
+  width: 24rpx;
+  height: 24rpx;
+  margin-right: 12rpx;
+}
+.noteTag {
+  font-size: 24rpx;
+  font-family: PingFang SC;
+  font-weight: 500;
+  color: #999999;
+  align-items: center;
+}
+.priceTag {
+  font-size: 30rpx;
+  font-family: PingFang SC;
+  font-weight: bold;
+  color: #ff2d55;
+}
+.sale {
+  color: #999999;
+  font-size: 28rpx;
+  margin-left: 8rpx;
+}
+.price_line {
+  color: #999999;
+  font-size: 28rpx;
+  text-decoration: line-through;
+  font-weight: 400;
+}
+.titleTag {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333333;
+  margin-left: 8rpx;
+}
+.yearTag {
+  width: 80rpx;
+  height: 32rpx;
+  background: #ebf5ff;
+  border: 2rpx solid #007aff;
+  border-radius: 16rpx;
+  font-size: 24rpx;
+  color: #007aff;
+  text-align: center;
+  line-height: 32rpx;
+}
+.itemBox {
+  background: #ffffff;
+  box-shadow: 0rpx 10rpx 9rpx 1rpx rgba(165, 196, 239, 0.1);
+  border-radius: 24rpx;
+  width: 100%;
+  padding: 20rpx;
+  margin-bottom: 20rpx;
+}
 </style>