Browse Source

Merge branch 'ZHNY_WW' into ZHNY_DCF

# Conflicts:
#	src/views/Table/Table.vue
DESKTOP-GBVU60Q\dell 2 năm trước cách đây
mục cha
commit
1cf296c9d4

BIN
src/assets/images/jgqpdl.png


BIN
src/assets/images/sbbjt.png


+ 20 - 2
src/views/Table/Table.vue

@@ -2,6 +2,11 @@
 	import BasicInfor from "../Table/components/BasicInfor.vue"
 	import WaterLeveChart from "../Table/components/WaterLevelChart.vue"
 	import TianluEngin from "../Table/components/TianluEngin.vue"
+
+	import spdgc from "./components/spdgc.vue"; 
+	import zksb from "./components/zksb.vue"; 
+	import dsnl from "./components/dsnl.vue"; 
+
 </script>
 
 <template>
@@ -17,7 +22,8 @@
 		<WaterLeveChart></WaterLeveChart>
 	</jt-popup2>
 
-	<jt-popup3 title="用水量统计" ref="ysltj">
+
+	<!-- <jt-popup3 title="用水量统计" ref="ysltj">
 
 	</jt-popup3>
 
@@ -25,8 +31,20 @@
 
 	</jt-popup3>
 
-	<jt-popup3 title="智能监控" top="calc(calc(100% - 115rem) / 3 + calc(100% - 115rem) / 3 + 90rem)" ref="znjk">
+	<jt-popup3 title="智能监控" top="calc(calc(100% - 115rem) / 3 + calc(100% - 115rem) / 3 + 90rem)" ref="znjk"> -->
+	
 
+	
+	<jt-popup3  title="输配电工程" ref="spdgc">
+		<spdgc ref="_spdgc"></spdgc>
+	</jt-popup3>
+	
+	<jt-popup3  title="智控设备" top="calc(calc(100% - 115rem) / 3 + 90rem)" ref="zksb">
+		<zksb ref="_zksb"></zksb>
+	</jt-popup3>
+	
+	<jt-popup3  title="地升能力" top="calc(calc(100% - 115rem) / 3 + calc(100% - 115rem) / 3 + 90rem)" ref="dsnl">
+		<dsnl ref="_dsnl"></dsnl>
 	</jt-popup3>
 </template>
 

+ 131 - 0
src/views/Table/components/dsnl.vue

@@ -0,0 +1,131 @@
+<script setup>
+
+</script>
+
+<template>
+	<el-row>
+		<el-col :span="12">
+			<div class="main">
+				<div class="shape">
+					<span style="color: rgba(29,191,205,1);margin-left: -73rem;">耕地质量</span>
+					<div class="shape2">
+						<span style="background-color: red;">一等</span>
+						<span style="margin-left: 20rem;font-weight: 600;font-size: 20rem;">23063</span>
+						<span style="font-size: 10rem;">公顷</span>
+					</div>
+					<div class="shape3">
+						<span style="background-color: orangered">二等</span>
+						<span style="margin-left: 20rem;font-weight: 600;font-size: 20rem;">53150</span>
+						<span style="font-size: 10rem;">公顷</span>
+					</div>
+					<div class="shape4">
+						<span style="background-color: yellow;">三等</span>
+						<span style="margin-left: 20rem;font-weight: 600;font-size: 20rem;">75005</span>
+						<span style="font-size: 10rem;">公顷</span>
+					</div>
+					<div class="shape4">
+						<span style="background-color: green;">四等</span>
+						<span style="margin-left: 20rem;font-weight: 600;font-size: 20rem;">21247</span>
+						<span style="font-size: 10rem;">公顷</span>
+					</div>
+					<div class="shape4">
+						<span style="background-color: skyblue;">五等</span>
+						<span style="margin-left: 20rem;font-weight: 600;font-size: 20rem;">3764</span>
+						<span style="font-size: 10rem;margin-left: 9rem;">公顷</span>
+					</div>
+				</div>
+			</div>
+		</el-col>
+		<el-col :span="12">
+			<div class="main2">
+				<div class="shape">
+					<span style="color: rgba(29,191,205,1);margin-left: -73rem;font-size: 25rem;">提升面积</span>
+					<div class="shape5">
+						<span style="font-weight: 600;font-size: 30rem;margin-left: -55rem;">53</span>
+						<span style="font-size: 10rem;">公顷</span>
+						<span style="font-size: 10rem;color: rgba(29,191,205,1);">(比上一年)</span>
+					</div>
+					<div class="shape6">
+					<div style="color: rgba(29,191,205,1);margin-left: -73rem;font-size: 25rem;margin-bottom: 6rem;">土地价格</div>
+					<span style="font-weight: 600;font-size: 30rem;margin-left: -48rem;">826</span>
+					<span style="font-size: 10rem;">元</span>
+					<span style="font-size: 10rem;color: rgba(29,191,205,1);">(增长15%)</span>
+				</div>
+				</div>
+			</div>
+		</el-col>
+	</el-row>
+
+
+</template>
+
+<script>
+	let jt3d = undefined;
+	export default {
+		data() {
+			return {
+				// viewersName: '', //视角标签名称
+				// ImgurlList: [], //截图地址列表
+			}
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.main {
+		width: 90%;
+		// height: 97%;
+		display: flex;
+		flex: 2;
+		flex-wrap: wrap;
+		justify-content: space-around;
+		align-items: center;
+		flex-direction: row;
+		// color: rgba(29,191,205,1);
+		margin-left: 10rem;
+		margin-top: 25rem;
+
+		.shape {
+			margin-top: 0rem;
+
+			.shape2 {
+				margin-top: 10rem;
+			}
+
+			.shape3 {
+				margin-top: 10rem;
+			}
+
+			.shape4 {
+				margin-top: 10rem;
+			}
+		}
+	}
+	.main2 {
+		width: 90%;
+		// height: 97%;
+		display: flex;
+		flex: 2;
+		flex-wrap: wrap;
+		justify-content: space-around;
+		align-items: center;
+		flex-direction: row;
+		// color: rgba(29,191,205,1);
+		margin-left: 10rem;
+		margin-top: 52rem;
+	
+		.shape {
+			margin-top: 0rem;
+	
+			.shape5 {
+				margin-top: 10rem;
+			}
+			.shape6 {
+				margin-top: 10rem;
+			}
+		}
+	}
+</style>

+ 81 - 0
src/views/Table/components/spdgc.vue

@@ -0,0 +1,81 @@
+<script setup>
+
+</script>
+
+<template>
+	<el-row> <el-col :span="13">
+			<div class="main">
+				<div class="shape">
+					<span style="font-size: 20rem;font-weight: 600;">变电设施&nbsp;&nbsp;</span>
+					<span style="font-size: 28rem;font-weight: 700;color: rgba(29,191,205,1);">26</span>
+					<span style="font-weight: 600;">套</span>
+					<div class="shape2">
+						<span style="font-size: 20rem;font-weight: 600;">配电设施&nbsp;&nbsp;</span>
+						<span style="font-size: 28rem;font-weight: 700;color: rgba(29,191,205,1);">37</span>
+						<span style="font-weight: 600;">套</span>
+					</div>
+					<div class="shape3">
+						<span style="font-size: 20rem;margin-left: 6rem;font-weight: 600;">高压线路&nbsp;&nbsp;</span>
+						<span style="font-size: 28rem;font-weight: 700;color: rgba(29,191,205,1);">73</span>
+						<span style="font-weight: 600;">km</span>
+					</div>
+					<div class="shape4">
+						<span style="font-size: 20rem;margin-left: 18rem;font-weight: 600;">低压线路&nbsp;&nbsp;</span>
+						<span style="font-size: 28rem;font-weight: 700;color: rgba(29,191,205,1);">120</span>
+						<span style="font-weight: 600;">km</span>
+					</div>
+				</div>
+			</div>
+		</el-col> <el-col :span="11">
+			<div style="margin-top: 60rem;"><img src="@/assets/images/jgqpdl.png"/></div>
+			<div style="font-size: 19rem;font-weight: 600;margin-top: 5rem;">井灌区配电率</div>
+		</el-col> </el-row>
+	
+</template>
+
+<script>
+	let jt3d = undefined;
+	export default {
+		data() {
+			return {
+				// viewersName: '', //视角标签名称
+				// ImgurlList: [], //截图地址列表
+			}
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.main {
+		width: 100%;
+		height: 97%;
+		display: flex;
+		flex: 2;
+		flex-wrap: wrap;
+		justify-content: space-around;
+		align-items: center;
+		flex-direction: row;
+		// color: rgba(29,191,205,1);
+		margin-left: 10rem;
+		margin-top: 25rem;
+
+		.shape {
+			margin-top: 6rem;
+
+			.shape2 {
+				margin-top: 10rem;
+			}
+
+			.shape3 {
+				margin-top: 10rem;
+			}
+
+			.shape4 {
+				margin-top: 10rem;
+			}
+		}
+	}
+</style>

+ 93 - 0
src/views/Table/components/zksb.vue

@@ -0,0 +1,93 @@
+<script setup>
+	
+</script>
+
+<template>
+	<div class="main">
+		<div class="shape">
+			<div class="number">23</div>
+			<div class="title">水肥一体</div>
+		</div>
+		<div class="shape">
+			<div class="number">2742</div>
+			<div class="title">灌溉设备</div>
+		</div>
+		<div class="shape">
+			<div class="number">0</div>
+			<div class="title">环境监测</div>
+		</div>
+		<div class="shape">
+			<div class="number">40</div>
+			<div class="title">井电双控</div>
+		</div>
+		<div class="shape">
+			<div class="number">9</div>
+			<div class="title">虫情监测</div>
+		</div>
+		<div class="shape">
+			<div class="number">10</div>
+			<div class="title">气象监测</div>
+		</div>
+		<div class="shape">
+			<div class="number">2</div>
+			<div class="title">土壤墒情</div>
+		</div>
+		<div class="shape">
+			<div class="number">15</div>
+			<div class="title">视频监控</div>
+		</div>
+		<div class="shape">
+			<div class="number">5</div>
+			<div class="title">水位监测</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	let jt3d = undefined;
+	export default {
+		data() {
+			return {
+				// viewersName: '', //视角标签名称
+				// ImgurlList: [], //截图地址列表
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.number{
+		color: rgba(29,191,205,1);
+		font-weight: 700;
+		margin-top: 15rem;
+		font-size: 25rem;
+	}
+	.title{
+		// color: rgba(29,191,205,1);
+		font-size: 13rem;
+		font-weight: 600;
+		// text-shadow: 0 0 2rem 2rem rgba(29,191,205,1);
+		margin-top: 11rem;
+		margin-left: 3rem;
+	}
+	
+	.main{
+		width:100%;
+		height:97%;
+		display:flex;
+		flex:2;
+		flex-wrap: wrap;
+		justify-content: space-around;
+		align-items: center;
+		.shape{
+			background:url('@/assets/images/sbbjt.png') no-repeat;
+			background-size:100% 100%;
+			width: 100rem;
+			height: 56rem;
+			
+		}
+	}
+</style>