From 91be21da8176ac08d30a6e94971393427cb98033 Mon Sep 17 00:00:00 2001
From: wwp <782568523@qq.com>
Date: Wed, 4 Sep 2024 15:27:33 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E8=B0=83=E8=AF=95=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 monitorMobile/api/monitor/index.js            |  10 +-
 monitorMobile/manifest.json                   |  39 +-
 monitorMobile/pages.json                      |   6 -
 .../components/inspectionCenter.vue           | 624 ---------------
 .../earlyWarning/components/warningInfo.vue   | 696 -----------------
 monitorMobile/pages/earlyWarning/detail.vue   |  63 +-
 monitorMobile/pages/earlyWarning/index.vue    | 714 ++++++++++++++++--
 .../pages/earlyWarning/processingResults.vue  |  64 --
 monitorMobile/pages/monitor/index.vue         | 235 +++---
 9 files changed, 820 insertions(+), 1631 deletions(-)
 delete mode 100644 monitorMobile/pages/earlyWarning/components/inspectionCenter.vue
 delete mode 100644 monitorMobile/pages/earlyWarning/components/warningInfo.vue
 delete mode 100644 monitorMobile/pages/earlyWarning/processingResults.vue

diff --git a/monitorMobile/api/monitor/index.js b/monitorMobile/api/monitor/index.js
index d261895..d3f646c 100644
--- a/monitorMobile/api/monitor/index.js
+++ b/monitorMobile/api/monitor/index.js
@@ -15,6 +15,14 @@ export const list = (params) => {
 		params
 	})
 }
+// 获取视频地址
+export const startUrl = (params) => {
+	return http.request({
+		url: '/api/business/deviceApi/getStartVideoLive',
+		method: 'get',
+		params
+	})
+}
 // 停止视频流获取
 export const stopUrl = (params) => {
 	return http.request({
@@ -22,4 +30,4 @@ export const stopUrl = (params) => {
 		method: 'get',
 		params
 	})
-}
+}
\ No newline at end of file
diff --git a/monitorMobile/manifest.json b/monitorMobile/manifest.json
index a3da677..61c2336 100644
--- a/monitorMobile/manifest.json
+++ b/monitorMobile/manifest.json
@@ -1,6 +1,6 @@
 {
     "name" : "monitorMobile",
-    "appid" : "",
+    "appid" : "__UNI__F9792E9",
     "description" : "",
     "versionName" : "1.0.0",
     "versionCode" : "100",
@@ -65,21 +65,28 @@
     "mp-toutiao" : {
         "usingComponents" : true
     },
-	"h5" : {
-		"devServer" : {
-		    "port" : 1888,
-		    "proxy" : {
-		        "/api" : {
-		            "target" : "http://192.168.10.186:8003",
-		            "changeOrigin" : true,
-		            "pathRewrite" : {
-		                "^/api" : ""
-		            }
-		        }
-		    },
-		    "https" : false
-		}
-	},
+    "h5" : {
+        "devServer" : {
+            "port" : 1888,
+            "proxy" : {
+                "/api" : {
+                    "target" : "http://192.168.10.186:8003",
+                    "changeOrigin" : true,
+                    "pathRewrite" : {
+                        "^/api" : ""
+                    }
+                },
+				"/Files" : {
+				    "target" : "http://192.168.10.186:8003/Files",
+				    "changeOrigin" : true,
+				    "pathRewrite" : {
+				        "^/Files" : ""
+				    }
+				}
+            },
+            "https" : false
+        }
+    },
     "uniStatistics" : {
         "enable" : false
     },
diff --git a/monitorMobile/pages.json b/monitorMobile/pages.json
index 6c21822..23f76fd 100644
--- a/monitorMobile/pages.json
+++ b/monitorMobile/pages.json
@@ -114,12 +114,6 @@
 				"navigationBarTitleText": "处理意见"
 			}
 		},
-		{
-			"path": "pages/earlyWarning/processingResults",
-			"style": {
-				"navigationBarTitleText": "处理结果"
-			}
-		},
 		// 我的
 		{
 			"path": "pages/my/index",
diff --git a/monitorMobile/pages/earlyWarning/components/inspectionCenter.vue b/monitorMobile/pages/earlyWarning/components/inspectionCenter.vue
deleted file mode 100644
index 3540de3..0000000
--- a/monitorMobile/pages/earlyWarning/components/inspectionCenter.vue
+++ /dev/null
@@ -1,624 +0,0 @@
-<template>
-	<view class="inspectionCenter">
-		<view class="searchBox">
-			<view class="searchLine" @click="openSearch">
-				<!-- <view class="searchShow"> -->
-				<view class="searchLabels">
-					<image v-show="isShowSearch==false" src="@/static/image/earlyWarning/group.png" mode="">
-					</image>
-					<image v-show="isShowSearch" src="@/static/image/earlyWarning/group2.png" mode="">
-					</image>
-					<text class="labels">选择分组</text>
-					<view class="values">一号楼/厨房</view>
-				</view>
-
-				<view class="arrow">
-					<image v-show="isShowSearch==false" src="@/static/image/earlyWarning/arrow1.png" mode="">
-					</image>
-					<image v-show="isShowSearch" src="@/static/image/earlyWarning/arrow2.png" mode=""></image>
-				</view>
-				<!-- </view> -->
-			</view>
-			<view @click="isShowSearch=false" class="searchDialog" v-if="isShowSearch">
-				<view class="content" @click.stop="isSelect">
-					<u-row justify="space-between" gutter="10">
-						<u-col span="7">
-							<view class="demo-layout" @click="toOpen">
-								<view class="left-layout">
-									<text>{{searchForm.alarmType}}</text>
-								</view>
-								<view class="right-layout">
-									<image style="width: 30rpx;height:30rpx;"
-										src="@/static/image/earlyWarning/arrowRight.png" mode=""></image>
-								</view>
-							</view>
-
-							<!-- <jp-select-plus ref="selectPlus" :isShow="false" color="#2388FF" placeholder="请选择"
-									isSearch v-model="va3" :list="listc"></jp-select-plus> -->
-						</u-col>
-						<u-col span="5">
-							<view class="demo-layout" @click="toOpenSelect">
-								<view class="left-layout">
-									<text>{{searchForm.warnHand}}</text>
-								</view>
-								<view class="right-layout">
-									<image style="width: 30rpx;height:30rpx;"
-										src="@/static/image/earlyWarning/arrowRight.png" mode=""></image>
-								</view>
-							</view>
-						</u-col>
-					</u-row>
-					<u-row style="margin-top:10px;" justify="space-between" gutter="10">
-						<u-col span="12">
-							<uni-datetime-picker v-model="searchForm.tick" type="datetimerange">
-								<view class="demo-layout">
-									<view class="startBox">
-										{{searchForm.StartTick}}
-									</view>
-									<text>至</text>
-									<view class="endBox">
-										{{searchForm.EndTick}}
-									</view>
-									<view class="timeIcon">
-										<image style="width: 30rpx;height:30rpx;"
-											src="@/static/image/earlyWarning/calendar.png" mode=""></image>
-									</view>
-								</view>
-							</uni-datetime-picker>
-
-						</u-col>
-					</u-row>
-					<view class="btnBox">
-						<view class="leftBtn">
-							重置
-						</view>
-						<view class="rightBtn">
-							确认
-						</view>
-					</view>
-				</view>
-			</view>
-
-		</view>
-		<view class="tableBox">
-			<u-empty marginTop="100rpx" :show="false" mode="warnList" text="暂无数据"></u-empty>
-			<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 0rpx);">
-				<u-list-item v-for="(item, index) in warnList" :key="index">
-					<view class="liBox">
-						<view class="topCard">
-							<view class="pic">
-								<image src="@/static/image/earlyWarning/warnBack.png" mode="aspectFill"></image>
-								<view class="resolvingPower">
-									2560*1440
-								</view>
-							</view>
-							<view class="rightCard">
-								<view class="firstCard">
-									<view class="schoolName">
-										摄像头ID：SXT001
-									</view>
-								</view>
-								<view class="secondCard">
-
-									<view class="txt">
-										摄像头名称：厨房（良景）
-									</view>
-								</view>
-								<view class="thirdCard">
-
-									<view class="txt">
-										设备IP：192.168.10.130
-									</view>
-								</view>
-							</view>
-						</view>
-
-						<view class="btoCard">
-							<view class="leftBox btoBox">
-								<image src="@/static/image/earlyWarning/school.png" mode=""></image>
-								<view class="txt">
-									所属学校：演示学校
-								</view>
-							</view>
-							<view class="rightBox btoBox" @click="deleteClick">
-								<view class="txt">
-									播放
-								</view>
-							</view>
-						</view>
-					</view>
-				</u-list-item>
-				<u-loadmore :status="status" />
-			</u-list>
-		</view>
-		<u-modal :show="showDelete" :title="deleteTitle" :showCancelButton="true" @confirm="confirmDelete"
-			@cancel="cancelDelete">
-			<view class="slot-content">
-				<text style="text-align: center;">是否确定删除该预警吗?</text>
-			</view>
-		</u-modal>
-		<selectSearch ref="selectSearchBox" :cellVisible="false" :value.sync="searchForm.alarmType"
-			:options="[{value:1,label:'qinshi1'},{value:2,label:'qinshi2'}]" title="预警类型" search-place-holder="预警类型" />
-		<selectRadio ref="selectRadioBox" :cellVisible="false" :value.sync="searchForm.warnHand"
-			:options="[{value:1,label:'loudong1'},{value:2,label:'loudong2'}]" title="楼栋" />
-	</view>
-</template>
-
-<script>
-	import selectRadio from "@/components/selectRadio.vue"
-	import selectSearch from "@/components/selectSearch.vue"
-	export default {
-		components: {
-			selectRadio,
-			selectSearch,
-
-		},
-		data() {
-			return {
-				showDelete: false,
-				deleteTitle: '提示',
-				deleteContent: '是否确定删除该预警吗?',
-				isShowSearch: false,
-				searchForm: {
-					alarmType: '警告类型',
-					warnHand: '处理状态',
-					tick: [],
-					StartTick: '开始时间',
-					EndTick: '结束时间',
-				},
-				warnList: [{
-					warnHand: 1
-				}, {
-					warnHand: 0
-				}, {
-					warnHand: 1
-				}, {
-					warnHand: 1
-				}, {
-					warnHand: 1
-				}, {}, {}, {}, {}, ],
-				isLoading: false,
-				status: 'loadmore', //loading正在加载 loadmore加载更多 nomore没有更多了
-				listc: [{
-						code: 1,
-						name: 'dasda'
-					}, {
-						code: 2,
-						name: 'dasda'
-					},
-					{
-						code: 3,
-						name: 'dasda'
-					},
-					{
-						code: 4,
-						name: 'dasda'
-					},
-					{
-						code: 5,
-						name: 'dasda'
-					},
-					{
-						code: 6,
-						name: 'dasda'
-					},
-					{
-						code: 7,
-						name: 'dasda'
-					},
-					{
-						code: 8,
-						name: 'dasda'
-					},
-					{
-						code: 9,
-						name: 'dasda'
-					},
-					{
-						code: 10,
-						name: 'dasda'
-					},
-					{
-						code: 11,
-						name: 'dasda'
-					},
-					{
-						code: 12,
-						name: 'dasda'
-					},
-					{
-						code: 13,
-						name: '你好'
-					}
-				]
-			}
-		},
-		watch: {
-			"searchForm.tick"() {
-				console.log('日期时间:', this.searchForm.tick);
-
-				if (this.searchForm.tick && this.searchForm.tick.length > 0) {
-					this.searchForm.StartTick = this.searchForm.tick[0]
-					this.searchForm.EndTick = this.searchForm.tick[1]
-				}
-
-			},
-		},
-		filters: {
-			// statusChange(val) {
-			// 	switch (val) {
-			// 		case 'todo':
-			// 			return '我的待办'
-			// 			break;
-			// 		case 'send':
-			// 			return '由我发起'
-			// 			break;
-			// 		case 'done':
-			// 			return '我的已办'
-			// 			break;
-			// 		default:
-
-			// 	}
-			// },
-		},
-		onLoad() {
-			// 隐藏导航栏
-			this.loadmore()
-		},
-		methods: {
-			cancelDelete() {
-				this.showDelete = false;
-			},
-			deleteClick() {
-				this.showDelete = true;
-			},
-			confirmDelete() {
-				this.showDelete = false;
-			},
-			// 跳转处理页面
-			toHandle(row) {
-				if (row.warnHand == 1) {
-					uni.navigateTo({
-						url: '/pages/earlyWarning/handlingSuggestions'
-					});
-				}
-
-			},
-			// 跳转详情页面
-			toDetail(row) {
-				uni.navigateTo({
-					url: '/pages/earlyWarning/detail'
-				});
-			},
-			// 预警类型弹框筛选
-			toOpen() {
-				this.$refs.selectSearchBox.show = true;
-			},
-			// 处理情况筛选
-			toOpenSelect() {
-				this.$refs.selectRadioBox.show = true;
-			},
-			// 打开筛选框
-			openSearch() {
-				this.isShowSearch = !this.isShowSearch;
-			},
-			isSelect() {
-
-			},
-			scrolltolower() {
-				this.loadmore()
-			},
-			loadmore() {
-				if (this.status != 'loadmore') return
-				this.status = 'loading'
-				setTimeout(() => {
-					for (let i = 0; i < 1; i++) {
-						this.warnList.push({}, {})
-					}
-					// 获取到的总条数>=接口总条数
-					if (this.warnList.length >= 14) {
-						this.status = 'nomore'
-					} else {
-						this.status = 'loadmore'
-					}
-				}, 2000)
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	// .contentBox {
-	// 	height: calc(100% - 375rpx);
-	.inspectionCenter {
-		width: 100%;
-		height: 100%;
-
-		.u-modal__title {
-			color: #000000;
-		}
-	}
-
-	.searchBox {
-		// height: calc(100% - 360rpx);
-		position: relative;
-
-		.searchLine {
-			height: 88rpx;
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			padding: 0 15px;
-			box-sizing: border-box;
-			background: #fff;
-			font-size: 28rpx;
-
-			.searchLabels {
-				display: flex;
-				align-items: center;
-				width: calc(100% - 34rpx);
-
-				image {
-					width: 40rpx;
-					height: 40rpx;
-					flex-shrink: 1;
-				}
-
-				.labels {
-					width: 120rpx;
-					display: block;
-					color: #333333;
-					margin-left: 10rpx;
-					flex-shrink: 1;
-				}
-
-				.values {
-					width: calc(100% - 40rpx - 120rpx);
-					color: #2388FF;
-					font-weight: 700;
-					margin-left: 18rpx;
-					overflow: hidden;
-					word-wrap: break-word;
-					white-space: pre-wrap;
-					display: -webkit-box;
-					-webkit-box-orient: vertical;
-					-webkit-line-clamp: 1;
-				}
-			}
-
-
-			.arrow {
-				// text-align: right;
-				// flex-shrink: 1;
-
-				image {
-					width: 34rpx;
-					height: 34rpx;
-				}
-			}
-
-			.leftSearchBox {
-				display: flex;
-				align-items: center;
-				width: calc(100% - 40px);
-
-				.searchLabel {
-					flex-shrink: 1;
-					color: #333333;
-					width: 80px;
-				}
-
-				.searchValue {
-					width: calc(100% - 60px);
-					margin-left: 10px;
-					color: #2388FF;
-					overflow: hidden;
-					word-wrap: break-word;
-					white-space: pre-wrap;
-					display: -webkit-box;
-					-webkit-box-orient: vertical;
-					-webkit-line-clamp: 1;
-				}
-			}
-		}
-
-		.searchDialog {
-			position: absolute;
-			z-index: 990;
-			top: 89rpx;
-			width: 100%;
-			height: calc(100vh - 375rpx - 100rpx);
-			font-size: 26rpx;
-			background: rgba(0, 0, 0, 0.2);
-
-			.content {
-				background: #FFFFFF;
-				padding: 15px;
-				box-sizing: border-box;
-				border-top: 1px solid rgba(0, 0, 0, 0.1);
-
-				.demo-layout {
-					height: 80rpx;
-					border-radius: 8rpx;
-					background: #F5F5F5;
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					padding: 0 10px;
-					box-sizing: border-box;
-
-					.left-layout {
-						color: #777777;
-					}
-
-					.right-layout {}
-
-					.startBox {
-						color: #777777;
-					}
-
-					text {
-						color: #777777;
-					}
-
-					.endBox {
-						color: #777777;
-					}
-
-					.timeIcon {}
-				}
-			}
-
-			.btnBox {
-				display: flex;
-				align-items: center;
-				margin-top: 15px;
-
-				.leftBtn {
-					width: 50%;
-					height: 74rpx;
-					line-height: 74rpx;
-					border: 1px solid #BABABA;
-					border-radius: 12rpx;
-					color: #333333;
-					text-align: center;
-
-				}
-
-				.rightBtn {
-					width: 50%;
-					height: 74rpx;
-					line-height: 74rpx;
-					border: 1px solid #2388FF;
-					border-radius: 12rpx;
-					color: #fff;
-					text-align: center;
-					background: #2388FF;
-					margin-left: 15rpx;
-				}
-			}
-		}
-	}
-
-	.tableBox {
-		height: 100%;
-		padding: 10px;
-		box-sizing: border-box;
-		// height: 600px;
-		padding-bottom: 30px;
-
-
-		.liBox {
-			background: #fff;
-			padding: 20px 15px;
-			box-sizing: border-box;
-			border-radius: 20px;
-			margin-bottom: 10px;
-
-			.topCard {
-				display: flex;
-
-				.pic {
-					position: relative;
-
-					image {
-						width: 300rpx;
-						height: 220rpx;
-						border-radius: 4px;
-					}
-
-					.resolvingPower {
-						position: absolute;
-						top: 15rpx;
-						right: 15rpx;
-						background: #000000;
-						color: #fff;
-						padding: 8rpx;
-						box-sizing: border-box;
-						font-size: 20rpx;
-						border-radius: 4rpx;
-					}
-				}
-
-				.rightCard {
-					margin-left: 20rpx;
-					margin-top: 15rpx;
-
-					.firstCard {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						margin-bottom: 60rpx;
-
-						.schoolName {
-							font-size: 32rpx;
-							font-weight: 700;
-							color: #333333;
-							overflow: hidden;
-							word-wrap: break-word;
-							white-space: pre-wrap;
-							// font-size: 14px;
-							display: -webkit-box;
-							-webkit-box-orient: vertical;
-							-webkit-line-clamp: 1;
-						}
-					}
-
-					.secondCard,
-					.thirdCard {
-						display: flex;
-						align-items: center;
-						margin-top: 18rpx;
-
-						.txt {
-							font-size: 26rpx;
-							color: #333333;
-						}
-					}
-				}
-			}
-
-			.midCard {
-				font-size: 28rpx;
-
-				.midContent {
-					margin-top: 18rpx;
-				}
-			}
-
-			.btoCard {
-				border-top: 1px solid rgba(0, 0, 0, 0.1);
-				margin-top: 30rpx;
-				padding: 18px 0 0 0;
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-
-				.btoBox {
-					// width: 33.3%;
-					display: flex;
-					justify-content: center;
-					align-items: center;
-					position: relative;
-
-					image {
-						width: 40rpx;
-						height: 40rpx;
-						margin-right: 15rpx;
-					}
-				}
-
-				.rightBox {
-					width: 180rpx;
-					height: 74rpx;
-					background: #2388FF;
-					color: #fff;
-					border-radius: 80rpx;
-				}
-			}
-		}
-
-	}
-
-	// }
-</style>
\ No newline at end of file
diff --git a/monitorMobile/pages/earlyWarning/components/warningInfo.vue b/monitorMobile/pages/earlyWarning/components/warningInfo.vue
deleted file mode 100644
index 513794e..0000000
--- a/monitorMobile/pages/earlyWarning/components/warningInfo.vue
+++ /dev/null
@@ -1,696 +0,0 @@
-<template>
-	<view class="warningInfo">
-		<view class="searchBox">
-			<!-- <view class="searchLine">
-				<view class="searchShow" @click="openSearch">
-					<image v-show="isShowSearch==false" style="width:20px;height:20px;"
-						src="@/static/image/earlyWarning/screen.png" mode="">
-					</image>
-					<image v-show="isShowSearch" style="width:20px;height:20px;"
-						src="@/static/image/earlyWarning/screenActive.png" mode="">
-					</image>
-					<text class="labels">筛选</text>
-					<text class="values">周界入侵，未处理，2024-8-24 18:06:12 - 2024-8-24 18:06:12</text>
-					<view class="arrow">
-						<image v-show="isShowSearch==false" src="@/static/image/earlyWarning/arrow1.png" mode="">
-						</image>
-						<image v-show="isShowSearch" src="@/static/image/earlyWarning/arrow2.png" mode=""></image>
-					</view>
-				</view>
-			</view> -->
-			<view class="searchLine" @click="openSearch">
-				<!-- <view class="searchShow"> -->
-				<view class="searchLabels">
-					<image v-show="isShowSearch==false" src="@/static/image/earlyWarning/screen.png" mode="">
-					</image>
-					<image v-show="isShowSearch" src="@/static/image/earlyWarning/screenActive.png" mode="">
-					</image>
-					<text class="labels">筛选</text>
-					<view class="values">周界入侵，未处理，2024-8-24 18:06:12 - 2024-8-24 18:06:12</view>
-				</view>
-
-				<view class="arrow">
-					<image v-show="isShowSearch==false" src="@/static/image/earlyWarning/arrow1.png" mode="">
-					</image>
-					<image v-show="isShowSearch" src="@/static/image/earlyWarning/arrow2.png" mode=""></image>
-				</view>
-				<!-- </view> -->
-			</view>
-			<view @click="isShowSearch=false" class="searchDialog" v-if="isShowSearch">
-				<view class="content" @click.stop="isSelect">
-					<u-row justify="space-between" gutter="10">
-						<u-col span="7">
-							<view class="demo-layout" @click="toOpen">
-								<view class="left-layout">
-									<text>{{searchForm.$alarmType || '警告类型'}}</text>
-								</view>
-								<view class="right-layout">
-									<image style="width: 30rpx;height:30rpx;"
-										src="@/static/image/earlyWarning/arrowRight.png" mode=""></image>
-								</view>
-							</view>
-
-							<!-- <jp-select-plus ref="selectPlus" :isShow="false" color="#2388FF" placeholder="请选择"
-									isSearch v-model="va3" :list="listc"></jp-select-plus> -->
-						</u-col>
-						<u-col span="5">
-							<view class="demo-layout" @click="toOpenSelect">
-								<view class="left-layout">
-									<text>{{searchForm.warnHand || '处理状态'}}</text>
-								</view>
-								<view class="right-layout">
-									<image style="width: 30rpx;height:30rpx;"
-										src="@/static/image/earlyWarning/arrowRight.png" mode=""></image>
-								</view>
-							</view>
-						</u-col>
-					</u-row>
-					<u-row style="margin-top:10px;" justify="space-between" gutter="10">
-						<u-col span="12">
-							<uni-datetime-picker v-model="searchForm.tick" type="datetimerange">
-								<view class="demo-layout">
-									<view class="startBox">
-										{{searchForm.StartTick || '开始时间'}}
-									</view>
-									<text>至</text>
-									<view class="endBox">
-										{{searchForm.EndTick || '结束时间'}}
-									</view>
-									<view class="timeIcon">
-										<image style="width: 30rpx;height:30rpx;"
-											src="@/static/image/earlyWarning/calendar.png" mode=""></image>
-									</view>
-								</view>
-							</uni-datetime-picker>
-
-						</u-col>
-					</u-row>
-					<view class="btnBox">
-						<view class="leftBtn" @click="clearform">
-							重置
-						</view>
-						<view class="rightBtn" @click="onsubmit">
-							确认
-						</view>
-					</view>
-				</view>
-			</view>
-
-		</view>
-		<view class="tableBox">
-			<u-empty marginTop="100rpx" :show="false" mode="list" text="暂无数据"></u-empty>
-			<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 0rpx);">
-				<u-list-item v-for="(item, index) in warnList" :key="index">
-					<view class="liBox">
-						<view class="headerCard">
-							<view class="schoolName">
-								学校名称学校名称学校名称学校名称
-							</view>
-							<view class="statusBox" :class="[item.warnHand == 1?'handle':'nohandle']">
-								{{item.warnHand == 1 ? '已处理' : '未处理'}}
-							</view>
-						</view>
-						<view class="topCard">
-							<view class="pic">
-								<image src="@/static/image/earlyWarning/warnBack.png" mode="aspectFill"></image>
-							</view>
-							<view class="rightCard">
-								<u-row>
-									<u-col span="6">
-										<view class="midContent">
-											姓名：杨云
-										</view>
-									</u-col>
-									<u-col span="6">
-										<view class="midContent">
-											系部：安环部
-										</view>
-									</u-col>
-								</u-row>
-								<u-row style="margin-top: 20rpx;">
-									<u-col span="6">
-										<view class="midContent">
-											专业：环艺
-										</view>
-									</u-col>
-									<u-col span="6">
-										<view class="midContent">
-											班级：第二班
-										</view>
-									</u-col>
-								</u-row>
-
-							</view>
-						</view>
-						<view class="midCard">
-							<view class="secondCard">
-								<image style="width: 30rpx;height: 30rpx;"
-									src="@/static/image/earlyWarning/warnType.png" mode=""></image>
-								<view class="txt">
-									警告类型：周界入侵
-								</view>
-							</view>
-							<view class="thirdCard">
-								<image style="width: 30rpx;height: 30rpx;"
-									src="@/static/image/earlyWarning/warnVideo.png" mode=""></image>
-								<view class="txt">
-									警告摄像头：厨房（良景）
-								</view>
-							</view>
-
-						</view>
-						<view class="btoCard">
-							<view class="btoContent">
-								时间：2024-08-15 11:59:12
-							</view>
-							<view class="rightBox btoBox" @click="toDetail">
-								<view class="txt">
-									查看
-								</view>
-							</view>
-						</view>
-					</view>
-				</u-list-item>
-				<u-loadmore :status="status" />
-			</u-list>
-		</view>
-		<selectSearch ref="selectSearchBox" :cellVisible="false" v-model="searchForm.alarmType"
-			:options="warnOption" :title.sync="searchForm.$alarmType" placeholder="预警类型" search-placeholder="预警类型" />
-		<selectRadio ref="selectRadioBox" :cellVisible="false" v-model="searchForm.warnHand"
-			:options="handOption" placeholder="处理状态" />
-	</view>
-</template>
-
-<script>
-	import selectRadio from "@/components/selectRadio.vue"
-	import selectSearch from "@/components/selectSearch.vue"
-	import {
-		page, //获取列表
-		detail, //详情
-		warnType, //获取预警类型
-	} from '@/api/warn/index.js'
-	export default {
-		components: {
-			selectRadio,
-			selectSearch
-		},
-		data() {
-			return {
-				isShowSearch: false,
-				searchForm: {
-					alarmType: '',
-					warnHand: '',
-					tick: [],
-					StartTick: '',
-					EndTick: '',
-				},
-				warnOption: [
-					{
-						label: '人群聚集',
-						value: 1
-					},
-					{
-						label: '烟火警告',
-						value: 2
-					},
-					{
-						label: '未佩戴口罩检查',
-						value: 3
-					},
-					{
-						label: '周界入侵',
-						value: 4
-					},
-				],
-				handOption: [
-					{
-						label: '已处理',
-						value: 1
-					},
-					{
-						label: '未处理',
-						value: 2
-					},
-				],
-				warnList: [{
-					warnHand: 1
-				}, {
-					warnHand: 0
-				}, {
-					warnHand: 1
-				}, {
-					warnHand: 1
-				}, {
-					warnHand: 1
-				}, {}, {}, {}, {}, ],
-				isLoading: false,
-				status: 'loadmore', //loading正在加载 loadmore加载更多 nomore没有更多了
-				listc: [{
-						code: 1,
-						name: 'dasda'
-					}, {
-						code: 2,
-						name: 'dasda'
-					},
-					{
-						code: 3,
-						name: 'dasda'
-					},
-					{
-						code: 4,
-						name: 'dasda'
-					},
-					{
-						code: 5,
-						name: 'dasda'
-					},
-					{
-						code: 6,
-						name: 'dasda'
-					},
-					{
-						code: 7,
-						name: 'dasda'
-					},
-					{
-						code: 8,
-						name: 'dasda'
-					},
-					{
-						code: 9,
-						name: 'dasda'
-					},
-					{
-						code: 10,
-						name: 'dasda'
-					},
-					{
-						code: 11,
-						name: 'dasda'
-					},
-					{
-						code: 12,
-						name: 'dasda'
-					},
-					{
-						code: 13,
-						name: '你好'
-					}
-				]
-			}
-		},
-		watch: {
-			"searchForm.tick"() {
-				console.log('日期时间:', this.searchForm.tick);
-
-				if (this.searchForm.tick && this.searchForm.tick.length > 0) {
-					this.searchForm.StartTick = this.searchForm.tick[0]
-					this.searchForm.EndTick = this.searchForm.tick[1]
-				}
-
-			},
-		},
-		filters: {
-			// statusChange(val) {
-			// 	switch (val) {
-			// 		case 'todo':
-			// 			return '我的待办'
-			// 			break;
-			// 		case 'send':
-			// 			return '由我发起'
-			// 			break;
-			// 		case 'done':
-			// 			return '我的已办'
-			// 			break;
-			// 		default:
-
-			// 	}
-			// },
-		},
-		onLoad() {
-			// 隐藏导航栏
-			this.loadmore()
-		},
-		methods: {
-			clearform() {
-				this.searchForm = {}
-				this.isShowSearch = false;
-			},
-			onsubmit() {
-			console.log(this.searchForm)	
-			},
-			// 跳转详情页面
-			toDetail(row) {
-				uni.navigateTo({
-					url: '/pages/earlyWarning/detail'
-				});
-			},
-			// 预警类型弹框筛选
-			toOpen() {
-				this.$refs.selectSearchBox.show = true;
-			},
-			// 处理情况筛选
-			toOpenSelect() {
-				this.$refs.selectRadioBox.show = true;
-			},
-			// 打开筛选框
-			openSearch() {
-				this.isShowSearch = !this.isShowSearch;
-			},
-			isSelect() {
-
-			},
-			scrolltolower() {
-				this.loadmore()
-			},
-			loadmore() {
-				if (this.status != 'loadmore') return
-				this.status = 'loading'
-				page(this.searchForm).then(res=>{
-					console.log(res)
-					// 获取到的总条数>=接口总条数
-					if (this.warnList.length >= 14) {
-						this.status = 'nomore'
-					} else {
-						this.status = 'loadmore'
-					}
-				})
-				// setTimeout(() => {
-				// 	for (let i = 0; i < 1; i++) {
-				// 		this.warnList.push({}, {})
-				// 	}
-					
-				// }, 2000)
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	// .contentBox {
-	// 	height: calc(100% - 375rpx);
-	.warningInfo {
-		width: 100%;
-		height: 100%;
-		background: #F6F8FA;
-
-		.u-modal__title {
-			color: #000000;
-		}
-	}
-
-	.searchBox {
-		// height: calc(100% - 360rpx);
-		position: relative;
-
-		.searchLine {
-			height: 88rpx;
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			padding: 0 15px;
-			box-sizing: border-box;
-			background: #fff;
-			font-size: 28rpx;
-
-			.searchLabels {
-				display: flex;
-				align-items: center;
-				width: calc(100% - 34rpx);
-
-				image {
-					width: 40rpx;
-					height: 40rpx;
-					flex-shrink: 1;
-				}
-
-				.labels {
-					width: 70rpx;
-					display: block;
-					color: #333333;
-					margin-left: 10rpx;
-					flex-shrink: 1;
-				}
-
-				.values {
-					width: calc(100% - 40rpx - 50rpx);
-					color: #2388FF;
-					font-weight: 700;
-					margin-left: 18rpx;
-					overflow: hidden;
-					word-wrap: break-word;
-					white-space: pre-wrap;
-					display: -webkit-box;
-					-webkit-box-orient: vertical;
-					-webkit-line-clamp: 1;
-				}
-			}
-
-
-			.arrow {
-				// text-align: right;
-				// flex-shrink: 1;
-
-				image {
-					width: 34rpx;
-					height: 34rpx;
-				}
-			}
-
-			.leftSearchBox {
-				display: flex;
-				align-items: center;
-				width: calc(100% - 40px);
-
-				.searchLabel {
-					flex-shrink: 1;
-					color: #333333;
-					width: 80px;
-				}
-
-				.searchValue {
-					width: calc(100% - 60px);
-					margin-left: 10px;
-					color: #2388FF;
-					overflow: hidden;
-					word-wrap: break-word;
-					white-space: pre-wrap;
-					display: -webkit-box;
-					-webkit-box-orient: vertical;
-					-webkit-line-clamp: 1;
-				}
-			}
-		}
-
-		.searchDialog {
-			position: absolute;
-			z-index: 990;
-			top: 89rpx;
-			width: 100%;
-			height: calc(100vh - 375rpx - 60rpx);
-			font-size: 26rpx;
-			background: rgba(0, 0, 0, 0.2);
-
-			.content {
-				background: #FFFFFF;
-				padding: 15px;
-				box-sizing: border-box;
-				border-top: 1px solid rgba(0, 0, 0, 0.1);
-
-				.demo-layout {
-					height: 80rpx;
-					border-radius: 8rpx;
-					background: #F5F5F5;
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					padding: 0 10px;
-					box-sizing: border-box;
-
-					.left-layout {
-						color: #777777;
-					}
-
-					.right-layout {}
-
-					.startBox {
-						color: #777777;
-					}
-
-					text {
-						color: #777777;
-					}
-
-					.endBox {
-						color: #777777;
-					}
-
-					.timeIcon {}
-				}
-			}
-
-			.btnBox {
-				display: flex;
-				align-items: center;
-				margin-top: 15px;
-
-				.leftBtn {
-					width: 50%;
-					height: 74rpx;
-					line-height: 74rpx;
-					border: 1px solid #ccc;
-					border-radius: 12rpx;
-					color: #333333;
-					text-align: center;
-
-				}
-
-				.rightBtn {
-					width: 50%;
-					height: 74rpx;
-					line-height: 74rpx;
-					border: 1px solid #2388FF;
-					border-radius: 12rpx;
-					color: #fff;
-					text-align: center;
-					background: #2388FF;
-					margin-left: 15rpx;
-				}
-			}
-		}
-	}
-
-	.tableBox {
-		height: 100%;
-		padding: 30rpx;
-		box-sizing: border-box;
-		// height: 600px;
-		padding-bottom: 30px;
-
-
-		.liBox {
-			background: #fff;
-			padding: 0 30rpx;
-			box-sizing: border-box;
-			border-radius: 20rpx;
-			margin-bottom: 30rpx;
-			font-family: 'PingFang SC';
-
-			.headerCard {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				padding: 24rpx 0;
-
-				.schoolName {
-					font-size: 32rpx;
-					font-weight: 700;
-					font-family: 'PingFang SC';
-					color: #333333;
-					overflow: hidden;
-					word-wrap: break-word;
-					white-space: pre-wrap;
-					// font-size: 14px;
-					display: -webkit-box;
-					-webkit-box-orient: vertical;
-					-webkit-line-clamp: 1;
-				}
-
-				.statusBox {
-					width: 100rpx;
-					flex-shrink: 1;
-					text-align: center;
-					font-size: 24rpx;
-					border-radius: 8rpx;
-					color: #fff;
-					padding: 8rpx 12rpx;
-					font-family: 'PingFang SC';
-				}
-
-				.handle {
-					background: rgba(15, 175, 118, 0.1);
-					color: #0FAF76;
-				}
-
-				.nohandle {
-					background: rgba(239, 45, 45, 0.1);
-					color: rgba(239, 45, 45, 1);
-				}
-			}
-
-			.topCard {
-				display: flex;
-				border-top: 1px solid rgba(0, 0, 0, 0.1);
-				align-items: center;
-				padding: 20rpx 0;
-
-				.pic {
-					width: 120rpx;
-					height: 120rpx;
-
-					image {
-						width: 120rpx;
-						height: 120rpx;
-						border-radius: 4px;
-					}
-				}
-
-				.rightCard {
-					margin-left: 20rpx;
-					font-size: 26rpx;
-					font-family: 'PingFang SC';
-					width: calc(100% - 140rpx);
-				}
-			}
-
-			.midCard {
-				font-size: 26rpx;
-
-				.secondCard,
-				.thirdCard {
-					display: flex;
-					align-items: center;
-
-
-					.txt {
-						font-size: 26rpx;
-						font-family: 'PingFang SC';
-						margin-left: 10rpx;
-						color: #333333;
-					}
-				}
-
-				.thirdCard {
-					margin-top: 18rpx;
-				}
-			}
-
-			.btoCard {
-				border-top: 1px solid rgba(0, 0, 0, 0.1);
-				margin-top: 20rpx;
-				padding: 20rpx 0;
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				font-size: 26rpx;
-				font-family: 'PingFang SC';
-
-				.rightBox {
-					.txt {
-						width: 120rpx;
-						height: 60rpx;
-						line-height: 60rpx;
-						font-family: 'PingFang SC';
-						text-align: center;
-						background: #2388FF;
-						color: #fff;
-						border-radius: 80rpx;
-					}
-				}
-			}
-		}
-
-	}
-
-	// }
-</style>
\ No newline at end of file
diff --git a/monitorMobile/pages/earlyWarning/detail.vue b/monitorMobile/pages/earlyWarning/detail.vue
index 909ee27..1cae53f 100644
--- a/monitorMobile/pages/earlyWarning/detail.vue
+++ b/monitorMobile/pages/earlyWarning/detail.vue
@@ -1,9 +1,9 @@
 <template>
 	<view class="warningDetail">
 		<view class="title cli">
-			周界入侵-2024-08-20 18:01:41
+			{{detailData.alarmTypeDesc ? detailData.alarmTypeDesc + '-' + detailData.tick : ''}}
 		</view>
-		<image style="width: 100%;height:422rpx;" src="../../static/image/add.png" mode="aspectFit"></image>
+		<image style="width: 100%;height:422rpx;" :src="detailData.snapshotUrl" mode="aspectFit"></image>
 		<view class="cli">
 			<view class="labelBox">
 				所属学校：
@@ -17,31 +17,39 @@
 				班级：
 			</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>
 			<view class="valueBox">
-				类型
+				{{ detailData.cameraName || "--" }}
 			</view>
 		</view>
 		<view class="cli">
 			<view class="labelBox">
-				告警时间：
+				预警类型：
 			</view>
 			<view class="valueBox">
-				2024-8-24 16:42:13
+				{{ detailData.alarmTypeDesc || "--" }}
+			</view>
+		</view>
+		<view class="cli">
+			<view class="labelBox">
+				预警时间：
+			</view>
+			<view class="valueBox">
+				{{ detailData.tick || "--" }}
 			</view>
 		</view>
 		<view class="cli">
@@ -49,8 +57,8 @@
 				复核视频：
 			</view>
 			<view class="valueBox">
-				<text style="color: #2388FF;" @click="seeVideo">查看视频</text>
-				<text>暂无数据</text>
+				<text v-if="detailData.videoUrl" style="color: #2388FF;" @click="seeVideo(detailData.videoUrl)">查看视频</text>
+				<text v-else>--</text>
 			</view>
 		</view>
 		<view class="cli2">
@@ -58,7 +66,7 @@
 				备注信息：
 			</view>
 			<view class="valueBox">
-				暂无数据
+				{{ detailData.extend || '--' }}
 			</view>
 		</view>
 
@@ -67,7 +75,7 @@
 				处理意见：
 			</view>
 			<view class="valueBox">
-				暂无数据
+				{{ detailData.remark || '--' }}
 			</view>
 		</view>
 		<u-popup :show="showVideo" :closeable="true" @close="close" @open="open" mode="center">
@@ -78,7 +86,7 @@
 			<view class="poupBox">
 				<view style="width: 750rpx;height: 400rpx;">
 					<DomVideoPlayer ref="domVideoPlayer" object-fit='contain' :controls="controls" :autoplay="autoplay"
-						:loop="loop" :src="src" :playback-rate="playbackRate" :is-loading="isLoading" @play="onPlay"
+						:loop="loop" :src="urlsrc" :playback-rate="playbackRate" :is-loading="isLoading" @play="onPlay"
 						@pause="onPause" @ended="onEnded" @durationchange="onDurationChange" @timeupdate="onTimeUpdate"
 						@ratechange="onRateChange" @fullscreenchange="onFullscreenChange" />
 				</view>
@@ -89,6 +97,10 @@
 
 <script>
 	import DomVideoPlayer from '@/components/DomVideoPlayer/DomVideoPlayer.vue'
+	import {
+		detail, //详情
+		warnType, //获取预警类型
+	} from '@/api/warn/index.js'
 	// 将xx秒转为 xx:xx 分秒格式
 	const formatSec2Time = (time) => {
 		const min = Math.floor(time / 60)
@@ -101,10 +113,10 @@
 		},
 		data() {
 			return {
-				value1: '',
+				detailData: {},
 				showVideo: false,
 				// 视频参数
-				src: '',
+				urlsrc: '',
 				// src: 'http://deepvision.oss-cn-zhangjiakou.aliyuncs.com/acp/quanjiang/DEMO00001/20240708/video/wander/SXT001__quanjiang__DEMO00001_video_wm_1720400435638.mp4?Expires=1724745909&OSSAccessKeyId=STS.NV49VEGSbWMNi7Wp4e76VrWKk&Signature=wXTdiWQHGNp%2FtbtezUBmD%2Fziy1E%3D&security-token=CAIS0wN1q6Ft5B2yfSjIr5WBcuzxqoxD4I%2BlaxHmlDQwO7l6nZLgiTz2IHFMf3huCeodsv8%2BlGxS5%2FgelrpqVpZDR03Na8RHwrly1lv5O9KY4zIJb0D10s%2FLI3OaLjKm9hi7AYygPgK0GJqEb1TDiVUto9%2FTfimjWFqIKICAjYUdAP0cQgi%2Fa0gwZrJRPRAwh8IGEnHTOP2xUHvtmXGCNFd0nQB%2BhGhjk7TdpPeR8R3Dllb35%2FYIroDqWPieYtJrIY10XqWBvqx%2FfbGT1zVLuVoYtvV6gaFc5zbcv9abRFVf4hiCP6%2Ff6MBuNw5%2Fae94efZNp%2BOukuZj6K6B1db7xhtVI%2BBOUiPZA4mr2IzdBeqvNNcwc7m8F1no9YjXbsGs9EEGGStLaVgVI4F8dyAhWEd9FWjgR%2FX5qAyQUGCKULOY1aw6651xwmjz8MCCT1r1GOTBindGasVnMxh5Z0JMjDK9aNkKfgFUbVJ8BrGTCIh%2FYx0bsq7yowDIEyp71TRMo%2Bbu%2FDBhIifKpO4VN7AxMup1DPwu2wNCxKRpnrU0rgxd8uAx9DyyfH1x3TObqd7jjqzaKs3NYdtswV4BUlvK5CGWEjhzQEO8mJtNIDT39ax%2Bf3elrfsIeBqAAaamZEcVMZBN29tT2k9jMRQfJjNJzZRtx5Z4sYbOwDoRAq%2F4qEv07jBx5PUAAB3q9IqDapPoeUw8Yccvlo9q5VG8AsY%2BZkidTAw%2B7s7%2BTKuJC93tJfdSUYdycPZ%2BZneA%2BlZqpdvfhTtZCteGsdnoQU4H7x%2B9ph9K%2Bg3HGMQrtuFdIAA%3D',
 				playing: false,
 				loop: false,
@@ -129,16 +141,31 @@
 			// 	return `${curr} / ${dur}`
 			// },
 		},
+		onLoad(options) {
+			console.log(options)
+			if(options.id) {
+				this.id = options.id;
+			}
+			this.getInfo();
+		},
 		methods: {
-			seeVideo() {
+			getInfo() {
+				detail({ id: this.id }).then(res=>{
+					if(res.code == 200) {
+						this.detailData = res.data;
+					}
+				})
+			},
+			seeVideo(url) {
 				this.showVideo = true;
+				this.urlsrc = url;
 			},
 			open() {
 				// console.log('open');
 				setTimeout(() => {
 					this.src =
 						'http://deepvision.oss-cn-zhangjiakou.aliyuncs.com/acp/quanjiang/DEMO00001/20240708/video/wander/SXT001__quanjiang__DEMO00001_video_wm_1720400435638.mp4?Expires=1724748181&OSSAccessKeyId=STS.NTwCzwCtwDDYeE7RAhHue5mDb&Signature=qY%2F82lk1K9VJEX95ImeNH9wMHiw%3D&security-token=CAIS0wN1q6Ft5B2yfSjIr5fCCMDDrqtW84ayZ2OGtkE9RPpJ2qjvgDz2IHFMf3huCeodsv8%2BlGxS5%2FgelrpqVpZDR03Na8RHwrly1lv5O9KY4z1YIkL10s%2FLI3OaLjKm9hi7AYygPgK0GJqEb1TDiVUto9%2FTfimjWFqIKICAjYUdAP0cQgi%2Fa0gwZrJRPRAwh8IGEnHTOP2xUHvtmXGCNFd0nQB%2BhGhjk7TdpPeR8R3Dllb35%2FYIroDqWPieYtJrIY10XqWBvqx%2FfbGT1zVLuVoYtvV6gaFc5zbcv9abRFVf4hiCP6%2Ff6MBuNw5%2Fae94efZNp%2BOukuZj6K6B1db7xhtVI%2BBOUiPZA4mr2IzdBeqvNNcwc7m8F1no9YjXbsGs9EEGGStLaVgVI4F8dyAhWEd9FWjgR%2FX5qAyQUGCKULOY1aw6651xwmjz8MCCT1r1GOTBindGasVnMxh5Z0JMjDK9aNkKfgFUbVJ8BrGTCIh%2FYx0bsq7yowDIEyp71TRMo%2Bbu%2FDBhIifKpO4VN7AxMup1DPwu2wNCxKQmwS5Se2k%2BwM10kxsnMbhsSH5O0sXx5M%2B5TxBoZB5p9PtUj15fgYQDR12uT0nToulHQz7%2BX6zfLqvSrfsIeBqAAUdgBEBn%2BksEpfpynILn8V8z3O5GaZcm3NmplGe%2F2XtD9%2FbnSWWTEzR1JJ45DnANEEIGzfjd6UvxpIcrk5Ggr0I52UqVdGUhcovTegZXYeBMsXYze8OLsu0UOhtpHsy8nCCJzpNnrwUBZOfUdZtwsCYHC4Bs8BRQ9JORs4ECvUnyIAA%3D'
-				}, 3000)
+				}, 1000)
 			},
 			close() {
 				this.showVideo = false;
diff --git a/monitorMobile/pages/earlyWarning/index.vue b/monitorMobile/pages/earlyWarning/index.vue
index 9d08d44..3c25e2b 100644
--- a/monitorMobile/pages/earlyWarning/index.vue
+++ b/monitorMobile/pages/earlyWarning/index.vue
@@ -7,95 +7,378 @@
 			</view> -->
 
 			<view class="logo">
-				<!-- #ifdef H5 -->
 				<image src="@/static/image/earlyWarning/logo.png" mode="heightFix"></image>
-				<!-- #endif -->
-				<!-- #ifdef APP-PLUS || MP-ALIPAY || MP-WEIXIN -->
-
-				<!-- #endif -->
-			</view>
-			<!-- <view class="selectModel" @click="showSelectModel = true">
-				<view class="modelName">
-					{{modelObj.name}}
-				</view>
-				<image src="@/static/image/earlyWarning/down.png"></image>
 			</view>
-			<u-popup :show="showSelectModel" @close="close" @open="open" mode="bottom">
-				<view class="selectPopupBox">
-					<view class="modelLi" :class="item.id == isActive ? 'active' : ''" @click="modelChange(item)"
-						v-for="(item,i) in modelList">
-						{{item.name}}
-					</view>
-				</view>
-			</u-popup> -->
 		</view>
 		<view class="contentBox" @touchmove.stop @touch.stop>
-			<warningInfo v-if="isActive == '1'"></warningInfo>
-			<inspectionCenter v-else></inspectionCenter>
-		</view>
+			<view class="warningInfo">
+				<view class="searchBox">
+					<view class="searchLine" @click="openSearch">
+						<view class="searchLabels">
+							<image v-show="isShowSearch==false" src="@/static/image/earlyWarning/screen.png" mode="">
+							</image>
+							<image v-show="isShowSearch" src="@/static/image/earlyWarning/screenActive.png" mode="">
+							</image>
+							<text class="labels">筛选</text>
+							<view class="values">{{searchValue}}</view>
+						</view>
 
+						<view class="arrow">
+							<image v-show="isShowSearch==false" src="@/static/image/earlyWarning/arrow1.png" mode="">
+							</image>
+							<image v-show="isShowSearch" src="@/static/image/earlyWarning/arrow2.png" mode=""></image>
+						</view>
+					</view>
+					<view @click="isShowSearch=false" class="searchDialog" v-if="isShowSearch">
+						<view class="content" @click.stop="isSelect">
+							<u-row justify="space-between" gutter="10">
+								<u-col span="7">
+									<view class="demo-layout" @click="toOpen">
+										<view class="left-layout">
+											<text>{{searchForm.$alarmType || '预警类型'}}</text>
+										</view>
+										<view class="right-layout">
+											<image style="width: 30rpx;height:30rpx;"
+												src="@/static/image/earlyWarning/arrowRight.png" mode=""></image>
+										</view>
+									</view>
+								</u-col>
+								<u-col span="5">
+									<view class="demo-layout" @click="toOpenSelect">
+										<view class="left-layout">
+											<text>{{searchForm.$warnHand || '处理状态'}}</text>
+										</view>
+										<view class="right-layout">
+											<image style="width: 30rpx;height:30rpx;"
+												src="@/static/image/earlyWarning/arrowRight.png" mode=""></image>
+										</view>
+									</view>
+								</u-col>
+							</u-row>
+							<u-row style="margin-top:10px;" justify="space-between" gutter="10">
+								<u-col span="12">
+									<uni-datetime-picker v-model="searchForm.tick" type="datetimerange">
+										<view class="demo-layout">
+											<view class="startBox">
+												{{searchForm.StartTick || '开始时间'}}
+											</view>
+											<text>至</text>
+											<view class="endBox">
+												{{searchForm.EndTick || '结束时间'}}
+											</view>
+											<view class="timeIcon">
+												<image style="width: 30rpx;height:30rpx;"
+													src="@/static/image/earlyWarning/calendar.png" mode=""></image>
+											</view>
+										</view>
+									</uni-datetime-picker>
 
+								</u-col>
+							</u-row>
+							<view class="btnBox">
+								<view class="leftBtn" @click="clearform">
+									重置
+								</view>
+								<view class="rightBtn" @click="onsubmit">
+									确认
+								</view>
+							</view>
+						</view>
+					</view>
+
+				</view>
+				<view class="tableBox">
+					<u-empty marginTop="100rpx" :show="false" mode="list" text="暂无数据"></u-empty>
+					<!-- <u-pull-refresh :refreshing="refreshing" @refresh="onRefresh"> -->
+					<!-- <scroll-view class="scroll-view" scroll-y="true" refresher-enabled="true"
+						@refresher-pull="onRefresh" @refresher-refresh="doRefresh" @refresher-restore="restore"
+						@refresher-abort="abort"> -->
+					<u-list :loading="isLoading" refresher-enabled :refresher-triggered="isTriggered"
+						@refresher-pull="onRefresh" @scrolltolower="scrolltolower" style="height: calc(100% - 0rpx);">
+						<u-list-item v-for="(item, index) in warnList" :key="index">
+							<view class="liBox">
+								<view class="headerCard">
+									<view class="schoolName">
+										演示学校
+									</view>
+									<view class="statusBox" :class="[item.warnHand == 1?'handle':'nohandle']">
+										{{item.warnHand == 1 ? '已处理' : '未处理'}}
+									</view>
+								</view>
+								<view class="topCard">
+									<view class="pic">
+										<image :src="item.snapshotUrl" mode="aspectFill"
+											@click="previewImage(item.snapshotUrl,index)"></image>
+									</view>
+									<view class="rightCard">
+										<u-row>
+											<u-col span="6">
+												<view class="midContent">
+													姓名：--
+												</view>
+											</u-col>
+											<u-col span="6">
+												<view class="midContent">
+													系部：--
+												</view>
+											</u-col>
+										</u-row>
+										<u-row style="margin-top: 20rpx;">
+											<u-col span="6">
+												<view class="midContent">
+													专业：--
+												</view>
+											</u-col>
+											<u-col span="6">
+												<view class="midContent">
+													班级：{{item.personSetName || '--'}}
+												</view>
+											</u-col>
+										</u-row>
+
+									</view>
+								</view>
+								<view class="midCard">
+									<view class="secondCard">
+										<image style="width: 30rpx;height: 30rpx;"
+											src="@/static/image/earlyWarning/warnType.png" mode=""></image>
+										<view class="txt">
+											预警类型：{{item.alarmTypeDesc || '--'}}
+										</view>
+									</view>
+									<view class="thirdCard">
+										<image style="width: 30rpx;height: 30rpx;"
+											src="@/static/image/earlyWarning/warnVideo.png" mode=""></image>
+										<view class="txt">
+											预警摄像头：{{item.cameraName || '--'}}
+										</view>
+									</view>
+
+								</view>
+								<view class="btoCard">
+									<view class="btoContent">
+										时间：{{item.tick}}
+									</view>
+									<view class="rightBox btoBox" @click="toDetail(item)">
+										<view class="txt">
+											查看
+										</view>
+									</view>
+								</view>
+							</view>
+						</u-list-item>
+						<u-loadmore :status="status" />
+					</u-list>
+					<!-- </scroll-view> -->
+					<!-- </u-pull-refresh> -->
+				</view>
+				<selectSearch ref="selectSearchBox" :cellVisible="false" v-model="searchForm.alarmType"
+					:options="warnOption" :title.sync="searchForm.$alarmType" placeholder="预警类型"
+					search-placeholder="预警类型" />
+				<selectRadio ref="selectRadioBox" :cellVisible="false" v-model="searchForm.warnHand"
+					:options="handOption" :title.sync="searchForm.$warnHand" placeholder="处理状态" />
+			</view>
+		</view>
 	</view>
 </template>
 
 <script>
-	import warningInfo from "./components/warningInfo.vue"
-	import inspectionCenter from "./components/inspectionCenter.vue"
-
+	import selectRadio from "@/components/selectRadio.vue"
+	import selectSearch from "@/components/selectSearch.vue"
+	import {
+		page, //获取列表
+		warnType, //获取预警类型
+	} from '@/api/warn/index.js'
 	export default {
 		components: {
-			warningInfo,
-			inspectionCenter
+			selectRadio,
+			selectSearch
 		},
 		data() {
 			return {
-
-				showSelectModel: false,
-				modelObj: {
-					name: '预警信息',
-					backgroundImg: require(`@/static/image/earlyWarning/warnBack.png`)
+				searchValue: '',
+				isShowSearch: false,
+				isTriggered: true,
+				searchForm: {
+					alarmType: '',
+					$alarmType: '全部',
+					warnHand: '',
+					$warnHand: '',
+					tick: [],
+					StartTick: '',
+					EndTick: '',
+					pageNum: 1,
+					pageSize: 10
 				},
-				isActive: '1',
-				modelList: [{
-						id: '1',
-						name: '预警信息',
-						imgUrl: require(`@/static/image/earlyWarning/warnBack.png`)
+				warnOption: [],
+				handOption: [{
+						label: '已处理',
+						value: 1
 					},
 					{
-						id: '2',
-						name: '巡检中心',
-						imgUrl: require(`@/static/image/earlyWarning/majorBack.png`)
-					}
+						label: '未处理',
+						value: 0
+					},
 				],
-
+				warnList: [],
+				isLoading: false,
+				finished: false,
+				refreshing: false,
+				status: 'loadmore', //loading正在加载 loadmore加载更多 nomore没有更多了
 			}
 		},
+		watch: {
+			"searchForm.tick"() {
+				console.log('日期时间:', this.searchForm.tick);
+
+				if (this.searchForm.tick && this.searchForm.tick.length > 0) {
+					this.searchForm.StartTick = this.searchForm.tick[0]
+					this.searchForm.EndTick = this.searchForm.tick[1]
+				}
+
+			},
+		},
+		onLoad() {
+			// 获取预警类型
+			this.getWarnTypeList()
+			// 隐藏导航栏
+			this.loadmore()
+		},
 		methods: {
-			open() {
-				// console.log('open');
+
+			onRefresh() {
+				// this.refreshing = true;
+				console.log('下拉刷新')
+			},
+			// 执行刷新操作
+			doRefresh() {
+				console.log('正在刷新...');
+				// 这里执行刷新数据的逻辑
+				this.searchForm.pageNum = 1;
+				this.warnList = [];
+				this.loadmore()
+				setTimeout(() => {
+					// 刷新数据完成后，调用restore或abort方法结束刷新状态
+					this.restore();
+				}, 2000);
+			},
+			// 刷新结束，恢复scroll-view
+			restore() {
+				console.log('刷新结束');
 			},
-			close() {
-				this.showSelectModel = false;
-				// console.log('close');
+			// 刷新结束，取消scroll-view的刷新状态
+			abort() {
+				console.log('取消刷新');
 			},
-			// 切换模块
-			modelChange(item) {
-				console.log(item)
-				this.modelObj.name = item.name;
-				this.modelObj.backgroundImg = item.imgUrl;
-				this.isActive = item.id;
-				this.showSelectModel = false;
-				// switch (item.id) {
-				// 	case '1':
-
-				// 		break;
-				// 	case '2':
-				// 		break;
-				// 	default:
-				// 		break;
-				// }
+			// 预览图片
+			previewImage(url, index) {
+				// 使用uni.previewImage API 进行图片预览
+				uni.previewImage({
+					current: index, // 当前显示图片索引
+					urls: [url] // 需要预览的图片链接列表
+				});
 			},
+			clearform() {
+				this.searchForm = {
+					alarmType: '',
+					$alarmType: '全部',
+					warnHand: '',
+					$warnHand: '',
+					tick: [],
+					StartTick: '',
+					EndTick: '',
+					pageNum: 1,
+					pageSize: 10
+				}
+				// this.isShowSearch = false;
+			},
+			onsubmit() {
+				let arr = []
+				for (let key in this.searchForm) {
+					if (['$alarmType', '$warnHand', 'StartTick', 'EndTick'].includes(key)) {
+						if (Object.hasOwnProperty.call(this.searchForm, key) && this.searchForm[key]) {
+							arr.push(this.searchForm[key])
+						}
+					}
+				}
+				this.searchValue = arr.join('，');
+				this.isShowSearch = false;
+				this.status = 'loadmore'
+				this.searchForm.pageNum = 1;
+				this.warnList = []
+				this.loadmore()
+			},
+			// 获取预警类型
+			getWarnTypeList() {
+				warnType({}).then(res => {
+					let {
+						code,
+						data
+					} = res;
+
+					if (code == 200) {
+						this.warnOption = data.map(item => {
+							return {
+								label: item.name,
+								value: item.code
+							};
+						})
+						this.warnOption.unshift({
+							label: '全部',
+							value: ''
+						})
+					}
+				});
+
 
+			},
+			// 跳转详情页面
+			toDetail(row) {
+				uni.navigateTo({
+					url: '/pages/earlyWarning/detail?id=' + row.id
+				});
+			},
+			// 预警类型弹框筛选
+			toOpen() {
+				this.$refs.selectSearchBox.show = true;
+			},
+			// 处理情况筛选
+			toOpenSelect() {
+				this.$refs.selectRadioBox.show = true;
+			},
+			// 打开筛选框
+			openSearch() {
+				this.isShowSearch = !this.isShowSearch;
+			},
+			isSelect() {
+
+			},
+			scrolltolower() {
+				if (this.status == 'loading' || this.status == 'nomore') {
+					return;
+				}
+				this.searchForm.pageNum += 1;
+				this.loadmore()
+			},
+			loadmore() {
+				if (this.status != 'loadmore') return
+				this.status = 'loading'
+				this.isLoading = true;
+				delete this.searchForm.tick
+				page(this.searchForm).then(res => {
+					if (res?.code === 200) {
+						this.warnList = [...this.warnList, ...res?.data?.list];
+						this.isLoading = false;
+						// 获取到的总条数>=接口总条数
+						if (this.warnList.length >= res.data.total) {
+							this.status = 'nomore'
+						} else {
+							this.status = 'loadmore'
+						}
+					}
+
+				})
+			}
 		}
 	}
 </script>
@@ -108,7 +391,7 @@
 			/*#ifdef H5*/
 			height: 272rpx;
 			background: url("@/static/image/earlyWarning/back2.png") no-repeat center center / cover;
-			
+
 			/*#endif*/
 			/*#ifdef APP-PLUS || MP-ALIPAY || MP-WEIXIN*/
 			height: 340rpx;
@@ -152,7 +435,310 @@
 			/*#endif*/
 			/*#ifdef APP-PLUS || MP-ALIPAY || MP-WEIXIN*/
 			height: calc(100% - 375rpx);
+
 			/*#endif*/
+			.warningInfo {
+				width: 100%;
+				height: 100%;
+				background: #F6F8FA;
+
+				.u-modal__title {
+					color: #000000;
+				}
+			}
+
+			.searchBox {
+				// height: calc(100% - 360rpx);
+				position: relative;
+
+				.searchLine {
+					height: 88rpx;
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					padding: 0 15px;
+					box-sizing: border-box;
+					background: #fff;
+					font-size: 28rpx;
+
+					.searchLabels {
+						display: flex;
+						align-items: center;
+						width: calc(100% - 34rpx);
+
+						image {
+							width: 40rpx;
+							height: 40rpx;
+							flex-shrink: 1;
+						}
+
+						.labels {
+							width: 70rpx;
+							display: block;
+							color: #333333;
+							margin-left: 10rpx;
+							flex-shrink: 1;
+						}
+
+						.values {
+							width: calc(100% - 40rpx - 50rpx);
+							color: #2388FF;
+							font-weight: 700;
+							margin-left: 18rpx;
+							overflow: hidden;
+							word-wrap: break-word;
+							white-space: pre-wrap;
+							display: -webkit-box;
+							-webkit-box-orient: vertical;
+							-webkit-line-clamp: 1;
+						}
+					}
+
+
+					.arrow {
+						// text-align: right;
+						// flex-shrink: 1;
+
+						image {
+							width: 34rpx;
+							height: 34rpx;
+						}
+					}
+
+					.leftSearchBox {
+						display: flex;
+						align-items: center;
+						width: calc(100% - 40px);
+
+						.searchLabel {
+							flex-shrink: 1;
+							color: #333333;
+							width: 80px;
+						}
+
+						.searchValue {
+							width: calc(100% - 60px);
+							margin-left: 10px;
+							color: #2388FF;
+							overflow: hidden;
+							word-wrap: break-word;
+							white-space: pre-wrap;
+							display: -webkit-box;
+							-webkit-box-orient: vertical;
+							-webkit-line-clamp: 1;
+						}
+					}
+				}
+
+				.searchDialog {
+					position: absolute;
+					z-index: 990;
+					top: 89rpx;
+					width: 100%;
+					height: calc(100vh - 375rpx - 60rpx);
+					font-size: 26rpx;
+					background: rgba(0, 0, 0, 0.2);
+
+					.content {
+						background: #FFFFFF;
+						padding: 15px;
+						box-sizing: border-box;
+						border-top: 1px solid rgba(0, 0, 0, 0.1);
+
+						.demo-layout {
+							height: 80rpx;
+							border-radius: 8rpx;
+							background: #F5F5F5;
+							display: flex;
+							justify-content: space-between;
+							align-items: center;
+							padding: 0 10px;
+							box-sizing: border-box;
+
+							.left-layout {
+								color: #777777;
+							}
+
+							.right-layout {}
+
+							.startBox {
+								color: #777777;
+							}
+
+							text {
+								color: #777777;
+							}
+
+							.endBox {
+								color: #777777;
+							}
+
+							.timeIcon {}
+						}
+					}
+
+					.btnBox {
+						display: flex;
+						align-items: center;
+						margin-top: 15px;
+
+						.leftBtn {
+							width: 50%;
+							height: 74rpx;
+							line-height: 74rpx;
+							border: 1px solid #ccc;
+							border-radius: 12rpx;
+							color: #333333;
+							text-align: center;
+
+						}
+
+						.rightBtn {
+							width: 50%;
+							height: 74rpx;
+							line-height: 74rpx;
+							border: 1px solid #2388FF;
+							border-radius: 12rpx;
+							color: #fff;
+							text-align: center;
+							background: #2388FF;
+							margin-left: 15rpx;
+						}
+					}
+				}
+			}
+
+			.tableBox {
+				height: 100%;
+				padding: 30rpx;
+				box-sizing: border-box;
+				// height: 600px;
+				padding-bottom: 30px;
+
+
+				.liBox {
+					background: #fff;
+					padding: 0 30rpx;
+					box-sizing: border-box;
+					border-radius: 20rpx;
+					margin-bottom: 30rpx;
+					font-family: 'PingFang SC';
+
+					.headerCard {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						padding: 24rpx 0;
+
+						.schoolName {
+							font-size: 32rpx;
+							font-weight: 700;
+							font-family: 'PingFang SC';
+							color: #333333;
+							overflow: hidden;
+							word-wrap: break-word;
+							white-space: pre-wrap;
+							// font-size: 14px;
+							display: -webkit-box;
+							-webkit-box-orient: vertical;
+							-webkit-line-clamp: 1;
+						}
+
+						.statusBox {
+							width: 100rpx;
+							flex-shrink: 1;
+							text-align: center;
+							font-size: 24rpx;
+							border-radius: 8rpx;
+							color: #fff;
+							padding: 8rpx 12rpx;
+							font-family: 'PingFang SC';
+						}
+
+						.handle {
+							background: rgba(15, 175, 118, 0.1);
+							color: #0FAF76;
+						}
+
+						.nohandle {
+							background: rgba(239, 45, 45, 0.1);
+							color: rgba(239, 45, 45, 1);
+						}
+					}
+
+					.topCard {
+						display: flex;
+						border-top: 1px solid rgba(0, 0, 0, 0.1);
+						align-items: center;
+						padding: 20rpx 0;
+
+						.pic {
+							width: 120rpx;
+							height: 120rpx;
+
+							image {
+								width: 120rpx;
+								height: 120rpx;
+								border-radius: 4px;
+							}
+						}
+
+						.rightCard {
+							margin-left: 20rpx;
+							font-size: 26rpx;
+							font-family: 'PingFang SC';
+							width: calc(100% - 140rpx);
+						}
+					}
+
+					.midCard {
+						font-size: 26rpx;
+
+						.secondCard,
+						.thirdCard {
+							display: flex;
+							align-items: center;
+
+
+							.txt {
+								font-size: 26rpx;
+								font-family: 'PingFang SC';
+								margin-left: 10rpx;
+								color: #333333;
+							}
+						}
+
+						.thirdCard {
+							margin-top: 18rpx;
+						}
+					}
+
+					.btoCard {
+						border-top: 1px solid rgba(0, 0, 0, 0.1);
+						margin-top: 20rpx;
+						padding: 20rpx 0;
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+						font-size: 26rpx;
+						font-family: 'PingFang SC';
+
+						.rightBox {
+							.txt {
+								width: 120rpx;
+								height: 60rpx;
+								line-height: 60rpx;
+								font-family: 'PingFang SC';
+								text-align: center;
+								background: #2388FF;
+								color: #fff;
+								border-radius: 80rpx;
+							}
+						}
+					}
+				}
+
+			}
 		}
 	}
 </style>
\ No newline at end of file
diff --git a/monitorMobile/pages/earlyWarning/processingResults.vue b/monitorMobile/pages/earlyWarning/processingResults.vue
deleted file mode 100644
index 4e51a47..0000000
--- a/monitorMobile/pages/earlyWarning/processingResults.vue
+++ /dev/null
@@ -1,64 +0,0 @@
-<template>
-	<view class="processingResults">
-		<view class="tips" v-if="callBackType == 'success'">
-			<image class="auto" src="@/static/image/earlyWarning/success.png" mode=""></image>
-			<view class="title auto">
-				提交成功
-			</view>
-			<u-button class="auto" style="width: 60%" shape="circle" type="primary" @click="back">知道了</u-button>
-		</view>
-		<view class="tips" v-else>
-			<image class="auto" src="@/static/image/earlyWarning/falid.png" mode=""></image>
-			<view class="title auto">
-				提交失败
-			</view>
-			<u-button class="auto" style="width: 60%" shape="circle" type="primary" @click="back">重新提交</u-button>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				callBackType: 'success'
-			}
-		},
-		methods: {
-			back() {
-				uni.switchTab({
-				    url: '/pages/earlyWarning/index'
-				});
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.processingResults {
-		width: 100%;
-		height: 100%;
-		background: #fff;
-		.tips {
-			width: 100%;
-			text-align: center;
-			margin-top: 200rpx;
-			image {
-				width: 300rpx;
-				height: 268rpx;
-				margin: 0 auto;
-			}
-			.auto {
-				margin: 0 auto;
-			}
-			.title {
-				text-align: center;
-				color: #333333;
-				font-weight: 700;
-				margin: 20rpx 0 120rpx 0;
-			}
-			
-			
-		}
-	}
-</style>
\ No newline at end of file
diff --git a/monitorMobile/pages/monitor/index.vue b/monitorMobile/pages/monitor/index.vue
index 7e7b426..d01532c 100644
--- a/monitorMobile/pages/monitor/index.vue
+++ b/monitorMobile/pages/monitor/index.vue
@@ -16,7 +16,7 @@
 					<image v-show="isShowSearch" src="@/static/image/earlyWarning/group2.png" mode="">
 					</image>
 					<text class="labels">选择分组</text>
-					<view class="values">一号楼/厨房</view>
+					<view class="values">{{this.searchForm.groupName}}</view>
 				</view>
 
 				<view class="arrow">
@@ -51,7 +51,7 @@
 							</view>
 						</u-col>
 					</u-row>
-					
+
 					<view class="btnBox">
 						<view class="leftBtn" @click="clearform">
 							重置
@@ -66,31 +66,31 @@
 		<view class="tableBox">
 			<u-empty marginTop="100rpx" :show="false" mode="list" text="暂无数据"></u-empty>
 			<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 0rpx);">
-				<u-list-item v-for="(item, index) in warnList" :key="index">
+				<u-list-item v-for="(item, index) in monitorList" :key="index">
 					<view class="liBox">
 						<view class="topCard">
 							<view class="pic">
-								<image src="@/static/image/earlyWarning/warnBack.png" mode="aspectFill"></image>
+								<image :src="item.snapshotUrl" mode="aspectFill"></image>
 								<view class="resolvingPower">
-									2560*1440
+									{{item.resWidth}}*{{item.resHeight}}
 								</view>
 							</view>
 							<view class="rightCard">
 								<view class="firstCard">
 									<view class="schoolName">
-										摄像头ID：SXT001
+										摄像头ID：{{item.sensorId}}
 									</view>
 								</view>
 								<view class="secondCard">
 
 									<view class="txt">
-										摄像头名称：厨房（良景）
+										摄像头名称：{{item.sensorName}}
 									</view>
 								</view>
 								<view class="thirdCard">
 
 									<view class="txt">
-										设备IP：192.168.10.130
+										设备IP：{{item.directUrlIp}}
 									</view>
 								</view>
 							</view>
@@ -103,7 +103,7 @@
 									所属学校：演示学校
 								</view>
 							</view>
-							<view class="rightBox btoBox" @click="deleteClick(item)">
+							<view class="rightBox btoBox" @click="startClick(item.sensorId)">
 								<view class="txt">
 									播放
 								</view>
@@ -132,6 +132,12 @@
 
 <script>
 	import tkiTree from '@/components/tki-tree/tki-tree.vue';
+	import {
+		groupList, //获取摄像头分组
+		list, //获取摄像头列表
+		startUrl, //说去视频地址
+		stopUrl //停止视频流获取
+	} from '@/api/monitor/index.js'
 	export default {
 		components: {
 			tkiTree
@@ -148,124 +154,51 @@
 				videoTitle: '',
 				isShowSearch: false,
 				searchForm: {
-					alarmType: '警告类型',
-					warnHand: '处理状态',
-					tick: [],
-					StartTick: '开始时间',
-					EndTick: '结束时间',
+					groupId: '',
+					pageNum: 1,
+					pageSize: 10
 				},
-				warnList: [{
-					warnHand: 1
-				}, {
-					warnHand: 0
-				}, {
-					warnHand: 1
-				}, {
-					warnHand: 1
-				}, {
-					warnHand: 1
-				}, {}, {}, {}, {}, ],
+				monitorList: [],
 				isLoading: false,
 				status: 'loadmore', //loading正在加载 loadmore加载更多 nomore没有更多了
-				listc: [{
-						code: 1,
-						name: 'dasda'
-					}, {
-						code: 2,
-						name: 'dasda'
-					},
-					{
-						code: 3,
-						name: 'dasda'
-					},
-					{
-						code: 4,
-						name: 'dasda'
-					},
-					{
-						code: 5,
-						name: 'dasda'
-					},
-					{
-						code: 6,
-						name: 'dasda'
-					},
-					{
-						code: 7,
-						name: 'dasda'
-					},
-					{
-						code: 8,
-						name: 'dasda'
-					},
-					{
-						code: 9,
-						name: 'dasda'
-					},
-					{
-						code: 10,
-						name: 'dasda'
-					},
-					{
-						code: 11,
-						name: 'dasda'
-					},
-					{
-						code: 12,
-						name: 'dasda'
-					},
-					{
-						code: 13,
-						name: '你好'
-					}
-				],
-				treelist: [{
-					name: '111',
-					value: '1',
-					children: [{
-						name: '111',
-						value: '2',
-					}]
-				}],
+				treelist: [],
 				multiple: false, //是否多选
 				selectParent: true, //父级可选择
 				flod: false, //折叠
-				player: null
+				player: null,
+				sensorId: '',
+				videoUrl: '',
+				streamId: '',
+				videoToken: '',
 			}
 		},
 		watch: {
-			"searchForm.tick"() {
-				console.log('日期时间:', this.searchForm.tick);
 
-				if (this.searchForm.tick && this.searchForm.tick.length > 0) {
-					this.searchForm.StartTick = this.searchForm.tick[0]
-					this.searchForm.EndTick = this.searchForm.tick[1]
-				}
-
-			},
 		},
 		mounted() {
 
 		},
 		onLoad() {
-			// 隐藏导航栏
+			this.getGroupList()
+			// 获取列表数据
 			this.loadmore()
 		},
 		methods: {
+			
 			setVideo() {
 				this.loadWebPlayerSDK().then(() => {
 					// 如果需要使用自定义组件，打开以下注释
 					// this.loadComponent().then(() => {
 					this.player = new Aliplayer({
 						id: "url-player-test",
-						source: "artc://rts-pull-live.deepeleph.com/quanjiang_DEMO00001/SXT003-0?auth_key=1724987674-0-0-df36ae3670785249c50e05cdb93e28ea&aliyun_uuid=286f58e41cc04c0393434b6856f29d07",
+						source: this.videoUrl + "&subaudio=no&jitterbuffer=6000",
 						width: "100%",
 						height: "100%",
 						isLive: true,
 						rtsFallback: true,
 						rtsFallbackType: 'HLS',
 					}, function(player) {
-						player.mute()
+						// player.mute()
 					});
 
 					this.player.one('canplay', function() {
@@ -281,8 +214,19 @@
 				});
 			},
 			closeDialog() {
-				this.player.dispose();
+				if (this.player) {
+					this.player.dispose();
+				}
+
 				this.showVideo = false;
+				let params = {
+					sensorId: this.sensorId,
+					streamId: this.streamId,
+					videoToken: this.videoToken
+				};
+				stopUrl(params).then(res => {
+
+				})
 			},
 			loadWebPlayerSDK() {
 				return new Promise((resolve, reject) => {
@@ -319,9 +263,6 @@
 				});
 			},
 
-
-
-
 			addAttribute(data) { // tree结构递归添加属性
 				for (var i = 0; i < data.length; i++) {
 					data[i].isShow = false
@@ -334,8 +275,12 @@
 			},
 			// 确定回调事件
 			treeConfirm(e) {
-				// this.form.groupName = e[0].name
-				// this.form.groupId = e[0].id
+				this.searchForm.groupName = e[0].name;
+				this.searchForm.groupId = e[0].id;
+				this.status = 'loadmore'
+				this.searchForm.pageNum = 1;
+				this.monitorList = []
+				this.loadmore()
 			},
 			// 取消回调事件
 			treeCancel(e) {
@@ -346,63 +291,68 @@
 				this.$refs.tkitree._show();
 			},
 			cancelVideo() {
-				console.log(11111)
 				this.showVideo = false;
 			},
-			deleteClick() {
+			getGroupList() {
+			  groupList({}).then((res) => {
+			    if (res.code == 200) {
+			      this.treelist = [...[{id: "",name: "全部"}], ...res.data];
+			    }
+			  });
+			},
+			// 获取视频地址
+			startClick(id) {
+				this.sensorId = id;
 				this.showVideo = true;
-				this.setVideo()
+				
+				startUrl({
+					sensorId: id
+				}).then(res => {
+					
+					let {
+						code,
+						data
+					} = res;
+					if (code == 200) {
+						this.videoUrl = data.rtsPullStreamUrls[0].url;
+						this.streamId = data.streamId;
+						this.videoToken = data.videoToken;
+						this.setVideo()
+					}
+				})
+
 			},
 			confirmVideo() {
 				this.showVideo = false;
 			},
-			// 跳转处理页面
-			toHandle(row) {
-				if (row.warnHand == 1) {
-					uni.navigateTo({
-						url: '/pages/earlyWarning/handlingSuggestions'
-					});
-				}
 
-			},
-			// 跳转详情页面
-			toDetail(row) {
-				uni.navigateTo({
-					url: '/pages/earlyWarning/detail'
-				});
-			},
-			// 预警类型弹框筛选
-			toOpen() {
-				this.$refs.selectSearchBox.show = true;
-			},
-			// 处理情况筛选
-			toOpenSelect() {
-				this.$refs.selectRadioBox.show = true;
-			},
-			// 打开筛选框
-			openSearch() {
-				this.isShowSearch = !this.isShowSearch;
-			},
 			isSelect() {
 
 			},
 			scrolltolower() {
+				if (this.status == 'loading' || this.status == 'nomore') {
+					return;
+				}
+				this.searchForm.pageNum += 1;
 				this.loadmore()
 			},
 			loadmore() {
 				if (this.status != 'loadmore') return
 				this.status = 'loading'
-				setTimeout(() => {
-					for (let i = 0; i < 1; i++) {
-						this.warnList.push({}, {})
-					}
-					// 获取到的总条数>=接口总条数
-					if (this.warnList.length >= 14) {
-						this.status = 'nomore'
-					} else {
-						this.status = 'loadmore'
+				this.isLoading = true;
+				list(this.searchForm).then(res => {
+					if (res?.code === 200) {
+						this.monitorList = [...this.monitorList, ...res?.data?.list];
+						this.isLoading = false;
+						// 获取到的总条数>=接口总条数
+						if (this.monitorList.length >= res.data.total) {
+							this.status = 'nomore'
+						} else {
+							this.status = 'loadmore'
+						}
 					}
-				}, 2000)
+
+				})
 			}
 		}
 	}
@@ -442,6 +392,7 @@
 				// z-index: 1000000;
 				width: 100%;
 				height: 500rpx;
+				background: #000;
 				// margin: 50rpx auto;
 			}