Skip to content

F
FleetTruckView
Commit 9cf31528 authored by 高晓帆's avatar 高晓帆
Browse files
Options

change:softDrivingPattern

parent cdb6ace1
Hide whitespace changes
Inline Side-by-side
Showing with 288 additions and 1208 deletions
.history/src/views/BasicMessage_20230724113600.vue deleted 100644 → 0
View file @ cdb6ace1
<template>
<div class="basic-message">
<div class="basic-title">
<p>
<span>基础信息</span>
<Icon class="basic-close" type="ios-close-circle-outline" @click="handleClose" />
</p>
<i class="basic-title-line"></i>
</div>
<div class="basic">
<div class="basic-top">
<i :class="['vehicle-state', vehicleState]" @click="showStates"></i>
<span class="vehicle-msg">
<span>{{pattern == 0 ? '司机' : '安全员'}}：{{name}}</span>
<span>工号：{{number}}</span>
</span>
</div>
<ul class="basic-middle">
<li v-for="item in list" :key="item.index">
<span class="middle-img" :style="`background-image: url('/image/ic_${item.name}.png')`">
{{basicMid[item.title] || 0}}{{item.unit}}
</span>
<span>{{item.label}}</span>
</li>
</ul>
</div>
<ul class="basic-info">
<li v-for="item in infos" :key="item.index">
<p v-for="list in item" :key="list.name">
<span class="label">{{list.label}}：</span>
<span v-if="list.fixed">{{ debug[list.name] ? debug[list.name].toFixed(list.fixed) : list.default }}</span>
<span v-else>{{debug[list.name] || list.default}}</span>
</p>
</li>
</ul>
</div>
</template>
<script setup>
import { reactive, markRaw, ref, watch, computed } from 'vue';
import { useVehicleStore } from '@/store/VehicleStore.js'
import { useStateStore } from '@/store/StateStore.js'
import { storeToRefs } from 'pinia'
const BASIC_MESSAGE_INFO = [
[
{
name: 'target_velocity',
label: '速度(线控)',
default: 0,
fixed: 1,
},
{
name: 'steerangle',
label: '转向',
default: '——',
},
],
[
{
name: 'dump_bed',
label: '举升',
default: '——',
},
{
name: 'throttlecmd',
label: '油门',
default: '——',
},
],
[
{
name: 'Retarder_cmd',
label: '制动',
default: '——',
},
],
[
{
name: 'lateralDeviation',
label: '横向偏差',
default: 0.00,
},
],
[
{
name: 'courseDeviation',
label: '航向偏差',
default: 0.00,
},
],
[
{
name: 'obstacleFrontDistance',
label: '前向障碍物距离',
fixed: 2,
default: 0.00,
},
],
[
{
name: 'obstacleBackDistance',
label: '后向障碍物距离',
fixed: 2,
default: 0.00,
},
],
[
{
name: 'obstacleBackBarriDistance',
label: '后向挡墙距离',
fixed: 2,
default: 0.00,
},
],
]
const VEHICLE_TIRES = [
{
name: 'front_right',
icon: 'ic_tireLeft',
tire: 'tire0'
},
{
name: 'back_right_inside',
icon: 'ic_tireMiddle',
tire: 'tire1'
},
{
name: 'back_right_outside',
icon: 'ic_tireRight',
tire: 'tire2'
},
{
name: 'front_left',
icon: 'ic_tireLeft',
tire: 'tire3'
},
{
name: 'back_left_inside',
icon: 'ic_tireMiddle',
tire: 'tire4'
},
{
name: 'back_left_outside',
icon: 'ic_tireRight',
tire: 'tire5'
}
]
const BASIC_MESSAGE = [
{
label: '载重量',
name: 'weight',
title: 'vehicleLoad',
unit: 'T'
},
{
label: '时速(rosbeacon)',
name: 'speed',
title: 'vehicleSpeed',
unit: 'Km/h'
},
{
label: '油量',
name: 'oil',
title: 'oil',
unit: '%'
},
]
const list = markRaw(BASIC_MESSAGE)
const infos = markRaw(BASIC_MESSAGE_INFO)
const debug = ref({})
const name = ref('')
const number = ref('')
let basicMid = reactive({})
const vehicleStore = useVehicleStore()
const vehicleStoreToRefs = storeToRefs(vehicleStore)
const { getVehicleDebug, getVehicleBasic, getCurrentBasic} = vehicleStoreToRefs
const stateStore = useStateStore()
const stateStoreToRefs = storeToRefs(stateStore)
const { getLoginAck } = stateStoreToRefs
const emits = defineEmits(['handleClose', 'showModal'])
const vehicleState = computed(() => {
const {isError} = vehicleStoreToRefs
return isError.value
})
const pattern = computed(() => {
const {pattern} = vehicleStoreToRefs
return pattern.value
})
function handleClose() {
emits('handleClose')
}
function showStates() {
if (vehicleState.value === 'normal') return
emits('showModal', {name: 'states'})
}
watch([getVehicleDebug, getLoginAck, getVehicleBasic, getCurrentBasic], ([debugValue, loginAckValue, vehicleBasic, currentBasic]) => {
if (debugValue) {
debug.value = debugValue
}
if (loginAckValue) {
name.value = loginAckValue.name
number.value = loginAckValue.number
}
if (vehicleBasic) {
const {oil} = vehicleBasic
basicMid['oil'] = oil ? oil.toFixed(2) : 0
}
if (currentBasic) {
const {vehicleLoad, vehicleSpeed} = currentBasic
let result = {
vehicleLoad: vehicleLoad ? vehicleLoad.toFixed(2) : 0,
vehicleSpeed: vehicleSpeed ? vehicleSpeed.toFixed(2) : 0,
oil: basicMid.oil
}
basicMid = Object.assign(basicMid, result)
}
}, {
immediate: true
})
</script>
<style lang="less" scoped>
.basic-message {
.basic-title {
padding: 5px 20px 10px;
color: #fff;
position: relative;
p {
display: flex;
align-items: center;
justify-content: space-between;
span:nth-child(1) {
margin-left: 10px;
}
}
.basic-close {
color: #63A9FB;
cursor: pointer;
}
.basic-title-line {
display: inline-block;
background: url('/image/basic-title.png') no-repeat;
background-size: cover;
width: 100%;
height: 10px;
position: absolute;
}
}
.basic {
color: #fff;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
.basic-top {
display: flex;
align-items: center;
width: 100%;
padding-left: 10px;
margin-bottom: 10px;
.vehicle-state {
display: inline-block;
width: 6vw;
height: 6vw;
background-size: contain;
background-repeat: no-repeat;
margin-right: 10px;
cursor: pointer;
}
@media screen and (min-width: 1400px) {
.vehicle-state {
width: 5vw;
height: 5vw;
}
}
.normal {
background-image: url('/image/heal_normal.png');
}
.fault {
background-image: url('/image/heal_fault.png');
}
.warning {
background-image: url('/image/heal_warning.png');
}
.vehicle-msg {
display: flex;
flex-direction: column;
span {
line-height: 5vh;
display: inline-block;
}
}
}
.basic-middle {
display: flex;
width: 100%;
justify-content: space-between;
li {
text-align: center;
padding: 10px;
display: flex;
flex-direction: column;
align-items: center;
.middle-img {
display: block;
width: 6vw;
height: 6vw;
min-width: 50px;
min-height: 50px;
background-size: cover;
line-height: 7vw;
text-align: center;
}
@media screen and (min-width: 1400px) {
.middle-img {
width: 5vw;
height: 5vw;
line-height: 5vw;
}
}
@media screen and (max-width: 631px) {
.middle-img {
line-height: 9vw;
}
}
}
}
}
.basic-info {
color: #fff;
padding: 10px 20px;
margin-top: 10px;
li {
display: flex;
p {
min-width: 50%;
white-space: nowrap;
}
.label {
color: #63A9FB;
}
}
}
}
</style>
\ No newline at end of file
.history/src/views/BasicMessage_20231127111113.vue deleted 100644 → 0
View file @ cdb6ace1
<template>
<div class="basic-message">
<div class="basic-title">
<p>
<span>基础信息</span>
<Icon class="basic-close" type="ios-close-circle-outline" @click="handleClose" />
</p>
<i class="basic-title-line"></i>
</div>
<div class="basic">
<div class="basic-top">
<i :class="['vehicle-state', vehicleState]" @click="showStates"></i>
<span class="vehicle-msg">
<span>{{softDrivingPattern == 0 ? '司机' : '安全员'}}：{{name}}</span>
<span>工号：{{number}}</span>
</span>
</div>
<ul class="basic-middle">
<li v-for="item in list" :key="item.index">
<span class="middle-img" :style="`background-image: url('/image/ic_${item.name}.png')`">
{{basicMid[item.title] || 0}}{{item.unit}}
</span>
<span>{{item.label}}</span>
</li>
</ul>
</div>
<ul class="basic-info">
<li v-for="item in infos" :key="item.index">
<p v-for="list in item" :key="list.name">
<span class="label">{{list.label}}：</span>
<span v-if="list.fixed">{{ debug[list.name] ? debug[list.name].toFixed(list.fixed) : list.default }}</span>
<span v-else>{{debug[list.name] || list.default}}</span>
</p>
</li>
</ul>
</div>
</template>
<script setup>
import { reactive, markRaw, ref, watch, computed } from 'vue';
import { useVehicleStore } from '@/store/VehicleStore.js'
import { useStateStore } from '@/store/StateStore.js'
import { storeToRefs } from 'pinia'
const BASIC_MESSAGE_INFO = [
[
{
name: 'target_velocity',
label: '速度(线控)',
default: 0,
fixed: 1,
},
{
name: 'steerangle',
label: '转向',
default: '——',
},
],
[
{
name: 'dump_bed',
label: '举升',
default: '——',
},
{
name: 'throttlecmd',
label: '油门',
default: '——',
},
],
[
{
name: 'Retarder_cmd',
label: '制动',
default: '——',
},
],
[
{
name: 'lateralDeviation',
label: '横向偏差',
default: 0.00,
},
],
[
{
name: 'courseDeviation',
label: '航向偏差',
default: 0.00,
},
],
[
{
name: 'obstacleFrontDistance',
label: '前向障碍物距离',
fixed: 2,
default: 0.00,
},
],
[
{
name: 'obstacleBackDistance',
label: '后向障碍物距离',
fixed: 2,
default: 0.00,
},
],
[
{
name: 'obstacleBackBarriDistance',
label: '后向挡墙距离',
fixed: 2,
default: 0.00,
},
],
]
const VEHICLE_TIRES = [
{
name: 'front_right',
icon: 'ic_tireLeft',
tire: 'tire0'
},
{
name: 'back_right_inside',
icon: 'ic_tireMiddle',
tire: 'tire1'
},
{
name: 'back_right_outside',
icon: 'ic_tireRight',
tire: 'tire2'
},
{
name: 'front_left',
icon: 'ic_tireLeft',
tire: 'tire3'
},
{
name: 'back_left_inside',
icon: 'ic_tireMiddle',
tire: 'tire4'
},
{
name: 'back_left_outside',
icon: 'ic_tireRight',
tire: 'tire5'
}
]
const BASIC_MESSAGE = [
{
label: '载重量',
name: 'weight',
title: 'vehicleLoad',
unit: 'T'
},
{
label: '时速(rosbeacon)',
name: 'speed',
title: 'vehicleSpeed',
unit: 'Km/h'
},
{
label: '油量',
name: 'oil',
title: 'oil',
unit: '%'
},
]
const list = markRaw(BASIC_MESSAGE)
const infos = markRaw(BASIC_MESSAGE_INFO)
const debug = ref({})
const name = ref('')
const number = ref('')
let basicMid = reactive({})
const vehicleStore = useVehicleStore()
const vehicleStoreToRefs = storeToRefs(vehicleStore)
const { getVehicleDebug, getVehicleBasic, getCurrentBasic} = vehicleStoreToRefs
const stateStore = useStateStore()
const stateStoreToRefs = storeToRefs(stateStore)
const { getLoginAck } = stateStoreToRefs
const emits = defineEmits(['handleClose', 'showModal'])
const vehicleState = computed(() => {
const {isError} = vehicleStoreToRefs
return isError.value
})
const pattern = computed(() => {
const {softDrivingPattern} = vehicleStoreToRefs
return softDrivingPattern.value
})
function handleClose() {
emits('handleClose')
}
function showStates() {
if (vehicleState.value === 'normal') return
emits('showModal', {name: 'states'})
}
watch([getVehicleDebug, getLoginAck, getVehicleBasic, getCurrentBasic], ([debugValue, loginAckValue, vehicleBasic, currentBasic]) => {
if (debugValue) {
debug.value = debugValue
}
if (loginAckValue) {
name.value = loginAckValue.name
number.value = loginAckValue.number
}
if (vehicleBasic) {
const {oil} = vehicleBasic
basicMid['oil'] = oil ? oil.toFixed(2) : 0
}
if (currentBasic) {
const {vehicleLoad, vehicleSpeed} = currentBasic
let result = {
vehicleLoad: vehicleLoad ? vehicleLoad.toFixed(2) : 0,
vehicleSpeed: vehicleSpeed ? vehicleSpeed.toFixed(2) : 0,
oil: basicMid.oil
}
basicMid = Object.assign(basicMid, result)
}
}, {
immediate: true
})
</script>
<style lang="less" scoped>
.basic-message {
.basic-title {
padding: 5px 20px 10px;
color: #fff;
position: relative;
p {
display: flex;
align-items: center;
justify-content: space-between;
span:nth-child(1) {
margin-left: 10px;
}
}
.basic-close {
color: #63A9FB;
cursor: pointer;
}
.basic-title-line {
display: inline-block;
background: url('/image/basic-title.png') no-repeat;
background-size: cover;
width: 100%;
height: 10px;
position: absolute;
}
}
.basic {
color: #fff;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
.basic-top {
display: flex;
align-items: center;
width: 100%;
padding-left: 10px;
margin-bottom: 10px;
.vehicle-state {
display: inline-block;
width: 6vw;
height: 6vw;
background-size: contain;
background-repeat: no-repeat;
margin-right: 10px;
cursor: pointer;
}
@media screen and (min-width: 1400px) {
.vehicle-state {
width: 5vw;
height: 5vw;
}
}
.normal {
background-image: url('/image/heal_normal.png');
}
.fault {
background-image: url('/image/heal_fault.png');
}
.warning {
background-image: url('/image/heal_warning.png');
}
.vehicle-msg {
display: flex;
flex-direction: column;
span {
line-height: 5vh;
display: inline-block;
}
}
}
.basic-middle {
display: flex;
width: 100%;
justify-content: space-between;
li {
text-align: center;
padding: 10px;
display: flex;
flex-direction: column;
align-items: center;
.middle-img {
display: block;
width: 6vw;
height: 6vw;
min-width: 50px;
min-height: 50px;
background-size: cover;
line-height: 7vw;
text-align: center;
}
@media screen and (min-width: 1400px) {
.middle-img {
width: 5vw;
height: 5vw;
line-height: 5vw;
}
}
@media screen and (max-width: 631px) {
.middle-img {
line-height: 9vw;
}
}
}
}
}
.basic-info {
color: #fff;
padding: 10px 20px;
margin-top: 10px;
li {
display: flex;
p {
min-width: 50%;
white-space: nowrap;
}
.label {
color: #63A9FB;
}
}
}
}
</style>
\ No newline at end of file
.history/src/views/ModeSwitch_20230724113600.vue deleted 100644 → 0
View file @ cdb6ace1
<template>
<div class="mode-switch">
<div class="content">
<p>{{content}}</p>
<p>{{contentTip}}</p>
</div>
<div class="footer">
<Button class="btn" type="info" @click="doSure" v-show="isShowSure">{{sureText}}</Button>
<Button type="error" @click="doCancel">{{cancelText}}</Button>
</div>
</div>
</template>
<script setup>
import { watch, ref } from 'vue'
import { useVehicleStore } from '../store/VehicleStore';
import { storeToRefs } from 'pinia';
let modeTimer = null
const CLOSE_MODE_TIME = 5 * 1000
const props = defineProps({
isShow: Boolean
})
const content = ref('')
const contentTip = ref('')
const isShowSure = ref(true)
const sureText = ref('确定')
const cancelText = ref('取消')
const step = ref(0)
const vehicleStore = useVehicleStore()
const vehicleStoreToRefs = storeToRefs(vehicleStore)
const { pattern, patternAck, singleTrackAck } = vehicleStoreToRefs
const emits = defineEmits(['handleSend', 'closeModal'])
function doSure() {
let type = null, iscontinue = null
// 有人——无人
if (pattern.value === 0) {
if (step.value === 1) {
type = 0
content.value = '正在等待机群批准模式切换请求'
step.value = 2
} else if (step.value === 3) {
type = 2
iscontinue = 1
content.value = '模式切换审批成功，正在接管无人驾驶'
step.value = 4
}
} else {
// 有人——无人
if (step.value === 1) {
type = 2
content.value = '正在取消无人驾驶接管'
step.value = 4
}
}
isShowSure.value = false
cancelText.value = '取消'
const changePattern = pattern.value === 0 ? 1 : 0
emits('handleSend', {
type: '/pattern/req',
msg: {
type,
pattern: changePattern,
iscontinue
}
})
}
function doCancel() {
if ([2, 3, 4].includes(step.value)) {
// type === 1:取消云端请求；type === 3:取消车端请求
let type = step.value === 2 ? 1 : 3
let iscontinue = null
// 切换为无人驾驶，并且不继续上一次任务
if (pattern.value === 0 && step.value === 3) {
iscontinue = 0
type = 2
content.value = '模式切换审批成功，正在接管无人驾驶'
step.value = 4
isShowSure.value = false
cancelText.value = '取消'
}
const changePattern = pattern.value === 0 ? 1 : 0
emits('handleSend', {
type: '/pattern/req',
msg: {
type,
pattern: changePattern,
iscontinue
}
})
} else {
emits('closeModal')
}
}
function doCloseMode() {
emits('closeModal')
if (modeTimer) {
clearTimeout(modeTimer)
modeTimer = null
}
}
watch(() => props.isShow, (value) => {
if (value) {
step.value = 1
isShowSure.value = true
sureText.value = '确定'
cancelText.value = '取消'
// 有人——无人
if (pattern.value === 0) {
const { singleTrackEnable } = singleTrackAck.value || {}
if (singleTrackEnable) {
content.value = '当前处于单机循迹模式，是否切换无人模式'
contentTip.value = '(确保当前位置处于路线中)'
} else {
content.value = '切换为无人驾驶模式需要发送机群确认'
contentTip.value = ''
}
} else {
content.value = '是否切换为有人驾驶模式'
contentTip.value = ''
}
}
}, {
immediate: true
})
watch(patternAck, (result) => {
console.log(result)
if (!result) return
contentTip.value = ''
const { singleTrackEnable } = singleTrackAck.value || {}
if (modeTimer) {
clearTimeout(modeTimer)
modeTimer = null
}
const {type, pattern: resultPattern, status} = result
if (step.value === 2) {
isShowSure.value = false
cancelText.value = '确定'
if (type === 0) {
switch (status) {
case 0:
if (singleTrackEnable) {
emits('handleSend', {
type: '/pattern/req',
msg: {
type: 2,
pattern: 1,
iscontinue: 0
}
})
} else {
content.value = '是否继续上一次任务（确保车辆位置未变动）'
step.value = 3
isShowSure.value = true
sureText.value = '是'
cancelText.value = '否'
}
break
case 1:
content.value = '模式切换请求未获得批准'
break
case 2:
content.value = '请先完成此设备的点检工作'
break
case 200:
content.value = '参数校验失败'
break
}
} else {
switch (status) {
case 0:
content.value = '成功'
break
case 1:
content.value = '失败'
break
case 200:
content.value = '参数校验失败'
break
}
step.value = 0
modeTimer = setTimeout(doCloseMode, CLOSE_MODE_TIME)
}
} else if (step.value === 4) {
isShowSure.value = false
cancelText.value = '确定'
if (type === 2) {
switch (status) {
case 0:
content.value = resultPattern === 1 ? '接管成功' : '取消接管成功'
break
case 1:
content.value = resultPattern === 1 ? '接管失败' : '取消接管失败'
break
case 200:
content.value = '参数校验失败'
break
}
} else {
switch (status) {
case 0:
content.value = '成功'
break
case 1:
content.value = '失败'
break
case 200:
content.value = '参数校验失败'
break
}
}
step.value = 0
modeTimer = setTimeout(doCloseMode, CLOSE_MODE_TIME)
}
}, {
deep: true
})
</script>
<style lang="less" scoped>
.mode-switch {
.content {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 30px;
}
.footer {
text-align: end;
.btn {
margin-right: 10px;
}
}
}
</style>
\ No newline at end of file
.history/src/views/ModeSwitch_20231127111111.vue deleted 100644 → 0
View file @ cdb6ace1
<template>
<div class="mode-switch">
<div class="content">
<p>{{content}}</p>
<p>{{contentTip}}</p>
</div>
<div class="footer">
<Button class="btn" type="info" @click="doSure" v-show="isShowSure">{{sureText}}</Button>
<Button type="error" @click="doCancel">{{cancelText}}</Button>
</div>
</div>
</template>
<script setup>
import { watch, ref } from 'vue'
import { useVehicleStore } from '../store/VehicleStore';
import { storeToRefs } from 'pinia';
let modeTimer = null
const CLOSE_MODE_TIME = 5 * 1000
const props = defineProps({
isShow: Boolean
})
const content = ref('')
const contentTip = ref('')
const isShowSure = ref(true)
const sureText = ref('确定')
const cancelText = ref('取消')
const step = ref(0)
const vehicleStore = useVehicleStore()
const vehicleStoreToRefs = storeToRefs(vehicleStore)
const { pattern,softDrivingPattern, patternAck, singleTrackAck } = vehicleStoreToRefs
const emits = defineEmits(['handleSend', 'closeModal'])
function doSure() {
let type = null, iscontinue = null
// 有人——无人
if (softDrivingPattern.value === 0) {
if (step.value === 1) {
type = 0
content.value = '正在等待机群批准模式切换请求'
step.value = 2
} else if (step.value === 3) {
type = 2
iscontinue = 1
content.value = '模式切换审批成功，正在接管无人驾驶'
step.value = 4
}
} else {
// 有人——无人
if (step.value === 1) {
type = 2
content.value = '正在取消无人驾驶接管'
step.value = 4
}
}
isShowSure.value = false
cancelText.value = '取消'
const changePattern = softDrivingPattern.value === 0 ? 1 : 0
emits('handleSend', {
type: '/pattern/req',
msg: {
type,
pattern: changePattern,
iscontinue
}
})
}
function doCancel() {
if ([2, 3, 4].includes(step.value)) {
// type === 1:取消云端请求；type === 3:取消车端请求
let type = step.value === 2 ? 1 : 3
let iscontinue = null
// 切换为无人驾驶，并且不继续上一次任务
if (softDrivingPattern.value === 0 && step.value === 3) {
iscontinue = 0
type = 2
content.value = '模式切换审批成功，正在接管无人驾驶'
step.value = 4
isShowSure.value = false
cancelText.value = '取消'
}
const changePattern = softDrivingPattern.value === 0 ? 1 : 0
emits('handleSend', {
type: '/pattern/req',
msg: {
type,
pattern: changePattern,
iscontinue
}
})
} else {
emits('closeModal')
}
}
function doCloseMode() {
emits('closeModal')
if (modeTimer) {
clearTimeout(modeTimer)
modeTimer = null
}
}
watch(() => props.isShow, (value) => {
if (value) {
step.value = 1
isShowSure.value = true
sureText.value = '确定'
cancelText.value = '取消'
// 有人——无人
if (softDrivingPattern.value === 0) {
const { singleTrackEnable } = singleTrackAck.value || {}
if (singleTrackEnable) {
content.value = '当前处于单机循迹模式，是否切换无人模式'
contentTip.value = '(确保当前位置处于路线中)'
} else {
content.value = '切换为无人驾驶模式需要发送机群确认'
contentTip.value = ''
}
} else {
content.value = '是否切换为有人驾驶模式'
contentTip.value = ''
}
}
}, {
immediate: true
})
watch(patternAck, (result) => {
console.log(result)
if (!result) return
contentTip.value = ''
const { singleTrackEnable } = singleTrackAck.value || {}
if (modeTimer) {
clearTimeout(modeTimer)
modeTimer = null
}
const {type, pattern: resultPattern, status} = result
if (step.value === 2) {
isShowSure.value = false
cancelText.value = '确定'
if (type === 0) {
switch (status) {
case 0:
if (singleTrackEnable) {
emits('handleSend', {
type: '/pattern/req',
msg: {
type: 2,
pattern: 1,
iscontinue: 0
}
})
} else {
content.value = '是否继续上一次任务（确保车辆位置未变动）'
step.value = 3
isShowSure.value = true
sureText.value = '是'
cancelText.value = '否'
}
break
case 1:
content.value = '模式切换请求未获得批准'
break
case 2:
content.value = '请先完成此设备的点检工作'
break
case 200:
content.value = '参数校验失败'
break
}
} else {
switch (status) {
case 0:
content.value = '成功'
break
case 1:
content.value = '失败'
break
case 200:
content.value = '参数校验失败'
break
}
step.value = 0
modeTimer = setTimeout(doCloseMode, CLOSE_MODE_TIME)
}
} else if (step.value === 4) {
isShowSure.value = false
cancelText.value = '确定'
if (type === 2) {
switch (status) {
case 0:
content.value = resultPattern === 1 ? '接管成功' : '取消接管成功'
break
case 1:
content.value = resultPattern === 1 ? '接管失败' : '取消接管失败'
break
case 200:
content.value = '参数校验失败'
break
}
} else {
switch (status) {
case 0:
content.value = '成功'
break
case 1:
content.value = '失败'
break
case 200:
content.value = '参数校验失败'
break
}
}
step.value = 0
modeTimer = setTimeout(doCloseMode, CLOSE_MODE_TIME)
}
}, {
deep: true
})
</script>
<style lang="less" scoped>
.mode-switch {
.content {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 30px;
}
.footer {
text-align: end;
.btn {
margin-right: 10px;
}
}
}
</style>
\ No newline at end of file
.history/src/views/SideBar_20231208175713.vue 0 → 100644
View file @ 9cf31528
<template>
<div class="side-bar">
<ul class="side-list">
<li v-if="isBasic"
data-name="basic_message"
class="active"
@click="doCheck">
<i :style="`background-image: url('/image/Info_white.png')`"></i>
<span>基本信息</span>
</li>
<li v-else
data-name="mode_information"
class="active"
@click="doCheck">
<i :style="`background-image: url('/image/debug_white.png')`"></i>
<span>调试信息</span>
</li>
<li v-for="item in list"
:key="item.index"
:data-name="item.name"
:class="active === item.name ? 'active' : ''"
@click="changeActive">
<i :class="item.name === 'mode_switch' ? isDisable : ''"
:style="`background-image: url('/image/${item.icon}${active === item.name ? '_white' : '_blue'}.png')`"></i>
<span :class="item.name === 'mode_switch' ? isDisable : ''">{{item.label}}</span>
</li>
</ul>
</div>
</template>
<script setup>
import { markRaw, ref, computed } from 'vue';
import { useVehicleStore } from '@/store/VehicleStore.js'
import { storeToRefs } from 'pinia'
import { Message } from 'view-ui-plus'
const SIDE_BAR = [
{
name: 'mode_switch',
label: '模式切换',
icon: 'pattern'
},
{
name: 'log',
label: '终端信息',
icon: 'log'
},
{
name: 'set',
label: '设置',
icon: 'set'
},
{
name: 'logout',
label: '退出',
icon: 'quit'
},
]
/**
* defineProps 和 defineEmits 都是只能在 <script setup> 中使用的编译器宏。
* 他们不需要导入，且会随着 <script setup> 的处理过程一同被编译掉。
* defineProps 接收与 props 选项相同的值，defineEmits 接收与 emits 选项相同的值
*/
const emit = defineEmits(['changeTab'])
const list = markRaw(SIDE_BAR)
const active = ref('basic_message')
const isBasic = ref(true)
const vehicleStore = useVehicleStore()
const vehicleStoreToRefs = storeToRefs(vehicleStore)
const isDisable = computed(() => {
const {isError, pattern} = vehicleStoreToRefs
if (isError.value === 'fault' && pattern.value === 0) {
return 'disabled'
}
return ''
})
function doCheck(evt) {
isBasic.value = !isBasic.value
const target = evt.currentTarget
const {name} = target.dataset
active.value = name === 'basic_message' ? 'mode_information' : 'basic_message'
emit('changeTab', active.value)
}
function changeActive(evt) {
const target = evt.currentTarget
const {name} = target.dataset
const {debuginfo} = vehicleStoreToRefs
const {Current_Gear,loadBrakeStatus}=debuginfo.value;
if (name === 'mode_switch' && isDisable.value === 'disabled') {
return
}
if(name=='mode_switch'){
if (!(['P', 126].includes(Current_Gear) || (['N', 0].includes(Current_Gear) && loadBrakeStatus != 0))) {
Message.error('不能切换无人模式')
return
}
}
active.value = name
emit('changeTab', name)
}
function changeMode() {
active.value = 'basic_message'
}
defineExpose({
changeMode
})
</script>
<style lang="less" scoped>
.side-list {
background: #202634;
color: #5490D6;
height: 100%;
overflow: auto;
li {
display: flex;
flex-direction: column;
align-items: center;
padding: .1rem;
cursor: pointer;
i {
display: inline-block;
width: 2.5vw;
height: 2.5vw;
background-size: cover;
}
&.active {
color: #fff;
}
}
.disabled {
cursor: not-allowed;
}
}
</style>
\ No newline at end of file
.history/src/views/SideBar_20231208180004.vue 0 → 100644
View file @ 9cf31528
<template>
<div class="side-bar">
<ul class="side-list">
<li v-if="isBasic"
data-name="basic_message"
class="active"
@click="doCheck">
<i :style="`background-image: url('/image/Info_white.png')`"></i>
<span>基本信息</span>
</li>
<li v-else
data-name="mode_information"
class="active"
@click="doCheck">
<i :style="`background-image: url('/image/debug_white.png')`"></i>
<span>调试信息</span>
</li>
<li v-for="item in list"
:key="item.index"
:data-name="item.name"
:class="active === item.name ? 'active' : ''"
@click="changeActive">
<i :class="item.name === 'mode_switch' ? isDisable : ''"
:style="`background-image: url('/image/${item.icon}${active === item.name ? '_white' : '_blue'}.png')`"></i>
<span :class="item.name === 'mode_switch' ? isDisable : ''">{{item.label}}</span>
</li>
</ul>
</div>
</template>
<script setup>
import { markRaw, ref, computed } from 'vue';
import { useVehicleStore } from '@/store/VehicleStore.js'
import { storeToRefs } from 'pinia'
import { Message } from 'view-ui-plus'
const SIDE_BAR = [
{
name: 'mode_switch',
label: '模式切换',
icon: 'pattern'
},
{
name: 'log',
label: '终端信息',
icon: 'log'
},
{
name: 'set',
label: '设置',
icon: 'set'
},
{
name: 'logout',
label: '退出',
icon: 'quit'
},
]
/**
* defineProps 和 defineEmits 都是只能在 <script setup> 中使用的编译器宏。
* 他们不需要导入，且会随着 <script setup> 的处理过程一同被编译掉。
* defineProps 接收与 props 选项相同的值，defineEmits 接收与 emits 选项相同的值
*/
const emit = defineEmits(['changeTab'])
const list = markRaw(SIDE_BAR)
const active = ref('basic_message')
const isBasic = ref(true)
const vehicleStore = useVehicleStore()
const vehicleStoreToRefs = storeToRefs(vehicleStore)
const isDisable = computed(() => {
const {isError, pattern , softDrivingPattern} = vehicleStoreToRefs
if (isError.value === 'fault' && softDrivingPattern.value === 0) {
return 'disabled'
}
return ''
})
function doCheck(evt) {
isBasic.value = !isBasic.value
const target = evt.currentTarget
const {name} = target.dataset
active.value = name === 'basic_message' ? 'mode_information' : 'basic_message'
emit('changeTab', active.value)
}
function changeActive(evt) {
const target = evt.currentTarget
const {name} = target.dataset
const {debuginfo} = vehicleStoreToRefs
const {Current_Gear,loadBrakeStatus}=debuginfo.value;
if (name === 'mode_switch' && isDisable.value === 'disabled') {
return
}
if(name=='mode_switch'){
if (!(['P', 126].includes(Current_Gear) || (['N', 0].includes(Current_Gear) && loadBrakeStatus != 0))) {
Message.error('不能切换无人模式')
return
}
}
active.value = name
emit('changeTab', name)
}
function changeMode() {
active.value = 'basic_message'
}
defineExpose({
changeMode
})
</script>
<style lang="less" scoped>
.side-list {
background: #202634;
color: #5490D6;
height: 100%;
overflow: auto;
li {
display: flex;
flex-direction: column;
align-items: center;
padding: .1rem;
cursor: pointer;
i {
display: inline-block;
width: 2.5vw;
height: 2.5vw;
background-size: cover;
}
&.active {
color: #fff;
}
}
.disabled {
cursor: not-allowed;
}
}
</style>
\ No newline at end of file
src/views/SideBar.vue
View file @ 9cf31528
...@@ -71,8 +71,8 @@ ...@@ -71,8 +71,8 @@
const vehicleStoreToRefs = storeToRefs(vehicleStore) const vehicleStoreToRefs = storeToRefs(vehicleStore)
const isDisable = computed(() => { const isDisable = computed(() => {
const {isError, pattern} = vehicleStoreToRefs const {isError, pattern , softDrivingPattern} = vehicleStoreToRefs
if (isError.value === 'fault' && pattern.value === 0) { if (isError.value === 'fault' && softDrivingPattern.value === 0) {
return 'disabled' return 'disabled'
} }
return '' return ''
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment