Merge branch 'master' of http://221.182.8.141:11666/chenlong/xx_sw_dp into newDp

src/components/Dialog/mapDialog.vue

@@ -71,8 +71,8 @@
                       <ul class="collapse-ul">
                         <li :class="''" v-for="(it, index2) in item.value" :key="it.senid"
                           @click="setTabColor2(it, index, index2)">{{
-        it.sensor_name
-      }}</li>
+                            it.sensor_name
+                          }}</li>
                       </ul>
                     </a-collapse-panel>
                     <!-- <a-collapse-panel key="2" header="4m 灌木层" :style="activeMenu.customStyle">
@@ -111,18 +111,21 @@
                     </a-radio-group>
                     <div>
                       <a-range-picker :disabled-date="disabledDate" v-model:value="searchTime"
-                        valueFormat="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD HH:mm" :placeholder="['开始时间', '结束时间']" />
+                        valueFormat="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD HH:mm:ss" show-time
+                        :placeholder="['开始时间', '结束时间']" />
                     </div>
                     <div>
                       <a-button type="primary" @click="search(senid, sensor_name, dchar)">开始查询</a-button>
                     </div>
                   </div>
                   <div class="tabp-right-query-echarts" id='ebox' v-show="!showNodata" :style="{
-                    flex:'1',width: '900px',height: '460px',zoom: `${1 / zooms}`, transform: `scale(${zooms})`, transformOrigin: '0 0'}
+                    flex: '1', width: '900px', height: '460px', zoom: `${1 / zooms}`, transform: `scale(${zooms})`, transformOrigin: '0 0'
+                  }
                     ">
                     <div id="query-echarts" :style="{
-                        width: '100%',
-                        height: '100%',}">
+                      width: '100%',
+                      height: '100%',
+                    }">
                     </div>
                   </div>
                   <div v-show="showNodata" style="width: 100%; height: 310px; text-align: center">
@@ -151,17 +154,10 @@
                   :style="activeMenu.customStyle">
                   <ul class="collapse-ul">
                     <li v-for="(it, index2) in item" :key="item.id" @click="setTabColor3(it, index, index2)">{{
-        it.img_name
-      }}</li>
+                      it.img_name
+                      }}</li>
                   </ul>
                 </a-collapse-panel>
-                <!-- <a-collapse-panel key="2" header="监控布置图" :style="activeMenu.customStyle">
-                    <ul class="collapse-ul">
-                      <li>图片1</li>
-                      <li>图片2</li>
-                      <li class="active">图片3</li>
-                    </ul>
-                  </a-collapse-panel> -->
                 <img v-if="imgtree.length == 0" style="width: 160px; margin: 0 auto;" lass="none-data"
                   src="../../assets/images/weatheHome/none-data.png" />
               </a-collapse>
@@ -186,7 +182,7 @@
                   <div><img class="carousel-img" src="../../assets/images/weatheHome/test-img.png" /></div>
                   <div><img class="carousel-img" src="../../assets/images/weatheHome/test-img.png" /></div> -->
               </a-carousel>
-              <img v-if="imgtree.length == 0" style="width: 300px; margin: 0 auto;" lass="none-data"
+              <img v-if="imgList.length == 0" style="width: 300px; margin: 0 auto;" lass="none-data"
                 src="../../assets/images/weatheHome/none-data.png" />
               <div v-if="imgList.length != 0" class="carousel-title">
                 <div style="margin-right: 50px;">{{ imgname }}</div>
@@ -199,20 +195,51 @@
           <template #tab>
             <span> 视频监控 </span>
           </template>
-          <div>
-            <div class="tabp-conetnt">
-              <div class="tabp-conetnt-left">
-                <ul class="collapse-video-ul">
-                  <!-- <li>视频监控名称1</li>
-                  <li>视频监控名称2</li>
-                  <li class="video-active">图片3</li> -->
-                  <img style="width: 160px; margin: 0 auto;" lass="none-data"
-                    src="../../assets/images/weatheHome/none-data.png" />
-                </ul>
-              </div>
-              <div class="tabp-conetnt-right">
-                <!-- <img style="width: 100%" class="carousel-img" src="../../assets/images/weatheHome/test-img.png" /> -->
-                <img class="none-data" src="../../assets/images/weatheHome/none-data.png" />
+          <div class="tabp-conetnt">
+            <div class="tabp-conetnt-left">
+              <a-collapse v-model:activeKey="activeMenu.activeKey" :bordered="false">
+                <template #expandIcon="{ isActive }">
+                  <img class="left-collapse-icon"
+                    :style="{ transform: `rotate(${isActive ? '0' : '-90'}deg)`, marginTop: '-12px' }"
+                    src="../../assets/images/weatheHome/icon-bottom.png" />
+                </template>
+                <a-collapse-panel :key="index + 1" v-for="(item, key, index) in videoTree" :header="key"
+                  :style="activeMenu.customStyle">
+                  <ul class="collapse-ul">
+                    <li v-for="(it, index2) in item" :key="item.id" @click="setTabColor4(it, index, index2)">{{
+                      it.img_name
+                      }}</li>
+                  </ul>
+                </a-collapse-panel>
+                <img v-if="videoTree.length == 0" style="width: 160px; margin: 0 auto;" lass="none-data"
+                  src="../../assets/images/weatheHome/none-data.png" />
+              </a-collapse>
+            </div>
+            <div class="tabp-conetnt-right">
+              <a-carousel arrows style="width:100%;position: absolute;top:0;" :beforeChange="setcolorV" ref="varousel">
+                <template #prevArrow>
+                  <div class="custom-slick-arrow" style="z-index: 9999; left: -30px">
+                    <left-circle-outlined />
+                  </div>
+                </template>
+                <template #nextArrow>
+                  <div class="custom-slick-arrow" style="right: -30px">
+                    <right-circle-outlined />
+                  </div>
+                </template>
+                <div v-for="(item, index) in videoList"><img class="carousel-img"
+                    :src="VITE_GLOB_BASE_IMG + item.img_url" :key="index + 1" /></div>
+                <!-- <div>
+                    <img class="carousel-img" src="../../assets/images/weatheHome/test-img.png" />
+                  </div>
+                  <div><img class="carousel-img" src="../../assets/images/weatheHome/test-img.png" /></div>
+                  <div><img class="carousel-img" src="../../assets/images/weatheHome/test-img.png" /></div> -->
+              </a-carousel>
+              <img v-if="videoList.length == 0" style="width: 300px; margin: 0 auto;" lass="none-data"
+                src="../../assets/images/weatheHome/none-data.png" />
+              <div v-if="videoList.length != 0" class="carousel-title">
+                <div style="margin-right: 50px;">{{ imgname1 }}</div>
+                <div>{{ imgindex1 }} / {{ videoList.length }}</div>
               </div>
             </div>
           </div>
@@ -233,16 +260,16 @@ import $ from 'jquery';
 import eventBus from '/@/utils/eventBus';
 import { getAppEnvConfig } from '/@/utils/env';
 import { addResizeListener } from '/@/utils/event';
-
+import { useDebounceFn } from '@vueuse/shared';
 const { VITE_GLOB_BASE_IMG } = getAppEnvConfig()
 let zooms = ref('')
 eventBus.on('progressHeight', (e) => {
   if (e > 1000 && e < 1200) {
-    setBox(1,e)
+    setBox(1, e)
   } else if (e > 1200) {
-    setBox(2,e)
+    setBox(2, e)
   } else {
-    setBox(3,e)
+    setBox(3, e)
   }
   zooms.value = document.getElementsByClassName("ant-modal")[0].style.zoom
   chart.dispose();
@@ -252,21 +279,21 @@ eventBus.on('progressHeight', (e) => {
   }, 400)
 
 });
-const setBox = (type,e) => {
+const setBox = (type, e) => {
   // alert(e)
-  if(props.detailInfo.st_type == 6){
-    $('#ebox').css({ height: '440px',width:'1000px' })
-    if(type == 3 && e == `calc(100% - 500px)`){
-      $('#ebox').css({ height: '440px',width:'1650px' })
-    }else{
-      $('#ebox').css({ height: '440px',width:'1000px' })
+  if (props.detailInfo.st_type == 6) {
+    $('#ebox').css({ height: '440px', width: '1000px' })
+    if (type == 3 && e == `calc(100% - 500px)`) {
+      $('#ebox').css({ height: '440px', width: '1650px' })
+    } else {
+      $('#ebox').css({ height: '440px', width: '1000px' })
     }
-  }else{
-    $('#ebox').css({ height: '440px',width:'1200px' })
-    if(type == 3 && e == `calc(100% - 500px)`){
-      $('#ebox').css({ height: '440px',width:'1900px' })
-    }else{
-      $('#ebox').css({ height: '440px',width:'1200px' })
+  } else {
+    $('#ebox').css({ height: '440px', width: '1200px' })
+    if (type == 3 && e == `calc(100% - 500px)`) {
+      $('#ebox').css({ height: '440px', width: '1900px' })
+    } else {
+      $('#ebox').css({ height: '440px', width: '1200px' })
     }
   }
 }
@@ -281,26 +308,40 @@ const dchar = ref();
 // 图片展示
 const imgList = ref([])
 const imgtree = ref({})
+const videoList = ref([])
+const videoTree = ref({})
 const imgname = ref('')
 const imgindex = ref(1)
+const imgname1 = ref('')
+const imgindex1 = ref(1)
 watch(
   () => props.detailInfo,
   (newV) => {
+    console.log(newV)
     senid.value = newV.sensor[0].senid;
     sensor_name.value = newV.sensor[0].sensor_name;
     dchar.value = newV.sensor[0].dchar;
     imgList.value = []
+    videoList.value = []
     imgtree.value = []
+    videoTree.value = []
+    // 图片
     if (newV.pic_annex.length > 0) {
-      let arr = newV.pic_annex
-      arr.forEach(i => {
+      console.log('初始数据', newV.pic_annex)
+      let arr1 = JSON.parse(JSON.stringify(newV.pic_annex))
+      arr1.forEach(i => {
         let arr = i.img_url.split('/')
-        i.type = arr[arr.length - 2]
-        i.img_name = arr[arr.length - 1]
+        console.log(i)
+        // i.type = arr[arr.length - 2]
+        let obj = JSON.parse(JSON.stringify(i))
+        i.type = obj.img_name
+        let urlCopy = arr[arr.length - 1]
+        i.img_name = urlCopy.split('.')[0]
+        console.log(i.img_name)
       })
-      imgList.value = arr
+      imgList.value = arr1
       let obj = {}
-      arr.forEach((i, index) => {
+      arr1.forEach((i, index) => {
         i.id = index + 1
         if (obj.hasOwnProperty(i.type)) {
           obj[i.type].push(i);
@@ -311,6 +352,31 @@ watch(
       })
       imgtree.value = obj
     }
+    if (newV.video.length > 0) {
+      console.log('初始数据', newV.video)
+      let arr1 = JSON.parse(JSON.stringify(newV.video))
+      arr1.forEach(i => {
+        let arr = i.img_url.split('/')
+        console.log(i)
+        // i.type = arr[arr.length - 2]
+        let obj = JSON.parse(JSON.stringify(i))
+        i.type = obj.img_name
+        let urlCopy = arr[arr.length - 1]
+        i.img_name = urlCopy.split('.')[0]
+      })
+      videoList.value = arr1
+      let obj = {}
+      arr1.forEach((i, index) => {
+        i.id = index + 1
+        if (obj.hasOwnProperty(i.type)) {
+          obj[i.type].push(i);
+        } else {
+          obj[i.type] = [];
+          obj[i.type].push(i);
+        }
+      })
+      videoTree.value = obj
+    }
     if (newV.st_type == 6) {
       let obj = {};
       newV.sensor?.forEach((i) => {
@@ -372,7 +438,7 @@ const xdata = ref([]);
 const ydata = ref([]);
 const showNodata = ref(false);
 // id,名字,单位
-const search = (id, name, dw) => {
+const search = useDebounceFn((id, name, dw) => {
   senid.value = id;
   sensor_name.value = name;
   dchar.value = dw;
@@ -392,8 +458,8 @@ const search = (id, name, dw) => {
     // props.title.split('（')[0]+
     tableTitle.value = name + '过程线' + '(' + moment(searchTime.value[0]).format('MM月DD日HH时') + '-' + moment(searchTime.value[1]).format('MM月DD日HH时') + ')'
     echarts1();
-  });
-};
+  })
+}, 200)
 
 const disabledDate = (current) => {
   return current > moment().valueOf();
@@ -402,11 +468,21 @@ const changeTab = () => {
 
 }
 const setcolor = (from, to) => {
-  $(`.ant-collapse .ant-collapse-item li`).css({ background: 'transparent' });
-  // console.log(imgList.value,2233)
+  console.log(from)
+  console.log(to)
+  // $(`.ant-collapse .ant-collapse-item li`).css({ background: 'transparent' });
+  // // console.log(imgList.value,2233)
   imgname.value = imgList.value[to].img_name
   imgindex.value = to + 1
 }
+const setcolorV = (from, to) => {
+  console.log(from)
+  console.log(to)
+  // $(`.ant-collapse .ant-collapse-item li`).css({ background: 'transparent' });
+  // // console.log(imgList.value,2233)
+  imgname1.value = videoList.value[to].img_name
+  imgindex1.value = to + 1
+}
 const setTabColor = (item, index) => {
   // console.log(item,87)
   senid.value = item.senid;
@@ -439,6 +515,13 @@ const setTabColor3 = (item, index, index2) => {
   // console.log(senid.value,sensor_name.value,dchar.value)
   varousel.value.goTo(item.id - 1)
 };
+const setTabColor4 = (item, index, index2) => {
+  imgname1.value = item.img_name
+  $(`.ant-collapse .ant-collapse-item li`).css({ background: 'transparent' });
+  $(`.ant-collapse .ant-collapse-item:nth-child(${index + 1}) li:nth-child(${index2 + 1})`).css({ background: 'rgba(0, 94, 182, 0.24)' });
+  // console.log(senid.value,sensor_name.value,dchar.value)
+  varousel.value.goTo(item.id - 1)
+};
 const handleChange = () => {
   searchTime.value = [];
   // console.log(value1.value)
@@ -574,7 +657,7 @@ function echarts1() {
         for (var i = 0, l = params.length; i < l; i++) {
           console.log('tooltip数据值', params[i].value)
           //遍历出来的值一般是字符串，需要转换成数字，再进项tiFixed四舍五入
-          relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + Number(params[i].value)
+          relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + params[i].value
         }
         return relVal;
       },
@@ -660,9 +743,9 @@ function echarts1() {
           if (tableTitle.value.indexOf('水位') != -1) {
             return value.toFixed(2);
           } else if (tableTitle.value.indexOf('流量') != -1) {
-            if(value<100){
+            if (value < 100) {
               return value.toPrecision(3)
-            }else{
+            } else {
               return Number(value.toPrecision(3))
             }
           } else {

src/utils/TFMapUitl.ts

@@ -462,6 +462,9 @@ class TFMapUitl {
     return str + str2 + str3
   }
   setWd(wds) {
+    if(wds == '--'){
+      return wds;
+    }
     let wd = wds*1
     if (wd >= 348.76 || wd <= 11.25) {
       return 'N';

src/views/meteorological/components/monitorEcharts.vue

@@ -40,6 +40,7 @@ import eventBus from '/@/utils/eventBus';
 // 导入图片
 import imgangle from '/@/assets/images/weatheHome/trend-icon.png';
 import screenImg from '/@/assets/images/weatheHome/full-screen-icon.png';
+import level_0 from "/@/assets/svg/level_0.png";
 eventBus.on('monitorRefreshName', () => {
   activeKey.value = '1';
 });
@@ -206,7 +207,11 @@ function echarts2() {
         type: 'shadow',
       },
       formatter: function (params) {
+        // console.log('time',params)
         return `<div>
+            <div>
+              时间：${params[0].axisValueLabel}
+            </div>
             <div>
               风速（m/s）：${params[0].data}
             </div>
@@ -236,10 +241,13 @@ function echarts2() {
     legend: {
       // data: ['风速', '风向'],
       data: ['风速'],
+      symbol:'none',
       textStyle: {
         fontSize: 14, //字体大小
         color: '#ffffff', //字体颜色
       },
+      orient:'horizontal',
+      itemHeight:2
       // itemStyle: {
       //   color: '#fff',
       // },
@@ -330,7 +338,38 @@ function echarts2() {
         data: props.windSpeeCharts.data,
         type: 'line',
         smooth: true,
-        symbol: 'path://M0,0L20,0L20,3L3,3L3,8L20,8L20,11L3,11L3,16L20,16L20,19L3,19L3,40L0,40L0,0Z',
+        // symbol: 'path://M0,0L20,0L20,3L3,3L3,8L20,8L20,11L3,11L3,16L20,16L20,19L3,19L3,40L0,40L0,0Z',
+        symbol: function (params) {
+          console.log('params',params)
+          // 设置不同等级的图标
+          let level0 = 'image://'+ level_0
+          let level1 = 'path://M0,0L20,0L20,3L3,3L3,8L3,8L3,11L3,11L3,16L3,16L3,19L3,19L3,40L0,40L0,0Z'
+          let level2 = 'path://M0,0L20,0L20,3L3,3L3,8L20,8L20,11L3,11L3,16L3,16L3,19L3,19L3,40L0,40L0,0Z'
+          let level3 = 'path://M0,0L20,0L20,3L3,3L3,8L20,8L20,11L3,11L3,16L20,16L20,19L3,19L3,40L0,40L0,0Z'
+          let level4 = 'path://M0,0L20,0L20,3L3,3L3,8L20,8L20,11L3,11L3,16L20,16L20,19L3,19L3,40L0,40L0,0Z'
+          let level5 = 'path://M0,0L20,0L20,3L3,3L3,8L3,8L3,11L3,11L3,16L3,16L3,19L3,19L3,40L0,40L0,0Z'
+          let svgData = ''
+          if(params >= 0 && params <=0.2){
+            svgData = level0
+          }
+          if(params >= 0.3 && params <=3.3){
+            svgData = level1
+          }
+          if(params >= 3.4 && params <=7.9){
+            svgData = level2
+          }
+          if(params >= 8 && params <=13.8){
+            svgData = level3
+          }
+          if(params >= 13.9 && params <=20.7){
+            svgData = level4
+          }
+          if(params >= 20.8){
+            svgData = level5
+          }
+          return svgData
+          
+        },
         symbolSize: 18,
         symbolRotate: (value, params) => {
           return props.windDirection.data[params.dataIndex] * -1;

src/views/prediction/components/predictionA.vue

@@ -150,7 +150,7 @@ function echarts1() {
             color: '#ffffff',
           },
           formatter: function (value) {
-            return value.toFixed(2) + '';
+            return value.toFixed(1) + '';
           },
         },
         nameTextStyle: {
@@ -175,7 +175,11 @@ function echarts1() {
             color: '#ffffff',
           },
           formatter: function (value) {
-            return value + '';
+            if (value < 100) {
+              return value.toPrecision(3)
+            } else {
+              return Number(value.toPrecision(3))
+            }
           },
         },
         nameTextStyle: {

src/views/weatherHome/components/alarm.vue

@@ -90,13 +90,10 @@
         <div class="new-qx-table-box">
           <div v-for="(item, index) in alarmDataBox.activeInfo" :key="index" class="new-police"
             @click="openModal(item)">
-            <div class="time-top">
-                  <!-- <img src="../../../assets/images/weatheHome/icon-5514.png" /> -->
-                  <span :class="{
-        'bg1': item.level_id == 1,
-        'bg2': item.level_id == 2,
-        'bg3': item.level_id == 3,
-        'bg4': item.level_id == 4,
+            <div>
+              <!-- <img src="../../../assets/images/weatheHome/icon-5514.png" /> -->
+              <span :style="{
+        'color': item.level_color
       }">{{ item.title }}</span>
                   <span class="time-box">{{ item.time }}</span>
                 </div>