Browse Source

fix(home): 统一首页导航渐变展示

- 统一 mallApp 首页自定义导航栏与 topNav 的粉色衔接效果

- 对齐 hdApp 首页预览导航背景和页面标题栏颜色

- 补充红包满减门槛文案单位
shizhongqi 1 day ago
parent
commit
f7c46942d7

+ 2 - 9
hdApp/src/admin/homePageConfig/preview.vue

@@ -69,16 +69,9 @@ export default {
       const topNav = this.pageData && this.pageData.topNav
       return (topNav && topNav.merchantName) || ''
     },
-    /** topNav 模块是否启用(未加载完成时默认按启用处理,避免闪白) */
-    hasTopNavEnabled() {
-      if (!this.pageData) return true
-      const mod = this.modules.find((item) => item.key === 'topNav')
-      const topNav = this.pageData.topNav
-      return !!(mod && mod.enabled == 1 && topNav && topNav.enabled == 1)
-    },
-    /** 与真实首页 topNavBgColor 一致;未启用 topNav 时回落页面底色 */
+    /** 与真实首页一致:自下而上 #FCE4EC → #FFB8C9 */
     topNavBgColor() {
-      return this.hasTopNavEnabled ? '#FFE0E6' : '#f5f5f5'
+      return 'linear-gradient(to top, #FCE4EC 0%, #FFB8C9 100%)'
     },
     showService() {
       const topNav = this.pageData && this.pageData.topNav

+ 2 - 5
hdApp/src/admin/homePageConfig/previewParts/shopHeaderBar.vue

@@ -18,13 +18,10 @@ export default {
       type: String,
       default: ''
     },
-    /**
-     * 导航栏背景色:与真实首页 topNavBgColor 一致
-     * topNav 启用时用粉色,未启用时回落页面灰底
-     */
+    /** 导航栏背景:与真实首页一致,自下而上 #FCE4EC → #FFB8C9 */
     bgColor: {
       type: String,
-      default: '#FFE0E6'
+      default: 'linear-gradient(to top, #FCE4EC 0%, #FFB8C9 100%)'
     }
   }
 }

+ 2 - 1
hdApp/src/admin/homePageConfig/previewParts/topNav.vue

@@ -38,7 +38,8 @@ export default {
 <style lang="scss" scoped>
 .pv-top-nav {
   padding: 16upx 24upx 20upx;
-  background: linear-gradient(180deg, #FFE0E6 0%, #FFF3F5 100%);
+  /* 与 mallApp topNav 一致:衔接自定义导航栏渐变底部 */
+  background: #FCE4EC;
 }
 .pv-search-row {
   display: flex;

+ 1 - 1
hdApp/src/pages.json

@@ -398,7 +398,7 @@
 				{ "path": "hot", "style": { "navigationBarTitleText": "热门推荐" } },
 				{ "path": "new", "style": { "navigationBarTitleText": "今日上新" } },
 				{ "path": "pullGoods", "style": { "navigationBarTitleText": "下拉商品" } },
-				{ "path": "preview", "style": { "navigationBarTitleText": "首页预览", "navigationBarBackgroundColor": "#FF6B88", "navigationBarTextStyle": "white" } }
+				{ "path": "preview", "style": { "navigationBarTitleText": "首页预览", "navigationBarBackgroundColor": "#FFB8C9", "navigationBarTextStyle": "white" } }
 			]
 		},
 		{

+ 4 - 2
mallApp/src/components/home/customNavBar.vue

@@ -28,10 +28,10 @@ export default {
       type: String,
       default: ''
     },
-    /** 导航栏背景色,需与 topNav 顶部渐变色一致 */
+    /** 导航栏背景:自下而上 #FCE4EC → #FFB8C9,底部与 home-top-nav 衔接 */
     bgColor: {
       type: String,
-      default: '#FFE0E6'
+      default: 'linear-gradient(to top, #FCE4EC 0%, #FFB8C9 100%)'
     }
   },
   data() {
@@ -76,6 +76,8 @@ export default {
 .home-custom-nav {
   width: 100%;
   flex-shrink: 0;
+  /* 自下而上:浅粉 → 更深粉;inline bgColor 可覆盖 */
+  background: linear-gradient(to top, #FCE4EC 0%, #FFB8C9 100%);
 }
 .home-custom-nav__status {
   width: 100%;

+ 2 - 1
mallApp/src/components/home/topNav.vue

@@ -55,7 +55,8 @@ export default {
 <style lang="scss" scoped>
 .home-top-nav {
   padding: 16upx 24upx 20upx;
-  background: linear-gradient(180deg, #FFE0E6 0%, #FFF3F5 100%);
+  /* 与上方 customNavBar 渐变底部 #FCE4EC 衔接 */
+  background: #FCE4EC;
 }
 .search-row {
   display: flex;

+ 1 - 1
mallApp/src/pages/hb/list.vue

@@ -26,7 +26,7 @@
 									<span class="price">{{ item.amount?parseFloat(item.amount):0 }}</span>
 								</view>
 								<view v-if="item.minConsume == 0" class="full-reduc app-size-28">无门槛</view>
-								<view v-else class="full-reduc app-size-28">满{{ item.minConsume?parseFloat(item.minConsume):0 }}可用</view>
+								<view v-else class="full-reduc app-size-28">满{{ item.minConsume?parseFloat(item.minConsume):0 }}可用</view>
 							</view>
 							<view class="list-det-right">
 								<view class="coupon-message">

+ 5 - 9
mallApp/src/pages/home/index.vue

@@ -172,16 +172,12 @@ export default {
       }
       return ''
     },
-    /** topNav 模块是否启用(未加载完成时默认按启用处理,避免闪白) */
-    hasTopNavEnabled() {
-      if (!this.pageData) return true
-      const mod = this.modules.find((item) => item.key === 'topNav')
-      const topNav = this.pageData.topNav
-      return !!(mod && mod.enabled == 1 && topNav && topNav.enabled == 1)
-    },
-    /** 与 home-top-nav 渐变顶色一致;未启用 topNav 时回落页面底色 */
+    /**
+     * 自定义导航栏背景:自下而上由浅粉渐变到更深粉
+     * 底部 #FCE4EC 与 home-top-nav 衔接
+     */
     topNavBgColor() {
-      return this.hasTopNavEnabled ? '#FFE0E6' : '#f5f5f5'
+      return 'linear-gradient(to top, #FCE4EC 0%, #FFB8C9 100%)'
     },
     account() {
       return (this.option && this.option.account) || uni.getStorageSync('account') || ''