Ren/robot_bigScreen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化地图上的信息展示

Browse Source
This commit is contained in:
renna 2025-06-13 14:56:51 +08:00
parent e1e4233c1e
commit 896d64fd11
1 changed files with 38 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/components/RobotStatusList.vue
View File

@ -53,13 +53,13 @@
<BatteryIndicator :battery="item.battery" />
<div class="robot-status" :class="item.status.toLowerCase().replace(/\s+/g, '-')">{{ item.status }}</div>
</div>
<div v-if="item.tags=== 1" class="alarm-wrapper">
<div v-if="item.tags=== 2" class="alarm-wrapper">
<img src="../assets/img/tip.png" alt="告警" class="alarm-tip" />
<span class="alarm-text">告警</span>
</div>
<div v-if="item.tags=== 2" class="alarm-wrapper">
<div v-if="item.tags=== 1" class="alarm-wrapper">
<img src="../assets/img/ossTip.png" alt="告警" class="alarm-tip" />
<span class="alarm-text">紧急</span>
<span class="alarm-text" style="color: #FFf!important;">紧急</span>
</div>
</div>
</div>
@ -136,7 +136,7 @@ const fetchRobotList = async (searchNumber = null) => {
status: getStatusText(robot.onlineStatus, robot.status),
type: getGroupType(groupName),
tag: robot.onlineStatus === '1' && robot.status === '3' ? '故障' : null,
tags: robot.tags
tags: robot.robotInfo?.tag
}
allRobots.push(robotData)
@ -144,6 +144,13 @@ const fetchRobotList = async (searchNumber = null) => {
})
robotList.value = allRobots
// 新增：筛选室外巡检机器人并emit
const outdoorRobotsArray = allRobots.filter(r => r.type === 'outdoor').map(r => ({
id: r.id,
battery: r.battery,
status: r.status
}))
emit('outdoor-robots-update', outdoorRobotsArray)
console.log('获取机器人列表成功:', robotList.value)
} else {
error.value = res.msg || '获取机器人列表失败'
@ -275,6 +282,13 @@ const goToRobotDetail = (id) => {
onMounted(() => {
fetchRobotList()
startScroll()
// 新增：首次挂载时emit一次
const outdoorRobotsArray = robotList.value.filter(r => r.type === 'outdoor').map(r => ({
id: r.id,
battery: r.battery,
status: r.status
}))
emit('outdoor-robots-update', outdoorRobotsArray)
})
onUnmounted(() => {
@ -285,12 +299,26 @@ onUnmounted(() => {
watch(selectedFilter, () => {
console.log('筛选条件变化:', selectedFilter.value)
searchRobots() // 重新搜索，应用筛选条件
// 新增：筛选后emit最新室外巡检机器人
const outdoorRobotsArray = robotList.value.filter(r => r.type === 'outdoor').map(r => ({
id: r.id,
battery: r.battery,
status: r.status
}))
emit('outdoor-robots-update', outdoorRobotsArray)
})
// 搜索机器人
const searchRobots = () => {
console.log('搜索机器人:', searchText.value)
fetchRobotList(searchText.value)
// 新增：搜索后emit最新室外巡检机器人
const outdoorRobotsArray = robotList.value.filter(r => r.type === 'outdoor').map(r => ({
id: r.id,
battery: r.battery,
status: r.status
}))
emit('outdoor-robots-update', outdoorRobotsArray)
}
@ -462,16 +490,17 @@ const searchRobots = () => {
position: absolute;
top: 0;
right: 0;
width: 2.188vw; /* 42px at 1920px width */
width: 2.158vw; /* 42px at 1920px width */
height: 1.25vw; /* 24px at 1920px width */
display: flex;
align-items: center;
padding:0 10px;
justify-content: center;
}
.alarm-tip {
width: 2.188vw; /* 42px at 1920px width */
height: 1.25vw; /* 24px at 1920px width */
width: 2.588vw; /* 42px at 1920px width */
height: 1.4vw; /* 24px at 1920px width */
position: absolute;
top: 0;
right: 0;
@ -480,11 +509,12 @@ const searchRobots = () => {
.alarm-text {
position: absolute;
top: 0;
left: 0.52vw; /* 10px at 1920px width */
left: 0.42vw; /* 10px at 1920px width */
font-size: var(--fsize4);
color: #000;
text-align: center;
z-index: 1;
letter-spacing: 0.05vw;
line-height: 0.938vw; /* 18px at 1920px width */
}