Fix(千县名品):[#2251]攻略专题页需要重新调整

pkg_product/views/famousQianxianTheme.vue

@@ -9,12 +9,16 @@
       color='#ffffff'
     />
     <view v-if="isLoad" class="v12-font-0">
-      <image
+      <view
-        :src="templateProperties.page1Image"
+        v-for="(groupItem, groupIndex) in groupList"
-        class="top-img"
+        :key="groupIndex"
-        mode="widthFix"
+        class="page-wrap"
-      />
+      >
-      <view class="page-wrap">
+        <image
+          :src="groupItem.topImage"
+          class="top-img"
+          mode="widthFix"
+        />
         <view class="page-2">
           <swiper
             class="swiper"
@@ -23,52 +27,7 @@
             :interval="5000"
           >
             <swiper-item
-              v-for="(swiperItem, swiperIndex) in templateProperties.page2Images"
+              v-for="(swiperItem, swiperIndex) in groupItem.images"
-              :key="swiperIndex"
-            >
-              <image
-                :src="swiperItem"
-                mode="scaleToFill"
-                class="swiper-img"
-              />
-            </swiper-item>
-          </swiper>
-        </view>
-      </view>
-      <!-- 第三页 -->
-      <view class="page-wrap">
-        <view class="page-5">
-          <image
-            v-for="(item, index) in templateProperties.page3Links"
-            :key="index"
-            :src="item.image"
-            class="shop-img"
-            mode="widthFix"
-            @click="linkToShop(item)"
-          />
-        </view>
-      </view>
-      <!-- 第四页 -->
-      <view class="page-wrap">
-        <view class="page-4">
-          <image
-            :src="templateProperties.page4Image"
-            class="section-bg"
-            mode="widthFix"
-          />
-        </view>
-      </view>
-      <!-- 第五页 -->
-      <view class="page-wrap">
-        <view class="page-2">
-          <swiper
-            class="swiper"
-            circular
-            autoplay
-            :interval="5000"
-          >
-            <swiper-item
-              v-for="(swiperItem, swiperIndex) in templateProperties.page5Images"
               :key="swiperIndex"
             >
               <image
@@ -81,7 +40,7 @@
         </view>
         <view class="page-5">
           <image
-            v-for="(item, index) in templateProperties.page5Links"
+            v-for="(item, index) in groupItem.links"
             :key="index"
             :src="item.image"
             class="shop-img"
@@ -106,14 +65,7 @@ export default {
     return {
       isLoad: false,
       pageKeyId: '',
-      templateProperties: {
+      groupList: []
-        page1Image: '',
-        page2Images: [],
-        page3Links: [],
-        page4Image: '',
-        page5Images: '',
-        page5Links: []
-      }
     }
   },
   onLoad(options) {
@@ -128,7 +80,7 @@ export default {
         const { success, data } = res
         if (success) {
           this.isLoad = true
-          this.templateProperties = data || {}
+          this.groupList = data.group || []
         }
       })
     },
@@ -151,32 +103,19 @@ export default {
 .page-wrap {
   position: relative;
   font-size: 0;
-  .page-2 {
+  .swiper {
     width: 100%;
     height: 450rpx;
-    .swiper {
+    .swiper-img {
+      display: block;
       width: 100%;
       height: 100%;
-      .swiper-img {
-        display: block;
-        width: 100%;
-        height: 100%;
-      }
     }
   }
-  .page-4 {
+  .shop-img {
-    .section-bg {
+    display: block;
-      display: block;
+    width: 100%;
-      width: 100%;
+    height: 300rpx;
-      height: auto;
-    }
-  }
-  .page-5 {
-    .shop-img {
-      display: block;
-      width: 100%;
-      height: 300rpx;
-    }
   }
 }
 </style>