改价格

src/components/buyCourseModal/index.vue

@@ -6,12 +6,7 @@
       :visible.sync="selectClassModal"
     >
       <div class="select-class__content">
-        <div
-          class="selection"
-          v-if="
-            goodsDetail.templateType == 'class' && goodsDetail.goodsType == 1
-          "
-        >
+        <div class="selection" v-if="goodsDetail.specialGoods">
           <el-select
             class="select"
             v-model="gradeId"
@@ -106,8 +101,8 @@ export default {
   mounted() {},
   methods: {
     showModal(item) {
-      this.gradeId = ''
-      this.gradeList = []
+      this.gradeId = "";
+      this.gradeList = [];
       this.selectClassModal = true;
       this.goodsDetail = item;
     },
@@ -153,10 +148,7 @@ export default {
       }
     },
     pay() {
-      if (
-        this.goodsDetail.templateType == "class" &&
-        this.goodsDetail.goodsType == 1
-      ) {
+      if (this.goodsDetail.specialGoods == 1) {
         if (!this.gradeId && this.gradeId !== 0) {
           this.$message({
             message: "请选择班级",
@@ -190,7 +182,7 @@ export default {
       let selectGoodsList = JSON.parse(JSON.stringify([this.goodsDetail]));
       selectGoodsList.forEach((item) => {
         if (item.goodsType == 1) {
-          if (item.templateType == "class") {
+          if (item.specialGoods == 1) {
             let goodsInputData = {
               type: "class",
               gradeId: this.gradeId,

src/components/courseTree/CourseTree.vue

@@ -602,8 +602,8 @@ export default {
       allSectionList: [],
     };
   },
-  created(){
-    this.init()
+  created() {
+    this.init();
   },
   methods: {
     async init() {
@@ -614,7 +614,8 @@ export default {
         0,
         false
       );
-      if (this.query.sectionType == 1 && this.rebuild == 0) {
+      console.log(sectionItem, "sectionItem");
+      if (this.query.sectionType == 1 && !!this.query.rebuild == this.rebuild) {
         this.toPlay(sectionItem);
       }
       this.getAllSectionList();
@@ -1014,6 +1015,7 @@ export default {
       });
     },
     toPlay(section) {
+      console.log(section, 777);
       this.$emit("getResource", section, this.rebuild);
     },
     //获取商品双师资模板
@@ -1152,7 +1154,7 @@ export default {
         return false;
       }
     },
-  }
+  },
 };
 </script>
 

src/components/goodsItem/IndexSkuDialog.vue

@@ -40,10 +40,12 @@
   }}</el-button>
       </div>
     </el-dialog>
+    <BuyCourseModal ref="selectClassModal"></BuyCourseModal>
   </div>
 </template>
 
 <script>
+import BuyCourseModal from "@/components/buyCourseModal/index";
 export default {
   name: "checkSku",
   props: {
@@ -72,6 +74,7 @@ export default {
   watch: {
     skuModal(newV, oldV) {
       if (newV) {
+        this.selectGoodIndex = 0
         this.checkedAttrs = []
         this.getSpecDetail();
       }
@@ -170,7 +173,11 @@ export default {
           // 加入购物车
           this.$emit("toShopCart", goodsIds);
         } else {
-          this.$emit("togoBuy", goodList);
+          if(this.isSingleChoice){
+            this.$refs.selectClassModal.showModal(goodList[0]);
+          }else{
+            this.goPayment(goodList)
+          }
         }
         this.cancel();
       }).catch((e) => {
@@ -178,6 +185,19 @@ export default {
       })
 
     },
+    goPayment(data) {
+      let selectGoodsList = JSON.parse(JSON.stringify(data));
+      localStorage.setItem(
+        "checkGoodsList",
+        JSON.stringify(selectGoodsList)
+      );
+      this.$router.push({
+        path: "/payment",
+      });
+    },
+  },
+  components: {
+    BuyCourseModal
   },
 };
 </script>

src/components/goodsItem/index.vue

@@ -9,21 +9,33 @@
         >
           {{ item.year }}
         </div> -->
-        <img v-if="item.coverUrl" :src="$tools.splitImgHost(item.coverUrl)" alt="" />
+        <img
+          v-if="item.coverUrl"
+          :src="$tools.splitImgHost(item.coverUrl)"
+          alt=""
+        />
       </div>
       <div class="course-item__title">
         <span v-if="item.goodsType == 6" class="note">直播</span>
         {{ item.goodsName }}
       </div>
       <div class="course-item__desc">
-        <!-- <div class="price">{{ item.standPrice === 0 ? '免费' : `￥${item.standPrice}` }}</div> -->
-        <div class="price" v-if="!item.specTemplateId || (!item.maxPrice && !item.minPrice)">{{ item.standPrice === 0 ?
-            '免费' : `￥${item.standPrice}`
-        }}</div>
-        <div v-else class="price"><span><i>￥</i>{{ item.minPrice }}</span><span
-            v-if="item.minPrice != item.maxPrice">-<i>￥</i>{{ item.maxPrice }}</span>
+        <div
+          class="price"
+          v-if="!item.specTemplateId || (!item.maxPrice && !item.minPrice)"
+        >
+          {{ item.standPrice === 0 ? "免费" : `￥${item.standPrice}` }}
+        </div>
+        <div v-else class="price">
+          <span>{{ item.minPrice }}</span>
+          <template v-if="item.minPrice != item.maxPrice">
+            <i>-</i>
+            <span>{{ item.maxPrice }}</span>
+          </template>
+        </div>
+        <div v-if="item.linePrice" class="linePrice">
+          ￥{{ item.linePrice }}
         </div>
-        <div v-if="item.linePrice" class="linePrice">￥{{ item.linePrice }}</div>
       </div>
       <div class="course-item__btns">
         <a class="add" @click.stop="addCart(item)">加购物车</a>
@@ -32,19 +44,25 @@
     </div>
 
     <BuyCourseModal ref="selectClassModal"></BuyCourseModal>
-    <index-sku-dialog :skuModal.sync="skuModal" :specTemplateId="item.specTemplateId" :isCarOrBuy="isCarOrBuy"
-      @toShopCart='getAddCar($event)' @togoBuy="togoBuy($event)"></index-sku-dialog>
+    <index-sku-dialog
+      :skuModal.sync="skuModal"
+      :specTemplateId="item.specTemplateId"
+      :isCarOrBuy="isCarOrBuy"
+      @toShopCart="getAddCar($event)"
+      @togoBuy="togoBuy($event)"
+    ></index-sku-dialog>
   </div>
 </template>
 
 <script>
 import { mapGetters, mapMutations } from "vuex";
 import BuyCourseModal from "@/components/buyCourseModal/index";
-import IndexSkuDialog from './IndexSkuDialog.vue'
+import IndexSkuDialog from "./IndexSkuDialog.vue";
 export default {
   name: "courseItem",
   components: {
-    BuyCourseModal, IndexSkuDialog
+    BuyCourseModal,
+    IndexSkuDialog,
   },
   computed: {
     ...mapGetters(["userInfo"]),
@@ -57,7 +75,7 @@ export default {
       isCarOrBuy: 1, // 1加入购物车 2立即购买
     };
   },
-  mounted() { },
+  mounted() {},
   methods: {
     ...mapMutations(["setCurrentRouter", "getCartCount"]),
     /**
@@ -95,18 +113,19 @@ export default {
       }
       // 判断有没有规格选择
       if (this.item.specTemplateId) {
-        this.isCarOrBuy = 2
-        this.getSpecDetail()
+        this.isCarOrBuy = 2;
+        this.getSpecDetail();
         // this.skuModal = true
-        return
+        return;
       }
-      this.toPayment(this.item.goodsId)
+      this.toPayment(this.item.goodsId);
     },
     togoBuy(goodList) {
+      console.log();
       if (goodList.length == 1) {
-        return this.toPayment(goodList[0].goodsId)
+        return this.toPayment(goodList[0].goodsId);
       }
-      this.goPayment(goodList)
+      this.goPayment(goodList);
     },
     toPayment(goodsId) {
       this.getGoodsDetail(goodsId).then((res) => {
@@ -115,22 +134,19 @@ export default {
             this.$refs.selectClassModal.showModal(res);
           }
           if (res.goodsType === 2 || res.goodsType === 6) {
-            this.goPayment(res)
+            this.goPayment(res);
           }
         } else {
-          this.goPayment(res)
+          this.goPayment(res);
         }
       });
     },
     goPayment(data) {
       if (!Array.isArray(data)) {
-        data = [data]
+        data = [data];
       }
       let selectGoodsList = JSON.parse(JSON.stringify(data));
-      localStorage.setItem(
-        "checkGoodsList",
-        JSON.stringify(selectGoodsList)
-      );
+      localStorage.setItem("checkGoodsList", JSON.stringify(selectGoodsList));
       this.$router.push({
         path: "/payment",
       });
@@ -141,15 +157,15 @@ export default {
     addCart(item) {
       // 判断有没有规格选择
       if (this.item.specTemplateId) {
-        this.isCarOrBuy = 1
-        this.getSpecDetail()
-        return
+        this.isCarOrBuy = 1;
+        this.getSpecDetail();
+        return;
       }
-      this.getAddCar(this.item.goodsId)
+      this.getAddCar(this.item.goodsId);
     },
     getAddCar(goodsIds) {
       if (!Array.isArray(goodsIds)) {
-        goodsIds = [goodsIds]
+        goodsIds = [goodsIds];
       }
       this.$request
         .addCart({ goodsIds })
@@ -182,20 +198,21 @@ export default {
     getSpecDetail() {
       this.$axios({
         url: `/app/common/spec/${this.item.specTemplateId}`,
-        method: 'get',
-        noToken: true
-      }).then((res) => {
-        if (res.data) {
-          this.skuModal = true
-        } else {
-          if (this.isCarOrBuy == 1) {
-            this.getAddCar(this.item.goodsId)
+        method: "get",
+        noToken: true,
+      })
+        .then((res) => {
+          if (res.data) {
+            this.skuModal = true;
           } else {
-            this.toPayment(this.item.goodsId)
+            if (this.isCarOrBuy == 1) {
+              this.getAddCar(this.item.goodsId);
+            } else {
+              this.toPayment(this.item.goodsId);
+            }
           }
-
-        }
-      }).catch(() => { })
+        })
+        .catch(() => {});
     },
   },
 };
@@ -289,12 +306,16 @@ export default {
 
       span {
         font-size: 18px;
-
-        i {
+        &::before {
+          content: "￥";
           font-size: 14px;
-          font-style: normal;
+          font-weight: bold;
         }
       }
+      i {
+        // font-size: 18px;
+        font-style: normal;
+      }
     }
 
     .linePrice {

src/pages/course-detail/index.vue

@@ -4446,7 +4446,7 @@ export default {
       }
       this.clickLock = true;
       this.initVideo(section);
-      this.playTabIndex = index
+      this.playTabIndex = index;
     },
     initVideo(option) {
       this.playVideo(option);
@@ -4699,7 +4699,12 @@ export default {
             type: "success",
             message: "播放完毕",
           });
-          this.$refs["courseTree"][0].dialogPalyVisible = true;
+          if (this.playTabIndex == this.courseTabIndex - 1) {
+            this.$refs["courseTree"][
+              this.playTabIndex
+            ].dialogPalyVisible = true;
+          }
+
           if (this.isFullScreen()) {
             this.exitFullscreen();
           }

src/pages/goods-detail/bank-detail.vue

@@ -27,11 +27,27 @@
                   <div class="title">
                     {{ goodsDetail.goodsName }}
                   </div>
-                  <div class="price" v-if="goodsDetail.standPrice === 0">
-                    免费
+                  <div
+                    class="price"
+                    v-if="
+                      !goodsDetail.specTemplateId ||
+                      (!goodsDetail.maxPrice && !goodsDetail.minPrice)
+                    "
+                  >
+                    {{
+                      goodsDetail.standPrice === 0
+                        ? "免费"
+                        : `￥${goodsDetail.standPrice}`
+                    }}
                   </div>
-                  <div class="price" v-else>
-                    ￥{{ goodsDetail.standPrice | toFixed }}
+                  <div v-else class="price">
+                    <span>{{ goodsDetail.minPrice }}</span>
+                    <template
+                      v-if="goodsDetail.minPrice != goodsDetail.maxPrice"
+                    >
+                      <i>-</i>
+                      <span>{{ goodsDetail.maxPrice }}</span>
+                    </template>
                   </div>
                   <div class="btns">
                     <el-button
@@ -162,7 +178,7 @@
                                         v-for="(
                                           section, sectionIndex
                                         ) in item.list"
-                                        :key="sectionIndedialogx"
+                                        :key="sectionIndex"
                                       >
                                         <div class="bank-section__item__text">
                                           {{ section.examName }}
@@ -1037,7 +1053,6 @@
       :specTemplateId="goodsDetail.specTemplateId"
       :isCarOrBuy="isCarOrBuy"
       @toShopCart="getAddCar($event)"
-      @togoBuy="togoBuy($event)"
     ></index-sku-dialog>
   </div>
 </template>
@@ -1790,20 +1805,14 @@ export default {
     },
     toPayment(data) {
       if (!Array.isArray(data)) {
-        data = [data]
+        data = [data];
       }
       let selectGoodsList = JSON.parse(JSON.stringify(data));
-      localStorage.setItem(
-        "checkGoodsList",
-        JSON.stringify(selectGoodsList)
-      );
+      localStorage.setItem("checkGoodsList", JSON.stringify(selectGoodsList));
       this.$router.push({
         path: "/payment",
       });
     },
-    togoBuy(goodList) {
-      this.toPayment(goodList);
-    },
     addCart() {
       if (!this.$tools.isLogin()) {
         this.setCurrentRouter(this.$route);
@@ -1824,7 +1833,7 @@ export default {
     },
     getAddCar(goodsIds) {
       if (!Array.isArray(goodsIds)) {
-        goodsIds = [goodsIds]
+        goodsIds = [goodsIds];
       }
       this.$request
         .addCart({ goodsIds })
@@ -2000,6 +2009,17 @@ export default {
               font-weight: bold;
               color: #ff2d55;
               line-height: 24px;
+              span {
+                font-size: 32px;
+                &::before {
+                  content: "￥";
+                  font-size: 24px;
+                  font-weight: bold;
+                }
+              }
+              i {
+                font-size: 32px;
+              }
             }
 
             .btns {

src/pages/goods-detail/course-detail.vue

@@ -6,7 +6,9 @@
         <div class="section__header">
           <div class="container">
             <el-breadcrumb separator="/">
-              <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
+              <el-breadcrumb-item :to="{ path: '/index' }"
+                >首页</el-breadcrumb-item
+              >
               <el-breadcrumb-item>商品详情</el-breadcrumb-item>
             </el-breadcrumb>
           </div>
@@ -16,7 +18,10 @@
             <div class="goods-info">
               <div class="goods-info__header">
                 <div class="img">
-                  <img :src="$tools.splitImgHost(goodsDetail.coverUrl, false)" alt="" />
+                  <img
+                    :src="$tools.splitImgHost(goodsDetail.coverUrl, false)"
+                    alt=""
+                  />
                 </div>
                 <div class="text">
                   <div class="title">
@@ -26,17 +31,44 @@
                     {{ courseList.length }} 课程
                     {{ goodsDetail.classHours || "-" }}学时
                   </div>
-                  <div class="price"
-                    v-if="!goodsDetail.specTemplateId || (!goodsDetail.maxPrice && !goodsDetail.minPrice)">{{
-                        goodsDetail.standPrice === 0 ?
-                          '免费' : `￥${goodsDetail.standPrice}`
-                    }}</div>
-                  <div v-else class="price"><span><i>￥</i>{{ goodsDetail.minPrice }}</span><span
-                      v-if="goodsDetail.minPrice != goodsDetail.maxPrice">-<i>￥</i>{{ goodsDetail.maxPrice }}</span>
+                  <div
+                    class="price"
+                    v-if="
+                      !goodsDetail.specTemplateId ||
+                      (!goodsDetail.maxPrice && !goodsDetail.minPrice)
+                    "
+                  >
+                    {{
+                      goodsDetail.standPrice === 0
+                        ? "免费"
+                        : `￥${goodsDetail.standPrice}`
+                    }}
+                  </div>
+                  <div v-else class="price">
+                    <span>{{ goodsDetail.minPrice }}</span>
+                    <template
+                      v-if="goodsDetail.minPrice != goodsDetail.maxPrice"
+                    >
+                      <i>-</i>
+                      <span>{{ goodsDetail.maxPrice }}</span>
+                    </template>
                   </div>
                   <div class="btns">
-                    <el-button type="primary" round class="buynow" @click="buyNow()">立即购买</el-button>
-                    <el-button type="primary" round plain class="add" @click="addCart()">加入购物车</el-button>
+                    <el-button
+                      type="primary"
+                      round
+                      class="buynow"
+                      @click="buyNow()"
+                      >立即购买</el-button
+                    >
+                    <el-button
+                      type="primary"
+                      round
+                      plain
+                      class="add"
+                      @click="addCart()"
+                      >加入购物车</el-button
+                    >
                   </div>
                 </div>
               </div>
@@ -48,73 +80,132 @@
                   <el-tab-pane label="章节目录" name="2">
                     <div slot="label" style="position: relative">
                       <span class="label">章节目录</span>
-                      <span v-if="listenConfigList.length" class="view-note">试看</span>
+                      <span v-if="listenConfigList.length" class="view-note"
+                        >试看</span
+                      >
                     </div>
 
                     <div class="goods-menu clearfix">
                       <div class="left-box">
-                        <div v-for="(courseItem, tindex) in goodsTeacher" :key="tindex + 'one'">
+                        <div
+                          v-for="(courseItem, tindex) in goodsTeacher"
+                          :key="tindex + 'one'"
+                        >
                           <div class="left-box__body">
-                            <template v-for="(course, cindex) in courseItem.courseList">
-                              <div class="course-list-item" v-if="course.show == 1" :key="cindex + 'two'">
+                            <template
+                              v-for="(course, cindex) in courseItem.courseList"
+                            >
+                              <div
+                                class="course-list-item"
+                                v-if="course.show == 1"
+                                :key="cindex + 'two'"
+                              >
                                 <div class="doubles">
-                                  <div class="course-list-item__title" @click="openCourse(course)">
-                                    <i :class="{
-                                      'el-icon-caret-right': !course.showList,
-                                      'el-icon-caret-bottom': course.showList,
-                                    }"></i>
+                                  <div
+                                    class="course-list-item__title"
+                                    @click="openCourse(course)"
+                                  >
+                                    <i
+                                      :class="{
+                                        'el-icon-caret-right': !course.showList,
+                                        'el-icon-caret-bottom': course.showList,
+                                      }"
+                                    ></i>
                                     {{ course.courseName }}
                                   </div>
-                                  <div v-if="
-                                    courseItem.teaList &&
-                                    courseItem.teaList.length > 0
-                                  " class="teacher_names">
-                                    <div v-for="(tea, index) in courseItem.teaList" :key="index + 'three'" class="names"
+                                  <div
+                                    v-if="
+                                      courseItem.teaList &&
+                                      courseItem.teaList.length > 0
+                                    "
+                                    class="teacher_names"
+                                  >
+                                    <div
+                                      v-for="(tea, index) in courseItem.teaList"
+                                      :key="index + 'three'"
+                                      class="names"
                                       :class="{
                                         nactive: States[tindex] == index,
-                                      }" @click="switchTeacher(tea, index, tindex)">
+                                      }"
+                                      @click="switchTeacher(tea, index, tindex)"
+                                    >
                                       {{ tea.aliasName }}
                                     </div>
                                   </div>
                                 </div>
                                 <template v-if="course.showList">
-                                  <div class="item" v-for="(item, index) in course.list" :key="index">
+                                  <div
+                                    class="item"
+                                    v-for="(item, index) in course.list"
+                                    :key="index"
+                                  >
                                     <template v-if="item.type == 1">
-                                      <div class="item__title" @click="openModule(item)">
-                                        <i :class="{
-                                          'el-icon-caret-right':
-                                            !item.showList,
-                                          'el-icon-caret-bottom':
-                                            item.showList,
-                                        }"></i>
+                                      <div
+                                        class="item__title"
+                                        @click="openModule(item)"
+                                      >
+                                        <i
+                                          :class="{
+                                            'el-icon-caret-right':
+                                              !item.showList,
+                                            'el-icon-caret-bottom':
+                                              item.showList,
+                                          }"
+                                        ></i>
                                         {{ item.name }}
                                       </div>
                                       <div class="item__content">
-                                        <div class="bank-chapter" v-if="item.showList">
-                                          <div class="bank-chapter__item" v-for="(
+                                        <div
+                                          class="bank-chapter"
+                                          v-if="item.showList"
+                                        >
+                                          <div
+                                            class="bank-chapter__item"
+                                            v-for="(
                                               chapter, chapterIndex
-                                            ) in item.list" :key="chapterIndex">
-                                            <div class="bank-chapter__item__text" @click="openChapter(chapter)">
-                                              <i :class="{
-                                                'el-icon-caret-right':
-                                                  !chapter.showList,
-                                                'el-icon-caret-bottom':
-                                                  chapter.showList,
-                                              }"></i>{{ chapter.name }}
+                                            ) in item.list"
+                                            :key="chapterIndex"
+                                          >
+                                            <div
+                                              class="bank-chapter__item__text"
+                                              @click="openChapter(chapter)"
+                                            >
+                                              <i
+                                                :class="{
+                                                  'el-icon-caret-right':
+                                                    !chapter.showList,
+                                                  'el-icon-caret-bottom':
+                                                    chapter.showList,
+                                                }"
+                                              ></i
+                                              >{{ chapter.name }}
                                             </div>
 
-                                            <div class="bank-section" v-if="chapter.showList">
-                                              <div class="bank-section__item" v-for="(
+                                            <div
+                                              class="bank-section"
+                                              v-if="chapter.showList"
+                                            >
+                                              <div
+                                                class="bank-section__item"
+                                                v-for="(
                                                   section, sectionIndex
-                                                ) in chapter.list" :key="sectionIndex">
-                                                <div class="
+                                                ) in chapter.list"
+                                                :key="sectionIndex"
+                                              >
+                                                <div
+                                                  class="
                                                     bank-section__item__text
-                                                  ">
+                                                  "
+                                                >
                                                   {{ section.name }}
                                                 </div>
-                                                <div v-if="section.tryListen" @click="
-                                                  toDo(section, item.courseId)
-                                                " class="btn">
+                                                <div
+                                                  v-if="section.tryListen"
+                                                  @click="
+                                                    toDo(section, item.courseId)
+                                                  "
+                                                  class="btn"
+                                                >
                                                   试看
                                                 </div>
                                               </div>
@@ -128,27 +219,46 @@
                                       <div class="item__content">
                                         <div class="bank-chapter">
                                           <div class="bank-chapter__item">
-                                            <div class="bank-chapter__item__text" @click="openChapter(item)">
-                                              <i :class="{
-                                                'el-icon-caret-right':
-                                                  !item.showList,
-                                                'el-icon-caret-bottom':
-                                                  item.showList,
-                                              }"></i>{{ item.name }}
+                                            <div
+                                              class="bank-chapter__item__text"
+                                              @click="openChapter(item)"
+                                            >
+                                              <i
+                                                :class="{
+                                                  'el-icon-caret-right':
+                                                    !item.showList,
+                                                  'el-icon-caret-bottom':
+                                                    item.showList,
+                                                }"
+                                              ></i
+                                              >{{ item.name }}
                                             </div>
 
-                                            <div class="bank-section" v-if="item.showList">
-                                              <div class="bank-section__item" v-for="(
+                                            <div
+                                              class="bank-section"
+                                              v-if="item.showList"
+                                            >
+                                              <div
+                                                class="bank-section__item"
+                                                v-for="(
                                                   section, sectionIndex
-                                                ) in item.list" :key="sectionIndex">
-                                                <div class="
+                                                ) in item.list"
+                                                :key="sectionIndex"
+                                              >
+                                                <div
+                                                  class="
                                                     bank-section__item__text
-                                                  ">
+                                                  "
+                                                >
                                                   {{ section.name }}
                                                 </div>
-                                                <div v-if="section.tryListen" @click="
-                                                  toDo(section, item.courseId)
-                                                " class="btn">
+                                                <div
+                                                  v-if="section.tryListen"
+                                                  @click="
+                                                    toDo(section, item.courseId)
+                                                  "
+                                                  class="btn"
+                                                >
                                                   试看
                                                 </div>
                                               </div>
@@ -162,10 +272,16 @@
                                       <div class="item__content">
                                         <div class="bank-section">
                                           <div class="bank-section__item">
-                                            <div class="bank-section__item__text">
+                                            <div
+                                              class="bank-section__item__text"
+                                            >
                                               {{ item.name }}
                                             </div>
-                                            <div v-if="item.tryListen" @click="toDo(item, item.courseId)" class="btn">
+                                            <div
+                                              v-if="item.tryListen"
+                                              @click="toDo(item, item.courseId)"
+                                              class="btn"
+                                            >
                                               试看
                                             </div>
                                           </div>
@@ -185,9 +301,13 @@
                           <a class="more" @click="comeMoreList">更多></a>
                         </div>
                         <ul class="list" v-if="recommendList.goodsList">
-                          <li class="course-item" v-for="(itemy, index) in compyRecommend(
-                            recommendList.goodsList
-                          )" :key="index">
+                          <li
+                            class="course-item"
+                            v-for="(itemy, index) in compyRecommend(
+                              recommendList.goodsList
+                            )"
+                            :key="index"
+                          >
                             <GoodsItem :item="itemy"></GoodsItem>
                             <!-- <div
                               class="course-item__img"
@@ -218,16 +338,26 @@
                     </div>
                   </el-tab-pane>
                   <el-tab-pane label="学员须知" name="3">
-                    <div v-html="
-                      goodsDetail.buyNote &&
-                      goodsDetail.buyNote.replace(/\n|\r\n/g, '<br>')
-                    "></div>
+                    <div
+                      v-html="
+                        goodsDetail.buyNote &&
+                        goodsDetail.buyNote.replace(/\n|\r\n/g, '<br>')
+                      "
+                    ></div>
                   </el-tab-pane>
-                  <el-tab-pane label="赠送题卷" name="4" v-if="freeMenuList.length > 0">
+                  <el-tab-pane
+                    label="赠送题卷"
+                    name="4"
+                    v-if="freeMenuList.length > 0"
+                  >
                     <div class="goods-menu clearfix">
                       <div class="left-box">
                         <div class="left-box__body">
-                          <div class="course-list-item" v-for="(course, index) in freeMenuList" :key="index">
+                          <div
+                            class="course-list-item"
+                            v-for="(course, index) in freeMenuList"
+                            :key="index"
+                          >
                             <div class="item__content">
                               <div class="bank-section">
                                 <div class="bank-section__item">
@@ -246,9 +376,13 @@
                           <a class="more" @click="comeMoreList">更多></a>
                         </div>
                         <ul class="list" v-if="recommendList.goodsList">
-                          <li class="course-item" v-for="(itemy, index) in compyRecommend(
-                            recommendList.goodsList
-                          )" :key="index">
+                          <li
+                            class="course-item"
+                            v-for="(itemy, index) in compyRecommend(
+                              recommendList.goodsList
+                            )"
+                            :key="index"
+                          >
                             <GoodsItem :item="itemy"></GoodsItem>
                           </li>
                         </ul>
@@ -261,20 +395,27 @@
           </div>
         </div>
 
-        <div class="section__footer" v-if="
-          recommendList.goodsList &&
-          recommendList.goodsList.length &&
-          (activeName == 1 || activeName == 3)
-        ">
+        <div
+          class="section__footer"
+          v-if="
+            recommendList.goodsList &&
+            recommendList.goodsList.length &&
+            (activeName == 1 || activeName == 3)
+          "
+        >
           <div class="recommend">
             <div class="recommend__header">
               <div class="title">相关推荐</div>
             </div>
             <div class="recommend__body">
               <ul class="list clearfix">
-                <li class="recommend-item" v-for="(itemy, index) in compyRecommend(
-                  recommendList.goodsList
-                )" :key="index">
+                <li
+                  class="recommend-item"
+                  v-for="(itemy, index) in compyRecommend(
+                    recommendList.goodsList
+                  )"
+                  :key="index"
+                >
                   <GoodsItem :item="itemy"></GoodsItem>
                 </li>
               </ul>
@@ -288,8 +429,14 @@
       </div>
     </section>
 
-    <el-dialog width="800px" class="video-modal" :visible.sync="videoModalShow" :close-on-click-modal="false"
-      :close-on-press-escape="false" :show-close="false">
+    <el-dialog
+      width="800px"
+      class="video-modal"
+      :visible.sync="videoModalShow"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :show-close="false"
+    >
       <div class="video-modal__content">
         <a class="video-modal__close" @click="videoModalClose()">X</a>
 
@@ -306,39 +453,77 @@
       </div>
     </el-dialog>
 
-    <el-dialog width="800px" class="select-class" :visible.sync="selectClassModal" :before-close="cancelClassModal">
+    <el-dialog
+      width="800px"
+      class="select-class"
+      :visible.sync="selectClassModal"
+      :before-close="cancelClassModal"
+    >
       <div class="select-class__content">
-        <div class="selection" v-if="
-          goodsDetail.templateType == 'class' && goodsDetail.goodsType == 1
-        ">
-          <el-select class="select" v-model="gradeId" placeholder="请选择班级" size="small"
-            @click.native="selectClick(goodsDetail, 'class', goodsId)">
-            <el-option v-for="item in gradeList" :key="item.gradeId" :disabled="
-              item.studentNum > 0 && item.studentNum == item.studentUpper
-            " :label="
-  item.classEndTime
-    ? `${item.className} 有效期至：${$tools.timestampToTime(
-      item.classEndTime
-    )}，本班还剩${$tools.GetRTime(
-      item.classEndTime
-    )}天将结束学习`
-    : `${item.className}`
-" :value="item.gradeId">
+        <div
+          class="selection"
+          v-if="
+            goodsDetail.templateType == 'class' && goodsDetail.goodsType == 1
+          "
+        >
+          <el-select
+            class="select"
+            v-model="gradeId"
+            placeholder="请选择班级"
+            size="small"
+            @click.native="selectClick(goodsDetail, 'class', goodsId)"
+          >
+            <el-option
+              v-for="item in gradeList"
+              :key="item.gradeId"
+              :disabled="
+                item.studentNum > 0 && item.studentNum == item.studentUpper
+              "
+              :label="
+                item.classEndTime
+                  ? `${item.className} 有效期至：${$tools.timestampToTime(
+                      item.classEndTime
+                    )}，本班还剩${$tools.GetRTime(
+                      item.classEndTime
+                    )}天将结束学习`
+                  : `${item.className}`
+              "
+              :value="item.gradeId"
+            >
             </el-option>
           </el-select>
         </div>
 
-        <div class="selection" v-if="
-          goodsDetail.templateType == 'apply' && goodsDetail.goodsType == 1
-        ">
-          <el-select v-model="educationId" placeholder="请选择考期" size="small"
-            @click.native="selectClick(goodsDetail, 'exam')">
-            <el-option v-for="item in examineList" :key="item.educationId" :label="item.examineName"
-              :value="item.educationId">
+        <div
+          class="selection"
+          v-if="
+            goodsDetail.templateType == 'apply' && goodsDetail.goodsType == 1
+          "
+        >
+          <el-select
+            v-model="educationId"
+            placeholder="请选择考期"
+            size="small"
+            @click.native="selectClick(goodsDetail, 'exam')"
+          >
+            <el-option
+              v-for="item in examineList"
+              :key="item.educationId"
+              :label="item.examineName"
+              :value="item.educationId"
+            >
             </el-option>
           </el-select>
-          <el-cascader size="small" :props="props" ref="cascader" :options="provinceList" v-model="examArea"
-            @change="areaChange(goodsDetail)" clearable placeholder="请选择报考地区"></el-cascader>
+          <el-cascader
+            size="small"
+            :props="props"
+            ref="cascader"
+            :options="provinceList"
+            v-model="examArea"
+            @change="areaChange(goodsDetail)"
+            clearable
+            placeholder="请选择报考地区"
+          ></el-cascader>
         </div>
       </div>
 
@@ -350,8 +535,12 @@
     <ToolBar></ToolBar>
     <Footer></Footer>
     <!-- 规格选择 -->
-    <index-sku-dialog :skuModal.sync="skuModal" :specTemplateId="goodsDetail.specTemplateId" :isCarOrBuy="isCarOrBuy"
-      @toShopCart="getAddCar($event)" @togoBuy="togoBuy($event)"></index-sku-dialog>
+    <index-sku-dialog
+      :skuModal.sync="skuModal"
+      :specTemplateId="goodsDetail.specTemplateId"
+      :isCarOrBuy="isCarOrBuy"
+      @toShopCart="getAddCar($event)"
+    ></index-sku-dialog>
   </div>
 </template>
 
@@ -458,7 +647,7 @@ export default {
     if (this.player) {
       this.player.destroy();
     }
-    document.removeEventListener('visibilitychange', this.pauseVideo)
+    document.removeEventListener("visibilitychange", this.pauseVideo);
   },
   watch: {
     "$route.params.goodsId": {
@@ -472,7 +661,7 @@ export default {
   },
   mounted() {
     this.getInit();
-    document.addEventListener('visibilitychange', this.pauseVideo)
+    document.addEventListener("visibilitychange", this.pauseVideo);
   },
   computed: {
     compyRecommend: function () {
@@ -490,21 +679,11 @@ export default {
         return ary;
       };
     },
-    price() {
-      let { standPrice, maxPrice, minPrice, specTemplateId } = this.goodsDetail
-      if (!specTemplateId) {
-        return standPrice === 0 ? '免费' : `￥${standPrice}`
-      }
-      if (maxPrice == minPrice) {
-        return minPrice === 0 ? '免费' : `￥${minPrice}`
-      }
-      return `￥${minPrice} - ${maxPrice}`
-    }
   },
   methods: {
     ...mapMutations(["setCurrentRouter", "getCartCount"]),
     pauseVideo() {
-      if (document.visibilityState === 'hidden') {
+      if (document.visibilityState === "hidden") {
         this.player && this.player.j2s_pauseVideo();
       }
     },
@@ -868,7 +1047,7 @@ export default {
       let auditionMinute = this.listenConfigList.find((item) => {
         if (
           item.sectionId ==
-          (this.sectionItem.sectionId || this.sectionItem.menuId) &&
+            (this.sectionItem.sectionId || this.sectionItem.menuId) &&
           item.courseId == this.playCourseId
         ) {
           return true;
@@ -1292,10 +1471,6 @@ export default {
         return;
       }
     },
-    togoBuy(skuItem) {
-      this.toPayment(skuItem);
-      this.goodsId = skuItem.goodsId;
-    },
     toPayment(goodsDetail) {
       if (this.goodsDetail.templateType) {
         this.selectClassModal = true;
@@ -1425,7 +1600,7 @@ export default {
     },
     getAddCar(goodsIds) {
       if (!Array.isArray(goodsIds)) {
-        goodsIds = [goodsIds]
+        goodsIds = [goodsIds];
       }
       this.$request
         .addCart({ goodsIds })
@@ -1462,7 +1637,7 @@ export default {
             }
           }
         })
-        .catch(() => { });
+        .catch(() => {});
     },
     /**
      * 获取商品详情
@@ -1658,7 +1833,7 @@ export default {
         distinguishCancelAndClose: false,
         showClose: false,
       })
-        .then((_) => { })
+        .then((_) => {})
         .catch((_) => {
           this.questionModalShow = false;
         });
@@ -1735,12 +1910,15 @@ export default {
 
               span {
                 font-size: 32px;
-
-                i {
+                &::before {
+                  content: "￥";
                   font-size: 24px;
-                  font-style: normal;
+                  font-weight: bold;
                 }
               }
+              i{
+                font-size: 32px;
+              }
             }
 
             .btns {
@@ -1932,90 +2110,6 @@ export default {
                   top: 0;
                 }
               }
-
-              .list {
-                .course-item {
-                  // margin: 110px 9px 0;
-                  // width: 300px;
-                  // height: 178px;
-                  // background: #ffffff;
-                  // box-shadow: 0px 10px 13px 3px rgba(63, 141, 253, 0.1);
-                  // border-radius: 10px;
-                  // position: relative;
-                  // background: #fff;
-                  // padding-top: 100px;
-
-                  // &__img {
-                  //   width: 280px;
-                  //   height: 178px;
-                  //   background: #ffffff;
-                  //   box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.08);
-                  //   border-radius: 10px;
-                  //   position: absolute;
-                  //   left: 10px;
-                  //   top: -78px;
-                  //   background: rgba(122, 136, 246, 1);
-                  //   overflow: hidden;
-                  //   background: no-repeat center center;
-                  //   background-size: 280px 178px;
-                  //   .note {
-                  //     width: 80px;
-                  //     height: 24px;
-                  //     background: #d94404;
-                  //     box-shadow: 0px 1px 1px 0px rgba(248, 78, 5, 0.4);
-                  //     border-radius: 10px 0px 20px 0px;
-                  //     text-align: center;
-                  //     line-height: 24px;
-                  //     color: #fff;
-                  //   }
-                  // }
-
-                  // &__title {
-                  //   margin: 0 8px;
-                  //   font-size: 14px;
-                  //   font-family: Microsoft YaHei;
-                  //   font-weight: 400;
-                  //   color: #333333;
-                  //   line-height: 24px;
-                  // }
-
-                  // &__desc {
-                  //   height: 32px;
-                  //   position: absolute;
-                  //   left: 0;
-                  //   right: 0;
-                  //   bottom: 0;
-                  //   margin-left: 8px;
-                  //   display: flex;
-                  //   justify-content: space-between;
-
-                  //   .price {
-                  //     font-size: 18px;
-                  //     font-family: Microsoft YaHei;
-                  //     font-weight: bold;
-                  //     color: #ff2d55;
-                  //     line-height: 32px;
-                  //   }
-
-                  //   .add {
-                  //     display: block;
-                  //     width: 118px;
-                  //     height: 32px;
-                  //     line-height: 30px;
-                  //     background: #f2f4f7;
-                  //     border-radius: 10px 0px 10px 0px;
-                  //     font-size: 16px;
-                  //     color: #3f8dfd;
-                  //     text-align: center;
-
-                  //     &:hover {
-                  //       background: #3f8dfd;
-                  //       color: #f2f4f7;
-                  //     }
-                  //   }
-                  // }
-                }
-              }
             }
           }
         }
@@ -2045,85 +2139,6 @@ export default {
 
             .recommend-item {
               float: left;
-              // margin: 100px 9px 0;
-              // width: 300px;
-              // height: 178px;
-              // background: #ffffff;
-              // box-shadow: 0px 10px 13px 3px rgba(63, 141, 253, 0.1);
-              // border-radius: 10px;
-              // position: relative;
-              // background: #fff;
-              // padding-top: 100px;
-
-              // &__img {
-              //   width: 280px;
-              //   height: 178px;
-              //   background: #ffffff;
-              //   box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.08);
-              //   border-radius: 10px;
-              //   position: absolute;
-              //   left: 10px;
-              //   top: -78px;
-              //   background: rgba(122, 136, 246, 1);
-              //   overflow: hidden;
-              //   background: no-repeat center center;
-              //   background-size: 280px 178px;
-              //   .note {
-              //     width: 80px;
-              //     height: 24px;
-              //     background: #d94404;
-              //     box-shadow: 0px 1px 1px 0px rgba(248, 78, 5, 0.4);
-              //     border-radius: 10px 0px 20px 0px;
-              //     text-align: center;
-              //     line-height: 24px;
-              //     color: #fff;
-              //   }
-              // }
-
-              // &__title {
-              //   margin: 0 8px;
-              //   font-size: 14px;
-              //   font-family: Microsoft YaHei;
-              //   font-weight: 400;
-              //   color: #333333;
-              //   line-height: 24px;
-              // }
-
-              // &__desc {
-              //   height: 32px;
-              //   position: absolute;
-              //   left: 0;
-              //   right: 0;
-              //   bottom: 0;
-              //   margin-left: 8px;
-              //   display: flex;
-              //   justify-content: space-between;
-
-              //   .price {
-              //     font-size: 18px;
-              //     font-family: Microsoft YaHei;
-              //     font-weight: bold;
-              //     color: #ff2d55;
-              //     line-height: 32px;
-              //   }
-
-              //   .add {
-              //     display: block;
-              //     width: 118px;
-              //     height: 32px;
-              //     line-height: 30px;
-              //     background: #f2f4f7;
-              //     border-radius: 10px 0px 10px 0px;
-              //     font-size: 16px;
-              //     color: #3f8dfd;
-              //     text-align: center;
-
-              //     &:hover {
-              //       background: #3f8dfd;
-              //       color: #f2f4f7;
-              //     }
-              //   }
-              // }
             }
           }
         }

src/pages/goods-detail/live-detail.vue

@@ -31,11 +31,27 @@
                     {{ courseList.length }} 课程
                     {{ goodsDetail.classHours || "-" }}学时
                   </div>
-                  <div class="price" v-if="goodsDetail.standPrice === 0">
-                    免费
+                  <div
+                    class="price"
+                    v-if="
+                      !goodsDetail.specTemplateId ||
+                      (!goodsDetail.maxPrice && !goodsDetail.minPrice)
+                    "
+                  >
+                    {{
+                      goodsDetail.standPrice === 0
+                        ? "免费"
+                        : `￥${goodsDetail.standPrice}`
+                    }}
                   </div>
-                  <div class="price" v-else>
-                    ￥{{ goodsDetail.standPrice | toFixed }}
+                  <div v-else class="price">
+                    <span>{{ goodsDetail.minPrice }}</span>
+                    <template
+                      v-if="goodsDetail.minPrice != goodsDetail.maxPrice"
+                    >
+                      <i>-</i>
+                      <span>{{ goodsDetail.maxPrice }}</span>
+                    </template>
                   </div>
                   <div class="btns">
                     <el-button
@@ -543,7 +559,6 @@
       :specTemplateId="goodsDetail.specTemplateId"
       :isCarOrBuy="isCarOrBuy"
       @toShopCart="getAddCar($event)"
-      @togoBuy="togoBuy($event)"
     ></index-sku-dialog>
   </div>
 </template>
@@ -652,7 +667,7 @@ export default {
     if (this.$tools.isLogin()) {
       this.getProvinceList();
     }
-    document.addEventListener('visibilitychange', this.pauseVideo)
+    document.addEventListener("visibilitychange", this.pauseVideo);
   },
   computed: {
     compyRecommend: function () {
@@ -674,7 +689,7 @@ export default {
   methods: {
     ...mapMutations(["setCurrentRouter", "getCartCount"]),
     pauseVideo() {
-      if (document.visibilityState === 'hidden') {
+      if (document.visibilityState === "hidden") {
         this.player && this.player.j2s_pauseVideo();
       }
     },
@@ -1445,10 +1460,6 @@ export default {
         return;
       }
     },
-    togoBuy(skuItem) {
-      this.toPayment(skuItem);
-      this.goodsId = skuItem.goodsId;
-    },
     toPayment(goodsDetail) {
       let selectGoodsList = JSON.parse(JSON.stringify([goodsDetail]));
       selectGoodsList.forEach((item) => {
@@ -1572,7 +1583,7 @@ export default {
     },
     getAddCar(goodsIds) {
       if (!Array.isArray(goodsIds)) {
-        goodsIds = [goodsIds]
+        goodsIds = [goodsIds];
       }
       this.$request
         .addCart({ goodsIds })
@@ -1712,9 +1723,9 @@ export default {
         });
     },
   },
-  beforeDestroy(){
-    document.removeEventListener('visibilitychange', this.pauseVideo)
-  }
+  beforeDestroy() {
+    document.removeEventListener("visibilitychange", this.pauseVideo);
+  },
 };
 </script>
 
@@ -1782,6 +1793,17 @@ export default {
               font-weight: bold;
               color: #ff2d55;
               line-height: 24px;
+              span {
+                font-size: 32px;
+                &::before {
+                  content: "￥";
+                  font-size: 24px;
+                  font-weight: bold;
+                }
+              }
+              i{
+                font-size: 32px;
+              }
             }
 
             .btns {