DESKTOP-UBHTENK\admin před 2 roky
rodič
revize
6c91dcfa80

binární
src/assets/images/jgqpdl.png


+ 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>

+ 46 - 35
src/views/Table/components/spdgc.vue

@@ -1,30 +1,36 @@
 <script setup>
-	
+
 </script>
 
 <template>
-	<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;">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">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">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">120</span>
-			<span style="font-weight: 600;">km</span>
-		</div>
-		</div>
-	</div>
+	<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>
@@ -37,34 +43,39 @@
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
-	.main{
-		width:52%;
-		height:97%;
-		display:flex;
-		flex:2;
+	.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);
+		// color: rgba(29,191,205,1);
 		margin-left: 10rem;
-		.shape{
+		margin-top: 25rem;
+
+		.shape {
 			margin-top: 6rem;
-			.shape2{
+
+			.shape2 {
 				margin-top: 10rem;
 			}
-			.shape3{
+
+			.shape3 {
 				margin-top: 10rem;
 			}
-			.shape4{
+
+			.shape4 {
 				margin-top: 10rem;
 			}
 		}
 	}
-</style>
+</style>

+ 1 - 1
src/views/Table/components/zksb.vue

@@ -66,7 +66,7 @@
 		font-size: 25rem;
 	}
 	.title{
-		color: rgba(29,191,205,1);
+		// color: rgba(29,191,205,1);
 		font-size: 13rem;
 		font-weight: 600;
 		// text-shadow: 0 0 2rem 2rem rgba(29,191,205,1);