bonus
/
on-site-robots-screen
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化

This commit is contained in:
BianLzhaoMin 2025-07-25 16:09:45 +08:00
parent 57d636ba91
commit 381404fbdb
3 changed files with 216 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
src/views/home/components/control-deck-new.vue
View File

@ -77,28 +77,24 @@
class="arrow-top hand-direction"
@mousedown="handleChangeCamera('up')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-right hand-direction"
@mousedown="handleChangeCamera('right')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-bottom hand-direction"
@mousedown="handleChangeCamera('down')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-left hand-direction"
@mousedown="handleChangeCamera('left')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
@ -118,11 +114,13 @@
<span>缩放</span>
<img
style="margin-bottom: 2px"
@click="handleChangeZoomCamera('ZoomIn')"
@mousedown="handleChangeZoomCamera('ZoomIn')"
@mouseup="handleStopDeviceCameraZoom()"
src="@/assets/home-imgs/control-2-add.png"
/>
<img
@click="handleChangeZoomCamera('ZoomOut')"
@mousedown="handleChangeZoomCamera('ZoomOut')"
@mouseup="handleStopDeviceCameraZoom()"
src="@/assets/home-imgs/control-2-reduce.png"
/>
</div>
@ -146,28 +144,24 @@
class="arrow-top"
@mousedown="handleChangeRobot('5')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-right"
@mousedown="handleChangeRobot('8')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-bottom"
@mousedown="handleChangeRobot('6')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-left"
@mousedown="handleChangeRobot('7')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
@ -457,6 +451,43 @@ const beforeUpload = ({ file }) => {
return true
}
// 判断当前机器人是否在 巡检中 如果在巡检中 则不可进行任何操作 可弹框提示客户暂停巡检 然后重新获取机器人状态再进行操作
const handleInspection = async () => {
if (robotBaseInfo.value.type.includes('巡检')) {
return new Promise((resolve) => {
dialog.warning({
title: '提示',
content: '当前机器人正在巡检中，可暂停巡检后再进行操作',
positiveText: '暂停巡检',
negativeText: '取消',
onPositiveClick: async () => {
try {
const { data: res } = await handleRobotActionApi({
puId: robotData.robotInfo?.puId,
type: '15',
})
if (res.code == 200) {
message.success('已暂停巡检')
getRobotBaseInfo()
resolve(false) // 已暂停巡检，返回false表示不处于巡检状态
} else {
message.error('暂停巡检失败' + res.message)
resolve(true) // 暂停失败，仍然处于巡检状态
}
} catch (error) {
message.error('暂停巡检出错')
resolve(true) // 出错时，假设仍然处于巡检状态
}
},
onNegativeClick: () => {
resolve(true) // 用户取消，仍然处于巡检状态
},
})
})
}
return false // 不包含"巡检"，返回false表示不处于巡检状态
}
// 上传音频
const handleChangeUpload = async (e) => {
const file = e.file
@ -598,11 +629,16 @@ const handleStopDeviceCameraZoom = async () => {
puid: '201115200268437643',
})
console.log(res, '停止位置---')
isStopLeft.value = true
console.log(res, '停止缩放')
}
// 操控机器人上方的摄像头
const handleChangeCamera = debounce(async (motion) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
if (motion === 'stop' && isZoom.value) {
isStopLeft.value = true
handleStopDeviceCameraZoom()
@ -629,6 +665,10 @@ const handleChangeCamera = debounce(async (motion) => {
// 球机缩放
const handleChangeZoomCamera = async (motion) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
isStopLeft.value = false
isZoom.value = true
if (motion === 'ZoomIn') {
@ -648,7 +688,18 @@ const handleChangeZoomCamera = async (motion) => {
// 操控机器人
const handleChangeRobot = debounce(async (type) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
// type 5 前进 6 后退 7 左转 8 右转
const typeMap = {
5: '前进', // 前进
6: '后退', // 后退
7: '左转', // 左转
8: '右转', // 右转
9: '停止', // 停止
}
if (!robotData.robotInfo?.puId) {
message.error('当前机器人未连接', {
duration: 1000,
@ -661,10 +712,10 @@ const handleChangeRobot = debounce(async (type) => {
type,
}
console.log(params, 'params---')
console.log(params, '机器人操控参数' + typeMap[type])
const res = await handleRobotActionApi(params)
console.log(res, '操控机器人---')
const { data: res } = await handleRobotActionApi(params)
console.log(res, '机器人操控结果')
if (res.code == 200 && type != 9) {
isStopRight.value = true
}

90
src/views/home/components/control-deck.vue
View File

@ -77,28 +77,24 @@
class="arrow-top hand-direction"
@mousedown="handleChangeCamera('up')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-right hand-direction"
@mousedown="handleChangeCamera('right')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-bottom hand-direction"
@mousedown="handleChangeCamera('down')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-left hand-direction"
@mousedown="handleChangeCamera('left')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
src="@/assets/home-imgs/control-2-arrow.png"
/>
@ -118,11 +114,13 @@
<span>缩放</span>
<img
style="margin-bottom: 2px"
@click="handleChangeZoomCamera('ZoomIn')"
@mousedown="handleChangeZoomCamera('ZoomIn')"
@mouseup="handleStopDeviceCameraZoom()"
src="@/assets/home-imgs/control-2-add.png"
/>
<img
@click="handleChangeZoomCamera('ZoomOut')"
@mousedown="handleChangeZoomCamera('ZoomOut')"
@mouseup="handleStopDeviceCameraZoom()"
src="@/assets/home-imgs/control-2-reduce.png"
/>
</div>
@ -146,28 +144,24 @@
class="arrow-top"
@mousedown="handleChangeRobot('5')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-right"
@mousedown="handleChangeRobot('8')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-bottom"
@mousedown="handleChangeRobot('6')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
<img
class="arrow-left"
@mousedown="handleChangeRobot('7')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
src="@/assets/home-imgs/control-2-arrow.png"
/>
@ -457,6 +451,68 @@ const beforeUpload = ({ file }) => {
return true
}
// 判断当前机器人是否在 巡检中 如果在巡检中 则不可进行任何操作 可弹框提示客户暂停巡检 然后重新获取机器人状态再进行操作
const handleInspection = async () => {
// if (robotBaseInfo.value.type.includes('巡检')) {
// // 弹框提示客户暂停巡检 然后重新获取机器人状态再进行操作
// dialog.warning({
// title: '提示',
// content: '当前机器人正在巡检中，可暂停巡检后再进行操作',
// positiveText: '暂停巡检',
// negativeText: '取消',
// onPositiveClick: async () => {
// const { data: res } = await handleRobotActionApi({
// puId: robotData.robotInfo?.puId,
// type: '15',
// })
// if (res.code == 200) {
// message.success('已暂停巡检')
// getRobotBaseInfo()
// } else {
// message.error('暂停巡检失败' + res.message)
// }
// },
// onNegativeClick: () => {
// return
// },
// })
// }
if (robotBaseInfo.value.type.includes('巡检')) {
return new Promise((resolve) => {
dialog.warning({
title: '提示',
content: '当前机器人正在巡检中，可暂停巡检后再进行操作',
positiveText: '暂停巡检',
negativeText: '取消',
onPositiveClick: async () => {
try {
const { data: res } = await handleRobotActionApi({
puId: robotData.robotInfo?.puId,
type: '15',
})
if (res.code == 200) {
message.success('已暂停巡检')
getRobotBaseInfo()
resolve(false) // 已暂停巡检，返回false表示不处于巡检状态
} else {
message.error('暂停巡检失败' + res.message)
resolve(true) // 暂停失败，仍然处于巡检状态
}
} catch (error) {
message.error('暂停巡检出错')
resolve(true) // 出错时，假设仍然处于巡检状态
}
},
onNegativeClick: () => {
resolve(true) // 用户取消，仍然处于巡检状态
},
})
})
}
return false // 不包含"巡检"，返回false表示不处于巡检状态
}
// 上传音频
const handleChangeUpload = async (e) => {
const file = e.file
@ -598,11 +654,16 @@ const handleStopDeviceCameraZoom = async () => {
puid: '201115200268437643',
})
isStopLeft.value = true
console.log(res, '停止位置---')
}
// 操控机器人上方的摄像头
const handleChangeCamera = debounce(async (motion) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
if (motion === 'stop' && isZoom.value) {
isStopLeft.value = true
handleStopDeviceCameraZoom()
@ -629,6 +690,10 @@ const handleChangeCamera = debounce(async (motion) => {
// 球机缩放
const handleChangeZoomCamera = async (motion) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
isStopLeft.value = false
isZoom.value = true
if (motion === 'ZoomIn') {
@ -648,6 +713,10 @@ const handleChangeZoomCamera = async (motion) => {
// 操控机器人
const handleChangeRobot = debounce(async (type) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
// type 5 前进 6 后退 7 左转 8 右转
if (!robotData.robotInfo?.puId) {
message.error('当前机器人未连接', {
@ -708,7 +777,6 @@ const handlePlayAudio = async () => {
}
// 音量选择
const handleChangeVolume = debounce(async (value) => {
const { data: res } = await handleRobotActionApi({
puId: robotData.robotInfo?.puId,

84
src/views/home/components/modal-content/control-deck.vue
View File

@ -12,7 +12,6 @@
alt=""
@mousedown="handleChangeCamera('up')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
/>
<img
class="arrow-right hand-direction"
@ -20,7 +19,6 @@
alt=""
@mousedown="handleChangeCamera('right')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
/>
<img
class="arrow-bottom hand-direction"
@ -28,7 +26,6 @@
alt=""
@mousedown="handleChangeCamera('down')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
/>
<img
class="arrow-left hand-direction"
@ -36,7 +33,6 @@
alt=""
@mousedown="handleChangeCamera('left')"
@mouseup="handleChangeCamera('stop')"
@mouseleave="handleChangeCamera('stop')"
/>
<!-- 中间的按钮 -->
@ -56,12 +52,14 @@
<img
style="margin-left: 20px; transform: rotate(-90deg)"
src="@/assets/home-imgs/control-2-add.png"
@click="handleChangeZoomCamera('ZoomIn')"
@mousedown="handleChangeZoomCamera('ZoomIn')"
@mouseup="handleStopDeviceCameraZoom()"
/>
<img
style="margin-left: 50px; transform: rotate(-90deg)"
src="@/assets/home-imgs/control-2-reduce.png"
@click="handleChangeZoomCamera('ZoomOut')"
@mousedown="handleChangeZoomCamera('ZoomOut')"
@mouseup="handleStopDeviceCameraZoom()"
/>
</div>
</div>
@ -73,7 +71,6 @@
<img
@mousedown="handleChangeRobot('5')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
class="arrow-top"
src="@/assets/home-imgs/control-2-arrow.png"
alt=""
@ -81,7 +78,6 @@
<img
@mousedown="handleChangeRobot('8')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
class="arrow-right"
src="@/assets/home-imgs/control-2-arrow.png"
alt=""
@ -89,7 +85,6 @@
<img
@mousedown="handleChangeRobot('6')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
class="arrow-bottom"
src="@/assets/home-imgs/control-2-arrow.png"
alt=""
@ -97,7 +92,6 @@
<img
@mousedown="handleChangeRobot('7')"
@mouseup="handleChangeRobot(9)"
@mouseleave="handleChangeRobot(9)"
class="arrow-left"
src="@/assets/home-imgs/control-2-arrow.png"
alt=""
@ -138,6 +132,7 @@ const message = useMessage()
const isStopLeft = ref(false)
const isStopRight = ref(false)
const isZoom = ref(false)
const robotBaseInfo = ref({})
const props = defineProps({
deviceToken: {
@ -149,8 +144,59 @@ const props = defineProps({
default: () => {},
},
})
// 获取机器人的基础信息
const getRobotBaseInfo = async () => {
const { data: res } = await handleRobotActionApi({
puId: deviceInfo.value?.puId,
type: '1',
})
robotBaseInfo.value = res.data
}
// 判断当前机器人是否在 巡检中 如果在巡检中 则不可进行任何操作 可弹框提示客户暂停巡检 然后重新获取机器人状态再进行操作
const handleInspection = async () => {
if (robotBaseInfo.value.type.includes('巡检')) {
return new Promise((resolve) => {
dialog.warning({
title: '提示',
content: '当前机器人正在巡检中，可暂停巡检后再进行操作',
positiveText: '暂停巡检',
negativeText: '取消',
onPositiveClick: async () => {
try {
const { data: res } = await handleRobotActionApi({
puId: robotData.robotInfo?.puId,
type: '15',
})
if (res.code == 200) {
message.success('已暂停巡检')
getRobotBaseInfo()
resolve(false) // 已暂停巡检，返回false表示不处于巡检状态
} else {
message.error('暂停巡检失败' + res.message)
resolve(true) // 暂停失败，仍然处于巡检状态
}
} catch (error) {
message.error('暂停巡检出错')
resolve(true) // 出错时，假设仍然处于巡检状态
}
},
onNegativeClick: () => {
resolve(true) // 用户取消，仍然处于巡检状态
},
})
})
}
return false // 不包含"巡检"，返回false表示不处于巡检状态
}
// 停止缩放
const handleStopDeviceCameraZoom = async () => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
isZoom.value = false
const res = await stopDeviceCameraZoomApi({
token: props.deviceToken,
@ -158,15 +204,19 @@ const handleStopDeviceCameraZoom = async () => {
idx: 0,
})
isStopLeft.value = true
console.log(res, '停止位置---')
}
// 操控机器人上方的摄像头
const handleChangeCamera = debounce(async (motion) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
if (motion === 'stop' && isZoom.value) {
isStopLeft.value = true
handleStopDeviceCameraZoom()
return
}
if (motion === 'stop') {
@ -190,6 +240,10 @@ const handleChangeCamera = debounce(async (motion) => {
// 球机缩放
const handleChangeZoomCamera = async (motion) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
isStopLeft.value = false
isZoom.value = true
if (motion === 'ZoomIn') {
@ -209,6 +263,10 @@ const handleChangeZoomCamera = async (motion) => {
// 操控机器人
const handleChangeRobot = debounce(async (type) => {
const isInspection = await handleInspection()
if (isInspection) {
return
}
// type 5 前进 6 后退 7 左转 8 右转 9 停止
if (!robotData.robotInfo?.puId) {
message.error('当前机器人未连接', {
@ -231,7 +289,9 @@ const handleChangeRobot = debounce(async (type) => {
}
}, 600)
onMounted(async () => {})
onMounted(async () => {
getRobotBaseInfo()
})
</script>
<style lang="scss" scoped>
.control-deck {