feat: 新增购买页广告位

apps/mobile/src/components/ad/Swipe.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="my-swipe">
+  <div class="my-swipe" v-show='canShowModule'>
     <van-skeleton avatar :loading="this.getImages.length === 0">
       <van-swipe
         :id="'ad-' + (ad || 'swipe')"
@@ -59,6 +59,10 @@ export default {
    * @property {array} images 广告位数据数组
    */
   props: {
+    skeleton: {
+      type: Boolean,
+      default: true
+    },
     exposurePrefix: {
       type: String,
       default: ''
@@ -94,6 +98,13 @@ export default {
     },
     getImages() {
       return this.ad ? this.list : this.images
+    },
+    canShowModule () {
+      if (this.skeleton) {
+        return true
+      } else {
+        return this.getImages.length > 0
+      }
     }
   },
   created() {
@@ -112,7 +123,10 @@ export default {
       })
         .then((res) => {
           if (res?.error_code === 0 && typeof res?.data === 'object') {
-            this.list = Object.values(res.data).flat().map(adConfigFormatter)
+            const temp = Object.values(res.data).flat().filter(v => v)
+            if (Array.isArray(temp)) {
+              this.list = temp.map(adConfigFormatter)
+            }
           }
         })
         .catch((e) => {

apps/mobile/src/router/modules/order.js

@@ -29,6 +29,8 @@ export default [
         components: createRouterNamedComponents({
           default: () =>
             import('@/views/create-order/components/vipsubscribe/Default'),
+          headerAdsense: () =>
+            import('@/views/create-order/components/vipsubscribe/HeaderAdsense'),
           adsense: () =>
             import('@/views/create-order/components/vipsubscribe/Adsense'),
           desc: () =>
@@ -111,7 +113,9 @@ export default [
         components: createRouterNamedComponents({
           default: () =>
             import('@/views/create-order/components/bigmember/Default'),
-          desc: () => import('@/views/order/components/bigmember/Introduction')
+          desc: () => import('@/views/order/components/bigmember/Introduction'),
+          headerAdsense: () =>
+            import('@/views/create-order/components/bigmember/HeaderAdsense'),
         })
       },
       {
@@ -153,7 +157,9 @@ export default [
         components: createRouterNamedComponents({
           default: () =>
             import('@/views/create-order/components/datapack/Default'),
-          desc: () => import('@/views/order/components/datapack/Introduction')
+          desc: () => import('@/views/order/components/datapack/Introduction'),
+          headerAdsense: () =>
+            import('@/views/create-order/components/datapack/HeaderAdsense'),
         })
       },
       {

apps/mobile/src/views/create-order/CreateOrderLayout.vue

@@ -8,6 +8,7 @@
       />
     </div>
     <div class="j-main create-order-content" @scroll="onScroll">
+      <router-view name="headerAdsense" class="create-order-adsense" />
       <router-view name="default" class="create-order-default" />
       <router-view
         v-if="pageLayout.activity"

apps/mobile/src/views/create-order/components/bigmember/HeaderAdsense.vue

@@ -0,0 +1,29 @@
+<template>
+  <div class='header-show-group'>
+    <!-- 轮播广告位 -->
+    <Swipe :skeleton='false' :exposure-prefix="'移动端购买页轮播广告位-' + getContentAdID + '-'"  :ad="getContentAdID" />
+  </div>
+</template>
+<script>
+import Swipe from '@/components/ad/Swipe'
+export default {
+  name: 'HeaderAdsense',
+  components: {
+    Swipe
+  },
+  computed: {
+    getContentAdID() {
+      return `equity_mobile_bigmember_top_code`
+    }
+  }
+}
+</script>
+<style lang="scss">
+.header-show-group {
+  background-color: #fff;
+
+  .my-swipe {
+    margin: 4px 0;
+  }
+}
+</style>

apps/mobile/src/views/create-order/components/datapack/HeaderAdsense.vue

@@ -0,0 +1,29 @@
+<template>
+  <div class='header-show-group'>
+    <!-- 轮播广告位 -->
+    <Swipe :skeleton='false' :exposure-prefix="'移动端购买页轮播广告位-' + getContentAdID + '-'"  :ad="getContentAdID" />
+  </div>
+</template>
+<script>
+import Swipe from '@/components/ad/Swipe'
+export default {
+  name: 'HeaderAdsense',
+  components: {
+    Swipe
+  },
+  computed: {
+    getContentAdID() {
+      return `equity_mobile_datapack_top_code`
+    }
+  }
+}
+</script>
+<style lang="scss">
+.header-show-group {
+  background-color: #fff;
+
+  .my-swipe {
+    margin: 4px 0;
+  }
+}
+</style>

apps/mobile/src/views/create-order/components/vipsubscribe/HeaderAdsense.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class='header-show-group'>
+    <!-- 轮播广告位 -->
+    <Swipe :skeleton='false' :exposure-prefix="'移动端购买页轮播广告位-' + getContentAdID + '-'"  :ad="getContentAdID" />
+  </div>
+</template>
+<script>
+import Swipe from '@/components/ad/Swipe'
+export default {
+  name: 'HeaderAdsense',
+  components: {
+    Swipe
+  },
+  computed: {
+    getContentAdID() {
+      return `equity_mobile_vip_top_${this.type}_code`
+    }
+  },
+  data() {
+    return {
+      type: 'buy'
+    }
+  },
+  created() {
+    this.getQuery()
+  },
+  methods: {
+    getQuery() {
+      this.type = this.$route.query.type || 'buy'
+    }
+  }
+}
+</script>
+<style lang="scss">
+.header-show-group {
+  background-color: #fff;
+
+  .my-swipe {
+    margin: 4px 0;
+  }
+}
+</style>