1869 lines
60 KiB
Vue
1869 lines
60 KiB
Vue
<template>
|
||
<ScaleBox
|
||
:width="1920"
|
||
:height="1080"
|
||
bgc="transparent"
|
||
:delay="100"
|
||
:isFlat="true"
|
||
@scaleChange="scaleChange"
|
||
>
|
||
<div
|
||
class="main"
|
||
v-loading="loading"
|
||
element-loading-text="加载中"
|
||
element-loading-background="rgba(0, 0, 0, 0.8)"
|
||
>
|
||
<div class="nav">
|
||
<span class="nav_ti nav_mag">汾西县黄河流域农业面源污染平台</span>
|
||
<span class="nav_tit">治理效果评价与预警一张图</span>
|
||
</div>
|
||
<div class="nav_btn">
|
||
<div class="btn_left">
|
||
<span class="btn_left_time"> {{ nowTime }}</span> <span class="btn_left_tianq" style="z-index: 9999;"></span>
|
||
</div>
|
||
<div class="btn_right">
|
||
<hefentianqi/>
|
||
<img src="@/assets/image/quanping.png" class="quanping" v-if="fullscreen==false" @click="screen" alt="">
|
||
<img src="@/assets/image/quanpingtui.png" class="quanping" @click="screen" alt="" v-else>
|
||
<span class="btn_right_time"><img src="@/assets/image/header.png" @click="dialogVisible = true" class="peoimg"
|
||
alt=""></span>
|
||
</div>
|
||
</div>
|
||
<!-- 退出登录弹窗 -->
|
||
<div class="login logintc">
|
||
<el-dialog
|
||
title="退出登录"
|
||
:visible.sync="dialogVisible"
|
||
width="10%"
|
||
>
|
||
<span class="infornameclas">欢迎您，{{ inforname }}！</span>
|
||
<el-button type="primary" @click="handleClosetuichu" class="logintc_tc">
|
||
<img src="@/assets/image/tuichu.png" @click="dialogVisible = true" class="tuichu" alt="">
|
||
退出登录
|
||
</el-button>
|
||
<img src="@/assets/image/sanjiao.png" class="sanjiao" alt="">
|
||
</el-dialog>
|
||
</div>
|
||
|
||
<div class="content">
|
||
<img src="@/assets/image/qiehuan2.png" @click="mapTypeSwitch"
|
||
style="position: fixed;top:5.2vw;right:26%;z-index: 999;width:12vw;cursor: pointer;" alt=""
|
||
v-if="mapTypeFlag==true">
|
||
<img src="@/assets/image/qiehuan.png" @click="mapTypeSwitch"
|
||
style="position: fixed;top:5.2vw;right:3%;z-index: 999;width:12vw;cursor: pointer;" alt="" v-else>
|
||
<!-- <div id="container" v-if="fullscreen==false" style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;transform:scale(1.05,1.05);"></div>-->
|
||
<!-- <div id="container" v-else style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;"></div>-->
|
||
<div id="container"
|
||
style="width:98%;height:100%;resize:both; position: absolute;z-index:0;top:0px;left: 1%;"></div>
|
||
<!-- 左上头部 -->
|
||
<transition enter-active-class="animate__animated animate__backInLeft"
|
||
leave-active-class="animate__animated animate__backOutLeft">
|
||
<template v-if="mapTypeFlag">
|
||
<div class="baseBoxLeft left baseBoxHjleft">
|
||
<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_zuoxia.png" class="in2con_zzx" alt="">
|
||
<img src="@/assets/image/kuang_youxia.png" class="in2con_zyx" alt="">
|
||
<img src="@/assets/image/sanguang.png" class="sanguang" alt="">
|
||
<img src="@/assets/image/sanguang.png" class="sanguangbt" alt="">
|
||
<div>
|
||
<div class="in1con_lf_tit ">
|
||
<span class="in1con_lf_titshow1" >{{ briefconCode }}</span>
|
||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||
</div>
|
||
<div class="home_lcgk" style="width: 88%;">
|
||
<vue-seamless-scroll :data="briefconValue" class="wp-1 hp-1" :class-option="showOption">
|
||
<p v-for="item in briefconValue" :key="item.id">{{ item.detailValue }}</p>
|
||
</vue-seamless-scroll>
|
||
</div>
|
||
<div class="in1con_lf_img">
|
||
<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="2" :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/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="2" :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>
|
||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||
<div>
|
||
<div class="in1con_lf_tit ">
|
||
<span class="in1con_lf_titshow1">气候环境</span>
|
||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||
</div>
|
||
<div class="qhhjcov">
|
||
<div style="width:96%;margin:0 auto;margin-top:12px;">
|
||
<div class="qhhjcov_lf" v-for="item in climate_env" :key="item.id">
|
||
<img :src="urlimg+item.detailPics" class="qhhjcov_lfimg" alt="">
|
||
<span class="qhhjcov_lf_tit">{{ item.detailCode }}</span>
|
||
<span class="qhhjcov_time"> <animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0"
|
||
:to="item.detailValue" :key="item.detailValue"
|
||
duration="3000"></animate-number>{{ item.detailValue2 }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||
<div>
|
||
<div class="in1con_lf_tit ">
|
||
<span class="in1con_lf_titshow1">水利情况</span>
|
||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||
</div>
|
||
<div class="in1con_lf_img">
|
||
<div
|
||
class="in1con_lf_imglf animate__animated animate__delay-1s animate__infinite animate__slow animate__pulse"
|
||
v-for="legth in water_conser" :key="legth.id">
|
||
<img :src="urlimg+legth.detailPics" class="in1con_lf_imgone" alt="">
|
||
<span class="in1con_lf_imglf_tit">{{ legth.detailCode }}</span>
|
||
<span class="in1con_lf_imglf_num"> <animate-number class="in1con_lf_imglf_num_jix" ref="reNum"
|
||
from="0" :to="legth.detailValue"
|
||
:key="legth.detailValue"
|
||
duration="3000"></animate-number>{{ legth.detailValue2 }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="home_dlhj">
|
||
<el-carousel arrow="never" height="150px" style=" bottom: 20px;">
|
||
<el-carousel-item v-for="value in roll_info" :key="value.id">
|
||
<div class="sx_cov">
|
||
<span class="sx_covtit">
|
||
{{ value.infoName }}
|
||
</span>
|
||
<ul v-for="ite in value.detailList" :key="ite.id">
|
||
<li class="sx_cov_lt">
|
||
<span class="sx_cov_lt_tit">{{ ite.detailCode }}</span>
|
||
<span class="sx_cov_lt_num">
|
||
<animate-number class="in1con_lf_imglf_num_jix" ref="reNum" from="0" :to="ite.detailValue"
|
||
:key="ite.detailValue" duration="3000"></animate-number>
|
||
{{ ite.detailValue2 }}
|
||
</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</el-carousel-item>
|
||
</el-carousel>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</transition>
|
||
<!-- 地图左下图例-->
|
||
<div v-if="mapTypeFlag==true" class="mapTuLi">
|
||
<div class="scdlist" @click="switchIcon('duizhuhe')">
|
||
<img src="@/assets/image/icon-blue.png" class="xcdimg" alt="">
|
||
<span class="scdlist_tit">对竹河监测站</span>
|
||
</div>
|
||
<div class="scdlist" @click="switchIcon('tuanbaihe')">
|
||
<img src="@/assets/image/icon-yellow.png" class="xcdimg" alt="">
|
||
<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>
|
||
<transition enter-active-class="animate__animated animate__backInUp"
|
||
leave-active-class="animate__animated animate__backOutDown">
|
||
<template v-if="mapTypeFlag">
|
||
<div class="zlxg_btm">
|
||
<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_zuoxia.png" class="in2con_zzx" alt="">
|
||
<img src="@/assets/image/kuang_youxia.png" class="in2con_zyx" alt="">
|
||
<img src="@/assets/image/sanguang.png" class="sanguang2" alt="">
|
||
<img src="@/assets/image/sanguang.png" class="sanguangbt2" alt="">
|
||
<div>
|
||
<span class="zywr_titshow">重要污染物治理效果</span>
|
||
<el-tooltip class="item" effect="dark"
|
||
:content="dataTypeEchart?'监测值为正常历史监测数据。':'对比值为下游监测站数据减去上游监测站数据。'"
|
||
placement="top-start">
|
||
<span class="dataTypeEchart" @click="switchEchartType">
|
||
{{ dataTypeEchart ? '监测值' : '对比值' }}
|
||
</span>
|
||
</el-tooltip>
|
||
<el-select class="dataTypeEchart2" v-model="dateType" placeholder="请选择" @change="changeDateType">
|
||
<el-option
|
||
v-for="item in dateTypeOptions"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
<el-tabs type="card" @tab-click="handleClick" v-show="dataTypeEchart">
|
||
<el-tab-pane v-for="(item,index) in stationInfoList" :label="item.stationName" lazy>
|
||
<template>
|
||
<div :id="`myChartDiv${index}`" style="height:12vw;width:100%;"></div>
|
||
</template>
|
||
</el-tab-pane>
|
||
</el-tabs>
|
||
<el-tabs type="card" @tab-click="handleClick" v-show="!dataTypeEchart">
|
||
<el-tab-pane v-for="(item,index) in riverList" :label="item.stationName.split('-')[0]" lazy>
|
||
<template>
|
||
<div :id="`myChartDiv2${index}`" style="height:12vw;width:100%;"></div>
|
||
</template>
|
||
</el-tab-pane>
|
||
</el-tabs>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</transition>
|
||
<!-- 右侧展示栏-->
|
||
<transition enter-active-class="animate__animated animate__backInRight"
|
||
leave-active-class="animate__animated animate__backOutRight">
|
||
<template v-if="mapTypeFlag">
|
||
<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_youshang.png" class="in2con_zys" alt="">
|
||
<img src="@/assets/image/kuang_zuoxia.png" class="in2con_zzx" alt="">
|
||
<img src="@/assets/image/kuang_youxia.png" class="in2con_zyx" alt="">
|
||
<img src="@/assets/image/sanguang.png" class="sanguang" alt="">
|
||
<img src="@/assets/image/sanguang.png" class="sanguangbt" alt="">
|
||
<div>
|
||
<div class="home_dlhj">
|
||
<el-carousel :autoplay="false" indicator-position="none" arrow="always" height="320px">
|
||
<el-carousel-item v-for="item in stationInfoList" :key="item.id">
|
||
<div class="in1con_lf_tit " >
|
||
<span class="in1con_lf_titshow1 " style="cursor: pointer"
|
||
@click="jumpStationPage(item)">{{ item.stationName }}</span>
|
||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||
</div>
|
||
<div class="jczcov">
|
||
<viewer :images="item.deviceList" v-for="value in item.deviceList" :key="value.id">
|
||
<div class="jczcov_lf" v-for="(imglist,index) in item.stationPic" :key="index">
|
||
<img :src="urlimg+imglist" class="jczimg" alt="">
|
||
</div>
|
||
</viewer>
|
||
</div>
|
||
<div class="jczbtm" @click="showEchartDialog($event, 1)" >
|
||
<vue-seamless-scroll :data="item.wrwcode" class="wp-1 hp-1" :class-option="classWrwcod">
|
||
<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.code" duration="3000"></animate-number>
|
||
<!-- <span class="in1con_lf_imglf_num_jix">{{valist.code}}</span> -->
|
||
{{ valist.unit }}</span>
|
||
</div>
|
||
</div>
|
||
</vue-seamless-scroll>
|
||
|
||
</div>
|
||
</el-carousel-item>
|
||
</el-carousel>
|
||
</div>
|
||
</div>
|
||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||
<div>
|
||
<div class="in1con_lf_tit " style="cursor: pointer;" @click="taizhangDialogShowFlag=true">
|
||
<span class="in1con_lf_titshow1">核算与评估</span>
|
||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||
<!-- <span class="in1con_lf_titshow2 " style="">台账>></span>-->
|
||
</div>
|
||
<div class="mywrcov">
|
||
<div class="mywrcov_one mywrcov_onehover" @click="showEchartDialog({stationCode: 'S_1'}, 'dataWaterTp')">
|
||
<span class="mywrcov_onetit">{{ effect_assess0.detailCode }}</span>
|
||
<span class="mywrcov_onenum">
|
||
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess0.detailValue }}</span>
|
||
<!-- <animate-number class="in1con_lf_imglf_num_jix mywrcov_onenumjx" :ref="(dom)=>animateObj.push(dom)" duration="3000" from="0"-->
|
||
<!-- :to="effect_assess0.detailValue" />-->
|
||
</span>
|
||
</div>
|
||
<div class="mywrcov_two mywrcov_onehover" @click="showEchartDialog({stationCode: 'S_1'}, 'dataWaterTn')">
|
||
<span class="mywrcov_onetit">{{ effect_assess1.detailCode }}</span>
|
||
<span class="mywrcov_onenum">
|
||
<span class="in1con_lf_imglf_num_jix mywrcov_onenumjx">{{ effect_assess1.detailValue }}</span>
|
||
<!-- <animate-number class="in1con_lf_imglf_num_jix mywrcov_onenumjx" :ref="(dom)=>animateObj.push(dom)" duration="3000" from="0"-->
|
||
<!-- :to="effect_assess0.detailValue" />-->
|
||
</span>
|
||
</div>
|
||
<div class="mywrcov_three mywrcov_onehover" @click="showEchartDialog({stationCode: 'S_1'}, 'dataWaterCod')">
|
||
<span class="mywrcov_onenum" style="margin-top: 1vw;">
|
||
<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"-->
|
||
<!-- :to="effect_assess0.detailValue" />-->
|
||
</span>
|
||
<span class="mywrcov_onetit">{{ effect_assess2.detailCode }}</span>
|
||
</div>
|
||
<div class="mywrcov_four mywrcov_onehover" @click="taizhangDialogShowFlag=true">
|
||
<span class="mywrcov_onenum" style="margin-top: 1vw; cursor: pointer">
|
||
<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"-->
|
||
<!-- :to="effect_assess0.detailValue" />-->
|
||
</span>
|
||
<span class="mywrcov_onetit">{{ effect_assess3.detailCode }}</span>
|
||
</div>
|
||
<div class="mywrcovcen">
|
||
<!-- <img src="@/assets/image/chengg.png" class="mywrcovcen_tit" alt=""> -->
|
||
<span class="mywrcovcen_tit" v-if="effect_assess4.detailValue=='成功'">优</span>
|
||
<span class="mywrcovcen_tit" v-else>{{ effect_assess4.detailValue }}</span>
|
||
<span class="mywrcovcen_con">{{ effect_assess4.detailCode }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||
<div>
|
||
<div class="in1con_lf_tit ">
|
||
<span class="in1con_lf_titshow1">长期定位监测实时数据</span>
|
||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||
</div>
|
||
<div style="height:280px;overflow: hidden" @click="showEchartDialog($event, 1)">
|
||
<vue-seamless-scroll :data="listData" class="wp-1 hp-1" :class-option="classOption" :step="1">
|
||
<div class="jcsssj" v-for="(item, index) in listData" :key="index" :data-item="JSON.stringify(item)" :data-survItem="item.survItem" >
|
||
<img src="@/assets/image/xian.png" class="jcsssj_xian" alt="">
|
||
<div class="jcsssj_rt">
|
||
<div style="float: left;width: 70%;">
|
||
<span class="jcsssj_rt_tit">{{ item.stationName?item.stationName:item.deployRemark?item.deployRemark:'土壤监测站' }}</span>
|
||
<span class="jcsssj_rtbiao" :style="{background:(item.color)}">{{ item.name }}</span>
|
||
<span class="jcsssj_rt_numsy">
|
||
<!-- <span class="in1con_lf_imglf_num_jix">{{item.value}}</span> -->
|
||
<animate-number class="in1con_lf_imglf_num_jix" ref="myNum" from="0" :to="item.value"
|
||
:key="item.value" duration="3000" :formatter="formatter"></animate-number>
|
||
{{ item.unit }}
|
||
</span>
|
||
<!-- <img src="@/assets/image/up.png" class="jcsssj_rt_up" alt=""> -->
|
||
</div>
|
||
<span class="jcsssj_rt_time">{{ item.dataDateTime?item.dataDateTime.substring(0,16):'--' }}</span>
|
||
</div>
|
||
</div>
|
||
</vue-seamless-scroll>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</transition>
|
||
</div>
|
||
<!-- 监测站弹窗 -->
|
||
<el-dialog :visible.sync="qcdtdialogTableVisible">
|
||
<div class="jctc" id="modal1123123">
|
||
<div class="in1con_lf_tit ">
|
||
<img src="@/assets/image/tctiimg.png" class="tctiimg" alt="">
|
||
<span class="in1con_lf_titshow">{{ qcdtinfor.stationName }}</span>
|
||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||
</div>
|
||
<div class="jctcvban1">
|
||
<img src="@/assets/image/jctctiao.png" class="jctctiao" alt="">
|
||
</div>
|
||
<div class="jctc_add">
|
||
<img src="@/assets/image/jctcicon1.png" class="jctcicon1" alt="">
|
||
<span class="jctcvban_tit">站点位置：{{ qcdtinfor.stationLocation }}</span>
|
||
</div>
|
||
<div class="jctc_add">
|
||
<img src="@/assets/image/jctcicon2.png" class="jctcicon1" alt="">
|
||
<span class="jctcvban_tit">建站时间：{{ qcdtinfor.buildTime }}</span>
|
||
</div>
|
||
<div class="jctc_add">
|
||
<img src="@/assets/image/jctcicon3.png" class="jctcicon1" alt="">
|
||
<span class="jctcvban_tit">设备数量：<span style="color: #f1ff0d;">{{ qcdtinfor.deviceCount }}</span> </span>
|
||
</div>
|
||
<div class="jctc_add">
|
||
<img src="@/assets/image/jctcicon3.png" class="jctcicon1" alt="">
|
||
<span class="jctcvban_tit">运行状态：<span style="color: #f1ff0d;">正常</span> </span>
|
||
</div>
|
||
<div class="jctc_add">
|
||
<img src="@/assets/image/jctcicon4.png" class="jctcicon1" alt="">
|
||
<span class="jctcvban_tit">监测指标</span>
|
||
</div>
|
||
<div style="margin-left: 3%;">
|
||
<!-- survItemList -->
|
||
<span class="jctc_text" v-for="(item,index) in qcdtinfor.survColorItems" :key="index"
|
||
:style="{background:(item.color)}">{{ item.name }}</span>
|
||
<!-- <span class="jctc_text" style="background: #445fb4;">总氮</span>
|
||
<span class="jctc_text" style="background: #52ac2a;">硝钛氨</span>
|
||
<span class="jctc_text" style="background: #ac4f2a;">空气温度</span>
|
||
<span class="jctc_text" style="background: #ac4f2a;">空气湿度</span>
|
||
<span class="jctc_text" style="background: #4c9bb5;">风速</span>
|
||
<span class="jctc_text" style="background: #6a4cb5;">风向</span>
|
||
<span class="jctc_text" style="background: #4cb585;">大气压</span>
|
||
<span class="jctc_text" style="background: #ad8f49;">太阳全辐射</span>
|
||
<span class="jctc_text" style="background: #52ac2a;">土壤温度</span>
|
||
<span class="jctc_text" style="background: #4c9bb5;">土壤盐分</span> -->
|
||
</div>
|
||
<img src="@/assets/image/ljjr.png" class="ljjr" @click="jumpStationPage(qcdtinfor)" alt="">
|
||
</div>
|
||
</el-dialog>
|
||
<!-- 企业弹窗 -->
|
||
<el-dialog :visible.sync="qyinfordtdialogTableVisible">
|
||
<div class="tz_cov" style="height:25vw;">
|
||
<img src="@/assets/image/guanbi.png" class="guanbiann" @click="qcguanbi" alt="">
|
||
<div class="tz_cov_top">
|
||
<span class="tz_cov_top_tit">企业简介</span>
|
||
</div>
|
||
<el-row>
|
||
<el-col :span="12">
|
||
<div class="grid-content bg-purple" style="width:80%;margin-left:10%;">
|
||
<el-carousel indicator-position="outside">
|
||
<el-carousel-item v-for="(item,index) in qyinformation.extPics" :key="index">
|
||
<viewer :images="qyinformation.extPics">
|
||
<img :src="urlimg + item" alt="" style="width:100%;height:100%;">
|
||
</viewer>
|
||
</el-carousel-item>
|
||
</el-carousel>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<div class="grid-content bg-purple-light">
|
||
<span class="tctit">{{ qyinformation.name }}</span>
|
||
<span class="tcgldw">{{ qyinformation.notes }}</span>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
<SoilDialog v-if="soidShowFlag" :soilDataId="soilDataId" @close="soidShowFlag=false"/>
|
||
<SingleEchartDialog v-if="singleEchartDialogShowFlag" :item="singleEchartData" @close="singleEchartDialogShowFlag=false"/>
|
||
<TaizhangDialog v-if="taizhangDialogShowFlag" :resourcedirect="resourcedirect" @close="taizhangDialogShowFlag=false"/>
|
||
</ScaleBox>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import ScaleBox from 'vue2-scale-box'
|
||
import {
|
||
displayInfo,
|
||
fwlist,
|
||
getAllstationAndPestLight,
|
||
getIndexSummry,
|
||
getNewestData,
|
||
getPollutionDict,
|
||
getSoilSummry,
|
||
ntfmlist,
|
||
stationInfo,
|
||
survItemSummary
|
||
} from '@/api';
|
||
import vueSeamlessScroll from 'vue-seamless-scroll'
|
||
import hefentianqi from '@/pages/weather/weather.vue'
|
||
import SoilDialog from '@/components/SoilDialog.vue'
|
||
import {_colors} from '@/utils/color.js'
|
||
import SingleEchartDialog from "@/components/SingleEchartDialog.vue";
|
||
import TaizhangDialog from "@/components/TaizhangDialog.vue";
|
||
|
||
export default {
|
||
name: 'mainHome',
|
||
components: {
|
||
TaizhangDialog,
|
||
SingleEchartDialog,
|
||
vueSeamlessScroll,
|
||
hefentianqi,
|
||
ScaleBox,
|
||
SoilDialog
|
||
},
|
||
data() {
|
||
return {
|
||
taizhangDialogShowFlag: false,
|
||
singleEchartDialogShowFlag: false,
|
||
singleEchartData: null,
|
||
aMap: null,
|
||
dataTypeEchart: true,
|
||
markersOrient: [],
|
||
markersSoil: [],
|
||
markersOther: [],
|
||
lastClickIcon: '',
|
||
urlimg: 'https://fxnsp.zgzhny.com/lh-api/sys/common/static/',
|
||
mapTypeFlag: true,
|
||
nowTime: '',
|
||
briefconCode: "",
|
||
briefconValue: [],
|
||
climate_env: [],
|
||
water_conser: [],
|
||
roll_info: [],
|
||
stationInfoList: [],
|
||
wrwcode: [],
|
||
getPollutionDictCover: [],
|
||
effect_assess0: '',
|
||
effect_assess0Value: 0,
|
||
effect_assess1: '',
|
||
effect_assess2: '',
|
||
effect_assess3: '',
|
||
effect_assess4: '',
|
||
pestLightCount: 0,
|
||
stationCount0: 0,
|
||
stationCount1: 0,
|
||
// showData:[],
|
||
dialogTableVisible: false,
|
||
qcdialogTableVisible: false,
|
||
qcdtdialogTableVisible: false,
|
||
qyinfordtdialogTableVisible: false,
|
||
shipdialogTableVisible: false,
|
||
qyinformation: '',
|
||
listData: [],
|
||
summryAllData: null,
|
||
echartInit: {},
|
||
riverList: [],
|
||
qcdtinfor: '',
|
||
resourcedirect: [],
|
||
dialogVisible: false,
|
||
inforname: '',
|
||
loading: true,
|
||
zoomData: 14,
|
||
isShowLightNumber: '1',
|
||
switchValue: true,
|
||
fullscreen: false, //全屏
|
||
echartIndex: 0,
|
||
dateType: 'monthDays',
|
||
dateTypeOptions: [{
|
||
value: 'dayhours',
|
||
label: '24小时'
|
||
}, {
|
||
value: 'monthDays',
|
||
label: '30天'
|
||
}, {
|
||
value: 'yearMonth',
|
||
label: '12个月'
|
||
}],
|
||
soidShowFlag: false,
|
||
soilDataId: ''
|
||
};
|
||
},
|
||
created() {
|
||
},
|
||
|
||
computed: {
|
||
classOption() {
|
||
return {
|
||
step: 0.6, // 数值越大速度滚动越快
|
||
limitMoveNum: 3, // 开始无缝滚动的数据量 this.dataList.length
|
||
hoverStop: true, // 是否开启鼠标悬停stop
|
||
direction: 1, // 0向下 1向上 2向左 3向右
|
||
openWatch: true, // 开启数据实时监控刷新dom
|
||
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
||
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
||
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
|
||
};
|
||
},
|
||
classWrwcod() {
|
||
return {
|
||
step: 0.2, // 数值越大速度滚动越快
|
||
limitMoveNum: 6, // 开始无缝滚动的数据量 this.dataList.length
|
||
hoverStop: true, // 是否开启鼠标悬停stop
|
||
direction: 1, // 0向下 1向上 2向左 3向右
|
||
openWatch: true, // 开启数据实时监控刷新dom
|
||
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
||
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
||
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
|
||
};
|
||
},
|
||
showOption() {
|
||
return {
|
||
step: 0.5, // 数值越大速度滚动越快
|
||
limitMoveNum: 0, // 开始无缝滚动的数据量 this.dataList.length
|
||
hoverStop: true, // 是否开启鼠标悬停stop
|
||
direction: 1, // 0向下 1向上 2向左 3向右
|
||
openWatch: true, // 开启数据实时监控刷新dom
|
||
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
||
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
||
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
|
||
};
|
||
},
|
||
},
|
||
mounted() {
|
||
console.log('开始初始化！！！！')
|
||
// setTimeout(() => {
|
||
// this.$nextTick(() => {
|
||
// this.indexinfor();
|
||
// })
|
||
// }, 2000)
|
||
// 实时时间
|
||
setTimeout(() => {
|
||
this.$nextTick(() => {
|
||
this.initMap(this.zoomData, this.isShowLightNumber);
|
||
})
|
||
}, 2000)
|
||
//初始化数据
|
||
this.getNowTime();
|
||
this.indexleft();
|
||
this.getNewestDataList();
|
||
this.getPollutionDictList();
|
||
this.infor();
|
||
this.indexinfor();
|
||
this.handleClick({index: this.echartIndex});
|
||
this.initSoilData();
|
||
},
|
||
methods: {
|
||
initSoilData(){
|
||
// getSoilSummry({deployIds:['1679816733238575105'], "summrayMode":"dayhours"}).then(res=>{
|
||
// console.log(res)
|
||
// })
|
||
},
|
||
formatter: function (num) {
|
||
return num.toFixed(3)
|
||
},
|
||
sbdscdBtn() {
|
||
var url = 'https://wlw.zklsfk.com/admin/index?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiLmsrPmtKXluILlhpzkuJrlhpzmnZHlsYAiLCJleHAiOjE2ODk2MjU0ODUsImlhdCI6MTY4ODEzMDI1NiwianRpIjoiNTcxMTY5MTAtODczZC00ZjI1LWFkNzItZjA2NWU3NmFkNDIwIn0.52iF21xidGFllgfcsSgN-cLlysI0W7Ad8ie48LsV9x4'
|
||
//跳转1
|
||
window.open(url, "_blank");
|
||
},
|
||
mapTypeSwitch() {
|
||
this.mapTypeFlag = !this.mapTypeFlag
|
||
if (this.mapTypeFlag == true) {//正常模式
|
||
this.zoomData = 14
|
||
if (this.isShowLight == undefined) {
|
||
let isShowLight = '1'
|
||
this.initMap(this.zoomData, isShowLight);
|
||
} else {
|
||
let isShowLight = this.isShowLight
|
||
this.initMap(this.zoomData, isShowLight);
|
||
}
|
||
setTimeout(() => {
|
||
this.$nextTick(() => {
|
||
this.handleClick({index: 0});
|
||
})
|
||
}, 1000)
|
||
} else {// 地图模式
|
||
this.zoomData = 15
|
||
if (this.isShowLight == undefined) {
|
||
this.initMap(this.zoomData, '1');
|
||
} else {
|
||
this.initMap(this.zoomData, this.isShowLight);
|
||
}
|
||
}
|
||
},
|
||
indexleft() {
|
||
displayInfo().then(res => {
|
||
setTimeout(() => {
|
||
this.loading = false
|
||
}, 1000)
|
||
this.resourcedirect = res.result.resource_direct
|
||
this.briefconCode = res.result.project_brief.detailList[0].detailCode
|
||
this.briefconValue = res.result.project_brief.detailList
|
||
this.pestLightCount = res.result.pestLightCount
|
||
this.stationCount0 = res.result.stationCount[0].stationCount
|
||
// this.stationCount1 = res.result.stationCount[1].stationCount
|
||
this.climate_env = res.result.climate_env.detailList
|
||
this.water_conser = res.result.water_conser.detailList
|
||
this.roll_info = res.result.roll_info
|
||
this.effect_assess0 = res.result.effect_assess.detailList[0]
|
||
this.effect_assess0Value = res.result.effect_assess.detailList[0].detailValue
|
||
this.effect_assess1 = res.result.effect_assess.detailList[1]
|
||
this.effect_assess2 = res.result.effect_assess.detailList[2]
|
||
this.effect_assess3 = res.result.effect_assess.detailList[3]
|
||
this.effect_assess4 = res.result.effect_assess.detailList[4]
|
||
})
|
||
},
|
||
indexinfor() {
|
||
stationInfo().then(res => {
|
||
this.stationInfoList = res.result
|
||
if (this.stationInfoList) {
|
||
for (var i = 0; i < this.stationInfoList.length; i++) {
|
||
let objlist = this.stationInfoList[i].newestData
|
||
let arryobjlist = Object.keys(objlist).map(key => objlist[key])
|
||
let newobjList = Object.keys(objlist)
|
||
this.stationInfoList[i].wrwcode = []
|
||
for (var j = 0; j < this.getPollutionDictCover.length; j++) {
|
||
// Object.keys 获取字段名
|
||
for (var k = 0; k < newobjList.length; k++) {
|
||
if (this.getPollutionDictCover[j].code == newobjList[k]) {
|
||
this.stationInfoList[i].wrwcode.push({
|
||
name: this.getPollutionDictCover[j].description,
|
||
icon: this.getPollutionDictCover[j].icon,
|
||
unit: this.getPollutionDictCover[j].unit,
|
||
color: this.getPollutionDictCover[j].color,
|
||
code: arryobjlist[k],
|
||
tylename: newobjList[k]
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
})
|
||
},
|
||
switchBtn(value) {
|
||
console.log("value++++++++", value)
|
||
if (value == true) {
|
||
let isShowLight = '1'
|
||
this.isShowLight = isShowLight
|
||
this.initMap(this.zoomData, isShowLight)
|
||
} else {
|
||
let isShowLight = ''
|
||
this.isShowLight = isShowLight
|
||
this.initMap(this.zoomData, isShowLight)
|
||
}
|
||
},
|
||
scaleChange(e) {
|
||
console.log("ee", e)
|
||
},
|
||
showEchartDialog(item, survItem) {
|
||
// console.log('showEchartDialog', item, survItem)
|
||
if(survItem === 1){
|
||
let dom = item.target.closest(".jczbtm_lf"); // 定位元素
|
||
if(!dom){
|
||
dom = item.target.closest(".jcsssj");
|
||
}
|
||
if (dom) { // 是否是滚动组件的某一行/列
|
||
let item2 = dom.dataset.item
|
||
survItem = dom.dataset.survitem
|
||
if(item2){
|
||
item2=JSON.parse(item2)
|
||
}else{
|
||
item2 = null;
|
||
}
|
||
// console.log('showEchartDialog222', dom,item2, survItem)
|
||
// :data-item="item" :data-survItem="valist.tylename"
|
||
if(item2 && survItem){
|
||
this.showEchartDialog(item2, survItem)
|
||
}
|
||
}
|
||
return;
|
||
}
|
||
this.singleEchartData = {
|
||
stationCode: item.stationCode,
|
||
deployId: item.deployId,
|
||
survItem: survItem
|
||
}
|
||
setTimeout(() => {
|
||
this.singleEchartDialogShowFlag = true;
|
||
}, 200)
|
||
},
|
||
initMap(zoomnum, isShowLight) {
|
||
let that = this;
|
||
// let isShowLight = this.isShowLightNumber
|
||
getAllstationAndPestLight(isShowLight).then(res => {
|
||
// 地图
|
||
that.aMap = new AMap.Map('container', {
|
||
viewMode: '3D',
|
||
resizeEnable: true,
|
||
zoom: zoomnum,
|
||
center: [111.436625, 36.771975],//默认的地图中心经纬度
|
||
mapStyle: 'amap://styles/blue',
|
||
dragEnable: true,//地图是否可通过鼠标拖拽平移，默认为true。此属性可被setStatus/getStatus 方法控制
|
||
jogEnable: true,//地图是否使用缓动效果，默认值为true。此属性可被setStatus/getStatus 方法控制
|
||
keyboardEnable: true,//地图是否可通过键盘控制,默认为true方向键控制地图平移，"+"和"-"可以控制地图的缩放，Ctrl+“→”顺时针旋转，Ctrl+“←”逆时针旋转。此属性可被setStatus/getStatus 方法控制
|
||
animateEnable: true,//地图平移过程中是否使用动画（如调用panBy、panTo、setCenter、setZoomAndCenter等函数，将对地图产生平移操作，是否使用动画平移的效果），默认为true，即使用动画
|
||
defaultCursor: 'pointer',
|
||
turboMode: false,
|
||
showBuildingBlock: true,//设置地图显示3D楼块效果，移动端也可使用。推荐使用。
|
||
showIndoorMap: false, // 隐藏地图自带的室内地图图层
|
||
expandZoomRange: true,//是否支持可以扩展最大缩放级别,和zooms属性配合使用设置为true的时候，zooms的最大级别在PC上可以扩大到20级，移动端还是高清19/非高清20
|
||
forceVector: true,
|
||
scale: (2 , 2.5)
|
||
});
|
||
that.aMap.on('complete', (e) => {
|
||
var markerData = res.result;
|
||
let Marker = markerData.filter(ele => ele.type != 'light');//其他类型
|
||
Marker.map(item => {
|
||
let marker = new AMap.Marker({
|
||
zIndex: item.type == 'orient' ? 1000 : 500,
|
||
icon: this.urlimg + item.picUrl,
|
||
position: [item.longitude, item.latitude],
|
||
offset: new AMap.Pixel(item.width, item.height),//偏移量
|
||
extData: {
|
||
ids: item.ids,
|
||
extPics: item.extPics,
|
||
notes: item.notes,
|
||
name: item.name,
|
||
item: item
|
||
}
|
||
});
|
||
if (item.type == 'orient') {//监测站弹窗
|
||
marker.on('click', e => {
|
||
let indexnumb = e.target.getExtData().ids.slice(-1);
|
||
this.qcdtinfor = this.stationInfoList[indexnumb]
|
||
this.qcdtdialogTableVisible = true
|
||
console.log('livestock or orient', this.qyinformation)
|
||
})
|
||
this.markersOrient.push(marker)
|
||
} else if(item.type == 'soil'){
|
||
marker.on('click', e => {
|
||
this.soilDataId = e.target.getExtData().ids
|
||
this.soidShowFlag = true
|
||
console.log('soil click', )
|
||
})
|
||
this.markersSoil.push(marker)
|
||
} else {
|
||
this.markersOther.push(marker)
|
||
}
|
||
marker.setMap(that.aMap);
|
||
})
|
||
this.$forceUpdate();
|
||
// that.aMap.setFitView(null, false, [100,400,200,200], 16);
|
||
that.aMap.setFitView();
|
||
setTimeout(() => {
|
||
that.aMap.setFitView(null, false, [130, 380, 200, 200], 16);
|
||
// let temp = that.aMap.getCenter();//矫正显示标点位置在正中心
|
||
// that.aMap.setZoomAndCenter(that.aMap.getZoom()-1, [temp.lng, temp.lat - 0.15]);
|
||
}, 2000)
|
||
});
|
||
})
|
||
},
|
||
getNewestDataList() {
|
||
getNewestData().then(res => {
|
||
this.listData = res.result.soilHisSurvData
|
||
})
|
||
},
|
||
getPollutionDictList() {
|
||
getPollutionDict().then(res => {
|
||
this.getPollutionDictCover = res.result
|
||
})
|
||
},
|
||
changeDateType() {
|
||
this.summryAllData = null;
|
||
for (let key in this.echartInit) {
|
||
this.echartInit[key].dispose();
|
||
}
|
||
this.echartInit = {};
|
||
this.handleClick({index: this.echartIndex});
|
||
},
|
||
switchEchartType() {
|
||
this.dataTypeEchart = (!this.dataTypeEchart);
|
||
this.echartInit = {};
|
||
this.activeName2 = this.riverList[0].stationName
|
||
setTimeout(() => {
|
||
this.handleClick({index: 0});
|
||
}, 300);
|
||
},
|
||
handleClick(tab, event) {
|
||
this.echartIndex = tab.index - 0;
|
||
if (this.summryAllData) {
|
||
this.$nextTick(() => { // 加载echarts图
|
||
this.initEchartData(this.echartIndex)
|
||
})
|
||
} else {
|
||
getIndexSummry({summrayMode: this.dateType}).then(res => {
|
||
if (res.code === 200) {
|
||
this.summryAllData = res.result;
|
||
let len = this.summryAllData.length;
|
||
this.riverList = [];
|
||
this.summryAllData.map((item1, index) => {
|
||
if (index % 2 === 0 && item1['datas'] && (index + 1) < len) {
|
||
let data1 = item1['datas'];
|
||
let keys = Object.keys(data1);
|
||
let data2 = this.summryAllData[index + 1]['datas'];
|
||
let data3 = {}
|
||
let item3 = JSON.parse(JSON.stringify(item1));
|
||
if (data2) {
|
||
keys.map(key => {
|
||
if (data1[key] instanceof Array) {
|
||
data3[key] = []
|
||
data1[key].map((itemSub, index) => {
|
||
data3[key].push((data2[key][index] - data1[key][index]).toFixed(2))
|
||
})
|
||
}
|
||
})
|
||
item3['datas'] = data3;
|
||
this.riverList.push(item3);
|
||
}
|
||
}
|
||
});
|
||
// console.log('对比数据初始化：', this.riverList)
|
||
setTimeout(() => {
|
||
this.$nextTick(() => { // 加载echarts图
|
||
this.initEchartData(this.echartIndex)
|
||
})
|
||
}, 1000);
|
||
}
|
||
})
|
||
}
|
||
},
|
||
// 折线图数据
|
||
initEchartData(index) {
|
||
this.$nextTick(() => {
|
||
let domKey = `myChartDiv${index}`;
|
||
let data = this.summryAllData[index];
|
||
if (!this.dataTypeEchart) {// 对比数据
|
||
domKey = `myChartDiv2${index}`;
|
||
data = this.riverList[index];
|
||
}
|
||
if (this.echartInit[domKey]) {
|
||
this.echartInit[domKey].dispose()
|
||
}
|
||
// console.log('初始化echart：', index, domKey, data, /^\d+$/.test(index) ,this.echartInit[domKey])
|
||
let divDom = document.getElementById(domKey);
|
||
if (!divDom) {
|
||
console.log('没找到dom：', domKey, divDom)
|
||
return;
|
||
}
|
||
console.log('开始初始化echart：')
|
||
let dataObj = [];
|
||
let i = 0;
|
||
for (let key in data['datas']) {
|
||
if (data['datas'][key] instanceof Array) {
|
||
dataObj[i++] = {
|
||
name: key,
|
||
color: _colors[i],
|
||
value: data['datas'][key]
|
||
}
|
||
}
|
||
}
|
||
this.echartInit[domKey] = this.$echarts.init(divDom);
|
||
let legendData = dataObj.map(item => item.name);
|
||
let xAxisData = data['dateStr']
|
||
let seriesData = dataObj.map(item => {
|
||
return {
|
||
name: item.name,
|
||
data: item.value,
|
||
type: 'line',
|
||
stack: '',
|
||
// areaStyle: { color: item.color },
|
||
lineStyle: {
|
||
color: item.color // 设置线的颜色为红色
|
||
},
|
||
itemStyle: {
|
||
color: item.color // 设置线的颜色为红色
|
||
},
|
||
smooth: true,
|
||
}
|
||
});
|
||
var optionLine = {
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
grid: {
|
||
top: '14%',
|
||
left: '3%',
|
||
right: '4%',
|
||
bottom: '9%',
|
||
containLabel: true
|
||
},
|
||
toolbox: {},
|
||
legend: {
|
||
padding: [10, 50, 0, 0],
|
||
x: 'right', //可设定图例在左、右、居中
|
||
y: 'top', //可设定图例在上、下、居中
|
||
data: legendData,
|
||
textStyle: {
|
||
fontSize: 12,//字体大小
|
||
color: '#ffffff'//字体颜色
|
||
},
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
data: xAxisData,
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#2295ee', //x轴的颜色
|
||
width: 1, //轴线的宽度
|
||
},
|
||
},
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
splitLine: {
|
||
lineStyle: {
|
||
color: '#2295ee'
|
||
}
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#2295ee', //x轴的颜色
|
||
width: 1, //轴线的宽度
|
||
},
|
||
},
|
||
},
|
||
series: seriesData,
|
||
};
|
||
//为echarts对象加载数据
|
||
this.echartInit[domKey].setOption(optionLine);
|
||
})
|
||
},
|
||
// 实时时间
|
||
getNowTime() {
|
||
let speed = 1000
|
||
let that = this
|
||
let theNowTime = function () {
|
||
that.nowTime = that.timeNumber()
|
||
}
|
||
setInterval(theNowTime, speed)
|
||
},
|
||
timeNumber() {
|
||
let today = new Date()
|
||
let date = today.getFullYear() + '年' + this.twoDigits(today.getMonth() + 1) + '月' + this.twoDigits(today.getDate()) + '日'
|
||
let time = this.twoDigits(today.getHours()) + ':' + this.twoDigits(today.getMinutes()) + ':' + this.twoDigits(today.getSeconds())
|
||
let wk = new Date().getDay()
|
||
let weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
|
||
let week = weeks[wk]
|
||
return date + ' ' + week + ' ' + time
|
||
},
|
||
twoDigits(val) {
|
||
if (val < 10) return '0' + val
|
||
return val
|
||
},
|
||
// 跳转页面3
|
||
jumpStationPage(e) {
|
||
let stationCode = e.stationCode
|
||
if (e.stationType == 'livestock') {
|
||
this.$router.push({path: '/CqyzList', query: {stationCode: stationCode}})
|
||
// this.$message({
|
||
// message: '站点正在建设中......',
|
||
// showClose: true,
|
||
// });
|
||
} else {
|
||
this.$router.push({path: '/MywrList', query: {stationCode: stationCode}})
|
||
}
|
||
},
|
||
// 弹窗退出登录
|
||
handleClosetuichu(done) {
|
||
this.dialogVisible = false
|
||
// window.sessionStorage.clear();
|
||
localStorage.clear()
|
||
this.$router.push({path: '/Login'})
|
||
},
|
||
// 弹窗个人信息
|
||
infor() {
|
||
var onformation = JSON.parse(window.sessionStorage.getItem('password'));
|
||
if (onformation) {
|
||
this.inforname = onformation.realname
|
||
}
|
||
},
|
||
qcguanbi() {//全部关闭
|
||
this.qcdialogTableVisible = false
|
||
this.qyinfordtdialogTableVisible = false
|
||
this.dialogTableVisible = false
|
||
this.singleEchartDialogShowFlag = false
|
||
},
|
||
screen() {
|
||
let element = document.documentElement;
|
||
if (this.fullscreen) {
|
||
if (document.exitFullscreen) {
|
||
document.exitFullscreen();
|
||
} else if (document.webkitCancelFullScreen) {
|
||
document.webkitCancelFullScreen();
|
||
} else if (document.mozCancelFullScreen) {
|
||
document.mozCancelFullScreen();
|
||
} else if (document.msExitFullscreen) {
|
||
document.msExitFullscreen();
|
||
}
|
||
} else {
|
||
if (element.requestFullscreen) {
|
||
element.requestFullscreen();
|
||
} else if (element.webkitRequestFullScreen) {
|
||
element.webkitRequestFullScreen();
|
||
} else if (element.mozRequestFullScreen) {
|
||
element.mozRequestFullScreen();
|
||
} else if (element.msRequestFullscreen) {
|
||
// IE11
|
||
element.msRequestFullscreen();
|
||
}
|
||
}
|
||
this.fullscreen = !this.fullscreen;
|
||
},
|
||
switchIcon(flag) {
|
||
let that = this;
|
||
let arr = [];
|
||
if (this.lastClickIcon == flag) {
|
||
this.lastClickIcon = ''
|
||
} else {
|
||
this.lastClickIcon = flag;
|
||
if (flag == 'duizhuhe') {
|
||
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;
|
||
}
|
||
}
|
||
if (arr && arr.length > 0) {
|
||
that.aMap.setFitView(arr, false, [200, 500, 300, 300], 16);
|
||
// setTimeout(() => {
|
||
// let temp = that.aMap.getCenter();//矫正显示标点位置在正中心
|
||
// that.aMap.setZoomAndCenter(that.aMap.getZoom()-2, [temp.lng, temp.lat - 0.15]);
|
||
// },2000)
|
||
} else {
|
||
that.aMap.setFitView(null, false, [100, 400, 200, 200], 16);
|
||
}
|
||
}
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
@import '@/assets/css/index.css';
|
||
|
||
.quanping {
|
||
width: 1.6vw;
|
||
margin-right: 3%;
|
||
margin-top: 0.2vw;
|
||
position: absolute;
|
||
right: 1%;
|
||
z-index: 999;
|
||
}
|
||
|
||
/* 台账弹窗 */
|
||
.tzsanguang {
|
||
position: absolute;
|
||
top: -1.5vw;
|
||
right: 38%;
|
||
}
|
||
|
||
.tzsanguangbt {
|
||
position: absolute;
|
||
bottom: -1.5vw;
|
||
right: 38%;
|
||
}
|
||
|
||
.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;
|
||
}
|
||
|
||
|
||
|
||
.mywrcov_onehover {
|
||
cursor: pointer;
|
||
}
|
||
|
||
|
||
|
||
|
||
.centerMainBox2 img {
|
||
position: absolute;
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
|
||
.boxLis {
|
||
width: 70%;
|
||
height: 1.5vw;
|
||
margin-left: 3vw;
|
||
margin-top: 1vw;
|
||
border-bottom: .02vw solid rgb(40, 229, 233);
|
||
}
|
||
|
||
.boxLis > li {
|
||
width: 4vw;
|
||
height: 1.4vw;
|
||
display: block;
|
||
background: rgba(40, 229, 233, .5);
|
||
margin-right: .5vw;
|
||
color: #fff;
|
||
line-height: 1.4vw;
|
||
text-align: center;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.active {
|
||
border-bottom: .02vw solid #040A18;
|
||
border-top: .02vw solid rgb(40, 229, 233);
|
||
border-right: .02vw solid rgb(40, 229, 233);
|
||
border-left: .02vw solid rgb(40, 229, 233);
|
||
}
|
||
|
||
.contList {
|
||
position: relative;
|
||
width: 70%;
|
||
height: 7vw;
|
||
margin: 1vw auto 0;
|
||
}
|
||
|
||
.content1 li {
|
||
display: none;
|
||
}
|
||
|
||
.baseBox {
|
||
width: 100%;
|
||
border: none;
|
||
background: none;
|
||
}
|
||
|
||
.boxTitle {
|
||
font-size: .8vw;
|
||
width: 38%;
|
||
margin-top: 1vw;
|
||
text-align: center;
|
||
}
|
||
|
||
.right {
|
||
float: right;
|
||
}
|
||
|
||
.baseBoxLeft {
|
||
width: 22.5%;
|
||
height: 100%;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.baseBoxRight {
|
||
width: 68%;
|
||
height: 100%;
|
||
}
|
||
|
||
.maps {
|
||
width: 100%;
|
||
height: 95%;
|
||
margin-top: 2%;
|
||
background: pink;
|
||
}
|
||
|
||
.baseBox1,
|
||
.baseBox2,
|
||
.baseBox3 {
|
||
position: relative;
|
||
}
|
||
|
||
.baseBox1 img,
|
||
.baseBox2 img,
|
||
.baseBox3 img {
|
||
position: absolute;
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.csbaseBox1 {
|
||
position: relative;
|
||
z-index: 999;
|
||
}
|
||
|
||
.liSpan {
|
||
width: 100%;
|
||
margin-top: 3.2%;
|
||
text-align: center;
|
||
color: rgb(40, 229, 233);
|
||
}
|
||
|
||
.liP {
|
||
width: 66%;
|
||
margin: .3vw auto 0;
|
||
text-align: left;
|
||
font-size: .5vw;
|
||
color: rgb(40, 229, 233);
|
||
}
|
||
|
||
a:hover {
|
||
text-decoration: none
|
||
}
|
||
|
||
.titleName {
|
||
color: #0EFCFF;
|
||
}
|
||
|
||
.plant {
|
||
width: 90%;
|
||
height: 5.5vw;
|
||
margin: 2% auto 0;
|
||
display: -webkit-flex;
|
||
display: -moz-flex;
|
||
/* -webkit-justify-content: space-between;
|
||
-moz-justify-content: space-between; */
|
||
}
|
||
|
||
.plant > li {
|
||
width: 15%;
|
||
height: 100%;
|
||
}
|
||
|
||
.jumps {
|
||
width: 100%;
|
||
height: 100%;
|
||
background: rgba(0, 235, 255, .08);
|
||
display: -webkit-flex;
|
||
/* -webkit-flex-direction: column;
|
||
-webkit-justify-content: space-between; */
|
||
display: -moz-flex;
|
||
/* -moz-flex-direction: column;
|
||
-moz-justify-content: space-between; */
|
||
}
|
||
|
||
.jumps > div > img {
|
||
width: .88vw;
|
||
height: .88vw;
|
||
float: right;
|
||
}
|
||
|
||
.jumps > p {
|
||
width: 90%;
|
||
font-size: 1.3vw;
|
||
color: #fff;
|
||
margin: auto;
|
||
}
|
||
|
||
.jumps > div {
|
||
width: 90%;
|
||
margin: 5% auto 0;
|
||
}
|
||
|
||
.jumps > div > span {
|
||
font-size: .6vw;
|
||
color: #0efcff;
|
||
float: left;
|
||
}
|
||
|
||
.spans0 {
|
||
width: 80%;
|
||
height: 5%;
|
||
background: #03DA8D;
|
||
}
|
||
|
||
.spans1 {
|
||
width: 80%;
|
||
height: 5%;
|
||
background: #0efcff;
|
||
}
|
||
|
||
.spans2 {
|
||
width: 80%;
|
||
height: 5%;
|
||
background: #FE0000;
|
||
}
|
||
|
||
.spans3 {
|
||
width: 80%;
|
||
height: 5%;
|
||
background: #F78001;
|
||
}
|
||
|
||
.boxVideo {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.boxVideo video {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.baseDatas {
|
||
width: 70%;
|
||
height: 2vw;
|
||
display: -webkit-flex;
|
||
/* -webkit-justify-content: space-between; */
|
||
margin: 1vw 0 0 5vw;
|
||
}
|
||
|
||
.baseDatas li {
|
||
width: 10%;
|
||
}
|
||
|
||
.baseDatas li a {
|
||
color: #fff;
|
||
font-size: .8vw;
|
||
}
|
||
|
||
.active2 a > span {
|
||
color: rgb(40, 229, 233);
|
||
}
|
||
|
||
.baseDatas li a:hover > span {
|
||
color: rgb(40, 229, 233);
|
||
}
|
||
|
||
.baseDatas li a:hover > .borderRight {
|
||
border-left-color: rgb(40, 229, 233);
|
||
}
|
||
|
||
.tableDetalis {
|
||
width: 92%;
|
||
color: #fff;
|
||
margin-left: 2vw;
|
||
}
|
||
|
||
.tableDetalis tr {
|
||
height: 1.3vw;
|
||
font-size: .8vw;
|
||
}
|
||
|
||
.tableDetalis tr > td {
|
||
text-align: center;
|
||
}
|
||
|
||
.tableDetalis tr > td:nth-child(7) {
|
||
text-align: right;
|
||
}
|
||
|
||
.borderRight {
|
||
width: 0;
|
||
height: 0;
|
||
float: left;
|
||
border: .4vw solid transparent;
|
||
border-left-color: #fff;
|
||
margin-top: .2vw;
|
||
}
|
||
|
||
.borderActive {
|
||
border-left-color: rgb(40, 229, 233);
|
||
}
|
||
|
||
.equipment_table {
|
||
width: 85%;
|
||
height: 25%;
|
||
margin: auto;
|
||
text-align: center;
|
||
color: #fff;
|
||
font-size: .5vw;
|
||
}
|
||
|
||
.equipment_table tr:nth-child(1) {
|
||
color: #0EFCFF;
|
||
}
|
||
|
||
.equipment_table tr {
|
||
border: 1px solid #0EFCFF;
|
||
}
|
||
|
||
.equipment_table tr:nth-child(1) {
|
||
font-size: .8vw;
|
||
}
|
||
|
||
.equipment_table img {
|
||
width: 1vw;
|
||
}
|
||
|
||
.env_table {
|
||
height: 35%;
|
||
margin-top: 5%;
|
||
}
|
||
|
||
.env_table td {
|
||
border: 1px solid #0EFCFF;
|
||
}
|
||
|
||
.env_table tr:nth-child(1) {
|
||
background: rgba(14, 252, 255, .3);
|
||
}
|
||
|
||
.map img {
|
||
width: 80%;
|
||
margin-left: 10%;
|
||
}
|
||
|
||
.map img {
|
||
width: 80%;
|
||
margin-left: 10%;
|
||
}
|
||
|
||
.mapActived1 {
|
||
position: absolute;
|
||
top: 41.5%;
|
||
left: 61%;
|
||
width: 3.5vw;
|
||
height: 5.5vw;
|
||
border-radius: 90px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.mapActived2 {
|
||
position: absolute;
|
||
top: 60%;
|
||
right: 16%;
|
||
width: 4.5vw;
|
||
height: 2.5vw;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.mapActived3 {
|
||
position: absolute;
|
||
top: 57%;
|
||
right: 9%;
|
||
width: 2.5vw;
|
||
height: 7vw;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.mapContent1 {
|
||
position: absolute;
|
||
height: 6vw;
|
||
width: 8vw;
|
||
left: 65%;
|
||
top: 33%;
|
||
background: rgba(255, 255, 255, .2);
|
||
}
|
||
|
||
.mapContent2 {
|
||
position: absolute;
|
||
height: 6vw;
|
||
width: 8vw;
|
||
left: 70%;
|
||
top: 35%;
|
||
background: rgba(255, 255, 255, .2);
|
||
display: none;
|
||
}
|
||
|
||
.mapContent3 {
|
||
position: absolute;
|
||
height: 6vw;
|
||
width: 8vw;
|
||
right: 1%;
|
||
top: 35%;
|
||
background: rgba(255, 255, 255, .2);
|
||
display: none;
|
||
}
|
||
|
||
.mapContentFont {
|
||
width: 85%;
|
||
margin-left: 12%;
|
||
font-size: .6vw;
|
||
color: #0efcff;
|
||
letter-spacing: .05vw;
|
||
margin-bottom: .3vw;
|
||
}
|
||
|
||
.mapContentFont:nth-child(1) {
|
||
margin-top: .6vw;
|
||
}
|
||
|
||
.mapContentFont span {
|
||
color: white;
|
||
}
|
||
|
||
.video-js {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.video-js:hover .vjs-big-play-button {
|
||
background: none;
|
||
}
|
||
|
||
.video-js .vjs-big-play-button:hover {
|
||
background: none;
|
||
}
|
||
|
||
.video-js .vjs-big-play-button {
|
||
border: none;
|
||
background: none;
|
||
}
|
||
|
||
|
||
.in1con_lf_titshow1 {
|
||
font-size: 1vw;
|
||
color: #fff;
|
||
text-shadow: 0px 2px 0px rgba(4, 49, 52, 0.55);
|
||
font-family: douyuFont;
|
||
position: absolute;
|
||
top: 0.9vw;
|
||
left: 0%;
|
||
display: block;
|
||
width: 100%;
|
||
text-align: center;
|
||
}
|
||
.in1con_lf_titshow2 {
|
||
font-size: 11px;
|
||
color: #fff;
|
||
text-shadow: 0px 2px 0px rgba(4, 49, 52, 0.55);
|
||
//font-family: douyuFont;
|
||
position: absolute;
|
||
top: 1.3vw;
|
||
right: 18px;
|
||
display: block;
|
||
width: 100%;
|
||
text-align: right;
|
||
cursor: pointer;
|
||
}
|
||
</style>
|
||
|
||
<style>
|
||
.login .el-dialog {
|
||
position: relative;
|
||
margin: 0 auto;
|
||
background: #fff;
|
||
border-radius: 2px;
|
||
box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
|
||
box-sizing: border-box;
|
||
width: 50%;
|
||
}
|
||
|
||
.el-dialog {
|
||
position: relative;
|
||
margin: 0 auto;
|
||
background: none;
|
||
border-radius: 2px;
|
||
box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
|
||
box-sizing: border-box;
|
||
width: 50%;
|
||
}
|
||
|
||
.el-dialog__header {
|
||
display: none;
|
||
}
|
||
|
||
.home_dlhj .el-carousel__arrow {
|
||
top: 9%;
|
||
font-size: 1vw;
|
||
}
|
||
|
||
.home_dlhj .el-carousel__arrow--left {
|
||
left: 0;
|
||
}
|
||
|
||
.home_dlhj .el-carousel__arrow--right {
|
||
right: 0;
|
||
}
|
||
|
||
.el-tabs--card > .el-tabs__header {
|
||
border: none;
|
||
}
|
||
|
||
.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
|
||
text-align: center;
|
||
height: 1.7vw;
|
||
line-height: 1.7vw;
|
||
margin-left: 1% !important;
|
||
border-radius: 0.4vw;
|
||
background: #0e2c3f;
|
||
color: #fff !important;
|
||
border: 1px solid #2fbdff;
|
||
box-shadow: inset 0px 0px 16px 0px rgba(0, 145, 255, 1);
|
||
margin-top: 8px;
|
||
text-align: center;
|
||
font-size: 12px !important;
|
||
}
|
||
|
||
.el-tabs--card > .el-tabs__header .el-tabs__item {
|
||
text-align: center;
|
||
height: 1.7vw;
|
||
line-height: 1.7vw;
|
||
margin-left: 1% !important;
|
||
border-radius: 0.4vw;
|
||
background: #0e2c3f;
|
||
color: #fff !important;
|
||
font-size: 8px !important;
|
||
border: 1px solid #0e2c3f;
|
||
font-size: 12px !important;
|
||
}
|
||
|
||
.el-tabs--card > .el-tabs__header .el-tabs__nav {
|
||
border: none;
|
||
float: right;
|
||
margin-right: 6%;
|
||
margin-top: 5px;
|
||
}
|
||
|
||
.zlxg_btm .el-tabs__item:hover {
|
||
text-align: center;
|
||
height: 1.7vw;
|
||
line-height: 1.7vw;
|
||
margin-left: 1% !important;
|
||
border-radius: 0.4vw;
|
||
background: #0e2c3f;
|
||
color: #fff !important;
|
||
border: 1px solid #2fbdff;
|
||
box-shadow: inset 0px 0px 16px 0px rgba(0, 145, 255, 1);
|
||
font-size: 12px !important;
|
||
}
|
||
|
||
.v-modal {
|
||
display: none;
|
||
}
|
||
|
||
.jcsssj_rt_num {
|
||
display: inline-block;
|
||
font-size: 0.8vw;
|
||
/* color: #fff; */
|
||
margin-left: 20%;
|
||
text-align: right;
|
||
margin-top: 0.4vw;
|
||
}
|
||
|
||
|
||
/* 企业弹窗样式 */
|
||
.tctit {
|
||
font-size: 1.2vw;
|
||
color: #fff;
|
||
font-weight: bold;
|
||
display: block;
|
||
margin-bottom: 1.6vw;
|
||
}
|
||
|
||
.tcgldw {
|
||
font-size: 1vw;
|
||
color: #fff;
|
||
line-height: 2vw;
|
||
display: block;
|
||
padding-right: 3%;
|
||
height: 15vw;
|
||
overflow: auto;
|
||
}
|
||
|
||
/* 定义滚动条样式 */
|
||
.tcgldw::-webkit-scrollbar {
|
||
width: 2px;
|
||
height: 2px;
|
||
background-color: rgba(240, 240, 240, 0.1);
|
||
}
|
||
|
||
/*定义滚动条轨道 内阴影+圆角*/
|
||
.tcgldw::-webkit-scrollbar-track {
|
||
box-shadow: inset 0 0 0px rgba(240, 240, 240, .5);
|
||
border-radius: 10px;
|
||
background-color: rgba(240, 240, 240, .5);
|
||
}
|
||
|
||
/*定义滑块 内阴影+圆角*/
|
||
.tcgldw::-webkit-scrollbar-thumb {
|
||
border-radius: 10px;
|
||
box-shadow: inset 0 0 0px rgba(87, 146, 255, .8);
|
||
background-color: rgba(87, 146, 255, .8);
|
||
}
|
||
|
||
/* 曲线弹窗 */
|
||
.jgdhei {
|
||
margin-top: 2vw;
|
||
}
|
||
|
||
.trwdcov {
|
||
width: 94%;
|
||
margin: 0 auto;
|
||
}
|
||
|
||
.trwdcov_top {
|
||
width: 100%;
|
||
height: 5vh;
|
||
line-height: 5vh;
|
||
text-align: left;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.trwdcov_top_tit {
|
||
color: #fff;
|
||
font-size: 0.8vw;
|
||
margin-right: 1%;
|
||
}
|
||
|
||
.trwdcov_top_zcz {
|
||
color: #fff;
|
||
font-size: 0.8vw;
|
||
float: right;
|
||
margin-right: 3%;
|
||
}
|
||
|
||
.trwdcov_top .el-radio__input.is-checked .el-radio__inner {
|
||
border-color: #00ffcd;
|
||
background: #00ffcd;
|
||
}
|
||
|
||
.trwdcov_top .el-radio__input.is-checked + .el-radio__label {
|
||
color: #00ffcd;
|
||
}
|
||
|
||
.trwdcov_top .el-radio {
|
||
color: #fff;
|
||
}
|
||
|
||
.trwdcov_top .el-input__inner {
|
||
background: none;
|
||
}
|
||
|
||
.trwdcov_top .el-date-editor .el-range-input {
|
||
background: none;
|
||
color: #c9c9c9;
|
||
border-color: #c9c9c9;
|
||
}
|
||
|
||
.trwdcov_top .el-date-editor .el-range-separator {
|
||
color: #fff;
|
||
}
|
||
|
||
.trwdcov .el-table__body, .el-table__footer, .el-table__header {
|
||
width: 100% !important;
|
||
}
|
||
|
||
.trwdcov .el-table__body, .el-table__footer, .el-table__header {
|
||
width: 100% !important;
|
||
text-align: center;
|
||
}
|
||
|
||
.trwdcov .el-table tr {
|
||
background: none;
|
||
}
|
||
|
||
.trwdcov .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf {
|
||
background: none;
|
||
color: #00ffcd;
|
||
border-bottom: 1px solid #747474;
|
||
text-align: center;
|
||
}
|
||
|
||
.trwdcov .el-table--border .el-table__cell, .el-table__body-wrapper .el-table--border.is-scrolling-left ~ .el-table__fixed {
|
||
border-right: 1px solid #747474;
|
||
}
|
||
|
||
.trwdcov .el-table--enable-row-transition .el-table__body td.el-table__cell {
|
||
color: #c9c9c9 !important;
|
||
}
|
||
|
||
.trwdcov .el-table--border, .el-table--group {
|
||
border: 1px solid #747474;
|
||
}
|
||
|
||
.trwdcov .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
|
||
background: rgba(255, 255, 255, 0.2);
|
||
}
|
||
|
||
.trwdcov_top_time {
|
||
margin-right: 3%;
|
||
}
|
||
|
||
.tz_cov_right .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
|
||
background: rgba(255, 255, 255, 0.1);
|
||
cursor: pointer;
|
||
}
|
||
|
||
.el-table .el-table__cell.gutter {
|
||
background: var(--tableHeadBg);
|
||
width: 2px;
|
||
}
|
||
|
||
.el-table__body-wrapper::-webkit-scrollbar {
|
||
width: 2px;
|
||
height: 2px;
|
||
background-color: rgba(240, 240, 240, 0.1);
|
||
}
|
||
|
||
|
||
.el-table th.gutter {
|
||
display: none;
|
||
width: 0;
|
||
}
|
||
|
||
.el-table colgroup col[name='gutter'] {
|
||
display: none;
|
||
width: 0;
|
||
}
|
||
|
||
.in1con_lf_img {
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
}
|
||
|
||
.mapTuLi {
|
||
position: absolute;
|
||
bottom: 334px;
|
||
left: 456px;
|
||
}
|
||
|
||
.mywrcov_onenumjx{
|
||
font-size: 1.2vw;
|
||
}
|
||
|
||
</style>
|