显示控制调整
This commit is contained in:
dong
parent
4db8ff4095
commit
6f65060cde
@ -5,7 +5,6 @@ import {
|
||||
IGraphicApp,
|
||||
newGraphicApp,
|
||||
IGraphicStorage,
|
||||
IGraphicScene,
|
||||
} from 'src/jl-graphic';
|
||||
import { TrainState } from './graphics/TrainInteraction';
|
||||
import { Train, TrainTemplate } from 'src/graphics/train/Train';
|
||||
@ -172,6 +171,7 @@ export function initLineApp(): IGraphicApp {
|
||||
lineApp = newGraphicApp({
|
||||
dataLoader: loadLineDatas,
|
||||
});
|
||||
lineApp.initScene('lineApp', {});
|
||||
const graphicTemplate = [
|
||||
new TrainTemplate(new TrainState()),
|
||||
new SignalTemplate(new SignalData(), new SignalState()),
|
||||
@ -204,18 +204,16 @@ export function initLineApp(): IGraphicApp {
|
||||
// viewportDrag: true,
|
||||
// wheelZoom: true,
|
||||
// },
|
||||
// interactiveTypeOptions: {
|
||||
// interactiveGraphicTypeIncludes: [
|
||||
// Signal.Type,
|
||||
// Platform.Type,
|
||||
// Station.Type,
|
||||
// SectionLink.Type,
|
||||
// Train.Type,
|
||||
// Turnout.Type,
|
||||
// Section.Type,
|
||||
// Transponder.Type,
|
||||
// ],
|
||||
// },
|
||||
// interactiveGraphicTypeIncludes: [
|
||||
// Signal.Type,
|
||||
// Platform.Type,
|
||||
// Station.Type,
|
||||
// SectionLink.Type,
|
||||
// Train.Type,
|
||||
// Turnout.Type,
|
||||
// Section.Type,
|
||||
// Transponder.Type,
|
||||
// ],
|
||||
// });
|
||||
SignalOperateInteraction.init(lineApp);
|
||||
PlatformOperateInteraction.init(lineApp);
|
||||
@ -233,143 +231,150 @@ export function initLineApp(): IGraphicApp {
|
||||
};
|
||||
DefaultCanvasMenu.open(e.global);
|
||||
});
|
||||
|
||||
handleEvent(lineApp);
|
||||
lineApp.on('postdataloaded', () => {
|
||||
ControlShowType();
|
||||
});
|
||||
return lineApp;
|
||||
}
|
||||
|
||||
// function handleEvent(app: IGraphicScene) {
|
||||
// // app.on('postdataloaded', () => {
|
||||
// // storage.CalculateLink.forEach((link) => {
|
||||
// // const linkData = new LinkData(link);
|
||||
// // const template = app.getGraphicTemplatesByType(linkData.graphicType);
|
||||
// // const g = template.new();
|
||||
// // linkData.id = g.id;
|
||||
// // g.loadData(linkData);
|
||||
// // app.addGraphics(g);
|
||||
// // });
|
||||
// // });
|
||||
function handleEvent(app: IGraphicApp) {
|
||||
// app.on('postdataloaded', () => {
|
||||
// storage.CalculateLink.forEach((link) => {
|
||||
// const linkData = new LinkData(link);
|
||||
// const template = app.getGraphicTemplatesByType(linkData.graphicType);
|
||||
// const g = template.new();
|
||||
// linkData.id = g.id;
|
||||
// g.loadData(linkData);
|
||||
// app.addGraphics(g);
|
||||
// });
|
||||
// });
|
||||
|
||||
// const route = useRoute();
|
||||
// const mapId = route.query.mapId as string;
|
||||
// const simulationId = route.query.simulationId;
|
||||
// const lineStore = useLineStore();
|
||||
// const showTypeList: string[] = [];
|
||||
// layerList.forEach((item) => {
|
||||
// if (item.defaultShow) {
|
||||
// showTypeList.push(item.value);
|
||||
// }
|
||||
// });
|
||||
// if (lineApp) {
|
||||
// const alllGraphic = (lineApp as IGraphicApp).queryStore.getAllGraphics();
|
||||
// alllGraphic.forEach((g) => {
|
||||
// if (showTypeList.includes(g.type)) {
|
||||
// g.visible = true;
|
||||
// } else {
|
||||
// g.visible = false;
|
||||
// }
|
||||
// if (g.type == Transponder.Type) {
|
||||
// // 应答器不显示名称
|
||||
// (g as Transponder).labelGraphic.visible = false;
|
||||
// }
|
||||
// });
|
||||
// lineStore.setShowLayer(showTypeList);
|
||||
// }
|
||||
// app.enableWsMassaging({
|
||||
// engine: ClientEngine.Centrifugo,
|
||||
// wsUrl: `${getWebsocketUrl()}`,
|
||||
// token: getOnlyToken() as string,
|
||||
// });
|
||||
// app.subscribe({
|
||||
// // destination: `/simulation/${simulationId}/devices/status`,
|
||||
// destination: `simulation-${simulationId}-devices-status`,
|
||||
// messageConverter: (message: Uint8Array) => {
|
||||
// // console.log('收到消息', message);
|
||||
// const states: GraphicState[] = [];
|
||||
// const storage = state.PushedDevicesStatus.deserialize(message);
|
||||
// if (storage.all) {
|
||||
// storage.allStatus.sectionState.forEach((item) => {
|
||||
// if (state.SectionType[item.type] == 'Axle') {
|
||||
// //计轴区段
|
||||
// // states.push(new AxleCountingState(item));
|
||||
// } else if (state.SectionType[item.type] == 'Logic') {
|
||||
// // 逻辑区段
|
||||
// // states.push(new LogicSectionState(item));
|
||||
// } else if (state.SectionType[item.type] == 'Physic') {
|
||||
// // 物理区段
|
||||
// // states.push(new SectionState(item));
|
||||
// }
|
||||
// });
|
||||
// storage.allStatus.switchState.forEach((item) => {
|
||||
// // 道岔
|
||||
// states.push(new TurnoutStates(item));
|
||||
// });
|
||||
// storage.allStatus.trainState.forEach((item) => {
|
||||
// // 列车
|
||||
// if (!item.show) {
|
||||
// // 移除列车
|
||||
// const train = app.queryStore.queryByCodeAndType(
|
||||
// item.id,
|
||||
// Train.Type
|
||||
// );
|
||||
// if (train) {
|
||||
// app.deleteGraphics(train);
|
||||
// }
|
||||
// } else {
|
||||
// states.push(new TrainState(item));
|
||||
// }
|
||||
// });
|
||||
// } else {
|
||||
// storage.varStatus.updatedSection.forEach((item) => {
|
||||
// if (state.SectionType[item.type] == 'Axle') {
|
||||
// //计轴区段
|
||||
// // states.push(new AxleCountingState(item));
|
||||
// } else if (state.SectionType[item.type] == 'Logic') {
|
||||
// // 逻辑区段
|
||||
// // states.push(new LogicSectionState(item));
|
||||
// } else if (state.SectionType[item.type] == 'Physic') {
|
||||
// // 物理区段
|
||||
// // states.push(new SectionState(item));
|
||||
// }
|
||||
// });
|
||||
// storage.varStatus.updatedSwitch.forEach((item) => {
|
||||
// // 道岔
|
||||
// states.push(new TurnoutStates(item));
|
||||
// });
|
||||
// storage.varStatus.updatedTrain.forEach((item) => {
|
||||
// // 列车
|
||||
// states.push(new TrainState(item));
|
||||
// });
|
||||
// storage.varStatus.removedTrainId.forEach((item) => {
|
||||
// // 移除列车
|
||||
// const train = app.queryStore.queryByCodeAndType(item, Train.Type);
|
||||
// if (train) {
|
||||
// app.deleteGraphics(train);
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// if (states && states.length > 0) {
|
||||
// lineStore.setSocketStates(states);
|
||||
// }
|
||||
// return states;
|
||||
// },
|
||||
// });
|
||||
const route = useRoute();
|
||||
const simulationId = route.query.simulationId;
|
||||
const lineStore = useLineStore();
|
||||
|
||||
// let msgNotify: null | ((props?: QNotifyUpdateOptions | undefined) => void) =
|
||||
// null;
|
||||
// app.on('websocket-connect-state-change', (connected) => {
|
||||
// if (!connected && !msgNotify) {
|
||||
// msgNotify = Notify.create({
|
||||
// type: 'negative',
|
||||
// timeout: 0,
|
||||
// position: 'top-right',
|
||||
// message: '通信链接已断开！',
|
||||
// });
|
||||
// } else if (msgNotify && connected) {
|
||||
// msgNotify();
|
||||
// msgNotify = null;
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
app.enableWsMassaging({
|
||||
engine: ClientEngine.Centrifugo,
|
||||
wsUrl: `${getWebsocketUrl()}`,
|
||||
token: getOnlyToken() as string,
|
||||
});
|
||||
app.subscribe({
|
||||
// destination: `/simulation/${simulationId}/devices/status`,
|
||||
destination: `simulation-${simulationId}-devices-status`,
|
||||
messageConverter: (message: Uint8Array) => {
|
||||
// console.log('收到消息', message);
|
||||
const states: GraphicState[] = [];
|
||||
const storage = state.PushedDevicesStatus.deserialize(message);
|
||||
if (storage.all) {
|
||||
storage.allStatus.sectionState.forEach((item) => {
|
||||
if (state.SectionType[item.type] == 'Axle') {
|
||||
//计轴区段
|
||||
// states.push(new AxleCountingState(item));
|
||||
} else if (state.SectionType[item.type] == 'Logic') {
|
||||
// 逻辑区段
|
||||
// states.push(new LogicSectionState(item));
|
||||
} else if (state.SectionType[item.type] == 'Physic') {
|
||||
// 物理区段
|
||||
// states.push(new SectionState(item));
|
||||
}
|
||||
});
|
||||
storage.allStatus.switchState.forEach((item) => {
|
||||
// 道岔
|
||||
states.push(new TurnoutStates(item));
|
||||
});
|
||||
storage.allStatus.trainState.forEach((item) => {
|
||||
// 列车
|
||||
if (!item.show) {
|
||||
// 移除列车
|
||||
const train = app.queryStore.queryByCodeAndType(
|
||||
item.id,
|
||||
Train.Type
|
||||
);
|
||||
if (train) {
|
||||
app.deleteGraphics(train);
|
||||
}
|
||||
} else {
|
||||
states.push(new TrainState(item));
|
||||
}
|
||||
});
|
||||
} else {
|
||||
storage.varStatus.updatedSection.forEach((item) => {
|
||||
if (state.SectionType[item.type] == 'Axle') {
|
||||
//计轴区段
|
||||
// states.push(new AxleCountingState(item));
|
||||
} else if (state.SectionType[item.type] == 'Logic') {
|
||||
// 逻辑区段
|
||||
// states.push(new LogicSectionState(item));
|
||||
} else if (state.SectionType[item.type] == 'Physic') {
|
||||
// 物理区段
|
||||
// states.push(new SectionState(item));
|
||||
}
|
||||
});
|
||||
storage.varStatus.updatedSwitch.forEach((item) => {
|
||||
// 道岔
|
||||
states.push(new TurnoutStates(item));
|
||||
});
|
||||
storage.varStatus.updatedTrain.forEach((item) => {
|
||||
// 列车
|
||||
states.push(new TrainState(item));
|
||||
});
|
||||
storage.varStatus.removedTrainId.forEach((item) => {
|
||||
// 移除列车
|
||||
const train = app.queryStore.queryByCodeAndType(item, Train.Type);
|
||||
if (train) {
|
||||
app.deleteGraphics(train);
|
||||
}
|
||||
});
|
||||
}
|
||||
if (states && states.length > 0) {
|
||||
lineStore.setSocketStates(states);
|
||||
}
|
||||
return states;
|
||||
},
|
||||
});
|
||||
|
||||
let msgNotify: null | ((props?: QNotifyUpdateOptions | undefined) => void) =
|
||||
null;
|
||||
app.on('websocket-connect-state-change', (connected) => {
|
||||
if (!connected && !msgNotify) {
|
||||
msgNotify = Notify.create({
|
||||
type: 'negative',
|
||||
timeout: 0,
|
||||
position: 'top-right',
|
||||
message: '通信链接已断开！',
|
||||
});
|
||||
} else if (msgNotify && connected) {
|
||||
msgNotify();
|
||||
msgNotify = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function ControlShowType() {
|
||||
const lineStore = useLineStore();
|
||||
const showTypeList: string[] = [];
|
||||
layerList.forEach((item) => {
|
||||
if (item.defaultShow) {
|
||||
showTypeList.push(item.value);
|
||||
}
|
||||
});
|
||||
if (lineApp) {
|
||||
const alllGraphic = (lineApp as IGraphicApp).queryStore.getAllGraphics();
|
||||
alllGraphic.forEach((g) => {
|
||||
if (showTypeList.includes(g.type)) {
|
||||
g.visible = true;
|
||||
} else {
|
||||
g.visible = false;
|
||||
}
|
||||
if (g.type == Transponder.Type) {
|
||||
// 应答器不显示名称
|
||||
(g as Transponder).labelGraphic.visible = false;
|
||||
}
|
||||
});
|
||||
lineStore.setShowLayer(showTypeList);
|
||||
}
|
||||
}
|
||||
|
||||
export async function loadLineDatas(): Promise<IGraphicStorage> {
|
||||
const route = useRoute();
|
||||
|
||||
Loading…
Reference in New Issue
Block a user