Bladeren bron

feat: ad page

LosMessi 2 jaren geleden
bovenliggende
commit
053094e2d2
2 gewijzigde bestanden met toevoegingen van 37 en 11 verwijderingen
  1. 17 8
      src/store/pages.js
  2. 20 3
      src/views/page.vue

+ 17 - 8
src/store/pages.js

@@ -1,28 +1,37 @@
 const SET_PAGES = 'SET_PAGES';
+const SET_AD = 'SET_AD';
+
 const state = {
   loaded: false,
   data: undefined,
+  ad: false,
 };
 
 const getters = {
   pages(state) {
-    return state.data
-  }
+    return state.data;
+  },
 };
 
 const actions = {
   setPage({ commit }, pages) {
-    console.log("setPage", pages);
-    commit( SET_PAGES, pages );
-  }
+    console.log('setPage', pages);
+    if (pages.main.adUrl) {
+      commit(SET_AD, true);
+    }
+    commit(SET_PAGES, pages);
+  },
 };
 
 const mutations = {
   [SET_PAGES](state, payload) {
-    console.log("SET_PAGES", payload);
+    console.log('SET_PAGES', payload);
     state.loaded = true;
     state.data = payload;
-  }
+  },
+  [SET_AD](state, payload) {
+    state.ad = payload;
+  },
 };
 
 export default {
@@ -30,4 +39,4 @@ export default {
   getters,
   actions,
   mutations,
-}
+};

+ 20 - 3
src/views/page.vue

@@ -2,7 +2,10 @@
   <div class="page" :class="{ isPCWeb: !isMobile }" :style="style">
     <template v-if="isMobile">
       <template v-if="!error">
-        <v-view v-if="page" :options="page"></v-view>
+        <template v-if="page">
+          <v-view v-show="!ad" :options="page"></v-view>
+          <img v-if="ad" class="ad" @click="adClick" :src="adUrl" />
+        </template>
         <div class="back" v-if="!isMain" @click="back">返回</div>
       </template>
       <div v-else class="notFound">
@@ -27,7 +30,7 @@ export default {
       loading: false,
       backMain:false,
       page: undefined,
-      isMain: false,
+      isMain: true,
       background:"",
       interval: 3000,
       logo: "",
@@ -46,7 +49,13 @@ export default {
   computed: {
     loaded(){
       return this.$store.state.pages.loaded;
-    }
+    },
+    adUrl() {
+      return this.$store.state.pages.data.main.adUrl;
+    },
+    ad(){
+      return this.$store.state.pages.ad && this.adUrl;
+    },
   },
   watch: {
     loading(val) {
@@ -118,6 +127,9 @@ export default {
       }else{
         this.$router.back();
       }
+    },
+    adClick(){
+      this.$store.commit('SET_AD', false);
     }
   }
 }
@@ -144,4 +156,9 @@ export default {
     }
   }
 }
+.ad {
+  width: 100%;
+  height: 100vh;
+  object-fit: cover;
+}
 </style>