大屏展示的样式调整

snowy-admin-web/src/views/motoring/bigscreen/index.vue

@@ -21,7 +21,9 @@
 								<div class="info-left">
 									<div class="info-tilte">
 										<div class="name">{{ item.name }}</div>
-										<a-tag :bordered="false" color="success">{{ item.stateValue }}</a-tag>
+										<a-tag :bordered="false" :color="item.state == 1 ? 'success' : 'orange'">{{
+											item.stateValue
+										}}</a-tag>
 									</div>
 									<div class="info-row">
 										<div class="label">部门：</div>
@@ -59,121 +61,121 @@
 	const activeKey = ref('1')
 	const listData = [
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱1',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱2',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市越秀区先烈中路100号号15栋',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱3',
 			state: '1',
 			stateValue: '正常',
-			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			bm: '广州海关技术中心卫检所(生物岛)',
+			wz: '广州市海珠区星汉一路广州国际生物岛标准产业单元2期',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱4',
 			state: '2',
 			stateValue: '采集器闲置',
-			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			bm: '广州海关技术中心(机场路',
+			wz: '广东省广州市白云区机场路294号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱5',
 			state: '1',
 			stateValue: '正常',
-			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			bm: '广州海关技术中心卫检所(机场路)',
+			wz: '广东省广州市白云区机场路810号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱6',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱7',
 			state: '2',
 			stateValue: '采集器闲置',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱8',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱9',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱10',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱11',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
 		},
 		{
-			name: '医用低温保温箱',
+			name: '医用低温保温箱12',
 			state: '1',
 			stateValue: '正常',
 			bm: '广州海关技术中心',
-			wz: ' 广东省广州市天河区花城大道66号',
+			wz: '广东省广州市天河区花城大道66号',
 			jkd: '监控点1',
 			wd: '-20℃',
 			jlsj: '2024-11-05 09:56:01'
@@ -194,9 +196,6 @@
 <style lang="less" scoped>
 	.bigscreen {
 		width: 100%;
-		height: 100vh;
-		overflow-y: auto;
-		border: 1px solid red;
 
 		.head {
 			width: 100%;
@@ -233,7 +232,6 @@
 		}
 
 		.body {
-			overflow-y: auto;
 			padding: 20px;
 			border-radius: 5px;
 			background-color: #ffffff;
@@ -300,16 +298,17 @@
 						.right-info {
 							width: 100%;
 							height: 80%;
-							padding: 10px 20px 10px 10px;
+							padding: 10px 10px;
+
 							display: flex;
 							align-items: center;
 
 							.info-left {
 								width: 80%;
 								height: 100%;
+								overflow-y: auto;
 
 								.info-tilte {
-									padding: 5px 5px 0 5px;
 									display: flex;
 									align-items: center;
 									.name {
@@ -323,7 +322,7 @@
 								}
 
 								.info-row {
-									padding: 5px;
+									padding: 5px 0;
 									display: flex;
 									width: 100%;
 
@@ -343,14 +342,19 @@
 									}
 								}
 							}
+							.info-left::-webkit-scrollbar {
+								display: none;
+							}
 						}
 
 						.right-foot {
 							height: 20%;
+							padding: 0 10px;
+
 							color: #afafaf;
 							display: flex;
 							align-items: center;
-							justify-content: space-around;
+							justify-content: space-between;
 							border-top: 1px solid #e7e7e7;
 							.history {
 								cursor: pointer;
@@ -392,4 +396,8 @@
 			}
 		}
 	}
+
+	.bigscreen::-webkit-scrollbar {
+		display: none;
+	}
 </style>