Compare commits

...

13 Commits
main ... hejin

Author SHA1 Message Date
wgx c823be81ff 完成改造 2026-08-19 18:32:33 +08:00
wgx 3376e0fb53 农田和畜禽监测站完成;首页需加个杀虫灯开关 2026-08-18 19:43:48 +08:00
wgx 005c3947ff 第一屏完成 2026-08-17 19:26:48 +08:00
wgx 5c28f8d61b 地图添加企业标点 2026-08-13 18:02:30 +08:00
wgx ecdc6110f8 地图添加企业标点 2026-08-12 17:56:11 +08:00
wgx 7d92dbb698 稷山面源污染初始化 2026-08-08 18:56:52 +08:00
wgx 3ac1c6f49f 优化界面 2026-07-30 19:21:47 +08:00
wgx 266c5c5eac 初始化~ 2026-07-18 18:22:54 +08:00
wgx c04b3e4908 去掉太阳能 2026-06-02 11:22:03 +08:00
wgx 9ae166d778 武乡大屏改造基本完成 2026-05-11 19:17:48 +08:00
wgx a7c1decc3e 武乡大屏改造基本完成 2026-03-26 17:01:54 +08:00
wgx 7ecd1ac2ae 武乡大屏改造基本完成 2026-03-25 16:52:37 +08:00
wgx 0c1546ee02 武乡大屏改造基本完成 2026-03-20 19:30:32 +08:00
24 changed files with 1259 additions and 8847 deletions

5
.gitignore vendored
View File

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

View File

@ -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",

File diff suppressed because it is too large Load Diff

BIN
public/image/enticon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -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"/>-->

View File

@ -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
})
}

View File

@ -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'));

View File

@ -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;

View File

@ -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);

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 8.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

BIN
src/assets/image/xmgk05.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 KiB

View File

@ -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,

View File

@ -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'
}); });

View File

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

View File

@ -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,//truesetStatus/getStatus dragEnable: true,//truesetStatus/getStatus
jogEnable: true,//使truesetStatus/getStatus jogEnable: true,//使truesetStatus/getStatus
@ -755,51 +827,104 @@ export default {
showIndoorMap: false, // showIndoorMap: false, //
expandZoomRange: true,//,zooms使truezoomsPC2019/20 expandZoomRange: true,//,zooms使truezoomsPC2019/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 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 { } 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 = [];
//21
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>

View File

@ -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:"",

View File

@ -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,18 +137,30 @@ export default {
width: 100%; width: 100%;
height:100%; height:100%;
} }
.loginipt{ .maintitle{
/* position: absolute; position: relative;
top: 28%; margin: 100px auto;
right: 33%; */ text-align: center;
margin: 0 auto; color: #e6e6e6;
margin-right: 8%; font-size: 4.3rem;
margin-top: 17%; font-weight: 900;
width: 552px; font-style: italic;
height: 475px; font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
background: url(../../assets/image/login_bg_img.png)no-repeat; letter-spacing: 6px;
background-size: 100% 100%; /* 原有立体浮雕阴影 + 外层淡投影阴影 */
overflow: hidden; 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{ .logintltle{
position: absolute; position: absolute;
@ -154,6 +168,21 @@ export default {
right: 20%; right: 20%;
width: 60%; width: 60%;
} }
.loginipt{
/* position: absolute;
top: 28%;
right: 33%; */
margin: 0 auto;
margin-right: 8%;
/*margin-top: 17%;*/
width: 552px;
height: 475px;
background: url(../../assets/image/login_bg_img.png)no-repeat;
background-size: 100% 100%;
overflow: hidden;
position: relative;
z-index: 1;
}
.login_title_img{ .login_title_img{
display: block; display: block;
margin: 0 auto; margin: 0 auto;

File diff suppressed because it is too large Load Diff

View File

@ -6,7 +6,7 @@
<!-- src="https://i.tianqi.com?c=code&amp;id=10&amp;color=%23FFFFFF&amp;icon=1&amp;py=fenxi&amp;site=12"--> <!-- src="https://i.tianqi.com?c=code&amp;id=10&amp;color=%23FFFFFF&amp;icon=1&amp;py=fenxi&amp;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>