webSocket取消订阅、订阅发布修改

husq

2023-09-21 67338a9d75216fd17bf5d679e585c21a9f10a451

webSocket取消订阅、订阅发布修改

 package.json

@@ -30,7 +30,8 @@
    "vue-cookies": "^1.7.4",
    "vue-i18n": "^9.1.6",
    "vue-router": "4",
    "vuex": "^4.0.2"
    "vuex": "^4.0.2",
    "vuex-persistedstate": "^4.1.0"
  },
  "devDependencies": {
    "@types/crypto-js": "^4.1.1",

 src/api/http/config.ts

@@ -7,12 +7,12 @@

  // http
  // http://172.16.13.64:8100
  // baseURL: 'http://192.168.1.198:6789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
  baseURL: 'https://dev.jxpskj.com:36789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
  baseURL: 'http://192.168.1.198:6789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
  // baseURL: 'https://dev.jxpskj.com:36789', // This url must end with "/". Example: 'http://192.168.1.1:6789/'
  // ws: 'ws//127.0.0.1:6789/api/v1/ws',
  // ws://192.168.1.198:1883/
  // websocketURL: 'ws://192.168.1.198:6789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
  websocketURL: 'wss://dev.jxpskj.com:36789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
  websocketURL: 'ws://192.168.1.198:6789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'
  // websocketURL: 'wss://dev.jxpskj.com:36789/api/v1/ws', // Example: 'ws://192.168.1.198:6789/api/v1/ws'

  // livestreaming
  // RTMP  Note: This IP is the address of the streaming server. If you want to see livestream on web page, you need to convert the RTMP stream to WebRTC stream.

 src/api/manage.ts

@@ -153,7 +153,16 @@
  const result = await request.delete(url)
  return result.data
}

export const testUnBind = async function (device_sn: string): Promise<IWorkspaceResponse<any>> {
  const url = `${HTTP_PREFIX}/devices/${device_sn}/unsubscribeTopic`
  const result = await request.get(url)
  return result.data
}
export const testBind = async function (device_sn: string): Promise<IWorkspaceResponse<any>> {
  const url = `${HTTP_PREFIX}/devices/${device_sn}/subscribeTopic`
  const result = await request.get(url)
  return result.data
}
export const getDeviceBySn = async function (workspace_id: string, device_sn: string): Promise<IWorkspaceResponse<any>> {
  const url = `${HTTP_PREFIX}/devices/${workspace_id}/devices/${device_sn}`
  const result = await request.get(url)

 src/components/cesiumMap/cesium.vue

@@ -110,7 +110,6 @@
  }
}
onMounted(() => {
  console.log('=====执行=====')
  init()
})
// 销毁地图模型

 src/components/common/sidebar.vue

@@ -28,7 +28,8 @@
import { getRoot } from '/@/root'
import * as icons from '@ant-design/icons-vue'
import { ERouterName } from '/@/types'

import { testUnBind } from '/@/api/manage'
import { useMyStore } from '/@/store'
interface IOptions {
  key: number
  label: string
@@ -60,16 +61,18 @@
      { key: 4, label: '航线库', path: '/' + ERouterName.WAYLINE, icon: 'NodeIndexOutlined' },
      { key: 5, label: '计划库', path: '/' + ERouterName.TASK, icon: 'CalendarOutlined' }
    ]

    const store = useMyStore()
    function selectedRoute (item: IOptions) {
      const path = typeof item.path === 'string' ? item.path : item.path.path
      return root.$route.path?.indexOf(path) === 0
    }

    function goBack () {
    const snList = computed(() => store.state.common.snList)
    async function goBack () {
      snList.value.forEach(async (v: string) => {
        await testUnBind(v)
      })
      root.$router.push('/' + ERouterName.PROJECT_LIST)
    }

    return {
      options,
      selectedRoute,

 src/hooks/use-cesium-tsa.ts

@@ -37,11 +37,12 @@
  // 清除所有标记点
  function removeAllPoint () {
    if (cesiumExample) {
      cesiumExample.entities.removeAll()
      cesiumExample?.entities?.removeAll()
    }
  }
  // 添加标记点
  function addPoint (pointOption:pointOption) {
    if (!pointOption.longitude && !pointOption.latitude) return
    cesiumExample.entities.add({
      position: Cesium.Cartesian3.fromDegrees(pointOption.longitude, pointOption.latitude),
      billboard: pointOption.billboard,
@@ -50,6 +51,7 @@
  }
  // 飞行 flyto
  function flyTo (pointOption:pointOption, time: number = 3) {
    if (!pointOption.longitude && !pointOption.latitude) return
    const destination = Cesium.Cartesian3.fromDegrees(pointOption.longitude, pointOption.latitude, 1000)
    const duration = time
    cesiumExample.camera.flyTo({

 src/pages/page-web/projects/tsa.vue

@@ -247,7 +247,7 @@
import rc from '/@/assets/icons/rc.png'
import { OnlineDevice, EModeCode, OSDVisible, EDockModeCode, DeviceOsd, EDockModeText, EModeText } from '/@/types/device'
import { useMyStore } from '/@/store'
import { getDeviceTopo, getUnreadDeviceHms, updateDeviceHms } from '/@/api/manage'
import { getDeviceTopo, getUnreadDeviceHms, updateDeviceHms, testBind } from '/@/api/manage'
import { RocketOutlined, EyeInvisibleOutlined, EyeOutlined, RobotOutlined, DoubleRightOutlined } from '@ant-design/icons-vue'
import { EHmsLevel } from '/@/types/enums'
import { cesiumOperation } from '/@/hooks/use-cesium-tsa'
@@ -281,10 +281,10 @@
const getResource = (name: string) => {
  return new URL(`/src/assets/icons/${name}`, import.meta.url).href
}
const cesium = cesiumOperation(global.$viewer)
const hasFlownToLocation = ref(false)
// 添加机场标注
watch(() => store.state.deviceState, data => {
  const cesium = cesiumOperation(global.$viewer)
  cesium.removeAllPoint()
  if (data.currentType === EDeviceTypeName.Gateway && data.gatewayInfo[data.currentSn]) {
    // deviceTsaUpdateHook.moveTo(data.currentSn, data.gatewayInfo[data.currentSn].longitude, data.gatewayInfo[data.currentSn].latitude)
@@ -310,8 +310,8 @@
  if (data.currentType === EDeviceTypeName.Dock && data.dockInfo[data.currentSn]) {
    // 机场图标位置
    const setting = {
      longitude: data.dockInfo[data.currentSn].basic_osd?.longitude || 115.85666327144976,
      latitude: data.dockInfo[data.currentSn].basic_osd?.latitude || 28.62452712442823,
      longitude: data.dockInfo[data.currentSn].basic_osd?.longitude,
      latitude: data.dockInfo[data.currentSn].basic_osd?.latitude,
      billboard: {
        image: getResource('dock.png'),
        outlineWidth: 0,
@@ -326,9 +326,16 @@
    hasFlownToLocation.value = true
  }
}, {
  deep: true
  deep: true,
})

const bind = async (sn: string) => {
  const res = await testBind(sn)
  if (res.code === 0) {
    Promise.resolve(true)
  } else {
    Promise.resolve(false)
  }
}
onMounted(() => {
  getOnlineTopo()
  setTimeout(() => {
@@ -360,6 +367,7 @@
    if (res.code !== 0) {
      return
    }
    const snList: any[] = []
    onlineDevices.data = []
    onlineDocks.data = []
    res.data.forEach((gateway: any) => {
@@ -395,7 +403,10 @@
      if (gateway.status && EDeviceTypeName.Gateway === gateway.domain) {
        onlineDevices.data.push(device)
      }
      snList.push(gateway.device_sn)
      bind(gateway.device_sn)
    })
    store.commit('SET_SN_LIST', snList)
  })
}


 src/store/common.ts

@@ -3,6 +3,7 @@
const state = () => ({
  projectId: null as string | null,
  dockSns: null as string | null,
  snList: [] as string[]
})
export type RootStateType = ReturnType<typeof state>
const mutations: MutationTree<RootStateType> = {
@@ -12,6 +13,10 @@

  SET_DOCK_SN (state, dockSns: string) {
    state.dockSns = dockSns
  },

  SET_SN_LIST (state, snList: string[]) {
    state.snList = snList
  }
}
export default {

 src/store/index.ts

@@ -6,6 +6,7 @@
import { LayerType } from '/@/types/mapLayer'
import { WaylineFile } from '/@/types/wayline'
import { DevicesCmdExecuteInfo } from '/@/types/device-cmd'
import createPersistedState from 'vuex-persistedstate' // 导入库
import map from './map'
import common from './common'

@@ -251,6 +252,7 @@
    map,
    common
  },
  plugins: [createPersistedState()]
}

const rootStore = createStore(storeOptions)

 yarn.lock

@@ -1561,6 +1561,11 @@
  resolved "https://registry.nlark.com/deep-is/download/deep-is-0.1.4.tgz"
  integrity sha1-pvLc5hL63S7x9Rm3NVHxfoUZmDE=

deepmerge@^4.2.2:
  version "4.3.1"
  resolved "https://registry.npmmirror.com/deepmerge/-/deepmerge-4.3.1.tgz#44b5f2147cd3b00d4b56137685966f26fd25dd4a"
  integrity sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==

define-properties@^1.1.3:
  version "1.1.3"
  resolved "https://registry.npm.taobao.org/define-properties/download/define-properties-1.1.3.tgz"
@@ -4037,6 +4042,11 @@
  resolved "https://registry.nlark.com/shebang-regex/download/shebang-regex-3.0.0.tgz"
  integrity sha1-rhbxZE2HPsrYQ7AwexQzYtTEIXI=

shvl@^2.0.3:
  version "2.0.3"
  resolved "https://registry.npmmirror.com/shvl/-/shvl-2.0.3.tgz#eb4bd37644f5684bba1fc52c3010c96fb5e6afd1"
  integrity sha512-V7C6S9Hlol6SzOJPnQ7qzOVEWUQImt3BNmmzh40wObhla3XOYMe4gGiYzLrJd5TFa+cI2f9LKIRJTTKZSTbWgw==

side-channel@^1.0.4:
  version "1.0.4"
  resolved "https://registry.npm.taobao.org/side-channel/download/side-channel-1.0.4.tgz?cache=0&sync_timestamp=1609270210432&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fside-channel%2Fdownload%2Fside-channel-1.0.4.tgz"
@@ -4819,6 +4829,14 @@
    "@vue/server-renderer" "3.2.26"
    "@vue/shared" "3.2.26"

vuex-persistedstate@^4.1.0:
  version "4.1.0"
  resolved "https://registry.npmmirror.com/vuex-persistedstate/-/vuex-persistedstate-4.1.0.tgz#127165f85f5b4534fb3170a5d3a8be9811bd2a53"
  integrity sha512-3SkEj4NqwM69ikJdFVw6gObeB0NHyspRYMYkR/EbhR0hbvAKyR5gksVhtAfY1UYuWUOCCA0QNGwv9pOwdj+XUQ==
  dependencies:
    deepmerge "^4.2.2"
    shvl "^2.0.3"

vuex@^4.0.2:
  version "4.0.2"
  resolved "https://registry.npmmirror.com/vuex/download/vuex-4.0.2.tgz"