feat:删除进度条组件

pages/tabBar/tree/components/timeScale.vue

@@ -1,753 +0,0 @@
-<!--
-时间刻度尺组件 (TimeScale)
-
-功能：
-- 显示水平时间轴，包含月份标记和小刻度
-- 支持用户滑动选择时间
-- 每两天显示一个小刻度
-- 中间固定竖线，显示当前选中的时间
-- 时间格式：YYYY-MM-DD
-
-Props:
-- currentDate: String - 当前选中的时间 (YYYY-MM-DD格式)
-
-Events:
-- timeChange: (date: String) - 时间变化时触发，返回YYYY-MM-DD格式的日期
-
-使用示例：
-<time-scale 
-    :current-date="selectedDate" 
-    @time-change="handleTimeChange"
-></time-scale>
--->
-
-<template>
-	<view class="time-scale-container">
-		<view class="time-scale-scroll">
-			<scroll-view 
-				class="time-scale-wrapper" 
-				scroll-x 
-				:scroll-left="scrollLeft"
-				scroll-with-animation
-				@scroll="handleScroll"
-				@scrolltolower="handleScrollToLower"
-				@scrolltoupper="handleScrollToUpper"
-				ref="scrollViewRef"
-			>
-				<view class="time-scale">
-					<!-- 月份标签 -->
-					<view class="month-labels">
-						<view 
-							class="month-label" 
-							v-for="(month, index) in monthLabels" 
-							:key="`month-${index}`"
-							:style="{ left: month.left + 'rpx' }"
-						>
-							{{ month.label }}
-						</view>
-					</view>
-					
-					<!-- 时间轴 -->
-					<view class="timeline">
-						<!-- 月份大点 -->
-						<view 
-							class="month-dot" 
-							v-for="(month, index) in monthLabels" 
-							:key="`dot-${index}`"
-							:style="{ left: month.left + 'rpx' }"
-						></view>
-						
-						<!-- 小刻度 -->
-						<view 
-							class="tick-mark" 
-							v-for="(tick, index) in tickMarks" 
-							:key="`tick-${index}`"
-							:style="{ left: tick.left + 'rpx' }"
-						></view>
-					</view>
-					
-
-				</view>
-			</scroll-view>
-			
-			<!-- 中间竖线 -->
-			<view class="center-line"></view>
-		</view>
-		
-		<!-- 当前时间显示 -->
-		<view class="current-time" v-if="currentTime">
-			{{ formatDisplayTime(currentTime) }}
-		</view>
-	</view>
-</template>
-
-<script setup>
-import { ref, computed, onMounted, watch, nextTick } from 'vue'
-
-const props = defineProps({
-	// 当前选中的时间
-	currentDate: {
-		type: String,
-		default: ''
-	}
-})
-
-const emit = defineEmits(['timeChange'])
-
-// 响应式数据
-const currentTime = ref('')
-let scrollTimer = null // 防抖定时器
-const scrollViewRef = ref(null) // 滚动视图引用
-const scrollLeft = ref(0) // 滚动位置
-
-// 计算属性：生成月份标签
-const monthLabels = computed(() => {
-	const labels = []
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth()
-	
-	// 从当前月份往前一年的月份，从右到左排列
-	for (let i = 0; i <= 11; i++) {
-		const date = new Date(currentYear, currentMonth - i, 1)
-		const year = date.getFullYear()
-		const month = date.getMonth() + 1
-		
-		labels.push({
-			label: `${month}月`,
-			year: year,
-			month: month,
-			left: (11 - i) * 200 + 100, // 从右到左排列，当前月份在最右边
-			monthOffset: i // 添加月份偏移信息
-		})
-	}
-	
-	return labels
-})
-
-// 计算属性：生成小刻度
-const tickMarks = computed(() => {
-	const ticks = []
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth()
-	
-	// 从当前月份往前一年的刻度，从右到左排列
-	for (let monthOffset = 0; monthOffset <= 11; monthOffset++) {
-		const date = new Date(currentYear, currentMonth - monthOffset, 1)
-		const year = date.getFullYear()
-		const month = date.getMonth() + 1
-		const daysInMonth = new Date(year, month, 0).getDate()
-		
-		// 每隔一天一个刻度，从第2天开始
-		for (let day = 2; day <= daysInMonth; day++) {
-			const monthLeft = (11 - monthOffset) * 200 + 100
-			const dayOffset = ((day - 1) / daysInMonth) * 200
-			ticks.push({
-				left: monthLeft + dayOffset,
-				date: `${year}-${month.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')}`
-			})
-		}
-	}
-	
-	return ticks
-})
-
-// 格式化显示时间
-const formatDisplayTime = (dateStr) => {
-	const [year, month, day] = dateStr.split('-')
-	return `${year}年${month}月${day}日`
-}
-
-// 根据时间计算位置
-const calculatePositionByDate = (dateStr) => {
-	const [year, month, day] = dateStr.split('-').map(Number)
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth()
-	
-	// 计算月份偏移（从当前月份往前）- 使用与月份标签相同的逻辑
-	// 月份标签: new Date(currentYear, currentMonth - i, 1) 其中 i 从 0 到 11
-	// 所以对于目标日期，我们需要找到对应的 i 值
-	let monthOffset = -1
-	for (let i = 0; i <= 11; i++) {
-		const testDate = new Date(currentYear, currentMonth - i, 1)
-		if (testDate.getFullYear() === year && testDate.getMonth() + 1 === month) {
-			monthOffset = i
-			break
-		}
-	}
-	
-	if (monthOffset === -1 || monthOffset > 11) return 0
-	
-	// 计算月份位置（从右到左）
-	const monthLeft = (11 - monthOffset) * 200 + 100
-	
-	// 计算在月份内的位置，使用与calculateDateByPosition相同的计算逻辑
-	const daysInMonth = new Date(year, month, 0).getDate()
-	const dayRatio = (day - 1) / daysInMonth
-	const dayOffset = dayRatio * 200
-	
-	return monthLeft + dayOffset
-}
-
-// 根据位置计算时间
-const calculateDateByPosition = (left) => {
-	// 计算月份索引（从右到左）
-	const monthIndex = Math.floor((left - 100) / 200)
-	const monthOffset = 11 - monthIndex
-	
-	if (monthOffset < 0 || monthOffset > 11) return ''
-	
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth()
-	
-	// 计算目标月份 - 使用与月份标签完全相同的逻辑
-	// 月份标签: new Date(currentYear, currentMonth - i, 1) 其中 i 从 0 到 11
-	// 这里 monthOffset 对应月份标签中的 i
-	const targetDate = new Date(currentYear, currentMonth - monthOffset, 1)
-	const year = targetDate.getFullYear()
-	const month = targetDate.getMonth() + 1
-	const daysInMonth = new Date(year, month, 0).getDate()
-	
-	// 计算在月份内的位置
-	const monthLeft = monthIndex * 200 + 100
-	const dayOffset = left - monthLeft
-	
-	// 确保dayOffset在有效范围内
-	if (dayOffset < 0 || dayOffset > 200) return ''
-	
-	// 计算日期比例（0-1），使用更精确的计算方法
-	const dayRatio = dayOffset / 200
-	
-	// 计算日期（1-31），使用四舍五入而不是向下取整
-	let day = Math.round(dayRatio * daysInMonth) + 1
-	
-	// 确保日期在有效范围内
-	day = Math.max(1, Math.min(daysInMonth, day))
-	
-	return `${year}-${month.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')}`
-}
-
-// 调试函数：验证时间计算
-const debugTimeCalculation = (left) => {
-	const date = calculateDateByPosition(left)
-	const position = calculatePositionByDate(date)
-	const difference = Math.abs(left - position)
-	console.log(`位置: ${left}, 计算时间: ${date}, 反向计算位置: ${position}, 误差: ${difference}`)
-	return date
-}
-
-// 精确调试函数：测试特定位置
-const preciseDebug = (left) => {
-	const date = calculateDateByPosition(left)
-	const [year, month, day] = date.split('-').map(Number)
-	const monthIndex = Math.floor((left - 100) / 200)
-	const monthOffset = 11 - monthIndex
-	const monthLeft = monthIndex * 200 + 100
-	const dayOffset = left - monthLeft
-	const dayRatio = dayOffset / 200
-	const daysInMonth = new Date(year, month, 0).getDate()
-	
-	console.log(`=== 精确调试 ===`)
-	console.log(`输入位置: ${left}`)
-	console.log(`月份索引: ${monthIndex}, 月份偏移: ${monthOffset}`)
-	console.log(`月份左边界: ${monthLeft}, 日期偏移: ${dayOffset}`)
-	console.log(`日期比例: ${dayRatio}, 月份天数: ${daysInMonth}`)
-	console.log(`计算日期: ${day}, 最终时间: ${date}`)
-	
-	// 添加反向验证
-	const reversePosition = calculatePositionByDate(date)
-	const reverseDate = calculateDateByPosition(reversePosition)
-	console.log(`反向验证: 位置 ${reversePosition} -> 时间 ${reverseDate}`)
-	console.log(`一致性检查: ${date === reverseDate ? '✅' : '❌'}`)
-	
-	return date
-}
-
-// 时间差分析函数
-const analyzeTimeDifference = (left) => {
-	console.log(`=== 时间差分析 ===`)
-	console.log(`分析位置: ${left}`)
-	
-	// 计算当前时间
-	const date = calculateDateByPosition(left)
-	console.log(`计算时间: ${date}`)
-	
-	// 计算反向位置
-	const reversePosition = calculatePositionByDate(date)
-	console.log(`反向位置: ${reversePosition}`)
-	
-	// 计算位置差
-	const positionDiff = Math.abs(left - reversePosition)
-	console.log(`位置差: ${positionDiff}`)
-	
-	// 分析可能的原因
-	if (positionDiff > 5) {
-		console.log(`⚠️ 位置差较大，可能原因:`)
-		console.log(`1. 日期计算精度问题`)
-		console.log(`2. 月份边界处理问题`)
-		console.log(`3. 四舍五入误差`)
-	}
-	
-	return { date, reversePosition, positionDiff }
-}
-
-// 处理滚动事件
-const handleScroll = (e) => {
-	// 清除之前的定时器
-	if (scrollTimer) {
-		clearTimeout(scrollTimer)
-	}
-	
-	// 设置新的定时器，防抖处理
-	scrollTimer = setTimeout(() => {
-		const scrollLeft = e.detail.scrollLeft
-		const containerWidth = 750 // 假设容器宽度为750rpx
-		const centerPosition = containerWidth / 2
-		
-		// 计算当前中心位置对应的时间
-		const absoluteLeft = scrollLeft + centerPosition
-		const date = calculateDateByPosition(absoluteLeft)
-		
-		if (date && date !== currentTime.value) {
-			currentTime.value = date
-			emit('timeChange', date)
-			console.log('当前选中时间:', date) // 打印格式为YYYY-MM-DD
-			
-			// 详细调试信息
-			console.log(`滚动位置: ${scrollLeft}, 中心位置: ${centerPosition}, 绝对位置: ${absoluteLeft}`)
-			preciseDebug(absoluteLeft)
-			
-			// 时间差分析
-			analyzeTimeDifference(absoluteLeft)
-		}
-	}, 50) // 减少防抖时间，提高响应性
-}
-
-// 处理滚动到底部
-const handleScrollToLower = () => {
-	console.log('滚动到底部')
-}
-
-// 处理滚动到顶部
-const handleScrollToUpper = () => {
-	console.log('滚动到顶部')
-}
-
-// 监听props变化
-watch(() => props.currentDate, (newDate) => {
-	if (newDate && newDate !== currentTime.value) {
-		currentTime.value = newDate
-	}
-}, { immediate: true })
-
-// 验证月份标签和位置计算的对应关系
-const validateMonthPositionMapping = () => {
-	console.log('=== 月份位置映射验证 ===')
-	
-	monthLabels.value.forEach((label, index) => {
-		const expectedDate = `${label.year}-${label.month.toString().padStart(2, '0')}-01`
-		const calculatedPosition = calculatePositionByDate(expectedDate)
-		const reverseDate = calculateDateByPosition(calculatedPosition)
-		
-		console.log(`月份${index + 1}: ${label.label}`)
-		console.log(`  标签位置: ${label.left}`)
-		console.log(`  期望日期: ${expectedDate}`)
-		console.log(`  计算位置: ${calculatedPosition}`)
-		console.log(`  反向日期: ${reverseDate}`)
-		console.log(`  位置一致: ${Math.abs(label.left - calculatedPosition) < 1 ? '✅' : '❌'}`)
-		console.log(`  日期一致: ${expectedDate === reverseDate ? '✅' : '❌'}`)
-		console.log('---')
-	})
-}
-
-// 验证月份标签和位置计算的一致性
-const validateMonthConsistency = () => {
-	console.log('=== 月份一致性验证 ===')
-	monthLabels.value.forEach((label, index) => {
-		const expectedDate = `${label.year}-${label.month.toString().padStart(2, '0')}-01`
-		const calculatedPosition = calculatePositionByDate(expectedDate)
-		const reverseDate = calculateDateByPosition(calculatedPosition)
-		const difference = Math.abs(label.left - calculatedPosition)
-		
-		console.log(`月份${index + 1}: ${label.label} (${expectedDate})`)
-		console.log(`  标签位置: ${label.left}, 计算位置: ${calculatedPosition}, 误差: ${difference}`)
-		console.log(`  反向验证: ${reverseDate} vs ${expectedDate}`)
-		console.log(`  一致性: ${reverseDate === expectedDate ? '✅' : '❌'}`)
-		console.log('---')
-	})
-}
-
-// 验证月份标签位置
-const validateMonthLabels = () => {
-	console.log('=== 月份标签验证 ===')
-	monthLabels.value.forEach((label, index) => {
-		const expectedDate = `${label.year}-${label.month.toString().padStart(2, '0')}-01`
-		const calculatedPosition = calculatePositionByDate(expectedDate)
-		const difference = Math.abs(label.left - calculatedPosition)
-		console.log(`月份${index + 1}: ${label.label} (${expectedDate}) -> 标签位置: ${label.left}, 计算位置: ${calculatedPosition}, 误差: ${difference}`)
-	})
-}
-
-// 测试函数：验证时间计算逻辑
-const testTimeCalculation = () => {
-	console.log('=== 时间计算测试 ===')
-	
-	// 先验证月份位置映射
-	validateMonthPositionMapping()
-	
-	// 再验证月份一致性
-	validateMonthConsistency()
-	
-	// 再验证月份标签
-	validateMonthLabels()
-	
-	// 测试几个关键位置（从右到左）
-	const testPositions = [
-		2300, // 最右边（当前月份第一天）
-		2100, // 当前月份中间
-		1900, // 上个月第一天
-		1700, // 上上个月第一天
-		1500, // 三个月前第一天
-		1300, // 四个月前第一天
-		1100, // 五个月前第一天
-		900,  // 六个月前第一天
-		700,  // 七个月前第一天
-		500,  // 八个月前第一天
-		300,  // 九个月前第一天
-		100   // 最左边（一年前）
-	]
-	
-	testPositions.forEach((pos, index) => {
-		const date = calculateDateByPosition(pos)
-		const reversePos = calculatePositionByDate(date)
-		const difference = Math.abs(pos - reversePos)
-		console.log(`测试${index + 1}: 位置 ${pos} -> 时间 ${date} -> 反向位置 ${reversePos}, 误差: ${difference}`)
-		
-		// 如果误差太大，输出详细调试信息
-		if (difference > 10) {
-			console.log('--- 误差过大，详细调试 ---')
-			preciseDebug(pos)
-		}
-	})
-}
-
-// 显示月份对比信息
-const showMonthComparison = () => {
-	console.log('=== 月份对比信息 ===')
-	
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth() + 1
-	
-	console.log(`当前时间: ${currentYear}年${currentMonth}月`)
-	console.log(`月份标签数量: ${monthLabels.value.length}`)
-	
-	// 显示所有月份标签
-	monthLabels.value.forEach((label, index) => {
-		console.log(`标签${index + 1}: ${label.label} (${label.year}-${label.month}) 位置: ${label.left}`)
-		
-		// 计算该月份第一天对应的位置
-		const firstDayDate = `${label.year}-${label.month.toString().padStart(2, '0')}-01`
-		const calculatedPosition = calculatePositionByDate(firstDayDate)
-		const reverseDate = calculateDateByPosition(calculatedPosition)
-		
-		console.log(`  计算位置: ${calculatedPosition}, 反向日期: ${reverseDate}`)
-		console.log(`  位置一致: ${Math.abs(label.left - calculatedPosition) < 1 ? '✅' : '❌'}`)
-		console.log(`  日期一致: ${firstDayDate === reverseDate ? '✅' : '❌'}`)
-	})
-}
-
-// 显示当前月份信息
-const showCurrentMonthInfo = () => {
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth() + 1
-	
-	console.log('=== 当前月份信息 ===')
-	console.log(`当前年份: ${currentYear}, 当前月份: ${currentMonth}`)
-	console.log(`月份标签数量: ${monthLabels.value.length}`)
-	
-	// 显示所有月份标签
-	monthLabels.value.forEach((label, index) => {
-		console.log(`标签${index + 1}: ${label.label} (${label.year}-${label.month}) 位置: ${label.left}`)
-	})
-	
-	return { year: currentYear, month: currentMonth }
-}
-
-// 显示当前日期信息
-const showCurrentDateInfo = () => {
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth() + 1
-	const currentDay = now.getDate()
-	
-	console.log('=== 当前日期信息 ===')
-	console.log(`当前日期: ${currentYear}-${currentMonth.toString().padStart(2, '0')}-${currentDay.toString().padStart(2, '0')}`)
-	console.log(`当前年份: ${currentYear}, 当前月份: ${currentMonth}, 当前日期: ${currentDay}`)
-	
-	// 计算当前日期在时间轴上的位置
-	const currentDateStr = `${currentYear}-${currentMonth.toString().padStart(2, '0')}-${currentDay.toString().padStart(2, '0')}`
-	const currentPosition = calculatePositionByDate(currentDateStr)
-	console.log(`当前日期在时间轴上的位置: ${currentPosition}`)
-	
-	return currentDateStr
-}
-
-// 测试每天刻度的准确性
-const testDailyTicks = () => {
-	console.log('=== 每天刻度测试 ===')
-	
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth()
-	
-	// 测试当前月份的几个关键日期
-	const testDays = [1, 5, 10, 15, 20, 25, 30]
-	
-	testDays.forEach(day => {
-		const testDate = new Date(currentYear, currentMonth, day)
-		const year = testDate.getFullYear()
-		const month = testDate.getMonth() + 1
-		const daysInMonth = new Date(year, month, 0).getDate()
-		
-		// 只测试有效的日期
-		if (day <= daysInMonth) {
-			const dateStr = `${year}-${month.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')}`
-			const position = calculatePositionByDate(dateStr)
-			const reverseDate = calculateDateByPosition(position)
-			const isAccurate = dateStr === reverseDate
-			
-			console.log(`日期: ${dateStr} -> 位置: ${position} -> 反向: ${reverseDate} ${isAccurate ? '✅' : '❌'}`)
-		}
-	})
-}
-
-// 简单测试：验证月份对应关系
-const simpleTest = () => {
-	console.log('=== 简单测试 ===')
-	
-	// 测试当前月份
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth() + 1
-	const currentDate = `${currentYear}-${currentMonth.toString().padStart(2, '0')}-01`
-	
-	console.log(`当前月份: ${currentMonth}月`)
-	console.log(`当前日期: ${currentDate}`)
-	
-	// 计算位置
-	const position = calculatePositionByDate(currentDate)
-	console.log(`计算位置: ${position}`)
-	
-	// 反向计算时间
-	const reverseDate = calculateDateByPosition(position)
-	console.log(`反向计算: ${reverseDate}`)
-	
-	// 验证一致性
-	const isConsistent = currentDate === reverseDate
-	console.log(`一致性: ${isConsistent ? '✅' : '❌'}`)
-	
-	return isConsistent
-}
-
-// 测试3个月差问题
-const testThreeMonthDifference = () => {
-	console.log('=== 3个月差问题测试 ===')
-	
-	const now = new Date()
-	const currentYear = now.getFullYear()
-	const currentMonth = now.getMonth() + 1
-	
-	console.log(`当前时间: ${currentYear}年${currentMonth}月`)
-	
-	// 测试当前月份的位置
-	const currentMonthDate = `${currentYear}-${currentMonth.toString().padStart(2, '0')}-01`
-	const currentPosition = calculatePositionByDate(currentMonthDate)
-	const currentReverseDate = calculateDateByPosition(currentPosition)
-	
-	console.log(`当前月份: ${currentMonthDate}`)
-	console.log(`计算位置: ${currentPosition}`)
-	console.log(`反向计算: ${currentReverseDate}`)
-	console.log(`当前月份一致性: ${currentMonthDate === currentReverseDate ? '✅' : '❌'}`)
-	
-	// 测试3个月前的月份
-	const threeMonthsAgo = new Date(currentYear, currentMonth - 4, 1) // 减4是因为getMonth()返回0-11
-	const threeMonthsAgoYear = threeMonthsAgo.getFullYear()
-	const threeMonthsAgoMonth = threeMonthsAgo.getMonth() + 1
-	const threeMonthsAgoDate = `${threeMonthsAgoYear}-${threeMonthsAgoMonth.toString().padStart(2, '0')}-01`
-	
-	const threeMonthsPosition = calculatePositionByDate(threeMonthsAgoDate)
-	const threeMonthsReverseDate = calculateDateByPosition(threeMonthsPosition)
-	
-	console.log(`3个月前: ${threeMonthsAgoDate}`)
-	console.log(`计算位置: ${threeMonthsPosition}`)
-	console.log(`反向计算: ${threeMonthsReverseDate}`)
-	console.log(`3个月前一致性: ${threeMonthsAgoDate === threeMonthsReverseDate ? '✅' : '❌'}`)
-	
-	// 检查月份标签
-	console.log('月份标签检查:')
-	monthLabels.value.forEach((label, index) => {
-		if (label.year === threeMonthsAgoYear && label.month === threeMonthsAgoMonth) {
-			console.log(`找到3个月前标签: ${label.label} 位置: ${label.left}`)
-			console.log(`位置差: ${Math.abs(label.left - threeMonthsPosition)}`)
-		}
-	})
-}
-
-// 组件挂载后初始化
-onMounted(() => {
-	// 运行简单测试
-	simpleTest()
-	
-	// 测试每天刻度
-	testDailyTicks()
-	
-	// 测试3个月差问题
-	testThreeMonthDifference()
-	
-	// 显示月份对比信息
-	showMonthComparison()
-	
-	// 显示当前月份信息
-	showCurrentMonthInfo()
-	
-	// 显示当前日期信息
-	showCurrentDateInfo()
-	
-	// 运行测试
-	testTimeCalculation()
-	
-	// 如果没有传入当前日期，使用今天
-	if (!props.currentDate) {
-		const today = new Date()
-		const year = today.getFullYear()
-		const month = (today.getMonth() + 1).toString().padStart(2, '0')
-		const day = today.getDate().toString().padStart(2, '0')
-		const todayStr = `${year}-${month}-${day}`
-		
-		currentTime.value = todayStr
-		emit('timeChange', todayStr)
-		
-		// 设置默认滚动到最右边（当前日期位置）
-		nextTick(() => {
-			// 计算需要滚动的距离，让最右边（当前月份）显示在屏幕中间
-			// 总宽度2400rpx，屏幕宽度750rpx，要让最右边显示在中间
-			scrollLeft.value = 2400 - 750
-		})
-	} else {
-		// 如果有传入日期，初始化时间
-		currentTime.value = props.currentDate
-		
-		// 设置默认滚动到传入日期位置
-		nextTick(() => {
-			const targetPosition = calculatePositionByDate(props.currentDate)
-			// 计算需要滚动的距离，让目标日期显示在屏幕中间
-			scrollLeft.value = targetPosition - 375
-		})
-	}
-})
-</script>
-
-<style lang="scss" scoped>
-.time-scale-container {
-	width: 100%;
-	position: relative;
-	margin-bottom: 20rpx;
-	padding: 0 20rpx;
-}
-
-.time-scale-scroll {
-	position: relative;
-	width: 100%;
-	height: 120rpx;
-}
-
-.time-scale-wrapper {
-	width: 100%;
-	height: 100%;
-	white-space: nowrap;
-}
-
-.time-scale {
-	display: inline-block;
-	min-width: 2400rpx; // 12个月 * 200rpx
-	height: 100%;
-	position: relative;
-	padding: 0 375rpx; // 左右各留一半屏幕宽度，确保最左和最右都在中间
-}
-
-.month-labels {
-	position: relative;
-	height: 40rpx;
-}
-
-.month-label {
-	position: absolute;
-	top: 0;
-	transform: translateX(-50%);
-	font-size: 24rpx;
-	color: #777777;
-	font-weight: 500;
-}
-
-.timeline {
-	position: relative;
-	height: 80rpx;
-	margin-top: 20rpx;
-	
-	&::before {
-		content: '';
-		position: absolute;
-		top: 50%;
-		left: 0;
-		right: 0;
-		height: 2rpx;
-		background: rgba(136, 136, 136, 0.1);
-		transform: translateY(-50%);
-	}
-}
-
-.month-dot {
-	position: absolute;
-	top: 50%;
-	width: 14rpx;
-	height: 14rpx;
-	background: #777777;
-	border-radius: 50%;
-	transform: translate(-50%, -50%);
-	z-index: 5;
-}
-
-.tick-mark {
-	position: absolute;
-	top: 50%;
-	width: 2rpx;
-	height: 8rpx;
-	background: rgba(136, 136, 136, 0.3);
-	transform: translate(-50%, -50%);
-}
-
-.center-line {
-	position: absolute;
-	left: 50%;
-	top: 0;
-	bottom: 0;
-	width: 2rpx;
-	background: #2199F8;
-	z-index: 15;
-	transform: translateX(-50%);
-	pointer-events: none;
-}
-
-.current-time {
-	text-align: center;
-	margin-top: 16rpx;
-	font-size: 28rpx;
-	color: #2199F8;
-	font-weight: 500;
-}
-</style>

pages/tabBar/tree/components/treeAlbumPopup.vue

@@ -36,7 +36,6 @@
 						<up-icon name="arrow-right" bold color="#F0D09C" size="22"></up-icon>
 					</view>
 				</view>
-				<!-- <time-scale></time-scale> -->
 			</view>
 		</view>
 	</up-popup>
@@ -50,7 +49,6 @@
 		watch,
 		nextTick
 	} from "vue";
-	import timeScale from './timeScale.vue'
 	const resize = "?x-oss-process=image/resize,w_1000";
 
 	const props = defineProps({

pages/tabBar/tree/tree.vue

@@ -176,12 +176,15 @@
 			showName: treeData.value.buyList[0].showName,
 			createDate: formatDate(treeData.value.buyList[0].createDate),
 		})
-	}
+	}
+	
+	const userInfo = ref({})
 
-	onLoad(() => {
+	onLoad(() => {
+		userInfo.value = uni.getStorageSync('userInfo')
 		featchIsLookedGuide()
 		featchCategoryList()
-		featchLightTree()
+		featchLightTree()
 	})
 	
 	onShow(()=>{
@@ -236,7 +239,7 @@
 	const featchSessionStore = () => {
 		USER.getSessionStore({
 			key: 'successTree',
-			miniUserId: userInfo.id
+			miniUserId: userInfo.value.id
 		}).then((({data}) => {
 			if(data?.text === 'orderSuccess'){
 				clockinType.value = 4
@@ -246,7 +249,7 @@
 					showGuardSuccess.value = !showGuardSuccess.value
 					USER.setSessionStore({
 						key: 'successTree',
-						miniUserId: userInfo.id,
+						miniUserId: userInfo.value.id,
 						val:1,
 						text:''
 					})
@@ -271,7 +274,6 @@
 	const treeData = ref({})
 	const farmBuyId = ref('')
 	const treeName = ref('')
-	const userInfo = uni.getStorageSync('userInfo')
 	const getBySampleId = () => {
 		TREE.getBySampleId({
 			sampleId: sampleId.value
@@ -279,7 +281,7 @@
 			data
 		}) => {
 			treeData.value = data || {}
-			if (userInfo.tel) {
+			if (userInfo.value.tel) {
 				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) + "荔")
 			} else {
@@ -322,15 +324,15 @@
 	const danmakuList = ref([
 		{
 			text: "晨曦微露，阳光洒满大地",
-			avatar: `${userInfo.icon}`
+			avatar: `${userInfo.value.icon}`
 		},
 		{
 			text: "守护果树，收获美好",
-			avatar: `${userInfo.icon}`
+			avatar: `${userInfo.value.icon}`
 		},
 		{
 			text: "今天也要给果树浇水哦",
-			avatar: `${userInfo.icon}`
+			avatar: `${userInfo.value.icon}`
 		},
 		{
 			text: "果树长得好快啊",