This commit is contained in:
fan 2023-06-26 13:13:58 +08:00
commit beb4704912
10 changed files with 288 additions and 117 deletions

View File

@ -22,7 +22,7 @@ export class PagingQueryParams extends PageQueryDto {
*/
export function publishDraft(data: {
name: string;
lineId: number;
lineId?: number;
draftingId: number;
}) {
return api.post(`${PublishUriBase}/publish`, data);
@ -33,7 +33,7 @@ export function publishDraft(data: {
* @param params
* @returns
*/
export async function getDraft(id: number): Promise<Item> {
export async function getDraft(): Promise<Item> {
const response = await api.get(`${PublishUriBase}/list`);
return response.data;
}

View File

@ -179,27 +179,26 @@ export class PlatformState extends GraphicStateBase implements IPlatformState {
}
}
const arrestCarConfig: MenuItemOptions = {
const holdConfig: MenuItemOptions = {
name: '扣车',
};
const removeArrestCarConfig: MenuItemOptions = {
const removeHoldrConfig: MenuItemOptions = {
name: '取消扣车',
disabled: true,
};
const batchArrestCarConfig: MenuItemOptions = {
const batchHoldConfig: MenuItemOptions = {
name: '批量扣车',
};
const removeBatchArrestCarConfig: MenuItemOptions = {
const removeBatchHoldConfig: MenuItemOptions = {
name: '批量取消扣车',
};
const earlyDepartureConfig: MenuItemOptions = {
name: '提前发车',
};
const jumpStopConfig: MenuItemOptions = {
const skipStopConfig: MenuItemOptions = {
name: '设置跳停',
};
const removeJumpStopConfig: MenuItemOptions = {
name: '设置跳停',
const removeSkipStopConfig: MenuItemOptions = {
name: '取消跳停',
};
const dockTimeConfig: MenuItemOptions = {
name: '设置停站时间',
@ -222,10 +221,10 @@ const PlatformOperateMenu: ContextMenu = ContextMenu.init({
groups: [
{
items: [
arrestCarConfig,
removeArrestCarConfig,
earlyDepartureConfig,
platformMessadeConfig,
holdConfig,
removeHoldrConfig,
skipStopConfig,
removeSkipStopConfig,
],
},
],
@ -236,13 +235,13 @@ const dispatchPlatformOperateMenu: ContextMenu = ContextMenu.init({
groups: [
{
items: [
arrestCarConfig,
removeArrestCarConfig,
batchArrestCarConfig,
removeBatchArrestCarConfig,
holdConfig,
removeHoldrConfig,
batchHoldConfig,
removeBatchHoldConfig,
earlyDepartureConfig,
jumpStopConfig,
removeJumpStopConfig,
skipStopConfig,
removeSkipStopConfig,
dockTimeConfig,
operatingLevelConfig,
numberOfRegionalTrainsConfig,
@ -284,19 +283,23 @@ export class PlatformOperateInteraction extends GraphicInteractionPlugin<Platfor
const target = e.target as DisplayObject;
const platform = target.getGraphic() as Platform;
this.app.updateSelected(platform);
arrestCarConfig.handler = () => {
platform.states.close = true;
platform.changeState();
holdConfig.handler = () => {
platform.states.upHold = true;
platform.states.upOccHold = true;
platform.doRepaint();
};
removeArrestCarConfig.handler = () => {
platform.states.close = false;
platform.changeState();
removeHoldrConfig.handler = () => {
platform.states.upHold = false;
platform.states.upOccHold = false;
platform.doRepaint();
};
earlyDepartureConfig.handler = () => {
console.log(2222);
skipStopConfig.handler = () => {
platform.states.upSkipstop = true;
platform.doRepaint();
};
platformMessadeConfig.handler = () => {
console.log(2222);
removeSkipStopConfig.handler = () => {
platform.states.upSkipstop = false;
platform.doRepaint();
};
PlatformOperateMenu.open(e.global);

View File

@ -47,6 +47,10 @@ import {
} from 'src/graphics/trainLine/TrainLine';
import { TrainLineDraw } from 'src/graphics/trainLine/TrainLineAssistant';
import { TrainLineData } from './graphics/TrainLineInteraction';
import {
OneClickGenerateDraw,
OneClickGenerateTemplate,
} from 'src/graphics/trainWindow/oneClickDrawAssistant';
import {
TrainWindow,
TrainWindowTemplate,
@ -153,6 +157,7 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp {
| PathLineDraw
| TrainWindowDraw
| TrainDraw
| OneClickGenerateDraw
)[] = [];
if (draftType === 'Line') {
drawAssistants = [
@ -172,6 +177,7 @@ export function initDrawApp(dom: HTMLElement): JlDrawApp {
new SectionDraw(app, new SectionTemplate(new SectionData())),
new TurnoutDraw(app, new TurnoutTemplate(new TurnoutData())),
new TrainWindowDraw(app, new TrainWindowTemplate(new TrainWindowData())),
new OneClickGenerateDraw(app, new OneClickGenerateTemplate()),
];
DrawSignalInteraction.init(app);
} else {

View File

@ -56,17 +56,18 @@ export interface IPlatformState extends GraphicState {
//站台颜色
export enum PlatformColorEnum {
blue = '0x0fe81f', //站台的颜色
lightBlue = '0x55d15d',
yellow = '0xfbff00',
white = '0xffffff',
grey = '0x7F7F7F', //站台没有列车停站
yellow = '0xfbff00', //列车在站台停站
blue = '0xC0C0FE', //列车在站台跳停
lozengeRed = '0xff0000', //站台旁的菱形图标
whiteNumbers = '0xffffff', //站台旁白色数字
whiteCircle = '0xffffff', //H字符旁的圆圈
HCharYellow = '0xfbff00', //站台旁的H字符
HCharWhite = '0xffffff',
HCharRed = '0xff0000',
doorBlue = '0x008000', //屏蔽门的颜色
doorGreen = '0x00FF00', //屏蔽门的颜色
doorRed = '0xff0000',
doorBlue = '0x4048C4',
}
const platformConsts = {
@ -74,16 +75,12 @@ const platformConsts = {
height: 20,
lineWidth: 3,
besideFontSize: 12,
doorOpenSpacing: 5,
doorOpenSpacing: 15,
doorPlatformSpacing: 10,
besideSpacing: 10,
circleRadius: 1,
};
export interface childJlGraphic extends Container {
clear(): void;
draw(): void;
}
//子元素--矩形
export class rectGraphic extends Container {
static Type = 'RectPlatForm';
@ -93,14 +90,18 @@ export class rectGraphic extends Container {
this.rectGraphic = new Graphics();
this.addChild(this.rectGraphic);
}
draw(): void {
draw(state: IPlatformState): void {
const rectGraphic = this.rectGraphic;
rectGraphic.clear();
rectGraphic.lineStyle(
platformConsts.lineWidth,
new Color(PlatformColorEnum.yellow)
);
rectGraphic.beginFill(PlatformColorEnum.yellow, 1);
let fillColor = PlatformColorEnum.grey;
if (state.trainberth) {
fillColor = PlatformColorEnum.yellow;
}
if (state.upSkipstop || state.downSkipstop) {
fillColor = PlatformColorEnum.blue;
}
rectGraphic.lineStyle(platformConsts.lineWidth, new Color(fillColor));
rectGraphic.beginFill(fillColor, 1);
rectGraphic.drawRect(0, 0, platformConsts.width, platformConsts.height);
rectGraphic.endFill;
const rectP = new Rectangle(
@ -131,15 +132,16 @@ export class doorGraphic extends Container {
this.addChild(this.doorGraphic);
this.addChild(this.doorCloseGraphic);
}
draw(): void {
draw(stateData: IPlatformState): void {
const doorGraphic = this.doorGraphic;
const doorCloseGraphic = this.doorCloseGraphic;
doorGraphic.clear();
doorCloseGraphic.clear();
doorGraphic.lineStyle(
platformConsts.lineWidth,
new Color(PlatformColorEnum.doorBlue)
);
let lineColor = PlatformColorEnum.doorGreen;
if (stateData.psdCut) {
lineColor = PlatformColorEnum.doorRed;
}
doorGraphic.lineStyle(platformConsts.lineWidth, new Color(lineColor));
doorGraphic.moveTo(
-platformConsts.width / 2 - platformConsts.lineWidth / 2,
0
@ -151,10 +153,7 @@ export class doorGraphic extends Container {
0
);
//屏蔽门闭合
doorCloseGraphic.lineStyle(
platformConsts.lineWidth,
new Color(PlatformColorEnum.doorBlue)
);
doorCloseGraphic.lineStyle(platformConsts.lineWidth, new Color(lineColor));
doorCloseGraphic.moveTo(-platformConsts.doorOpenSpacing, 0);
doorCloseGraphic.lineTo(platformConsts.doorOpenSpacing, 0);
doorGraphic.position.set(
@ -166,51 +165,127 @@ export class doorGraphic extends Container {
-platformConsts.height / 2 - platformConsts.doorPlatformSpacing
);
}
openDoor(): void {
this.doorCloseGraphic.visible = false;
}
clear(): void {
this.doorGraphic.clear();
this.doorCloseGraphic.clear();
}
changeState(stateData: IPlatformState): void {
if (stateData.psdOpen) {
this.doorCloseGraphic.visible = false;
} else {
this.doorCloseGraphic.visible = true;
}
}
}
//子元素--字符
class codeGraph extends Container {
static Type = 'Code';
character: VectorText = new VectorText(''); //站台旁字符H或P
characterN: VectorText = new VectorText(''); //站台旁数字
character: VectorText = new VectorText(''); //扣车H
runTime: VectorText = new VectorText(''); //运行时间
stopTime: VectorText = new VectorText(''); //停站时间
circle: Graphics = new Graphics();
constructor() {
super();
this.addChild(this.character);
this.addChild(this.characterN);
this.addChild(this.runTime);
this.addChild(this.circle);
this.addChild(this.stopTime);
this.character.setVectorFontSize(platformConsts.besideFontSize);
this.characterN.setVectorFontSize(platformConsts.besideFontSize);
this.runTime.setVectorFontSize(platformConsts.besideFontSize);
this.stopTime.setVectorFontSize(platformConsts.besideFontSize);
}
draw(): void {
//扣车
const character = this.character;
character.text = 'H';
character.anchor.set(0.5);
character.position.set(
-platformConsts.width / 2 -
platformConsts.lineWidth / 2 -
platformConsts.besideSpacing,
0
(platformConsts.besideSpacing * 2) / 3,
(platformConsts.height * 3) / 4
);
character.style.fill = PlatformColorEnum.HCharYellow;
const characterN = this.characterN;
characterN.text = '9';
characterN.anchor.set(0.5);
characterN.position.set(
character.style.fill = PlatformColorEnum.whiteNumbers;
const circle = this.circle;
circle.clear();
circle.lineStyle(0.5, PlatformColorEnum.whiteCircle);
circle.drawCircle(0, 0, platformConsts.circleRadius);
circle.position.set(
-platformConsts.width / 2 -
platformConsts.lineWidth / 2 -
platformConsts.besideSpacing,
(-platformConsts.besideSpacing * 3) / 2
(platformConsts.besideSpacing * 4) / 3,
(platformConsts.height * 3) / 5
);
characterN.style.fill = PlatformColorEnum.HCharYellow;
//区间运行等级状态
const runTime = this.runTime;
runTime.anchor.set(0.5);
runTime.position.set(
platformConsts.width / 2 +
platformConsts.lineWidth / 2 +
platformConsts.besideSpacing,
-platformConsts.besideSpacing
);
runTime.style.fill = PlatformColorEnum.whiteNumbers;
//停站时间
const stopTime = this.stopTime;
stopTime.anchor.set(0.5);
stopTime.position.set(
platformConsts.width / 2 +
platformConsts.lineWidth / 2 +
platformConsts.besideSpacing,
platformConsts.besideSpacing
);
stopTime.style.fill = PlatformColorEnum.whiteNumbers;
character.visible = false;
circle.visible = false;
runTime.visible = false;
stopTime.visible = false;
}
clear(): void {
this.character.destroy();
}
changeState(stateData: IPlatformState): void {
if (
stateData.upHold ||
stateData.upOccHold ||
stateData.downHold ||
stateData.downOccHold
) {
this.character.text = 'H';
this.character.visible = true;
this.circle.visible = true;
//上行扣车
if (stateData.upHold) {
this.character.style.fill = PlatformColorEnum.HCharYellow;
}
if (stateData.upOccHold) {
this.character.style.fill = PlatformColorEnum.HCharWhite;
}
if (stateData.upHold && stateData.upOccHold) {
this.character.style.fill = PlatformColorEnum.HCharRed;
}
//下行扣车
if (stateData.downHold) {
this.character.style.fill = PlatformColorEnum.HCharYellow;
}
if (stateData.downOccHold) {
this.character.style.fill = PlatformColorEnum.HCharWhite;
}
if (stateData.downHold && stateData.downOccHold) {
this.character.style.fill = PlatformColorEnum.HCharRed;
}
//运行等级
if (stateData.nextSectionRunTime) {
this.runTime.visible = true;
this.runTime.text = stateData.nextSectionRunTime;
}
//停站时间
if (stateData.stopTime) {
this.stopTime.visible = true;
this.stopTime.text = stateData.stopTime;
}
}
}
}
//子元素--站台旁菱形图标
class besideGraphic extends Container {
@ -245,18 +320,26 @@ class besideGraphic extends Container {
platformConsts.besideSpacing,
0
);
besideGraphic.visible = false;
}
clear(): void {
this.besideGraphic.clear();
}
changeState(stateData: IPlatformState): void {
if (stateData.emergstop) {
this.besideGraphic.visible = true;
} else {
this.besideGraphic.visible = false;
}
}
}
export class Platform extends JlGraphic {
static Type = 'Platform';
platformGraphic: childJlGraphic = new rectGraphic();
doorGraphic: childJlGraphic = new doorGraphic();
besideGraphic: childJlGraphic = new besideGraphic();
codeGraph: childJlGraphic = new codeGraph();
platformGraphic: rectGraphic = new rectGraphic();
doorGraphic: doorGraphic = new doorGraphic();
besideGraphic: besideGraphic = new besideGraphic();
codeGraph: codeGraph = new codeGraph();
constructor() {
super(Platform.Type);
this.addChild(this.platformGraphic);
@ -274,9 +357,9 @@ export class Platform extends JlGraphic {
doRepaint(): void {
this.doorGraphic.clear();
if (this.datas.hasdoor) {
this.doorGraphic.draw();
this.doorGraphic.draw(this.states);
}
this.platformGraphic.draw();
this.platformGraphic.draw(this.states);
this.besideGraphic.draw();
this.codeGraph.draw();
this.doorGraphic.position.set(0, 0);
@ -294,19 +377,37 @@ export class Platform extends JlGraphic {
platformConsts.besideSpacing * 2,
0
);
this.codeGraph.position.set(
platformConsts.width +
platformConsts.lineWidth +
platformConsts.besideSpacing * 2,
0
this.codeGraph.children[0].position.set(
platformConsts.width / 2 +
platformConsts.lineWidth / 2 +
(platformConsts.besideSpacing * 2) / 3,
-(platformConsts.height * 3) / 4
);
this.codeGraph.children[1].position.set(
-platformConsts.width / 2 -
platformConsts.lineWidth / 2 -
platformConsts.besideSpacing,
(platformConsts.besideSpacing * 3) / 2
platformConsts.besideSpacing
);
this.codeGraph.children[2].position.set(
platformConsts.width / 2 +
platformConsts.lineWidth / 2 +
(platformConsts.besideSpacing * 4) / 3,
(-platformConsts.height * 10) / 11
);
this.codeGraph.children[3].position.set(
-platformConsts.width / 2 -
platformConsts.lineWidth / 2 -
platformConsts.besideSpacing,
-platformConsts.besideSpacing
);
}
this.changeState();
}
changeState(): void {
this.doorGraphic.changeState(this.states);
this.besideGraphic.changeState(this.states);
this.codeGraph.changeState(this.states);
}
}

View File

@ -14,7 +14,7 @@ import {
PlatformTemplate,
rectGraphic,
doorGraphic,
childJlGraphic,
IPlatformState,
} from './Platform';
export interface IPlatformDrawOptions {
@ -25,8 +25,8 @@ export class PlatformDraw extends GraphicDrawAssistant<
PlatformTemplate,
IPlatformData
> {
platformGraphic: childJlGraphic = new rectGraphic();
doorGraphic: childJlGraphic = new doorGraphic();
platformGraphic: rectGraphic = new rectGraphic();
doorGraphic: doorGraphic = new doorGraphic();
constructor(app: JlDrawApp, template: PlatformTemplate) {
super(
@ -42,8 +42,8 @@ export class PlatformDraw extends GraphicDrawAssistant<
bind(): void {
super.bind();
this.platformGraphic.draw();
this.doorGraphic.draw();
this.platformGraphic.draw(this.graphicTemplate.states as IPlatformState);
this.doorGraphic.draw(this.graphicTemplate.states as IPlatformState);
}
clearCache(): void {

View File

@ -23,7 +23,7 @@ export const TrainWindowConsts = {
height: 15,
lineWidth: 2,
lineColor: '0x0fe81f',
offsetSection: 60,
offsetSection: 120,
};
export class TrainWindow extends JlGraphic {

View File

@ -94,20 +94,8 @@ export class TrainWindowDraw extends GraphicDrawAssistant<
}
this.storeGraphic(...trainWindows);
}
oneGenerates() {
oneGenerates(height: Point) {
const sections = this.app.queryStore.queryByType<Section>(Section.Type);
const sectionSelect = this.app.selectedGraphics[0] as Section;
let height = 0;
if (sections.length && sectionSelect !== undefined) {
if (sectionSelect.datas.transform.position.y == 0) {
height = sectionSelect.datas.points[0].y + 5;
} else {
height =
sectionSelect.datas.points[0].y +
sectionSelect.datas.transform.position.y +
5;
}
}
const trainWindowAll = this.app.queryStore.queryByType<TrainWindow>(
TrainWindow.Type
);
@ -120,7 +108,7 @@ export class TrainWindowDraw extends GraphicDrawAssistant<
ps.push(new Point(point.x + transPos.x, point.y + transPos.y));
});
let direction = 1;
if (ps[0].y > height) {
if (ps[0].y > height.y) {
direction = -1;
}
for (let i = 0; i < ps.length - 1; i++) {
@ -206,15 +194,15 @@ export class TrainWindowInteraction extends GraphicInteractionPlugin<TrainWindow
g.scalable = true;
g.rotatable = true;
g.rectGraphic.hitArea = new RectGraphicHitArea(g);
g.on('selected', this.onSelected, this);
g.on('transformstart', this.move, this);
}
unbind(g: TrainWindow): void {
g.eventMode = 'none';
g.scalable = false;
g.rotatable = false;
g.off('selected', this.onSelected, this);
g.off('selected', this.move, this);
}
onSelected(): void {
move(): void {
const trainWindow = this.app.selectedGraphics[0] as TrainWindow;
this.app.setOptions({
absorbablePositions: buildAbsorbablePositions(trainWindow),

View File

@ -0,0 +1,71 @@
import { Color, FederatedPointerEvent, Graphics, Point } from 'pixi.js';
import {
GraphicData,
GraphicDrawAssistant,
JlDrawApp,
JlGraphic,
JlGraphicTemplate,
} from 'src/jl-graphic';
import { TrainWindow } from './TrainWindow';
import { TrainWindowDraw } from './TrainWindowDrawAssistant';
interface IOneClickData extends GraphicData {
get code(): string; // 编号
}
export class OneClickGenerate extends JlGraphic {
static Type = 'OneClickGenerate';
lineGraphic: Graphics = new Graphics();
constructor() {
super(OneClickGenerate.Type);
this.addChild(this.lineGraphic);
}
doRepaint(): void {
this.lineGraphic.clear();
this.lineGraphic.lineStyle(1, new Color('0xff0000'));
this.lineGraphic.moveTo(-1920, 0);
this.lineGraphic.lineTo(1920, 0);
}
}
export class OneClickGenerateTemplate extends JlGraphicTemplate<OneClickGenerate> {
constructor() {
super(OneClickGenerate.Type, {});
}
new(): OneClickGenerate {
return new OneClickGenerate();
}
}
export class OneClickGenerateDraw extends GraphicDrawAssistant<
OneClickGenerateTemplate,
IOneClickData
> {
lineGraph: OneClickGenerate;
constructor(app: JlDrawApp, template: OneClickGenerateTemplate) {
super(app, template, 'sym_o_square', '不展示');
this.lineGraph = this.graphicTemplate.new();
this.container.addChild(this.lineGraph);
}
bind(): void {
super.bind();
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));
this.finish();
}
redraw(p: Point): void {
this.container.position.copyFrom(p);
}
prepareData(): boolean {
return true;
}
}

View File

@ -177,8 +177,7 @@ import { useRoute, useRouter } from 'vue-router';
import { errorNotify, successNotify } from 'src/utils/CommonNotify';
import { saveAsDraft } from 'src/api/DraftApi';
import { ApiError } from 'src/boot/axios';
import { TrainWindowDraw } from 'src/graphics/trainWindow/TrainWindowDrawAssistant';
import { TrainWindow } from 'src/graphics/trainWindow/TrainWindow';
import { OneClickGenerate } from 'src/graphics/trainWindow/oneClickDrawAssistant';
const route = useRoute();
const router = useRouter();
@ -304,10 +303,7 @@ function buildRelations() {
}
function oneClickGeneration() {
const trainWindowDraw = drawStore
.getDrawApp()
.getDrawAssistant(TrainWindow.Type) as TrainWindowDraw;
trainWindowDraw.oneGenerates();
drawStore.getDrawApp().interactionPlugin(OneClickGenerate.Type).resume();
}
function backConfirm() {

View File

@ -112,6 +112,7 @@
:rules="[(val) => val.length > 0 || '请输入名称!']"
/>
<q-select
v-if="publishForm.type == 'Line'"
v-model="publishForm.lineId"
:options="lineOptions"
emit-value
@ -299,6 +300,7 @@ const publishForm = reactive({
draftName: '',
pubName: '',
lineId: '',
type: 'Line',
});
function prePublish(row: any) {
publishFormShow.value = true;
@ -306,17 +308,21 @@ function prePublish(row: any) {
publishForm.draftName = row.name;
publishForm.pubName = row.name;
publishForm.lineId = '';
publishForm.type = row.type || 'Line';
}
async function publishGraphics() {
pubForm.value?.validate().then(async (res) => {
if (res) {
try {
await publishDraft({
const params: { draftingId: number; name: string; lineId?: number } = {
draftingId: +publishForm.id,
name: publishForm.pubName,
lineId: +publishForm.lineId,
});
};
if (publishForm.type == 'Line') {
params.lineId = +publishForm.lineId;
}
await publishDraft(params);
publishFormShow.value = false;
$q.notify({
type: 'positive',