joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

tms

Browse Source
This commit is contained in:
Yuan 2023-11-10 10:55:42 +08:00
parent 907a88c6ea
commit dd4bbab000
1 changed files with 58 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
src/views/jlmap3d/drive/sceneview/tmsPage.vue
View File

@ -18,7 +18,9 @@
<td>{{ trainInfo.voltage }}V</td>
<td>{{ trainInfo.current }}A</td>
<td>{{ trainInfo.speed }} km/h</td>
<td :class="{ bg_g: trainInfo.traction > 0, bg_r: trainInfo.traction < 0 }">{{ trainInfo.traction }}%</td>
<td :class="{ bg_g: trainInfo.tractionPercent > 0, bg_r: trainInfo.tractionPercent < 0 }">
{{ Math.abs(trainInfo.tractionPercent) }}%
</td>
<td>{{ trainInfo.mileage || '--' }}</td>
<td>{{ trainInfo.nextStation }}</td>
<td>{{ trainInfo.destination }}</td>
@ -97,7 +99,17 @@
<td :class="{ bg_g: item }" v-for="(item, j) in v" :key="j">{{ item ? '' : '-- --' }}</td></template
>
<td v-if="i === 0" :rowspan="Object.keys(carInfo).length + 1">
<img class="speedBg" :src="localStatic + '/jl3d/tms/PMS3.png'" />
<div class="speedBg" :style="{ backgroundImage: `url('${localStatic}/jl3d/tms/PMS3.png')` }">
<div
id="accBar"
:style="{
transform: `scaleY(${Math.abs(trainInfo.tractionPercent) / 100})`,
background: trainInfo.tractionPercent > 0 ? '#0f0' : '#f00',
}"
></div>
<div style="width: 6px;"></div>
<div id="speedBar" :style="{ transform: `scaleY(${trainInfo.speed / 80})` }"></div>
</div>
<div>{{ trainInfo.speed }} km/h</div>
</td>
</tr>
@ -111,7 +123,6 @@
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
import { creatSubscribe, clearSubscribe, getTopic } from '@/utils/stomp';
import { getToken } from '@/utils/auth';
import { defaultCallback, stateCallback, diagramSimCallback } from '@/utils/subscribeCallback';
let timer = null;
@ -123,11 +134,11 @@ export default {
trainInfo: {
voltage: 1600,
current: 317,
speed: 102,
traction: 3,
speed: 0,
tractionPercent: 0,
mileage: '--',
nextStation: 'XX站',
destination: 'YY站',
nextStation: '',
destination: '',
},
carInfo: {
辅助状态: ['ON', '--', 'OFF', '--', '--', 'ON'],
@ -159,18 +170,22 @@ export default {
subscribe() {
const header = { group: this.group || '', 'X-Token': getToken() };
creatSubscribe(getTopic('TMS', this.group), header, msg => {
const res = JSON.parse(msg.body);
this.trainInfo.current = res.current;
this.trainInfo.voltage = res.voltage;
this.trainInfo.speed = res.speed;
this.trainInfo.traction = res.tbLevelPercent;
this.trainInfo.mileage = res.mileage;
this.trainInfo.nextStation = res.nextStation;
this.trainInfo.destination = res.destination;
this.carInfo.制动缸压力 = Array(6).fill(res.pressureOfBrakeCylinder);
this.carInfo['1侧门'] = res.oneSideDoorOpened;
this.carInfo['2侧门'] = res.twoSideDoorOpened;
this.carInfo.停放制动施加状态 = Array(6).fill(res.parkingBreakPressure);
let res = JSON.parse(msg.body);
console.log(res);
if (!res) return;
if (res.current) this.trainInfo.current = res.current;
if (res.voltage) this.trainInfo.voltage = res.voltage;
if (res.speed) this.trainInfo.speed = res.speed.toFixed(2);
if (res.tbLevelPercent) this.trainInfo.tractionPercent = res.tbLevelPercent;
if (res.mileage) this.trainInfo.mileage = res.mileage;
if (res.nextStation) this.trainInfo.nextStation = res.nextStation;
if (res.destination) this.trainInfo.destination = res.destination;
if (res.pressureOfBrakeCylinder)
this.carInfo.制动缸压力 = Array(6).fill(res.pressureOfBrakeCylinder.toFixed(2));
if (res.oneSideDoorOpened) this.carInfo['1侧门'] = res.oneSideDoorOpened;
if (res.twoSideDoorOpened) this.carInfo['2侧门'] = res.twoSideDoorOpened;
if (res.parkingBreakPressure) this.carInfo.停放制动施加状态 = Array(6).fill(res.parkingBreakPressure);
this.setTractionWave(res.traction);
});
},
@ -200,6 +215,13 @@ export default {
display: flex;
justify-content: center;
align-items: center;
.bg_g {
background: #0f0;
color: #000;
}
.bg_r {
background: #f00;
}
#content {
width: 60%;
height: 60%;
@ -250,15 +272,25 @@ export default {
}
}
}
.bg_g {
background: #0f0;
color: #000;
}
.bg_r {
background: #f00;
}
.speedBg {
height: 90%;
padding: 2px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
display: flex;
justify-content: center;
div {
width: 20px;
transform-origin: bottom;
transform: scaleY(0.5);
}
#accBar {
background: #0f0;
}
#speedBar {
background: #0ff;
}
}
}
}