Parcourir la source

水上客运相关功能开发

sbj il y a 1 an
Parent
commit
b48b784c02
5 fichiers modifiés avec 173 ajouts et 68 suppressions
  1. 8 0
      src/apis/ssky.js
  2. 22 5
      src/utils/map/ArcgisUtil.js
  3. 57 6
      src/utils/map/Boat.js
  4. 74 38
      src/utils/map/WaterPassenger.js
  5. 12 19
      src/views/map/Index.vue

+ 8 - 0
src/apis/ssky.js

@@ -72,3 +72,11 @@ export function GetPjylLinePaths() {
     method: "post"
   })
 }
+
+export function GetWaterFlightPoints(data) {
+  return request({
+    url: '/DigitalTwain/PassengerTraffic/getWaterFlightPoints',
+    method: "post",
+    data:data
+  })
+}

+ 22 - 5
src/utils/map/ArcgisUtil.js

@@ -82,14 +82,30 @@ export function addBoats(boats){
         "time": "2021/1/18 10:07:19"
     }
 ]*/
-export function addBoatHistory(datas){
+export function setBoatHistory(datas){
     let params = {
-        "ActionName": "AddBoatHistory",
+        "ActionName": "SetBoatHistory",
         "Parameters": {
             "data":datas
         }
     };
-    console.log("addBoatHistory参数:",params)
+    bridge.Invoke(params);
+}
+
+/**
+ * 开始:start,
+ * 暂停:pause,
+ * 继续:resume,
+ * 停止:stop
+ * @param type
+ */
+export function playBoatHistory(type){
+    let params = {
+        "ActionName": "PlayBoatHistory",
+        "Parameters": {
+            "status": type
+        }
+    };
     bridge.Invoke(params);
 }
 
@@ -148,9 +164,10 @@ export function layerQuery(paramData){
                 return
             }
             // 回调函数
-            if(paramData.callback != null){
-                // this.$emit(paramData.callback, arg.data);
+            if(paramData.callback == 'pjylPortHandle'){
                 this.pjylPortHandle(arg)
+            }else if(paramData.callback == 'djldPortHandle'){
+                this.djldPortHandle(arg)
             }
         }
     });

+ 57 - 6
src/utils/map/Boat.js

@@ -3,15 +3,44 @@
  */
 import { fullExtent, clearMap, calculation, changeMap, setCamera,
     layerControl, layerQuery, addGraphic, draw, getDrawGeometry,
-    addBoats, addBoatHistory
+    addBoats, setBoatHistory, playBoatHistory
 } from '@/utils/map/ArcgisUtil'
 import {GetHpjShip} from "@/apis/ship";
 
 let boatInterval;
 let showBoat = false;
 
+// 船舶定位
+export function locationBoat(mmsi){
+    GetHpjShip().then(res=>{
+        let data = res.Result.data
+        let boats = {
+            "scale": 5000,
+            "goto": false,
+            "data": []
+        }
+        for(let i=0;i<data.length;i++){
+            if(data[i].DEVICEID == mmsi){
+                let boat = {
+                    "mmsi": data[i].DEVICEID,
+                    "shipNameCn": data[i].BOATNAME,
+                    "shipTypeName": data[i].SHIPTYPENAME,
+                    "direction": data[i].DIRECTION,
+                    "velocity": data[i].VELOCITY,
+                    "shipBreadth": data[i].SHIPBREADTH,
+                    "shipLength": data[i].SHIPLENGTH,
+                    "mapx": data[i].MAPX,
+                    "mapy": data[i].MAPY
+                }
+                boats.data.push(boat)
+            }
+        }
+        addBoats(boats)
+    })
+}
+
 // 船舶撒点
-export function setShip(){
+export function setBoat(){
     if(!showBoat)
         showBoat = true
     onLocationBoat()
@@ -22,7 +51,7 @@ export function setShip(){
 }
 
 // 加载船舶
-export function onLocationBoat(){
+function onLocationBoat(){
     GetHpjShip().then(res=>{
         let data = res.Result.data
         let boats = {
@@ -49,12 +78,34 @@ export function onLocationBoat(){
 }
 
 // 设置船舶历史轨迹
-export function setShipPath(data){
+export function setBoatPath(data){
     GetBoatAISHistoryByMMSI({
         deviceId:data.mmsi,
         startTime:data.startTime,
         endTime:data.endTime
-    }).then(
+    }).then(res=>{
+        let data = res.Result.data
+        let historyPoints=[]
+        for(let i=0;i<data.length;i++){
+            let boat = {
+                "gpsTime": data[i].GPSTIME,
+                "mapx": data[i].MAPX,
+                "mapy": data[i].MAPY
+            }
+            historyPoints.push(boat)
+        }
+        setBoatHistory(historyPoints)
+    })
+}
 
-    )
+/**
+ * 船舶轨迹播放
+ * 开始:start,
+ * 暂停:pause,
+ * 继续:resume,
+ * 停止:stop
+ * @param type
+ */
+export function playBoatHistoryPath(type) {
+    this.playBoatHistory(type)
 }

+ 74 - 38
src/utils/map/WaterPassenger.js

@@ -6,11 +6,7 @@ import { fullExtent, clearMap, calculation, changeMap, setCamera,
     addBoats, addBoatHistory
 } from '@/utils/map/ArcgisUtil'
 
-import {GetPjylLinePaths} from "@/apis/ssky";
-import {GetHpjShip} from "@/apis/ship";
-
-let showBoat = false;
-let djldInterval;
+import {GetPjylLinePaths, GetWaterFlightPoints} from "@/apis/ssky";
 
 // 浦江游览航线
 export function pjylLine(){
@@ -54,9 +50,8 @@ export function pjylLine(){
     })
 }
 
-// 浦江游览
 // 浦江游览码头定位
-export function pjylPortLocation(data){
+export function onePjylPortLocation(data){
     // 码头定位
     let param = {
         title: data.portName,
@@ -89,7 +84,6 @@ export function pjylPortLocation(data){
 // 浦江游览码头查询回调
 export function pjylPortHandle(res) {
     let data = res.data[0].geometry.rings[0]
-    console.log("浦江游览码头回调结果:"+data)
     let params = {
         type: 'line-3d',
         data: data,
@@ -103,41 +97,83 @@ export function pjylPortHandle(res) {
     addGraphic(params)
 }
 
-// 对江轮渡船舶撒点
-export function djldShip(){
-    if(!showBoat)
-        showBoat = true
-    onLocationDjldBoat()
-    if(djldInterval!=null){
-        clearInterval(djldInterval)
+// 对江轮渡码头定位
+export function oneDjldPortLocation(data){
+    // 码头定位
+    let param = {
+        title: data.portName,
+        type: 'point',
+        data:[data.mapx,data.mapy,20],
+        edit: false,
+        temp: true,
+        clear: false,
+        goto: true,
+        attributes: null,
+        symbol:{
+            "type": "picture-marker",
+            "url": "images/ssky/bgImgPort.png",
+            "width":"300px",
+            "height":"10px"
+        }
     }
-    djldInterval = setInterval(onLocationDjldBoat,10000)
+    addGraphic(param)
+    // 绘制陆域围栏
+    layerQuery({
+        title: "waterPassenger",
+        layerId: "1",
+        where: "码头名称='" + data.portName +"'",
+        symbol: null,
+        is_draw: true,
+        is_clear: false,
+        callback: "djldPortHandle"
+    })
 }
 
-export function onLocationDjldBoat(){
-    GetHpjShip().then(res=>{
-        let data = res.Result.data
-        let boats = {
-            "scale": 5000,
-            "goto": false,
-            "data": []
-        }
-        for(let i=0;i<data.length;i++){
-            if(data[i].LINETYPE == 'djld'){
-                let boat = {
-                    "mmsi": data[i].DEVICEID,
-                    "shipNameCn": data[i].BOATNAME,
-                    "shipTypeName": data[i].SHIPTYPENAME,
-                    "direction": data[i].DIRECTION,
-                    "velocity": data[i].VELOCITY,
-                    "shipBreadth": data[i].SHIPBREADTH,
-                    "shipLength": data[i].SHIPLENGTH,
-                    "mapx": data[i].MAPX,
-                    "mapy": data[i].MAPY
+// 浦江游览码头查询回调
+export function djldPortHandle(res) {
+    let data = res.data[0].geometry.rings[0]
+    let params = {
+        type: 'line-3d',
+        data: data,
+        edit: false,
+        temp: true,
+        clear: false,
+        goto: true,
+        attributes: null,
+        title: null
+    }
+    addGraphic(params)
+}
+
+// 对江轮渡航线
+export function djldLine(lineName){
+    GetWaterFlightPoints({lineName:lineName}).then(res=>{
+        let rows = res.data.Rows;
+        for (let i=0;i<rows.length;i++){
+            let lineData = rows[i]
+            let linePoints = lineData.linePoint[0]
+            let points = []
+            for(let j=0;j<linePoints.length;j++){
+                let point = [Number(linePoints[j].x),Number(linePoints[j].y)]
+                points.push(point)
+            }
+            let params = {
+                title: lineName,
+                type: 'polyline',
+                data: points,
+                edit: false,
+                temp: true,
+                clear: false,
+                goto: true,
+                attributes: null,
+                symbol: {
+                    type: "simple-line",
+                    color: [255, 0, 0],
+                    width: 2
                 }
-                boats.data.push(boat)
             }
+            // 绘制到地图上
+            addGraphic(params)
         }
-        addBoats(boats)
     })
 }

+ 12 - 19
src/views/map/Index.vue

@@ -8,18 +8,17 @@
             <button @click="clearMap()">清除</button>
             <button @click="test('浦江游览码头')">浦江游览码头</button>
             <button @click="test('浦江游览航线')">浦江游览航线</button>
-            <button @click="test('对江轮渡船舶')">对江轮渡船舶</button>
+            <button @click="test('对江轮渡航线')">对江轮渡航线</button>
             <button @click="test('船舶撒点')">船舶撒点</button>
+            <button @click="test('船舶定位')">船舶定位</button>
         </div>
     </div>
 </template>
 
 <script>
     import {initBridge,fullExtent,calculation,clearMap} from "@/utils/map/ArcgisUtil"
-    import {pjylLine, djldShip, pjylPortLocation} from '@/utils/map/WaterPassenger'
-    import {setShip, setShipPath, onLocationBoat} from '@/utils/map/Boat'
-    import {GetPjylLinePaths} from "@/apis/ssky";
-    import {GetHpjShip} from "@/apis/ship";
+    import {pjylLine, djldLine} from '@/utils/map/WaterPassenger'
+    import {setBoat, setBoatPath, onLocationBoat, locationBoat} from '@/utils/map/Boat'
 
     export default {
         name: "MapHome",
@@ -37,7 +36,7 @@
         methods:{
             fullExtent(){fullExtent()},
             calculation(type){calculation(type)},
-            clearMap(){clearMap},
+            clearMap(){clearMap()},
             // 测试方法
             test(value){
                 switch (value) {
@@ -51,24 +50,18 @@
                     case '浦江游览航线':
                         pjylLine()
                         break
-                    case '对江轮渡船舶':
-                        djldShip()
+                    case '对江轮渡航线':
+                        djldLine('歇宁线')
                         break
                     case '船舶撒点':
-                        setShip()
+                        setBoat()
                         break
                     case '船舶轨迹':
-                        setShipPath()
+                        setBoatPath()
                         break
-/*                    case '开始':
-                        startPlayPath()
+                    case '船舶定位':
+                        locationBoat('413810782')
                         break
-                    case '暂停':
-                        pasePlayPath()
-                        break
-                    case '结束':
-                        endPlayPath()
-                        break*/
                 }
             },
         }
@@ -83,7 +76,7 @@
     }
 
     #tool_div {
-        display: block;
+        display: none;
         background-color: #cccccc;
         z-index: 10;
         position: absolute;