fix

virgo.wzfrontend/console/public/index.html

@@ -24,7 +24,7 @@
 		<script src="<%= BASE_URL %>plugins/js/plugin.js"></script>
 		<script src="<%= BASE_URL %>luckysheet.umd.js"></script>
 		
-		<link rel="stylesheet" href="//at.alicdn.com/t/c/font_4358860_plro02z515r.css">
+		<link rel="stylesheet" href="//at.alicdn.com/t/c/font_4358860_u9q17n0qvwc.css">
 		<script type="text/javascript" src="https://api.tianditu.gov.cn/api?v=4.0&tk=72632adad893994a0450b55949c8a8fc">
 		</script>
 		<title>红链智慧建筑</title>

virgo.wzfrontend/console/src/components/common/noticeBoard/device.vue

@@ -36,192 +36,210 @@
 				</box>
 			</div>
 			<div class="left-bottom">
-				<box label="告警记录">
-					<div class="alarm-record">
-						<div class="alarm-test">
-							<div class="test-item alarm">
-								<div class="label">告警数</div>
-								<div class="value">12</div>
+				<box label="全生命周期">
+					<div class="device-flow-list">
+						<div class="device-flow-item">
+							<div class="device-flow-title">
+								<span class="title-name">采购</span>
+								<div class="flow-tag">
+									<span class="text">合格</span>
+									<span class="number alibaba color-green">10</span>
+								</div>
+								<div class="flow-tag">
+									<span class="text">整改中</span>
+									<span class="number alibaba color-purple">3</span>
+								</div>
 							</div>
-							<div class="test-item">
-								<div class="label">修复数</div>
-								<div class="value">11</div>
+							<div class="device-flow-document">
+								<div class="document">设备流程文档名称.pdf</div>
 							</div>
 						</div>
-
-						<div class="record-list">
-							<div class="record-item">
-								<div class="number">
-									01
+						<div class="device-flow-item">
+							<div class="device-flow-title">
+								<span class="title-name">进场</span>
+								<div class="flow-tag">
+									<span class="text">合格</span>
+									<span class="number alibaba color-green">10</span>
 								</div>
-								<div class="value">
-									<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
-								</div>
-								<div class="state color-red">
-									报警中
+								<div class="flow-tag">
+									<span class="text">整改中</span>
+									<span class="number alibaba color-purple">3</span>
 								</div>
 							</div>
-							<div class="record-item">
-								<div class="number">
-									02
-								</div>
-								<div class="value">
-									<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							<div class="device-flow-document">
+								<div class="document">设备流程文档名称.pdf</div>
+							</div>
+						</div>
+						<div class="device-flow-item">
+							<div class="device-flow-title">
+								<span class="title-name">安装</span>
+								<div class="flow-tag">
+									<span class="text">合格</span>
+									<span class="number alibaba color-green">10</span>
 								</div>
-								<div class="state color-blue">
-									已处理
+								<div class="flow-tag">
+									<span class="text">整改中</span>
+									<span class="number alibaba color-purple">3</span>
 								</div>
 							</div>
-							<div class="record-item">
-								<div class="number">
-									03
-								</div>
-								<div class="value">
-									<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							<div class="device-flow-document">
+								<div class="document">设备流程文档名称.pdf</div>
+								<div class="document">设备流程文档名称.pdf</div>
+								<div class="document">设备流程文档名称.pdf</div>
+							</div>
+						</div>
+						<div class="device-flow-item">
+							<div class="device-flow-title">
+								<span class="title-name">运维</span>
+								<div class="flow-tag">
+									<span class="text">合格</span>
+									<span class="number alibaba color-green">10</span>
 								</div>
-								<div class="state color-red">
-									报警中
+								<div class="flow-tag">
+									<span class="text">整改中</span>
+									<span class="number alibaba color-purple">3</span>
 								</div>
 							</div>
-							<div class="record-item">
-								<div class="number">
-									04
-								</div>
-								<div class="value">
-									<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							<div class="device-flow-document">
+								<div class="document">设备流程文档名称.pdf</div>
+							</div>
+						</div>
+						<div class="device-flow-item">
+							<div class="device-flow-title">
+								<span class="title-name">保养</span>
+								<div class="flow-tag">
+									<span class="text">合格</span>
+									<span class="number alibaba color-green">10</span>
 								</div>
-								<div class="state color-blue">
-									已处理
+								<div class="flow-tag">
+									<span class="text">整改中</span>
+									<span class="number alibaba color-purple">3</span>
 								</div>
 							</div>
-							<div class="record-item">
-								<div class="number">
-									05
-								</div>
-								<div class="value">
-									<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							<div class="device-flow-document">
+								<div class="document">设备流程文档名称.pdf</div>
+								<div class="document">设备流程文档名称.pdf</div>
+								<div class="document">设备流程文档名称.pdf</div>
+							</div>
+						</div>
+						<div class="device-flow-item">
+							<div class="device-flow-title">
+								<span class="title-name">维修</span>
+								<div class="flow-tag">
+									<span class="text">合格</span>
+									<span class="number alibaba color-green">10</span>
 								</div>
-								<div class="state color-blue">
-									已处理
+								<div class="flow-tag">
+									<span class="text">整改中</span>
+									<span class="number alibaba color-purple">3</span>
 								</div>
 							</div>
+							<div class="device-flow-document">
+								<div class="document">设备流程文档名称.pdf</div>
+								<div class="document">设备流程文档名称.pdf</div>
+								<div class="document">设备流程文档名称.pdf</div>
+							</div>
 						</div>
 					</div>
 				</box>
 			</div>
 		</div>
-		<div class="top">
-			<div class="top-boxs">
-				<box label="运维工单">
-					<div class="top-box">
-						<div class="line"></div>
-						<div class="top-item item-top">
-							<div class="item-box">
-								<div class="dages"></div>
-								<div class="contents">
-									<div class="num alibaba">1</div>
-									<div class="values">
-										<div class="titles">采购</div>
-										<div class="key"><span>1</span>次</div>
-									</div>
-								</div>
+		<div class="center">
+			<div class="center-top">
+				<box label="实时数据">
+					<div ref="chart1" class="right-chart"></div>
+				</box>
+			</div>
+			<div class="center-bottom">
+				<box label="设备模型">
+					<three-model url="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/f1e6fc9ca6ed46e79ba18d0a3f1b73dc" :type="1">
+					</three-model>
+				</box>
+			</div>
+		</div>
+		<div class="right">
+			<div>
+				<box label="实时走势">
+					<div ref="chart1" class="right-chart"></div>
+				</box>
+			</div>
+			<div style="margin: 15px 0;">
+				<box label="历史走势">
+					<div ref="chart2" class="right-chart"></div>
+				</box>
+			</div>
+			<div class="right-bottom">
+				<box label="告警记录">
+					<div class="alarm-record">
+						<div class="record-item">
+							<div class="number">
+								01
 							</div>
-						</div>
-						<div class="top-item item-bottom">
-							<div class="item-box">
-								<div class="dages"></div>
-								<div class="contents">
-									<div class="num alibaba">2</div>
-									<div class="values">
-										<div class="titles">入场</div>
-										<div class="key"><span>1</span>次</div>
-									</div>
-								</div>
+							<div class="value">
+								<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							</div>
+							<div class="state color-red">
+								报警中
 							</div>
 						</div>
-						<div class="top-item item-top">
-							<div class="item-box">
-								<div class="dages"></div>
-								<div class="contents">
-									<div class="num alibaba">3</div>
-									<div class="values">
-										<div class="titles">安装</div>
-										<div class="key"><span>1</span>次</div>
-									</div>
-								</div>
+						<div class="record-item">
+							<div class="number">
+								02
+							</div>
+							<div class="value">
+								<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							</div>
+							<div class="state color-blue">
+								已处理
 							</div>
 						</div>
-						<div class="top-item item-bottom">
-							<div class="item-box">
-								<div class="dages"></div>
-								<div class="contents">
-									<div class="num alibaba">4</div>
-									<div class="values">
-										<div class="titles">保养</div>
-										<div class="key"><span>1</span>次</div>
-									</div>
-								</div>
+						<div class="record-item">
+							<div class="number">
+								03
+							</div>
+							<div class="value">
+								<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							</div>
+							<div class="state color-red">
+								报警中
 							</div>
 						</div>
-						<div class="top-item item-top">
-							<div class="item-box">
-								<div class="dages"></div>
-								<div class="contents">
-									<div class="num alibaba">5</div>
-									<div class="values">
-										<div class="titles">维修</div>
-										<div class="key"><span>1</span>次</div>
-									</div>
-								</div>
+						<div class="record-item">
+							<div class="number">
+								04
+							</div>
+							<div class="value">
+								<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							</div>
+							<div class="state color-blue">
+								已处理
 							</div>
 						</div>
-					</div>
-				</box>
-			</div>
-		</div>
-		<div class="right">
-			<div class="now-data-box">
-				<box label="实时数据">
-					<div class="now-data">
-						<div class="now-data-label">
-							<div class="label">实时排放量</div>
-							<div class="unit">单位：m³/s</div>
+						<div class="record-item">
+							<div class="number">
+								05
+							</div>
+							<div class="value">
+								<div class="hui-ellipsis">xxx设备在xxx时间发生报警，请尽快查看并处理。</div>
+							</div>
+							<div class="state color-blue">
+								已处理
+							</div>
 						</div>
-						<div class="number youshe">7.68</div>
 					</div>
 				</box>
 			</div>
-			<div class="right-bottom">
-				<box label="历史数据">
-					<div ref="chart" style="width: 100%;height: 100%;"></div>
-				</box>
-			</div>
 		</div>
-		<!-- <model style="width: 100%;height: 100%;" ref="model" fileId="10000892771892"></model> -->
 	</div>
 </template>
 
 <script>
 	import box from '@/components/common/noticeBoard/box'
-	import model from '@/components/work/common/model'
-	const color = ['#aaaaaa', '#fb9f34', '#2482fe'];
-	import {
-		getPie3D,
-		getParametricEquation
-	} from '@/uitls/charts.js' //工具类js，页面路径自己修改
+	import threeModel from '@/components/work/common/threeModel'
 	export default {
 		data() {
 			return {
-				optionData: [{
-					name: '专利产权',
-					value: 3
-				}, {
-					name: '商标产权',
-					value: 6
-				}, {
-					name: '著作权产权',
-					value: 22
-				}]
+				optionData: []
 			}
 		},
 		created() {},
@@ -232,14 +250,14 @@
 		},
 		methods: {
 			init() {
-				let myChart = echarts.init(this.$refs.chart);
+				let myChart = echarts.init(this.$refs.chart2);
 				// option
 				let option = {
 					grid: {
-						left: '10',
-						top: '30',
-						right: '20',
-						bottom: '10',
+						left: '5',
+						top: '15',
+						right: '10',
+						bottom: '0',
 						containLabel: true
 					},
 					color: 'rgba(33,104,206,1)',
@@ -287,90 +305,84 @@
 						}
 					},
 					series: [{
-							name: 'line',
-							type: 'line',
-							smooth: true,
-							showAllSymbol: true,
-							symbol: 'emptyCircle',
-							symbolSize: 15,
-							data: [3, 2, 3, 4, 7, 6]
+						name: 'line',
+						type: 'line',
+						smooth: true,
+						showAllSymbol: true,
+						symbol: 'emptyCircle',
+						symbolSize: 15,
+						data: [3, 2, 3, 4, 7, 6]
+					}, {
+						name: 'bar',
+						type: 'bar',
+						barWidth: 10,
+						itemStyle: {
+							borderRadius: 5,
+							color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+									offset: 0,
+									color: '#14c8d4'
+								},
+								{
+									offset: 1,
+									color: '#43eec6'
+								}
+							])
 						},
-						{
-							name: 'bar',
-							type: 'bar',
-							barWidth: 10,
-							itemStyle: {
-								borderRadius: 5,
-								color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-										offset: 0,
-										color: '#14c8d4'
-									},
-									{
-										offset: 1,
-										color: '#43eec6'
-									}
-								])
-							},
-							data: [3, 2, 3, 4, 7, 6]
+						data: [3, 2, 3, 4, 7, 6]
+					}, {
+						name: 'line',
+						type: 'bar',
+						barGap: '-100%',
+						barWidth: 10,
+						itemStyle: {
+							color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+									offset: 0,
+									color: 'rgba(20,200,212,0.5)'
+								},
+								{
+									offset: 0.2,
+									color: 'rgba(20,200,212,0.2)'
+								},
+								{
+									offset: 1,
+									color: 'rgba(20,200,212,0)'
+								}
+							])
 						},
-						{
-							name: 'line',
-							type: 'bar',
-							barGap: '-100%',
-							barWidth: 10,
-							itemStyle: {
-								color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-										offset: 0,
-										color: 'rgba(20,200,212,0.5)'
-									},
-									{
-										offset: 0.2,
-										color: 'rgba(20,200,212,0.2)'
-									},
-									{
-										offset: 1,
-										color: 'rgba(20,200,212,0)'
-									}
-								])
-							},
-							z: -12,
-							data: [7, 7, 7, 7, 7, 7]
+						z: -12,
+						data: [7, 7, 7, 7, 7, 7]
+					}, {
+						name: 'dotted',
+						type: 'pictorialBar',
+						symbol: 'rect',
+						itemStyle: {
+							color: '#0f375f'
 						},
-						{
-							name: 'dotted',
-							type: 'pictorialBar',
-							symbol: 'rect',
-							itemStyle: {
-								color: '#0f375f'
-							},
-							symbolRepeat: true,
-							symbolSize: [12, 4],
-							symbolMargin: 1,
-							z: -10,
-							data: [7, 7, 7, 7, 7, 7]
-						}
-					]
+						symbolRepeat: true,
+						symbolSize: [12, 4],
+						symbolMargin: 1,
+						z: -10,
+						data: [7, 7, 7, 7, 7, 7]
+					}]
 				};
 				myChart.setOption(option);
 			}
 		},
 		components: {
 			box,
-			model
+			threeModel
 		}
 	}
 </script>
 
 <style lang="scss">
 	.notice-board-device {
-		position: relative;
 		width: 100%;
 		height: 100%;
-		background: url(https://lanhu-oss.lanhuapp.com/pssojb3tye7vubv2ftf1nd9qqpjjolr8a16bce648-d855-43dd-bd70-e26ed58b5c42) 100% no-repeat;
-		background-size: 100% 100%;
+		display: flex;
 
-		.now-data-box {
-			margin-bottom: 15px;
+		.right-chart {
+			height: 140px;
 		}
 
 		.right-bottom {
@@ -406,43 +418,104 @@
 		}
 
 		.right {
-			position: absolute;
-			right: 0;
-			top: 0;
-			bottom: 0;
-			width: 350px;
-			background: linear-gradient(90deg, rgba(3, 4, 7, 0) 0%, rgba(6, 8, 12, 0.35) 15%, rgba(9, 12, 17, 0.45) 20%, rgba(9, 12, 17, 0.69) 50%, #0C0F16 100%);
-			z-index: 97;
+			width: 330px;
 			display: flex;
 			flex-direction: column;
-			padding: 220px 10px 10px 40px;
+			padding: 10px;
 		}
 
 		.left {
-			position: absolute;
-			left: 0;
-			top: 0;
-			bottom: 0;
-			width: 350px;
-			background: linear-gradient(270deg, rgba(3, 4, 7, 0) 0%, rgba(6, 8, 12, 0.35) 15%, rgba(9, 12, 17, 0.45) 20%, rgba(9, 12, 17, 0.69) 50%, #0C0F16 100%);
+			width: 330px;
 			z-index: 99;
 			display: flex;
 			flex-direction: column;
-			padding: 10px 40px 10px 10px;
+			padding: 10px;
 
 			.left-bottom {
 				flex: 1;
 				height: 0;
 				margin-top: 20px;
 			}
+
+			.device-flow-list {
+				height: 100%;
+				font-size: 13px;
+				padding: 0 12px;
+				overflow-y: auto;
+
+				.device-flow-document {
+					.document:last-child {
+						margin-bottom: 0;
+					}
+				}
+
+				.device-flow-item {
+					margin-bottom: 13px;
+				}
+
+				.document {
+					height: 36px;
+					line-height: 36px;
+					cursor: pointer;
+					color: #7490D2;
+					display: flex;
+					align-items: center;
+					background: rgba(97, 133, 214, 0.05);
+					text-decoration: underline;
+					padding-left: 10px;
+					margin-bottom: 4px;
+				}
+
+				.document:hover {
+					color: $--color-primary;
+				}
+
+				.device-flow-title {
+					display: flex;
+					align-items: center;
+					margin-bottom: 8px;
+
+					.flow-tag:last-child {
+						margin-right: 0;
+					}
+				}
+
+				.title-name {
+					flex: 1;
+					font-family: 'YouSheBiaoTiHei';
+					font-size: 18px;
+				}
+
+				.flow-tag {
+					display: flex;
+					width: 79px;
+					background: rgba(51, 113, 255, 0.05);
+					align-items: center;
+					margin-right: 6px;
+
+					.text {
+						flex: 1;
+						width: 0;
+						text-align: center;
+						font-size: 12px;
+					}
+
+					.number {
+						width: 32px;
+						text-align: center;
+						line-height: 32px;
+						background: rgba(97, 133, 214, 0.15);
+						font-size: 15px;
+					}
+				}
+			}
 		}
 
 		.alarm-record {
-			font-size: 14px;
+			font-size: 13px;
 			width: 100%;
 			height: 100%;
-			display: flex;
-			flex-direction: column;
+			overflow-y: auto;
 		}
 
 		.alarm-test {
@@ -484,14 +557,6 @@
 			}
 		}
 
-		.record-list {
-			margin-top: 16px;
-			flex: 1;
-			height: 0;
-			overflow-y: auto;
-			font-size: 13px;
-		}
-
 		.record-item {
 			height: 30px;
 			display: flex;
@@ -525,131 +590,19 @@
 			padding: 0 14px 0 14px;
 		}
 
-		.top {
-			position: absolute;
-			top: 0;
-			left: 0;
-			right: 0;
-			background: linear-gradient(0deg, rgba(12, 15, 22, 0) 0%, rgba(12, 15, 22, 0.12) 13%, rgba(12, 15, 22, 0.65) 45%, rgba(12, 15, 22, 0.86) 64%, #0C0F16 100%);
-			height: 200px;
-			z-index: 98;
-			padding-left: 320px;
+		.center {
+			flex: 1;
+			width: 0;
 			box-sizing: border-box;
-			padding-top: 10px;
-			padding-right: 10px;
-
-			.top-boxs {
-				width: 100%;
-				height: 100%;
-			}
-
-			.top-box {
-				width: 100%;
-				height: 100%;
-				display: flex;
-				align-items: center;
-				position: relative;
-			}
-
-			.line {
-				width: 90%;
-				height: 1px;
-				background: #A5B2C8;
-				position: absolute;
-			}
-
-			.top-item {
-				position: relative;
-				width: 126px;
-
-
-				.item-box {
-					position: absolute;
-				}
-			}
-
-			.contents {
-				width: 126px;
-				height: 46px;
-				padding-left: 15px;
-				display: flex;
-				justify-content: center;
-				align-items: center;
-			}
-
-			.dages {
-				width: 8px;
-				height: 8px;
-				background: #1A437C;
-				border-radius: 50%;
-				border: 1px solid #03F3F6;
-				position: absolute;
-				left: 50%;
-				margin-left: -4px;
-			}
-
-			.num {
-				font-weight: 500;
-				font-size: 26px;
-				color: #03F3F6;
-				line-height: 35px;
-				font-style: italic;
-			}
-
-			.values {
-				font-size: 12px;
-				font-style: italic;
-				margin-left: 15px;
-
-				.titles {
-					color: #03F3F6;
-					font-weight: 500;
-
-				}
-
-				.key {
-					font-size: 10px;
-
-					span {
-						font-size: 14px;
-						color: #03F3F6;
-					}
-				}
-			}
-
-			.item-top {
-
-				.item-box {
-					top: 50%;
-					margin-top: -65px;
-				}
-
-				.contents {
-					background: url('../../../assets/img/device/ju3.png') 100% no-repeat;
-					background-size: 100% 100%;
-				}
-
-				.dages {
-					bottom: -23px;
-				}
-			}
-
-			.item-bottom {
-
-				.item-box {
-					bottom: 50%;
-					margin-bottom: -65px;
-				}
-
-				.contents {
-					background: url('../../../assets/img/device/ju2.png') 100% no-repeat;
-					background-size: 100% 100%;
-				}
+			padding: 10px 0;
+			display: flex;
+			flex-direction: column;
+		}
 
-				.dages {
-					top: -23px;
-				}
-			}
+		.center-bottom {
+			flex: 1;
+			height: 0;
+			margin-top: 15px;
 		}
 	}
 

virgo.wzfrontend/console/src/components/common/noticeBoard/organization.vue

@@ -22,7 +22,7 @@
 						</div>
 						<div class="item">
 							<div class="key">联系人</div>
-							<div class="value">林美玲（商务总监）</div>
+							<div class="value">林总-17601274604</div>
 						</div>
 						<div class="item">
 							<div class="key">入驻时间</div>
@@ -50,42 +50,107 @@
 			</div>
 		</div>
 		<div class="top">
-			<div class="top-box">
-				<div class="top-item">
-					<div class="title">
-						<i class="iconfont huifont-louceng"></i>
-						<div class="label">房租</div>
-					</div>
-					<div class="value">
-						<span class="alibaba color-cyan">75</span>
-						<span class="unit">元</span>
-					</div>
-				</div>
-				<div class="top-item">
-					<div class="title">
-						<i class="iconfont huifont-qiandao"></i>
-						<div class="label">水电费</div>
-					</div>
-					<div class="value">
-						<span class="alibaba color-cyan">75</span>
-						<span class="unit">元</span>
-					</div>
-				</div>
-				<div class="top-item">
-					<div class="title">
-						<i class="iconfont huifont-yichuli1"></i>
-						<div class="label">物业费</div>
+			<div class="sign-box">
+				<box label="企业标签">
+					<div class="sign">
+						<div class="sign-item">
+							<div class="sign-icon">
+								<i class="iconfont huifont-V"></i>
+							</div>
+							<div class="sign-label">国家科技型中小企业</div>
+						</div>
+						<div class="sign-item">
+							<div class="sign-icon">
+								<i class="iconfont huifont-guojiagaoxinqiye" style="font-size: 18px;"></i>
+							</div>
+							<div class="sign-label">国家高新企业</div>
+						</div>
+						<div class="sign-item">
+							<div class="sign-icon">
+								<i class="iconfont huifont-zhuanjingtexinqiye"></i>
+							</div>
+							<div class="sign-label">专业特新企业</div>
+						</div>
+						<div class="sign-item">
+							<div class="sign-icon">
+								<i class="iconfont huifont-yuanshigongzuozhan" style="font-size: 16px;"></i>
+							</div>
+							<div class="sign-label">院士工作站</div>
+						</div>
 					</div>
-					<div class="value">
-						<span class="alibaba color-cyan">75</span>
-						<span class="unit">元</span>
+				</box>
+			</div>
+			<div class="top-bottom">
+				<box label="财务信息">
+					<div class="money-list">
+						<div class="money-item">
+							<div class="money-title">
+								<div class="youshe">房租</div>
+								<div class="money-label">合同期限内房租<span class="color-cyan">12</span>万元</div>
+							</div>
+							<div class="record-list">
+								<div class="record-item">
+									<div class="value">
+										<div class="hui-ellipsis">2025年1月第一期租金<span class="color-cyan">1</span>万元</div>
+									</div>
+									<div class="state color-green">已支付</div>
+								</div>
+								<div class="record-item">
+									<div class="value">
+										<div class="hui-ellipsis">2025年2月第二期租金<span class="color-cyan">1</span>万元</div>
+									</div>
+									<div class="state color-orange">待支付</div>
+								</div>
+								<div class="record-item">
+									<div class="value">
+										<div class="hui-ellipsis">2025年3月第三期租金<span class="color-cyan">1</span>万元</div>
+									</div>
+									<div class="state color-orange">待支付</div>
+								</div>
+							</div>
+						</div>
+						<div class="money-item" style="margin: 10px 0;">
+							<div class="money-title">
+								<div class="youshe">物业费</div>
+								<div class="money-label">合同期限内<span class="color-cyan">1.2</span>万元</div>
+							</div>
+							<div class="record-list">
+								<div class="record-item">
+									<div class="value">
+										<div class="hui-ellipsis">2025年1月第一期物业费<span class="color-cyan">1000</span>元
+										</div>
+									</div>
+									<div class="state color-green">已支付</div>
+								</div>
+								<div class="record-item">
+									<div class="value">
+										<div class="hui-ellipsis">2025年2月第二期物业费<span class="color-cyan">1000</span>元
+										</div>
+									</div>
+									<div class="state color-orange">待支付</div>
+								</div>
+							</div>
+						</div>
+						<div class="money-item">
+							<div class="money-title">
+								<div class="youshe">水电费</div>
+							</div>
+							<div class="record-list">
+								<div class="record-item">
+									<div class="value">
+										<div class="hui-ellipsis">2025年1月水电费<span class="color-cyan">564.7</span>元</div>
+									</div>
+									<div class="state color-green">已支付</div>
+								</div>
+							</div>
+						</div>
 					</div>
-				</div>
+				</box>
 			</div>
 		</div>
 		<div class="right">
 			<div class="right-chart">
-				<box label="企业产值">
+				<box label="当年产出">
 					<div ref="chart1" class="echarts-box"></div>
 				</box>
 			</div>
@@ -135,7 +200,6 @@
 				</box>
 			</div>
 		</div>
-		<!-- <model style="width: 100%;height: 100%;" ref="model" fileId="10000892771892"></model> -->
 	</div>
 </template>
 
@@ -157,13 +221,12 @@
 				}]
 			}
 		},
-		created() {
-			this.setLabel()
-		},
 		mounted() {
 			this.$nextTick(() => {
 				this.initChart();
-				this.chart(this.$refs.chart1, [1200, 1340, 1580, 1600, 1640, 1640, 1700])
+				this.chart(this.$refs.chart1, [1200, 1340, 1580, 1600, 1640, 1640, 1700], [1000, 1140, 1380, 1400,
+					1440, 1440, 1500
+				])
 			})
 		},
 		methods: {
@@ -197,24 +260,26 @@
 				option && myChart.setOption(option);
 
 			},
-			chart(elem, data) {
+			chart(elem, data, data1) {
 				let chart = echarts.init(elem);
 				let option = {
-					tooltip: {
+					legend: {
 						show: true,
-						trigger: 'axis',
-						formatter: function() {
-							return ''
-						},
-						backgroundColor: 'rgba(255,255,255,0)',
-						borderWidth: 0,
-						padding: 0,
-						axisPointer: {
-							lineStyle: {
-								type: 'solid',
-								color: '#4E5561',
+						data: [{
+							name: '税收',
+							// 强制设置图形为圆。
+							icon: 'rect',
+							// 设置文本为红色
+							textStyle: {
+								color: '#fff'
 							}
-						}
+						}, {
+							name: '营收',
+							// 设置文本为红色
+							textStyle: {
+								color: '#fff'
+							}
+						}]
 					},
 					grid: {
 						left: '15',
@@ -223,7 +288,6 @@
 						bottom: '0',
 						containLabel: true
 					},
-					color: ['#1978E5'],
 					xAxis: {
 						type: 'category',
 						data: ['01', '02', '03', '04', '05', '06', '07'],
@@ -265,16 +329,28 @@
 						}
 					},
 					series: [{
-						data: data,
+						name: '税收',
+						data: data1,
 						type: 'bar',
 						barWidth: 10,
+						itemStyle: {
+							borderRadius: [5, 5, 0, 0],
+						},
 						color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
 							offset: 0,
-							color: 'rgba(73, 223, 214, 0.67)'
+							color: 'rgba(0, 126, 255, 1)'
+						}, {
+							offset: 0.5,
+							color: 'rgba(0, 174, 255, 0.7)'
 						}, {
 							offset: 1,
-							color: 'rgba(0, 58, 255, 0)'
-						}, ]),
+							color: 'rgba(0, 255, 255, 0.2)'
+						}]),
+					}, {
+						name: '营收',
+						data: data,
+						type: 'line',
+						color: ['rgba(255, 216, 0, 0.8)']
 					}]
 				};
 				chart.setOption(option);
@@ -292,20 +368,13 @@
 		position: relative;
 		width: 100%;
 		height: 100%;
-		background: url(https://lanhu-oss.lanhuapp.com/pssojb3tye7vubv2ftf1nd9qqpjjolr8a16bce648-d855-43dd-bd70-e26ed58b5c42) 100% no-repeat;
-		background-size: 100% 100%;
+		display: flex;
 
 		.left {
-			position: absolute;
-			left: 0;
-			top: 0;
-			bottom: 0;
-			width: 350px;
-			background: linear-gradient(270deg, rgba(3, 4, 7, 0) 0%, rgba(6, 8, 12, 0.35) 15%, rgba(9, 12, 17, 0.45) 20%, rgba(9, 12, 17, 0.69) 50%, #0C0F16 100%);
-			z-index: 99;
+			width: 330px;
 			display: flex;
 			flex-direction: column;
-			padding: 10px 40px 10px 10px;
+			padding: 10px;
 
 			.left-bottom {
 				flex: 1;
@@ -315,20 +384,10 @@
 		}
 
 		.right {
-			position: absolute;
-			right: 0;
-			top: 0;
-			bottom: 0;
-			width: 350px;
-			background: linear-gradient(90deg, rgba(3, 4, 7, 0) 0%, rgba(6, 8, 12, 0.35) 15%, rgba(9, 12, 17, 0.45) 20%, rgba(9, 12, 17, 0.69) 50%, #0C0F16 100%);
-			z-index: 99;
+			width: 330px;
 			display: flex;
 			flex-direction: column;
-			padding: 10px 10px 10px 40px;
-
-			.right-chart {
-				margin-bottom: 10px;
-			}
+			padding: 10px;
 
 			.echarts-box {
 				height: 160px;
@@ -343,6 +402,7 @@
 					width: 100%;
 					height: 100%;
 					position: relative;
+					padding-top: 10px;
 
 					.line {
 						position: absolute;
@@ -415,7 +475,7 @@
 
 						.article-title {
 							font-size: 14px;
-							margin: 8px 0 6px 0;
+							margin: 4px 0 6px 0;
 						}
 
 						.date {
@@ -436,60 +496,105 @@
 		}
 
 		.top {
-			position: absolute;
-			top: 10px;
-			left: 310px;
-			right: 310px;
+			flex: 1;
+			width: 0;
+			padding: 10px 0;
+			display: flex;
+			flex-direction: column;
 
-			.top-box {
+			.top-bottom {
+				flex: 1;
+				height: 0;
+				margin-top: 15px;
+			}
+
+			.money-list {
 				width: 100%;
-				display: flex;
-				justify-content: space-evenly;
+				height: 100%;
+				overflow-y: auto;
+
+				.money-item {
+					background: rgba(32, 124, 194, 0.1);
+					padding: 8px 10px;
+				}
+
+				.money-title {
+					.youshe {
+						font-size: 18px;
+						color: #fff;
+					}
+
+					.money-label {
+						font-size: 12px;
+						opacity: 0.8;
+					}
+				}
 			}
 
-			.top-item {
-				width: 130px;
+			.record-list {
+				margin-top: 10px;
+				font-size: 13px;
 			}
 
-			.value {
-				height: 32px;
+			.record-item {
+				height: 30px;
 				display: flex;
 				align-items: center;
-				justify-content: center;
-				border: 1px solid rgba(9, 81, 137, 0.3);
+				background: rgba(39, 54, 83, 0.7);
+				width: 100%;
+				border-left: 2px solid #6EA3FF;
+				margin-bottom: 4px;
+			}
 
-				.color-cyan {
-					font-size: 16px;
-					margin-right: 3px;
-				}
+			.record-item .value {
+				flex: 1;
+				width: 0;
+				padding: 0 16px;
+			}
 
-				.unit {
-					font-size: 12px;
-				}
+			.record-item .hui-no-nowrap {
+				width: 100%;
+			}
+
+			.record-item .state {
+				padding: 0 14px 0 14px;
 			}
 
-			.title {
-				background: linear-gradient(-90deg, rgba(0, 187, 255, 0) 0%, rgba(0, 230, 255, 0.09) 50%, rgba(0, 187, 255, 0) 100%);
+			.sign {
 				display: flex;
-				align-items: center;
-				justify-content: center;
-				height: 32px;
-
-				.label {
-					font-weight: 400;
-					font-size: 13px;
-					color: #FFFFFF;
-					margin-left: 6px;
+				flex-wrap: wrap;
+
+				.sign-item {
+					background: linear-gradient(-90deg, rgba(0, 187, 255, 0) 0%, rgba(0, 230, 255, 0.09) 50%, rgba(0, 187, 255, 0) 100%);
+					display: flex;
+					align-items: center;
+					height: 32px;
+					width: 50%;
+					margin: 5px 0;
+
+					.sign-label {
+						font-weight: 400;
+						font-size: 13px;
+						color: #FFFFFF;
+						margin-left: 6px;
+					}
+
+					.sign-icon {
+						width: 30px;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+					}
 				}
-			}
 
-			.iconfont {
-				font-size: 20px;
-				display: inline-block; //使元素成为行内块元素
-				line-height: 1; //设置宽度和高度
-				background: linear-gradient(0deg, #0080FF, #FFFFFF);
-				-webkit-background-clip: text; //指定背景只在文本内部显示
-				-webkit-text-fill-color: transparent; //使文本颜色透明
+				.iconfont {
+					font-size: 20px;
+					display: inline-block; //使元素成为行内块元素
+					line-height: 1; //设置宽度和高度
+					background: linear-gradient(0deg, #0080FF, #FFFFFF);
+					-webkit-background-clip: text; //指定背景只在文本内部显示
+					-webkit-text-fill-color: transparent; //使文本颜色透明
+				}
 			}
 		}
 	}

virgo.wzfrontend/console/src/uitls/threeControls.js

@@ -154,7 +154,7 @@ class threeControls {
 			const size = box.getSize(new THREE.Vector3());
 			// 计算相机的距离，使得模型正好填充整个视图
 			const maxSize = Math.max(size.x, size.y, size.z);
-			const cameraDistance = maxSize * 10;
+			const cameraDistance = maxSize * 5;
 			// 更新相机FOV（如果需要）
 			const fov = (camera.far - camera.near) / 2;
 			camera.fov = THREE.MathUtils.radToDeg(2 * Math.atan(size.y / 2 / cameraDistance));