添加地块缓存和选择逻辑

App.vue

@@ -1,11 +1,11 @@
 <script>
-	import land from "@/utils/land.js"
+	import indexUtil from "@/utils/indexUtil.js"
 	import mqttUtil from "@/utils/mqttUtil.js"
 
 	export default {
 		data() {
 			return {
-				land: new land(), //全局地块列表管理
+				indexData: new indexUtil(), //全局地块列表管理
 				mqtt: null,
 				mqttObj: {
 					topics: []

components/custom-select-land/custom-select-land.vue

@@ -1,8 +1,8 @@
 <template>
 	<u-popup mode="left" :show="show" @close="close">
-		<u-collapse ref="refCollapse" :value="showValue" @change="changeItem" @open="openItem" @close="closeItem"
+		<u-collapse ref="refCollapse" :value="showIndex" @change="changeItem" @open="openItem" @close="closeItem"
 			accordion>
-			<u-collapse-item v-for="(item,i) in list" :name="i">
+			<u-collapse-item v-for="(item,i) in indexData.list" :name="i">
 				<template v-slot:icon>
 					<view class="iconfont icon-qiye icon"></view>
 				</template>
@@ -13,15 +13,17 @@
 					<u-badge numberType="overflow" type="primary" max="999" :showZero="true"
 						:value="item.children.length" />
 				</template>
-				<view class="u-collapse-content" v-if="item.id == selectCId">
+				<view class="u-collapse-content" v-if="showId[item.id]">
 					<u-list>
 						<u-list-item v-for="item2 in item.children">
-							<u-cell @click="select(item2)">
+							<u-cell @click="select(i,item2)">
 								<template v-slot:icon>
 									<view class="iconfont icon-ditu icon"></view>
 								</template>
 								<template v-slot:title>
-									{{item2.name}}
+									<view :class="[item2.id == indexData.selectItem.id ? 'checked':'']">
+										{{item2.name}}
+									</view>
 								</template>
 								<template v-slot:right-icon>
 									<u-badge numberType="overflow" type="success" max="999" :showZero="true"
@@ -32,7 +34,6 @@
 					</u-list>
 				</view>
 			</u-collapse-item>
-
 		</u-collapse>
 	</u-popup>
 </template>
@@ -53,49 +54,57 @@
 			return {
 				user: store.state.user.user,
 				show: false,
-				showValue: null,
-				list: getApp().land.list,
-				selectCId: getApp().land.selectCId,
-				selectItem: getApp().land.selectItem,
+				showIndex: null,
+				showId: {},
+				indexData: getApp().indexData,
 			}
 		},
 		created() {
-			const that = this;
-			getApp().land.getList(that.user.userId);
-			that.list = getApp().land.list;
-			that.selectCId = getApp().land.selectCId;
-			that.selectItem = getApp().land.selectItem;
+			this.indexData.getList(this.user.userId);
+			if (this.indexData.selectItem) {
+				this.showId[this.indexData.selectItem.companyId] = true;
+			} else {
+				this.showId[this.indexData.list.id] = true;
+			}
 		},
 		methods: {
+			//打开弹窗 
 			open() {
-				console.log("open:", this.list);
-				if (this.list.length > 0) {
+				this.showIndex = this.indexData.showIndex;
+				if (this.indexData.list.length > 0) {
 					this.show = true;
 				} else {
 					this.$toast("无数据");
 				}
 			},
+			//关闭弹窗
 			close() {
 				this.show = false;
 			},
-			select(item) {
-				this.selectItem = item;
-				getApp().land.setStorage(2, item);
-				this.$emit("select", item);
+			//选中数据
+			select(index, item) {
+				let oldItem = this.indexData.selectItem;
+				this.indexData.selectItem = item;
+				this.indexData.showIndex = index;
+				if (item.id != oldItem.id) {
+					this.indexData.setStorage(2, item);
+					this.$emit("select", item);
+					uni.$emit("notify-updates-land");
+				}
 				this.close();
 			},
-			changeItem(e) {
-				console.log("changeItem:", e);
-			},
+			//打开行变化
+			changeItem(e) {},
+			//打开行
 			openItem(e) {
-				this.showValue = e;
-				this.selectCId = this.list[e].id;
+				this.showIndex = e;
+				this.showId[this.indexData.list[e].id] = true;
 				this.$nextTick(() => {
 					this.$refs.refCollapse.init();
 				})
 			},
-			closeItem(e) {
-				this.showValue = null;
+			closeItem(e) { //折叠行
+				this.showIndex = null;
 			}
 		}
 	}
@@ -137,5 +146,9 @@
 				color: #39ac4f;
 			}
 		}
+
+		.checked {
+			border-bottom: 2px solid #66ccff;
+		}
 	}
 </style>

pages/index-list.vue

@@ -4,7 +4,7 @@
 	<!-- 弹窗 -->
 	<view>
 		<!-- 地块选择 -->
-		<custom-select-land ref="refLand" @select=""></custom-select-land>
+		<custom-select-land ref="refLand" @select="selectLand"></custom-select-land>
 		<!-- 角度 -->
 		<custom-angle-slider ref="refAngleSlider" mode="bottom" @close="" @confirm="angleSliderConfirm" />
 	</view>
@@ -28,6 +28,9 @@
 			openLand() {
 				this.$refs.refLand.open();
 			},
+			selectLand(e) {
+				console.error('selectLand', e);
+			},
 			change(e) {
 				console.log('change', e);
 			},
@@ -36,7 +39,8 @@
 					url: `/pages/index-list/index-list`
 				})
 			},
-			toQRCode() {},
+			angleSliderConfirm() {},
+
 		},
 	}
 </script>

pages/index.vue

@@ -382,7 +382,7 @@
 	<!-- 弹窗 -->
 	<view>
 		<!-- 地块选择 -->
-		<custom-select-land ref="refLand" @select=""></custom-select-land>
+		<custom-select-land ref="refLand"></custom-select-land>
 		<!-- 角度 -->
 		<custom-angle-slider ref="refAngleSlider" mode="bottom" @close="" @confirm="angleSliderConfirm" />
 	</view>
@@ -399,10 +399,16 @@
 				landList: [1, 2, 3],
 				value: false,
 				sliderValue: 1,
+				landDataChange: true,
 			}
 		},
 		onLoad() {
-			// uni.$emit("mqtt-link");
+			// uni.$emit("mqtt-link"); 
+			uni.$off("notify-updates-land");
+			uni.$on("notify-updates-land", () => {
+				console.error("更新数据")
+				this.landDataChange = true;
+			});
 		},
 		onShow() {
 			// #ifdef APP-PLUS

utils/indexUtil.js

@@ -6,37 +6,40 @@ import {
 	getManagerGroundList,
 } from "@/api/index.js"
 
-class land {
+class indexUtil {
 	static isFirst = true //是否第一次加载 
-	static userId = null;
-	static list = [];
-	static selectCId = null;
-	static selectItem = null;
+	static userId = null; //用户id
+	static list = []; //列表
+	static showIndex = null; //默认显示的面板索引
+	static selectItem = null; //选中的数据
+	static isDataChange = false; //数据是否改变
 
 	//接收创建来的数据
 	constructor() {
 		this.isFirst = true;
 		this.userId = null;
 		this.list = [];
-		this.selectCId = null;
+		this.showIndex = null;
 		this.selectItem = null;
 	}
 
 	// 获取列表
 	getList(userId) {
-		console.error("isFirst:",this.isFirst);
+		uni.showLoading();
 		this.userId = userId;
 		if (this.isFirst) {
 			const lands = uni.getStorageSync(constant.lands);
 			if (lands && lands.userId == userId) {
 				this.list = lands.data;
 			}
+			this.selectItem = uni.getStorageSync(constant.landItem) || null;
+			this.showIndex = this.findLandIndex(this.list, this.selectItem);
 		}
+		uni.hideLoading();
 		if (this.isFirst) {
 			this.isFirst = false;
 			this.getNewList(userId);
 		}
-		console.error("list:",this.list);
 	}
 
 	// 获取最新数据
@@ -56,29 +59,31 @@ class land {
 			// console.error("land:", land);
 			if (land.data.length) {
 				this.handleData(companys, land.data);
-				// 持久化到本地缓存中
-				this.setStorage(1, {
-					userId: this.userId,
-					data: this.list,
-				});
-				this.setStorage(2, this.selectItem);
 			} else {
 				commonUtils.toast("无数据");
-				// 持久化到本地缓存中
-				this.setStorage(1, null);
-				this.setStorage(2, null);
+				this.list = null;
+				this.selectItem = null;
 			}
 		} else {
 			commonUtils.toast("无数据");
-			this.setStorage(1, null);
-			this.setStorage(2, null);
+			this.list = null;
+			this.selectItem = null;
 		}
+		// 持久化到本地缓存中 
+		if (this.list) {
+			this.setStorage(1, {
+				userId: this.userId,
+				data: this.list,
+			});
+		} else {
+			this.setStorage(1, null);
+		}
+		this.setStorage(2, this.selectItem);
 	}
 
 	// 组织数据
 	handleData(companys, lands) {
 		let id = null;
-		let selectCId = null;
 		let selectItem = null;
 		const landItem = uni.getStorageSync(constant.landItem);
 		if (landItem) {
@@ -125,15 +130,27 @@ class land {
 		let index = 0;
 		while (!selectItem) {
 			if (companys[index].children.length) {
-				companys[index].isLoad = true;
 				companys[index].children[0].isSelect = true;
 				selectItem = companys[index].children[0];
 			}
 		}
-
-		this.selectCId = selectItem.companyId;
 		this.list = companys;
 		this.selectItem = selectItem;
+		this.showIndex = this.findLandIndex(this.list, this.selectItem);
+	}
+
+	//寻找默认显示的行
+	findLandIndex(list, item) {
+		let showIndex = null
+		if (list.length && item) {
+			for (var i = 0; i < list.length; i++) {
+				if (list[i].id == item.companyId) {
+					showIndex = i;
+					break;
+				}
+			}
+		}
+		return showIndex;
 	}
 
 	// 缓存数据
@@ -145,7 +162,6 @@ class land {
 		} else {
 			commonUtils.toast("数据持久化异常");
 		}
-
 	}
 }
-export default land
+export default indexUtil