21

honey_box/components/float-ball/FloatBall.vue

@@ -2,7 +2,7 @@
   <view>
     <!-- 悬浮球 -->
     <template v-if="floatBall">
-      <view v-for="(item, index) in floatBall" :style="[getBallStyle(item)]" :key="index" class="group-fixed1"
+      <view v-for="(item, index) in displayFloatBalls" :style="[getBallStyle(item)]" :key="index" class="group-fixed1"
         @click="BallClick(item)">
         <image :src="item.image"></image>
       </view>
@@ -28,6 +28,13 @@
 <script>
 export default {
   name: 'FloatBall',
+  props: {
+    // 是否显示优惠券悬浮球
+    showCouponBall: {
+      type: Boolean,
+      default: true
+    }
+  },
   data() {
     return {
       floatBall: [],
@@ -35,6 +42,17 @@ export default {
     }
   },
   computed: {
+    // 过滤后的悬浮球列表（根据showCouponBall控制优惠券悬浮球显示）
+    displayFloatBalls() {
+      if (!this.floatBall) return [];
+      return this.floatBall.filter(item => {
+        // 如果是优惠券悬浮球，根据showCouponBall决定是否显示
+        if (item.link_url && item.link_url.toLowerCase().includes('coupon')) {
+          return this.showCouponBall;
+        }
+        return true;
+      });
+    },
     getBallStyle() {
       return (item) => {
         let s = {
@@ -76,6 +94,12 @@ export default {
   },
   methods: {
     BallClick(item) {
+      // 优惠券悬浮球特殊处理 - 触发自定义事件
+      if (item.link_url && item.link_url.toLowerCase().includes('coupon')) {
+        this.$emit('coupon-click', item);
+        return;
+      }
+      
       if (item.type == 2) {
         this.$c.nav(item.link_url);
         return;
@@ -89,6 +113,8 @@ export default {
       const { status, data, msg } = await this.$request.get("getFloatBall");
       if (status == 1) {
         this.floatBall = data;
+        // 通知父组件悬浮球数据已加载
+        this.$emit('loaded', data);
       }
     }
   },

honey_box/pages/shouye/index.vue

@@ -5,15 +5,6 @@
 -->
 <template>
 	<view class="content">
-		<!-- 待领取优惠券悬浮球 - Requirements 1.1.0 三 -->
-		<view 
-			v-if="pendingCouponCount > 0" 
-			class="coupon-float-ball" 
-			@tap="onPendingCouponClick"
-		>
-			<image :src="couponFloatBallImage || 'https://youdas-1308826010.cos.ap-shanghai.myqcloud.com/static/web/static/common/quan.png'" class="coupon-ball-icon" mode="aspectFit"></image>
-		</view>
-		
 		<view class="navLeft align-center" :style="{ top: statusBarHeight + 'px' }" @tap="jumapSlots()">
 			<view class="flex column" style="width: 100%">
 				<view class="title1 row" style="height: 64rpx; margin-top: 5rpx;">
@@ -135,7 +126,7 @@
 		</uni-popup>
 		<rule-pop ref="rulePop"></rule-pop>
 		<rule-pop ref="appNotice" notice-check></rule-pop>
-		<float-ball v-if="!$config.GetVersion()"></float-ball>
+		<float-ball v-if="!$config.GetVersion()" :show-coupon-ball="pendingCouponCount > 0" @coupon-click="onCouponFloatBallClick"></float-ball>
 
 		<!-- #ifdef MP -->
 		<!-- 隐私政策弹窗 -->
@@ -158,8 +149,7 @@
 	import PrizeDetailPopup from "@/components/prize-detail-popup/prize-detail-popup.vue";
 	import {
 		getAdvert,
-		getDanYe,
+		getDanYe
-		getFloatBall
 	} from "@/common/server/config";
 	import {
 		getGoodsList
@@ -210,7 +200,6 @@
 				couponData: "",
 				canGetCoupon: false,
 				pendingCouponCount: 0, // 待领取优惠券数量
-				couponFloatBallImage: "", // 优惠券悬浮球图片地址
 				swCur: 0,
 				statusBarHeight
 			};
@@ -244,7 +233,6 @@
 			this.aa = true;
 			this.getCoupon();
 			this.fetchPendingCouponCount(); // 获取待领取优惠券数量
-			this.fetchCouponFloatBall(); // 获取优惠券悬浮球配置
 			if (!this.isLoading) {
 				this.getnews();
 			}
@@ -289,33 +277,14 @@
 			},
 			
 			/**
-			 * @description: 点击待领取优惠券入口
+			 * @description: 点击优惠券悬浮球（来自FloatBall组件）
 			 * Requirements: 1.1.0 - 三、待领取优惠券固定入口
 			 */
-			onPendingCouponClick() {
+			onCouponFloatBallClick(item) {
 				// 打开优惠券弹窗
 				this.getCoupon();
 			},
 			
-			/**
-			 * @description: 获取优惠券悬浮球配置
-			 * Requirements: 1.1.0 - 三、待领取优惠券固定入口
-			 */
-			async fetchCouponFloatBall() {
-				try {
-					const floatBalls = await getFloatBall();
-					// 查找link_url包含coupon的悬浮球配置
-					const couponBall = floatBalls.find(ball => 
-						ball.link_url && ball.link_url.toLowerCase().includes('coupon')
-					);
-					if (couponBall && couponBall.image) {
-						this.couponFloatBallImage = couponBall.image;
-					}
-				} catch (error) {
-					console.log('获取优惠券悬浮球配置失败', error);
-				}
-			},
-			
 			/**
 			 * @description: 获取中奖公告列表
 			 * @return {*}
@@ -509,25 +478,6 @@
 </script>
 
 <style lang="scss">
-	/* 待领取优惠券悬浮球样式 - Requirements 1.1.0 三 */
-	.coupon-float-ball {
-		position: fixed;
-		right: 0;
-		top: 50%;
-		transform: translateY(-50%);
-		z-index: 999;
-		width: 80rpx;
-		height: 80rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		
-		.coupon-ball-icon {
-			width: 80rpx;
-			height: 80rpx;
-		}
-	}
-	
 	.title1 {
 		width: 100%;
 		display: flex;