Merge branch 'ZHNY_DCF' into ZHNY_WW

# Conflicts:
#	src/views/test/test.vue

src/components/jt-echarts/jt-echarts.vue

@@ -3,7 +3,6 @@
 </template>
 
 <script>
-import * as echarts from "echarts";
 import 'echarts-liquidfill';
 export default {
 	props: {
@@ -74,7 +73,7 @@ export default {
 			if (this.echart) {
 				this.echart.setOption(this.options);
 			} else {
-				this.echart = echarts.init(this.$refs.echarts);
+				this.echart = this.$echarts.init(this.$refs.echarts);
 				this.echart.setOption(this.options);
 			}
 		},

src/components/jt-popup/jt-popup2.vue

@@ -211,7 +211,7 @@
 
 		//滚动条一直显示
 		.middle {
-			height: calc(100% - 35rem);
+			height: calc(100% - 25rem);
 			width: 100%;
 			overflow-y: scroll;
 			padding: 0 0 0 0;

src/components/jt-popup/jt-popup3.vue

@@ -211,7 +211,7 @@
 
 		//滚动条一直显示
 		.middle {
-			height: calc(100% - 35rem);
+			height: calc(100% - 30rem);
 			width: 100%;
 			overflow-y: scroll;
 			padding: 0 0 0 0;

src/main.js

@@ -23,6 +23,7 @@ import * as ElementPlusIconsVue from '@element-plus/icons-vue'
 
 import md5 from "js-md5"
 import {createPinia} from 'pinia'
+import * as echarts from "echarts";
 
 //全局弹出框组件
 import jtpopup from './components/jt-popup/jt-popup.vue'
@@ -58,7 +59,7 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
 app.config.globalProperties.$http = http
 app.config.globalProperties.$md5 = md5
 app.config.globalProperties.jt3dSDK = jt3dSDK
-
+app.config.globalProperties.$echarts = echarts
 
 app.directive('drag', drag)
 app.component("jt-popup",jtpopup)
@@ -74,4 +75,5 @@ app.use(router);
 app.use(ElementPlus);
 app.use(Print);
 
+
 app.mount('#app');

src/views/test/components/WeatherWatch.vue

@@ -0,0 +1,173 @@
+<script setup>
+	
+</script>
+
+<template>
+	<div class="main">
+		<div class="wendu">
+			<div class="number"> 20℃</div>
+			<div class="title">空气温度</div>
+		</div>
+		<div class="shidu">
+			<div class="number">10%RH</div>
+			<div class="title">空气湿度</div>
+		</div>
+		<div class="fengli">
+			<div class="number">2级</div>
+			<div class="title">风力</div>
+		</div>
+		<div class="fengsu">
+			<div class="number">3m/s</div>
+			<div class="title">风速</div>
+		</div>
+		<div class="fengxiang">
+			<div class="number">东北风</div>
+			<div class="title">风向</div>
+		</div>
+		<div class="CO2">
+			<div class="number">15ppm</div>
+			<div class="title">二氧化碳</div>
+		</div>
+		<div class="daqiya">
+			<div class="number">10Kpa</div>
+			<div class="title">大气压</div>
+		</div>
+		<div class="guangzhao">
+			<div class="number">400Lux</div>
+			<div class="title">光照</div>
+		</div>
+		<div class="ziwaixian">
+			<div class="number">3级</div>
+			<div class="title">紫外线</div>
+		</div>
+		<div class="fushe">
+			<div class="number">5W/㎡</div>
+			<div class="title">太阳总辐射</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	let jt3d = undefined;
+	export default {
+		data() {
+			return {
+				// viewersName: '', //视角标签名称
+				// ImgurlList: [], //截图地址列表
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@charset "UTF-8";
+	
+	@font-face {
+		font-family: "TTTGB-Medium";
+		src: url("@/assets/fonts/fonts/TTTGB-Medium.ttf") format("truetype"),
+			url("@/assets/fonts/fonts/TTTGB-Medium.eot") format("embedded-opentype"),
+			url("@/assets/fonts/fonts/TTTGB-Medium.svg") format("svg");
+		font-weight: normal;
+		font-style: normal;
+	}
+	.number{
+		color: rgba(29,191,205,1);
+		font-weight: 600;
+		margin-top: 5rem;
+		width: 80rem;
+		margin-left: 50rem;
+		text-align: center;
+		font-family: "TTTGB-Medium", sans-serif !important;
+		font-size: 16rem;
+	}
+	.title{
+		font-size: 13rem;
+		text-shadow: 0 0 2rem 2rem rgba(29,191,205,0.8);
+		margin-top: 3rem;
+		color: rgba(245,245,245,1);
+		margin-left: 38rem;
+	}
+	
+	.main{
+		width:100%;
+		height:100%;
+		display:flex;
+		margin-top: 10rem;
+		flex:2;
+		flex-wrap: wrap;
+		justify-content: space-around;
+		align-items: center;
+		.wendu{
+			background:url('@/assets/images/qixiang/wendu.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			height: 52rem;
+		}
+		.shidu{
+			background:url('@/assets/images/qixiang/shidu.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+		.fengli{
+			background:url('@/assets/images/qixiang/cloud.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+		.fengsu{
+			background:url('@/assets/images/qixiang/cloundspeed.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			height: 52rem;
+			margin-top: 5rem;
+		}
+		.fengxiang{
+			background:url('@/assets/images/qixiang/cloudstreet.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+		.CO2{
+			background:url('@/assets/images/qixiang/co2.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+		.daqiya{
+			background:url('@/assets/images/qixiang/kpa.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+		.guangzhao{
+			background:url('@/assets/images/qixiang/run.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+		.ziwaixian{
+			background:url('@/assets/images/qixiang/ziwaixian.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+		.fushe{
+			background:url('@/assets/images/qixiang/fushe.png') no-repeat;
+			background-size:100% 100%;
+			width: 140rem;
+			margin-top: 5rem;
+			height: 52rem;
+		}
+	}
+</style>

src/views/test/components/disaster.vue

@@ -0,0 +1,264 @@
+<template>
+	<jt-echarts style="width: 330rem;height: 240rem;margin:10rem 0 10rem 10rem;" :chartData="option"></jt-echarts>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				option: {},
+				app: {}
+			}
+		},
+		methods: {
+
+		},
+		mounted() {
+			
+			this.option = {
+				grid: {
+					left: 23,
+					top: 30,
+					right: 22,
+					bottom: 10,
+					containLabel: true //false是依据坐标轴来对齐的,true是依据坐标轴上面的文字边界来对齐
+				},
+				legend: {
+					top: -3,
+					right: 20,
+					itemGap: 5, //图例每项之间的间隔
+					height: 10,
+					itemWidth: 25, //图例标记的图形宽度
+					itemHeight: 10,
+					padding: [5, 0, 0, 0],
+					textStyle: {
+						padding: [1, 0, 0, -5]
+					},
+					data: [{
+							name: "温度℃",
+							textStyle: {
+								color: "#18c196"
+							}
+						},
+						{
+							name: "气压Kpa",
+							textStyle: {
+								color: "#ff976a"
+							}
+						},
+						{
+							name: "辐射W/㎡",
+							textStyle: {
+								color: "#f15441"
+							}
+						},
+						{
+							name: "湿度%RH",
+							textStyle: {
+								color: "#0089ff"
+							}
+						}
+					]
+				},
+				xAxis: {
+					type: "category",
+					boundaryGap: false, //防止统计图左侧和纵轴有间隙
+					axisTick: {
+						show: false
+					}, //隐藏纵坐标刻度小线条
+					nameTextStyle: {
+						//y轴上方单位的颜色
+						color: "#fff",
+					},
+					axisLabel: {
+						//x轴文字的配置
+						show: true,
+						textStyle: {
+							color: "rgba(255,225,255,1)",
+						},
+					},
+					splitLine: {
+						show: false,
+					},
+					axisLine: {
+						lineStyle: {
+							color: "lightgray",
+							width: 1
+						}
+					},
+					data: ["5/1", "5/2", "5/3", "5/4", "5/5"] //横坐标的标签文字
+				},
+				yAxis: {
+					type: "value",
+					name: "指标",
+					min: 0,
+					minInterval: 1,
+					nameGap:0,
+					nameLocation: "end",
+					axisTick: {
+						show: true
+					}, //隐藏纵坐标刻度小线条
+					nameTextStyle: {
+						//y轴上方单位的颜色
+						color: "#fff",
+					},
+
+					axisLabel: {
+						//x轴文字的配置
+						show: true,
+						textStyle: {
+							color: "rgba(255,225,255,1)",
+						},
+					},
+					splitLine: {
+						show: false,
+					},
+					axisLine: {
+						show:true,
+						lineStyle: {
+							color: "lightgray",
+							width: 1
+						}
+					}
+				},
+				series: [{
+						name: "温度℃",
+						smooth: false, //平滑
+						type: "line",
+						symbolSize: 5, //折线拐点大小
+						data: [22, 23, 25, 28, 25], //纵坐标值
+						itemStyle: {
+							normal: {
+								color: "#18c196", //图例颜色
+								borderWidth: 4,
+								borderColor: "#18c196",
+								lineStyle: {
+									color: "#18c196",
+									width: 2
+								}
+							}
+						},
+						areaStyle: {
+							normal: {
+								// 渐变填充色（线条下半部分）
+								color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+										offset: 0,
+										color: "#18c196"
+									},
+									{
+										offset: 1,
+										color: "#18c19600"
+									}
+								])
+							}
+						}
+					},
+					{
+						name: "气压Kpa",
+						smooth: false, //平滑
+						type: "line",
+						symbolSize: 5, //折线拐点大小
+						data: [13, 16, 13, 21, 11], //纵坐标值
+						itemStyle: {
+							normal: {
+								color: "#ff976a", //图例颜色
+								borderWidth: 2,
+								borderColor: "#ff976a",
+								lineStyle: {
+									color: "#ff976a",
+									width: 1
+								}
+							}
+						},
+						areaStyle: {
+							normal: {
+								// 渐变填充色（线条下半部分）
+								color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+										offset: 0,
+										color: "#ff976a"
+									},
+									{
+										offset: 1,
+										color: "#ff976a00"
+									}
+								])
+							}
+						}
+					},
+					{
+						name: "辐射W/㎡",
+						smooth: false, //平滑
+						type: "line",
+						symbolSize: 5, //折线拐点大小
+						data: [15, 13, 21, 20, 14], //纵坐标值
+						itemStyle: {
+							normal: {
+								color: "#f15441", //图例颜色
+								borderWidth: 2,
+								borderColor: "#f15441",
+								lineStyle: {
+									color: "#f15441",
+									width: 1
+								}
+							}
+						},
+						areaStyle: {
+							normal: {
+								// 渐变填充色（线条下半部分）
+								color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+										offset: 0,
+										color: "#f15441"
+									},
+									{
+										offset: 1,
+										color: "#f1544100"
+									}
+								])
+							}
+						}
+					},
+					{
+						name: "湿度%RH",
+						smooth: false, //平滑
+						type: "line",
+						symbolSize: 5, //折线拐点大小
+						data: [9, 10, 11, 5, 8], //纵坐标值
+						itemStyle: {
+							normal: {
+								color: "#0089ff", //图例颜色
+								borderWidth: 2,
+								borderColor: "#0089ff",
+								lineStyle: {
+									color: "#0089ff",
+									width: 1
+								}
+							}
+						},
+						areaStyle: {
+							normal: {
+								// 渐变填充色（线条下半部分）
+								color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+										offset: 0,
+										color: "#0089ff"
+									},
+									{
+										offset: 1,
+										color: "#0089ff00"
+									}
+								])
+							}
+						}
+					}
+				]
+			}
+			
+			
+			setTimeout(res=>{
+				this.option.grid.left = 22
+			},100)
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/test/test.vue

@@ -1,11 +1,16 @@
 <script setup>
+
 	import cqjcyj from "./components/cqjcyj.vue"; 
 	import cqzrqs from "./components/cqzrqs.vue"; 
+
+	import WeatherWatch from './components/WeatherWatch.vue';
+	import disaster from './components/disaster.vue';
+
 </script>
 
 <template>
-	<jt-popup2 title="" >
-		
+	<jt-popup2 title="环境变化" >
+		<disaster></disaster>
 	</jt-popup2>
 	
 	<jt-popup2 title="虫情检测预警" top="calc(calc(100% - 115rem) / 3 + 90rem)" >
@@ -16,8 +21,8 @@
 		
 	</jt-popup2>
 	
-	<jt-popup3  title="">
-		
+	<jt-popup3  title="气象监测">
+		<WeatherWatch></WeatherWatch>
 	</jt-popup3>
 	
 	<jt-popup3  title="虫情逐日趋势" top="calc(calc(100% - 115rem) / 3 + 90rem)">