样式优化

static/scss/global.scss

@@ -98,4 +98,249 @@
 	line-height: 100px;
 	height: 100px;
 	font-size: 18px;
+}
+// 九宫格
+.grid-item-box {
+	flex: 1;
+	// position: relative;
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding: 20rpx;
+	background-color: #fff;
+
+	.title {
+		font-size: 26rpx;
+		color: #666;
+	}
+
+	.text {
+		margin-top: 20rpx;
+		font-size: 32rpx;
+		font-weight: 500;
+		color: #666;
+		overflow-wrap: anywhere;
+	}
+
+}
+// 设备详情页面 状态公共样式
+.common-collapse-item{
+	.content{
+		    background: linear-gradient(to bottom, #22bb5873, #45db7a26);
+		    padding: 1rpx 0 1rpx 0;
+	}
+	// 标题
+	.title-wrapper{
+	// 设备状态栏
+		padding:20rpx 30rpx;
+		font-size: 28rpx;
+		line-height: 30rpx;
+		font-weight: 700;
+		color: #000000;
+		.top{
+			.status{
+				display: inline-block;
+				vertical-align: middle;
+				color:#fff;
+				padding:4rpx 10rpx;
+				margin-right: 10rpx;
+				font-size: 22rpx;
+				border-radius: 10rpx;
+			}
+			.name{
+				display: inline-block;
+				vertical-align: middle;
+			}
+		}
+	}
+	// 设备状态卡片
+	.status-card-group{
+		&.no-wrapper-padding{
+			.uni-group__content{
+				padding:0;
+			}
+		}
+		.uni-group__content{
+			padding-top:0;
+			padding-bottom:0;
+		}
+		// 设备状态九宫格
+		.grid-item-box{
+			background-color: transparent;
+			.title{
+				color:#333;
+			}
+			.text{
+				color:#000;
+				font-weight: bolder;
+				&.work-status-color{
+					color:#000;
+				}
+			}
+			
+		}
+	}
+	// 设备数据卡片
+	.data-card-group{
+		.uni-group__content{
+			padding-top:0;
+			padding-bottom:0;
+		}
+		// 数据列表
+		.data-row{
+			font-size: 26rpx;
+			line-height: 36rpx;
+			color: #000;
+			padding:24rpx 0;
+			&:not(:last-child){
+				border-bottom: 1px solid #ebedf0;
+			}
+			.title{
+				color:#333;
+				text-align: left;
+			}
+			.value{
+				text-align: right;
+			}
+		}
+	}
+	// 子设备表格卡片
+	.child-card-group{
+		.child-table{
+			.uni-table-th{
+				color:#333;
+			}
+			.uni-table-td{
+				color:#000;
+			}
+			.table--border{
+				border-color:#ebedf0;
+			}
+		}
+	}
+	// 支路卡片
+	 .branch-card-group{
+		 .uni-group__title {
+		 	background-color: #959595;
+			height: 70rpx;
+		 	.uni-group__title-text {
+		 		color: #fff;
+				font-size:26rpx;
+				line-height: 30rpx;
+		 	}
+		 }
+		 .uni-group__content {
+		 	padding: 0;
+			.title{
+				color:#333;
+			}
+			.text{
+				color:#000;
+				font-weight: normal;
+			}
+		 }
+		 &.uni-group--card:last-child {
+		 	margin-bottom: 50rpx;
+		 }
+	 }
+}
+//运行中
+.running-collapse-item{
+	// 标题
+	.title-wrapper{
+		.top{
+			.status{
+				background-color: #30be95;
+			}
+		}
+	}
+	.content{
+		    background: linear-gradient(to bottom, #22bb5873, #45db7a26);
+	}
+	// 状态九宫格
+	.status-card-group{
+		.grid-item-box{
+			.text{
+				&.work-status-color{
+					color:#30be95;
+				}
+			}
+			
+		}
+	}
+	//支路设备
+	.branch-card-group{
+		 .uni-group__title {
+			background-color: #30be95;
+		 }
+	}
+}
+
+//故障
+.warning-collapse-item{
+	// 标题
+	.title-wrapper{
+		.top{
+			.status{
+				background-color: #ed7876;
+			}
+		}
+	}
+	.content{
+		    background: linear-gradient(to bottom, #f5604e73, #f5604e26);
+	}
+	// 状态九宫格
+	.status-card-group{
+		.grid-item-box{
+			.text{
+				&.work-status-color{
+					color:#ed7876;
+				}
+			}
+			
+		}
+	}
+	//支路设备
+	.branch-card-group{
+		 .uni-group__title {
+			background-color: #ed7876;
+		 }
+	}
+	
+}
+// 停机
+.timing-collapse-item{
+	// 标题
+	.title-wrapper{
+		.top{
+			.status{
+				background-color: #000;
+			}
+		}
+	}
+	.content{
+		    background: linear-gradient(to bottom, #8c8c8c73, #8c8c8c26);
+	}
+	// 状态九宫格
+	.status-card-group{
+		.grid-item-box{
+			.text{
+				&.work-status-color{
+					color:#000;
+				}
+			}
+			
+		}
+	}
+	//支路设备
+	.branch-card-group{
+		 .uni-group__title {
+			background-color: #000;
+		 }
+	}
+	
+	
 }