SmartBench/CMVR-IOT-UI
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 加载地图

Browse Source
This commit is contained in:
zhanghao 2026-08-06 11:52:30 +08:00
parent b332a5461e
commit 2159b7f228
3 changed files with 69 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/views/inspection/cockpit/components/ManualTakeover/index.vue
View File

@ -11,7 +11,7 @@
</div>
<div>
<div class="bot-name">{{ item.robotName }}</div>
<div class="bot-local">{{ agvRuntimeStatusLabel(item.status) }}</div>
<div class="bot-local" :class="agvRuntimeStatusClass(item.status)">{{ agvRuntimeStatusLabel(item.status) }}</div>
</div>
</div>
</div>
@ -100,7 +100,7 @@
</div>
<div class="video-container">
<div v-if="activeMode === 'auto' || activeController === 1" class="map-container">
<MapCanvas v-if="robotList.length > 0" :robotList="currentRobot" ref="mapCanvasRef" />
<MapCanvas v-if="robotList.length > 0" :clearMap="true" :robotList="currentRobot" ref="mapCanvasRef" />
</div>
<div v-if="activeMode === 'artificial' && activeController === 2" class="model-container">
<UrdfViewer ref="urdfViewerRef" modelPath="/inspection/elfin10/elfin10.urdf.xacro" />
@ -134,7 +134,7 @@ import { getJointStateApi, moveJApi, torqueOnApi, speedJApi, stopMotionApi, clea
import { Remove, CirclePlus } from '@element-plus/icons-vue'
import VoiceConversation from "./VoiceConversation.vue";
import IPlayer from "@/components/IPlayer/index.vue";
import { agvRuntimeStatusLabel } from '@/utils/agvRuntimeStatus'
import { agvRuntimeStatusClass, agvRuntimeStatusLabel } from '@/utils/agvRuntimeStatus'
const robotList = ref([])
const robotDevices = ref([])
@ -310,7 +310,7 @@ onMounted(() => {
fetchRobotList()
robotRefreshTimer = window.setInterval(() => {
if (!document.hidden) fetchRobotList(false)
}, 5000)
}, 500)
})
onUnmounted(() => {
@ -353,10 +353,10 @@ onUnmounted(() => {
background: #0F1E38;
height: 56px;
border-radius: 8px;
padding: 16px;
padding: 12px;
display: flex;
align-items: center;
gap: 20px;
gap: 12px;
margin-bottom: 16px;
cursor: pointer;
border: 1px solid transparent;
@ -367,10 +367,34 @@ onUnmounted(() => {
}
.bot-local {
color: #00d4ff;
font-size: 11px;
margin-top: 4px;
}
.online {
color: #0f8;
}
.unknown,
.offline,
.stopped {
color: #cbd5e1;
}
.manual,
.running {
color: #00d4ff;
}
.charging,
.paused {
color: #ffb300;
}
.fault,
.emergency {
color: #ff6b6d;
}
}
.active {

10
src/views/inspection/cockpit/components/MapCanvas.vue
View File

@ -28,11 +28,16 @@ import {
import { getMapJson } from '@/api/inspection/robot'
import { useInspectionStore } from "@/store/modules/inspection";
import { ElMessage } from 'element-plus';
import { clear } from 'ace-builds/src-noconflict/ext-code_lens';
const props = defineProps({
robotList: {
type: Array,
default: () => []
},
clearMap: {
type: Boolean,
default: false
}
})
@ -419,6 +424,11 @@ const colorList = ['#00D4FF', '#FFB300', '#00FF88', '#ff5100', '#fff', '#15ff00'
watch(() => props.robotList,
(newVal) => {
if (newVal.length > 0) {
if (props.clearMap) {
applicationState.robots = []
}
loadSourceMap()
const ids = applicationState.robots.map(r => r.id);
props.robotList.forEach(item => {
const position = parseRobotPosition(item.currentPosition)

31
src/views/inspection/cockpit/components/Monitor.vue
View File

@ -13,8 +13,8 @@
<SvgIcon name="bot" :color="colorList[index]" />
</div>
<div>
<div class="bot-name">机器人#0{{ index + 1}}</div>
<div class="bot-local">厂区A-在线</div>
<div class="bot-name">{{ item.robotName }}</div>
<div class="bot-local" :class="agvRuntimeStatusClass(item.status)">{{ agvRuntimeStatusLabel(item.status) }}</div>
</div>
</div>
</div>
@ -42,6 +42,7 @@
import SvgIcon from "@/components/SvgIcon";
import IPlayer from "@/components/IPlayer/index.vue";
import { getRobotList } from '@/api/inspection/robot'
import { agvRuntimeStatusClass, agvRuntimeStatusLabel } from '@/utils/agvRuntimeStatus'
const videoUrl = ref('https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8')
@ -112,10 +113,34 @@ onMounted(() => {
}
.bot-local {
color: #00d4ff;
font-size: 11px;
margin-top: 4px;
}
.online {
color: #0f8;
}
.unknown,
.offline,
.stopped {
color: #cbd5e1;
}
.manual,
.running {
color: #00d4ff;
}
.charging,
.paused {
color: #ffb300;
}
.fault,
.emergency {
color: #ff6b6d;
}
}
.active {