浏览代码

feat:修改bug

wangsisi 3 周之前
父节点
当前提交
10a36dd33c

+ 42 - 54
components/danmakuManager/danmakuManager.vue

@@ -9,8 +9,8 @@
 				:style="getDanmakuStyle(item)"
 			>
 				<view class="danmaku-content">
-					<image class="danmaku-avatar" :src="item.avatar || defaultAvatar" mode="aspectFill"></image>
-					<view class="danmaku-text">{{ item.text }}</view>
+					<image class="danmaku-avatar" :src="item.icon || defaultAvatar" mode="aspectFill"></image>
+					<view class="danmaku-text">{{ item.msg }}</view>
 				</view>
 			</view>
 		</view>
@@ -54,6 +54,11 @@ const animationTimer = ref(null)
 const danmakuIdCounter = ref(0)
 const trackOccupancy = ref(new Array(props.trackCount).fill(0)) // 记录每个轨道的占用情况
 
+// 监听trackCount变化,重新初始化trackOccupancy
+watch(() => props.trackCount, (newCount) => {
+	trackOccupancy.value = new Array(newCount).fill(0)
+})
+
 const trackHeight = computed(() => props.height / props.trackCount)
 
 // 默认头像
@@ -101,17 +106,14 @@ const calculateDanmakuHeight = () => {
 const calculateTrackSpacing = () => {
 	const danmakuHeight = calculateDanmakuHeight()
 	const trackHeight = props.height / props.trackCount
-	// 对于低高度容器,增加轨道间距避免叠
-	const minSpacing = props.height < 150 ? danmakuHeight + 20 : danmakuHeight + 10
+	// 增加轨道间距避免弹幕重
+	const minSpacing = danmakuHeight + 30 // 增加间距到30px
 	return Math.max(minSpacing, trackHeight) // 确保轨道间距足够
 }
 
 // 查找可用轨道
 const findAvailableTrack = () => {
-	const screenWidth = uni.getSystemInfoSync().screenWidth || 375
 	const currentTime = Date.now()
-	const danmakuHeight = calculateDanmakuHeight()
-	const trackSpacing = calculateTrackSpacing()
 	
 	// 清理过期的轨道占用记录
 	for (let i = 0; i < trackOccupancy.value.length; i++) {
@@ -120,45 +122,18 @@ const findAvailableTrack = () => {
 		}
 	}
 	
-	// 计算可用的轨道数量,确保弹幕不会超出容器边界
-	const maxTracks = Math.floor((props.height - danmakuHeight) / trackSpacing) + 1
-	const availableTracks = Math.min(props.trackCount, maxTracks)
+	// 简化轨道分配:使用较少的轨道数量
+	const finalTracks = Math.min(3, props.trackCount)
 	
-	// 对于低高度容器,减少可用轨道数量避免叠加
-	const finalTracks = props.height < 150 ? Math.min(availableTracks, 3) : availableTracks
-	
-	// 首先尝试寻找完全空闲的轨道
-	for (let i = 0; i < finalTracks; i++) {
-		if (trackOccupancy.value[i] === 0) {
-			// 检查相邻轨道是否被占用
-			const prevTrack = i > 0 ? trackOccupancy.value[i - 1] : 0
-			const nextTrack = i < finalTracks - 1 ? trackOccupancy.value[i + 1] : 0
-			
-			// 优先选择完全空闲的轨道
-			if (prevTrack === 0 && nextTrack === 0) {
-				return i
-			}
-		}
-	}
-	
-	// 如果没有完全空闲的轨道,寻找任何空闲轨道
+	// 直接寻找空闲轨道
 	for (let i = 0; i < finalTracks; i++) {
 		if (trackOccupancy.value[i] === 0) {
 			return i
 		}
 	}
 	
-	// 如果所有轨道都被占用,选择最早释放的轨道
-	let earliestTrack = 0
-	let earliestTime = trackOccupancy.value[0]
-	for (let i = 1; i < finalTracks; i++) {
-		if (trackOccupancy.value[i] < earliestTime) {
-			earliestTime = trackOccupancy.value[i]
-			earliestTrack = i
-		}
-	}
-	
-	return earliestTrack
+	// 如果所有轨道都被占用,选择第一个轨道
+	return 0
 }
 
 const createDanmaku = (text, avatar = null) => {
@@ -170,16 +145,15 @@ const createDanmaku = (text, avatar = null) => {
 	const screenWidth = uni.getSystemInfoSync().screenWidth || 375
 	const left = screenWidth + props.spacing
 	
-	// 计算弹幕持续时间并记录轨道占用,增加缓冲时间
-	const extraDistance = 200
-	const duration = (screenWidth + width + extraDistance) / props.speed
-	const endTime = Date.now() + duration * 1000
+	// 简化轨道占用时间计算
+	const duration = (screenWidth + width + 200) / props.speed
+	const endTime = Date.now() + duration * 1000 // 移除额外缓冲时间
 	trackOccupancy.value[track] = endTime
 	
 	return {
 		id,
-		text,
-		avatar,
+		msg: text, // 修改为msg字段,与模板保持一致
+		icon: avatar, // 修改为icon字段,与模板保持一致
 		track,
 		width,
 		left,
@@ -188,10 +162,13 @@ const createDanmaku = (text, avatar = null) => {
 	}
 }
 
-const addDanmaku = (text, avatar = null) => {
-	const danmaku = createDanmaku(text, avatar)
+const addDanmaku = (msg, icon = null) => {
+	console.log('添加弹幕:', { msg, icon })
+	const danmaku = createDanmaku(msg, icon)	
+	console.log('创建的弹幕对象:', danmaku)
 	
 	visibleDanmakus.value.push(danmaku)
+	console.log('当前可见弹幕数量:', visibleDanmakus.value.length)
 	
 	setTimeout(() => {
 		danmaku.isScrolling = true
@@ -224,7 +201,11 @@ const clearDanmakus = () => {
 }
 
 const startDanmakuAnimation = () => {
-	if (props.danmakuList.length === 0) return
+	console.log('开始弹幕动画,数据列表:', props.danmakuList)
+	if (props.danmakuList.length === 0) {
+		console.log('弹幕列表为空,不启动动画')
+		return
+	}
 	
 	let currentIndex = 0
 	
@@ -238,15 +219,16 @@ const startDanmakuAnimation = () => {
 		}
 		
 		const danmaku = props.danmakuList[currentIndex]
-		addDanmaku(danmaku.text, danmaku.avatar)
+		console.log('播放弹幕:', danmaku)
+		
+		// 直接播放弹幕,不检查轨道占用
+		addDanmaku(danmaku.msg, danmaku.icon)
 		currentIndex++
 		
-		// 根据容器高度动态调整间隔时间,低高度容器需要更大的间隔避免叠加
-		const baseInterval = props.height < 150 ? 
-			Math.max(3000, props.height * 2) : // 低高度容器使用适中的基础间隔
-			Math.max(1500, props.height * 2)   // 正常高度容器
+		// 减少弹幕播放间隔
+		const baseInterval = Math.max(2000, props.height * 2) // 减少基础间隔
 		const minInterval = baseInterval
-		const maxInterval = baseInterval + (props.height < 150 ? 2000 : 2000)
+		const maxInterval = baseInterval + 2000 // 减少随机间隔范围
 		const interval = Math.random() * (maxInterval - minInterval) + minInterval
 		animationTimer.value = setTimeout(playNext, interval)
 	}
@@ -262,10 +244,14 @@ const stopDanmakuAnimation = () => {
 }
 
 watch(() => props.danmakuList, (newList) => {
+	console.log('弹幕数据变化:', newList)
 	if (newList.length > 0) {
+		console.log('弹幕数据不为空,重新启动动画')
 		stopDanmakuAnimation()
 		clearDanmakus()
 		startDanmakuAnimation()
+	} else {
+		console.log('弹幕数据为空')
 	}
 }, { deep: true })
 
@@ -371,3 +357,5 @@ defineExpose({
 	background: rgba(244, 246, 248, 0.6);
 }
 </style>
+
+

+ 39 - 33
pages/tabBar/tree/components/memberLevel.vue

@@ -6,8 +6,11 @@
 				<up-image class="avatar" :fade="false" :src="userInfo.tel?userLevel.icon:`${config.BASIC_IMG}img/treePage/defalut-logo.png`" width="96rpx" height="96rpx"
 					shape="circle"></up-image>
 				<view class="level-wrap">
-					<text class="name" v-if="userInfo.tel">V{{userLevel.id}} {{levelStr[userLevel.id]}}守护</text>
-					<text class="name" v-else>飞鸟守护</text>
+					<view class="level-name">
+						<text class="name-text" v-if="userInfo.tel">V{{userLevel.id}} {{levelStr[userLevel.id]}}守护</text>
+						<text class="name-text" v-else>飞鸟守护</text>
+						<slot name="add-btn"></slot>
+					</view>
 					<view class="progress-wrap">
 						<view class="progress-value">
 							<view class="total" :style="{ width: calcWidth(userLevel.energy,userLevel.energyMax+1) }"></view>
@@ -18,7 +21,7 @@
 					</view>
 					<view class="level-desc">
 						再累计能量 <text class="level-text">{{ userLevel.diffLevelEnergy }}分 </text>即可升级到
-						{{levelStr[Number(userLevel.id) + 1]}}等级
+						{{levelStr[Number(userLevel.id) + 1]}}等级
 					</view>
 				</view>
 			</view>
@@ -46,7 +49,7 @@
 </template>
 
 <script setup>
-	import TREE from '@/api/tree.js'
+	import TREE from '@/api/tree.js'
 	import config from "@/api/config.js"
 	import {
 		ref,
@@ -58,16 +61,16 @@
 			type: Object,
 			defalut: {},
 		},
-	});
-	
-	const userInfo = uni.getStorageSync('userInfo')
-	
-	function calcWidth(energy,energyMax){
-	    let total = (energy / energyMax) * 100
-	    if(total>100){
-	        total = 100
-	    }
-	    return total + '%'
+	});
+	
+	const userInfo = uni.getStorageSync('userInfo')
+	
+	function calcWidth(energy,energyMax){
+	    let total = (energy / energyMax) * 100
+	    if(total>100){
+	        total = 100
+	    }
+	    return total + '%'
 	}
 
 	const levelStr = {
@@ -84,7 +87,7 @@
 		(newValue) => {
 			userLevel.value = {
 				...newValue.buyList[0].level,
-				energy: newValue.buyList[0].energy,
+				energy: newValue.buyList[0].energy,
 				icon: newValue.buyList[0].icon
 			}
 		}
@@ -94,24 +97,24 @@
 <style lang="scss" scoped>
 	@import "@/static/style/mixin.scss";
 
-	.member-level {
-		position: relative;
-		&::before{
-			content: '';
-			position: absolute;
-			top: -20rpx;
-			width: 100%;
-			height: 474rpx;
-			background-image: linear-gradient(180deg,#008DFD,transparent);
+	.member-level {
+		position: relative;
+		&::before{
+			content: '';
+			position: absolute;
+			top: -20rpx;
+			width: 100%;
+			height: 474rpx;
+			background-image: linear-gradient(180deg,#008DFD,transparent);
 		}
 		.user-wrap {
 			display: flex;
 			border-radius: 70rpx 0 0 70rpx;
 			padding: 16rpx 20rpx;
 			margin: 0 0 10rpx 24rpx;
-			position: relative;
+			position: relative;
 			width: calc(100% - 24rpx);
-			box-sizing: border-box;
+			box-sizing: border-box;
 			backdrop-filter: blur(14rpx);
 			background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.4), transparent);
 
@@ -126,14 +129,17 @@
 
 				.level-wrap {
 					line-height: 32rpx;
-					width: 55%;
+					width: 55%;
 					margin-left: 20rpx;
-
-					.name {
-						color: #fff;
-						font-family: 'PangMenZhengDao';
+					.level-name{
+						display: flex;
+						.name-text {
+							color: #fff;
+							font-family: 'PangMenZhengDao';
+						}
 					}
 
+
 					.progress-wrap {
 						font-size: 20rpx;
 						color: rgba(0, 0, 0, 0.8);
@@ -186,8 +192,8 @@
 			align-items: center;
 			font-size: 28rpx;
 			font-weight: 500;
-			margin: auto;
-			position: relative;
+			margin: auto;
+			position: relative;
 			z-index: 2;
 
 			.info-text {

+ 4 - 5
pages/tabBar/tree/subPages/diary.vue

@@ -91,11 +91,10 @@
 		} else {
 			return config.BASE_IMG_URL + filename + resize;
 		}
-	};
-	
-	const editEnd = () =>{
-		uni.setStorageSync('isUpdateName','true')
-		getBySampleId()
+	};
+	
+	const editEnd = () =>{
+		getBySampleId()
 	}
 
 	const sampleId = ref('')

+ 29 - 11
pages/tabBar/tree/subPages/friendTree.vue

@@ -1,7 +1,11 @@
 <template>
 	<view class="base-template">
 		<view class="sub-base-container">
-			<member-level :treeData="treeData"></member-level>
+			<member-level :treeData="treeData">
+				<template #add-btn v-if="userName !== userInfo.name">
+					<view class="add-btn" @click="handleAddFriend">添加好友</view>
+				</template>
+			</member-level>
 			<view class="tree-cont">
 				<view class="tree-name">
 					<view>{{treeName}}</view>
@@ -17,7 +21,7 @@
 				</view>
 			</view>
 			<view class="tree-footer">
-				<view class="blessing" @click="handleBlessing">
+				<view class="blessing" @click="handleBlessing" v-if="userName !== userInfo.name">
 					<image class="icon" :src="`${config.BASIC_IMG}img/treePage/b-tree-icon-2.png`"></image>
 					<text>送ta祝福</text>
 				</view>
@@ -39,7 +43,6 @@
 	import TREE from '@/api/tree.js'
 	import {
 		ref,
-		reactive,
 	} from 'vue';
 
 	const userInfo = uni.getStorageSync('userInfo')
@@ -55,6 +58,10 @@
 		}
 	}
 
+	const handleAddFriend = () => {
+		console.log('添加好友')
+	}
+
 	const sampleId = ref('')
 	onLoad((options) => {
 		sampleId.value = options.sampleId
@@ -64,6 +71,7 @@
 	const treeData = ref({})
 	const treeName = ref('')
 	const farmBuyId = ref('')
+	const userName = ref('')
 	const getBySampleId = () => {
 		TREE.getBySampleId({
 			sampleId: sampleId.value
@@ -74,18 +82,19 @@
 			treeName.value = data.buyList[0].treeName || (data.buyList[0].nickname.length ? data.buyList[0]
 				.nickname.slice(0, 3) + "荔" : data.buyList[0].owner.slice(0, 3) + "荔")
 			farmBuyId.value = data.buyList[0].id
+			userName.value = data.buyList[0].owner
 		})
 	}
 
 	const showBlessingsPopup = ref(false)
-	const handleBlessing = () => {
-		if(treeData.value.buyList[0].level.clockinMap['3']){
-			uni.showToast({
-				title: '今日已送过祝福',
-				icon: 'none',
-				duration: 2000
-			});
-		}else{
+	const handleBlessing = () => {
+		if(treeData.value.buyList[0].level.clockinMap['3']){
+			uni.showToast({
+				title: '今日已送过祝福',
+				icon: 'none',
+				duration: 2000
+			});
+		}else{
 			showBlessingsPopup.value = !showBlessingsPopup.value
 		}
 	}
@@ -120,6 +129,15 @@
 		@include ossBg("tree-bg.png");
 		padding: 22rpx 0;
 
+		.add-btn{
+			margin-left: 14rpx;
+			font-size: 22rpx;
+			color: #fff;
+			border-radius: 40rpx;
+			padding: 2rpx 16rpx;
+			border: 2rpx solid #fff;
+		}
+
 		.tree-cont {
 			width: 100%;
 			margin-top: 10rpx;

+ 48 - 45
pages/tabBar/tree/tree.vue

@@ -127,7 +127,7 @@
 
 	const name = ref('荔枝')
 	const showPicker = ref(false)
-	const columns = ref([]);
+	const columns = ref([[{name:'荔枝',speciesId:'1'}]]);
 	const speciesId = ref('')
 	const handleShow = () => {
 		showPicker.value = true
@@ -197,20 +197,14 @@
 	
 	const userInfo = ref({})
 
-	onLoad(() => {
-		featchCategoryList()
-	})
+	// onLoad(() => {
+	// 	featchCategoryList()
+	// })
 	
 	onShow(()=>{
 		userInfo.value = uni.getStorageSync('userInfo')
-		const isUpdateName = uni.getStorageSync('isUpdateName')
-		if(isUpdateName === 'true'){
-			featchLightTree()
-			uni.setStorageSync('isUpdateName','false')
-		}
+		featchLightTree()
 		featchSessionStore()
-		// 页面显示时启动弹幕
-		startDanmaku()
 	})
 	
 	onHide(() => {
@@ -314,6 +308,8 @@
 			}
 			farmBuyId.value = data.buyList[0].id
 			featchSessionStore()
+			// 获取能量记录
+			// featchEnergyRecords()
 		})
 	}
 	
@@ -345,41 +341,44 @@
 	const showSuccess = ref(false)
 	const clockinType = ref('1')
 	
+
 	// 弹幕相关数据
-	const danmakuList = ref([
-		{
-			text: "晨曦微露,阳光洒满大地",
-			avatar: `${userInfo.value.icon}`
-		},
-		{
-			text: "守护果树,收获美好",
-			avatar: `${userInfo.value.icon}`
-		},
-		{
-			text: "今天也要给果树浇水哦",
-			avatar: `${userInfo.value.icon}`
-		},
-		{
-			text: "果树长得好快啊",
-			avatar: `${config.BASIC_IMG}img/treePage/drone-icon.png`
-		},
-		{
-			text: "期待果实成熟的那一天",
-			avatar: `${config.BASIC_IMG}img/treePage/drone-icon.png`
-		},
-		{
-			text: "和好友一起守护果树",
-			avatar: `${config.BASIC_IMG}img/treePage/drone-icon.png`
-		},
-		{
-			text: "每日签到,果树茁壮成长",
-			avatar: `${config.BASIC_IMG}img/treePage/drone-icon.png`
-		},
-		{
-			text: "分享给更多朋友",
-			avatar: `${config.BASIC_IMG}img/treePage/drone-icon.png`
-		}
-	])
+	const danmakuList = ref([])
+
+	const featchEnergyRecords = () => {
+		console.log('开始获取能量记录,farmBuyId:', farmBuyId.value)
+		TREE.getEnergyRecords({
+			page: 1,
+			limit: 9999,
+			onlyOther:1,
+			farmBuyId: farmBuyId.value
+		}).then(({
+			data
+		}) => {
+			console.log('接口返回的原始数据:', data)
+			
+			// 将接口返回的数据转换为弹幕组件期望的格式
+			const formattedData = (data || []).map(item => ({
+				msg: item.desc || item.text || item.content || '守护果树,收获美好', // 使用desc字段作为消息内容
+				icon: item.icon || `${config.BASIC_IMG}img/treePage/drone-icon.png` // 使用icon字段作为头像
+			}))
+			
+			console.log('格式化后的弹幕数据:', formattedData)
+			
+			danmakuList.value = formattedData
+			if(formattedData.length > 0){
+				console.log('有弹幕数据,准备启动弹幕')
+				// 页面显示时启动弹幕
+				setTimeout(() => {
+					startDanmaku()
+				}, 1000)
+			} else {
+				console.log('没有弹幕数据')
+			}
+		}).catch(error => {
+			console.error('获取能量记录失败:', error)
+		})
+	}
 	
 	// 弹幕组件引用
 	const danmakuRef = ref(null)
@@ -391,8 +390,12 @@
 	
 	// 启动弹幕
 	const startDanmaku = () => {
+		console.log('启动弹幕,danmakuRef:', danmakuRef.value)
 		if (danmakuRef.value) {
+			console.log('调用弹幕组件的startDanmakuAnimation方法')
 			danmakuRef.value.startDanmakuAnimation()
+		} else {
+			console.log('弹幕组件引用为空')
 		}
 	}