Просмотр исходного кода

fix(home): 优化首页配置与轮播展示稳定性

- 防止无 init 页面加载全局混入时报错

- 调整秒杀和团购状态徽标布局,避免窄宽下挤压换行

- 移除预览页提示条并为商城首页轮播补充圆点指示器
shizhongqi 1 неделя назад
Родитель
Сommit
22430ffcea

+ 9 - 1
hdApp/src/admin/homePageConfig/groupBuy.vue

@@ -396,8 +396,11 @@ export default {
   background: #fff;
 }
 
+// 覆盖全局 .tui-operate 的 width: calc(100% - 210upx),避免挤占左侧标题+状态徽标宽度
 .switch-wrap {
   @include disFlex(center, flex-end);
+  width: auto !important;
+  flex-shrink: 0;
 }
 
 .switch-item {
@@ -418,16 +421,21 @@ export default {
   transform-origin: center right;
 }
 
+// 标题与状态徽标横排,整体不随右侧 switch 被压缩
 .switch-title-row {
   @include disFlex(center, flex-start);
+  flex-shrink: 0;
 }
 
+// 状态徽标:文案单行水平排列(如「进行中」),窄宽下不逐字换行成竖排
 .status-badge {
-  margin-left: 16upx;
+  margin: 0 26upx;
   padding: 4upx 14upx;
   font-size: 22upx;
   border-radius: 20upx;
   line-height: 1.4;
+  white-space: nowrap;
+  flex-shrink: 0;
 }
 
 .status-0 {

+ 0 - 7
hdApp/src/admin/homePageConfig/preview.vue

@@ -7,7 +7,6 @@
   <view class="pv-page">
     <view v-if="loading" class="pv-loading">加载中...</view>
     <block v-else>
-      <view class="pv-tip-bar">以下为门店首页最终展示效果(预览,不支持下单等操作)</view>
       <block v-for="mod in modules" :key="mod.key">
         <template v-if="mod.enabled == 1">
           <preview-top-nav v-if="mod.key === 'topNav'" :data="pageData.topNav" />
@@ -93,12 +92,6 @@ export default {
   font-size: 26upx;
   color: $fontColor3;
 }
-.pv-tip-bar {
-  padding: 12upx 24upx;
-  font-size: 22upx;
-  color: #fff;
-  background: #FF6B88;
-}
 .pv-bottom-space {
   height: 40upx;
 }

+ 9 - 0
hdApp/src/admin/homePageConfig/seckill.vue

@@ -396,8 +396,12 @@ export default {
   background: #fff;
 }
 
+// 覆盖全局 .tui-operate 的 width: calc(100% - 210upx),避免挤占左侧标题+状态徽标宽度
 .switch-wrap {
   @include disFlex(center, flex-end);
+  width: auto !important;
+  flex-shrink: 0;
+  margin-left: 24upx;
 }
 
 .switch-item {
@@ -415,16 +419,21 @@ export default {
   transform-origin: center right;
 }
 
+// 标题与状态徽标横排,整体不随右侧 switch 被压缩
 .switch-title-row {
   @include disFlex(center, flex-start);
+  flex-shrink: 0;
 }
 
+// 状态徽标:文案单行水平排列(如「进行中」),窄宽下不逐字换行成竖排
 .status-badge {
   margin-left: 16upx;
   padding: 4upx 14upx;
   font-size: 22upx;
   border-radius: 20upx;
   line-height: 1.4;
+  white-space: nowrap;
+  flex-shrink: 0;
 }
 
 .status-0 {

+ 6 - 6
hdApp/src/mixins/globalMixins.js

@@ -56,11 +56,11 @@ export default {
 							this.setUserShopAll()
 						}
 						
-						this.init()
-						
+						// 页面定义了 init 才调用,避免混入页无此方法时报错
+						typeof this.init === 'function' && this.init()
 					})
 				} else if (shareGuestRoute) {
-					this.init()
+					typeof this.init === 'function' && this.init()
 				}
 			}else{
 				hasTokenAutoLogin().then(subRes=>{
@@ -77,7 +77,7 @@ export default {
 					that.$store.commit('setLoginInfo', { ...subRes.data.admin, ...subRes.data })
 					that.setUserShopAll()
 
-					that.init()
+					typeof that.init === 'function' && that.init()
 				  }
 				})
 			}
@@ -100,13 +100,13 @@ export default {
 						that.$store.commit('setLoginInfo', { ...subRes.data.admin, ...subRes.data })
 						that.setUserShopAll()
 						that.$util.afterAppLoginSuccess({ auto: 1 })
-						that.init()
+						typeof that.init === 'function' && that.init()
 					}
 				})
 			}
 			// #endif
 		}else{
-			this.init()
+			typeof this.init === 'function' && this.init()
 		}
 	},
 	methods: {

+ 4 - 0
mallApp/src/components/home/bannerSwiper.vue

@@ -5,12 +5,16 @@
 -->
 <template>
   <view v-if="data && data.enabled == 1 && data.list && data.list.length" class="home-banner-wrap">
+    <!-- 底部圆点指示器:高亮色与首页统一粉红(同加购按钮 #FF4D6D) -->
     <swiper
       class="home-swiper"
       circular
       :autoplay="true"
       :interval="(data.interval || 3) * 1000"
       duration="500"
+      indicator-dots
+      indicator-color="rgba(255, 255, 255, 0.55)"
+      indicator-active-color="#FF4D6D"
     >
       <swiper-item v-for="(item, index) in data.list" :key="index">
         <!-- 点击事件绑在 image 上:swiper-item 不支持 tap,且与 key 拼接会导致小程序 data-event-opts 编译异常 -->