Compare commits
13 Commits
| Author | SHA1 | Date |
|---|---|---|
|
|
c823be81ff | |
|
|
3376e0fb53 | |
|
|
005c3947ff | |
|
|
5c28f8d61b | |
|
|
ecdc6110f8 | |
|
|
7d92dbb698 | |
|
|
3ac1c6f49f | |
|
|
266c5c5eac | |
|
|
c04b3e4908 | |
|
|
9ae166d778 | |
|
|
a7c1decc3e | |
|
|
7ecd1ac2ae | |
|
|
0c1546ee02 |
|
|
@ -1,7 +1,8 @@
|
||||||
.DS_Store
|
.DS_Store
|
||||||
node_modules
|
/node_modules/
|
||||||
/dist
|
/dist/
|
||||||
|
|
||||||
|
/unpackage/
|
||||||
|
|
||||||
# local env files
|
# local env files
|
||||||
.env.local
|
.env.local
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,8 @@
|
||||||
"serve": "vue-cli-service serve",
|
"serve": "vue-cli-service serve",
|
||||||
"build": "vue-cli-service build",
|
"build": "vue-cli-service build",
|
||||||
"lint": "vue-cli-service lint",
|
"lint": "vue-cli-service lint",
|
||||||
"preinstall": "pnpm i"
|
"preinstallpnpm": "pnpm i",
|
||||||
|
"preinstallnpm": "npm i"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@amap/amap-jsapi-loader": "^1.0.1",
|
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||||
|
|
|
||||||
8539
pnpm-lock.yaml
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -5,7 +5,7 @@
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
|
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||||
<title>汾西县黄河流域农业面源污染平台</title>
|
<title>河津市农业面源污染在线监测平台</title>
|
||||||
<link rel="stylesheet" href="<%= BASE_URL %>reset.css">
|
<link rel="stylesheet" href="<%= BASE_URL %>reset.css">
|
||||||
<!-- <link rel="stylesheet" href="<%= BASE_URL %>layui/dist/css/layui.css">-->
|
<!-- <link rel="stylesheet" href="<%= BASE_URL %>layui/dist/css/layui.css">-->
|
||||||
<!-- <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"/>-->
|
<!-- <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"/>-->
|
||||||
|
|
|
||||||
|
|
@ -112,6 +112,14 @@ export function getSoilSummry(data) {
|
||||||
headers: {},
|
headers: {},
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 各个站坐标点
|
||||||
|
export function getCompanyList() {
|
||||||
|
return requests({
|
||||||
|
url: '/zh-applet-admin/appmana/bigScreen/getEntList',
|
||||||
|
method: 'get',
|
||||||
|
headers: {},
|
||||||
|
})
|
||||||
|
}
|
||||||
// 查询设备下各检测项的历史数据
|
// 查询设备下各检测项的历史数据
|
||||||
export function survItemSummary(obj) {
|
export function survItemSummary(obj) {
|
||||||
return requests({
|
return requests({
|
||||||
|
|
@ -138,3 +146,40 @@ export function getMaintainLog(params) {
|
||||||
params
|
params
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* //监测预警数据
|
||||||
|
* stationCode=S_1 站点编号
|
||||||
|
* &deployId=1679816437477228546 设备ID
|
||||||
|
* &pageNo=1 页号
|
||||||
|
* &pageSize=10 页宽
|
||||||
|
* &yearStr=2026 年份
|
||||||
|
*
|
||||||
|
* 回执
|
||||||
|
* {
|
||||||
|
* "id": "2027671112451649538",
|
||||||
|
* "tenantId": "租户",
|
||||||
|
* "deployCode": "16111113",
|
||||||
|
* "deployId": "1679816437477228546",
|
||||||
|
* "alertTime": "告警时间",
|
||||||
|
* "itemCode":"检测项编号"
|
||||||
|
* "itemName": "钾离子",
|
||||||
|
* "deviceName": "设备名称",
|
||||||
|
* "fullDeviceName":"带站点名称的设备名字"
|
||||||
|
* "readStatus":"low=偏低,high=偏高",
|
||||||
|
* "survUnit":"单位"
|
||||||
|
* "survValue":"监测值"
|
||||||
|
* "nomalValue":"正常值范围"
|
||||||
|
* }
|
||||||
|
* @param params
|
||||||
|
* @returns {*}
|
||||||
|
*/
|
||||||
|
export function doGetAlertRecord(params) {
|
||||||
|
return requests({
|
||||||
|
url: '/appmana/bigScreen/alertRecord',
|
||||||
|
method: 'get',
|
||||||
|
headers: {},
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,14 +1,14 @@
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
import router from '@/router'
|
|
||||||
const requests = axios.create({
|
const requests = axios.create({
|
||||||
baseURL:"/lh-api",
|
baseURL: "/lh-api",
|
||||||
timeout:20000,
|
timeout: 40000,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
// 请求拦截器
|
// 请求拦截器
|
||||||
requests.interceptors.request.use((config)=>{
|
requests.interceptors.request.use((config)=>{
|
||||||
config.headers['X-Access-Token'] = localStorage.getItem("token") // 请求头带上token
|
config.headers['X-Access-Token'] = localStorage.getItem("token") // 请求头带上token
|
||||||
|
config.headers['X-Tenant-Id'] = '1004'
|
||||||
return config
|
return config
|
||||||
},(error)=>{
|
},(error)=>{
|
||||||
return Promise.reject(new Error('faile'));
|
return Promise.reject(new Error('faile'));
|
||||||
|
|
|
||||||
|
|
@ -571,7 +571,7 @@
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
z-index: 500;
|
z-index: 500;
|
||||||
position: absolute;
|
/*position: absolute;*/
|
||||||
}
|
}
|
||||||
.dataTypeEchart2{
|
.dataTypeEchart2{
|
||||||
width: 90px;
|
width: 90px;
|
||||||
|
|
@ -589,8 +589,8 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
z-index: 500;
|
z-index: 500;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 13px;
|
left: 185px !important;
|
||||||
top: 30px;
|
/*top: 30px;*/
|
||||||
.el-input__inner{
|
.el-input__inner{
|
||||||
height: 34px;
|
height: 34px;
|
||||||
background: #0e2e4f;
|
background: #0e2e4f;
|
||||||
|
|
@ -651,7 +651,7 @@
|
||||||
}
|
}
|
||||||
#chart1{height:12vw;}
|
#chart1{height:12vw;}
|
||||||
.scdlist{
|
.scdlist{
|
||||||
width: 7vw;
|
width: 8.5vw;
|
||||||
height: 2vw;
|
height: 2vw;
|
||||||
margin-top: 0.4vw;
|
margin-top: 0.4vw;
|
||||||
line-height: 2vw;
|
line-height: 2vw;
|
||||||
|
|
@ -757,11 +757,11 @@
|
||||||
.jctctiao{
|
.jctctiao{
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
.jctc_add{
|
/*.jctc_add{*/
|
||||||
height: 1vw;
|
/* min-height: 1vw;*/
|
||||||
padding-left: 5%;
|
/* padding-left: 5%;*/
|
||||||
margin-top: 0.6vw;
|
/* margin-top: 0.6vw;*/
|
||||||
}
|
/*}*/
|
||||||
.jctcicon1{
|
.jctcicon1{
|
||||||
width: 0.7vw;
|
width: 0.7vw;
|
||||||
margin-top: 0.1vw;
|
margin-top: 0.1vw;
|
||||||
|
|
|
||||||
|
|
@ -582,7 +582,7 @@
|
||||||
}
|
}
|
||||||
#chart1{height:12vw;}
|
#chart1{height:12vw;}
|
||||||
.scdlist{
|
.scdlist{
|
||||||
width: 9vw;
|
width: 10vw;
|
||||||
height: 2vw;
|
height: 2vw;
|
||||||
line-height: 2vw;
|
line-height: 2vw;
|
||||||
background: rgba(0,0,0,0.6);
|
background: rgba(0,0,0,0.6);
|
||||||
|
|
|
||||||
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
After Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 8.2 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 6.8 KiB |
|
|
@ -122,7 +122,7 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
dTitle: '长期定位监测',
|
dTitle: '长期定位监测',
|
||||||
urlimg: 'https://fxnsp.zgzhny.com/lh-api/sys/common/static/',
|
urlimg: 'https://fxnsp.sxcooh.com/lh-api/sys/common/static/',
|
||||||
urlimg2: 'https://farm.ilhzn.cn/jeecg-boot/sys/common/static/',
|
urlimg2: 'https://farm.ilhzn.cn/jeecg-boot/sys/common/static/',
|
||||||
deployType: 'soil',
|
deployType: 'soil',
|
||||||
allData: null,
|
allData: null,
|
||||||
|
|
|
||||||
|
|
@ -31,7 +31,9 @@ VueAMap.initAMapApiLoader({
|
||||||
"AMap.MapType", //类别切换控件,实现默认图层与卫星图、实施交通图层之间切换的控制
|
"AMap.MapType", //类别切换控件,实现默认图层与卫星图、实施交通图层之间切换的控制
|
||||||
"AMap.PolyEditor", //编辑 折线多,边形
|
"AMap.PolyEditor", //编辑 折线多,边形
|
||||||
"AMap.CircleEditor", //圆形编辑器插件
|
"AMap.CircleEditor", //圆形编辑器插件
|
||||||
"AMap.Geolocation" //定位控件,用来获取和展示用户主机所在的经纬度位置
|
"AMap.Geolocation", //定位控件,用来获取和展示用户主机所在的经纬度位置
|
||||||
|
"AMap.MarkerCluster", //聚合Marker
|
||||||
|
"AMap.MassMarks",
|
||||||
],
|
],
|
||||||
v: '2.0'
|
v: '2.0'
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -9,11 +9,11 @@
|
||||||
<div class="main2">
|
<div class="main2">
|
||||||
<video class="fullscreenvideo" id="bgvid" playsinline="" autoplay="" muted="" loop="">
|
<video class="fullscreenvideo" id="bgvid" playsinline="" autoplay="" muted="" loop="">
|
||||||
<!-- <source src="@/assets/image/bg2.mp4" type="video/mp4">-->
|
<!-- <source src="@/assets/image/bg2.mp4" type="video/mp4">-->
|
||||||
<source src="http://fxnsp.zgzhny.com/lh-api/sys/common/static/v/bg2.mp4" type="video/mp4">
|
<source src="http://fxnsp.sxcooh.com/lh-api/sys/common/static/v/bg2.mp4" type="video/mp4">
|
||||||
</video>
|
</video>
|
||||||
<div class="nav">
|
<div class="nav">
|
||||||
<span class="nav_ti nav_mag">{{DetailList.stationName}}</span>
|
<span class="nav_ti nav_mag">{{DetailList.stationName}}</span>
|
||||||
<span class="nav_tit">治理效果评价与预警一张图</span>
|
<span class="nav_tit">治理效果评价和监测一张图</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="nav_btn">
|
<div class="nav_btn">
|
||||||
<div class="btn_left">
|
<div class="btn_left">
|
||||||
|
|
@ -172,7 +172,7 @@
|
||||||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||||||
</div>
|
</div>
|
||||||
<!-- <img src="@/assets/image/zhpjimg2.png" class="zhpjimg2" alt="">-->
|
<!-- <img src="@/assets/image/zhpjimg2.png" class="zhpjimg2" alt="">-->
|
||||||
<img src="http://fxnsp.zgzhny.com/lh-api/sys/common/static/bs/zhpjimg2.png" class="zhpjimg2" alt="">
|
<img src="http://fxnsp.sxcooh.com/lh-api/sys/common/static/bs/zhpjimg2.png" class="zhpjimg2" alt="">
|
||||||
<span class="zhpjtit" >{{DisplayListdetailList.detailValue}}</span>
|
<span class="zhpjtit" >{{DisplayListdetailList.detailValue}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -359,7 +359,7 @@ export default {
|
||||||
name: "CqyzList",
|
name: "CqyzList",
|
||||||
data(){
|
data(){
|
||||||
return {
|
return {
|
||||||
urlimg:'https://fxnsp.zgzhny.com/lh-api/sys/common/static/',
|
urlimg:'https://fxnsp.sxcooh.com/lh-api/sys/common/static/',
|
||||||
player: null,
|
player: null,
|
||||||
enableZ:false, //默认关闭电子放大
|
enableZ:false, //默认关闭电子放大
|
||||||
play: false, //默认停止播放
|
play: false, //默认停止播放
|
||||||
|
|
@ -410,7 +410,7 @@ export default {
|
||||||
this.DisplayListstinkList0 = val.result.stink[0].detailList[0]
|
this.DisplayListstinkList0 = val.result.stink[0].detailList[0]
|
||||||
})
|
})
|
||||||
getIndexSummry(stationCode).then(res=>{
|
getIndexSummry(stationCode).then(res=>{
|
||||||
if (res.code ='200'&&res.result.length>0) {
|
if (res.code == '200' && res.result.length > 0) {
|
||||||
this.NHSummry = res.result[0].NHSummry
|
this.NHSummry = res.result[0].NHSummry
|
||||||
this.TNSummry = res.result[0].TNSummry
|
this.TNSummry = res.result[0].TNSummry
|
||||||
this.TPSummry = res.result[0].TPSummry
|
this.TPSummry = res.result[0].TPSummry
|
||||||
|
|
|
||||||
|
|
@ -14,8 +14,8 @@
|
||||||
element-loading-background="rgba(0, 0, 0, 0.8)"
|
element-loading-background="rgba(0, 0, 0, 0.8)"
|
||||||
>
|
>
|
||||||
<div class="nav">
|
<div class="nav">
|
||||||
<span class="nav_ti nav_mag">汾西县黄河流域农业面源污染平台</span>
|
<span class="nav_ti nav_mag">河津市农业面源污染在线监测平台</span>
|
||||||
<span class="nav_tit">治理效果评价与预警一张图</span>
|
<span class="nav_tit">治理效果评价和监测一张图</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="nav_btn">
|
<div class="nav_btn">
|
||||||
<div class="btn_left">
|
<div class="btn_left">
|
||||||
|
|
@ -79,8 +79,8 @@
|
||||||
<div class="in1con_lf_img">
|
<div class="in1con_lf_img">
|
||||||
<div
|
<div
|
||||||
class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">
|
class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">
|
||||||
<img src="@/assets/image/xmgk04.png" class="in1con_lf_imgone" alt="">
|
<img src="@/assets/image/xmgk01.png" class="in1con_lf_imgone" alt="">
|
||||||
<span class="in1con_lf_imglf_tit">对竹河监测站</span>
|
<span class="in1con_lf_imglf_tit">农田面源污染监测站</span>
|
||||||
<span class="in1con_lf_imglf_num">
|
<span class="in1con_lf_imglf_num">
|
||||||
<animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"
|
<animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"
|
||||||
:to="2" :key="stationCount0" duration="3000"></animate-number>个
|
:to="2" :key="stationCount0" duration="3000"></animate-number>个
|
||||||
|
|
@ -88,20 +88,38 @@
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">
|
class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">
|
||||||
<img src="@/assets/image/xmgk04.png" class="in1con_lf_imgone" alt="">
|
<img src="@/assets/image/xmgk02.png" class="in1con_lf_imgone" alt="">
|
||||||
<span class="in1con_lf_imglf_tit">团柏河监测站</span>
|
<span class="in1con_lf_imglf_tit">畜禽养殖污染监测站</span>
|
||||||
<span class="in1con_lf_imglf_num">
|
<span class="in1con_lf_imglf_num">
|
||||||
<animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"
|
<animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"
|
||||||
:to="2" :key="stationCount0" duration="3000"></animate-number>个
|
:to="2" :key="stationCount0" duration="3000"></animate-number>个
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <div-->
|
||||||
|
<!-- class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">-->
|
||||||
|
<!-- <img src="@/assets/image/xmgk04.png" class="in1con_lf_imgone" alt="">-->
|
||||||
|
<!-- <span class="in1con_lf_imglf_tit">小流域污染监测站</span>-->
|
||||||
|
<!-- <span class="in1con_lf_imglf_num">-->
|
||||||
|
<!-- <animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"-->
|
||||||
|
<!-- :to="1" :key="stationCount0" duration="3000"></animate-number>个-->
|
||||||
|
<!-- </span>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div-->
|
||||||
|
<!-- class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">-->
|
||||||
|
<!-- <img src="@/assets/image/xmgk03.png" class="in1con_lf_imgone" alt="">-->
|
||||||
|
<!-- <span class="in1con_lf_imglf_tit">长期定位监测点位</span>-->
|
||||||
|
<!-- <span class="in1con_lf_imglf_num">-->
|
||||||
|
<!-- <animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"-->
|
||||||
|
<!-- :to="7" :key="stationCount0" duration="3000"></animate-number>个-->
|
||||||
|
<!-- </span>-->
|
||||||
|
<!-- </div>-->
|
||||||
<div
|
<div
|
||||||
class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">
|
class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse">
|
||||||
<img src="@/assets/image/xmgk03.png" class="in1con_lf_imgone" alt="">
|
<img src="@/assets/image/xmgk05.png" class="in1con_lf_imgone" alt="">
|
||||||
<span class="in1con_lf_imglf_tit">长期定位监测点位</span>
|
<span class="in1con_lf_imglf_tit">太阳能诱虫灯</span>
|
||||||
<span class="in1con_lf_imglf_num">
|
<span class="in1con_lf_imglf_num">
|
||||||
<animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"
|
<animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"
|
||||||
:to="7" :key="stationCount0" duration="3000"></animate-number>个
|
:to="2974" :key="stationCount0" duration="3000"></animate-number>个
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -169,18 +187,39 @@
|
||||||
</transition>
|
</transition>
|
||||||
<!-- 地图左下图例-->
|
<!-- 地图左下图例-->
|
||||||
<div v-if="mapTypeFlag==true" class="mapTuLi">
|
<div v-if="mapTypeFlag==true" class="mapTuLi">
|
||||||
<div class="scdlist" @click="switchIcon('duizhuhe')">
|
<div class="scdlist" @click="switchIcon('ent')">
|
||||||
|
<img src="@/assets/image/enticon.png" class="xcdimg" alt="">
|
||||||
|
<span class="scdlist_tit">企业站点</span>
|
||||||
|
</div>
|
||||||
|
<div class="scdlist" @click="switchIcon('livestock')">
|
||||||
<img src="@/assets/image/icon-blue.png" class="xcdimg" alt="">
|
<img src="@/assets/image/icon-blue.png" class="xcdimg" alt="">
|
||||||
<span class="scdlist_tit">对竹河监测站</span>
|
<span class="scdlist_tit">畜禽养殖污染监测站</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="scdlist" @click="switchIcon('tuanbaihe')">
|
<div class="scdlist" @click="switchIcon('orient')">
|
||||||
<img src="@/assets/image/icon-yellow.png" class="xcdimg" alt="">
|
<img src="@/assets/image/icon-yellow.png" class="xcdimg" alt="">
|
||||||
<span class="scdlist_tit">团柏河监测站</span>
|
<span class="scdlist_tit">农田面源污染监测站</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="scdlist" @click="switchIcon('soil')">
|
<!-- <div class="scdlist" @click="switchIcon('watershed')">-->
|
||||||
<img src="@/assets/image/soil.png" class="xcdimg" alt="">
|
<!-- <img src="@/assets/image/waterlive.png" class="xcdimg" alt="">-->
|
||||||
<span class="scdlist_tit">长期定位监测</span>
|
<!-- <span class="scdlist_tit">小流域监测站</span>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div class="scdlist" @click="switchIcon('soil')">-->
|
||||||
|
<!-- <img src="@/assets/image/soil.png" class="xcdimg" alt="">-->
|
||||||
|
<!-- <span class="scdlist_tit">长期定位监测站</span>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<div class="scdlist">
|
||||||
|
<img src="@/assets/image/address4.png" class="xcdimg" alt="" @click="switchLightIcon('light')">
|
||||||
|
<span class="scdlist_tit" @click="switchIcon('light')">联网式太阳能杀虫灯</span>
|
||||||
</div>
|
</div>
|
||||||
|
<el-tooltip content="杀虫灯显示开关" effect="dark" placement="top">
|
||||||
|
<el-switch
|
||||||
|
v-model="switchValue"
|
||||||
|
active-color="#13ce66"
|
||||||
|
inactive-color="#ff4949"
|
||||||
|
@change="switchLightIcon"
|
||||||
|
style="position: fixed;bottom:17.2vw;right:25%;z-index: 999;">
|
||||||
|
</el-switch>
|
||||||
|
</el-tooltip>
|
||||||
</div>
|
</div>
|
||||||
<transition enter-active-class="animate__animated animate__backInUp"
|
<transition enter-active-class="animate__animated animate__backInUp"
|
||||||
leave-active-class="animate__animated animate__backOutDown">
|
leave-active-class="animate__animated animate__backOutDown">
|
||||||
|
|
@ -195,29 +234,29 @@
|
||||||
<div v-loading="tabsLoading" element-loading-text=" "
|
<div v-loading="tabsLoading" element-loading-text=" "
|
||||||
element-loading-background="rgba(0, 0, 0, 0.8)">
|
element-loading-background="rgba(0, 0, 0, 0.8)">
|
||||||
<span class="zywr_titshow">重要污染物治理效果</span>
|
<span class="zywr_titshow">重要污染物治理效果</span>
|
||||||
<el-tooltip class="item" effect="dark"
|
<!-- <el-select class="dataTypeEchart2" style="width:90px;" v-model="dateType" placeholder="请选择" @change="changeDateType">-->
|
||||||
:content="dataTypeEchart?'监测值为正常历史监测数据。':'对比值为下游监测站数据减去上游监测站数据。'"
|
<!-- <el-option-->
|
||||||
placement="top-start">
|
<!-- v-for="item in dateTypeOptions"-->
|
||||||
<span class="dataTypeEchart" @click="switchEchartType">
|
<!-- :key="item.value"-->
|
||||||
{{ dataTypeEchart ? '监测值' : '对比值' }}
|
<!-- :label="item.label"-->
|
||||||
</span>
|
<!-- :value="item.value">-->
|
||||||
</el-tooltip>
|
<!-- </el-option>-->
|
||||||
<el-select class="dataTypeEchart2" v-model="dateType" placeholder="请选择" @change="changeDateType">
|
<!-- </el-select>-->
|
||||||
<el-option
|
<!-- <el-tooltip class=" " effect="dark" style="position: absolute;left: 300px;"-->
|
||||||
v-for="item in dateTypeOptions"
|
<!-- :content="dataTypeEchart?'当前:监测值为正常历史监测数据。':'当前:对比值为1#监测站数据减去2#监测站数据。'"-->
|
||||||
:key="item.value"
|
<!-- placement="top-start">-->
|
||||||
:label="item.label"
|
<!-- <span class="dataTypeEchart" @click="switchEchartType">-->
|
||||||
:value="item.value">
|
<!-- {{ dataTypeEchart ? '监测值' : '对比值' }}-->
|
||||||
</el-option>
|
<!-- </span>-->
|
||||||
</el-select>
|
<!-- </el-tooltip>-->
|
||||||
<el-tabs type="card" @tab-click="handleClick" v-show="dataTypeEchart">
|
<el-tabs type="card" @tab-click="doGetIndexSummry" v-show="dataTypeEchart">
|
||||||
<el-tab-pane v-for="(item,index) in stationInfoList" :label="item.stationShortName?item.stationShortName:item.stationName" lazy>
|
<el-tab-pane v-for="(item,index) in stationInfoList" :label="item.stationShortName||item.stationName" lazy>
|
||||||
<template>
|
<template>
|
||||||
<div :id="`myChartDiv${index}`" style="height:12vw;width:100%;"></div>
|
<div :id="`myChartDiv${index}`" style="height:12vw;width:100%;"></div>
|
||||||
</template>
|
</template>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
<el-tabs type="card" @tab-click="handleClick" v-show="!dataTypeEchart">
|
<el-tabs type="card" @tab-click="doGetIndexSummry" v-show="!dataTypeEchart">
|
||||||
<el-tab-pane v-for="(item,index) in riverList" :label="(item.stationShortName?item.stationShortName:item.stationName).split('-')[0]" lazy>
|
<el-tab-pane v-for="(item,index) in riverList" :label="(item.stationShortName?item.stationShortName:item.stationName).split('-')[0]" lazy>
|
||||||
<template>
|
<template>
|
||||||
<div :id="`myChartDiv2${index}`" style="height:12vw;width:100%;"></div>
|
<div :id="`myChartDiv2${index}`" style="height:12vw;width:100%;"></div>
|
||||||
|
|
@ -233,6 +272,7 @@
|
||||||
leave-active-class="animate__animated animate__backOutRight">
|
leave-active-class="animate__animated animate__backOutRight">
|
||||||
<template v-if="mapTypeFlag">
|
<template v-if="mapTypeFlag">
|
||||||
<div class="leftBox right baseBoxHjleft" style="width:22.5%;overflow: hidden;">
|
<div class="leftBox right baseBoxHjleft" style="width:22.5%;overflow: hidden;">
|
||||||
|
|
||||||
<img src="@/assets/image/kuang_zuoshang.png" class="in2con_zlf" alt="">
|
<img src="@/assets/image/kuang_zuoshang.png" class="in2con_zlf" alt="">
|
||||||
<img src="@/assets/image/kuang_youshang.png" class="in2con_zys" alt="">
|
<img src="@/assets/image/kuang_youshang.png" class="in2con_zys" alt="">
|
||||||
<img src="@/assets/image/kuang_zuoxia.png" class="in2con_zzx" alt="">
|
<img src="@/assets/image/kuang_zuoxia.png" class="in2con_zzx" alt="">
|
||||||
|
|
@ -241,10 +281,11 @@
|
||||||
<img src="@/assets/image/sanguang.png" class="sanguangbt" alt="">
|
<img src="@/assets/image/sanguang.png" class="sanguangbt" alt="">
|
||||||
<div>
|
<div>
|
||||||
<div class="home_dlhj">
|
<div class="home_dlhj">
|
||||||
|
<!-- <span class="in1con_lf_titshow12" >监测指标统计</span>-->
|
||||||
<el-carousel :autoplay="false" indicator-position="none" arrow="always" height="320px">
|
<el-carousel :autoplay="false" indicator-position="none" arrow="always" height="320px">
|
||||||
<el-carousel-item v-for="item in stationInfoList" :key="item.id">
|
<el-carousel-item v-for="item in stationInfoList" :key="item.id">
|
||||||
<div class="in1con_lf_tit " >
|
<div class="in1con_lf_tit " >
|
||||||
<span class="in1con_lf_titshow1 " style="cursor: pointer"
|
<span class="in1con_lf_titshow1 in1con_lf_titshow13" style="cursor: pointer"
|
||||||
@click="jumpStationPage(item)">{{ item.stationName }}</span>
|
@click="jumpStationPage(item)">{{ item.stationName }}</span>
|
||||||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -256,7 +297,7 @@
|
||||||
</viewer>
|
</viewer>
|
||||||
</div>
|
</div>
|
||||||
<div class="jczbtm" @click="showEchartDialog($event, 1)" >
|
<div class="jczbtm" @click="showEchartDialog($event, 1)" >
|
||||||
<vue-seamless-scroll :data="item.wrwcode" class="wp-1 hp-1" :class-option="classWrwcod">
|
<vue-seamless-scroll :data="[...item.wrwcode,...item.wrwcode]" class="wp-1 hp-1" :class-option="classWrwcod">
|
||||||
<div class="jczbtm_lf" v-for="(valist,index) in item.wrwcode" :key="valist.index"
|
<div class="jczbtm_lf" v-for="(valist,index) in item.wrwcode" :key="valist.index"
|
||||||
:data-item="JSON.stringify(item)" :data-survItem="valist.tylename" >
|
:data-item="JSON.stringify(item)" :data-survItem="valist.tylename" >
|
||||||
<img :src="urlimg + valist.icon" class="tpimg" alt="">
|
<img :src="urlimg + valist.icon" class="tpimg" alt="">
|
||||||
|
|
@ -269,6 +310,18 @@
|
||||||
{{ valist.unit }}</span>
|
{{ valist.unit }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="jczbtm_lf" v-for="(valist,index) in item.wrwcode" :key="valist.index"
|
||||||
|
:data-item="JSON.stringify(item)" :data-survItem="valist.tylename" >
|
||||||
|
<img :src="urlimg + valist.icon" class="tpimg" alt="">
|
||||||
|
<div class="jczbtm_lf_rt">
|
||||||
|
<span class="jczbtm_lf_rttit">{{ valist.name }}</span>
|
||||||
|
<span class="jczbtm_lf_rtnum">
|
||||||
|
<!-- <animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0" :to="valist.code"-->
|
||||||
|
<!-- :key="valist.tylename+'_key'" duration="3000"></animate-number>-->
|
||||||
|
<span class="in1con_lf_imglf_num_jix">{{valist.code?parseFloat((valist.code-0).toFixed(2)):'--'}}</span>
|
||||||
|
{{ valist.unit }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</vue-seamless-scroll>
|
</vue-seamless-scroll>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -278,13 +331,13 @@
|
||||||
</div>
|
</div>
|
||||||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||||||
<div>
|
<div>
|
||||||
<div class="in1con_lf_tit " style="cursor: pointer;" @click="taizhangDialogShowFlag=true">
|
<div class="in1con_lf_tit " style="cursor: pointer;" @click1="taizhangDialogShowFlag=true">
|
||||||
<span class="in1con_lf_titshow1">核算与评估</span>
|
<span class="in1con_lf_titshow1">面源污染治理效果评价</span>
|
||||||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||||||
<!-- <span class="in1con_lf_titshow2 " style="">台账>></span>-->
|
<!-- <span class="in1con_lf_titshow2 " style="">台账>></span>-->
|
||||||
</div>
|
</div>
|
||||||
<div class="mywrcov">
|
<div class="mywrcov">
|
||||||
<div class="mywrcov_one mywrcov_onehover" @click="showEchartDialog({stationCode: 'S_1'}, 'dataWaterTp')">
|
<div class="mywrcov_one mywrcov_onehover" @click1="showEchartDialog({stationCode: 'S_1'}, 'dataWaterTp')">
|
||||||
<span class="mywrcov_onetit">{{ effect_assess0.detailCode }}</span>
|
<span class="mywrcov_onetit">{{ effect_assess0.detailCode }}</span>
|
||||||
<span class="mywrcov_onenum">
|
<span class="mywrcov_onenum">
|
||||||
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess0.detailValue }}</span>
|
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess0.detailValue }}</span>
|
||||||
|
|
@ -292,7 +345,7 @@
|
||||||
<!-- :to="effect_assess0.detailValue" />-->
|
<!-- :to="effect_assess0.detailValue" />-->
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mywrcov_two mywrcov_onehover" @click="showEchartDialog({stationCode: 'S_1'}, 'dataWaterTn')">
|
<div class="mywrcov_two mywrcov_onehover" @click1="showEchartDialog({stationCode: 'S_1'}, 'dataWaterTn')">
|
||||||
<span class="mywrcov_onetit">{{ effect_assess1.detailCode }}</span>
|
<span class="mywrcov_onetit">{{ effect_assess1.detailCode }}</span>
|
||||||
<span class="mywrcov_onenum">
|
<span class="mywrcov_onenum">
|
||||||
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess1.detailValue }}</span>
|
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess1.detailValue }}</span>
|
||||||
|
|
@ -300,7 +353,7 @@
|
||||||
<!-- :to="effect_assess0.detailValue" />-->
|
<!-- :to="effect_assess0.detailValue" />-->
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mywrcov_three mywrcov_onehover" @click="showEchartDialog({stationCode: 'S_1'}, 'dataWaterCod')">
|
<div class="mywrcov_three mywrcov_onehover" @click1="showEchartDialog({stationCode: 'S_1'}, 'dataWaterCod')">
|
||||||
<span class="mywrcov_onenum" style="margin-top: 1vw;">
|
<span class="mywrcov_onenum" style="margin-top: 1vw;">
|
||||||
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess2.detailValue }}</span>
|
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess2.detailValue }}</span>
|
||||||
<!-- <animate-number class="in1con_lf_imglf_num_jix mywrcov_onenumjx" :ref="(dom)=>animateObj.push(dom)" duration="3000" from="0"-->
|
<!-- <animate-number class="in1con_lf_imglf_num_jix mywrcov_onenumjx" :ref="(dom)=>animateObj.push(dom)" duration="3000" from="0"-->
|
||||||
|
|
@ -308,7 +361,7 @@
|
||||||
</span>
|
</span>
|
||||||
<span class="mywrcov_onetit">{{ effect_assess2.detailCode }}</span>
|
<span class="mywrcov_onetit">{{ effect_assess2.detailCode }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mywrcov_four mywrcov_onehover" @click="taizhangDialogShowFlag=true">
|
<div class="mywrcov_four mywrcov_onehover" @click1="taizhangDialogShowFlag=true">
|
||||||
<span class="mywrcov_onenum" style="margin-top: 1vw; cursor: pointer">
|
<span class="mywrcov_onenum" style="margin-top: 1vw; cursor: pointer">
|
||||||
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess3.detailValue }}</span>
|
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess3.detailValue }}</span>
|
||||||
<!-- <animate-number class="in1con_lf_imglf_num_jix mywrcov_onenumjx" :ref="(dom)=>animateObj.push(dom)" duration="3000" from="0"-->
|
<!-- <animate-number class="in1con_lf_imglf_num_jix mywrcov_onenumjx" :ref="(dom)=>animateObj.push(dom)" duration="3000" from="0"-->
|
||||||
|
|
@ -327,7 +380,7 @@
|
||||||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||||||
<div>
|
<div>
|
||||||
<div class="in1con_lf_tit ">
|
<div class="in1con_lf_tit ">
|
||||||
<span class="in1con_lf_titshow1">长期定位监测实时数据</span>
|
<span class="in1con_lf_titshow1">监测站实时数据</span>
|
||||||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||||||
</div>
|
</div>
|
||||||
<div style="height:280px;overflow: hidden" @click="showEchartDialog($event, 1)">
|
<div style="height:280px;overflow: hidden" @click="showEchartDialog($event, 1)">
|
||||||
|
|
@ -414,7 +467,7 @@
|
||||||
</div>
|
</div>
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<div class="grid-content bg-purple" style="width:80%;margin-left:10%;">
|
<div class="grid-content bg-purple" style="">
|
||||||
<el-carousel indicator-position="outside">
|
<el-carousel indicator-position="outside">
|
||||||
<el-carousel-item v-for="(item,index) in qyinformation.extPics" :key="index">
|
<el-carousel-item v-for="(item,index) in qyinformation.extPics" :key="index">
|
||||||
<viewer :images="qyinformation.extPics">
|
<viewer :images="qyinformation.extPics">
|
||||||
|
|
@ -426,8 +479,8 @@
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<div class="grid-content bg-purple-light">
|
<div class="grid-content bg-purple-light">
|
||||||
<span class="tctit">{{ qyinformation.name }}</span>
|
<span class="tctit">{{ qyinformation.entName }}</span>
|
||||||
<span class="tcgldw">{{ qyinformation.notes }}</span>
|
<span class="tcgldw">{{ qyinformation.entIntro }}</span>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
@ -446,7 +499,7 @@ import ScaleBox from 'vue2-scale-box'
|
||||||
import {
|
import {
|
||||||
displayInfo,
|
displayInfo,
|
||||||
fwlist,
|
fwlist,
|
||||||
getAllstationAndPestLight,
|
getAllstationAndPestLight, getCompanyList,
|
||||||
getIndexSummry,
|
getIndexSummry,
|
||||||
getNewestData,
|
getNewestData,
|
||||||
getPollutionDict,
|
getPollutionDict,
|
||||||
|
|
@ -482,8 +535,9 @@ export default {
|
||||||
markersOrient: [],
|
markersOrient: [],
|
||||||
markersSoil: [],
|
markersSoil: [],
|
||||||
markersOther: [],
|
markersOther: [],
|
||||||
|
markersLight: [],
|
||||||
lastClickIcon: '',
|
lastClickIcon: '',
|
||||||
urlimg: 'https://fxnsp.zgzhny.com/lh-api/sys/common/static/',
|
urlimg: 'https://fxnsp.sxcooh.com/lh-api/sys/common/static/',
|
||||||
mapTypeFlag: true,
|
mapTypeFlag: true,
|
||||||
nowTime: '',
|
nowTime: '',
|
||||||
briefconCode: "",
|
briefconCode: "",
|
||||||
|
|
@ -509,6 +563,7 @@ export default {
|
||||||
qcdtdialogTableVisible: false,
|
qcdtdialogTableVisible: false,
|
||||||
qyinfordtdialogTableVisible: false,
|
qyinfordtdialogTableVisible: false,
|
||||||
shipdialogTableVisible: false,
|
shipdialogTableVisible: false,
|
||||||
|
entList:[],
|
||||||
qyinformation: '',
|
qyinformation: '',
|
||||||
listData: [],
|
listData: [],
|
||||||
summryAllData: null,
|
summryAllData: null,
|
||||||
|
|
@ -519,12 +574,14 @@ export default {
|
||||||
dialogVisible: false,
|
dialogVisible: false,
|
||||||
inforname: '',
|
inforname: '',
|
||||||
loading: true,
|
loading: true,
|
||||||
zoomData: 14,
|
iniZoomData: 11,
|
||||||
|
normalZoomData: 12,
|
||||||
|
focusZoomData: 14,
|
||||||
isShowLightNumber: '1',
|
isShowLightNumber: '1',
|
||||||
switchValue: true,
|
switchValue: true,
|
||||||
fullscreen: false, //全屏
|
fullscreen: false, //全屏
|
||||||
echartIndex: 0,
|
echartIndex: 0,
|
||||||
dateType: 'monthDays',
|
dateType: 'yearMonth',
|
||||||
dateTypeOptions: [{
|
dateTypeOptions: [{
|
||||||
value: 'dayhours',
|
value: 'dayhours',
|
||||||
label: '24小时'
|
label: '24小时'
|
||||||
|
|
@ -538,6 +595,7 @@ export default {
|
||||||
soidShowFlag: false,
|
soidShowFlag: false,
|
||||||
soilDataId: '',
|
soilDataId: '',
|
||||||
tabsLoading: false,
|
tabsLoading: false,
|
||||||
|
lastZIndex: 1,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
|
@ -589,10 +647,24 @@ export default {
|
||||||
// })
|
// })
|
||||||
// }, 2000)
|
// }, 2000)
|
||||||
// 实时时间
|
// 实时时间
|
||||||
|
|
||||||
|
let that = this;
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.$nextTick(() => {
|
getCompanyList().then(res => {
|
||||||
this.initMap(this.zoomData, this.isShowLightNumber);
|
that.entList = res.result.map(item => {
|
||||||
})
|
item.type = 'ent';
|
||||||
|
item.longitude = item.entLong;
|
||||||
|
item.latitude = item.entLat;
|
||||||
|
item.name = item.entName;
|
||||||
|
item.picUrl = item.entMapIcon||'temp/enticon.png';
|
||||||
|
item.width = 0 ;
|
||||||
|
item.height = 0;
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
that.$nextTick(() => {
|
||||||
|
that.initMap(that.iniZoomData, that.isShowLightNumber);
|
||||||
|
})
|
||||||
|
});
|
||||||
}, 2000)
|
}, 2000)
|
||||||
//初始化数据
|
//初始化数据
|
||||||
this.getNowTime();
|
this.getNowTime();
|
||||||
|
|
@ -601,7 +673,7 @@ export default {
|
||||||
this.getPollutionDictList();
|
this.getPollutionDictList();
|
||||||
this.infor();
|
this.infor();
|
||||||
this.indexinfor();
|
this.indexinfor();
|
||||||
this.handleClick({index: this.echartIndex});
|
this.doGetIndexSummry({index: this.echartIndex});
|
||||||
this.initSoilData();
|
this.initSoilData();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
@ -621,25 +693,25 @@ export default {
|
||||||
mapTypeSwitch() {
|
mapTypeSwitch() {
|
||||||
this.mapTypeFlag = !this.mapTypeFlag
|
this.mapTypeFlag = !this.mapTypeFlag
|
||||||
if (this.mapTypeFlag == true) {//正常模式
|
if (this.mapTypeFlag == true) {//正常模式
|
||||||
this.zoomData = 14
|
// this.iniZoomData = 14
|
||||||
if (this.isShowLight == undefined) {
|
if (this.isShowLight == undefined) {
|
||||||
let isShowLight = '1'
|
let isShowLight = '1'
|
||||||
this.initMap(this.zoomData, isShowLight);
|
this.initMap(this.iniZoomData, isShowLight);
|
||||||
} else {
|
} else {
|
||||||
let isShowLight = this.isShowLight
|
let isShowLight = this.isShowLight
|
||||||
this.initMap(this.zoomData, isShowLight);
|
this.initMap(this.iniZoomData, isShowLight);
|
||||||
}
|
}
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.handleClick({index: 0});
|
this.doGetIndexSummry({index: 0});
|
||||||
})
|
})
|
||||||
}, 1000)
|
}, 1000)
|
||||||
} else {// 地图模式
|
} else {// 地图模式
|
||||||
this.zoomData = 15
|
// this.iniZoomData = 15
|
||||||
if (this.isShowLight == undefined) {
|
if (this.isShowLight == undefined) {
|
||||||
this.initMap(this.zoomData, '1');
|
this.initMap(this.iniZoomData, '1');
|
||||||
} else {
|
} else {
|
||||||
this.initMap(this.zoomData, this.isShowLight);
|
this.initMap(this.iniZoomData, this.isShowLight);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -692,11 +764,11 @@ export default {
|
||||||
if (value == true) {
|
if (value == true) {
|
||||||
let isShowLight = '1'
|
let isShowLight = '1'
|
||||||
this.isShowLight = isShowLight
|
this.isShowLight = isShowLight
|
||||||
this.initMap(this.zoomData, isShowLight)
|
this.initMap(this.iniZoomData, isShowLight)
|
||||||
} else {
|
} else {
|
||||||
let isShowLight = ''
|
let isShowLight = ''
|
||||||
this.isShowLight = isShowLight
|
this.isShowLight = isShowLight
|
||||||
this.initMap(this.zoomData, isShowLight)
|
this.initMap(this.iniZoomData, isShowLight)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
scaleChange(e) {
|
scaleChange(e) {
|
||||||
|
|
@ -735,15 +807,15 @@ export default {
|
||||||
}, 200)
|
}, 200)
|
||||||
},
|
},
|
||||||
initMap(zoomnum, isShowLight) {
|
initMap(zoomnum, isShowLight) {
|
||||||
|
console.log("初始化地图。")
|
||||||
let that = this;
|
let that = this;
|
||||||
// let isShowLight = this.isShowLightNumber
|
|
||||||
getAllstationAndPestLight(isShowLight).then(res => {
|
getAllstationAndPestLight(isShowLight).then(res => {
|
||||||
// 地图
|
// 地图
|
||||||
that.aMap = new AMap.Map('container', {
|
that.aMap = new AMap.Map('container', {
|
||||||
viewMode: '3D',
|
viewMode: '3D',
|
||||||
resizeEnable: true,
|
resizeEnable: true,
|
||||||
zoom: zoomnum,
|
zoom: zoomnum,
|
||||||
center: [111.436625, 36.771975],//默认的地图中心经纬度
|
center: [110.6560, 35.5772],//默认的地图中心经纬度
|
||||||
mapStyle: 'amap://styles/blue',
|
mapStyle: 'amap://styles/blue',
|
||||||
dragEnable: true,//地图是否可通过鼠标拖拽平移,默认为true。此属性可被setStatus/getStatus 方法控制
|
dragEnable: true,//地图是否可通过鼠标拖拽平移,默认为true。此属性可被setStatus/getStatus 方法控制
|
||||||
jogEnable: true,//地图是否使用缓动效果,默认值为true。此属性可被setStatus/getStatus 方法控制
|
jogEnable: true,//地图是否使用缓动效果,默认值为true。此属性可被setStatus/getStatus 方法控制
|
||||||
|
|
@ -755,51 +827,104 @@ export default {
|
||||||
showIndoorMap: false, // 隐藏地图自带的室内地图图层
|
showIndoorMap: false, // 隐藏地图自带的室内地图图层
|
||||||
expandZoomRange: true,//是否支持可以扩展最大缩放级别,和zooms属性配合使用设置为true的时候,zooms的最大级别在PC上可以扩大到20级,移动端还是高清19/非高清20
|
expandZoomRange: true,//是否支持可以扩展最大缩放级别,和zooms属性配合使用设置为true的时候,zooms的最大级别在PC上可以扩大到20级,移动端还是高清19/非高清20
|
||||||
forceVector: true,
|
forceVector: true,
|
||||||
scale: (2 , 2.5)
|
scale: (2, 2.5)
|
||||||
});
|
});
|
||||||
that.aMap.on('complete', (e) => {
|
that.aMap.on('complete', (e) => {
|
||||||
var markerData = res.result;
|
let Marker = res.result.filter(ele => {
|
||||||
let Marker = markerData.filter(ele => ele.type != 'light');//其他类型
|
return ele.type != 'air' && ele.type != 'soil' && ele.type != 'light' && ele.type != 'cusLocaltion'
|
||||||
|
}
|
||||||
|
).sort((a,b) => {
|
||||||
|
if (b.type=='soil') return 1;
|
||||||
|
if (b.type!='soil') return -1;
|
||||||
|
return 0;
|
||||||
|
});//其他类型
|
||||||
|
let MarkerLight = res.result.filter(ele => ele.type == 'light' );
|
||||||
|
// console.log(Marker,'Marker')
|
||||||
|
Marker.push(...this.entList);//加入企业点位数组
|
||||||
|
// console.log("初始化地图。2", Marker)
|
||||||
Marker.map(item => {
|
Marker.map(item => {
|
||||||
|
if(!item.longitude || !item.latitude){
|
||||||
|
console.log("item坐标缺失:", item)
|
||||||
|
return;
|
||||||
|
}
|
||||||
let marker = new AMap.Marker({
|
let marker = new AMap.Marker({
|
||||||
zIndex: item.type == 'orient' ? 1000 : 500,
|
zIndex: item.type == 'soil' ? that.lastZIndex : (that.lastZIndex+1),
|
||||||
icon: this.urlimg + item.picUrl,
|
icon: this.urlimg + item.picUrl,
|
||||||
position: [item.longitude, item.latitude],
|
position: [item.longitude, item.latitude],
|
||||||
offset: new AMap.Pixel(item.width, item.height),//偏移量
|
offset: new AMap.Pixel(item.width||0, item.height||0),//偏移量
|
||||||
title: item.name,
|
title: item.name,
|
||||||
|
// label: {
|
||||||
|
// content: item.type == "ent"? item.name : '',
|
||||||
|
// direction: 'top'
|
||||||
|
// },
|
||||||
extData: {
|
extData: {
|
||||||
ids: item.ids,
|
ids: item.ids,
|
||||||
extPics: item.extPics,
|
extPics: item.extPics,
|
||||||
notes: item.notes,
|
notes: item.notes,
|
||||||
name: item.name,
|
name: item.name,
|
||||||
item: item
|
item: item,
|
||||||
|
stationType: item.type
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if (item.type == 'orient') {//监测站弹窗
|
//点位添加事件
|
||||||
|
if (item.type == 'orient' || item.type == 'livestock' || item.type == 'watershed') {//监测站弹窗
|
||||||
marker.on('click', e => {
|
marker.on('click', e => {
|
||||||
let indexnumb = e.target.getExtData().ids.slice(-1);
|
let indexnumb = e.target.getExtData().ids.slice(-1);
|
||||||
this.qcdtinfor = this.stationInfoList[indexnumb]
|
this.qcdtinfor = this.stationInfoList[indexnumb]
|
||||||
this.qcdtdialogTableVisible = true
|
this.qcdtdialogTableVisible = true
|
||||||
console.log('livestock or orient', this.qyinformation)
|
|
||||||
})
|
})
|
||||||
this.markersOrient.push(marker)
|
this.markersOrient.push(marker)
|
||||||
} else if(item.type == 'soil'){//土壤弹窗,长期监测站
|
} else if(item.type == 'soil'){//土壤弹窗,长期监测站
|
||||||
marker.on('click', e => {
|
marker.on('click', e => {
|
||||||
this.soilDataId = e.target.getExtData()
|
this.soilDataId = e.target.getExtData()
|
||||||
this.soidShowFlag = true
|
this.soidShowFlag = true
|
||||||
console.log('soil click', )
|
|
||||||
})
|
})
|
||||||
this.markersSoil.push(marker)
|
this.markersSoil.push(marker);
|
||||||
} else {
|
} else if(item.type == "ent"){//企业类型
|
||||||
|
marker.on("click", e => {
|
||||||
|
console.log('click ent')
|
||||||
|
this.qyinformation= e.target.getExtData().item
|
||||||
|
if(this.qyinformation.entPics){
|
||||||
|
this.qyinformation.extPics = this.qyinformation.entPics.split(",");
|
||||||
|
}else {
|
||||||
|
this.qyinformation.extPics = []
|
||||||
|
}
|
||||||
|
this.qyinfordtdialogTableVisible = true
|
||||||
|
})
|
||||||
|
this.markersOrient.push(marker);
|
||||||
|
} else {
|
||||||
this.markersOther.push(marker)
|
this.markersOther.push(marker)
|
||||||
}
|
}
|
||||||
marker.setMap(that.aMap);
|
marker.setMap(that.aMap);
|
||||||
})
|
})
|
||||||
|
if(MarkerLight.length > 0){
|
||||||
|
var points = [];
|
||||||
|
MarkerLight.map(item => {
|
||||||
|
points.push({lnglat: [item.longitude, item.latitude],"name":"杀虫灯","style":2});
|
||||||
|
});
|
||||||
|
let clusterMarker = new AMap.MassMarks(
|
||||||
|
points,{
|
||||||
|
opacity: 0.8,
|
||||||
|
zIndex: 111,
|
||||||
|
cursor: 'pointer',
|
||||||
|
style: [{
|
||||||
|
url: this.urlimg + MarkerLight[0].picUrl,
|
||||||
|
anchor: new AMap.Pixel(6, 6),
|
||||||
|
size: new AMap.Size(18, 18),
|
||||||
|
zIndex: 3,
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
);
|
||||||
|
that.markersLight.push(clusterMarker);
|
||||||
|
setTimeout(()=>{clusterMarker.setMap(that.aMap);}, 3500);
|
||||||
|
}
|
||||||
this.$forceUpdate();
|
this.$forceUpdate();
|
||||||
// that.aMap.setFitView(null, false, [100,400,200,200], 16);
|
// that.aMap.setFitView(null, false, [100,400,200,200], 16);
|
||||||
that.aMap.setFitView();
|
// that.aMap.setFitView();
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
that.aMap.setFitView(null, false, [130, 380, 200, 200], 16);
|
that.switchIcon('1');
|
||||||
|
// that.aMap.setFitView(null, false, [130, 380, 480, 480], 12);
|
||||||
// let temp = that.aMap.getCenter();//矫正显示标点位置在正中心
|
// let temp = that.aMap.getCenter();//矫正显示标点位置在正中心
|
||||||
// that.aMap.setZoomAndCenter(that.aMap.getZoom()-1, [temp.lng, temp.lat - 0.15]);
|
// that.aMap.setZoomAndCenter(that.aMap.getZoom()-1, [temp.lng, temp.lat - 0.15]);
|
||||||
}, 2000)
|
}, 2000)
|
||||||
|
|
@ -808,7 +933,17 @@ export default {
|
||||||
},
|
},
|
||||||
getNewestDataList() {
|
getNewestDataList() {
|
||||||
getNewestData().then(res => {
|
getNewestData().then(res => {
|
||||||
this.listData = res.result.soilHisSurvData
|
let tempArray = [];
|
||||||
|
Object.keys(res.result).map(key => {
|
||||||
|
console.log(key)
|
||||||
|
tempArray = tempArray.concat(res.result[key])
|
||||||
|
})
|
||||||
|
// this.listData = res.result.soilHisSurvData
|
||||||
|
tempArray.map(item => {
|
||||||
|
if(!item.value){item.value = '0';}
|
||||||
|
})
|
||||||
|
this.listData = tempArray
|
||||||
|
console.log(this.listData)
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
getPollutionDictList() {
|
getPollutionDictList() {
|
||||||
|
|
@ -822,17 +957,17 @@ export default {
|
||||||
this.echartInit[key].dispose();
|
this.echartInit[key].dispose();
|
||||||
}
|
}
|
||||||
this.echartInit = {};
|
this.echartInit = {};
|
||||||
this.handleClick({index: this.echartIndex});
|
this.doGetIndexSummry({index: this.echartIndex});
|
||||||
},
|
},
|
||||||
switchEchartType() {
|
switchEchartType() {
|
||||||
this.dataTypeEchart = (!this.dataTypeEchart);
|
this.dataTypeEchart = (!this.dataTypeEchart);
|
||||||
this.echartInit = {};
|
this.echartInit = {};
|
||||||
this.activeName2 = this.riverList[0].stationName
|
// this.activeName2 = this.riverList[0].stationName
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.handleClick({index: 0});
|
this.doGetIndexSummry({index: 0});
|
||||||
}, 300);
|
}, 300);
|
||||||
},
|
},
|
||||||
handleClick(tab, event) {
|
doGetIndexSummry(tab, event) {
|
||||||
this.tabsLoading = true;
|
this.tabsLoading = true;
|
||||||
this.echartIndex = tab.index - 0;
|
this.echartIndex = tab.index - 0;
|
||||||
if (this.summryAllData) {
|
if (this.summryAllData) {
|
||||||
|
|
@ -845,6 +980,7 @@ export default {
|
||||||
this.summryAllData = res.result;
|
this.summryAllData = res.result;
|
||||||
let len = this.summryAllData.length;
|
let len = this.summryAllData.length;
|
||||||
this.riverList = [];
|
this.riverList = [];
|
||||||
|
//计算对比值,2号站数据减1号站
|
||||||
this.summryAllData.map((item1, index) => {
|
this.summryAllData.map((item1, index) => {
|
||||||
if (index % 2 === 0 && item1['datas'] && (index + 1) < len) {
|
if (index % 2 === 0 && item1['datas'] && (index + 1) < len) {
|
||||||
let data1 = item1['datas'];
|
let data1 = item1['datas'];
|
||||||
|
|
@ -857,7 +993,7 @@ export default {
|
||||||
if (data1[key] instanceof Array) {
|
if (data1[key] instanceof Array) {
|
||||||
data3[key] = []
|
data3[key] = []
|
||||||
data1[key].map((itemSub, index) => {
|
data1[key].map((itemSub, index) => {
|
||||||
if (data2[key][index] && data1[key][index]){
|
if (data2[key] && data2[key][index] && data1[key][index]){
|
||||||
data3[key].push((data2[key][index] - data1[key][index]).toFixed(2))
|
data3[key].push((data2[key][index] - data1[key][index]).toFixed(2))
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
@ -868,7 +1004,6 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// console.log('对比数据初始化:', this.riverList)
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.$nextTick(() => { // 加载echarts图
|
this.$nextTick(() => { // 加载echarts图
|
||||||
this.initEchartData(this.echartIndex)
|
this.initEchartData(this.echartIndex)
|
||||||
|
|
@ -879,7 +1014,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 折线图数据
|
// 折线图数据
|
||||||
initEchartData(index) {
|
initEchartData(index, times) {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
let domKey = `myChartDiv${index}`;
|
let domKey = `myChartDiv${index}`;
|
||||||
let data = this.summryAllData[index];
|
let data = this.summryAllData[index];
|
||||||
|
|
@ -893,7 +1028,10 @@ export default {
|
||||||
// console.log('初始化echart:', index, domKey, data, /^\d+$/.test(index) ,this.echartInit[domKey])
|
// console.log('初始化echart:', index, domKey, data, /^\d+$/.test(index) ,this.echartInit[domKey])
|
||||||
let divDom = document.getElementById(domKey);
|
let divDom = document.getElementById(domKey);
|
||||||
if (!divDom) {
|
if (!divDom) {
|
||||||
console.log('没找到dom:', domKey, divDom)
|
console.log('没找到dom,两秒后重试:', domKey, divDom)
|
||||||
|
if(times!==2){
|
||||||
|
setTimeout(()=>{this.initEchartData(index,2)}, 1500);
|
||||||
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
console.log('开始初始化echart:')
|
console.log('开始初始化echart:')
|
||||||
|
|
@ -1009,15 +1147,15 @@ export default {
|
||||||
// 跳转页面3
|
// 跳转页面3
|
||||||
jumpStationPage(e) {
|
jumpStationPage(e) {
|
||||||
let stationCode = e.stationCode
|
let stationCode = e.stationCode
|
||||||
if (e.stationType == 'livestock') {
|
// if (e.stationType == 'livestock') {
|
||||||
this.$router.push({path: '/CqyzList', query: {stationCode: stationCode}})
|
// this.$router.push({path: '/CqyzList', query: {stationCode: stationCode}})
|
||||||
// this.$message({
|
// // this.$message({
|
||||||
// message: '站点正在建设中......',
|
// // message: '站点正在建设中......',
|
||||||
// showClose: true,
|
// // showClose: true,
|
||||||
// });
|
// // });
|
||||||
} else {
|
// } else {
|
||||||
this.$router.push({path: '/MywrList', query: {stationCode: stationCode}})
|
this.$router.push({path: '/MywrList', query: {stationCode: stationCode}})
|
||||||
}
|
// }
|
||||||
},
|
},
|
||||||
// 弹窗退出登录
|
// 弹窗退出登录
|
||||||
handleClosetuichu(done) {
|
handleClosetuichu(done) {
|
||||||
|
|
@ -1072,23 +1210,35 @@ export default {
|
||||||
this.lastClickIcon = ''
|
this.lastClickIcon = ''
|
||||||
} else {
|
} else {
|
||||||
this.lastClickIcon = flag;
|
this.lastClickIcon = flag;
|
||||||
if (flag == 'duizhuhe') {
|
if (flag == 'soil') {
|
||||||
arr = this.markersOrient.filter(item => item.getExtData().name.indexOf("对竹河") != -1);
|
|
||||||
} else if (flag == 'tuanbaihe') {
|
|
||||||
arr = this.markersOrient.filter(item => item.getExtData().name.indexOf("团柏河") != -1);
|
|
||||||
} else if (flag == 'soil') {
|
|
||||||
arr = this.markersSoil;
|
arr = this.markersSoil;
|
||||||
|
} else {
|
||||||
|
arr = this.markersOrient.filter(item => item.getExtData().stationType.indexOf(flag) != -1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (arr && arr.length > 0) {
|
if (arr && arr.length > 0) {
|
||||||
that.aMap.setFitView(arr, false, [200, 500, 300, 300], 16);
|
arr.map(item => {
|
||||||
|
item.setzIndex((that.lastZIndex+=2));
|
||||||
|
});
|
||||||
|
that.aMap.setFitView(arr, false, [300, 500, 360, 360], that.focusZoomData);
|
||||||
// setTimeout(() => {
|
// setTimeout(() => {
|
||||||
// let temp = that.aMap.getCenter();//矫正显示标点位置在正中心
|
// let temp = that.aMap.getCenter();//矫正显示标点位置在正中心
|
||||||
// that.aMap.setZoomAndCenter(that.aMap.getZoom()-2, [temp.lng, temp.lat - 0.15]);
|
// that.aMap.setZoomAndCenter(that.aMap.getZoom()-2, [temp.lng, temp.lat - 0.15]);
|
||||||
// },2000)
|
// },2000)
|
||||||
} else {
|
} else {
|
||||||
that.aMap.setFitView(null, false, [100, 400, 200, 200], 16);
|
that.aMap.setFitView(that.markersOrient, false, [100, 400, 360, 360], that.normalZoomData);
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
switchLightIcon(){
|
||||||
|
this.markersLight.map(item => {
|
||||||
|
if(item.hide1){
|
||||||
|
item.show();
|
||||||
|
item.hide1 = false;
|
||||||
|
} else {
|
||||||
|
item.hide();
|
||||||
|
item.hide1 = true;
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
@ -1455,14 +1605,8 @@ a:hover {
|
||||||
|
|
||||||
.map img {
|
.map img {
|
||||||
width: 80%;
|
width: 80%;
|
||||||
margin-left: 10%;
|
//margin-left: 10%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.map img {
|
|
||||||
width: 80%;
|
|
||||||
margin-left: 10%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mapActived1 {
|
.mapActived1 {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 41.5%;
|
top: 41.5%;
|
||||||
|
|
@ -1554,7 +1698,20 @@ a:hover {
|
||||||
border: none;
|
border: none;
|
||||||
background: none;
|
background: none;
|
||||||
}
|
}
|
||||||
|
.in1con_lf_titshow12 {
|
||||||
|
font-size: 1vw;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 0px 2px 0px rgba(4, 49, 52, 0.55);
|
||||||
|
font-family: douyuFont;
|
||||||
|
//position: absolute;
|
||||||
|
top: 1vw;
|
||||||
|
left: 0%;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
margin: 0;
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
.in1con_lf_titshow1 {
|
.in1con_lf_titshow1 {
|
||||||
font-size: 1vw;
|
font-size: 1vw;
|
||||||
|
|
@ -1568,6 +1725,9 @@ a:hover {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
.in1con_lf_titshow13{
|
||||||
|
//color: #ffa;
|
||||||
|
}
|
||||||
.in1con_lf_titshow2 {
|
.in1con_lf_titshow2 {
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
|
@ -1690,20 +1850,23 @@ a:hover {
|
||||||
/* 企业弹窗样式 */
|
/* 企业弹窗样式 */
|
||||||
.tctit {
|
.tctit {
|
||||||
font-size: 1.2vw;
|
font-size: 1.2vw;
|
||||||
color: #fff;
|
color: #0bf373;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
display: block;
|
display: block;
|
||||||
margin-bottom: 1.6vw;
|
margin-bottom: 1.6vw;
|
||||||
|
margin: 5px auto;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tcgldw {
|
.tcgldw {
|
||||||
font-size: 1vw;
|
font-size: 0.8vw;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
line-height: 2vw;
|
line-height: 2vw;
|
||||||
display: block;
|
display: block;
|
||||||
padding-right: 3%;
|
padding-right: 3%;
|
||||||
height: 15vw;
|
height: 15vw;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
text-indent: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 定义滚动条样式 */
|
/* 定义滚动条样式 */
|
||||||
|
|
@ -1867,5 +2030,56 @@ a:hover {
|
||||||
.mywrcov_onenumjx{
|
.mywrcov_onenumjx{
|
||||||
font-size: 1.2vw;
|
font-size: 1.2vw;
|
||||||
}
|
}
|
||||||
|
.amap-marker-label{
|
||||||
|
//width: 60px;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: center;
|
||||||
|
height: 18px;
|
||||||
|
font-family: STLiti;
|
||||||
|
color: #bbd6f1;
|
||||||
|
border-radius: 15px;
|
||||||
|
padding: 5px;
|
||||||
|
background-color: rgba(77, 140, 241, 0.84);
|
||||||
|
border: solid 2px rgba(100,255,200,0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.tz_cov{
|
||||||
|
width: 100%;
|
||||||
|
height: 30vw;
|
||||||
|
margin: 0 auto;
|
||||||
|
/* margin-top: 4vw; */
|
||||||
|
border: 1px solid #0169d0;
|
||||||
|
position: relative;
|
||||||
|
background: rgba(16, 45, 80, 1);
|
||||||
|
box-shadow: inset 0px 0px 16px 0px rgba(0, 145, 255, 1);
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.tz_cov_top{
|
||||||
|
width: 40%;
|
||||||
|
height: 3vw;
|
||||||
|
margin: 0 auto;
|
||||||
|
background: url(../../assets/image/tz_tltle_bg.png)no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 3vw;
|
||||||
|
margin-bottom: 2vw;
|
||||||
|
}
|
||||||
|
.tz_cov_top_tit{
|
||||||
|
font-size: 1vw;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 0px 2px 0px rgba(4,49,52,0.55);
|
||||||
|
font-family: douyuFont;
|
||||||
|
}
|
||||||
|
.grid-content{
|
||||||
|
padding: 10px
|
||||||
|
}
|
||||||
|
|
||||||
|
.jctc_add {
|
||||||
|
//height: 1vw;
|
||||||
|
min-height: 1vw !important;
|
||||||
|
padding-left: 18px;
|
||||||
|
margin-top: 0.6vw;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -13,8 +13,8 @@
|
||||||
element-loading-background="rgba(0, 0, 0, 0.8)"
|
element-loading-background="rgba(0, 0, 0, 0.8)"
|
||||||
>
|
>
|
||||||
<div class="nav">
|
<div class="nav">
|
||||||
<span class="nav_ti nav_mag">汾西县黄河流域农业面源污染平台</span>
|
<span class="nav_ti nav_mag">武乡县黄河流域农业面源污染平台</span>
|
||||||
<span class="nav_tit">治理效果评价与预警一张图</span>
|
<span class="nav_tit">治理效果评价和监测一张图</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="nav_btn">
|
<div class="nav_btn">
|
||||||
<div class="btn_left">
|
<div class="btn_left">
|
||||||
|
|
@ -505,7 +505,7 @@ export default {
|
||||||
},
|
},
|
||||||
data(){
|
data(){
|
||||||
return {
|
return {
|
||||||
urlimg:'https://fxnsp.zgzhny.com/lh-api/sys/common/static/',
|
urlimg:'https://fxnsp.sxcooh.com/lh-api/sys/common/static/',
|
||||||
isShow: true,
|
isShow: true,
|
||||||
nowTime: '',
|
nowTime: '',
|
||||||
briefconCode:"",
|
briefconCode:"",
|
||||||
|
|
|
||||||
|
|
@ -4,9 +4,11 @@
|
||||||
<video autoplay loop muted preload
|
<video autoplay loop muted preload
|
||||||
style="width: 100%; height: 100%; object-fit: fill">
|
style="width: 100%; height: 100%; object-fit: fill">
|
||||||
<!-- <source src="@/assets/image/loginback.mp4">-->
|
<!-- <source src="@/assets/image/loginback.mp4">-->
|
||||||
<source src="http://fxnsp.zgzhny.com/lh-api/sys/common/static/v/loginback.mp4">
|
<!-- <source src="http://fxnsp.sxcooh.com/lh-api/sys/common/static/v/loginback.mp4">-->
|
||||||
|
<source src="https://fxnsp.sxcooh.com/lh-api/sys/common/static/v/loginback.mp4">
|
||||||
</video>
|
</video>
|
||||||
<img src="@/assets/image/logintltle.png" alt="" class="logintltle">
|
<div class="maintitle">河津市农业面源污染在线监测平台</div>
|
||||||
|
<!-- <img src="@/assets/image/logintltle3.png" alt="" class="logintltle">-->
|
||||||
<el-form
|
<el-form
|
||||||
class="loginipt demo-ruleForm"
|
class="loginipt demo-ruleForm"
|
||||||
:rules="rules"
|
:rules="rules"
|
||||||
|
|
@ -135,48 +137,75 @@ export default {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height:100%;
|
height:100%;
|
||||||
}
|
}
|
||||||
|
.maintitle{
|
||||||
|
position: relative;
|
||||||
|
margin: 100px auto;
|
||||||
|
text-align: center;
|
||||||
|
color: #e6e6e6;
|
||||||
|
font-size: 4.3rem;
|
||||||
|
font-weight: 900;
|
||||||
|
font-style: italic;
|
||||||
|
font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
|
||||||
|
letter-spacing: 6px;
|
||||||
|
/* 原有立体浮雕阴影 + 外层淡投影阴影 */
|
||||||
|
text-shadow:
|
||||||
|
0 1px #0077cc,
|
||||||
|
0 2px #006bb8,
|
||||||
|
0 3px #005fa3,
|
||||||
|
0 4px #00508a,
|
||||||
|
0 5px 8px rgba(0, 15, 50, 0.55),
|
||||||
|
/* 新增外层柔和淡阴影 */
|
||||||
|
0 8px 15px rgba(0, 40, 90, 0.3),
|
||||||
|
/* 新增外围微弱蓝光发光效果 */
|
||||||
|
0 0 6px rgba(80, 180, 255, 0.6),
|
||||||
|
0 0 12px rgba(60, 160, 240, 0.6);
|
||||||
|
transform: scaleX(1.05);
|
||||||
|
|
||||||
|
}
|
||||||
|
.logintltle{
|
||||||
|
position: absolute;
|
||||||
|
top: 10%;
|
||||||
|
right: 20%;
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
.loginipt{
|
.loginipt{
|
||||||
/* position: absolute;
|
/* position: absolute;
|
||||||
top: 28%;
|
top: 28%;
|
||||||
right: 33%; */
|
right: 33%; */
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
margin-right: 8%;
|
margin-right: 8%;
|
||||||
margin-top: 17%;
|
/*margin-top: 17%;*/
|
||||||
width: 552px;
|
width: 552px;
|
||||||
height: 475px;
|
height: 475px;
|
||||||
background: url(../../assets/image/login_bg_img.png)no-repeat;
|
background: url(../../assets/image/login_bg_img.png)no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
position: relative;
|
||||||
.logintltle{
|
z-index: 1;
|
||||||
position: absolute;
|
}
|
||||||
top: 10%;
|
.login_title_img{
|
||||||
right: 20%;
|
display: block;
|
||||||
width: 60%;
|
margin: 0 auto;
|
||||||
}
|
margin-top: 1.6vw;
|
||||||
.login_title_img{
|
}
|
||||||
display: block;
|
.loginipt_list1{
|
||||||
margin: 0 auto;
|
width: 80%;
|
||||||
margin-top: 1.6vw;
|
height: 60px;
|
||||||
}
|
margin: 0 auto;
|
||||||
.loginipt_list1{
|
margin-top: 32px;
|
||||||
width: 80%;
|
background: #0B2136;
|
||||||
height: 60px;
|
border: 1px solid #074856;
|
||||||
margin: 0 auto;
|
box-shadow: inset 0 0 13px 0 rgba(1,9,17,.8);
|
||||||
margin-top: 32px;
|
border-radius: 4px;
|
||||||
background: #0B2136;
|
position: relative;
|
||||||
border: 1px solid #074856;
|
}
|
||||||
box-shadow: inset 0 0 13px 0 rgba(1,9,17,.8);
|
.loginipt_list1:hover{
|
||||||
border-radius: 4px;
|
border: 1px solid #00f6ff;
|
||||||
position: relative;
|
}
|
||||||
}
|
.login_btn_anniu{
|
||||||
.loginipt_list1:hover{
|
width: 50%;
|
||||||
border: 1px solid #00f6ff;
|
height: 60px;
|
||||||
}
|
/* line-height: 3vw;s */
|
||||||
.login_btn_anniu{
|
|
||||||
width: 50%;
|
|
||||||
height: 60px;
|
|
||||||
/* line-height: 3vw;s */
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-top: 24px;
|
margin-top: 24px;
|
||||||
margin-left: 25%;
|
margin-left: 25%;
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<!-- src="https://i.tianqi.com?c=code&id=10&color=%23FFFFFF&icon=1&py=fenxi&site=12"-->
|
<!-- src="https://i.tianqi.com?c=code&id=10&color=%23FFFFFF&icon=1&py=fenxi&site=12"-->
|
||||||
<!-- style="pointer-events: none;"></iframe>-->
|
<!-- style="pointer-events: none;"></iframe>-->
|
||||||
<!-- <iframe width="300" height="40" src="https://i.tianqi.com/?c=code&a=getcode&id=11&icon=1&color=%23FFFFFF" frameborder="0"></iframe>-->
|
<!-- <iframe width="300" height="40" src="https://i.tianqi.com/?c=code&a=getcode&id=11&icon=1&color=%23FFFFFF" frameborder="0"></iframe>-->
|
||||||
<iframe width="300" height="40" src="https://i.tianqi.com/?c=code&a=getcode&id=34&icon=1&color=%23FFFFFF&py=fenxi" frameborder="0"></iframe>
|
<iframe width="300" height="40" src="https://i.tianqi.com/?c=code&a=getcode&id=34&icon=1&color=%23FFFFFF&py=hejin" frameborder="0"></iframe>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
||||||