Compare commits
2 Commits
1cd4cb815c
...
09b6dcbb19
Author | SHA1 | Date | |
---|---|---|---|
|
09b6dcbb19 | ||
|
539e8b7d01 |
@ -207,6 +207,12 @@ export class PlatformState extends GraphicStateBase implements IPlatformState {
|
|||||||
set rtuId(value: number) {
|
set rtuId(value: number) {
|
||||||
this.states.rtuId = value;
|
this.states.rtuId = value;
|
||||||
}
|
}
|
||||||
|
get bizWaitTimeSec(): number {
|
||||||
|
return this.states.bizWaitStartTimeSec;
|
||||||
|
}
|
||||||
|
set bizWaitTimeSec(value: number) {
|
||||||
|
this.states.bizWaitStartTimeSec = value;
|
||||||
|
}
|
||||||
get states(): state.Platform {
|
get states(): state.Platform {
|
||||||
return this.getState<state.Platform>();
|
return this.getState<state.Platform>();
|
||||||
}
|
}
|
||||||
|
@ -11,6 +11,7 @@ import {
|
|||||||
} from 'jl-graphic';
|
} from 'jl-graphic';
|
||||||
import { Station } from '../station/Station';
|
import { Station } from '../station/Station';
|
||||||
import { Section } from '../section/Section';
|
import { Section } from '../section/Section';
|
||||||
|
import { useLineStore } from 'src/stores/line-store';
|
||||||
|
|
||||||
export interface IPlatformData extends GraphicData {
|
export interface IPlatformData extends GraphicData {
|
||||||
get code(): string; // 编号
|
get code(): string; // 编号
|
||||||
@ -66,6 +67,8 @@ export interface IPlatformState extends GraphicState {
|
|||||||
set stopTime(v: number);
|
set stopTime(v: number);
|
||||||
get rtuId(): number; // 集中站站号
|
get rtuId(): number; // 集中站站号
|
||||||
set rtuId(v: number);
|
set rtuId(v: number);
|
||||||
|
get bizWaitTimeSec(): number; //乘客等待秒数
|
||||||
|
set bizWaitTimeSec(v: number);
|
||||||
}
|
}
|
||||||
|
|
||||||
//站台颜色
|
//站台颜色
|
||||||
@ -189,6 +192,8 @@ class codeGraph extends Container {
|
|||||||
runLevel: VectorText = new VectorText(''); //运行等级
|
runLevel: VectorText = new VectorText(''); //运行等级
|
||||||
runTime: VectorText = new VectorText(''); //运行时间
|
runTime: VectorText = new VectorText(''); //运行时间
|
||||||
stopTime: VectorText = new VectorText(''); //停站时间
|
stopTime: VectorText = new VectorText(''); //停站时间
|
||||||
|
waitSec: VectorText = new VectorText(); //VectorText
|
||||||
|
|
||||||
circle: Graphics = new Graphics();
|
circle: Graphics = new Graphics();
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
@ -197,12 +202,14 @@ class codeGraph extends Container {
|
|||||||
this.addChild(this.circle);
|
this.addChild(this.circle);
|
||||||
this.addChild(this.stopTime);
|
this.addChild(this.stopTime);
|
||||||
this.addChild(this.runTime);
|
this.addChild(this.runTime);
|
||||||
|
this.addChild(this.waitSec);
|
||||||
this.character.setVectorFontSize(platformConsts.besideFontSize);
|
this.character.setVectorFontSize(platformConsts.besideFontSize);
|
||||||
this.runLevel.setVectorFontSize(platformConsts.besideFontSize);
|
this.runLevel.setVectorFontSize(platformConsts.besideFontSize);
|
||||||
this.stopTime.setVectorFontSize(platformConsts.besideFontSize);
|
this.stopTime.setVectorFontSize(platformConsts.besideFontSize);
|
||||||
this.runTime.setVectorFontSize(platformConsts.besideFontSize);
|
this.runTime.setVectorFontSize(platformConsts.besideFontSize);
|
||||||
|
this.waitSec.setVectorFontSize(platformConsts.besideFontSize);
|
||||||
}
|
}
|
||||||
draw(): void {
|
draw(datas: IPlatformData): void {
|
||||||
//扣车
|
//扣车
|
||||||
const character = this.character;
|
const character = this.character;
|
||||||
character.text = 'H';
|
character.text = 'H';
|
||||||
@ -254,11 +261,25 @@ class codeGraph extends Container {
|
|||||||
platformConsts.besideSpacing
|
platformConsts.besideSpacing
|
||||||
);
|
);
|
||||||
stopTime.style.fill = PlatformColorEnum.whiteNumbers;
|
stopTime.style.fill = PlatformColorEnum.whiteNumbers;
|
||||||
|
//乘客等待时间
|
||||||
|
const waitSec = this.waitSec;
|
||||||
|
|
||||||
|
waitSec.anchor.set(0.5);
|
||||||
|
let yPos = platformConsts.height / 2 + platformConsts.doorPlatformSpacing;
|
||||||
|
|
||||||
|
if (datas.direction == 'down') {
|
||||||
|
yPos = -platformConsts.height / 2 - platformConsts.doorPlatformSpacing;
|
||||||
|
}
|
||||||
|
waitSec.position.set(0, yPos);
|
||||||
|
|
||||||
|
waitSec.style.fill = PlatformColorEnum.whiteNumbers;
|
||||||
|
|
||||||
character.visible = false;
|
character.visible = false;
|
||||||
circle.visible = false;
|
circle.visible = false;
|
||||||
runLevel.visible = false;
|
runLevel.visible = false;
|
||||||
stopTime.visible = false;
|
stopTime.visible = false;
|
||||||
runTime.visible = false;
|
runTime.visible = false;
|
||||||
|
waitSec.visible = false;
|
||||||
}
|
}
|
||||||
clear(): void {
|
clear(): void {
|
||||||
this.character.destroy();
|
this.character.destroy();
|
||||||
@ -309,6 +330,21 @@ class codeGraph extends Container {
|
|||||||
this.stopTime.visible = true;
|
this.stopTime.visible = true;
|
||||||
this.stopTime.text = stateData.stopTime;
|
this.stopTime.text = stateData.stopTime;
|
||||||
}
|
}
|
||||||
|
if (stateData.bizWaitTimeSec && useLineStore().faultStatistics) {
|
||||||
|
const minutes = Math.floor(stateData.bizWaitTimeSec / 60);
|
||||||
|
const seconds = stateData.bizWaitTimeSec % 60;
|
||||||
|
let minutesString = '' + minutes;
|
||||||
|
let secondsString = '' + seconds;
|
||||||
|
if (minutes < 10) {
|
||||||
|
minutesString = `0${minutes}`;
|
||||||
|
}
|
||||||
|
if (seconds < 10) {
|
||||||
|
secondsString = `0${seconds}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.waitSec.visible = true;
|
||||||
|
this.waitSec.text = `乘客已经等待了${minutesString}:${secondsString}`;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//子元素--站台旁菱形图标
|
//子元素--站台旁菱形图标
|
||||||
@ -388,7 +424,7 @@ export class Platform extends JlGraphic {
|
|||||||
}
|
}
|
||||||
this.platformGraphic.draw(this.states);
|
this.platformGraphic.draw(this.states);
|
||||||
this.besideGraphic.draw();
|
this.besideGraphic.draw();
|
||||||
this.codeGraph.draw();
|
this.codeGraph.draw(this.datas);
|
||||||
|
|
||||||
this.doorGraphic.position.set(
|
this.doorGraphic.position.set(
|
||||||
0,
|
0,
|
||||||
|
@ -52,7 +52,7 @@
|
|||||||
@click="backConfirm"
|
@click="backConfirm"
|
||||||
/>
|
/>
|
||||||
<q-toggle
|
<q-toggle
|
||||||
v-model="faultStatistics"
|
v-model="lineStore.faultStatistics"
|
||||||
checked-icon="check"
|
checked-icon="check"
|
||||||
color="red"
|
color="red"
|
||||||
label="故障信息统计"
|
label="故障信息统计"
|
||||||
@ -156,7 +156,6 @@ const router = useRouter();
|
|||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const lineStore = useLineStore();
|
const lineStore = useLineStore();
|
||||||
const lineNetStore = useLineNetStore();
|
const lineNetStore = useLineNetStore();
|
||||||
const faultStatistics = ref(false);
|
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => route.path,
|
() => route.path,
|
||||||
|
@ -3,14 +3,40 @@
|
|||||||
<q-page-container style="padding: 0; overflow: hidden">
|
<q-page-container style="padding: 0; overflow: hidden">
|
||||||
<div id="line-app-container"></div>
|
<div id="line-app-container"></div>
|
||||||
</q-page-container>
|
</q-page-container>
|
||||||
|
<div
|
||||||
|
v-if="faultInfo"
|
||||||
|
style="position: fixed; right: 0; top: 10%; background: white"
|
||||||
|
>
|
||||||
|
<div style="width: 100%; text-align: right" class="bg-primary q-pa-ms">
|
||||||
|
<q-icon
|
||||||
|
name="close"
|
||||||
|
size="xs"
|
||||||
|
style="cursor: pointer"
|
||||||
|
@click="() => (faultInfo = false)"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="q-pa-ms column" style="background: white">
|
||||||
|
<template v-for="(item, index) in timeInfoLabel" :key="index">
|
||||||
|
<q-chip
|
||||||
|
removable
|
||||||
|
@remove="handleRemoveInfo(index)"
|
||||||
|
color="primary"
|
||||||
|
text-color="white"
|
||||||
|
square
|
||||||
|
:label="item"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</q-page>
|
</q-page>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, onUnmounted, watch } from 'vue';
|
import { onMounted, onUnmounted, watch, ref, reactive } from 'vue';
|
||||||
import { useLineStore } from 'src/stores/line-store';
|
import { useLineStore } from 'src/stores/line-store';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import { useLineNetStore } from 'src/stores/line-net-store';
|
import { AlarmInfo, useLineNetStore } from 'src/stores/line-net-store';
|
||||||
|
import { showAlertTypeData } from 'src/components/alarm/alarmInfoEnum';
|
||||||
|
|
||||||
const props = withDefaults(
|
const props = withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
@ -22,6 +48,10 @@ const props = withDefaults(
|
|||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const lineStore = useLineStore();
|
const lineStore = useLineStore();
|
||||||
const lineNetStore = useLineNetStore();
|
const lineNetStore = useLineNetStore();
|
||||||
|
const faultInfo = ref(false);
|
||||||
|
const alarmInfoList: AlarmInfo[] = reactive([]);
|
||||||
|
let timeInterval = null;
|
||||||
|
let timeInfoLabel: string[] = reactive([]);
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => props.sizeHeight,
|
() => props.sizeHeight,
|
||||||
@ -36,11 +66,40 @@ watch(
|
|||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => faultInfo.value,
|
||||||
|
() => {
|
||||||
|
if (!faultInfo.value) {
|
||||||
|
alarmInfoList.splice(0, 1);
|
||||||
|
timeInfoLabel.splice(0);
|
||||||
|
timeInterval = null;
|
||||||
|
} else {
|
||||||
|
timeInterval = setInterval(() => {
|
||||||
|
const now = Date.now();
|
||||||
|
// const labels: string[] = [];
|
||||||
|
timeInfoLabel.splice(0);
|
||||||
|
alarmInfoList.forEach((info) => {
|
||||||
|
const date = info.alert_time.substring(0, 19).replace('T', ' ');
|
||||||
|
let infoTime = new Date(date).getTime();
|
||||||
|
console.log(date, new Date(date), infoTime, now, 'now');
|
||||||
|
const distance = formatTime((now - infoTime) / 1000);
|
||||||
|
const label = handleShowLabel(info);
|
||||||
|
timeInfoLabel.push(label + '--' + distance);
|
||||||
|
});
|
||||||
|
}, 1000);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => lineNetStore.alarmInfo,
|
() => lineNetStore.alarmInfo,
|
||||||
(val) => {
|
(val) => {
|
||||||
if (val.length) {
|
if (val.length) {
|
||||||
centerFaultDevice();
|
centerFaultDevice();
|
||||||
|
val.forEach((info) => {
|
||||||
|
alarmInfoList.push(info);
|
||||||
|
});
|
||||||
|
faultInfo.value = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
@ -80,7 +139,41 @@ function centerFaultDevice() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function handleShowLabel(alarmInfo: AlarmInfo) {
|
||||||
|
const type = (showAlertTypeData as never)[alarmInfo.alert_type + ''];
|
||||||
|
const device = alarmInfo.alert_object.replace(/\[|]/g, '');
|
||||||
|
return device + '[' + type + ']';
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleRemoveInfo(index: number) {
|
||||||
|
alarmInfoList.splice(index, 1);
|
||||||
|
timeInfoLabel.splice(index, 1);
|
||||||
|
if (!alarmInfoList.length) {
|
||||||
|
faultInfo.value = false;
|
||||||
|
}
|
||||||
|
console.log(alarmInfoList, faultInfo.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatTime(seconds: number) {
|
||||||
|
// 确保输入是整数
|
||||||
|
seconds = Math.floor(seconds);
|
||||||
|
|
||||||
|
// 计算小时、分钟和秒
|
||||||
|
const hours = Math.floor(seconds / 3600);
|
||||||
|
const minutes = Math.floor((seconds % 3600) / 60);
|
||||||
|
const secs = (seconds % 3600) % 60;
|
||||||
|
console.log(hours, minutes, secs, seconds, 'sec');
|
||||||
|
// 确保小时、分钟和秒都是两位数
|
||||||
|
const hours1 = String(hours).padStart(2, '0');
|
||||||
|
const minutes1 = String(minutes).padStart(2, '0');
|
||||||
|
const secs1 = String(secs).padStart(2, '0');
|
||||||
|
|
||||||
|
// 返回格式化的时间字符串
|
||||||
|
return `${hours1}:${minutes1}:${secs1}`;
|
||||||
|
}
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
lineStore.cancelSubscribe();
|
lineStore.cancelSubscribe();
|
||||||
|
timeInterval = null;
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -13,6 +13,7 @@ export const useLineStore = defineStore('line', {
|
|||||||
selectedGraphics: null as JlGraphic[] | null,
|
selectedGraphics: null as JlGraphic[] | null,
|
||||||
lineId: null as number | null,
|
lineId: null as number | null,
|
||||||
lineName: null as string | null,
|
lineName: null as string | null,
|
||||||
|
faultStatistics: false,
|
||||||
}),
|
}),
|
||||||
getters: {
|
getters: {
|
||||||
selectedGraphicType: (state) => {
|
selectedGraphicType: (state) => {
|
||||||
|
@ -1 +1 @@
|
|||||||
Subproject commit c1bd5beb501ab675459a5ef58d823c0f86be9000
|
Subproject commit 0f95f00449d14672b382f03727b34e339131786b
|
Loading…
Reference in New Issue
Block a user