新规秘卷新增激励广告

src/otherPages/courseCatalog/components/courseCatalog.vue

@@ -1,9 +1,9 @@
 <template>
   <view class="bg">
     <view class="video">
-      <view v-for="(item, index) in list" :key="index" class="video-item">
+      <view   @click="isPlayVideo(item)" v-for="(item, index) in list" :key="index" class="video-item">
         <image
-          @click="goPlayVideo(item)"
+        
           class="video-item-left"
           mode="widthFix"
           :src="item.videoCover"
@@ -38,14 +38,29 @@
     </view>
     <view class="pay">
       <view @click="buyRoadCourse" class="pay-text">
-        <text>立即支付&nbsp;&nbsp;¥{{ price / 100 }}</text>
+        <text v-if="!examIds.includes(examId)"
+          >立即支付&nbsp;&nbsp;¥{{ price / 100 }}</text
+        >
+        <icon
+          v-if="examIds.includes(examId)"
+          type="success_no_circle"
+          color="#ffffff"
+          size="16"
+          style="margin-right:15rpx;"
+        ></icon>
+        <text v-if="examIds.includes(examId)">已购买</text>
       </view>
       <image
+        v-if="!examIds.includes(examId)"
         style="width: 100%"
         mode="widthFix"
         src="https://ct.zzxcx.net/ctjk/mp-wx/courseCatalog/payBg.png"
       ></image>
-      <!-- <image mode="widthFix" src="https://ct.zzxcx.net/ctjk/mp-wx/courseCatalog/alreadyPay.png"></image> -->
+      <image
+        v-if="examIds.includes(examId)"
+        mode="widthFix"
+        src="https://ct.zzxcx.net/ctjk/mp-wx/courseCatalog/alreadyPay.png"
+      ></image>
     </view>
     <view class="advantage">
       <view class="advantage-title"> 实拍优势</view>
@@ -61,6 +76,7 @@
 
 <script>
 import api from "@/api";
+import { mapGetters } from "vuex";
 export default {
   data() {
     return {
@@ -70,21 +86,28 @@ export default {
     };
   },
   methods: {
-    goPlayVideo(item){
+    isPlayVideo(item) {
+      if(!this.examIds.includes(this.examId)){
+        uni.showToast({
+          title:"请购买",
+          icon:'none'
+        })
+        return
+      }
       let queryJson = JSON.stringify({
-        url:item.videoUrl
-      })
+        url: item.videoUrl,
+      });
       uni.navigateTo({
-        url:'/otherPages/playVideo/index?query='+queryJson
-      })
-
+        url: "/otherPages/playVideo/index?query=" + queryJson,
+      });
     },
     buyRoadCourse() {
       let systemInfo = wx.getSystemInfoSync();
       api.buy
         .studentWxXcxPrepareOrder({
-          examId: this.examId,
+          goodsId: this.examId,
           foreType: 2,
+          goodsType: 1,
           phoneType: systemInfo.platform == "ios" ? 1 : 2,
         })
         .then((res) => {
@@ -109,7 +132,9 @@ export default {
   onLoad(query) {
     this.query = query;
   },
-  computed: {},
+  computed: {
+    ...mapGetters(["examIds"]),
+  },
 };
 </script>
 
@@ -155,6 +180,8 @@ export default {
   .pay {
     padding: 0 30rpx;
     position: relative;
+    display: flex;
+    justify-content: center;
     .pay-text {
       position: absolute;
       top: 50%;
@@ -162,6 +189,9 @@ export default {
       text-align: center;
       color: white;
       transform: translateY(-85%);
+      display: flex;
+      justify-content: center;
+      align-items: center;
     }
   }
   .advantage {

src/otherPages/courseCatalog/index.vue

@@ -66,6 +66,7 @@ import mNavBar from "../../components/m-nav-bar/m-nav-bar.vue";
 import CourseDesc from "./components/courseDesc.vue";
 import courseCatalog from "./components/courseCatalog.vue";
 import api from '@/api'
+import { mapGetters } from "vuex";
 export default {
   components: { mNavBar, CourseDesc, courseCatalog },
   data() {
@@ -80,11 +81,15 @@ export default {
   },
   onLoad(query){
     this.query = query
+    this.$store.dispatch('getOpenExamRoom')
     api.carVideo.studentVipVideoList(this.query).then(res=>{
       this.examRoadList = res.rows
     })
 
-  }
+  },
+  computed: {
+   ...mapGetters(['examIds'])
+  },
 };
 </script>
 

src/otherPages/examRoadVideo/index.vue

@@ -98,6 +98,7 @@
 
 <script>
 import api from "@/api";
+
 export default {
   data() {
     return {

src/otherPages/selectRulePaper/index.vue

@@ -1,19 +1,65 @@
 <template>
-  <view style="display:flex">
+  <view style="display: flex">
     <image class="bg" mode="widthFix" :src="bg"></image>
     <view class="buttons">
-      <view @click="
-        goExerciseMi({
-          category: 3,
-          title: '新规秘卷一'
-        })"  class="buttons-left">进入秘卷一
+      <view
+        @click="
+          () => {
+            watchShow = true;
+            extraQuery = {
+              category: 3,
+              title: '新规秘卷一',
+            };
+          }
+        "
+        class="buttons-left"
+        >进入秘卷一
+      </view>
+      <view
+        @click="
+          watchShow = true;
+          extraQuery = {
+            category: 4,
+            title: '新规秘卷二',
+          };
+        "
+        class="buttons-right"
+        >进入秘卷二</view
+      >
+      <van-popup round :show="watchShow">
+        <view class="ad">
+          <image
+            style="width: 100%"
+            mode="widthFix"
+            src="https://ct.zzxcx.net/ctjk/mp-wx/selectRulePaper/dialog_bg.png"
+          ></image>
+          <view class="ad-buttons">
+            <view @click="watchAdGoExerciseMi(extraQuery)" class="ad-button1">
+              <image
+                style="width: 36rpx; margin-right: 15rpx"
+                mode="widthFix"
+                src="https://ct.zzxcx.net/ctjk/mp-wx/selectRulePaper/watchAd.png"
+              ></image
+              ><text>看广告免费领秘卷</text>
+            </view>
+            <view
+              @click="
+                () => {
+                  watchShow = false;
+                }
+              "
+              class="ad-button2"
+            >
+              <image
+                style="width: 36rpx; margin-right: 15rpx"
+                mode="widthFix"
+                src="https://ct.zzxcx.net/ctjk/mp-wx/selectRulePaper/cancel.png"
+              ></image>
+              <text>取消</text>
+            </view>
+          </view>
         </view>
-      <view @click="
-        goExerciseMi({
-          category: 4,
-          title: '新规秘卷二'
-        })
-      " class="buttons-right">进入秘卷二</view>
+      </van-popup>
     </view>
   </view>
 </template>
@@ -21,18 +67,24 @@
 <script>
 //试卷
 import utils from "@/utils/index";
+
 export default {
   data() {
     return {
+      watchShow: false,
       bg: "https://ct.zzxcx.net/ctjk/mp-wx/selectRulePaper/selectrulePaperBg1.png",
       query: {},
+      extraQuery: {
+        category: 3,
+        title: "新规秘卷一",
+      },
     };
   },
   onLoad(query) {
     this.query = query;
   },
   methods: {
-    goExerciseMi(extraQuery) {
+    watchAdGoExerciseMi(extraQuery) {
       let query = Object.assign({}, this.query);
       if (extraQuery) {
         query = {
@@ -41,9 +93,30 @@ export default {
         };
       } else {
       }
+      let videoAd = null;
+      if (wx.createRewardedVideoAd) {
+        videoAd = wx.createRewardedVideoAd({
+          adUnitId: "adunit-f0e94618f34d4baf",
+        });
+        videoAd.onLoad(() => {});
+        videoAd.onError((err) => {});
+        videoAd.offClose();
+        videoAd.onClose((res) => {
+          this.watchShow = false;
+          uni.navigateTo({
+            url: "/otherPages/exerciseMi/index?" + utils.mapToUrlQuery(query),
+          });
+        });
+      }
 
-      uni.navigateTo({
-        url: "/otherPages/exerciseMi/index?" + utils.mapToUrlQuery(query),
+      videoAd.show().catch(() => {
+        // 失败重试
+        videoAd
+          .load()
+          .then(() => videoAd.show())
+          .catch((err) => {
+            console.log("激励视频 广告显示失败");
+          });
       });
     },
   },
@@ -87,4 +160,47 @@ export default {
     justify-content: center;
   }
 }
+.ad {
+  width: 580rpx;
+  height: 652rpx;
+  overflow-x: hidden;
+  overflow-y: hidden;
+  background: #fff;
+  font-size: 0rpx;
+  .ad-buttons {
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    align-items: center;
+    align-content: center;
+    padding-top: 80rpx;
+    .ad-button1 {
+      width: 480rpx;
+      height: 90rpx;
+      background: linear-gradient(180deg, #ffa057 0%, #f84031 100%);
+      display: flex;
+      align-content: center;
+      align-items: center;
+      border-radius: 50rpx 50rpx 50rpx 50rpx;
+      text-align: center;
+      color: #fff;
+      justify-content: center;
+      margin-bottom: 40rpx;
+      font-size: 34rpx;
+      color: #fff;
+    }
+    .ad-button2 {
+      display: flex;
+      border-radius: 50rpx 50rpx 50rpx 50rpx;
+      border: 2rpx solid #5c6066;
+      color: #5c6066;
+      width: 480rpx;
+      height: 90rpx;
+      align-content: center;
+      align-items: center;
+      justify-content: center;
+      font-size: 34rpx;
+    }
+  }
+}
 </style>

src/store/getters.js

@@ -71,7 +71,9 @@ const getters = {
 
 
   },
-  
+  examIds:state=>state.user.openExamRoom.map(item=>{
+    return item.examId
+  }),
   avatar: state => state.user.avatar,
   name: state => state.user.name,
   introduction: state => state.user.introduction,

src/store/modules/user.js

@@ -9,6 +9,7 @@ const user = {
 		jpcjUserInfo: {
 
 		},
+		openExamRoom:[],
 		userInfo: '',
 		name: '',
 		avatar: '',
@@ -27,6 +28,9 @@ const user = {
 		}
 	},
 	mutations: {
+		SET_OPENEXAMROOM:(state,openExamRoom)=>{
+			state.openExamRoom = openExamRoom
+		},
 		SET_TOKENOBJ: (state, tokenObj) => {
 			state.tokenObj = tokenObj
 		},
@@ -114,6 +118,14 @@ const user = {
 			uni.setStorageSync("userInfo", res.data);
 			store.commit('SET_USERINFO', res.data)
 			return res
+		},
+		async getOpenExamRoom(store){
+			
+			userApi.studentVipExamList().then(res=>{
+				store.commit('SET_OPENEXAMROOM',res.rows)
+			})
+			console.log(store.state.openExamRoom)
+
 		}
 	}
 }