From 78baa1ea47822244e1fe7962032b89370d8f544a Mon Sep 17 00:00:00 2001
From: lifizer <913626195@qq.com>
Date: Tue, 26 Mar 2024 22:36:13 +0800
Subject: [PATCH] =?UTF-8?q?Fix(=E8=8A=82=E6=97=A5=E4=B8=93=E9=A2=98):[#100?=
 =?UTF-8?q?6,=20#1007]1=E3=80=81=E7=BC=BA=E5=B0=91=E8=BF=94=E5=9B=9E?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=EF=BC=9B2=E3=80=81=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E5=B7=A6=E5=8F=B3=E6=BB=91=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pkg_product/views/festival.vue | 83 ++++++++++++++++++++++++----------
 1 file changed, 60 insertions(+), 23 deletions(-)

diff --git a/pkg_product/views/festival.vue b/pkg_product/views/festival.vue
index 08502f5..b1878ac 100644
--- a/pkg_product/views/festival.vue
+++ b/pkg_product/views/festival.vue
@@ -1,39 +1,74 @@
+<template>
+  <view class="pkg-product-festival">
+    <hx-navbar
+      :fixed="true"
+      :background-color="[[13,197,197],[13,197,197]]"
+      statusBarFontColor="#ffffff"
+      barPlaceholder="hidden"
+      transparent="auto"
+      color='#ffffff'
+    />
+    <view v-if="isLoad">
+      <image
+        v-if="topImage"
+        :src="topImage"
+        class="top-img"
+        mode="widthFix"
+      />
+      <view
+        v-for="(content,cIndex) in contents"
+        :key="cIndex"
+        class="section"
+      >
+        <image
+          :src="content.backgroundImage"
+          class="section-bg"
+          mode="widthFix"
+        />
+        <view
+          :class="cIndex === 0 ? 'section12' : 'section8'"
+          class="list flex flex-wrap"
+        >
+          <image
+            v-for="(item,index) in content.products"
+            :key="index"
+            :class="cIndex === 0 ? 'span12' : 'span8'"
+            :src="item.image"
+            mode="scaleToFill"
+            @click="$global.navToGoods(item.id)"
+          />
+        </view>
+      </view>
+    </view>
+    <goo-skeleton v-else />
+  </view>
+</template>
 <script>
-import {getFestival} from "@/api/product";
-
+// 节日专题
+import { getFestival } from '@/api/product'
+import GooSkeleton from '@/components/GooSkeleton/index.vue'
 export default {
-  name: "festival", // 节日专题
+  name: 'Festival',
+  components: {
+    GooSkeleton
+  },
   data() {
     return {
-      webUrl: this.$VUE_APP_RESOURCES_URL,
+      isLoad: false,
       topImage: '',
       contents: []
     }
   },
   onLoad() {
     getFestival().then(({data}) => {
-      this.topImage = data.topImage;
-      this.contents = data.contents;
+      this.isLoad = true
+      this.topImage = data.topImage
+      this.contents = data.contents
     })
   }
 }
 </script>
 
-<template>
-  <view class="pkg-product-festival">
-    <image class="top-img" mode="widthFix" :src="topImage" v-if="topImage"/>
-
-    <view class="section" v-for="(content,cIndex) in contents" :key="cIndex">
-      <image class="section-bg" :src="content.backgroundImage" mode="widthFix"/>
-
-      <view class="list flex flex-wrap" :class="cIndex===0?'section12':'section8'">
-        <image :class="cIndex===0?'span12':'span8'" mode="scaleToFill" :src="item.image"
-               v-for="(item,index) in content.products" :key="index" @click="$global.navToGoods(item.id)"/>
-      </view>
-    </view>
-  </view>
-</template>
-
 <style scoped lang="less">
 .pkg-product-festival {
   image {
@@ -70,12 +105,14 @@ export default {
       top: 350rpx;
       left: 0;
       width: 100vw;
+      justify-content: space-between;
+      box-sizing: border-box;
     }
 
     .span12 {
       width: 332rpx;
       height: 520rpx;
-      margin: 0 22rpx 24rpx 0;
+      margin: 0 0 24rpx 0;
     }
 
     .span12:nth-child(2n) {
@@ -85,7 +122,7 @@ export default {
     .span8 {
       width: 234rpx;
       height: 384rpx;
-      margin: 0 8rpx 24rpx 0;
+      margin: 0 0 24rpx 0;
     }
 
     .span8:nth-child(3n) {