From 2a2c29f71cd689dfb6e9a988207313979b239b3e Mon Sep 17 00:00:00 2001
From: wwp <782568523@qq.com>
Date: Thu, 5 Sep 2024 11:50:19 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=91=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/tki-tree/tki-tree.vue          |  62 +++----
 monitorMobile/pages/earlyWarning/detail.vue   | 158 ++++++++++--------
 monitorMobile/pages/monitor/index.vue         |   6 +-
 3 files changed, 125 insertions(+), 101 deletions(-)

diff --git a/monitorMobile/components/tki-tree/tki-tree.vue b/monitorMobile/components/tki-tree/tki-tree.vue
index 57ffe98..45f095c 100644
--- a/monitorMobile/components/tki-tree/tki-tree.vue
+++ b/monitorMobile/components/tki-tree/tki-tree.vue
@@ -11,13 +11,13 @@
 			</view>
 
 			<view class="tki-tree-view">
-				<!-- <view style="">
-					<u-search height="90rpx" @change="searChange(searchText,treeList)" :inputStyle="{fontSize:'30rpx'}"
-						v-model="searchText" placeholder="请输入" shape="square" :showAction="false"></u-search>
-				</view> -->
 				<scroll-view class="tki-tree-view-sc" :scroll-y="true">
+					<view style="">
+						<u-search height="90rpx" :inputStyle="{fontSize:'30rpx'}"
+							v-model="searchText" placeholder="请输入" shape="square" :showAction="false"></u-search>
+					</view>
 					<block v-for="(item, index) in treeList" :key="index">
-						<view class="tki-tree-item" :style="[{
+						<view v-if="(item[rangeKey].includes(searchText))" class="tki-tree-item" :style="[{
 							paddingLeft: item.rank*15 + 'px',
 							zIndex: item.rank*-1 +50
 						}]" :class="{
@@ -87,6 +87,10 @@
 				type: Boolean,
 				default: false
 			},
+			showChild: {//是否显示子级
+				type: Boolean,
+				default: false
+			},
 			confirmColor: { // 确定按钮颜色
 				type: String,
 				default: '' // #2388FF
@@ -164,9 +168,9 @@
 						parentId, // 父级id数组
 						parents, // 父级id数组
 						rank, // 层级
-						showChild: false, //子级是否显示
+						showChild: this.showChild, //子级是否显示
 						open: false, //是否打开
-						show: rank === 0, // 自身是否显示
+						show: this.showChild, // 自身是否显示
 						hideArr: [],
 						orChecked: item.checked ? item.checked : false,
 						checked: item.checked ? item.checked : false,
@@ -293,29 +297,29 @@
 			// searChange(value, data) {
 			// 	// this.treeList = this.filterTree(value, data)
 			// },
-			filterTree(val, tree, newArr = []) {
-				if (!(tree.length && val)) { // 如果搜索关键字为空直接返回源数据
-					return tree
-				}
-				for (let item of tree) {
-					if (item.name.indexOf(val) > -1) { // 匹配到关键字的逻辑
-						newArr.push(item) // 如果匹配到就在数值中添加记录
-						continue // 匹配到了就退出循环了此时如果有子集也会一并带着
-					}
+			// filterTree(val, tree, newArr = []) {
+			// 	if (!(tree.length && val)) { // 如果搜索关键字为空直接返回源数据
+			// 		return tree
+			// 	}
+			// 	for (let item of tree) {
+			// 		if (item.name.indexOf(val) > -1) { // 匹配到关键字的逻辑
+			// 			newArr.push(item) // 如果匹配到就在数值中添加记录
+			// 			continue // 匹配到了就退出循环了此时如果有子集也会一并带着
+			// 		}
 			
-					if (item.children && item.children.length) { // 如果父级节点没有匹配到就看看是否有子集，然后做递归
-						let subArr = this.filterTree(val, item.children) // 缓存递归后的子集数组
-						if (subArr && subArr.length) { // 如果子集数据有匹配到的节点
-							let node = {
-								...item,
-								children: subArr
-							} // 关键逻辑，缓存父节点同时将递归后的子节点作为新值
-							newArr.push(node) // 添加进数组
-						}
-					}
-				}
-				return newArr
-			},
+			// 		if (item.children && item.children.length) { // 如果父级节点没有匹配到就看看是否有子集，然后做递归
+			// 			let subArr = this.filterTree(val, item.children) // 缓存递归后的子集数组
+			// 			if (subArr && subArr.length) { // 如果子集数据有匹配到的节点
+			// 				let node = {
+			// 					...item,
+			// 					children: subArr
+			// 				} // 关键逻辑，缓存父节点同时将递归后的子节点作为新值
+			// 				newArr.push(node) // 添加进数组
+			// 			}
+			// 		}
+			// 	}
+			// 	return newArr
+			// },
 		},
 		watch: {
 			range(list) {
diff --git a/monitorMobile/pages/earlyWarning/detail.vue b/monitorMobile/pages/earlyWarning/detail.vue
index 1cae53f..009c399 100644
--- a/monitorMobile/pages/earlyWarning/detail.vue
+++ b/monitorMobile/pages/earlyWarning/detail.vue
@@ -1,83 +1,92 @@
 <template>
 	<view class="warningDetail">
-		<view class="title cli">
-			{{detailData.alarmTypeDesc ? detailData.alarmTypeDesc + '-' + detailData.tick : ''}}
-		</view>
-		<image style="width: 100%;height:422rpx;" :src="detailData.snapshotUrl" mode="aspectFit"></image>
-		<view class="cli">
-			<view class="labelBox">
-				所属学校：
-			</view>
-			<view class="valueBox">
-				演示学校
-			</view>
-		</view>
-		<view class="cli">
-			<view class="labelBox">
-				班级：
-			</view>
-			<view class="valueBox">
-				--
-			</view>
-		</view>
-		<view class="cli">
-			<view class="labelBox">
-				姓名：
-			</view>
-			<view class="valueBox">
-				{{ detailData.personName || "--" }}
-			</view>
-		</view>
-		<view class="cli">
-			<view class="labelBox">
-				预警摄像头：
+		<!-- <view style="height: 100vh;background: #fff;" v-if="showLoading">
+			<u-loading-page :loading="true" bg-color="#e8e8e8" color="#ffffff"></u-loading-page>
+		</view> -->
+		<u-loading-page :loading="showLoading" bg-color="#e8e8e8" color="#ffffff"></u-loading-page>
+		<!-- <u-loading-icon v-if="showLoading" text="加载中" textSize="18"></u-loading-icon> -->
+		<view class="">
+			<view class="title cli">
+				{{detailData.alarmTypeDesc ? detailData.alarmTypeDesc + '-' + detailData.tick : ''}}
 			</view>
-			<view class="valueBox">
-				{{ detailData.cameraName || "--" }}
-			</view>
-		</view>
-		<view class="cli">
-			<view class="labelBox">
-				预警类型：
+			<image style="width: 100%;height:422rpx;" :src="detailData.snapshotUrl" mode="aspectFit"></image>
+			<view class="cli">
+				<view class="labelBox">
+					所属学校：
+				</view>
+				<view class="valueBox">
+					演示学校
+				</view>
 			</view>
-			<view class="valueBox">
-				{{ detailData.alarmTypeDesc || "--" }}
+			<view class="cli">
+				<view class="labelBox">
+					班级：
+				</view>
+				<view class="valueBox">
+					--
+				</view>
 			</view>
-		</view>
-		<view class="cli">
-			<view class="labelBox">
-				预警时间：
+			<view class="cli">
+				<view class="labelBox">
+					姓名：
+				</view>
+				<view class="valueBox">
+					{{ detailData.personName || "--" }}
+				</view>
 			</view>
-			<view class="valueBox">
-				{{ detailData.tick || "--" }}
+			<view class="cli">
+				<view class="labelBox">
+					预警摄像头：
+				</view>
+				<view class="valueBox">
+					{{ detailData.cameraName || "--" }}
+				</view>
 			</view>
-		</view>
-		<view class="cli">
-			<view class="labelBox">
-				复核视频：
+			<view class="cli">
+				<view class="labelBox">
+					预警类型：
+				</view>
+				<view class="valueBox">
+					{{ detailData.alarmTypeDesc || "--" }}
+				</view>
 			</view>
-			<view class="valueBox">
-				<text v-if="detailData.videoUrl" style="color: #2388FF;" @click="seeVideo(detailData.videoUrl)">查看视频</text>
-				<text v-else>--</text>
+			<view class="cli">
+				<view class="labelBox">
+					预警时间：
+				</view>
+				<view class="valueBox">
+					{{ detailData.tick || "--" }}
+				</view>
 			</view>
-		</view>
-		<view class="cli2">
-			<view class="labelBox">
-				备注信息：
+			<view class="cli">
+				<view class="labelBox">
+					复核视频：
+				</view>
+				<view class="valueBox">
+					<text v-if="detailData.videoUrl" style="color: #2388FF;"
+						@click="seeVideo(detailData.videoUrl)">查看视频</text>
+					<text v-else>--</text>
+				</view>
 			</view>
-			<view class="valueBox">
-				{{ detailData.extend || '--' }}
+			<view class="cli2">
+				<view class="labelBox">
+					备注信息：
+				</view>
+				<view class="valueBox">
+					{{ detailData.extend || '--' }}
+				</view>
 			</view>
-		</view>
 
-		<view class="cli2">
-			<view class="labelBox">
-				处理意见：
-			</view>
-			<view class="valueBox">
-				{{ detailData.remark || '--' }}
+			<view class="cli2">
+				<view class="labelBox">
+					处理意见：
+				</view>
+				<view class="valueBox">
+					{{ detailData.remark || '--' }}
+				</view>
 			</view>
 		</view>
+
 		<u-popup :show="showVideo" :closeable="true" @close="close" @open="open" mode="center">
 			<!-- <view class="">
 				视频
@@ -126,6 +135,7 @@
 				playbackRate: 1,
 				currentTime: 0,
 				duration: 0,
+				showLoading: false,
 			}
 		},
 		computed: {
@@ -143,17 +153,25 @@
 		},
 		onLoad(options) {
 			console.log(options)
-			if(options.id) {
+			if (options.id) {
 				this.id = options.id;
 			}
 			this.getInfo();
 		},
 		methods: {
 			getInfo() {
-				detail({ id: this.id }).then(res=>{
-					if(res.code == 200) {
+				this.showLoading = true;
+				detail({
+					id: this.id
+				}).then(res => {
+					if (res.code == 200) {
 						this.detailData = res.data;
 					}
+					this.showLoading = false;
+				}).catch(err => {
+
+					this.showLoading = false;
+
 				})
 			},
 			seeVideo(url) {
@@ -294,7 +312,7 @@
 			.valueBox {
 				color: #333333;
 				font-weight: 700;
-				
+
 			}
 		}
 
diff --git a/monitorMobile/pages/monitor/index.vue b/monitorMobile/pages/monitor/index.vue
index f68c873..f377694 100644
--- a/monitorMobile/pages/monitor/index.vue
+++ b/monitorMobile/pages/monitor/index.vue
@@ -125,7 +125,7 @@
 
 			</view>
 		</u-modal> -->
-		<tki-tree ref="tkitree" title="摄像头分组" :selectParent="selectParent" :multiple="multiple" :range="treelist" :foldAll="flod"
+		<tki-tree ref="tkitree" title="摄像头分组" :showChild="showChild" :selectParent="selectParent" :multiple="multiple" :range="treelist" :foldAll="flod"
 			rangeKey="name" @confirm="treeConfirm" @cancel="treeCancel"></tki-tree>
 	</view>
 </template>
@@ -166,6 +166,7 @@
 				multiple: false, //是否多选
 				selectParent: true, //父级可选择
 				flod: false, //折叠
+				showChild: true,
 				player: null,
 				sensorId: '',
 				videoUrl: '',
@@ -194,6 +195,7 @@
 		methods: {
 			
 			setVideo() {
+				let that = this;
 				this.loadWebPlayerSDK().then(() => {
 					// 如果需要使用自定义组件，打开以下注释
 					// this.loadComponent().then(() => {
@@ -211,7 +213,7 @@
 
 					this.player.one('canplay', function() {
 						// console.log('canplay', this.player.tag);
-						this.player.tag.play();
+						that.player.tag.play();
 					});