计轴
This commit is contained in:
parent
ad331085b4
commit
4559914091
@ -25,14 +25,33 @@
|
||||
lazy-rules
|
||||
autogrow
|
||||
/>
|
||||
<q-list bordered separator class="rounded-borders">
|
||||
<q-item>
|
||||
<q-item-section no-wrap class="q-gutter-y-sm column">
|
||||
<q-item-label> 关联的区段 </q-item-label>
|
||||
<div class="q-gutter-sm row">
|
||||
<q-chip
|
||||
v-for="item in sectionRelations"
|
||||
:key="item.id"
|
||||
square
|
||||
color="primary"
|
||||
text-color="white"
|
||||
>
|
||||
{{ item }}
|
||||
</q-chip>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-form>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { AxleCountingData } from 'src/drawApp/graphics/AxleCountingInteraction';
|
||||
import { AxleCounting } from 'src/graphics/axleCounting/AxleCounting';
|
||||
import { Section } from 'src/graphics/section/Section';
|
||||
import { useDrawStore } from 'src/stores/draw-store';
|
||||
import { onMounted, reactive, watch } from 'vue';
|
||||
import { computed, onMounted, reactive, watch } from 'vue';
|
||||
|
||||
const drawStore = useDrawStore();
|
||||
const axleCountingModel = reactive(new AxleCountingData());
|
||||
@ -62,4 +81,19 @@ function onUpdate() {
|
||||
.updateGraphicAndRecord(axleCounting, axleCountingModel);
|
||||
}
|
||||
}
|
||||
|
||||
const sectionRelations = computed(() => {
|
||||
const axleCounting = drawStore.selectedGraphic as AxleCounting;
|
||||
const sectionRelations =
|
||||
axleCounting?.relationManage.getRelationsOfGraphicAndOtherType(
|
||||
axleCounting,
|
||||
Section.Type
|
||||
);
|
||||
return sectionRelations.map(
|
||||
(relation) =>
|
||||
`${relation.getOtherGraphic<Section>(axleCounting).datas.code}(${
|
||||
relation.getOtherRelationParam(axleCounting).param
|
||||
})`
|
||||
);
|
||||
});
|
||||
</script>
|
||||
|
@ -37,11 +37,11 @@ export class AxleCountingData
|
||||
set kilometerCode(v: string) {
|
||||
this.data.kilometerCode = v;
|
||||
}
|
||||
get sectionId(): string[] {
|
||||
return this.data.sectionId;
|
||||
get axleCountingRef(): graphicData.RelatedRef[] {
|
||||
return this.data.axleCountingRef;
|
||||
}
|
||||
set sectionId(sectionIds: string[]) {
|
||||
this.data.sectionId = sectionIds;
|
||||
set axleCountingRef(points: graphicData.RelatedRef[]) {
|
||||
this.data.axleCountingRef=points
|
||||
}
|
||||
clone(): AxleCountingData {
|
||||
return new AxleCountingData(this.data.cloneMessage());
|
||||
|
@ -57,6 +57,12 @@ import {
|
||||
} from 'src/graphics/trainWindow/TrainWindow';
|
||||
import { TrainWindowDraw } from 'src/graphics/trainWindow/TrainWindowDrawAssistant';
|
||||
import { TrainWindowData } from './graphics/TrainWindowInteraction';
|
||||
import {
|
||||
AxleCounting,
|
||||
AxleCountingTemplate,
|
||||
} from 'src/graphics/axleCounting/AxleCounting';
|
||||
import { AxleCountingDraw } from 'src/graphics/axleCounting/AxleCountingDrawAssistant';
|
||||
import { AxleCountingData } from './graphics/AxleCountingInteraction';
|
||||
import { Turnout, TurnoutTemplate } from 'src/graphics/turnout/Turnout';
|
||||
import { TurnoutDraw } from 'src/graphics/turnout/TurnoutDrawAssistant';
|
||||
import { TurnoutData } from './graphics/TurnoutInteraction';
|
||||
@ -158,6 +164,7 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp {
|
||||
| TrainWindowDraw
|
||||
| TrainDraw
|
||||
| OneClickGenerateDraw
|
||||
| AxleCountingDraw
|
||||
)[] = [];
|
||||
if (draftType === 'Line') {
|
||||
drawAssistants = [
|
||||
@ -178,6 +185,10 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp {
|
||||
new TurnoutDraw(app, new TurnoutTemplate(new TurnoutData())),
|
||||
new TrainWindowDraw(app, new TrainWindowTemplate(new TrainWindowData())),
|
||||
new OneClickGenerateDraw(app, new OneClickGenerateTemplate()),
|
||||
new AxleCountingDraw(
|
||||
app,
|
||||
new AxleCountingTemplate(new AxleCountingData())
|
||||
),
|
||||
];
|
||||
DrawSignalInteraction.init(app);
|
||||
} else {
|
||||
@ -291,6 +302,9 @@ export function saveDrawDatas(app: JlDrawApp) {
|
||||
} else if (TrainWindow.Type === g.type) {
|
||||
const trainWindowData = (g as TrainWindow).saveData();
|
||||
storage.trainWindows.push((trainWindowData as TrainWindowData).data);
|
||||
} else if (AxleCounting.Type === g.type) {
|
||||
const axleCountingData = (g as AxleCounting).saveData();
|
||||
storage.axleCountings.push((axleCountingData as AxleCountingData).data);
|
||||
}
|
||||
});
|
||||
const base64 = fromUint8Array(storage.serialize());
|
||||
@ -358,6 +372,9 @@ export async function loadDrawDatas(app: GraphicApp) {
|
||||
storage.trainWindows.forEach((trainWindow) => {
|
||||
datas.push(new TrainWindowData(trainWindow));
|
||||
});
|
||||
storage.axleCountings.forEach((axleCounting) => {
|
||||
datas.push(new AxleCountingData(axleCounting));
|
||||
});
|
||||
app.loadGraphic(datas);
|
||||
} else {
|
||||
app.loadGraphic([]);
|
||||
|
@ -4,6 +4,7 @@ import { graphicData } from 'src/protos/stationLayoutGraphics';
|
||||
import { Turnout, TurnoutPort } from './turnout/Turnout';
|
||||
import { Section, SectionPort } from './section/Section';
|
||||
import { TrainWindow } from './trainWindow/TrainWindow';
|
||||
import { AxleCounting } from './axleCounting/AxleCounting';
|
||||
/**
|
||||
*
|
||||
* @param polygon
|
||||
@ -83,6 +84,7 @@ export function createRelatedRefProto(
|
||||
[Section.Type, graphicData.RelatedRef.DeviceType.Section],
|
||||
[Turnout.Type, graphicData.RelatedRef.DeviceType.Turnout],
|
||||
[TrainWindow.Type, graphicData.RelatedRef.DeviceType.TrainWindow],
|
||||
[AxleCounting.Type, graphicData.RelatedRef.DeviceType.AxleCounting],
|
||||
]);
|
||||
const protoDeviceType = typeMap.get(type);
|
||||
if (protoDeviceType === undefined) throw Error(`输入的type有误: ${type}`);
|
||||
|
@ -1,24 +1,32 @@
|
||||
import { Color, Container, Graphics } from 'pixi.js';
|
||||
import {
|
||||
GraphicData,
|
||||
GraphicRelationParam,
|
||||
JlGraphic,
|
||||
JlGraphicTemplate,
|
||||
VectorText,
|
||||
} from 'src/jl-graphic';
|
||||
import { Section, SectionPort } from '../section/Section';
|
||||
import {
|
||||
IRelatedRefData,
|
||||
createRelatedRefProto,
|
||||
protoPort2Data,
|
||||
} from '../CommonGraphics';
|
||||
import { Turnout } from '../turnout/Turnout';
|
||||
|
||||
export interface IAxleCountingData extends GraphicData {
|
||||
get code(): string; // 编号
|
||||
set code(v: string);
|
||||
get kilometerCode(): string; // 公里标
|
||||
set kilometerCode(v: string);
|
||||
get sectionId(): string[]; // 计轴两端的区段
|
||||
set sectionId(points: string[]);
|
||||
get axleCountingRef(): IRelatedRefData[]; //关联的设备
|
||||
set axleCountingRef(ref: IRelatedRefData[]);
|
||||
clone(): IAxleCountingData;
|
||||
copyFrom(data: IAxleCountingData): void;
|
||||
eq(other: IAxleCountingData): boolean;
|
||||
}
|
||||
|
||||
const AxleCountingConsts = {
|
||||
export const AxleCountingConsts = {
|
||||
radius: 6,
|
||||
borderWidth: 1,
|
||||
circleColorBlue: '0x08F80D',
|
||||
@ -28,6 +36,7 @@ const AxleCountingConsts = {
|
||||
kilometerCodeColor: '0xFFFFFF',
|
||||
kilometerCodeFontSize: 14,
|
||||
kilometerCodeOffsetY: 95,
|
||||
offsetSection: 50,
|
||||
};
|
||||
class TwoCircleGraphic extends Container {
|
||||
circleA: Graphics = new Graphics();
|
||||
@ -68,11 +77,13 @@ export class AxleCounting extends JlGraphic {
|
||||
static Type = 'AxleCounting';
|
||||
twoCircle: TwoCircleGraphic = new TwoCircleGraphic();
|
||||
kilometerGraph: VectorText = new VectorText(''); //公里标
|
||||
constructor() {
|
||||
direction: number;
|
||||
constructor(direction: number) {
|
||||
super(AxleCounting.Type);
|
||||
this.addChild(this.twoCircle);
|
||||
this.addChild(this.kilometerGraph);
|
||||
this.kilometerGraph.name = 'kilometer';
|
||||
this.direction = direction;
|
||||
}
|
||||
|
||||
get datas(): IAxleCountingData {
|
||||
@ -80,29 +91,59 @@ export class AxleCounting extends JlGraphic {
|
||||
}
|
||||
doRepaint(): void {
|
||||
this.twoCircle.draw();
|
||||
const kilometerGraph = this.kilometerGraph;
|
||||
const kilometerCode = this.datas?.kilometerCode || 12345.6789;
|
||||
if (Math.floor(Number(kilometerCode)).toString().length > 3) {
|
||||
const kiloBit = Math.floor(Number(kilometerCode) / 1000).toString();
|
||||
kilometerGraph.text =
|
||||
'K' +
|
||||
kiloBit +
|
||||
'+' +
|
||||
kilometerCode.toString().substring(kiloBit.length);
|
||||
} else {
|
||||
kilometerGraph.text = kilometerCode;
|
||||
}
|
||||
kilometerGraph.style.fill = AxleCountingConsts.kilometerCodeColor;
|
||||
kilometerGraph.setVectorFontSize(AxleCountingConsts.kilometerCodeFontSize);
|
||||
kilometerGraph.anchor.set(0.5);
|
||||
kilometerGraph.position.set(0, AxleCountingConsts.kilometerCodeOffsetY);
|
||||
kilometerGraph.rotation = -Math.PI / 2;
|
||||
if (this.datas.childTransforms?.length) {
|
||||
this.datas.childTransforms.forEach((child) => {
|
||||
if (child.name == 'kilometer') {
|
||||
const pos = child.transform.position;
|
||||
kilometerGraph.position.set(pos.x, pos.y);
|
||||
buildRelation() {
|
||||
this.queryStore.queryByType<Section>(Section.Type).forEach((section) => {
|
||||
const ps = section.localToCanvasPoint(section.getStartPoint());
|
||||
const pe = section.localToCanvasPoint(section.getEndPoint());
|
||||
let param = '';
|
||||
if (
|
||||
ps.x == this.x &&
|
||||
ps.y == this.y + AxleCountingConsts.offsetSection * this.direction
|
||||
) {
|
||||
param = SectionPort.A;
|
||||
}
|
||||
if (
|
||||
pe.x == this.x &&
|
||||
pe.y == this.y + AxleCountingConsts.offsetSection * this.direction
|
||||
) {
|
||||
param = SectionPort.B;
|
||||
}
|
||||
|
||||
if (param !== '') {
|
||||
this.relationManage.addRelation(
|
||||
this,
|
||||
new GraphicRelationParam(section, param)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
saveRelations() {
|
||||
const sectionRelations =
|
||||
this.relationManage.getRelationsOfGraphicAndOtherType(this, Section.Type);
|
||||
const datas: IRelatedRefData[] = [];
|
||||
sectionRelations.forEach((ref) => {
|
||||
const paDevice = ref.getOtherGraphic<Section | Turnout>(this);
|
||||
const data = createRelatedRefProto(
|
||||
paDevice.type,
|
||||
paDevice.id,
|
||||
ref.getOtherRelationParam(this).param
|
||||
);
|
||||
|
||||
datas.push(data);
|
||||
});
|
||||
this.datas.axleCountingRef = datas;
|
||||
}
|
||||
loadRelations(): void {
|
||||
if (this.datas.axleCountingRef.length) {
|
||||
this.datas.axleCountingRef.forEach((device) => {
|
||||
this.relationManage.addRelation(
|
||||
this,
|
||||
new GraphicRelationParam(
|
||||
this.queryStore.queryById(device.id),
|
||||
protoPort2Data(device.devicePort)
|
||||
)
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -115,7 +156,7 @@ export class AxleCountingTemplate extends JlGraphicTemplate<AxleCounting> {
|
||||
});
|
||||
}
|
||||
new(): AxleCounting {
|
||||
const axleCounting = new AxleCounting();
|
||||
const axleCounting = new AxleCounting(1);
|
||||
axleCounting.loadData(this.datas);
|
||||
return axleCounting;
|
||||
}
|
||||
|
@ -1,8 +1,9 @@
|
||||
import { FederatedPointerEvent, Point } from 'pixi.js';
|
||||
import { FederatedPointerEvent, IPointData, Point } from 'pixi.js';
|
||||
import {
|
||||
AbsorbableLine,
|
||||
AbsorbablePosition,
|
||||
GraphicDrawAssistant,
|
||||
GraphicIdGenerator,
|
||||
GraphicInteractionPlugin,
|
||||
JlDrawApp,
|
||||
JlGraphic,
|
||||
@ -12,7 +13,10 @@ import {
|
||||
IAxleCountingData,
|
||||
AxleCounting,
|
||||
AxleCountingTemplate,
|
||||
AxleCountingConsts,
|
||||
} from './AxleCounting';
|
||||
import { Section } from '../section/Section';
|
||||
import { Turnout } from '../turnout/Turnout';
|
||||
|
||||
export interface IAxleCountingDrawOptions {
|
||||
newData: () => IAxleCountingData;
|
||||
@ -24,7 +28,7 @@ export class AxleCountingDraw extends GraphicDrawAssistant<
|
||||
> {
|
||||
codeGraph: AxleCounting;
|
||||
constructor(app: JlDrawApp, template: AxleCountingTemplate) {
|
||||
super(app, template, 'sym_o_circle', '计轴AxleCounting');
|
||||
super(app, template, 'sym_o_circle', '不展示');
|
||||
this.codeGraph = this.graphicTemplate.new();
|
||||
this.container.addChild(this.codeGraph);
|
||||
AxleCountingInteraction.init(app);
|
||||
@ -51,6 +55,42 @@ export class AxleCountingDraw extends GraphicDrawAssistant<
|
||||
data.transform = this.container.saveTransform();
|
||||
return true;
|
||||
}
|
||||
oneGenerates(height: Point) {
|
||||
const sections = this.app.queryStore.queryByType<Section>(Section.Type);
|
||||
const turnouts = this.app.queryStore.queryByType<Turnout>(Turnout.Type);
|
||||
const axleCounting = this.app.queryStore.queryByType<AxleCounting>(
|
||||
AxleCounting.Type
|
||||
);
|
||||
this.app.deleteGraphics(...axleCounting);
|
||||
sections.forEach((section) => {
|
||||
const ps = section.localToCanvasPoint(section.getStartPoint());
|
||||
let direction = 1;
|
||||
if (ps.y > height.y) {
|
||||
direction = -1;
|
||||
}
|
||||
const axleCounting = new AxleCounting(direction);
|
||||
axleCounting.loadData(this.graphicTemplate.datas);
|
||||
axleCounting.position.set(
|
||||
ps.x,
|
||||
ps.y - AxleCountingConsts.offsetSection * direction
|
||||
);
|
||||
axleCounting.id = GraphicIdGenerator.next();
|
||||
this.storeGraphic(axleCounting);
|
||||
});
|
||||
turnouts.forEach((turnout) => {
|
||||
const points = turnout.datas.pointA;
|
||||
const transPos = turnout.datas.transform.position;
|
||||
const ps: IPointData[] = [];
|
||||
points.forEach((point: IPointData) => {
|
||||
ps.push(new Point(point.x + transPos.x, point.y + transPos.y));
|
||||
});
|
||||
const axleCounting = new AxleCounting(1);
|
||||
axleCounting.loadData(this.graphicTemplate.datas);
|
||||
axleCounting.position.set(ps[0].x, ps[0].y);
|
||||
axleCounting.id = GraphicIdGenerator.next();
|
||||
this.storeGraphic(axleCounting);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function buildAbsorbablePositions(
|
||||
|
@ -8,6 +8,8 @@ import {
|
||||
} from 'src/jl-graphic';
|
||||
import { TrainWindow } from './TrainWindow';
|
||||
import { TrainWindowDraw } from './TrainWindowDrawAssistant';
|
||||
import { AxleCounting } from '../axleCounting/AxleCounting';
|
||||
import { AxleCountingDraw } from '../axleCounting/AxleCountingDrawAssistant';
|
||||
|
||||
interface IOneClickData extends GraphicData {
|
||||
get code(): string; // 编号
|
||||
@ -54,11 +56,14 @@ OneClickGenerateTemplate,
|
||||
this.lineGraph.doRepaint();
|
||||
}
|
||||
onLeftDown(e: FederatedPointerEvent): void {
|
||||
this.container.position.copyFrom(this.toCanvasCoordinates(e.global));
|
||||
const trainWindowDraw = this.app.getDrawAssistant(
|
||||
TrainWindow.Type
|
||||
) as TrainWindowDraw;
|
||||
trainWindowDraw.oneGenerates(this.toCanvasCoordinates(e.global));
|
||||
const axleCountingDraw = this.app.getDrawAssistant(
|
||||
AxleCounting.Type
|
||||
) as AxleCountingDraw;
|
||||
axleCountingDraw.oneGenerates(this.toCanvasCoordinates(e.global));
|
||||
this.finish();
|
||||
}
|
||||
|
||||
|
@ -2192,7 +2192,7 @@ export namespace graphicData {
|
||||
common?: CommonInfo;
|
||||
code?: string;
|
||||
kilometerCode?: string;
|
||||
sectionId?: string[];
|
||||
axleCountingRef?: RelatedRef[];
|
||||
}) {
|
||||
super();
|
||||
pb_1.Message.initialize(this, Array.isArray(data) ? data : [], 0, -1, [4], this.#one_of_decls);
|
||||
@ -2206,8 +2206,8 @@ export namespace graphicData {
|
||||
if ("kilometerCode" in data && data.kilometerCode != undefined) {
|
||||
this.kilometerCode = data.kilometerCode;
|
||||
}
|
||||
if ("sectionId" in data && data.sectionId != undefined) {
|
||||
this.sectionId = data.sectionId;
|
||||
if ("axleCountingRef" in data && data.axleCountingRef != undefined) {
|
||||
this.axleCountingRef = data.axleCountingRef;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -2232,17 +2232,17 @@ export namespace graphicData {
|
||||
set kilometerCode(value: string) {
|
||||
pb_1.Message.setField(this, 3, value);
|
||||
}
|
||||
get sectionId() {
|
||||
return pb_1.Message.getFieldWithDefault(this, 4, []) as string[];
|
||||
get axleCountingRef() {
|
||||
return pb_1.Message.getRepeatedWrapperField(this, RelatedRef, 4) as RelatedRef[];
|
||||
}
|
||||
set sectionId(value: string[]) {
|
||||
pb_1.Message.setField(this, 4, value);
|
||||
set axleCountingRef(value: RelatedRef[]) {
|
||||
pb_1.Message.setRepeatedWrapperField(this, 4, value);
|
||||
}
|
||||
static fromObject(data: {
|
||||
common?: ReturnType<typeof CommonInfo.prototype.toObject>;
|
||||
code?: string;
|
||||
kilometerCode?: string;
|
||||
sectionId?: string[];
|
||||
axleCountingRef?: ReturnType<typeof RelatedRef.prototype.toObject>[];
|
||||
}): AxleCounting {
|
||||
const message = new AxleCounting({});
|
||||
if (data.common != null) {
|
||||
@ -2254,8 +2254,8 @@ export namespace graphicData {
|
||||
if (data.kilometerCode != null) {
|
||||
message.kilometerCode = data.kilometerCode;
|
||||
}
|
||||
if (data.sectionId != null) {
|
||||
message.sectionId = data.sectionId;
|
||||
if (data.axleCountingRef != null) {
|
||||
message.axleCountingRef = data.axleCountingRef.map(item => RelatedRef.fromObject(item));
|
||||
}
|
||||
return message;
|
||||
}
|
||||
@ -2264,7 +2264,7 @@ export namespace graphicData {
|
||||
common?: ReturnType<typeof CommonInfo.prototype.toObject>;
|
||||
code?: string;
|
||||
kilometerCode?: string;
|
||||
sectionId?: string[];
|
||||
axleCountingRef?: ReturnType<typeof RelatedRef.prototype.toObject>[];
|
||||
} = {};
|
||||
if (this.common != null) {
|
||||
data.common = this.common.toObject();
|
||||
@ -2275,8 +2275,8 @@ export namespace graphicData {
|
||||
if (this.kilometerCode != null) {
|
||||
data.kilometerCode = this.kilometerCode;
|
||||
}
|
||||
if (this.sectionId != null) {
|
||||
data.sectionId = this.sectionId;
|
||||
if (this.axleCountingRef != null) {
|
||||
data.axleCountingRef = this.axleCountingRef.map((item: RelatedRef) => item.toObject());
|
||||
}
|
||||
return data;
|
||||
}
|
||||
@ -2290,8 +2290,8 @@ export namespace graphicData {
|
||||
writer.writeString(2, this.code);
|
||||
if (this.kilometerCode.length)
|
||||
writer.writeString(3, this.kilometerCode);
|
||||
if (this.sectionId.length)
|
||||
writer.writeRepeatedString(4, this.sectionId);
|
||||
if (this.axleCountingRef.length)
|
||||
writer.writeRepeatedMessage(4, this.axleCountingRef, (item: RelatedRef) => item.serialize(writer));
|
||||
if (!w)
|
||||
return writer.getResultBuffer();
|
||||
}
|
||||
@ -2311,7 +2311,7 @@ export namespace graphicData {
|
||||
message.kilometerCode = reader.readString();
|
||||
break;
|
||||
case 4:
|
||||
pb_1.Message.addToRepeatedField(message, 4, reader.readString());
|
||||
reader.readMessage(message.axleCountingRef, () => pb_1.Message.addToRepeatedWrapperField(message, 4, RelatedRef.deserialize(reader), RelatedRef));
|
||||
break;
|
||||
default: reader.skipField();
|
||||
}
|
||||
@ -3784,7 +3784,8 @@ export namespace graphicData {
|
||||
export enum DeviceType {
|
||||
Section = 0,
|
||||
Turnout = 1,
|
||||
TrainWindow = 2
|
||||
TrainWindow = 2,
|
||||
AxleCounting = 3
|
||||
}
|
||||
export enum DevicePort {
|
||||
A = 0,
|
||||
|
Loading…
Reference in New Issue
Block a user