diff --git a/.env.development b/.env.development index cdf8000..4daa9a4 100644 --- a/.env.development +++ b/.env.development @@ -3,11 +3,8 @@ NODE_ENV = 'development' # 渔船点位 VITE_WS_BASE_URL ='ws://220.185.188.222:8055/api/gisWs' -# VITE_APP_BASE_URL = 'http://125.124.131.105:6811/api' # 成彬本地 -VITE_APP_BASE_URL = 'http://100.95.100.2:6061/api' -# VITE_APP_BASE_URL = 'http://100.95.236.218:6061/api' -# VITE_APP_BASE_URL = 'http://119.167.138.11:6061/video-service' +VITE_APP_BASE_URL = 'http://100.95.196.8:6061/api' # 智能体访问地址 # 宋凯忠本地 diff --git a/src/api/device.js b/src/api/device.js index ca25624..1a754ef 100644 --- a/src/api/device.js +++ b/src/api/device.js @@ -6,14 +6,50 @@ import request from '@/utils/request' * @param data * @returns {*} */ -export const videoCameraFindPage = (data) => { +export const dsVideoPage = (data) => { return request({ - url: '/videoCamera/findPage', + url: '/fishingPort/dsVideo/page', method: 'post', - data: data, - headers: { - 'Content-Type': 'application/x-www-form-urlencoded' - } + data: data + }) +} +/** + * 分页查询监控设备列表 + * 新增 + * @param data + * @returns {*} + */ +export const dsVideoSave = (data) => { + return request({ + url: '/fishingPort/dsVideo/save', + method: 'post', + data: data + }) +} +/** + * 分页查询监控设备列表 + * 修改 + * @param data + * @returns {*} + */ +export const dsVideoUpdate = (data) => { + return request({ + url: '/fishingPort/dsVideo/update', + method: 'post', + data: data + }) +} +/** + * 分页查询监控设备列表 + * 删除 + * @param data + * @returns {*} + */ +export const dsVideoDelete = (data) => { + return request({ + url: '/fishingPort/dsVideo/delete', + method: 'post', + data: data }) } /** diff --git a/src/assets/images/common/icon_suffix.png b/src/assets/images/common/icon_suffix.png new file mode 100644 index 0000000..0067f3d Binary files /dev/null and b/src/assets/images/common/icon_suffix.png differ diff --git a/src/assets/images/map/devices/icon_monitor_bayonet.png b/src/assets/images/map/devices/icon_monitor_bayonet.png new file mode 100644 index 0000000..992eee9 Binary files /dev/null and b/src/assets/images/map/devices/icon_monitor_bayonet.png differ diff --git a/src/components/Filter/index.vue b/src/components/Filter/index.vue index 2d68003..b0d2815 100644 --- a/src/components/Filter/index.vue +++ b/src/components/Filter/index.vue @@ -11,7 +11,7 @@ v-model="model[item.prop]" :placeholder="item.placeholder ? item.placeholder : '请输入'" :clearable="item.clearable !== false" - style="width: 110px"> + :style="{width: item.width || '110px'}"> diff --git a/src/components/FlvPlayer/index.vue b/src/components/FlvPlayer/index.vue index 4743cd7..338671c 100644 --- a/src/components/FlvPlayer/index.vue +++ b/src/components/FlvPlayer/index.vue @@ -68,7 +68,6 @@ const initPlayer = () => { timeoutId = setTimeout(() => { timeoutId = null - console.log(retryCount, retryDelay, '重连次数......') if (retryCount <= MAX_RETRIES) { initPlayer() // 重新初始化播放器 } else { @@ -76,7 +75,6 @@ const initPlayer = () => { if (player) { player = null } - console.error('重试超过最大次数') } }, retryDelay) }) diff --git a/src/components/HeaderMenu/index.vue b/src/components/HeaderMenu/index.vue index ee6c68a..7f03d3c 100644 --- a/src/components/HeaderMenu/index.vue +++ b/src/components/HeaderMenu/index.vue @@ -69,11 +69,11 @@ ] const navRight = [ - // { - // label: '识别记录', - // path: '/screen/identification', - // prop: 'identification' - // }, + { + label: '业务配置', + path: '/setting', + prop: 'identification' + }, { label: '插件下载', path: '', @@ -101,6 +101,8 @@ const toggle = (nav) => { if(nav.prop === 'monitor') { window.open('/plugin/VideoWebPlugin.exe', '_blank') + }else{ + router.push(nav.path) } } // 右上角时间 @@ -250,7 +252,7 @@ } .datetime{ display: flex; - gap: 14px; + gap: 12px; color: #FFFFFF; text-align: left; height: 29px; @@ -284,7 +286,7 @@ margin-left: 61px; } .right{ - gap:20px; + gap:15px; margin-right: 40px; align-items: center; } diff --git a/src/components/Map/MapServer/index.vue b/src/components/Map/MapServer/index.vue deleted file mode 100644 index f37b894..0000000 --- a/src/components/Map/MapServer/index.vue +++ /dev/null @@ -1,130 +0,0 @@ - - - - - diff --git a/src/components/Map/index.vue b/src/components/Map/index.vue index 4b699a2..6b1d5f6 100644 --- a/src/components/Map/index.vue +++ b/src/components/Map/index.vue @@ -23,14 +23,11 @@ import { monitors, uavs, stations, environmentals, fences, detailFences } from ' import InfoWindowComponent from '@/components/Map/window/index.vue' import TrawlerInfoWindowComponent from '@/components/Map/window/trawler.vue' import { dsVideoList, findUavPage, getVideoInfo } from '@/api/device.js' +import { useRouter } from 'vue-router' +const router = useRouter() const mapStore = useMapStore() -const UAV = computed(() => mapStore.legend.UAV) -const monitor = computed(() => mapStore.legend.monitor) -const ais_station = computed(() => mapStore.legend.ais_station) -const environmental = computed(() => mapStore.legend.environmental) -const fence = computed(() => mapStore.legend.fence) -const sector = computed(() => mapStore.sector) +const legend = computed(() => mapStore.legend) const locateData = computed(() => mapStore.locate.data) let globalMap = null let vector = {} @@ -108,7 +105,7 @@ const addMonitorToMap = () => { }, { id: item.id, - symbol: $configs.getDevicePointSymbol('_monitor', { ...item, name: item.videoName }), + symbol: $configs.getDevicePointSymbol('_monitor' + (item.beBayonet === 1 ? '_bayonet' : ''), { ...item, name: item.videoName }), // beBayonet 是否卡口1是 0否 properties: item, zIndex: 2 } @@ -118,21 +115,8 @@ const addMonitorToMap = () => { const pvalue = item.ptzcfg?.pValue || 0 drawSector('_monitor', [ item.longitude, item.latitude ], visionDistance, item.id, (90 - pvalue) % 360) marker.on('click', (evt) => { - // 先隐藏所有扇形 - changeSectorsInLayer('sectors_monitor', false) - - // 确保扇形图层是可见的 - if (!vector.sectors_monitor.isVisible()) { - vector.sectors_monitor.show() - } - - // 显示当前点击项的所有相关扇形（圆、椭圆、线） - const baseId = `sector__monitor${item.id}` - vector.sectors_monitor.getGeometryById(baseId + '_circle')?.show() - vector.sectors_monitor.getGeometryById(baseId + '_ellipse')?.show() - vector.sectors_monitor.getGeometryById(baseId + '_line')?.show() - - mapStore.updateWindowInfo({ visible: true, type: '_monitor', data: { ...item } }) + mapStore.updateLocate({ ...item }) // 视频定位 + mapStore.updateWindowInfo({ visible: true, type: '_monitor', data: { ...item } }) // 打开监控视频弹窗 }) } }) @@ -140,34 +124,17 @@ const addMonitorToMap = () => { } // 要素/视频定位 const locateMoitor = (data) => { - const name = 'locate-monitor' - let layer = vector[name] - if (!layer) { - initLayerToMap('locate-monitor') - layer = vector['locate-monitor'] - } else { - layer.clear() - } + initLayerToMap('locate-monitor') const monitors = vector.monitor const marker = monitors.getGeometryById(data.id) if (marker) { - const coordinates = marker.getCoordinates() geography.monitor.forEach((item) => { if (item.id === data.id) { - // globalMap.map.animateTo( - // { - // center: [ coordinates.x, coordinates.y ] - // }, - // { - // duration: 1000 * 0.5, - // easing: 'out' - // } - // ) // 先隐藏所有扇形 changeSectorsInLayer('sectors_monitor', false) getVideoInfo({ id: item.id }).then(res => { const visionDistance = item.visionDistance * 1000 || 5 * 1000 // 视角距离 - const pvalue = res.data.ptzcfg.pValue || 0 // 旋转角度 + const pvalue = res.data.ptzcfg?.pValue || 0 // 旋转角度 drawSector('_monitor', [ item.longitude, item.latitude ], visionDistance, item.id, (90 - pvalue) % 360) // 确保扇形图层是可见的 @@ -369,7 +336,6 @@ const initUAV = () => { addUAVToMap() } }) - } const initMonitor = () => { const params = {} @@ -394,83 +360,60 @@ const initFence = () => { addFenceToMap('detailFence') } const toModel = () => { - mapStore.updateDialog({ visible: true, type: 'largeModel' }) + router.push('/largeModel') } onMounted(() => { initMap() - initFence() - initUAV() - initMonitor() - initAisStation() - initEnvironmental() + // 监控设备图层初始化 + Object.values(layerMehods).forEach(initFunc => initFunc()) // 渔船链接 BoatUtil.init(mapStore) BoatUtil.getShip() // 轨迹图层 initLayerToMap('track') }) -watch(() => UAV.value, () => { - if(UAV.value) { - initUAV() - }else{ - vector.UAV?.hide() - changeSectorsInLayer('sectors_UAV', false) - } -}) -watch(() => monitor.value, () => { - if(monitor.value) { - initMonitor() - }else{ - vector.monitor?.hide() - changeSectorsInLayer('sectors_monitor', false) +const layerMehods = { + UAV: initUAV, + monitor: initMonitor, + ais_station: initAisStation, + environmental: initEnvironmental, + fence: initFence +} +watch(() => Object.keys(layerMehods).reduce((obj, key) => { + obj[key] = legend.value[key] + return obj + }, {}), (newVal, oldVal) => { + Object.keys(layerMehods).forEach(key => { + // 监听值变化进行更改 + if (newVal[key] !== oldVal[key]) { + if (newVal[key]) { + layerMehods[key]() + } else { + vector[key]?.hide() + if (key === 'UAV' || key === 'monitor') { // 无人机和监控可视区域隐藏 + changeSectorsInLayer('sectors_' + key, false) + } else if (key === 'fence') { + vector.detailFence?.hide() + } + } + } + }) + }, { deep: true }) +const watchKeys = [ 'sectors_monitor', 'sectors_UAV' ] +watch(() => ({ sectors_UAV: legend.value.sectors_UAV, sectors_monitor: legend.value.sectors_monitor }), (newVal, oldVal) => { + watchKeys.forEach(key => { + // 监听值变化进行更改 + if (newVal[key] !== oldVal[key]) { + if (newVal[key]) { + changeSectorsInLayer(key, true) + } else { + changeSectorsInLayer(key, false) + } } -}) -watch(() => ais_station.value, () => { - if(ais_station.value) { - initAisStation() - }else{ - vector.ais_station?.hide() - } -}) -watch(() => environmental.value, () => { - if(environmental.value) { - initEnvironmental() - }else{ - vector.environmental?.hide() - } -}) -watch(() => fence.value, () => { - if(fence.value) { - initFence() - }else{ - vector.fence?.hide() - vector.detailFence?.hide() - } -}) -watch(() => sector.value.monitor, (newVal) => { - if(vector.sectors_monitor) { - if(newVal) { - // vector.sectors_monitor.show() - changeSectorsInLayer('sectors_monitor', true) - } else { - // vector.sectors_monitor.hide() - changeSectorsInLayer('sectors_monitor', false) - } - } -}) -watch(() => sector.value.UAV, (newVal) => { - if(vector.sectors_UAV) { - if(newVal) { - // vector.sectors_UAV.show() - changeSectorsInLayer('sectors_UAV', true) - } else { - // vector.sectors_UAV.hide() - changeSectorsInLayer('sectors_UAV', false) - } - } -}) + }) +}, { deep: true }) // 定位数据变化 -watch(() => locateData.value.videoCode, (newVal) => { +watch(() => locateData.value.videoCode, () => { nextTick(() => { locateMoitor(locateData.value) }) diff --git a/src/components/Map/lbtbox/boatTerminal.js b/src/components/Map/lbtbox/boatTerminal.js index 5bf87db..ee5bfa2 100644 --- a/src/components/Map/lbtbox/boatTerminal.js +++ b/src/components/Map/lbtbox/boatTerminal.js @@ -184,7 +184,6 @@ const cleanupExpiredBoats = () => { const getShip = () => { findByCurrent().then(res => { - console.log('初始获取') addBoats(res.result) }) // ----------船只数据------------------ @@ -192,7 +191,6 @@ const getShip = () => { dynamicBoatInfoWebSocket.onopen(event => { }) dynamicBoatInfoWebSocket.onmessage(event => { - console.log('接收数据:', JSON.parse(event.data)) if(Array.isArray(JSON.parse(event.data))) { addBoats(JSON.parse(event.data)) diff --git a/src/components/Map/legend.vue b/src/components/Map/legend.vue index 237e42d..61ce13f 100644 --- a/src/components/Map/legend.vue +++ b/src/components/Map/legend.vue @@ -75,7 +75,7 @@ return } item.sector = !item.sector - mapStore.updateSector(item.prop, item.sector) + mapStore.updateLegend('sectors_' + item.prop, item.sector) } const toggleExpand = () => { isFold.value = !isFold.value @@ -86,7 +86,7 @@ mapStore.updateLegend(item.prop, item.checked) if(!item.checked && (item.prop === 'monitor' || item.prop === 'UAV')) { item.sector = false - mapStore.updateSector(item.prop, item.sector) + mapStore.updateLegend('sectors_' + item.prop, item.sector) } } diff --git a/src/components/Map/window/uav.vue b/src/components/Map/window/uav.vue index 6135ff3..56bd47b 100644 --- a/src/components/Map/window/uav.vue +++ b/src/components/Map/window/uav.vue @@ -182,7 +182,7 @@ onUnmounted(() => { .content-wrapper{ display: flex; position: relative; - height: 100%; + height: 800px; iframe{ width: 100%; height: 100%; diff --git a/src/components/Player/HikPlayer-back.vue b/src/components/Player/HikPlayer-back.vue index 6622fd8..524088a 100644 --- a/src/components/Player/HikPlayer-back.vue +++ b/src/components/Player/HikPlayer-back.vue @@ -283,8 +283,6 @@ export default { }); }, uninit() { - console.log(999); - let that = this; if (that.oWebControl != null) { that.oWebControl.JS_RequestInterface({ diff --git a/src/router/index.js b/src/router/index.js index 30be581..95fdde7 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -14,9 +14,7 @@ const routes = [ auth: false, title: '首页' }, - component: () => import('@/views/business/index.vue'), - children: [ - ] + component: () => import('@/views/business/index.vue') }, { path: '/login', @@ -71,7 +69,7 @@ router.beforeEach((to, from, next) => { // 没有token if (whiteList.indexOf(to.path) !== -1) { // 在免登录白名单，直接进入 - next() + next() } else { // next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页 next('/login') // 否则全部重定向到登录页 diff --git a/src/store/modules/map.js b/src/store/modules/map.js index a693a93..6c72145 100644 --- a/src/store/modules/map.js +++ b/src/store/modules/map.js @@ -6,29 +6,22 @@ const useMapStore = defineStore( state: () => ({ legend: { UAV: true, + sectors_UAV: false, // 无人机可视域开关 monitor: true, + sectors_monitor: false, // 监控可视域开关 ais_station: true, environmental: true, fence: true }, windowInfo: { visible: false, - type: '', + type: '', // 弹窗类型 _monitor/_UAV/_trawler_dynamic data: {} }, - sector: { - 'UAV': false, // 无人机可视域开关 - 'monitor': false // 监控可视域开关 - }, hik: { // 海康插件设备层级 level: 1, data: {} }, - dialog: { - visible: false, - type: '', // 弹窗类型 alarm/CCTV/UAV/largeModel - data: {} - }, // 无人机信息 uavs: { data: {} @@ -48,20 +41,11 @@ const useMapStore = defineStore( this.windowInfo.type = type this.windowInfo.data = data }, - updateSector(type, checked) { - this.sector[type] = checked - }, updateHik(option) { const { level = 1, data = {} } = option this.hik.level = level this.hik.data = data }, - updateDialog(option) { - const { visible = false, type = '', data } = option - this.dialog.visible = visible - this.dialog.type = type - this.dialog.data = data - }, updateUavData(option) { this.uavs.data = option }, diff --git a/src/store/modules/toolbar.js b/src/store/modules/toolbar.js deleted file mode 100644 index a6645fa..0000000 --- a/src/store/modules/toolbar.js +++ /dev/null @@ -1,22 +0,0 @@ -import { defineStore } from 'pinia' - -const useToolBarStore = defineStore( - 'toolbar', - { - state: () => ({ - expand: false, //地图图例位置 - trawler: { - visible: false // 渔船动态详情收缩框显示 - } - }), - actions: { - toogleExpand(expand) { - this.expand = expand - }, - toggleTrawlerVisible(visible) { - this.trawler.visible = visible - } - } - }) - -export default useToolBarStore diff --git a/src/views/business/alarm/device.vue b/src/views/business/alarm/device.vue index 7709a7c..c7d7373 100644 --- a/src/views/business/alarm/device.vue +++ b/src/views/business/alarm/device.vue @@ -5,11 +5,11 @@ diff --git a/src/views/business/setting/monitor/detail.vue b/src/views/business/setting/monitor/detail.vue new file mode 100644 index 0000000..86826c7 --- /dev/null +++ b/src/views/business/setting/monitor/detail.vue @@ -0,0 +1,262 @@ + + + + diff --git a/src/views/business/setting/monitor/index.vue b/src/views/business/setting/monitor/index.vue new file mode 100644 index 0000000..c73cf7a --- /dev/null +++ b/src/views/business/setting/monitor/index.vue @@ -0,0 +1,263 @@ + + + + diff --git a/src/views/business/wall/grid.vue b/src/views/business/wall/grid.vue index 4eb30ed..dba0b4a 100644 --- a/src/views/business/wall/grid.vue +++ b/src/views/business/wall/grid.vue @@ -39,7 +39,7 @@ import { nextTick, onUnmounted, ref } from 'vue' import HikPlayerComponent from '@/components/Player/HikPlayer.vue' import FlvPlayerComponent from '@/components/FlvPlayer/index.vue' -import { getVideoStream, doStartOrStopUavAlgorithm } from '@/api/uav' +import { getVideoStream } from '@/api/uav' const control = ref([ { label: '1X1', value: 1 }, @@ -93,7 +93,6 @@ const closeVideo = (data, item) => { const handleNodeClick = (node) => { if(props.videoType === 'CCTV' && node.videoCode) { let index = haikang.value.findIndex(i => !i) - console.log(index, haikang.value, 'value') if(index !== -1) { haikang.value[index] = { codes: node.videoCode } } diff --git a/src/views/business/wall/index.vue b/src/views/business/wall/index.vue index dab9bb7..e89fd74 100644 --- a/src/views/business/wall/index.vue +++ b/src/views/business/wall/index.vue @@ -12,13 +12,12 @@ import { computed, nextTick, ref, watch } from 'vue' import DialogComponent from '@/components/Dialog/screen.vue' import TreeCom from './tree.vue' import GridCom from './grid.vue' -import { useRouter } from 'vue-router' -import useMapStore from '@/store/modules/map' +import { useRoute, useRouter } from 'vue-router' import { dragEvent, resizeEvent } from '@/utils/common' -const mapStore = useMapStore() +const route = useRoute() const router = useRouter() -const type = computed(() => mapStore.dialog.type) +const type = computed(() => route.query.type) const Tree = ref(null) const Grid = ref(null) @@ -32,7 +31,7 @@ const handle = (node) => { Grid.value.handleNodeClick(node) } const close = () => { - mapStore.updateDialog(false) + router.push('/') } watch(() => type.value, () => { if(type.value) { @@ -48,8 +47,8 @@ watch(() => type.value, () => { * */ const drag = (e) => { - if(e.target.className.includes('el-dialog-title')) { - dragEvent(e, 'el-dialog-title', () => { + if(e.target.className.includes('el-dialog-title') || e.target.className.includes('el-dialog__title')) { + dragEvent(e, 'el-dialog', () => { if(Grid.value.videoPreview) { Grid.value.videoPreview.forEach(i => { i.initResize(false) diff --git a/src/views/business/wall/tree.vue b/src/views/business/wall/tree.vue index 2b1c78b..6d0278e 100644 --- a/src/views/business/wall/tree.vue +++ b/src/views/business/wall/tree.vue @@ -16,8 +16,8 @@