Bladeren bron

修改日记页面逻辑

wangsisi 3 weken geleden
bovenliggende
commit
87eb121876

+ 3 - 3
components/checkinPopup/checkinPopup.vue

@@ -115,11 +115,11 @@
 
 			.left-image {
 				top: 0;
-				left: 84rpx;
+				left: -14rpx;
 			}
 
 			.right-image {
-				right: 84rpx;
+				right: -14rpx;
 				bottom: 0;
 			}
 
@@ -129,7 +129,7 @@
 				width: 600rpx;
 				height: 104rpx;
 				bottom: -44rpx;
-				left: 84rpx;
+				left: -14rpx;
 				@include ossBg("treePage/check-title-bg.png");
 			}
 		}

+ 16 - 4
pages/tabBar/tree/components/memberLevel.vue

@@ -90,15 +90,25 @@
 <style lang="scss" scoped>
 	@import "@/static/style/mixin.scss";
 
-	.member-level {
+	.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);
 
 			.user-info {
@@ -172,7 +182,9 @@
 			align-items: center;
 			font-size: 28rpx;
 			font-weight: 500;
-			margin: auto;
+			margin: auto;
+			position: relative;
+			z-index: 2;
 
 			.info-text {
 				text-align: center;

+ 344 - 279
pages/tabBar/tree/subPages/diary.vue

@@ -1,9 +1,12 @@
 <template>
 	<view class="sub-base-container">
 		<view class="tree-info">
-			<image class="image" mode="aspectFill" :src="getImageUrl(treeData.treeImages[0].filename)"></image>
+			<image class="image" mode="aspectFill"
+				:src="getImageUrl(treeData.treeImages && treeData.treeImages[0].filename)"></image>
 			<view class="info-cont">
 				<view class="tree-name">果树档案</view>
+				<image @click="handleEditName" class="photo-icon"
+					:src="`${config.BASIC_IMG}img/treePage/blue-edit.png`"></image>
 				<view class="text-wrap">
 					<view class="row-text">
 						<text class="label">树木名称</text>
@@ -11,7 +14,7 @@
 					</view>
 					<view class="row-text">
 						<text class="label">树木编号</text>
-						<text>{{treeData.buyList[0].code}}</text>
+						<text>{{treeData.buyList && treeData.buyList[0].code}}</text>
 					</view>
 					<view class="row-text">
 						<text class="label">来自农场</text>
@@ -25,159 +28,191 @@
 			</view>
 		</view>
 		<view class="tree-diary">
-			<view class="diary-head">
-				<view class="date" @click="handleDate">
-					<image class="img" :src="`${config.BASIC_IMG}img/subTreePage/date-icon.png`"></image>
-					<text>{{formatDate(dateVal)}}</text>
-				</view>
-				<view class="arrow-group">
-					<view class="arrow-icon" @click="changeDay(-1)">
-						<up-icon name="arrow-left" size="17" bold color="#fff"></up-icon>
-					</view>
-					<view class="arrow-icon" @click="changeDay(+1)">
-						<up-icon name="arrow-right" size="17" bold color="#fff"></up-icon>
-					</view>
-				</view>
-			</view>
-			<view class="diary-cont">
-				<template v-if="active === 0">
-					<view class="text">{{diaryData.content}}</view>
-					<view class="photo">
-						<image class="img" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
-					</view>
-				</template>
-				<view class="template-1" v-else-if="active === 1">
-					<view class="photo-group">
-						<image class="img" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
-						<image class="img float" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
-					</view>
-					<view class="text">{{diaryData.content}}</view>
-				</view>
-				<view class="template-2" v-else="active === 2">
-					<view class="photo-group">
-						<image class="img" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
-						<image class="img float" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
-					</view>
-					<view class="text">{{diaryData.content}}</view>
-				</view>
+			<view class="diary-head">
+				<view class="date" @click="handleDate">
+					<image class="img" :src="`${config.BASIC_IMG}img/subTreePage/date-icon.png`"></image>
+					<text>{{formatDate(dateVal)}}</text>
+				</view>
+				<view class="arrow-group">
+					<view class="arrow-icon" @click="changeDay(-1)">
+						<up-icon name="arrow-left" size="17" bold color="#fff"></up-icon>
+					</view>
+					<view class="arrow-icon" @click="changeDay(+1)">
+						<up-icon name="arrow-right" size="17" bold color="#fff"></up-icon>
+					</view>
+				</view>
+			</view>
+			<view class="diary-cont">
+				<template v-if="active === 0">
+					<view class="text">{{diaryData.content}}</view>
+					<view class="photo">
+						<image class="img" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png">
+						</image>
+					</view>
+				</template>
+				<view class="template-1" v-else-if="active === 1">
+					<view class="photo-group">
+						<image class="img" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png">
+						</image>
+						<image class="img float"
+							src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
+					</view>
+					<view class="text">{{diaryData.content}}</view>
+				</view>
+				<view class="template-2" v-else-if="active === 2">
+					<view class="photo-group">
+						<image class="img" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png">
+						</image>
+						<image class="img float"
+							src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
+					</view>
+					<view class="text">{{diaryData.content}}</view>
+				</view>
 			</view>
 		</view>
-	</view>
-	<up-datetime-picker
-		:show="showDatetim"
-		v-model="dateVal"
-		mode="date"
-		:maxDate="Date.now()"
-		:formatter="formatter"
-		@cancel="cancel"
-		@confirm="confirm"
-	></up-datetime-picker>
+		<up-calendar ref="calendar" :show="showDatetime" mode="single" :defaultDate="selectedDate" @confirm="confirm" @close="cancel"
+			:minDate="formatDate(new Date(Date.now() - 365 * 24 * 60 * 60 * 1000),'-')" :maxDate="formatDate(new Date(),'-')" monthNum="13"
+			:formatter="formatter"></up-calendar>
+		<editNamePopup ref="editNameRef" @editEnd="getBySampleId"></editNamePopup>
+	</view>
 </template>
 
 <script setup>
-	import config from "@/api/config.js"
-	import {ref} from "vue"
-	import TREE from '@/api/tree.js'
-	import {
-		onLoad
-	} from '@dcloudio/uni-app'
-	const resize = "?x-oss-process=image/resize,w_1000";
-	
-	const getImageUrl = (filename) =>{
-		if (filename?.startsWith("https")) {
-			return filename; // 直接使用完整 URL
-		} else {
-			return config.BASE_IMG_URL + filename + resize; // 拼接基础 URL
-		}
-	};
-	
-	const sampleId = ref('')
-	onLoad((options)=>{
-		sampleId.value = options.sampleId
-		featchGetSampleDiary()
-		getBySampleId()
-	})
-	
-	const diaryData = ref({})
-	const featchGetSampleDiary = () =>{
-		const params = {
-			sampleId:110950,
-			createDateStart:'2025-04-13',
-			createDateEnd:'2025-04-13',
-			page:1,
-			limit:1
-		}
-		TREE.getSampleDiary(params).then(res =>{
-			if(res.data.length){
-				diaryData.value = res.data[0]
-			}
-		})
-	}
-	
-	const treeData = ref({})
-	const treeName = ref('')
-	const getBySampleId = () => {
-		TREE.getBySampleId({
-			sampleId: sampleId.value
-		}).then(({
-			data
-		}) => {
-			treeData.value = data || {}
-			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) + "荔")
-		})
-	}
-	
-	function formatDate(timestamp,type) {
-	  const date = new Date(timestamp);
-	  const year = date.getFullYear();
-	  const month = String(date.getMonth() + 1)
-	  const day = String(date.getDate()).padStart(2, '0');         // 日期补零
-	  return `${year}${type || '年'}${month}${type || '月'}${day}${type?'':'日'}`;
-	}
-	
-	const currentDate = ref(new Date())
-	function changeDay(type) {
-		currentDate.value = new Date(currentDate.value);
-		currentDate.value.setDate(currentDate.value.getDate() + type);
-		if(currentDate.value > new Date()){
-			currentDate.value.setDate(currentDate.value.getDate() - 1);
-			return
-		}
-		dateVal.value = Date.parse(currentDate.value);
-		//获取 0-2 的随机整数
-		const randomInt = Math.floor(Math.random() * 3);
-		active.value = randomInt
-	}
-	
-	const showDatetim = ref(false)
-	const dateVal = ref(Date.now())
-	
-	const handleDate = () =>{
-		showDatetim.value = true
-	}
-	const cancel = () =>{
-		showDatetim.value = false
-	}
-	const confirm = ()=>{
-		const aaa = formatDate(date.value,'-')
-		console.log(date.value,aaa)
-		cancel()
-	}
-	
-	const active = ref(2)
-	const formatter = (type, value) => {
-	  if (type === 'year') {
-	    return `${value}年`;
-	  }
-	  if (type === 'month') {
-	    return `${value}月`;
-	  }
-	  if (type === 'day') {
-	    return `${value}日`;
-	  }
-	  return value;
+	import config from "@/api/config.js"
+	import { ref } from "vue"
+	import TREE from '@/api/tree.js'
+	import { onLoad, onReady } from '@dcloudio/uni-app'
+	
+	const resize = "?x-oss-process=image/resize,w_1000";
+
+	const getImageUrl = (filename) => {
+		if (filename?.startsWith("https")) {
+			return filename;
+		} else {
+			return config.BASE_IMG_URL + filename + resize;
+		}
+	};
+
+	const sampleId = ref('')
+	const farmBuyId = ref('')
+	
+	onLoad((options) => {
+		sampleId.value = options.sampleId
+		farmBuyId.value = options.farmBuyId
+		featchGetSampleDiary()
+		getBySampleId()
+	})
+
+	const editNameRef = ref(null)
+	const formatDatePoint = (dateStr) => {
+		return dateStr.split(" ")[0].replace(/-/g, ".");
+	};
+	
+	const handleEditName = () => {
+		editNameRef.value.showPopup({
+			id: farmBuyId.value,
+			treeName: treeName.value,
+			nickname: treeData.value.buyList[0].nickname,
+			showName: treeData.value.buyList[0].showName,
+			createDate: formatDatePoint(treeData.value.buyList[0].createDate),
+		})
+	}
+
+	const diaryData = ref({})
+	const featchGetSampleDiary = () => {
+		const currentDateStr = selectedDate.value[0]
+		const params = {
+			sampleId: sampleId.value,
+			createDateStart: currentDateStr,
+			createDateEnd: currentDateStr,
+			page: 1,
+			limit: 1
+		}
+		TREE.getSampleDiary(params).then(res => {
+			if (res.data.length) {
+				diaryData.value = res.data[0]
+			} else {
+				diaryData.value = {}
+			}
+		})
+	}
+
+	const treeData = ref({})
+	const treeName = ref('')
+	const getBySampleId = () => {
+		TREE.getBySampleId({
+			sampleId: sampleId.value
+		}).then(({ data }) => {
+			treeData.value = data || {}
+			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) + "荔")
+		})
+	}
+
+	function formatDate(timestamp, type) {
+		const date = new Date(timestamp);
+		const year = date.getFullYear();
+		const month = String(date.getMonth() + 1).padStart(2, '0');
+		const day = String(date.getDate()).padStart(2, '0');
+		return `${year}${type || '年'}${month}${type || '月'}${day}${type?'':'日'}`;
+	}
+
+	const currentDate = ref(new Date())
+
+	function changeDay(type) {
+		currentDate.value = new Date(currentDate.value);
+		currentDate.value.setDate(currentDate.value.getDate() + type);
+		if (currentDate.value > new Date()) {
+			currentDate.value.setDate(currentDate.value.getDate() - 1);
+			return
+		}
+		dateVal.value = Date.parse(currentDate.value);
+		selectedDate.value = [formatDate(currentDate.value, '-')];
+		featchGetSampleDiary();
+		const randomInt = Math.floor(Math.random() * 3);
+		active.value = randomInt
+	}
+
+	const showDatetime = ref(false)
+	const dateVal = ref(Date.now())
+	const selectedDate = ref([formatDate(Date.now(),'-')])
+	const calendar = ref(null)
+
+	const handleDate = () => {
+		// 更新选择的日期
+		selectedDate.value = [formatDate(dateVal.value, '-')]
+		// 显示日历
+		showDatetime.value = true
+	}
+	
+	const cancel = () => {
+		showDatetime.value = false
+	}
+	
+	const confirm = (e) => {
+		selectedDate.value = e
+		dateVal.value = Date.parse(e)
+		currentDate.value = new Date(e)
+		featchGetSampleDiary()
+		cancel()
+	}
+
+	const active = ref(0)
+
+	// 格式化函数
+	const formatter = (day) => {
+		// 可以在这里添加自定义的日期格式化逻辑
+		return day;
 	};
+
+	// 页面渲染完成后初始化
+	onReady(()=> {
+		// 如果需要兼容微信小程序的话,需要用此写法
+		if (calendar.value) {
+			calendar.value.setFormatter(formatter);
+			console.log('日历组件已初始化')
+		}
+	}) 
 </script>
 
 <style lang="scss" scoped>
@@ -187,7 +222,7 @@
 		background-image: linear-gradient(0deg, #FFFFFF, rgba(33, 153, 248, 0.6));
 		max-height: 484rpx;
 		min-height: 484rpx;
-		padding-top: 52rpx;
+		padding-top: 52rpx;
 
 		.tree-info {
 			display: flex;
@@ -204,6 +239,7 @@
 				width: calc(100% - 220rpx - 36rpx);
 				border: 2rpx solid #fff;
 				border-radius: 16rpx;
+				position: relative;
 				background-image: linear-gradient(180deg, rgba(241, 249, 255, .6), rgba(255, 255, 255, .75));
 
 				.tree-name {
@@ -217,6 +253,14 @@
 					text-align: center;
 				}
 
+				.photo-icon {
+					position: absolute;
+					top: 18rpx;
+					right: 22rpx;
+					width: 28rpx;
+					height: 28rpx;
+				}
+
 				.text-wrap {
 					padding: 8rpx 0 0 20rpx;
 					line-height: 36rpx;
@@ -235,136 +279,157 @@
 
 		.tree-diary {
 			width: 100%;
-			min-height: 960rpx;
-			box-sizing: border-box;
+			min-height: 960rpx;
+			box-sizing: border-box;
 			padding: 70rpx 0 56rpx 30rpx;
-			@include ossBg("subTreePage/diary-bg.png");
-			.diary-head{
-				display: flex;
-				justify-content: space-between;
-				.date{
-					font-family: 'PangMenZhengDao';
-					font-size: 29rpx;
-					color: #2199F8;
-					display: flex;
-					align-items: center;
-					.img{
-						width: 26rpx;
-						height: 26rpx;
-						margin-right: 10rpx;
-					}
-				}
-				.arrow-group{
-					display: flex;
-					.arrow-icon{
-						border-radius: 50%;
-						background: rgba(33, 153, 248, 0.2);
-						width: 56rpx;
-						height: 56rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-					}
-					.arrow-icon + .arrow-icon{
-						margin-left: 20rpx;
-					}
-				}
-			}
-			.diary-cont{
-				padding: 80rpx 60rpx 0 26rpx;
-				.text{
-					width: 72%;
-					margin: 60rpx auto;
-					font-weight: 500;
-					position: relative;
-					&::before{
-						content: '“';
-						position: absolute;
-						top: -85rpx;
-						left: -90rpx;
-						font-size: 140rpx;
-						color: rgba(33, 153, 248, 0.2);
-					}
-					&::after{
-						content: '”';
-						position: absolute;
-						bottom: -130rpx;
-						right: -110rpx;
-						font-size: 140rpx;
-						color: rgba(33, 153, 248, 0.2);
-					}
-				}
-				.photo{
-					width: 100%;
-					height: 420rpx;
-					margin-top: 90rpx;
-					border: 10rpx solid #d0e6fb;
-					box-shadow:  0 4rpx 8rpx 0 rgba(0, 0, 0, 0.1);
-					position: relative;
-					&::before{
-						content: '';
-						position: absolute;
-						z-index: 2;
-						right: -34rpx;
-						top: 0;
-						background: rgba(33, 153, 248, 0.56);
-						transform: rotate(38deg);
-						width: 102rpx;
-						height: 30rpx;
-					}
-					.img{
-						width: 100%;
-						height: 100%;
-						object-fit: cover;
-					}
-				}
-				.template-1{
-					.photo-group{
-						margin:0 -14rpx 240rpx 10rpx;
-						.img{
-							width: 354rpx;
-							height: 240rpx;
-							border: 10rpx solid rgba(255, 255, 255, 0.6);
-							box-shadow:  0 4rpx 8rpx 0 rgba(0, 0, 0, 0.1);
-						}
-						.float{
-							width: 400rpx;
-							height: 264rpx;
-							float: right;
-							margin-top: -130rpx;
-						}
-					}
-					.text{
-						width: 55%;
-						margin: 0 auto;
-					}
-				}
-				.template-2{
-					.photo-group{
-						margin:0 -10rpx 220rpx 10rpx;
-						.img{
-							position: relative;
-							z-index: 2;
-							width: 440rpx;
-							height: 300rpx;
-							border: 10rpx solid rgba(255, 255, 255, 0.3);
-							box-shadow:  0 4rpx 8rpx 0 rgba(0, 0, 0, 0.1);
-						}
-						.float{
-							width: 332rpx;
-							height: 222rpx;
-							float: right;
-							margin-top: -100rpx;
-							transform: rotate(10deg);
-							position: relative;
-							z-index: 1;
-						}
-					}
-					.text{
-						width: 66%;
-						margin: 0 auto;
-					}
-				}
+			@include ossBg("subTreePage/diary-bg.png");
+
+			.diary-head {
+				display: flex;
+				justify-content: space-between;
+
+				.date {
+					font-family: 'PangMenZhengDao';
+					font-size: 29rpx;
+					color: #2199F8;
+					display: flex;
+					align-items: center;
+
+					.img {
+						width: 26rpx;
+						height: 26rpx;
+						margin-right: 10rpx;
+					}
+				}
+
+				.arrow-group {
+					display: flex;
+
+					.arrow-icon {
+						border-radius: 50%;
+						background: rgba(33, 153, 248, 0.2);
+						width: 56rpx;
+						height: 56rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+					}
+
+					.arrow-icon+.arrow-icon {
+						margin-left: 20rpx;
+					}
+				}
+			}
+
+			.diary-cont {
+				padding: 80rpx 60rpx 0 26rpx;
+
+				.text {
+					width: 72%;
+					margin: 60rpx auto;
+					font-weight: 500;
+					position: relative;
+
+					&::before {
+						content: '"';
+						position: absolute;
+						top: -85rpx;
+						left: -90rpx;
+						font-size: 140rpx;
+						color: rgba(33, 153, 248, 0.2);
+					}
+
+					&::after {
+						content: '"';
+						position: absolute;
+						bottom: -130rpx;
+						right: -110rpx;
+						font-size: 140rpx;
+						color: rgba(33, 153, 248, 0.2);
+					}
+				}
+
+				.photo {
+					width: 100%;
+					height: 420rpx;
+					margin-top: 90rpx;
+					border: 10rpx solid #d0e6fb;
+					box-shadow: 0 4rpx 8rpx 0 rgba(0, 0, 0, 0.1);
+					position: relative;
+
+					&::before {
+						content: '';
+						position: absolute;
+						z-index: 2;
+						right: -34rpx;
+						top: 0;
+						background: rgba(33, 153, 248, 0.56);
+						transform: rotate(38deg);
+						width: 102rpx;
+						height: 30rpx;
+					}
+
+					.img {
+						width: 100%;
+						height: 100%;
+						object-fit: cover;
+					}
+				}
+
+				.template-1 {
+					.photo-group {
+						margin: 0 -14rpx 240rpx 10rpx;
+
+						.img {
+							width: 354rpx;
+							height: 240rpx;
+							border: 10rpx solid rgba(255, 255, 255, 0.6);
+							box-shadow: 0 4rpx 8rpx 0 rgba(0, 0, 0, 0.1);
+						}
+
+						.float {
+							width: 400rpx;
+							height: 264rpx;
+							float: right;
+							margin-top: -130rpx;
+						}
+					}
+
+					.text {
+						width: 55%;
+						margin: 0 auto;
+					}
+				}
+
+				.template-2 {
+					.photo-group {
+						margin: 0 -10rpx 220rpx 10rpx;
+
+						.img {
+							position: relative;
+							z-index: 2;
+							width: 440rpx;
+							height: 300rpx;
+							border: 10rpx solid rgba(255, 255, 255, 0.3);
+							box-shadow: 0 4rpx 8rpx 0 rgba(0, 0, 0, 0.1);
+						}
+
+						.float {
+							width: 332rpx;
+							height: 222rpx;
+							float: right;
+							margin-top: -100rpx;
+							transform: rotate(10deg);
+							position: relative;
+							z-index: 1;
+						}
+					}
+
+					.text {
+						width: 66%;
+						margin: 0 auto;
+					}
+				}
 			}
 		}
 	}

+ 1 - 1
pages/tabBar/tree/subPages/friendTree.vue

@@ -25,7 +25,7 @@
 			</view>
 		</view>
 		<!-- 祝福弹窗 -->
-		<blessingsPopup :show="showBlessingsPopup" clockinType="3" :farmBuyId="farmBuyId" @clockinCallback="getBySampleId"></blessingsPopup>
+		<blessingsPopup :show="showBlessingsPopup" clockinType="3" :farmBuyId="farmBuyId" @clockinCallback="getBySampleId" isFriend></blessingsPopup>
 	</view>
 </template>
 

+ 118 - 111
pages/tabBar/tree/tree.vue

@@ -1,78 +1,81 @@
 <template>
-	<view class="base-container">
-		<member-level :treeData="treeData">
-			<view class="toogle" @click="handleShow">切换 {{name}}<up-icon class="icon" name="arrow-down" color="#fff"
-					size="12"></up-icon></view>
-		</member-level>
-		<view class="tree-cont">
-			<view class="tree-name">
-				<view>{{treeName}}</view>
-				<image @click="handleEditName" class="edit-icon" :src="`${config.BASIC_IMG}img/edit-icon.png`">
-				</image>
-			</view>
-			<image class="drone-icon" :src="`${config.BASIC_IMG}img/treePage/drone-icon.png`"></image>
-			<view class="tool-wrap">
-				<view class="tool-left">
-					<view :class="['tool-item',item.className]" v-for="(item,index) in toolLeftList" :key="index"
-						@click="handleToolItem(item)">
-						<image class="icon" :src="`${config.BASIC_IMG}img/treePage/l-tree-icon-${index+1}.png`">
-						</image>
-						<view class="name">{{item.name}}</view>
-					</view>
+	<view class="page-container">
+		<view class="base-container">
+			<member-level :treeData="treeData">
+				<view class="toogle" @click="handleShow">切换 {{name}}<up-icon class="icon" name="arrow-down" color="#fff"
+						size="12"></up-icon></view>
+			</member-level>
+			<view class="tree-cont">
+				<view class="tree-name">
+					<view>{{treeName}}</view>
+					<image @click="handleEditName" class="edit-icon" :src="`${config.BASIC_IMG}img/edit-icon.png`">
+					</image>
 				</view>
-				<view class="tool-right">
-					<view :class="['tool-item',item.className]" v-for="(item,index) in toolRightList" :key="index"
-						@click="handleToolItem(item)">
-						<image class="icon" :src="`${config.BASIC_IMG}img/treePage/r-tree-icon-${index+1}.png`">
-						</image>
-						<view class="name">{{item.name}}</view>
+				<image class="drone-icon" :src="`${config.BASIC_IMG}img/treePage/drone-icon.png`"></image>
+				<view class="tool-wrap">
+					<view class="tool-left">
+						<view :class="['tool-item',item.className]" v-for="(item,index) in toolLeftList" :key="index"
+							@click="handleToolItem(item)">
+							<image class="icon" :src="`${config.BASIC_IMG}img/treePage/l-tree-icon-${index+1}.png`">
+							</image>
+							<view class="name">{{item.name}}</view>
+						</view>
+					</view>
+					<view class="tool-right">
+						<view :class="['tool-item',item.className]" v-for="(item,index) in toolRightList" :key="index"
+							@click="handleToolItem(item)">
+							<image class="icon" :src="`${config.BASIC_IMG}img/treePage/r-tree-icon-${index+1}.png`">
+							</image>
+							<view class="name">{{item.name}}</view>
+						</view>
 					</view>
 				</view>
 			</view>
-		</view>
-		<view class="tree-footer">
-			<view class="footer-item" v-for="(item,index) in footerList" :key="index" @click="handleItem(index)">
-				<view @click="requestSubscribe">
-					<button class="share-btn" open-type="share" v-if="index === 2">
-						<image class="icon" :src="`${config.BASIC_IMG}img/treePage/b-tree-icon-${index+1}.png`">
+			<view class="tree-footer">
+				<view class="footer-item" v-for="(item,index) in footerList" :key="index" @click="handleItem(index)">
+					<view @click="requestSubscribe">
+						<button class="share-btn" open-type="share" v-if="index === 2">
+							<image class="icon" :src="`${config.BASIC_IMG}img/treePage/b-tree-icon-${index+1}.png`">
+							</image>
+						</button>
+						<image v-else class="icon" :src="`${config.BASIC_IMG}img/treePage/b-tree-icon-${index+1}.png`">
 						</image>
-					</button>
-					<image v-else class="icon" :src="`${config.BASIC_IMG}img/treePage/b-tree-icon-${index+1}.png`">
-					</image>
-					<view class="name">{{item}}</view>
+						<view class="name">{{item}}</view>
+					</view>
 				</view>
 			</view>
 		</view>
-	</view>
-	<!-- 引导弹窗 -->
-	<view class="guide-bg" v-if="showMask" @click="handleClose">
-		<image class="guide-icon" :src="`${config.BASIC_IMG}img/treePage/guide-1.png`"></image>
+		<!-- 引导弹窗 -->
+		<view class="guide-bg" v-if="showMask" @click="handleClose">
+			<image class="guide-icon" :src="`${config.BASIC_IMG}img/treePage/guide-1.png`"></image>
+		</view>
+		<!-- 切换 -->
+		<up-picker :show="showPicker" :columns="columns" :defaultIndex="[0]" @cancel="handleCancel"
+			@confirm="handleConfirm" keyName="name" valueName="speciesId"></up-picker>
+		<!-- 签到打卡 -->
+		<checkinPopup></checkinPopup>
+		<!-- 编辑树名称 -->
+		<editNamePopup ref="editNameRef" @editEnd="getBySampleId"></editNamePopup>
+		<!-- 海报弹窗 -->
+		<posterPopup :showPoster="showPoster" :farmBuyId="farmBuyId" :treeName="treeName"></posterPopup>
+		<!-- 果树成功弹窗 -->
+		<guardSuccessPopup :show="showGuardSuccess" :treeData="treeData"></guardSuccessPopup>
+		<!-- 果树相册弹窗 -->
+		<tree-album-popup :show="showAlbum" :farmBuyId="farmBuyId" :sampleId="sampleId"></tree-album-popup>
+		<!-- 等级升级成功弹窗 -->
+		<levelSuccessPopup></levelSuccessPopup>
+		<!-- 祝福弹窗 -->
+		<blessingsPopup :show="showBlessingsPopup" :showSuccess="showSuccess" :farmBuyId="farmBuyId"
+			:clockinType="clockinType" @clockinCallback="getBySampleId"></blessingsPopup>
 	</view>
-	<!-- 切换 -->
-	<up-picker :show="showPicker" :columns="columns" :defaultIndex="[0]" @cancel="handleCancel"
-		@confirm="handleConfirm" keyName="name" valueName="speciesId"></up-picker>
-	<!-- 签到打卡 -->
-	<checkinPopup></checkinPopup>
-	<!-- 编辑树名称 -->
-	<editNamePopup ref="editNameRef" @editEnd="getBySampleId"></editNamePopup>
-	<!-- 海报弹窗 -->
-	<posterPopup :showPoster="showPoster" :farmBuyId="farmBuyId" :treeName="treeName"></posterPopup>
-	<!-- 果树成功弹窗 -->
-	<guardSuccessPopup :show="showGuardSuccess" :treeData="treeData"></guardSuccessPopup>
-	<!-- 果树相册弹窗 -->
-	<tree-album-popup :show="showAlbum" :farmBuyId="farmBuyId" :sampleId="sampleId"></tree-album-popup>
-	<!-- 等级升级成功弹窗 -->
-	<levelSuccessPopup></levelSuccessPopup>
-	<!-- 祝福弹窗 -->
-	<blessingsPopup :show="showBlessingsPopup" :showSuccess="showSuccess" :farmBuyId="farmBuyId"
-		:clockinType="clockinType" @clockinCallback="getBySampleId"></blessingsPopup>
 </template>
 
 <script setup>
 	import config from "@/api/config.js"
 	import {
 		onLoad,
-		onShareAppMessage
+		onShareAppMessage,
+		onShow
 	} from '@dcloudio/uni-app'
 	import memberLevel from "./components/memberLevel.vue"
 	import treeAlbumPopup from "./components/treeAlbumPopup.vue"
@@ -153,17 +156,21 @@
 
 	onLoad(() => {
 		featchIsLookedGuide()
-		featchLightTree()
+		featchLightTree()
 		featchCategoryList()
-	})
-	
-	//品类查询所有
-	const featchCategoryList = () =>{
-		TREE.categoryList().then(({
-			data
-		}) => {
-			columns.value[0] = data || []
-		})
+	})
+	
+	onShow(()=>{
+		featchLightTree()
+	})
+	
+	//品类查询所有
+	const featchCategoryList = () =>{
+		TREE.categoryList().then(({
+			data
+		}) => {
+			columns.value[0] = data || []
+		})
 	}
 
 	const showMask = ref(false)
@@ -177,20 +184,20 @@
 				showMask.value = true
 			}
 		})
-	}
-	
-	const handleClose = async () =>{
-		const {code} = await USER.lookedGuide({type:1})
-		if(code === 0){
-			showMask.value = false
-		}
+	}
+	
+	const handleClose = async () =>{
+		const {code} = await USER.lookedGuide({type:1})
+		if(code === 0){
+			showMask.value = false
+		}
 	}
 
 	const featchSessionStore = () => {
 		USER.getSessionStore({
 			key: 'successTree',
 			miniUserId: userInfo.id
-		}).then((({data}) => {
+		}).then((({data}) => {
 			if (data?.val == 0) {
 				showGuardSuccess.value = !showGuardSuccess.value
 				USER.setSessionStore({
@@ -199,18 +206,18 @@
 				})
 			}
 		}))
-	}
-	
-	const sampleId = ref('')
-	//通过品类查询当前树
-	const featchLightTree = () =>{
-		TREE.getLightTree({farmId:766}).then((res =>{
-			sampleId.value = res.data.id
-			getBySampleId()
-		}))
+	}
+	
+	const sampleId = ref('')
+	//通过品类查询当前树
+	const featchLightTree = () =>{
+		TREE.getLightTree({farmId:766}).then((res =>{
+			sampleId.value = res.data.id
+			getBySampleId()
+		}))
 	}
 
-	const treeData = ref({})
+	const treeData = ref({})
 	const farmBuyId = ref('')
 	const treeName = ref('')
 	const userInfo = uni.getStorageSync('userInfo')
@@ -227,8 +234,8 @@
 			} else {
 				treeName.value = '飞鸟守护'
 			}
-			farmBuyId.value = data.buyList[0].id
-			featchSessionStore()
+			farmBuyId.value = data.buyList[0].id
+			featchSessionStore()
 		})
 	}
 
@@ -255,7 +262,7 @@
 	const clockinType = ref('1')
 	const handleItem = (index) => {
 		if (index === 0) {
-			clockinType.value = 1
+			clockinType.value = 1
 			if (treeData.value.buyList[0].level.clockinMap['1']) {
 				uni.showToast({
 					title: '今日已守护',
@@ -331,26 +338,26 @@
 </script>
 
 <style lang="scss" scoped>
-	@import "@/static/style/mixin.scss";
-	.guide-bg{
-		position: fixed;
-		top: 0;
-		width: 100%;
-		height: 107vh;
-		@include ossBg("treePage/guide-bg.png");
-		z-index: 999;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		.guide-icon{
-			width: 360rpx;
-			height: 236rpx
-		}
-	}
-	/* #ifdef H5 */
-	.guide-bg{
-		height: 102vh;
-	}
+	@import "@/static/style/mixin.scss";
+	.guide-bg{
+		position: fixed;
+		top: 0;
+		width: 100%;
+		height: 107vh;
+		@include ossBg("treePage/guide-bg.png");
+		z-index: 999;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.guide-icon{
+			width: 360rpx;
+			height: 236rpx
+		}
+	}
+	/* #ifdef H5 */
+	.guide-bg{
+		height: 102vh;
+	}
 	/* #endif */
 
 	.base-container {
@@ -381,7 +388,7 @@
 			.tree-name {
 				position: absolute;
 				top: 60.45%;
-				left: calc(50% - 32rpx);
+				left: calc(50% - 32rpx);
 				z-index: 2;
 				font-size: 22rpx;
 				font-family: 'SweiSpringCJKtc';