currentVideo

pages/curriculum/order/curriculum/detail.vue

@@ -368,6 +368,7 @@ export default {
       });
     },
     changeVideo(data) {
+    console.log('data at line 370:', data)
       this.currentVideo = data;
       this.initVideo();
       this.isOpenMp3 = false;

pages/curriculum/order/curriculum/index.vue

@@ -7,53 +7,40 @@
     <public-module></public-module>
     <z-nav-bar
       :title="options.navTitle"
-      bgColor="#3AB3AE"
+      bgColor="#5F8F7F"
       fontColor="#fff"
     ></z-nav-bar>
 
     <view class="contentBox commonPageContentBox">
       <u-alert
-        style="position: fixed; width: 100%; z-index: 10"
+        v-if="goBuyTitle"
+        style="
+          background: linear-gradient(90deg, #5f8f7f 0%, #f3faf3 100%);
+          position: fixed;
+          left: 0;
+          width: 100%;
+          z-index: 10;
+        "
         type="warning"
-        @click="handleClickGetGoodsList"
+        @click="handleClickGetVip"
         :title="goBuyTitle"
         :show-icon="true"
-        v-if="
-          cateList.length > 0 &&
-          cateList[currentCateIndex].isBuy == 0 &&
-          vip.type == '0'
-        "
       >
         <template slot="rightSlot" slot-scope="slotProps">
-          <!-- {{ slotProps.row.bxType }} -->
-
-          <text
-            :class="`fdButtonBox ${
-              cateList[currentCateIndex].type == 0
-                ? ''
-                : 'aui-text-danger fdButtonBoxRed'
-            } `"
-          >
-            {{
-              cateList[currentCateIndex].type == 0 ? "开始学习" : "立即购买"
-            }}</text
-          >
+          <text class="saveBtn vipBtn flexbox buyBtn" v-if="goBuyType == 0">
+            立即购买
+          </text>
+          <text class="flexbox" style="color: #5f8f7f" v-if="goBuyType == 1">
+            立即续费
+          </text>
+          <text class="saveBtn vipBtn flexbox" v-if="goBuyType == 2">
+            立即升级
+          </text>
 
           <view> </view>
         </template>
       </u-alert>
 
-      <u-alert
-        style="position: fixed; width: 100%; z-index: 10"
-        type="warning"
-        @click="handleClickGetGoodsList"
-        :title="`尊贵的${vip.type==1?'超级':vip.type==2?'吴门医述':'众妙之门'}VIP会员,您的有效期到 ${
-          vip.endTime && vip.endTime.split(' ')[0]
-        }`"
-        :show-icon="true"
-        v-if="cateList.length > 0 && vip.type != 0"
-      >
-      </u-alert>
       <view
         v-if="curriculumData.image"
         :style="`height: auto !important;${
@@ -87,122 +74,142 @@
       >
       </view>
 
-      <view class="curriulum_box" v-if="curriculumData.content">
-        <view class="curriulum_title_box">
-          <view class="curriulum_title">
-            <view style="font-weight: 600; color: #018f89; margin-bottom: 20rpx"
-              >介绍</view
-            >
+      <view class="containerBg1">
+        <view class="course_info_box">
+          <view class="course_info">
+            <view class="flexbox course_title" v-if="curriculumData.id">
+              <text class="courseTitle title">{{ curriculumData.title }}</text>
 
-            <common-rich-detail
-              v-if="curriculumData.content"
-              :detailInfo="{
-                content: curriculumData.content ? curriculumData.content : '',
-              }"
-              style="padding: 10rpx"
+              <!-- <view class="start_learn_btn PM_font">进入学习</view> -->
+            </view>
+            <view
+              class="containerBg"
+              v-if="curriculumData.content && curriculumData.content != ''"
             >
-              <template #richHeadImg>
-                <!-- <image :src="curriculumData.imgUrl" mode="widthFix" class="headImage"></image> -->
-
-                <!-- <image :src="detailInfo.imgUrl" v-if="detailInfo.imgUrl" mode="widthFix" class="headImage"></image> -->
-              </template>
-            </common-rich-detail>
+              <view class="prof">
+                <view
+                  style=" padding: 0 20rpx;"
+                  @click="isHideCourseInfo = !isHideCourseInfo"
+                >
+                  <view
+                    :class="`${isHideCourseInfo ? 'hidden2' : ''}`"
+                    style="width: calc(100% - 50rpx)"
+                    v-html="curriculumData.content"
+                  >
+                  </view>
+                </view>
+              </view>
+            </view>
           </view>
-          <!-- <view class="buy">购买</view> -->
         </view>
       </view>
 
-      <template v-if="cateList.length > 1">
-        <common-sticky
-          label="title"
-          :itemStyle="`width:${
-            cateList.length == 2 ? '50' : '33'
-          }%;padding-left: 15px; padding-right: 15px; height: 68rpx;`"
-          :list="cateList"
-          :currentCateIndex="currentCateIndex"
-          @handleselectCate="handleselectCate"
-        >
-          <template slot="labelSlot" slot-scope="slotProps">
-            <!-- {{ slotProps.data }} -->
-            <!-- @click.native.stop="handleClickEdit(slotProps.row)" -->
-            <uni-icons
-              class="editIcon"
-              type="locked-filled"
-              color="#b0b0b0"
-              size="24"
-              v-if="slotProps.data.isBuy == 0 && vip.type == '0'"
-              style="display: inline-block; margin-left: 10rpx"
-            ></uni-icons>
-          </template>
-        </common-sticky>
-      </template>
+      <view class="containerBg2">
+        <view class="shiting_content">
+          <view v-for="(v, i) in cateList" style="margin-bottom: 40rpx">
+            <view class="catalogueTitle chapter_title">
+              <view class="top">
+                <view class="line"></view>
+                <view class="left">
+                  <text style="font-weight: blod" class="catalogue_title">{{
+                    v.title
+                  }}</text>
+                  <!-- 普通用户或者国学Vip -->
+                </view>
+                <view
+                  class="not_purchased"
+                  v-if="
+                    (v.isBuy != 1 && (vip.type == 0 || vip.type == 3)) ||
+                    (v.isBuy == 1 &&
+                      (vip.type == 0 || vip.type == 3) &&
+                      v.endTime)
+                  "
+                >
+                  <view class="spot"></view>
+                  <!--  -->
+                  <text v-if="v.isBuy != 1 && (vip.type == 0 || vip.type == 3)"
+                    >未购买
+                  </text>
+                  <!--  -->
+                  <text
+                    v-if="
+                      v.isBuy == 1 &&
+                      (vip.type == 0 || vip.type == 3) &&
+                      v.endTime
+                    "
+                    >有效期至{{ v.endTime }}
+                  </text>
+                </view>
 
-      <!-- <view :class="`priceDetail`" v-if="this.statusList[this.currentStatusIndex].type == 'price'">
+                <view class="right">
+                  <!--  购买 -->
 
-                <scroll-view scroll-y="true" class="scroll-Y">
-                    <price ref="priceDetail" type="price" :oid="this.statusList[this.currentStatusIndex].oid"></price>
+                  <u-icon
+                    v-if="goBuyType != 1&&v.type!=0"
+                    @click="handleClickGetGoodsList(v)"
+                    class="editIcon"
+                    name="shopping-cart-fill"
+                    color="#FF2B57"
+                    size="30"
+                    style="display: inline-block; margin-left: 10rpx"
+                  ></u-icon
+                >
+              
+              <text v-if="goBuyType != 1&&v.type==0&&!v.endTime" style="color: #fff; font-size: 12px;" class="fdButtonBox aui-text-success"  @click="handleClickGetGoodsList(v)">开始学习</text>
+              </view>
+              </view>
 
-                </scroll-view>
-
-
-
-
-            </view>
-            <view :class="`priceDetail`" v-else-if="this.statusList[this.currentStatusIndex].type == 'purchaseNotice'">
-
-                <scroll-view scroll-y="true" class="scroll-Y">
-                    <price ref="purchaseNotice" :oid="this.statusList[this.currentStatusIndex].oid"></price>
-
-                </scroll-view>
-
-
-
-
-            </view>
- -->
-
-      <view :class="`dataList `" style="background-color: #fff">
-        <courseDescription
-          :isCondition="true"
-          :dataList="dataList"
-          @hancleClick="gotoDetail"
-          label="title"
-        >
-          <template slot="labelSlot" slot-scope="slotProps">
-            <view
-              :style="`${
-                slotProps.rowIndex < 3
-                  ? 'width:calc(100% - 100rpx);float:left;'
-                  : 'width:100%;'
-              }`"
-            >
-              <text
-                :class="`${
-                  slotProps.row.viewFlg == 1 ? 'aui-text-success' : ''
-                }`"
-                >{{ slotProps.row.title }}</text
+              <!--    -->
+            </view> 
+            <view class="chapter_content" v-if="courseList[i].length>0">
+             
+  <courseDescription
+                :isCondition="true"
+                :dataList="courseList[i]"
+                @hancleClick="gotoDetail"
+                label="title"
               >
-            </view>
+                <template slot="labelSlot" slot-scope="slotProps">
+                  <view
+                    :style="`${
+                      slotProps.rowIndex < 3
+                        ? 'width:calc(100% - 100rpx);float:left;'
+                        : 'width:100%;'
+                    }`"
+                  >
+                    <text
+                      :class="`${
+                        slotProps.row.viewFlg == 1 ? 'aui-text-success' : ''
+                      }`"
+                      >{{ slotProps.row.title }}</text
+                    >
+                  </view>
 
-            <!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
-          </template>
+                  <!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
+                </template>
 
-          <template slot="leftSlot" slot-scope="slotProps">
-            <!-- {{ slotProps.row.bxType }} -->
-            <!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
-          </template>
-          <template slot="rightSlot" slot-scope="slotProps">
-            <!-- {{ slotProps.row.bxType }} -->
+                <template slot="leftSlot" slot-scope="slotProps">
+                  <!-- {{ slotProps.row.bxType }} -->
+                  <!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
+                </template>
+                <template slot="rightSlot" slot-scope="slotProps">
+                  <!-- {{ slotProps.row.bxType }} -->
 
-            <text
-              class="fdButtonBox aui-text-success"
-              v-if="slotProps.row.isAudition == 1 && vip.type == '0'"
-              >试听</text
-            >
+                  <text
+                    class="fdButtonBox aui-text-success" style="background: none;"
+                    v-if="slotProps.row.isAudition == 1 && vip.type == '0'"
+                    >试听</text
+                  >
 
-            <view> </view>
-          </template>
-        </courseDescription>
+                  <view> </view>
+                </template>
+              </courseDescription>
+
+            
+            </view> 
+            
+          </view
+        ></view>
       </view>
 
       <view class="small_class_teaching_box">
@@ -388,6 +395,8 @@ export default {
   },
   data() {
     return {
+      isHideCourseInfo: true,
+      courseList: [],
       showGoBuy: true,
       protocolShow: false,
       options: {},
@@ -439,6 +448,7 @@ export default {
       taiHuClassInfo: {},
       searchValue: "",
       goBuyTitle: "",
+      goBuyType: "",
       description: "",
       teachingList: [
         {
@@ -521,13 +531,18 @@ export default {
     // this.$refs.uNotify.close()
   },
   methods: {
+    handleClickGetVip() {
+      uni.navigateTo({
+        url: "/pages/mine/vip/index",
+      });
+    },
     getUserInfo() {
       this.$http.post("common/user/getUserInfo").then((res) => {
         console.log("res at line 505:", res);
         if (res.result.userVip) {
-          this.vip = res.result.userVip ;
-        }else{
-          this.vip ={ type: 0 }
+          this.vip = res.result.userVip;
+        } else {
+          this.vip = { type: 0 };
         }
       });
     },
@@ -573,10 +588,11 @@ export default {
       this.selectGoodsData = {};
     },
     //获取相关关联课程商品
-    handleClickGetGoodsList(data) {
+     //获取相关关联课程商品
+     handleClickGetGoodsList(v) {
       // console.log("data at line 313:", data);
 
-      if (this.cateList[this.currentCateIndex].type == 0) {
+      if (v.type == 0) {
         //免费
 
         this.$http
@@ -584,7 +600,7 @@ export default {
             url: this.urlList.startStudyForMF,
             method: "POST",
             data: {
-              catalogueId: this.cateList[this.currentCateIndex].id,
+              catalogueId: v.id,
             },
             header: {
               //默认 无 说明：请求头
@@ -614,7 +630,7 @@ export default {
             url: this.urlList.goodsList,
             method: "POST",
             data: {
-              id: this.cateList[this.currentCateIndex].id,
+              id: v.id,
             },
             header: {
               //默认 无 说明：请求头
@@ -733,6 +749,42 @@ export default {
         url: `/pages/curriculum/order/curriculum/index?navTitle=${v.title}&title=${v.title}&oid=${v.oid}`,
       });
     },
+    async getChapterList(v) {
+      var list = [];
+      var that = this;
+
+      await $http
+        .request({
+          url: this.urlList.curriculumInfo,
+          method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
+          data: {
+            id: v.id,
+          },
+          header: {
+            //默认 无 说明：请求头
+            "Content-Type": "application/json",
+          },
+        })
+        .then(async (res) => {
+          if (res.code == 0 && res.chapterList.length > 0) {
+            // res.chapterList.map((item) => {
+            //   item.tryListen = [];
+            // });
+
+            list = JSON.parse(JSON.stringify(res.chapterList));
+
+            console.log("at line 1343:", list);
+            // console.log('status', res)
+          } else {
+            list = [];
+          }
+          console.log("at line 1333:", list);
+          this.$forceUpdate();
+        });
+
+      console.log("list at line 1375:", list);
+      return list;
+    },
     getCourseDescriptionData() {
       var data = {};
       var that = this;
@@ -752,8 +804,26 @@ export default {
         })
         .then(async (res) => {
           that.curriculumData = res.data.course;
-          that.cateList = res.data.catalogues;
+          that.cateList = [...res.data.catalogues];
           // this..getPercentage();
+
+          for (let i = 0; i < that.cateList.length; i++) {
+            var list = await that.getChapterList(that.cateList[i]);
+
+            console.log("list at line 1224:", list);
+            // list.map(async (item, index) => {
+            //   console.log("item at line 1239:", item);
+            //   item.videoList = [];
+            //   var data = await that.getPath(item);
+            //   item.videoList = [...data];
+            // });
+
+            console.log("list at line 1222:", list);
+            that.courseList[i] = [...list];
+
+            console.log("that.courseList at line 1238:", that.courseList);
+          }
+
           that.relatedCoursesList = res.data.correlatedList
             ? res.data.correlatedList
             : [];
@@ -806,18 +876,33 @@ export default {
       // this.description=`您还未购买当前【${item.title}】课程，`
       var title1 = "";
       this.currentCateIndex = index;
-      if (item.type == 0) {
-        if (this.cateList.length > 1) {
-          this.goBuyTitle = `【${item.title}】课程为免费课程`;
-        } else if (this.cateList.length == 1) {
-          this.goBuyTitle = `为免费课程`;
-        }
-      } else {
-        if (this.cateList.length > 1) {
-          this.goBuyTitle = `您还未购买当前【${item.title}】课程`;
-        } else if (this.cateList.length == 1) {
-          this.goBuyTitle = `您还未购买当前课程`;
-        }
+      switch (this.vip.type) {
+        case 0:
+          this.goBuyTitle = "购买VIP,即可免费观看吴门医述所有课程";
+          this.goBuyType = 0;
+          break;
+        case 1 || 2:
+          var vipName = "";
+          if (this.vip.type == 1) {
+            vipName = "超级VIP";
+          }
+          if (this.vip.type == 2) {
+            vipName = "吴门医述VIP";
+          }
+          //超级VIP
+          this.goBuyTitle = `尊贵的${vipName},您的有效期到 ${
+            this.vip.endTime && this.vip.endTime.split(" ")[0]
+          }`;
+          this.goBuyType = 1;
+          break;
+
+        case 3:
+          //众妙之门
+          this.goBuyTitle =
+            "尊贵的众妙之门VIP,升级至超级VIP,即可免费观看吴门医述所有课程";
+
+          this.goBuyType = 2;
+          break;
       }
 
       //   this.currentCateIndex = index;
@@ -1045,6 +1130,7 @@ export default {
 
 .flexbox {
   display: flex;
+  background-color: transparent !important;
 }
 
 .uni-modal .uni-modal__bd {
@@ -1088,7 +1174,7 @@ export default {
 .fdButtonBox {
   border: 1rpx solid $themeColor;
   background-color: $themeColor;
-  color: #fff;
+  color: $themeColor;
   // width: 100%;
   float: right;
   padding: 4rpx 14rpx;
@@ -1152,8 +1238,8 @@ export default {
 
 .small_class_teaching_box {
   width: 100%;
-  margin-top: 20rpx;
-  background: #b7e0e2;
+  // margin-top: 20rpx;
+  background: #f0fbf3;
 
   .small_class_teaching_top {
     padding: 20rpx 20rpx 0 10rpx;
@@ -1180,7 +1266,7 @@ export default {
   }
 
   .small_class_teaching_content {
-    margin-top: 20rpx;
+    margin-top: 0rpx;
     // background: #EDFCF7;
     padding-bottom: 10rpx;
 
@@ -1411,4 +1497,287 @@ export default {
     }
   }
 }
+
+.saveBtnss {
+  align-items: center;
+  justify-content: center;
+  height: 80rpx;
+
+  // width: 46%;
+  overflow: hidden;
+  border-radius: 50rpx;
+
+  text {
+    padding-left: 10rpx;
+    font-size: 28rpx;
+  }
+}
+.vipBtn {
+  @include theme("vipbtnbg");
+  border-radius: 100rpx;
+  justify-content: center;
+  width: auto;
+  padding: 0 20rpx;
+  color: #fff;
+  margin: 10rpx auto;
+}
+.buyBtn {
+  background: #f42c32 !important;
+  // background:
+}
+
+/deep/.u-alert--warning--light {
+  background-color: none !important;
+}
+/deep/.u-alert__text--warning--light {
+  color: #fff !important;
+}
+/deep/.u-alert {
+  background: none !important;
+}
+/deep/.u-icon__icon--warning {
+  color: #fff !important;
+}
+/deep/.uni-section {
+  background: transparent !important;
+}
+/deep/.uni-section .uni-section-header {
+  padding-top: 10rpx !important;
+  padding-bottom: 10rpx !important;
+}
+/deep/.uni-section .uni-section-header {
+  padding-left: 0rpx !important;
+  //   padding-bottom: 10rpx !important;
+}
+
+.course_info_box {
+  // margin-bottom:10rpx;
+  // padding:20rpx;
+  .course_info {
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    background: rgb(243, 250, 243);
+    // border-radius:20rpx;
+    overflow: hidden;
+  }
+}
+
+.catalogue_title {
+  background: linear-gradient(130deg, #16171b 0%, #44b2b1 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  font-size: 42rpx;
+  font-weight: bold;
+  letter-spacing: 4rpx;
+
+  // border:4rpx solid #1FB2F8;
+  // box-shadow: 0 2px 12px 0 rgba(255,255,255,.1);
+  // border-radius:40rpx;
+  // color:#fff;
+  // width:200rpx;
+  // height:70rpx;
+  // display:inline-block;
+  // padding:10rpx 20rpx;
+}
+.chapter_content {
+  // padding: 20rpx;
+  // padding-top:60rpx;
+  margin-top: 40rpx;
+  border: 4rpx solid #fffffc;
+  // background-image: linear-gradient(52deg, #E8F6FF 0%, #E3F2FE 50%);
+  // background-image: linear-gradient(-180deg, #8BBDFE 0%, #B4DCFF 100%);
+  background: rgba(255, 255, 255, 0.85);
+  // background:rgba(255, 255, 255, 0.85);
+  box-shadow: 0px 0px 4px 0px rgba(46, 114, 123, 0.6) !important;
+  border-top-right-radius: 40rpx;
+  border-bottom-left-radius: 40rpx;
+  .videoList {
+    // padding:0 20rpx;
+    display: flex;
+    align-items: center;
+    // justify-content: space-between;
+    .video_item {
+      width: 24%;
+      font-size: 22rpx;
+      margin: 10rpx 0;
+      background: rgba(255, 255, 255, 0.85);
+      box-shadow: 0 2px 12px 0 rgba(255, 255, 255, 0.1);
+      border-radius: 10rpx;
+      padding: 10rpx 20rpx;
+      margin-right: 1%;
+
+      color: #333;
+      letter-spacing: 2rpx;
+    }
+  }
+}
+
+.line {
+  width: 16rpx;
+  height: 50rpx;
+  border-top-right-radius: 12rpx;
+  border-bottom-right-radius: 12rpx;
+  margin-right: 20rpx;
+  background-image: linear-gradient(108deg, #609080 0%, #7ba98c 100%);
+}
+
+.containerBg2 {
+  padding-top: 40rpx;
+  // margin-top: 100rpx;
+  background: linear-gradient(108deg, #e4f8eb 0%, #d1e8da 100%) !important;
+
+  .shiting {
+    line-height: 100rpx;
+    background: linear-gradient(130deg, #4fa1fd 0%, #12f3ff 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    margin-bottom: 20rpx;
+    // background-image: linear-gradient(108deg, #4FA1FD 100%, #4FA1FD 0%);
+    // border:4rpx solid #1FB2F8;
+    // box-shadow: 0 2px 12px 0 rgba(255,255,255,.1);
+    // border-radius:40rpx;
+    color: #fff;
+    // width:200rpx;
+    // height:70rpx;
+    // display:inline-block;
+    // padding:10rpx 20rpx;
+    font-size: 72rpx;
+    text-align: center;
+  }
+  .shiting_content {
+    padding: 20rpx;
+  }
+}
+.chapter_title {
+  width: 100%;
+  font-size: 28rpx;
+  display: flex;
+  align-items: center;
+  position: relative;
+
+  // justify-content: space-between;
+  .top {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    .left {
+      display: flex;
+      align-items: center;
+    }
+    .right {
+      // float: right;
+      position: absolute;
+      right: 0;
+    }
+  }
+  .not_purchased {
+    position: relative;
+    .spot {
+      width: 8rpx;
+      height: 8rpx;
+      position: absolute;
+      right: -4rpx;
+      border-radius: 8rpx;
+      background-color: #33435d;
+      bottom: -4rpx;
+    }
+    color: #33435d;
+    margin-left: 20rpx;
+    font-size: 24rpx;
+    padding: 0 20rpx;
+    border-bottom: 2rpx dotted #33435d;
+    text {
+      margin: 0 10rpx;
+      letter-spacing: 1rpx;
+    }
+  }
+}
+.course_title {
+  align-items: center;
+  justify-content: space-between;
+  background: #fff;
+}
+.catalogueTitle {
+  justify-content: space-between;
+  overflow: hidden;
+  // background-image: linear-gradient(108deg, #cae9f9 0%, #e1f6fc8c 50%);
+
+  // background-image: linear-gradient(180deg, #cfe0ff 0%, #fff 50%);
+  // padding: 0 20rpx;
+  font-size: 40rpx;
+
+  .learnBtn {
+    margin-bottom: 20rpx;
+    width: 150rpx;
+    text-align: center;
+    border: 1px solid $themeColor;
+    color: $themeColor;
+    line-height: 60rpx;
+    height: 60rpx;
+    font-size: 28rpx;
+    margin-top: 40rpx;
+  }
+
+  .price {
+    color: #ff582e;
+    font-size: 32rpx;
+
+    i {
+      font-style: normal;
+      font-size: 60rpx;
+      font-weight: bold;
+    }
+  }
+
+  .title {
+    display: block;
+    font-size: 30rpx;
+    margin-top: 20rpx;
+    font-weight: bold;
+    margin-bottom: 20rpx;
+  }
+
+  .saveBtn {
+    align-items: center;
+    justify-content: center;
+    height: 80rpx;
+    background-color: #00d8df;
+    // width: 46%;
+    overflow: hidden;
+    border-radius: 30rpx;
+
+    text {
+      padding-left: 10rpx;
+      font-size: 28rpx;
+      color: #fff;
+    }
+  }
+}
+.prof {
+  font-size: 26rpx;
+  line-height: 50rpx;
+  padding: 10rpx 0;
+  color: #333;
+  // background-color: #f0f0f0;
+  // margin-bottom: 10rpx;
+}
+
+.containerBg1 {
+  border-top: 1px solid #fff;
+  margin-top: -4rpx;
+  //   position: relative;
+  z-index: 1;
+
+  border-radius: 30rpx 30rpx 0 0;
+  // background-color: #fff;
+  //   overflow: hidden;
+}
+.courseTitle {
+  width: calc(100% - 220rpx);
+  padding: 20rpx;
+  font-size: 38rpx;
+  font-weight: bold;
+  // background-image: url(@/static/bg1.jpg);
+  background-size: cover;
+  background-repeat: no-repeat;
+}
 </style>

pages/curriculum/order/index/index.vue

@@ -11,7 +11,7 @@
       :backState="3000"
     ></z-nav-bar>
 
-    <template v-if="currentCateIndex == 1">
+    <!-- <template v-if="currentCateIndex == 1">
       <view class="fixed">
         <view v-if="isOpenRightButton">
           <view class="openBox">
@@ -27,27 +27,11 @@
             </block>
           </view>
 
-          <!-- <view
-          @click="close"
-          class="closeBox"
-          style="background-color: #fff; margin-top: 20rpx; width: 100%"
-        >
-          <image
-            src="@/static/icon/close.png"
-            mode="widthFix"
-            style="width: 50rpx; height: 50rpx"
-          ></image
-        ></view> -->
+        
         </view>
-        <!-- <view class="closeBox" v-else @click="isOpenRightButton = true">
-        <image
-          src="@/static/icon/open.png"
-          mode="widthFix"
-          style="width: 50rpx; height: 50rpx"
-        ></image>
-      </view> -->
+       
       </view>
-    </template>
+    </template> -->
 
     <view class="contentBox commonPageContentBox">
       <!-- <scroll-view class="scroll-view_H statusList" scroll-x="true" scroll-left="0"> -->
@@ -79,11 +63,34 @@
             vip.type == 1 ? '超级' : vip.type == 2 ? '吴门医述' : '众妙之门'
           }VIP会员,您的有效期到 ${vip.endTime && vip.endTime.split(' ')[0]}`"
           :show-icon="true"
-          v-if="vip.type != 0"
+          v-if="vip.type != 0 && currentCateIndex != 2"
         >
         </u-alert>
         <template v-if="currentCateIndex == 1">
-          <view
+          <u-index-list :index-list="indexList" activeColor="#60CABF" :uIndexStyle="{
+            height:'auto',
+            padding:'20rpx'
+          }">
+            <view v-for="(item, index) in itemArr">
+              <!-- #ifdef APP-NVUE -->
+              <u-index-anchor :text="indexList[index]" :bgColor="#AFDECC"></u-index-anchor>
+              <!-- #endif -->
+              <u-index-item>
+                <!-- #ifndef APP-NVUE -->
+                <u-index-anchor :text="indexList[index]"></u-index-anchor>
+                <!-- #endif -->
+                <curriculm-list
+                :currentCateIndex="currentCateIndex"
+                @refresh="getCourseDescriptionData()"
+                :dataList="item"
+                :userInfo="userInfo"
+              >
+              </curriculm-list>
+              </u-index-item>
+            </view>
+          </u-index-list>
+
+          <!-- <view
             v-for="(v, index) in allDataList"
             :key="index"
             class="right-item"
@@ -100,18 +107,18 @@
                 >
               </view>
               <curriculm-list
-              :currentCateIndex="currentCateIndex"
+                :currentCateIndex="currentCateIndex"
                 @refresh="getCourseDescriptionData()"
                 :dataList="v.courseList"
                 :userInfo="userInfo"
               >
               </curriculm-list>
             </view>
-          </view>
+          </view> -->
         </template>
         <template v-else>
           <curriculm-list
-          :currentCateIndex="currentCateIndex"
+            :currentCateIndex="currentCateIndex"
             @refresh="getCourseDescriptionData()"
             :dataList="allDataList"
             :userInfo="userInfo"
@@ -161,8 +168,6 @@
     ></u-modal>
 
     <z-navigation></z-navigation>
-
-    
   </view>
 </template>
 
@@ -181,14 +186,16 @@ export default {
   },
   data() {
     return {
+      indexList: [],
+      itemArr: [],
       distanceList: [],
-    
+
       timer: null,
       isLeftClick: false,
       isOpenRightButton: true,
       viewid: "cont0",
       viewidIndex: 0,
-     
+
       openCollapseList: [],
       cateIconList: [
         {
@@ -603,6 +610,9 @@ export default {
       });
     },
     getCourseDescriptionData() {
+    this.allDataList=[]
+    this.indexList=[]
+    this.itemArr=[]
       var data = {};
       if (this.currentCateIndex == 0) {
         // data.userId = this.userInfo.id;
@@ -624,6 +634,13 @@ export default {
         .then(async (res) => {
           console.log(res.courses, "88888");
           that.allDataList = res.courseList;
+          this.indexList = this.allDataList.map((e) => {
+            return e.title;
+          });
+          console.log("this.indexList at line 645:", this.indexList);
+          this.itemArr = this.allDataList.map((e) => {
+            return e.courseList;
+          });
           if (this.currentCateIndex == 1) {
             that.openCollapseList = that.allDataList.map((e) => {
               return e.id;

pages/curriculum/order/index/list.vue

@@ -34,7 +34,7 @@
                     </view>
                   </view> -->
           <view
-            style="font-size: 24rpx"
+            style="font-size: 24rpx;line-height: 40rpx;"
             class="learning_image_right"
             v-if="currentCateIndex != 2"
           >