智慧农业后台管理页面
blame | history | patch | commit | commitdiff | ignore whitespace
guanqb
2022-09-06 cbf18809270976db8af332fb80bedd6509c60245 
 public/traceablityInfo.html


@@ -5,6 +5,8 @@


<head>


  <meta charset="UTF-8">


  <meta name="divport" content="width=device-width, initial-scale=1.0">


  <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->


  <title>查看溯源</title>


  <style>


    .top-log {


      position: relative;


@@ -222,7 +224,6 @@




    .model-box.cd .model-content.dk .content-body {


      height: 450px;


      background: greenyellow;


    }




    .model-box.cd .model-content.jksp .content-body {


@@ -355,8 +356,13 @@


      font-size: 24px;


      color: #697580;


      white-space: nowrap;


      padding: 0 5px;


      overflow: hidden;


      text-overflow: ellipsis;


    }




    .equiBtnOn {


      background-color: rgb(28, 235, 28) !important;


      color: #fff !important;


    }




    .model-box.cd .model-content.jksp .content-footer .equi-btn:first-child {


@@ -607,6 +613,15 @@


      position: relative;


      overflow: hidden;


    } */


    #video-body {


      width: 94%;


      padding: 0 3%;


      height: 400px;


    }




    #video-body video {


      object-fit: fill;


    }




    #video-footer {


      width: 100%;


@@ -633,19 +648,187 @@


  </style>


  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>


  <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>


  <script src="js/flv.min.js" type="text/javascript" charset="utf-8"></script>


  <script src="js/WebRtcPlayer.js"></script>


</head>






<body>


  <div class="page-main-container" style="background: #F1F9F8;width:100%;height: 100%;">


    <!-- str0 -->


    <!-- 顶部图片 -->


    <div class="top-log">


      <img width="100%" height="520px" src="https://dev.jxpskj.com:8023/zhny-web/assets/images/sym/2.png" />


      <div class="btn-grounp">


        <img bindtap="scrollTo" data-class=".qw" width="200px" height="100px"


          src="https://dev.jxpskj.com:8023/zhny-web/assets/images/sy/1418.png" />


        <img bindtap="scrollTo" data-class=".cd" width="200px" height="100px"


          src="https://dev.jxpskj.com:8023/zhny-web/assets/images/sy/1416.png" />


        <img bindtap="scrollTo" data-class=".zz" width="200px" height="100px"


          src="https://dev.jxpskj.com:8023/zhny-web/assets/images/sy/1415.png" />


        <img bindtap="scrollTo" data-class=".sc" width="200px" height="100px"


          src="https://dev.jxpskj.com:8023/zhny-web/assets/images/sy/1414.png" />


      </div>


    </div>




    <!-- <scroll-div scroll-top="{{scrollTop}}" refresher-enabled="{{true}}" bindrefresherrefresh="refresh" refresher-triggered="{{triggered}}" style="height: {{clientHeight}}" scroll-y bindscrolltolower="upcroll"> -->


    <!-- 农产品信息 -->


    <div class="main-content">


      <div class="logo">


        <img width="100%" height="100%" id="logoImg" />


      </div>


      <div class="title" id="titleName"></div>


      <div class="type">


        <div class="sub" id="sub1">${recovery.lx}</div>


      </div>


      <div class="date" id="date1"></div>


    </div>




    <!-- </scroll-div> -->


    <!-- 权威检测 -->


    <div class="qw model-box">


      <div class="model-title">


        <div class="l"></div>


        <div class="title">权威检测</div>


        <div class="border"></div>


        <div class="status">


          <div>


            <van-icon style="margin-right: 10px;"


              name="https://dev.jxpskj.com:8023/zhny-web/assets/images/sym/1265.png" />


          </div>


          可追溯


        </div>


      </div>


      <div class="model-content" id="str1Dom">


        <!-- str1 -->


        <!-- str2 -->


      </div>


    </div>




    <!-- 产地信息 -->


    <div class="cd model-box">


      <div class="model-title">


        <div class="l"></div>


        <div class="title">产地信息</div>


        <div class="border"></div>


        <div class="status">


          <div>


            <van-icon style="margin-right: 10px;"


              name="https://dev.jxpskj.com:8023/zhny-web/assets/images/sym/1265.png" />


          </div>


          可追溯


        </div>


      </div>




      <div class="dk model-content">


        <div class="content-header">


          <van-icon style="margin-right: 12px;" name="https://dev.jxpskj.com:8023/zhny-web/assets/images/sy/1267.png" />


          种植地块


        </div>


        <div class="content-body">


          <img width="94%" height="100%" style="margin-left:3%" id="contentImg1" />


        </div>


        <div class="content-footer">


          <div class="l" id="farmAddress"></div>


        </div>


      </div>




      <!-- 监控数据展示 -->


      <div class="jksp model-content">


        <div class="content-header">


          <van-icon style="margin-right: 12px;" name="https://dev.jxpskj.com:8023/zhny-web/assets/images/sy/1272.png" />


          良心生产，不怕监督，24小时视频监控


        </div>


        <div class="content-body">


          <div id="video-body">


            <video autoplay muted controls id="videoElement"


              style="width:100%;height: 100%;">你的浏览器太老了，不支持HTML5视频。</video>


          </div>


        </div>


        <div class="content-footer" id="videoFooter"></div>


        <!-- str10 -->


      </div>


      <!-- 监测数据展示-->


      <div class="jk model-content">


        <div class="content-header">


          物联网监控保证产地养分充足，且不被污染


        </div>


        <div class="content-body">


          <div class="site-box">


            <!-- strdetection -->


            <div class="site-title">


              <div class="l">


                <select id="select" style="font-weight: bold;color: #333333;border: none;font-size: 28px;width:96%">


                </select>


              </div>


            </div>


            <div class="site-date">


              <div class="site-date-text" id="sitedatetext">更新时间</div>


            </div>


            <div class="site-content" id="detectionlist">


              <!-- str11 -->


              <!-- </div> -->


            </div>


          </div>


        </div>


      </div>


    </div>




    <!-- 种植环节 -->


    <div class="zz model-box">


      <div class="model-title">


        <div class="l"></div>


        <div class="title">种植环节</div>


        <div class="border"></div>


        <div class="status no"></div>


      </div>


      <div class="model-content">


        <div class="msg">


          <div class="l">


            <img width="126px" height="126px" src="https://dev.jxpskj.com:8023/zhny-web/assets/images/sy/zz-log.png" />


          </div>


          <div class="r">


            <div>


              我是基地管理员：


            </div>


            <div class="r-b-msg">


              以下农事操作，是在我的监督下完成


            </div>




            <div class="point-to"></div>


          </div>


        </div>


        <!-- str3 -->


        <div id="recordBox"></div>


        <!-- str4 -->


      </div>


    </div>




    <!-- 生产企业 -->


    <div class="sc model-box">


      <div class="model-title">


        <div class="l"></div>


        <div class="title">生产企业</div>


        <div class="border"></div>


        <div class="status no">


        </div>


      </div>


      <div class="model-content">


        <div class="content-header" id="contentHeader"></div>


        <div class="content-body">


          <swiper class="swiper" indicator-dots="true" autoplay="true" interval="3000" duration="1000">


            <block class="swiper-image" id="swImg">


              <!-- str5 -->


              <!-- str6 -->


            </block>


          </swiper>




        </div>


        <div class="text-intro" id="textIntro"></div>


        <div class="content-footer">


        </div>


      </div>


    </div>


  </div>


  <script>


</body>


<script>


  $(function () {


    var getData = function (name) {


      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");


      var r = window.location.search.substr(1).match(reg);


@@ -653,72 +836,34 @@


      return null;


    };


    var code = getData("code");


    axios.get('https://dev.jxpskj.com:8023/api/traceability/getTraceabilityDetailInfos?code=' + code).then(


      function (res) {


        // 初始化数据begin


        var data = res.data.data;


        var farm = data.farm;


        var land = data.landVO;


        var num = data.num;


        var paperList = data.paperVOList;


        var recordVOList = data.recordVOList;


        var recovery = data.recoveryVO;


        // 初始化数据end




    // var code = "22070000001";


        // 页面数据渲染begin


        $('#titleName').text(recovery.strainName)


        $('#logoImg').attr('src', recovery.url)


        $('#sub1').text(recovery.lx)


        $('#date1').text('采收时间：' + recovery.time.replaceAll("-", "."))


        $('#contentHeader').text(farm.farmName)


        $('#textIntro').text(farm.introduce)


        // $('#slideImg').attr(item)


        // 页面数据渲染end






    axios.get('https://dev.jxpskj.com:8023/api/traceability/getTraceabilityDetailInfos?code=' + code).then(function (


      res) {


      // axios.get('http://192.168.0.114:89/traceability/getTraceabilityDetailInfo?code=' + code).then(function(res) {




      var data = res.data.data;


      var farm = data.farm;


      var land = data.landVO;


      var num = data.num;


      var paperList = data.paperVOList;


      var recordVOList = data.recordVOList;


      var recovery = data.recoveryVO;


      var str0 = `<div class="top-log">


            <img width="100%" height="520px" src="http://182.106.212.58:8014/assets/images/sym/2.png" />


            <div class="btn-grounp">


                <img bindtap="scrollTo" data-class=".qw" width="200px" height="100px" src="http://182.106.212.58:8014/assets/images/sy/1418.png" />


                <img bindtap="scrollTo" data-class=".cd" width="200px" height="100px" src="http://182.106.212.58:8014/assets/images/sy/1416.png" />


                <img bindtap="scrollTo" data-class=".zz" width="200px" height="100px" src="http://182.106.212.58:8014/assets/images/sy/1415.png" />


                <img bindtap="scrollTo" data-class=".sc" width="200px" height="100px" src="http://182.106.212.58:8014/assets/images/sy/1414.png" />


            </div>


        </div>




        <div class="main-content">




            <div class="logo">


                <img width="100%" height="100%" src="${recovery.url}" />


                <!-- <div class="btn">更换图片</div> -->


            </div>




            <div class="title">${recovery.strainName}</div>




            <div class="type">


                <div class="sub">${recovery.lx}</div>


                <!-- <div class="icon">


                <van-icon name="play" />


              </div> -->


            </div>




            <div class="date">


                采收时间：${recovery.time.replaceAll("-", ".")}


            </div>




        </div>


        <div class="qw model-box">




        <div class="model-title">


            <div class="l"></div>


            <div class="title">权威检测</div>


            <div class="border"></div>


            <div class="status">


                <div>


                    <van-icon style="margin-right: 10px;" name="http://182.106.212.58:8014/assets/images/sym/1265.png" />


                </div>


                可追溯


            </div>


        </div>




        <div class="model-content">`


      var str1 = '';


      if (paperList.length > 0) {


        paperList.forEach(item => {


          var url = item.pictures.split(",")[0];


          str1 = str1 + `<div class="box">


        // 权威检测页面遍历begin


        var str1 = '';


        if (paperList.length > 0) {


          paperList.forEach(item => {


            var url = item.pictures.split(",")[0];


            str1 = str1 + `<div class="box">


                        <div class="l">


                            <img width="204px" height="204px" src="${url}" />


                        </div>


@@ -740,226 +885,16 @@


                            </div>


                        </div>


                    </div>`


        });


      } else {


        str1 = str1 + `<div class="box"></div>`


      }






      var str2 = `


            </div>


        </div>




        <div class="cd model-box">


            <div class="model-title">


                <div class="l"></div>f


                <div class="title">产地信息</div>


                <div class="border"></div>


                <div class="status">


                    <div>


                        <van-icon style="margin-right: 10px;" name="http://182.106.212.58:8014/assets/images/sym/1265.png" />


                    </div>


                    可追溯


                </div>


            </div>




            <div class="dk model-content">


                <div class="content-header">


                    <van-icon style="margin-right: 12px;" name="http://182.106.212.58:8014/assets/images/sy/1267.png" /> 种植地块


                </div>


                <div class="content-body">


                    <image style="width: 100%;height:100%" src="${land.url}" />


                </div>


                <div class="content-footer">


                    <div class="l">


                        ${farm.farmAddress}


                    </div>


                    <!-- <div class="r">


                  <van-icon name="star" />


                  导航


                </div> -->


                </div>


            </div>




            <div class="jksp model-content">


                <div class="content-header">


                    <van-icon style="margin-right: 12px;" name="http://182.106.212.58:8014/assets/images/sy/1272.png" /> 良心生产，不怕监督，24小时视频监控


                </div>`




      var dom = $('.page-main-container');


      dom.empty();


      dom.append(str0 + str1 + str2);




      //请求检测数据


      axios.get(


        'http://dev.jxpskj.com:8030/pyh-station/stationAndVideo/queryStationAndVideoInfoData?type=All&landId=' +


        recovery.landId).then(function (res) {


        var staList = res.data.data.staList;


        var vidList = res.data.data.vidList;




        window.detectionList = staList;


        window.videoList = vidList;














        //监控


        var strvedio = '';


        // vidList.push({


        //   name:"1号摄像头"


        // })


        // vidList.push({


        //   name:"2号摄像头"


        // })


        if (vidList.length > 0) {


          //读取第一个视频 url


          strvedio = strvedio + `<div class="content-body">


                  <div id="video-body">


                    <video controls id="video-element" autoplay muted>你的浏览器太老了，不支持HTML5视频。</video>


                  </div>


                </div><div class="content-footer">`


          //遍历监控点


          vidList.forEach((item, index) => {


            strvedio = strvedio + `<div class="equi-btn on">


                        ${item.name}


                    </div>`


            if (index >= 1) {


              // equibtn.style.color = "#fff";


            }


          })


          });


        } else {


          strvedio = strvedio + `<div class="content-body">


                </div><div class="content-footer">`


          str1 = str1 + `<div class="box"></div>`


        }


        $('#str1Dom').append(str1)


        $('#contentImg1').attr('src', land.url)


        $('#farmAddress').text(farm.farmAddress)


        // 权威检测页面遍历end       




        var str10 =


          `</div>


              </div>


            <div class="jk model-content">


                <div class="content-header">


                    物联网监控保证产地养分充足，且不被污染


                </div>


                <div class="content-body">


                    <div class="site-box">`




        var strdetection = '';




        if (staList.length > 0) {


          var sta = staList[0];


          var timeStr = '';


          var time = sta.weatherTime;


          //当前时间


          var date = new Date();


          //计算时间差


          var crud = date.getTime() - new Date(time).getTime();


          //计算出相差天数


          var days = Math.floor(crud / (24 * 3600 * 1000))


          timeStr = days + "天";




          if (days == 0) {


            //计算出小时数


            var leave1 = crud % (24 * 3600 * 1000) //计算天数后剩余的毫秒数


            var hours = Math.floor(leave1 / (3600 * 1000))


            timeStr = hours + "小时";




            if (hours == 0) {


              //计算相差分钟数


              var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数


              var minutes = Math.floor(leave2 / (60 * 1000))


              timeStr = minutes + "分钟";




              if (minutes == 0) {


                //计算相差秒数


                var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数


                var seconds = Math.round(leave3 / 1000)


                timeStr = seconds + "秒";


              }


            }


          }




          //读取第一个检测设备


          strdetection = strdetection +


            `<div class="site-title">


                            <div class="l">


                              <select id="select" style="font-weight: bold;color: #333333;border: none;font-size: 28px;width:96%">`








          staList.forEach(item => {


            strdetection = strdetection + `<option>${item.name}</option>`


          })




          strdetection = strdetection + `</select>


                            </div>


                        </div>


                        <div class="site-date">


                            <div class="site-date-text" id="sitedatetext">


                              ${timeStr}前更新</div>


                        </div>


                        <div class="site-content" id="detectionlist">`


          //遍历检测信息


          var weatherList = staList[0].weatherList;


          if (weatherList.length > 0) {


            weatherList.forEach(item => {


              if (item.name != '监测时间') {


                strdetection = strdetection + `<div class="list">


                                  <div class="l">


                                      <div class="type">${item.name}</div>


                                      <div class="unit">


                                          单位：${item.unit}


                                      </div>


                                  </div>


                                  <div class="r">


                                    ${item.value}


                                  </div>


                              </div>`


              }


            })


          }


        } else {


          strdetection = strdetection + `


                        <div class="site-content">`


        }




        var str11 = `</div>


                    </div>


                </div>


            </div>


        </div>




        <div class="zz model-box">


            <div class="model-title">


                <div class="l"></div>


                <div class="title">种植环节</div>


                <div class="border"></div>


                <div class="status no">


                    <!-- 去完善 -->


                    <!-- <div>


                  <van-icon style="margin-left: 10px;" color="#EC9144" name="arrow" />


                </div> -->


                </div>


            </div>




            <div class="model-content">




                <div class="msg">


                    <div class="l">


                        <img width="126px" height="126px" src="http://182.106.212.58:8014/assets/images/sy/zz-log.png" />


                    </div>


                    <div class="r">


                        <div>


                            我是基地管理员：


                        </div>


                        <div class="r-b-msg">


                            以下农事操作，是在我的监督下完成


                        </div>




                        <div class="point-to"></div>


                    </div>


                </div>`




        // 种植环节遍历begin


        var str3 = '';


        recordVOList.forEach((item, index) => {


          str3 = str3 + `<div class="record-box">


@@ -986,31 +921,11 @@


                    </div>


                </div>`


        });


        $('#recordBox').append(str3)


        // 种植环节遍历end




        var str4 = `</div>


        </div>




        <div class="sc model-box">


            <div class="model-title">


                <div class="l"></div>


                <div class="title">生产企业</div>


                <div class="border"></div>


                <div class="status no">


                    <!-- 去完善


                <div>


                  <van-icon style="margin-left: 10px;" color="#EC9144" name="arrow" />


                </div> -->


                </div>


            </div>




            <div class="model-content">


                <div class="content-header">


                    ${farm.farmName}


                </div>


                <div class="content-body">


                    <swiper class="swiper" indicator-dots="true" autoplay="true" interval="3000" duration="1000">


                        <block class="swiper-image">`


        var str5 = '';


        //生产企业begin


        var str5 = ''


        var urls = farm.picture.split(",");


        if (urls.length > 0) {


          urls.forEach(item => {


@@ -1019,102 +934,122 @@


                            </swiper-item>`


          })


        }


        var str6 = `</block></swiper>


        $('#swImg').append(str5)


        //生产企业end




                </div>


                <div class="text-intro">


                    ${farm.introduce}


                </div>


                <div class="content-footer">


                </div>


            </div>


        </div>`




        // <div class="btn-grounp">


        //     <div class="l">


        //         <div class="plan">


        //             ${num} %


        //         </div>


        //         <div class="text">


        //             溯源完整度


        //         </div>


        //     </div>


        //     <div class="r">


        //         <van-button bind:click="editTracability" round custom-style="margin-right: 40px; width: 200px; height: 72px; border: 2px solid #5ABF78; background: #fff; color: #5ABF78; font-size: 30px;">编辑溯源</van-button>




        //         <van-button bind:click="submit" round custom-style="width: 200px; height: 72px; border: none; background: #5ABF78; color: #fff; font-size: 30px;">分享</van-button>


        //     </div>


        // </div>




        // var dom = $('.page-main-container');


        dom.empty();


        dom.append(str0 + str1 + str2 + strvedio + str10 + strdetection + str11 + str3 + str4 + str5 + str6);




        var videoBody = document.getElementById('video-body'),


          videoElement = document.getElementById('video-element');




        var slide = false,


          soundWidth = 0;


        var flvPlayer = null;


        //初始化视频配置


        if (flvjs.isSupported()) {


          flvPlayer = flvjs.createPlayer({


            type: 'flv',


            url: window.videoList[0].wssFlv,


            hasAudio: false


          });






          flvPlayer.attachMediaElement(videoElement);


          flvPlayer.load();


        }




        videoElement.style.width = "100%";


        videoElement.style.height = "385px";


        videoElement.style.objectFit = "fill";




        //切换视频


        $('.jksp .content-footer .equi-btn').click(function () {


          var ind = $(this).index()


          window.videoList.some((item, index) => {


            console.log('1112', item, index);


            if (ind == index) {


              //暂停播放数据流


              flvPlayer.pause();


              //取消数据流加载


              flvPlayer.unload();


              //将播放实例从节点中取出


              flvPlayer.detachMediaElement();


              //销毁播放实例


              flvPlayer.destroy();


              //重新创建流实例


              flvPlayer = flvjs.createPlayer({


                type: 'flv',


                url: window.videoList[index].wssFlv,


                hasAudio: false


              });




              flvPlayer.attachMediaElement(videoElement);


              flvPlayer.load();


            }


        // 监控/监测数据begin


        axios.get(


          'https://dev.jxpskj.com:8023/pyh-station/stationAndVideo/queryStationAndVideoInfoData?type=All&landId=' +


          recovery.landId).then(function (res) {


          var staList = res.data.data.staList;


          var vidList = res.data.data.vidList;


          window.detectionList = staList;


          window.videoList = vidList;


          //监控展示


          var ele = document.getElementById("videoElement");


          var player = new WebRtcPlayer(ele);


          var videoUrl = vidList[0].webRtc


          player.Open(videoUrl)


          //监控列表


          var jkBtn = ''


          vidList.forEach((item, index) => {


            jkBtn = jkBtn + `<div class="equi-btn">${item.name}</div>`


          })


        })


          $('#videoFooter').append(jkBtn)


          $('.equi-btn')[0].classList.add('equiBtnOn')




        //检测点下拉切换事件


        $('#select').change(function () {


          var bind = $(this).val()


          window.detectionList.some((e, index) => {


            if (bind == e.name) {


              var detectionlist = document.getElementById("detectionlist");


              //先清空


              detectionlist.innerHTML = "";


              //再追加


              var weatherList = e.weatherList;


              var strdetection = "";


              if (weatherList.length > 0) {


                weatherList.forEach(item => {


                  if (item.name != '监测时间') {


                    strdetection = strdetection + `<div class="list">


          //切换视频


          $('.jksp .content-footer .equi-btn').click(function () {


            for (var i = 0; i < $('.equi-btn').length; i++) {


              $('.equi-btn')[i].classList.remove('equiBtnOn')


            }


            $(this)[0].classList.add('equiBtnOn')


            var btnText = $(this)[0].innerText


            vidList.forEach((item, index) => {


              if (item.name == btnText) {


                var newVideoUrl = item.webRtc


                player.Open(newVideoUrl)


              }


            })


          })


          //监测点


          var jcList = ''


          staList.forEach(item => {


            jcList = jcList + `<option>${item.name}</option>`


          })


          $('#select').append(jcList)


          //更新时间


          var timeStr = ''


          if (staList.length > 0) {


            var sta = staList[0];


            var time = sta.weatherTime;


            //当前时间


            var date = new Date();


            //计算时间差


            var crud = date.getTime() - new Date(time).getTime();


            //计算出相差天数


            var days = Math.floor(crud / (24 * 3600 * 1000))


            timeStr = days + "天";




            if (days == 0) {


              //计算出小时数


              var leave1 = crud % (24 * 3600 * 1000) //计算天数后剩余的毫秒数


              var hours = Math.floor(leave1 / (3600 * 1000))


              timeStr = hours + "小时";




              if (hours == 0) {


                //计算相差分钟数


                var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数


                var minutes = Math.floor(leave2 / (60 * 1000))


                timeStr = minutes + "分钟";




                if (minutes == 0) {


                  //计算相差秒数


                  var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数


                  var seconds = Math.round(leave3 / 1000)


                  timeStr = seconds + "秒";


                }


              }


            }


            timeStr = timeStr + '前更新'


          }


          $('#sitedatetext').text(timeStr)


          //监测数据展示


          var jcStr = ''


          var weatherList = staList[0].weatherList;


          if (weatherList.length > 0) {


            weatherList.forEach(item => {


              if (item.name != '监测时间') {


                jcStr = jcStr + `<div class="list">


                                  <div class="l">


                                      <div class="type">${item.name}</div>


                                      <div class="unit">


                                          单位：${item.unit}


                                      </div>


                                  </div>


                                  <div class="r">


                                    ${item.value}


                                  </div>


                              </div>`


              }


            })


          }


          $('#detectionlist').append(jcStr)


          //检测点下拉切换事件


          $('#select').change(function () {


            var bind = $(this).val()


            window.detectionList.some((e, index) => {


              if (bind == e.name) {


                var detectionlist = document.getElementById("detectionlist");


                //先清空


                detectionlist.innerHTML = "";


                //再追加


                var weatherList = e.weatherList;


                var strdetection = "";


                if (weatherList.length > 0) {


                  weatherList.forEach(item => {


                    if (item.name != '监测时间') {


                      strdetection = strdetection + `<div class="list">


                                      <div class="l">


                                          <div class="type">${item.name}</div>


                                          <div class="unit">


@@ -1125,59 +1060,62 @@


                                        ${item.value}


                                      </div>


                                  </div>`


                  }


                })


              }


              detectionlist.innerHTML = strdetection;


                    }


                  })


                }


                detectionlist.innerHTML = strdetection;




              //更新时间替换


              var sitedatetext = document.getElementById("sitedatetext");


              //先清空


              sitedatetext.innerHTML = "";


              var timeStr = '';


              var time = e.weatherTime;


              //当前时间


              var date = new Date();


              //计算时间差


              var crud = date.getTime() - new Date(time).getTime();


              //计算出相差天数


              var days = Math.floor(crud / (24 * 3600 * 1000))


              timeStr = days + "天";


                //更新时间替换


                var sitedatetext = document.getElementById("sitedatetext");


                //先清空


                sitedatetext.innerHTML = "";


                var timeStr = '';


                var time = e.weatherTime;


                //当前时间


                var date = new Date();


                //计算时间差


                var crud = date.getTime() - new Date(time).getTime();


                //计算出相差天数


                var days = Math.floor(crud / (24 * 3600 * 1000))


                timeStr = days + "天";




              if (days == 0) {


                //计算出小时数


                var leave1 = crud % (24 * 3600 * 1000) //计算天数后剩余的毫秒数


                var hours = Math.floor(leave1 / (3600 * 1000))


                timeStr = hours + "小时";


                if (days == 0) {


                  //计算出小时数


                  var leave1 = crud % (24 * 3600 * 1000) //计算天数后剩余的毫秒数


                  var hours = Math.floor(leave1 / (3600 * 1000))


                  timeStr = hours + "小时";




                if (hours == 0) {


                  //计算相差分钟数


                  var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数


                  var minutes = Math.floor(leave2 / (60 * 1000))


                  timeStr = minutes + "分钟";


                  if (hours == 0) {


                    //计算相差分钟数


                    var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数


                    var minutes = Math.floor(leave2 / (60 * 1000))


                    timeStr = minutes + "分钟";




                  if (minutes == 0) {


                    //计算相差秒数


                    var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数


                    var seconds = Math.round(leave3 / 1000)


                    timeStr = seconds + "秒";


                    if (minutes == 0) {


                      //计算相差秒数


                      var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数


                      var seconds = Math.round(leave3 / 1000)


                      timeStr = seconds + "秒";


                    }


                  }


                }


              }


              //填充时间参数


              sitedatetext.innerHTML = `<div class="site-date-text" id="sitedatetext">


                //填充时间参数


                if (time != null) {


                  sitedatetext.innerHTML = `<div class="site-date-text" id="sitedatetext">


                                ${timeStr}前更新</div>`;


            }


                } else {


                  sitedatetext.innerHTML = '暂无数据'


                }




              }


            })


          })




        })


      });


    });


        // 监控/监测数据end


      })


  })




  </script>




  <script>




  </script>


</body>


</script>




</html>