3.26

src/apis/other.js

@@ -43,4 +43,15 @@ export function GetWaterLevel(startTime, endTime, deviceId='100768') {
         deviceId
       },
   })
+}
+
+export function GetTideHeight(startTime, endTime) {
+  return request({
+      url: 'http://10.83.68.108:8091/ghjgWebServiceTest/ghjg/waterLevelData/getTide',
+      method: "post",
+      data: {
+        startTime,
+        endTime
+      },
+  })
 }

src/assets/styles/common.scss

@@ -293,3 +293,9 @@
     }
   }
 }
+
+// 禁用的按钮
+.btn-disabled {
+  cursor: not-allowed;
+  filter: brightness(0.7);
+}

src/components/UeVideo.vue

@@ -81,6 +81,15 @@ export default {
             case 'click_shujun':
               bus.emit('ueRec_ClickShujun',dataObj.data)
               break
+            case 'run_shujun':
+              bus.emit('ueRec_RunShujun',dataObj.data)
+              break
+            case 'back_shujun':
+              bus.emit('ueRec_BackShujun',dataObj.data)
+              break
+            case 'history_run':
+              bus.emit('ueRec_HistoryRun',dataObj.data)
+              break
 
           }
 

src/echarts/options.js

@@ -670,22 +670,22 @@ export function setWaterLevel(ele, dataIn) {
 	let option = {
 		backgroundColor: 'transparent',
 		tooltip: {
-			show: false,
-			// trigger: 'axis',
-			// borderColor: "#092B46",
-			// backgroundColor: "#092B46",
-			// textStyle: {
-			// 	color: "#ddd",
-			// 	fontSize: nowSize(12),
-			// 	align: 'left'
-			// }
+			// show: false,
+			trigger: 'axis',
+			borderColor: "#092B46",
+			backgroundColor: "#092B46",
+			textStyle: {
+				color: "#ddd",
+				fontSize: nowSize(12),
+				align: 'left'
+			}
 		},
 		grid: {
 			containLabel: true,
-			top: '5%',
+			top: '10%',
 			left: '3%',
 			right: '5%',
-			bottom: '5%',
+			bottom: '2%',
 		},
 		xAxis: [
 			{
@@ -695,10 +695,11 @@ export function setWaterLevel(ele, dataIn) {
 				},
 				axisLabel: {
 					show: true,
+					margin: nowSize(20),
 					color: '#ddd',
 					fontSize: nowSize(12),
 					formatter: function(val) {
-						return val.slice(5,16)
+						return val.slice(5)
 					}
 				},
 				splitLine: {
@@ -713,6 +714,7 @@ export function setWaterLevel(ele, dataIn) {
 		],
 		yAxis: [
 			{
+				name: '(cm)',
 				splitLine: {
 					show: true,
 					lineStyle: {
@@ -779,7 +781,7 @@ export function setWaterLevel(ele, dataIn) {
 
 let onTimeRate = null
 export function setOnTimeRate(ele, dataIn) {
-	if (waterLevel) {
+	if (onTimeRate) {
 		onTimeRate.dispose()
 	}
 	let rate

src/utils/UIInteractions.js

@@ -441,9 +441,15 @@ export function ueCallBackShujun() {    // 疏浚船舶回头
   })
 }
 
+export function ueCallClearShujun() {    // 疏浚船舶回头
+  callUIInteractionFormat({
+    "ActionName":"clear_shujun"
+  })
+}
+
 export function ueCallBeforeShujun() {    // 疏浚前效果
   callUIInteractionFormat({
-    "ActionName":"berfore_shujun"
+    "ActionName":"before_shujun"
   })
 }
 
@@ -458,3 +464,32 @@ export function ueCallInitWaterShujun() {    // 清除疏浚效果
     "ActionName":"init_water_shujun"
   })
 }
+
+export function ueCallHistoryRun(routTypeId, mmsi, startTime) {    // 模拟历史航班
+  callUIInteractionFormat({
+    "ActionName":"history_run",
+    "Parameters":{
+      routTypeId,
+      mmsi,
+      startTime
+    }
+  })
+}
+
+export function ueCallHistoryStop() {    // 模拟历史航班暂停
+  callUIInteractionFormat({
+    "ActionName":"history_stop"
+  })
+}
+
+export function ueCallHistoryAgain() {    // 模拟历史航班继续
+  callUIInteractionFormat({
+    "ActionName":"history_again"
+  })
+}
+
+export function ueCallHistoryClear() {    // 清除模拟历史航班
+  callUIInteractionFormat({
+    "ActionName":"history_clear"
+  })
+}

src/views/hdsj/Index.vue

@@ -60,10 +60,10 @@
           </div>
         </div>
         <div class="part2">
-          <div @click="ueCallBeforeShujun">
+          <div @click="toggleShujunState('before')" :class="{'highlight': shujunState==='before'}">
             <span class="text-emp1">疏浚前</span><span>地形</span>
           </div>
-          <div @click="ueCallAfterShujun">
+          <div @click="toggleShujunState('after')" :class="{'highlight': shujunState==='after'}">
             <span class="text-emp2">疏浚后</span><span>地形</span>
           </div>
         </div>
@@ -73,8 +73,8 @@
         <div id="chart_fstj" v-show="!fstjListShow"></div>
         <div class="fstj-list table-carousel" v-show="fstjListShow">
           <div class="fl-btns">
-            <i class="flb-play" @click="ueCallInitShujun"></i>
-            <i class="flb-back" @click="fstjListShow = false"></i>
+            <i class="flb-play" @click="handlePlaySjByDay"></i>
+            <i class="flb-back" @click="handleCloseList"></i>
           </div>
           <div class="head coloumn">
             <span>挖泥船</span><span>运泥船</span><span>运量</span><span>时间</span>
@@ -136,7 +136,7 @@ export default {
   import { GetBoatNum, GetFstj, GetFstjByDay, GetYjWarning } from '@/apis/hdsj'
   import { useDateFormat } from '@vueuse/core';
   import {
-    ueCallInitShujun, ueCallClickShujun, ueCallRunShujun, ueCallBeforeShujun, ueCallAfterShujun
+    ueCallInitShujun, ueCallClickShujun, ueCallRunShujun, ueCallBeforeShujun, ueCallClearShujun, ueCallAfterShujun, ueCallBackShujun, ueCallInitWaterShujun
   } from '@/utils/UIInteractions'
   import bus from '@/utils/bus';
 
@@ -193,6 +193,20 @@ export default {
     })
   }
 
+  const shujunState = ref(null)
+  function toggleShujunState(type) {
+    if(type===shujunState.value) {
+      shujunState.value = null
+      ueCallInitWaterShujun()
+    }else {
+      if(type==='before') {
+        ueCallBeforeShujun()
+      } else if(type==='after') {
+        ueCallAfterShujun()
+      }
+      shujunState.value = type
+    }
+  }
   
   const chartData_fstj = reactive({value: [
     { TIME: '-/-', TOTAL: 0, SUM: 0 },
@@ -225,9 +239,29 @@ export default {
 
   const fstjCurrentId = ref('')
 
+  const shujunRunTime = ref(1)
+
   function handlePickFstjCurrent(item) {
-    fstjCurrentId.value = item.ID
-    ueCallInitShujun()
+    ueCallClearShujun()
+    setTimeout(() => {
+      fstjCurrentId.value = item.ID
+      shujunRunTime.value = 1
+      ueCallInitShujun()
+    }, 1000);
+  }
+
+  function handlePlaySjByDay() {
+    ueCallClearShujun()
+    setTimeout(() => {
+      fstjCurrentId.value = ''
+      shujunRunTime.value = fstjListData.value.length
+      ueCallInitShujun()
+    }, 1000);
+  }
+
+  function handleCloseList() {
+    fstjListShow.value = false
+    ueCallClearShujun()
   }
 
   bus.on('ueRec_InitShujun', (data) => {
@@ -239,6 +273,20 @@ export default {
   bus.on('ueRec_ClickShujun', (data) => {
     if(data.isOk=='true') {
       ueCallRunShujun()
+      shujunRunTime.value -= 1
+    }
+  })
+
+  bus.on('ueRec_RunShujun', (data) => {
+    if(data.isOk=='true' && shujunRunTime.value>0) {
+      ueCallBackShujun()
+    }
+  })
+
+  bus.on('ueRec_BackShujun', (data) => {
+    if(data.isOk=='true' && shujunRunTime.value>0) {
+      ueCallRunShujun()
+      shujunRunTime.value -= 1
     }
   })
   
@@ -258,6 +306,9 @@ export default {
   onBeforeUnmount(() => {
     bus.off('ueRec_InitShujun')
     bus.off('ueRec_ClickShujun')
+    bus.off('ueRec_RunShujun')
+    bus.off('ueRec_BackShujun')
+    ueCallClearShujun()
   })
 </script>
 
@@ -558,6 +609,10 @@ export default {
         .text-emp2 {
           color: #46c6fe;
         }
+        &.highlight {
+          filter: brightness(130%);
+          transform: scale(1.1);
+        }
       }
     }
   }

src/views/home/cpns/WaterLevel.vue

@@ -60,7 +60,7 @@ import 'element-plus/es/components/date-picker/style/css'
 import {
   ueCallQueryWater, ueCallPlayWater, ueCallStopWater, ueCallContinueWater, ueCallResetWater, ueCallSetWaterSpeed, ueCallFlyToSW
 } from '@/utils/UIInteractions'
-import { GetWaterLevel } from '@/apis/other'
+import { GetTideHeight } from '@/apis/other'
 import { setWaterLevel } from '@/echarts/options'
 
 onMounted(() => {
@@ -108,18 +108,18 @@ function handlePickTime() {
         }
       })
     } */
-    GetWaterLevel(timeRange.time1, timeRange.time2).then(res => {
+    GetTideHeight(timeRange.time1, timeRange.time2).then(res => {
       chartData.value = []
       if(res.data?.Rows.length>0) {
         playState.value = 0
         let currentMax = 0
         res.data.Rows.forEach(row => {
-          if(+row.b1 > currentMax) {
-            currentMax = row.b1
+          if(+row.tide > currentMax) {
+            currentMax = row.tide
           }
           chartData.value.push({
-            time: row.wtime,
-            value: row.b1
+            time: row.time+ ':00',
+            value: row.tide
           })
         })
         chartSta.currentMax = currentMax + 'cm'
@@ -214,10 +214,6 @@ function water_resume() {
     font-size: 18px;
     font-family: YSBTH;
     color: #a9c1d8;
-    &.btn-disabled {
-      filter: brightness(0.5);
-      cursor: not-allowed;
-    }
   }
 
   :deep(.date-picker-custom1) {

src/views/home/cpns/boatPanel/BoatDjld.vue

@@ -237,10 +237,6 @@ export default {
       line-height: 30px;
       cursor: pointer;
     }
-    .btn-disabled {
-      cursor: not-allowed;
-      filter: brightness(0.7);
-    }
   }
 }
 

src/views/home/cpns/boatPanel/BoatPjyl.vue

@@ -83,14 +83,27 @@
         <span>{{ formatIndex(index+1) }}</span>
         <div>
           <div>
-            <span>{{ item.routeType }}</span><span>{{ item.routeTime }}</span><span @click="historyPreview(item)">预览</span>
+            <div>
+              <span>{{ item.routeType }}</span>
+              <span>{{ item.routeTime }}</span>
+            </div>
+            <template v-if="historyCurrent===null || historyCurrent===index">
+              <span class="cl-btn" :class="{'btn-disabled': historyState===-1}" v-show="historyState<1" @click="history_play(item,index)">预览</span>
+              <span class="cl-btn" v-show="historyState===1||historyState===2" @click="history_stop">停止</span>
+            </template>
           </div>
           <div>
-            <span>售票数</span>
-            <span>{{ item.saleNum }}</span>
-            <i></i>
-            <span>登船数</span>
-            <span>{{ item.checkNum }}</span>
+            <div>
+              <span>售票数</span>
+              <span>{{ item.saleNum }}</span>
+              <i></i>
+              <span>登船数</span>
+              <span>{{ item.checkNum }}</span>
+            </div>
+            <template v-if="historyCurrent===index">
+              <span class="cl-btn" v-show="historyState===1" @click="history_pause">暂停</span>
+              <span class="cl-btn" v-show="historyState===2" @click="history_resume">继续</span>
+            </template>
           </div>
         </div>
       </li>
@@ -113,7 +126,7 @@ export default {
   import { 
     ueCallBoatGuiji, ueCallSetBoatDriveSpeed, ueCallBoatDrive, ueCallBoatCloseDrive, ueCallBoatStop, ueCallBoatContinue,
     ueCallInitAll, ueCallFindJinghua, ueCallRunJinghua, ueCallRunOpJinghua, ueCallFindZhuanhang, ueCallRunZhuanhang, ueCallRunOpZhuanhang,
-    ueCallChangeTime, ueCallChangeTrackType
+    ueCallChangeTrackType, ueCallHistoryRun, ueCallHistoryStop, ueCallHistoryAgain, ueCallHistoryClear
   } from '@/utils/UIInteractions'
   import { useDateFormat } from '@vueuse/core'
   
@@ -227,13 +240,38 @@ export default {
     return index.toString().padStart(2, '0')
   }
 
-  function historyPreview(item) {
-    ueCallChangeTime(+item.routeTime.slice(11,13))
-    setTimeout(() => {
-      currentTab.value = 'cbxx'
-      toggleBottom('preview')
-    }, 500);
+  const historyState = ref(0)  /* 0--未开始/已结束； 1--播放中； 2--已暂停; -1--禁用状态 */
+  const historyCurrent = ref(null)
+
+  bus.on('ueRec_HistoryRun', (data) => {
+    if(data.isOk=='true') {
+      historyState.value=1
+    }
+  })
+
+  function history_play(item,index) {
+    if(previewState.value===-1) { return }
+    historyCurrent.value = index
+    historyState.value = -1
+    ueCallHistoryRun(item.routeTypeId, item.mmsi, item.routeTime.slice(0,10)+'%20'+item.routeTime.slice(11))
+  }
+
+  function history_pause() {
+    ueCallHistoryStop()
+    historyState.value = 2
   }
+
+  function history_resume() {
+    ueCallHistoryAgain()
+    historyState.value = 1
+  }
+
+  function history_stop() {
+    ueCallHistoryClear()
+    historyState.value = 0
+    historyCurrent.value = null
+  }
+
   
   watch(()=>props.boatInfo.mmsi, (val) => {
     GetLshb(val).then(res => {
@@ -253,8 +291,10 @@ export default {
     bus.off('ueRec_boatGuiji')
     bus.off('ueRec_boatFockClear')
     bus.off('ueRec_pujiangInit')
+    bus.off('ueRec_HistoryRun')
     // ueCallInitAll()
     ueCallBoatCloseDrive()
+    ueCallHistoryClear()
   })
 
 
@@ -362,54 +402,67 @@ export default {
       }
       &>div {
         flex: 1;
+        .cl-btn {
+          display: block;
+          width: 55px;
+          height: 20px;
+          font-size: 13px;
+          font-style: italic;
+          color: #FFFFFF;
+          line-height: 20px;
+          text-align: center;
+          background: url('@/assets/imgs/page_ssky/bg-btn-blue.png');
+          background-size: contain;
+          cursor: pointer;
+        }
         &>div:first-child {
           display: flex;
           justify-content: space-between;
           align-items: center;
-          &>span:nth-child(1) {
-            font-size: 14px;
-            font-weight: bold;
-            color: #FBFDFF;
-          }
-          &>span:nth-child(2) {
-            font-size: 14px;
-            font-family: Barlow;
-            color: rgba($color: #FBFDFF, $alpha: 0.6);
-          }
-          &>span:nth-child(3) {
-            display: block;
-            width: 55px;
-            height: 20px;
-            font-size: 13px;
-            font-style: italic;
-            color: #FFFFFF;
-            line-height: 20px;
-            text-align: center;
-            background: url('@/assets/imgs/page_ssky/bg-btn-blue.png');
-            background-size: contain;
-            cursor: pointer;
+          height: 20px;
+          &>div {
+            display: flex;
+            align-items: center;
+            &>span:nth-child(1) {
+              font-size: 14px;
+              font-weight: bold;
+              color: #FBFDFF;
+            }
+            &>span:nth-child(2) {
+              margin-left: 10px;
+              font-size: 14px;
+              font-family: Barlow;
+              color: rgba($color: #FBFDFF, $alpha: 0.6);
+            }
           }
         }
         &>div:last-child {
           display: flex;
+          justify-content: space-between;
           align-items: center;
           margin-top: 8px;
-          &>span:nth-child(1), &>span:nth-child(4) {
-            margin-right: 7px;
-            font-size: 14px;
-            color: #FBFDFF;
-          }
-          &>span:nth-child(2), &>span:nth-child(5) {
-            font-size: 14px;
-            font-family: Barlow;
-            color: #FFEA00;
-          }
-          &>i:nth-child(3) {
-            display: block;
-            height: 12px;
-            border-right: 1px dashed #ddd;
-            margin: 0 6px 0 20px;
+          height: 20px;
+          &>div {
+            display: flex;
+            align-items: center;
+            &>span:nth-child(1), &>span:nth-child(4) {
+              margin-right: 7px;
+              font-size: 14px;
+              color: #FBFDFF;
+            }
+            &>span:nth-child(2), &>span:nth-child(5) {
+              font-size: 14px;
+              font-family: Barlow;
+              color: #FFEA00;
+            }
+            &>i:nth-child(3) {
+              display: block;
+              height: 12px;
+              border-right: 1px dashed #ddd;
+              margin: 0 6px 0 20px;
+            }
           }
+          
         }
       }
     }
@@ -438,10 +491,6 @@ export default {
       line-height: 30px;
       cursor: pointer;
     }
-    .btn-disabled {
-      cursor: not-allowed;
-      filter: brightness(0.7);
-    }
   }
 }
 

src/views/home/cpns/boatPanel/Index.vue

@@ -198,10 +198,6 @@ function handleClose() {
       line-height: 30px;
       cursor: pointer;
     }
-    .btn-disabled {
-      cursor: not-allowed;
-      filter: brightness(0.7);
-    }
   }
 }