fix

virgo.wzfrontend/console/src/assets/scss/index.scss

@@ -123,6 +123,12 @@
 .el-switch.is-checked .el-switch__core {
 	background: $--color-primary;
 }
+
+.hui-no-tips{
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
 
 .hui-flex {
 	width: 100%;
@@ -1519,6 +1525,10 @@
 		font-size: 19px;
 	}
 	
+	.el-icon-place{
+		font-size: 16px;
+	}
+	
 	.active{
 		color: $--color-primary;
 	}

virgo.wzfrontend/console/src/components/common/empty.vue

@@ -42,6 +42,7 @@
 			margin-top: 10px;
 			opacity: 0.6;
 			line-height: 20px;
+			font-size: 12px;
 		}
 	}
 </style>

virgo.wzfrontend/console/src/components/common/projectItemTree.vue

@@ -1,24 +1,31 @@
 <template>
-	<div class="project-item-tree">
-		<el-collapse>
-			<el-collapse-item v-for="item in treeData" :key="item.id">
-				<template slot="title">
-					<i class="iconfont huifont-shuzhuangcaidantubiao"></i>
-					<span class="el-collapse-name">{{item.name}}</span>
-				</template>
-				<div>
-					<el-tree :data="item.projectItemTargetList" :props="defaultProps">
-						<div class="custom-tree-node" slot-scope="{ node, data }">
-							<div class="label">{{node.label}}</div>
-							<div :class="nowData.id === data.id ? 'active':''" @click.stop="nodeClick(data)">
-								<i :class="iconfontClass"></i>
+	<div class="hui-left-tree">
+		<div class="hui-left-tree-title">
+			<svg-icon name="zhuangshi" width="16" height="20"></svg-icon>
+			<span class="hui-left-tree-sub">{{title}}</span>
+		</div>
+		<div class="hui-left-tree-content">
+			<el-collapse>
+				<el-collapse-item v-for="item in treeData" :key="item.id">
+					<template slot="title">
+						<i class="iconfont huifont-shuzhuangcaidantubiao"></i>
+						<span class="el-collapse-name">{{item.name}}</span>
+					</template>
+					<div>
+						<el-tree :data="item.projectItemTargetList" :props="defaultProps">
+							<div class="custom-tree-node" slot-scope="{ node, data }">
+								<div class="label">{{node.label}}</div>
+								<div :class="nowData.id === data.id ? 'active':''" @click.stop="nodeClick(data)">
+									<i :class="iconfontClass"></i>
+								</div>
 							</div>
-						</div>
-					</el-tree>
-				</div>
-			</el-collapse-item>
-		</el-collapse>
+						</el-tree>
+					</div>
+				</el-collapse-item>
+			</el-collapse>
+		</div>
 	</div>
+
 </template>
 
 <script>
@@ -27,6 +34,10 @@
 	} from '@/httpApi/space'
 	export default {
 		props: {
+			title: {
+				type: String,
+				default: '空间列表'
+			},
 			iconfontClass: {
 				type: String,
 				default: 'iconfont huifont-shexiangtou'

virgo.wzfrontend/console/src/components/system/level/deviceLevels.vue

@@ -0,0 +1,141 @@
+<template>
+	<div class="device-level hui-flex">
+		<div class="hui-chart-title">
+			设备监测类型 <i class="iconfont huifont-xinzeng" @click="insert(-1)"></i>
+		</div>
+		<div class="hui-flex-box">
+			<el-tree :data="list" :props="defaultProps" default-expand-all>
+				<div class="tree-node" slot-scope="{ node, data }">
+					<span class="tree-node-label">
+						{{data.name}}-{{data.totalNumber}}-{{data.openNumber}}-{{data.faultNumber}}-{{data.closeNumber}}
+					</span>
+					<div class="tree-node-operation">
+						<i class="iconfont huifont-xinzeng" @click.stop="insert(data.id)"></i>
+						<i class="iconfont huifont-bianji" @click.stop="update(data)"></i>
+						<i class="iconfont huifont-shanchu" @click.stop="deleteModel(data.id)"></i>
+					</div>
+				</div>
+			</el-tree>
+			<el-dialog :close-on-click-modal="false" :title="form.id?'编辑':'新增'" :visible.sync="dialogVisible"
+				width="900px" :append-to-body="true">
+				<div class="hui-flex hui-dialog">
+					<div class="hui-flex-box hui-dialog-content">
+						<el-form ref="form" :model="form" label-position="top">
+							<el-form-item label="类型名称">
+								<el-input v-model="form.name"></el-input>
+							</el-form-item>
+							<el-form-item label="设备总数">
+								<el-input type="number" v-model="form.totalNumber"></el-input>
+							</el-form-item>
+							<el-form-item label="开启数">
+								<el-input type="number" v-model="form.openNumber"></el-input>
+							</el-form-item>
+							<el-form-item label="故障数数">
+								<el-input type="number" v-model="form.faultNumber"></el-input>
+							</el-form-item>
+							<el-form-item label="关闭数数">
+								<el-input type="number" v-model="form.closeNumber"></el-input>
+							</el-form-item>
+						</el-form>
+					</div>
+					<div class="hui-dialog-submit">
+						<el-button size="medium" @click="dialogVisible = false">取 消</el-button>
+						<el-button size="medium" type="primary" @click="submit">保 存</el-button>
+					</div>
+				</div>
+			</el-dialog>
+		</div>
+	</div>
+</template>
+
+<script>
+	import {
+		getDeviceModel,
+		insertDeviceModel,
+		updateDeviceModel,
+		deleteDeviceModel
+	} from '@/httpApi/test'
+	export default {
+		data() {
+			return {
+				list: [],
+				defaultProps: {
+					label: 'name'
+				},
+				dialogVisible: false,
+				form: {
+					parentId: '',
+					name: '',
+					totalNumber: 0,
+					openNumber: 0,
+					faultNumber: 0,
+					closeNumber: 0
+				}
+			}
+		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init() {
+				getDeviceModel(this.$store.getters.project.id).then(res => {
+					if (res.state) {
+						this.list = res.data;
+					}
+				})
+			},
+			insert(id) {
+				this.form = {
+					name: '',
+					sign: '',
+					remark: '',
+					parentId: id,
+					isp: 1
+				}
+				this.dialogVisible = true;
+			},
+			update(data) {
+				this.form = JSON.parse(JSON.stringify(data));
+				this.dialogVisible = true;
+			},
+			submit() {
+				this.form['projectId'] = this.$store.getters.project.id;
+				this.form.id ? updateDeviceModel(this.form).then(this.successFunc) : insertDeviceModel(this.form).then(this
+					.successFunc);
+			},
+			successFunc(res) {
+				if (res.state) {
+					this.$message.success('操作成功');
+					this.init();
+					this.dialogVisible = false;
+				}
+			},
+			deleteModel(id) {
+				this.$confirm('确定要删除该层级?', () => {
+					deleteDeviceModel(id).then(res => {
+						if (res.state) {
+							this.init();
+							this.$message.success('操作成功');
+						}
+					})
+				});
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.device-level {
+		padding: 10px;
+		background: rgba(0, 4, 10, 0.3);
+
+		.tree-node-operation {
+			display: flex;
+			align-items: center;
+		}
+
+		.huifont-xinzeng {
+			font-size: 14px;
+		}
+	}
+</style>

virgo.wzfrontend/console/src/components/work/common/testAlarm.vue

@@ -7,7 +7,7 @@
 				</div>
 				<div class="test-label">
 					<div class="test-name">设备总数</div>
-					<div class="test-value alibaba">100</div>
+					<div class="test-value alibaba">{{testCount.totalNumber}}</div>
 				</div>
 			</div>
 			<div class="test-item">
@@ -16,7 +16,7 @@
 				</div>
 				<div class="test-label">
 					<div class="test-name">运行设备</div>
-					<div class="test-value alibaba">86</div>
+					<div class="test-value alibaba">{{testCount.online}}</div>
 				</div>
 			</div>
 			<div class="test-item">
@@ -25,7 +25,7 @@
 				</div>
 				<div class="test-label">
 					<div class="test-name">离线设备</div>
-					<div class="test-value alibaba">14</div>
+					<div class="test-value alibaba">{{testCount.offline}}</div>
 				</div>
 			</div>
 		</div>
@@ -41,36 +41,19 @@
 					<span class="tr-50">状态</span>
 				</div>
 			</div>
-			<div class="alarm-table hui-flex-box">
-				<div class="alarm-tr">
-					<span class="tr-100 hui-ellipsis">设备1</span>
-					<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-					<span class="tr-130">2024-01-12 12:14:10</span>
-					<span class="tr-50 color-red">报警中</span>
-				</div>
-				<div class="alarm-tr">
-					<span class="tr-100 hui-ellipsis">设备2</span>
-					<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-					<span class="tr-130">2024-01-12 12:14:10</span>
-					<span class="tr-50 color-primary">修复中</span>
-				</div>
-				<div class="alarm-tr">
-					<span class="tr-100 hui-ellipsis">设备3</span>
-					<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-					<span class="tr-130">2024-01-12 12:14:10</span>
-					<span class="tr-50 color-green">已修复</span>
-				</div>
-				<div class="alarm-tr">
-					<span class="tr-100 hui-ellipsis">设备4</span>
-					<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-					<span class="tr-130">2024-01-12 12:14:10</span>
-					<span class="tr-50 color-red">报警中</span>
-				</div>
-				<div class="alarm-tr">
-					<span class="tr-100 hui-ellipsis">设备5</span>
-					<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-					<span class="tr-130">2024-01-12 12:14:10</span>
-					<span class="tr-50 color-red">报警中</span>
+			<div class="hui-flex-box hui-no-tips" v-if="list.length === 0">
+				<empty width="100" description="暂无报警记录"></empty>
+			</div>
+			<div class="alarm-table hui-flex-box" v-else>
+				<div class="alarm-tr" v-for="(item,index) in list" :key="index">
+					<span class="tr-100 hui-ellipsis">{{item.deviceName}}</span>
+					<span class="tr-flex hui-ellipsis">{{item.info}}</span>
+					<span class="tr-130">{{item.date}}</span>
+					<span class="tr-50 tr-center">
+						<span class="color-red" v-if="!item.state">报警中</span>
+						<span class="color-blue" v-else-if="item.state === 1">处理中</span>
+						<span class="color-green" v-else-if="item.state === 2">已处理</span>
+					</span>
 				</div>
 			</div>
 		</div>
@@ -78,8 +61,51 @@
 </template>
 
 <script>
+	import {
+		getDeviceCountList,
+		getDeviceAlarmList
+	} from '@/httpApi/test'
+	export default {
+		props: ['type'],
+		data() {
+			return {
+				testCount: {
+					totalNumber: 0,
+					online: 0,
+					offline: 0
+				},
+				list: []
+			}
+		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init(option) {
+				let postData = {
+					type: this.type, //1-周界报警设备 2-周界报警 3.电子巡查设备
+					projectId: this.$store.getters.project.id
+				}
+				if (option) postData = Object.assign(postData, option);
+				getDeviceCountList(postData).then(res => {
+					if (res.state) {
+						this.testCount = res.data[0] ? res.data[0] : {
+							totalNumber: 0,
+							online: 0,
+							offline: 0
+						}
+					}
+				})
+				getDeviceAlarmList(postData).then(res => {
+					if (res.state) {
+						this.list = res.data;
+					}
+				})
+			}
+		}
+	}
 </script>
 
 <style lang="scss">
-	
+
 </style>

virgo.wzfrontend/console/src/httpApi/test.js

@@ -34,6 +34,18 @@ export function getMonitoringList(data) {
 		data: data
 	})
 }
+/* 
+ * 获取设备层级列表
+ * 
+ * 
+ */
+export function getDeviceLevelList(projectId) {
+	return request({
+		url: `/api/test/deviceLevelCount/${projectId}`,
+		method: 'get'
+	})
+}
+
 /* 
  * 获取摄像头列表
  * 
@@ -45,4 +57,171 @@ export function getMonitorList(data) {
 		method: 'post',
 		data: data
 	})
-}
+}
+
+/* 
+ * 获取门禁列表
+ * 
+ * 
+ */
+export function getAccessControlList(data) {
+	return request({
+		url: `/api/test/accessControl/get`,
+		method: 'post',
+		data: data
+	})
+}
+
+/* 
+ * 获取门禁分类统计列表
+ * 
+ * 
+ */
+export function getAccessControlCounAList(data) {
+	return request({
+		url: `/api/test/accessControl/countA`,
+		method: 'post',
+		data: data
+	})
+}
+
+/* 
+ * 获取门禁分类统计列表
+ * 
+ * 
+ */
+export function getAccessControlCountBList() {
+	return request({
+		url: `/api/test/accessControl/countB`,
+		method: 'get'
+	})
+}
+/* 
+ * 获取设备列表
+ * 
+ * 
+ */
+export function getDeviceCountList(data) {
+	return request({
+		url: `/api/test/deviceCount/get`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 获取报警列表
+ * 
+ * 
+ */
+export function getDeviceAlarmList(data) {
+	return request({
+		url: `/api/test/giveAlarm/get`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 获取车辆区域列表
+ * 
+ * 
+ */
+export function getCarRegionList(data) {
+	return request({
+		url: `/api/test/region/get`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 获取车辆通行记录
+ * 
+ * 
+ */
+export function getCarVehicleList(data) {
+	return request({
+		url: `/api/test/vehicle/get`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 获取设备层级
+ * 
+ * 
+ */
+export function getDeviceModel(projectId) {
+	return request({
+		url: `/api/test/deviceLevelCount/${projectId}`,
+		method: 'get'
+	})
+}
+/* 
+ * 新增设备层级
+ * 
+ * 
+ */
+export function insertDeviceModel(data) {
+	return request({
+		url: `/api/test/deviceLevelCount`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 编辑设备层级
+ * 
+ * 
+ */
+export function updateDeviceModel(data) {
+	return request({
+		url: `/api/test/deviceLevelCount`,
+		method: 'put',
+		data: data
+	})
+}
+/* 
+ * 删除设备层级
+ * 
+ * 
+ */
+export function deleteDeviceModel(id) {
+	return request({
+		url: `/api/test/deviceLevelCount//${id}`,
+		method: 'delete'
+	})
+}
+/* 
+ * 获取巡更记录
+ * 
+ * 
+ */
+export function getElectronicPatrolList(data) {
+	return request({
+		url: `/api/test/electronicPatrol/get`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 获取巡更路径
+ * 
+ * 
+ */
+export function getElectronicPatrolRoutesList(data) {
+	return request({
+		url: `/api/test/routes/get`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 获取打卡事件统计
+ * 
+ * 
+ */
+export function getElectronicPatrolEventtList(projectId) {
+	return request({
+		url: `/api/test/routes/${projectId}`,
+		method: 'get',
+	})
+}

virgo.wzfrontend/console/src/views/system/level.vue

@@ -2,12 +2,16 @@
 	<div class="level-system">
 		<div class="level-item">
 			<device-level></device-level>
+		</div>
+		<div class="level-item">
+			<device-levels></device-levels>
 		</div>
 	</div>
 </template>
 
 <script>
-	import deviceLevel from '@/components/system/level/deviceLevel'
+	import deviceLevel from '@/components/system/level/deviceLevel'
+	import deviceLevels from '@/components/system/level/deviceLevels'
 	export default {
 		data() {
 			return {}
@@ -15,7 +19,8 @@
 		created() {},
 		methods: {},
 		components: {
-			deviceLevel
+			deviceLevel,
+			deviceLevels
 		},
 	}
 </script>

virgo.wzfrontend/console/src/views/work/iot/device/monitor.vue

@@ -9,7 +9,7 @@
 						</div>
 						<div class="test-label">
 							<div class="test-name">设备总数</div>
-							<div class="test-value alibaba">100</div>
+							<div class="test-value alibaba">{{testCount.totalNumber}}</div>
 						</div>
 					</div>
 					<div class="number-list">
@@ -21,241 +21,53 @@
 								<i class="iconfont huifont-kaiqi"></i>
 							</div>
 							<div class="number-label">开启</div>
-							<div class="alibaba color-green">82</div>
+							<div class="alibaba color-green">{{testCount.openNumber}}</div>
 						</div>
 						<div class="number-item">
 							<div class="number-icon red">
 								<i class="iconfont huifont-jinggao"></i>
 							</div>
 							<div class="number-label">故障</div>
-							<div class="alibaba color-red">6</div>
+							<div class="alibaba color-red">{{testCount.faultNumber}}</div>
 						</div>
 						<div class="number-item">
 							<div class="number-icon gray">
 								<i class="iconfont huifont-guanbi1"></i>
 							</div>
 							<div class="number-label">关闭</div>
-							<div class="alibaba">12</div>
+							<div class="alibaba">{{testCount.closeNumber}}</div>
 						</div>
 					</div>
 				</div>
 				<div class="device-list hui-flex hui-content">
 					<div class="hui-content-title">
-						<div class="hui-title-item active">电气系统</div>
-						<div class="hui-title-item">暖通系统</div>
-						<div class="hui-title-item">给排水系统</div>
-						<div class="hui-title-item">安防系统</div>
-						<div class="hui-title-item">电梯系统</div>
-						<div class="hui-title-item">环境系统</div>
+						<div :class="'hui-title-item '+(nowDevice.id == item.id ? 'active' : '')"
+							v-for="item in deviceData" :key="item.id" @click="changeDeviceSystem(item)">
+							{{item.name}}
+						</div>
 					</div>
 					<div class="hui-flex-box">
 						<div class="device-type-list">
-							<div class="device-type-item">
-								<div class="device-type-title">
-									<span class="label">设备类型1</span>
-									<span class="alibaba color-cyan number">203</span>
-								</div>
-								<div class="device-type-content">
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-								</div>
-							</div>
-							<div class="device-type-item">
-								<div class="device-type-title">
-									<span class="label">设备类型1</span>
-									<span class="alibaba color-cyan number">203</span>
-								</div>
-								<div class="device-type-content">
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-								</div>
-							</div>
-							<div class="device-type-item">
+							<div class="device-type-item" v-for="(item,index) in nodeList" :key="item.id">
 								<div class="device-type-title">
-									<span class="label">设备类型1</span>
-									<span class="alibaba color-cyan number">203</span>
+									<span class="label">{{item.name}}</span>
+									<span class="alibaba color-cyan number">{{item.totalNumber}}</span>
 								</div>
 								<div class="device-type-content">
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
+									<div class="device-types-item" v-for="(node,index) in item.children" :key="node.id">
+										<div class="device-types-label">{{node.name}}</div>
 										<div class="device-types-content">
 											<div class="device-types-number">
 												<span>开启</span>
-												<span class="alibaba color-green">102</span>
+												<span class="alibaba color-green">{{node.openNumber}}</span>
 											</div>
 											<div class="device-types-number">
 												<span>故障</span>
-												<span class="alibaba color-red">102</span>
+												<span class="alibaba color-red">{{node.faultNumber}}</span>
 											</div>
 											<div class="device-types-number">
 												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
-											</div>
-										</div>
-									</div>
-									<div class="device-types-item">
-										<div class="device-types-label">设备子类型1</div>
-										<div class="device-types-content">
-											<div class="device-types-number">
-												<span>开启</span>
-												<span class="alibaba color-green">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>故障</span>
-												<span class="alibaba color-red">102</span>
-											</div>
-											<div class="device-types-number">
-												<span>关闭</span>
-												<span class="alibaba">102</span>
+												<span class="alibaba">{{node.closeNumber}}</span>
 											</div>
 										</div>
 									</div>
@@ -312,14 +124,22 @@
 
 <script>
 	import {
-		getMonitoringList
+		getMonitoringList,
+		getDeviceLevelList
 	} from '@/httpApi/test'
 	export default {
 		data() {
 			return {
 				list: [],
-				value: '',
-				value1: ''
+				deviceData: [],
+				testCount: {
+					totalNumber: 0,
+					openNumber: 0,
+					faultNumber: 0,
+					closeNumber: 0
+				},
+				nowDevice: {},
+				nodeList: []
 			}
 		},
 		created() {
@@ -327,6 +147,18 @@
 		},
 		methods: {
 			init() {
+				getDeviceLevelList(this.$store.getters.project.id).then(res => {
+					if (res.state) {
+						this.changeDeviceSystem(res.data[0])
+						this.deviceData = res.data;
+						for (let i = 0; i < res.data.length; i++) {
+							this.testCount.totalNumber += res.data[i].totalNumber;
+							this.testCount.openNumber += res.data[i].openNumber;
+							this.testCount.faultNumber += res.data[i].faultNumber;
+							this.testCount.closeNumber += res.data[i].closeNumber;
+						}
+					}
+				})
 				getMonitoringList({
 					projectId: this.$store.getters.project.id
 				}).then(res => {
@@ -334,6 +166,10 @@
 						this.list = res.data;
 					}
 				})
+			},
+			changeDeviceSystem(item) {
+				this.nowDevice = item;
+				this.nodeList = this.nowDevice.children;
 			}
 		},
 	}

virgo.wzfrontend/console/src/views/work/iot/security/accessControl.vue

@@ -1,268 +1,236 @@
-<template>
-	<div class="yui-tree-box">
-		<select-space></select-space>
-		<div class="hui-tree-content">
-			<div class="access-controls box-background">
-				<div class="access-control-box">
-					<div class="access-control-center">
-						<div class="hui-test-alarm">
-							<div class="test-box">
-								<div class="test-item">
-									<div class="test-icon">
-										<i class="iconfont huifont-zaichangrenshu"></i>
-									</div>
-									<div class="test-label">
-										<div class="test-name">在场人数</div>
-										<div class="test-value alibaba">100</div>
-									</div>
-								</div>
-								<div class="test-item">
-									<div class="test-icon green">
-										<i class="iconfont huifont-chuchang"></i>
-									</div>
-									<div class="test-label">
-										<div class="test-name">进场人数</div>
-										<div class="test-value alibaba">86</div>
-									</div>
-								</div>
-								<div class="test-item">
-									<div class="test-icon red">
-										<i class="iconfont huifont-chuchang"></i>
-									</div>
-									<div class="test-label">
-										<div class="test-name">出场人数</div>
-										<div class="test-value alibaba">14</div>
-									</div>
-								</div>
-							</div>
-							<div class="alarm-table-box hui-flex">
-								<div class="alarm-title">
-									<div class="hui-chart-title">
-										分类统计
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">公司名称</span>
-										<span class="tr-80 tr-center">职工进场</span>
-										<span class="tr-80 tr-center">职工出场</span>
-										<span class="tr-80 tr-center">访客进场</span>
-										<span class="tr-80 tr-center">访客出场</span>
-									</div>
-								</div>
-								<div class="alarm-table hui-flex-box">
-									<div class="alarm-tr">
-										<span class="tr-flex">常州红信数据科技有限公司</span>
-										<span class="tr-80 tr-center color-green alibaba">12</span>
-										<span class="tr-80 tr-center color-red alibaba">11</span>
-										<span class="tr-80 tr-center color-green alibaba">1</span>
-										<span class="tr-80 tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">常州红信数据科技有限公司</span>
-										<span class="tr-80 tr-center color-green alibaba">12</span>
-										<span class="tr-80 tr-center color-red alibaba">11</span>
-										<span class="tr-80 tr-center color-green alibaba">1</span>
-										<span class="tr-80 tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">常州红信数据科技有限公司</span>
-										<span class="tr-80 tr-center color-green alibaba">12</span>
-										<span class="tr-80 tr-center color-red alibaba">11</span>
-										<span class="tr-80 tr-center color-green alibaba">1</span>
-										<span class="tr-80 tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">常州红信数据科技有限公司</span>
-										<span class="tr-80 tr-center color-green alibaba">12</span>
-										<span class="tr-80 tr-center color-red alibaba">11</span>
-										<span class="tr-80 tr-center color-green alibaba">1</span>
-										<span class="tr-80 tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">常州红信数据科技有限公司</span>
-										<span class="tr-80 tr-center color-green alibaba">12</span>
-										<span class="tr-80 tr-center color-red alibaba">11</span>
-										<span class="tr-80 tr-center color-green alibaba">1</span>
-										<span class="tr-80 tr-center color-red alibaba">0</span>
-									</div>
-								</div>
-							</div>
-						</div>
-						<div class="bim-box">
-							<model type="accessControl" fileId="10000786668492"></model>
-						</div>
-					</div>
-					<div class="access-control-right">
-						<div class="access-control-record alarm-table-box hui-flex">
-							<div class="access-control-record-title">
-								<div class="hui-chart-title">
-									通行记录
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">人员姓名</span>
-									<span class="tr-flex">通过时间</span>
-									<span class="tr-50 tr-center">进出类型</span>
-								</div>
-							</div>
-							<div class="alarm-table hui-flex-box">
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-							</div>
-						</div>
-						<div class="access-control-record alarm-table-box hui-flex">
-							<div class="access-control-record-title">
-								<div class="hui-chart-title">
-									访客记录
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">人员姓名</span>
-									<span class="tr-flex">通过时间</span>
-									<span class="tr-50 tr-center">进出类型</span>
-								</div>
-							</div>
-							<div class="alarm-table hui-flex-box">
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">林夕三</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-</template>
-
-<script>
-	import selectSpace from '@/components/work/common/selectSpace'
-	import model from '@/components/work/common/model'
-	export default {
-		components: {
-			selectSpace,
-			model
-		}
-	}
-</script>
-
-<style lang="scss">
-	.access-controls {
-		width: 100%;
-		height: 100%;
-		padding: 20px;
-		overflow: auto;
-
-		.access-control-box {
-			width: 100%;
-			height: 100%;
-			min-width: 1100px;
-			min-height: 699px;
-			display: flex;
-		}
-
-		.access-control-center {
-			flex: 1;
-			width: 0;
-			height: 100%;
-			display: flex;
-			flex-direction: column;
-		}
-
-		.access-control-right {
-			height: 100%;
-			width: 350px;
-			margin-left: 12px;
-			display: flex;
-			flex-direction: column;
-
-			.access-control-record {
-				flex: 1;
-				height: 0;
-				background: rgba(0, 4, 10, 0.3);
-				width: 100%;
-				margin-bottom: 12px;
-
-				.access-control-record-title {
-					padding: 20px 20px 0 20px;
-				}
-			}
-
-			.access-control-record:last-child {
-				margin-bottom: 0;
-			}
-		}
-	}
+<template>
+	<div class="yui-tree-box">
+		<project-item-tree @treeclick="treeclick" iconfontClass="el-icon-place"></project-item-tree>
+		<div class="hui-tree-content">
+			<div class="access-controls box-background">
+				<div class="access-control-box">
+					<div class="access-control-center">
+						<div class="hui-test-alarm">
+							<div class="test-box">
+								<div class="test-item">
+									<div class="test-icon">
+										<i class="iconfont huifont-zaichangrenshu"></i>
+									</div>
+									<div class="test-label">
+										<div class="test-name">在场人数</div>
+										<div class="test-value alibaba">{{countTest.presence}}</div>
+									</div>
+								</div>
+								<div class="test-item">
+									<div class="test-icon green">
+										<i class="iconfont huifont-chuchang"></i>
+									</div>
+									<div class="test-label">
+										<div class="test-name">进场人数</div>
+										<div class="test-value alibaba">{{countTest.comeIn}}</div>
+									</div>
+								</div>
+								<div class="test-item">
+									<div class="test-icon red">
+										<i class="iconfont huifont-chuchang"></i>
+									</div>
+									<div class="test-label">
+										<div class="test-name">出场人数</div>
+										<div class="test-value alibaba">{{countTest.goOut}}</div>
+									</div>
+								</div>
+							</div>
+							<div class="alarm-table-box hui-flex">
+								<div class="alarm-title">
+									<div class="hui-chart-title">
+										分类统计
+									</div>
+									<div class="alarm-tr">
+										<span class="tr-flex">公司名称</span>
+										<span class="tr-80 tr-center">职工进场</span>
+										<span class="tr-80 tr-center">职工出场</span>
+										<span class="tr-80 tr-center">访客进场</span>
+										<span class="tr-80 tr-center">访客出场</span>
+									</div>
+								</div>
+								<div class="hui-flex-box hui-no-tips" v-if="organizationList.length === 0">
+									<empty width="100" description="暂无进出记录"></empty>
+								</div>
+								<div class="alarm-table hui-flex-box" v-else>
+									<div class="alarm-tr" v-for="(item,index) in organizationList" :key="index">
+										<span class="tr-flex">{{item.organizationName}}</span>
+										<span class="tr-80 tr-center color-green alibaba">{{item.comeIn}}</span>
+										<span class="tr-80 tr-center color-red alibaba">{{item.goOut}}</span>
+										<span class="tr-80 tr-center color-green alibaba">{{item.comeInVisitor}}</span>
+										<span class="tr-80 tr-center color-red alibaba">{{item.goOutVisitor}}</span>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="bim-box">
+							<model type="accessControl" fileId="10000786668492"></model>
+						</div>
+					</div>
+					<div class="access-control-right">
+						<div class="access-control-record alarm-table-box hui-flex">
+							<div class="access-control-record-title">
+								<div class="hui-chart-title">
+									通行记录
+								</div>
+								<div class="alarm-tr">
+									<span class="tr-100">人员姓名</span>
+									<span class="tr-flex">通过时间</span>
+									<span class="tr-50 tr-center">进出类型</span>
+								</div>
+							</div>
+							<div class="hui-flex-box hui-no-tips" v-if="clientList.length === 0">
+								<empty width="100" description="暂无进出记录"></empty>
+							</div>
+							<div class="alarm-table hui-flex-box" v-else>
+								<div class="alarm-tr" v-for="(item,index) in clientList" :key="index">
+									<span class="tr-100">{{item.userName}}</span>
+									<span class="tr-flex">{{item.date}}</span>
+									<span class="tr-50 tr-center">
+										<span class="color-green" v-if="item.type ===1">进场</span>
+										<span class="color-orange" v-else>出场</span>
+									</span>
+								</div>
+							</div>
+						</div>
+						<div class="access-control-record alarm-table-box hui-flex">
+							<div class="access-control-record-title">
+								<div class="hui-chart-title">
+									访客记录
+								</div>
+								<div class="alarm-tr">
+									<span class="tr-100">人员姓名</span>
+									<span class="tr-flex">通过时间</span>
+									<span class="tr-50 tr-center">进出类型</span>
+								</div>
+							</div>
+							<div class="hui-flex-box hui-no-tips" v-if="visitorList.length === 0">
+								<empty width="100" description="暂无进出记录"></empty>
+							</div>
+							<div class="alarm-table hui-flex-box" v-else>
+								<div class="alarm-tr" v-for="(item,index) in visitorList" :key="index">
+									<span class="tr-100">{{item.userName}}</span>
+									<span class="tr-flex">{{item.date}}</span>
+									<span class="tr-50 tr-center">
+										<span class="color-green" v-if="item.type ===1">进场</span>
+										<span class="color-orange" v-else>出场</span>
+									</span>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	import projectItemTree from '@/components/common/projectItemTree'
+	import model from '@/components/work/common/model'
+	import {
+		getAccessControlCounAList,
+		getAccessControlList,
+		getAccessControlCountBList
+	} from '@/httpApi/test'
+
+	export default {
+		components: {
+			projectItemTree,
+			model
+		},
+		data() {
+			return {
+				countTest: {
+					presence: 0,
+					comeIn: 0,
+					goOut: 0
+				},
+				clientList: [],
+				visitorList: [],
+				organizationList: []
+			}
+		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init(option) {
+				let postData = option || {
+					projectId: this.$store.getters.project.id
+				}
+				getAccessControlCounAList(postData).then(res => {
+					if (res.state) {
+						this.countTest = res.data;
+					}
+				})
+				getAccessControlCountBList().then(res => {
+					if (res.state) {
+						this.organizationList = res.data;
+					}
+				})
+				getAccessControlList(postData).then(res => {
+					if (res.state) {
+						let data = res.data;
+						this.clientList = data.filter(node => !node.isT);
+						this.visitorList = data.filter(node => node.isT === 1);
+					}
+				})
+			},
+			treeclick(item) {
+				if (!item.id) return this.init();
+				this.init({
+					projectItemTargetId: item.id
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.access-controls {
+		width: 100%;
+		height: 100%;
+		padding: 20px;
+		overflow: auto;
+
+		.access-control-box {
+			width: 100%;
+			height: 100%;
+			min-width: 1100px;
+			min-height: 699px;
+			display: flex;
+		}
+
+		.access-control-center {
+			flex: 1;
+			width: 0;
+			height: 100%;
+			display: flex;
+			flex-direction: column;
+		}
+
+		.access-control-right {
+			height: 100%;
+			width: 350px;
+			margin-left: 12px;
+			display: flex;
+			flex-direction: column;
+
+			.access-control-record {
+				flex: 1;
+				height: 0;
+				background: rgba(0, 4, 10, 0.3);
+				width: 100%;
+				margin-bottom: 12px;
+
+				.access-control-record-title {
+					padding: 20px 20px 0 20px;
+				}
+			}
+
+			.access-control-record:last-child {
+				margin-bottom: 0;
+			}
+		}
+	}
 </style>

virgo.wzfrontend/console/src/views/work/iot/security/car.vue

@@ -1,7 +1,6 @@
 <template>
 	<div class="yui-tree-box">
-		<select-space></select-space>
-		<div class="hui-tree-content">
+		<div class="hui-tree-content" style="padding: 0;">
 			<div class="car box-background">
 				<div class="car-box">
 					<div class="car-center">
@@ -13,7 +12,7 @@
 									</div>
 									<div class="test-label">
 										<div class="test-name">总车位</div>
-										<div class="test-value alibaba">100</div>
+										<div class="test-value alibaba">{{allCount.allNumber}}</div>
 									</div>
 								</div>
 								<div class="test-item">
@@ -22,7 +21,7 @@
 									</div>
 									<div class="test-label">
 										<div class="test-name">剩余车位</div>
-										<div class="test-value alibaba">86</div>
+										<div class="test-value alibaba">{{allCount.residueNumber}}</div>
 									</div>
 								</div>
 								<div class="test-item">
@@ -31,7 +30,7 @@
 									</div>
 									<div class="test-label">
 										<div class="test-name">已停车位</div>
-										<div class="test-value alibaba">14</div>
+										<div class="test-value alibaba">{{allCount.stoppedNumber}}</div>
 									</div>
 								</div>
 							</div>
@@ -47,36 +46,15 @@
 										<span class="tr-flex tr-center">故障车位</span>
 									</div>
 								</div>
-								<div class="alarm-table hui-flex-box">
-									<div class="alarm-tr">
-										<span class="tr-flex">A区</span>
-										<span class="tr-flex tr-center color-yellow alibaba">1</span>
-										<span class="tr-flex tr-center color-blue alibaba">356</span>
-										<span class="tr-flex tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">B区</span>
-										<span class="tr-flex tr-center color-yellow alibaba">1</span>
-										<span class="tr-flex tr-center color-blue alibaba">356</span>
-										<span class="tr-flex tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">C区</span>
-										<span class="tr-flex tr-center color-yellow alibaba">1</span>
-										<span class="tr-flex tr-center color-blue alibaba">356</span>
-										<span class="tr-flex tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">D区</span>
-										<span class="tr-flex tr-center color-yellow alibaba">1</span>
-										<span class="tr-flex tr-center color-blue alibaba">356</span>
-										<span class="tr-flex tr-center color-red alibaba">0</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-flex">E区</span>
-										<span class="tr-flex tr-center color-yellow alibaba">1</span>
-										<span class="tr-flex tr-center color-blue alibaba">356</span>
-										<span class="tr-flex tr-center color-red alibaba">0</span>
+								<div class="hui-flex-box hui-no-tips" v-if="regionList.length === 0">
+									<empty width="100" description="暂无车位"></empty>
+								</div>
+								<div class="alarm-table hui-flex-box" v-else>
+									<div class="alarm-tr" v-for="(item,index) in regionList" :key="item.id">
+										<span class="tr-flex">{{item.name}}</span>
+										<span class="tr-flex tr-center color-yellow alibaba">{{item.stopped}}</span>
+										<span class="tr-flex tr-center color-blue alibaba">{{item.residue}}</span>
+										<span class="tr-flex tr-center color-red alibaba">{{item.fault}}</span>
 									</div>
 								</div>
 							</div>
@@ -97,46 +75,17 @@
 									<span class="tr-50 tr-center">进出类型</span>
 								</div>
 							</div>
-							<div class="alarm-table hui-flex-box">
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
+							<div class="hui-flex-box hui-no-tips" v-if="clientList.length === 0">
+								<empty width="100" description="暂无进出记录"></empty>
+							</div>
+							<div class="alarm-table hui-flex-box" v-else>
+								<div class="alarm-tr" v-for="(item,index) in clientList" :key="index">
+									<span class="tr-100">{{item.licensePlate}}</span>
+									<span class="tr-flex">{{item.date}}</span>
+									<span class="tr-50 tr-center">
+										<span class="color-green" v-if="item.type ===1">进场</span>
+										<span class="color-orange" v-else>出场</span>
+									</span>
 								</div>
 							</div>
 						</div>
@@ -151,46 +100,17 @@
 									<span class="tr-50 tr-center">进出类型</span>
 								</div>
 							</div>
-							<div class="alarm-table hui-flex-box">
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-red alibaba">出场</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-100">浙A88888</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center color-green alibaba">进场</span>
+							<div class="hui-flex-box hui-no-tips" v-if="visitorList.length === 0">
+								<empty width="100" description="暂无进出记录"></empty>
+							</div>
+							<div class="alarm-table hui-flex-box" v-else>
+								<div class="alarm-tr" v-for="(item,index) in visitorList" :key="index">
+									<span class="tr-100">{{item.licensePlate}}</span>
+									<span class="tr-flex">{{item.date}}</span>
+									<span class="tr-50 tr-center">
+										<span class="color-green" v-if="item.type ===1">进场</span>
+										<span class="color-orange" v-else>出场</span>
+									</span>
 								</div>
 							</div>
 						</div>
@@ -202,13 +122,64 @@
 </template>
 
 <script>
-	import selectSpace from '@/components/work/common/selectSpace'
 	import model from '@/components/work/common/model'
+	import {
+		getCarRegionList,
+		getCarVehicleList
+	} from '@/httpApi/test'
 	export default {
+		data() {
+			return {
+				regionList: [],
+				allCount: {
+					allNumber: 0,
+					residueNumber: 0,
+					stoppedNumber: 0
+				},
+				clientList: [],
+				visitorList: []
+			}
+		},
 		components: {
-			selectSpace,
 			model
-		}
+		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init() {
+				getCarRegionList({
+					projectId: this.$store.getters.project.id
+				}).then(res => {
+					if (res.state) {
+						this.regionList = res.data;
+						let allNumber = 0,
+							residueNumber = 0,
+							stoppedNumber = 0;
+						for (let i = 0; i < this.regionList.length; i++) {
+							allNumber += (this.regionList[i].residue + this.regionList[i].stopped + this
+								.regionList[i].fault);
+							residueNumber += (this.regionList[i].residue + this.regionList[i].fault);
+							stoppedNumber += this.regionList[i].stopped;
+						}
+						this.allCount = {
+							allNumber: allNumber,
+							residueNumber: residueNumber,
+							stoppedNumber: stoppedNumber
+						}
+					}
+				})
+				getCarVehicleList({
+					projectId: this.$store.getters.project.id
+				}).then(res => {
+					if (res.state) {
+						let data = res.data;
+						this.clientList = data.filter(node => !node.isT);
+						this.visitorList = data.filter(node => node.isT === 1);
+					}
+				})
+			}
+		},
 	}
 </script>
 

virgo.wzfrontend/console/src/views/work/iot/security/electronicPatrol.vue

@@ -1,88 +1,13 @@
 <template>
 	<div class="yui-tree-box">
-		<select-space></select-space>
+		<project-item-tree @treeclick="treeclick" iconfontClass="el-icon-place"></project-item-tree>
 		<div class="hui-tree-content">
 			<div class="electronic-patrol box-background">
 				<div class="electronic-patrol-box">
 					<div class="electronic-patrol-center">
-						<div class="hui-test-alarm">
-							<div class="test-box">
-								<div class="test-item">
-									<div class="test-icon">
-										<i class="iconfont huifont-yunhang"></i>
-									</div>
-									<div class="test-label">
-										<div class="test-name">在线设备</div>
-										<div class="test-value alibaba">100</div>
-									</div>
-								</div>
-								<div class="test-item">
-									<div class="test-icon red">
-										<i class="iconfont huifont-shebei"></i>
-									</div>
-									<div class="test-label">
-										<div class="test-name">漏打点位</div>
-										<div class="test-value alibaba">86</div>
-									</div>
-								</div>
-								<div class="test-item">
-									<div class="test-icon gray">
-										<i class="iconfont huifont-lixian"></i>
-									</div>
-									<div class="test-label">
-										<div class="test-name">离线设备</div>
-										<div class="test-value alibaba">14</div>
-									</div>
-								</div>
-							</div>
-							<div class="alarm-table-box hui-flex">
-								<div class="alarm-title">
-									<div class="hui-chart-title">
-										设备报警
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100">设备名称</span>
-										<span class="tr-flex">报警信息</span>
-										<span class="tr-130">报警时间</span>
-										<span class="tr-50">状态</span>
-									</div>
-								</div>
-								<div class="alarm-table hui-flex-box">
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备1</span>
-										<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">报警中</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备2</span>
-										<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-primary">修复中</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备3</span>
-										<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-green">已修复</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备4</span>
-										<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">报警中</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备5</span>
-										<span class="tr-flex hui-ellipsis">报警信息发的啥响声</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">报警中</span>
-									</div>
-								</div>
-							</div>
-						</div>
+						<test-alarm ref="testAlarm" :type="3"></test-alarm>
 						<div class="bim-box">
-							<model type="electronicPatrol" fileId="10000786668235"></model>
+							<!-- <model type="electronicPatrol" fileId="10000786668235"></model> -->
 						</div>
 					</div>
 					<div class="electronic-patrol-right">
@@ -98,42 +23,15 @@
 									<span class="tr-flex tr-center">累计打卡</span>
 								</div>
 							</div>
-							<div class="alarm-table hui-flex-box">
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-flex">路径1</span>
-									<span class="tr-flex tr-center color-purple alibaba">6</span>
-									<span class="tr-flex tr-center color-green alibaba">7</span>
-									<span class="tr-flex tr-center color-blue alibaba">192</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-flex">路径2</span>
-									<span class="tr-flex tr-center color-purple alibaba">6</span>
-									<span class="tr-flex tr-center color-green alibaba">7</span>
-									<span class="tr-flex tr-center color-blue alibaba">192</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-flex">路径3</span>
-									<span class="tr-flex tr-center color-purple alibaba">6</span>
-									<span class="tr-flex tr-center color-green alibaba">7</span>
-									<span class="tr-flex tr-center color-blue alibaba">192</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-flex">路径4</span>
-									<span class="tr-flex tr-center color-purple alibaba">6</span>
-									<span class="tr-flex tr-center color-green alibaba">7</span>
-									<span class="tr-flex tr-center color-blue alibaba">192</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-flex">路径5</span>
-									<span class="tr-flex tr-center color-purple alibaba">6</span>
-									<span class="tr-flex tr-center color-green alibaba">7</span>
-									<span class="tr-flex tr-center color-blue alibaba">192</span>
-								</div>
-								<div class="alarm-tr">
-									<span class="tr-flex">路径6</span>
-									<span class="tr-flex tr-center color-purple alibaba">6</span>
-									<span class="tr-flex tr-center color-green alibaba">7</span>
-									<span class="tr-flex tr-center color-blue alibaba">192</span>
+							<div class="hui-flex-box hui-no-tips" v-if="routeEventList.length === 0">
+								<empty width="100" description="暂无巡更记录"></empty>
+							</div>
+							<div class="alarm-table hui-flex-box" v-else>
+								<div class="alarm-tr" v-for="(item,index) in routeEventList" :key="index">
+									<span class="tr-flex">{{item.routeName}}</span>
+									<span class="tr-flex tr-center color-purple alibaba">{{item.pointNumber}}</span>
+									<span class="tr-flex tr-center color-green alibaba">{{item.checkTodayNumber}}</span>
+									<span class="tr-flex tr-center color-blue alibaba">{{item.accumulateNumber}}</span>
 								</div>
 							</div>
 						</div>
@@ -148,46 +46,14 @@
 									<span class="tr-50 tr-center">巡更人</span>
 								</div>
 							</div>
-							<div class="alarm-table hui-flex-box">
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更1</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
-								</div>
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更2</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
-								</div>
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更3</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
-								</div>
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更4</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
-								</div>
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更5</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
-								</div>
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更6</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
-								</div>
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更7</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
-								</div>
-								<div class="alarm-tr" @click="drawer = true">
-									<span class="tr-100">巡更8</span>
-									<span class="tr-flex">2020-01-01 20:00:06</span>
-									<span class="tr-50 tr-center">林夕三</span>
+							<div class="hui-flex-box hui-no-tips" v-if="electronicPatrolList.length === 0">
+								<empty width="100" description="暂无巡更记录"></empty>
+							</div>
+							<div class="alarm-table hui-flex-box" v-else>
+								<div class="alarm-tr" v-for="(item,index) in electronicPatrolList" :key="index">
+									<span class="tr-100">{{item.name}}</span>
+									<span class="tr-flex">{{item.date}}</span>
+									<span class="tr-50 tr-center">{{item.userName}}</span>
 								</div>
 							</div>
 						</div>
@@ -202,19 +68,61 @@
 </template>
 
 <script>
-	import selectSpace from '@/components/work/common/selectSpace'
+	import projectItemTree from '@/components/common/projectItemTree'
 	import electronicPatrolDetail from '@/components/work/iot/security/electronicPatrolDetail'
 	import model from '@/components/work/common/model'
+	import testAlarm from '@/components/work/common/testAlarm'
+	import {
+		getElectronicPatrolList,
+		getElectronicPatrolRoutesList,
+		getElectronicPatrolEventtList
+	} from '@/httpApi/test'
 	export default {
 		data() {
 			return {
-				drawer: false
+				drawer: false,
+				electronicPatrolList: [],
+				routeEventList: []
 			}
 		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init(option) {
+				let postData = {
+					projectId: this.$store.getters.project.id
+				}
+				if (option) postData = Object.assign(postData, option);
+				getElectronicPatrolList(postData).then(res => {
+					if (res.state) {
+						this.electronicPatrolList = res.data;
+					}
+				})
+				getElectronicPatrolRoutesList(postData).then(res => {
+					if (res.state) {
+						console.log(res);
+					}
+				})
+				getElectronicPatrolEventtList(this.$store.getters.project.id).then(res => {
+					if (res.state) {
+						this.routeEventList = res.data;
+					}
+				})
+			},
+			treeclick(item) {
+				let obj = item.id ? {
+					projectItemTargetId: item.id
+				} : {}
+				if (this.$refs.testAlarm) this.$refs.testAlarm.init(obj);
+				this.init(option);
+			},
+		},
 		components: {
 			electronicPatrolDetail,
-			selectSpace,
-			model
+			projectItemTree,
+			model,
+			testAlarm
 		}
 	}
 </script>

virgo.wzfrontend/console/src/views/work/iot/security/infrared.vue

@@ -1,11 +1,11 @@
 <template>
 	<div class="yui-tree-box">
-		<!-- <select-space></select-space> -->
-		<div class="hui-tree-content" style="padding: 0;">
+		<project-item-tree @treeclick="treeclick" iconfontClass="el-icon-place"></project-item-tree>
+		<div class="hui-tree-content">
 			<div class="infrared box-background">
 				<div class="infrared-box">
 					<div class="infrared-center">
-						<test-alarm></test-alarm>
+						<test-alarm ref="testAlarm" :type="1"></test-alarm>
 						<div class="bim-box">
 							<model type="infrared" fileId="10000754876737"></model>
 						</div>
@@ -29,46 +29,18 @@
 										<span class="tr-50">状态</span>
 									</div>
 								</div>
-								<div class="alarm-table hui-flex-box">
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备1</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">未处理</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备2</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-green">已处理</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备3</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-green">已处理</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备4</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">未处理</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备5</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">未处理</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备5</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">未处理</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备5</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">未处理</span>
-									</div>
-									<div class="alarm-tr">
-										<span class="tr-100 hui-ellipsis">设备5</span>
-										<span class="tr-130">2024-01-12 12:14:10</span>
-										<span class="tr-50 color-red">未处理</span>
+								<div class="hui-flex-box hui-no-tips" v-if="list.length === 0">
+									<empty width="100" description="暂无进出记录"></empty>
+								</div>
+								<div class="alarm-table hui-flex-box" v-else>
+									<div class="alarm-tr" v-for="(item,index) in list" :key="index">
+										<span class="tr-100 hui-ellipsis">{{item.deviceName}}</span>
+										<span class="tr-130">{{item.date}}</span>
+										<span class="tr-50 tr-center">
+											<span class="color-red" v-if="!item.state">报警中</span>
+											<span class="color-blue" v-else-if="item.state === 1">处理中</span>
+											<span class="color-green" v-else-if="item.state === 2">已处理</span>
+										</span>
 									</div>
 								</div>
 							</div>
@@ -81,25 +53,65 @@
 </template>
 
 <script>
-	import selectSpace from '@/components/work/common/selectSpace'
+	import projectItemTree from '@/components/common/projectItemTree'
 	import testAlarm from '@/components/work/common/testAlarm'
 	import model from '@/components/work/common/model'
+	import {
+		getDeviceAlarmList
+	} from '@/httpApi/test'
 	export default {
 		data() {
-			return {}
+			return {
+				list: [],
+				type: 2
+			}
 		},
 		created() {
-			this.$nextTick(() => {
-				this.chart(this.$refs.chart1, [1, 3, 2, 6, 1])
-			})
+			this.init();
 		},
 		components: {
 			testAlarm,
-			selectSpace,
+			projectItemTree,
 			model
 		},
 		methods: {
-			chart(elem, data) {
+			init(option) {
+				let postData = {
+					type: this.type, //1-周界报警
+					projectId: this.$store.getters.project.id
+				}
+				if (option) postData = Object.assign(postData, option);
+				getDeviceAlarmList(postData).then(res => {
+					if (res.state) {
+						this.list = res.data;
+						let obj = {},
+							list = [];
+						for (let i = 0; i < this.list.length; i++) {
+							if (!obj[this.list[i].deviceId]) {
+								obj[this.list[i].deviceId] = 1;
+								list.push({
+									id: this.list[i].deviceId,
+									name: this.list[i].deviceName,
+									value: 0,
+								})
+							}
+							list.find(node => node.id == this.list[i].deviceId).value++;
+						}
+						this.$nextTick(() => {
+							this.chart(this.$refs.chart1, list.map(node => node.value), list.map(node =>
+								node.name))
+						})
+					}
+				})
+			},
+			treeclick(item) {
+				let obj = item.id ? {
+					projectItemTargetId: item.id
+				} : {}
+				if (this.$refs.testAlarm) this.$refs.testAlarm.init(obj);
+				this.init(option);
+			},
+			chart(elem, data, x) {
 				let chart = echarts.init(elem);
 				let option = {
 					tooltip: {
@@ -128,7 +140,7 @@
 					color: ['#1978E5'],
 					xAxis: {
 						type: 'category',
-						data: ['安装', '保养', '维修', '巡检', '拆除'],
+						data: x,
 						axisLabel: {
 							margin: 4,
 							color: '#D0DEEE',

virgo.wzfrontend/console/src/views/work/iot/security/monitor.vue

@@ -1,15 +1,7 @@
 <template>
 	<div class="work-monitor">
 		<div class="yui-tree-box">
-			<div class="hui-left-tree">
-				<div class="hui-left-tree-title">
-					<svg-icon name="zhuangshi" width="16" height="20"></svg-icon>
-					<span class="hui-left-tree-sub">摄像列表</span>
-				</div>
-				<div class="hui-left-tree-content">
-					<project-item-tree @treeclick="treeclick"></project-item-tree>
-				</div>
-			</div>
+			<project-item-tree @treeclick="treeclick"></project-item-tree>
 			<div class="hui-tree-content">
 				<model ref="model" type="monitor" fileId="10000786668235" @tipClick="tipClick"></model>
 			</div>
@@ -26,7 +18,10 @@
 					<span v-if="target.id">{{target.projectItemName}} / {{target.name}}</span>
 					<span v-else>全部列表</span>
 				</div>
-				<div class="monitor-list hui-flex-box">
+				<div class="hui-flex-box hui-no-tips" v-if="list.length === 0">
+					<empty description="该位置暂未绑定摄像头" width="120"></empty>
+				</div>
+				<div class="monitor-list hui-flex-box" v-else>
 					<div class="monitor-item" v-for="(item,index) in list" :key="item.id">
 						<div class="monitor-item-box">
 							<play-video :ref="item.number" :sourceUrl="item.appKey" template="simple">
@@ -92,7 +87,7 @@
 							node['position'] = JSON.parse(node.secret);
 							return node;
 						});
-						this.$refs.model.setData(this.list);
+						if (this.$refs.model) this.$refs.model.setData(this.list);
 					}
 				})
 			},