Merge branch 'master' of https://git.qcloud.com/joylink/jl-nclient
# Conflicts: # src/jmap/theme/bejing.js
This commit is contained in:
zyy
commit
ea23e6c817
@ -51,7 +51,7 @@ class Painter {
|
||||
|
||||
// 创建视图
|
||||
Object.values(mapDevice).forEach(device => {
|
||||
device && this.add(device);
|
||||
this.add(device);
|
||||
});
|
||||
}
|
||||
|
||||
@ -60,7 +60,6 @@ class Painter {
|
||||
* @param {*} device
|
||||
*/
|
||||
add(device) {
|
||||
// console.log(device, device._type, 111);
|
||||
const type = device._type;
|
||||
const instance = shapefactory(type, device, this.$jmap);
|
||||
if (instance) {
|
||||
|
||||
@ -22,7 +22,7 @@ class Signal extends Group {
|
||||
this.count = parseInt(model.lampPositionType);
|
||||
this.lamps = new Array(this.count);
|
||||
this.create();
|
||||
// this.setState(state);
|
||||
this.setState(state);
|
||||
}
|
||||
|
||||
create() {
|
||||
@ -78,8 +78,8 @@ class Signal extends Group {
|
||||
zlevel: this.zlevel,
|
||||
z: 1,
|
||||
style: this.style,
|
||||
x: nextPosition.x + drict * (this.count * this.style.Signal.signalR * 2 + this.style.Signal.signalR - 1),
|
||||
y: this.model.position.y,
|
||||
x: nextPosition.x - drict * (this.count * this.style.Signal.signalR * 2),
|
||||
y: nextPosition.y,
|
||||
drict: drict
|
||||
});
|
||||
|
||||
@ -90,7 +90,7 @@ class Signal extends Group {
|
||||
style: this.style,
|
||||
count: this.count,
|
||||
drict: drict,
|
||||
x: nextPosition.x,
|
||||
x: nextPosition.x + drict * this.count * this.style.Signal.signalR * 0.8,
|
||||
y: nextPosition.y,
|
||||
width: this.style.Signal.signalSigAutoWidth
|
||||
});
|
||||
@ -100,8 +100,8 @@ class Signal extends Group {
|
||||
zlevel: this.zlevel,
|
||||
z: 1,
|
||||
style: this.style,
|
||||
x: this.model.position.x,
|
||||
y: this.model.position.y + posit * (this.style.Signal.signalDistance + this.style.Section.sectionWidth + this.style.Signal.signalR * 2 + this.model.namePosition.y),
|
||||
x: nextPosition.x + drict * this.count * this.style.Signal.signalR * 3,
|
||||
y: nextPosition.y,
|
||||
text: this.state.delayCount || '0',
|
||||
textFont: `bold ${this.style.Signal.signalDelayTextFontSize} px ${this.style.textFontFormat}`,
|
||||
textFill: this.style.Signal.signalTextRed,
|
||||
@ -124,7 +124,7 @@ class Signal extends Group {
|
||||
this.lamps.forEach(lamp => { this.add(lamp); });
|
||||
this.add(this.sigName);
|
||||
this.add(this.sigAuto);
|
||||
// this.add(this.sigDrict);
|
||||
this.add(this.sigDrict);
|
||||
this.add(this.sigDelay);
|
||||
// this.add(this.sigButton);
|
||||
}
|
||||
|
||||
@ -1,988 +0,0 @@
|
||||
/*
|
||||
* 信号机
|
||||
*/
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import Polyline from 'zrender/src/graphic/shape/Polyline';
|
||||
import Circle from 'zrender/src/graphic/shape/Circle';
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import { arrows, triangular } from './libs/ShapePoints';
|
||||
|
||||
class Lamp extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
this.lamp = new Arc({
|
||||
name: model.index,
|
||||
zlevel: this.zlevel + 1,
|
||||
z: this.z,
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: model.style.signalR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.4,
|
||||
fill: model.style.backgroundColor,
|
||||
stroke: model.style.signalLampStandardColor
|
||||
}
|
||||
});
|
||||
|
||||
this.lstop = new Line({
|
||||
zlevel: this.zlevel + 1,
|
||||
z: this.z,
|
||||
origin: model.origin,
|
||||
rotation: -Math.PI / 180 * model.rotate,
|
||||
shape: {
|
||||
x1: model.position.x + (model.style.signalR + 1) * Math.cos(Math.PI / 4),
|
||||
y1: model.position.y + (model.style.signalR + 1) * Math.sin(Math.PI / 4),
|
||||
x2: model.position.x - (model.style.signalR + 1) * Math.cos(Math.PI / 4),
|
||||
y2: model.position.y - (model.style.signalR + 1) * Math.sin(Math.PI / 4)
|
||||
},
|
||||
style: {
|
||||
lineWidth: 1.5,
|
||||
stroke: model.style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.rstop = new Line({
|
||||
zlevel: this.zlevel + 1,
|
||||
z: this.z,
|
||||
origin: model.origin,
|
||||
rotation: -Math.PI / 180 * model.rotate,
|
||||
shape: {
|
||||
x1: model.position.x + (model.style.signalR + 1) * Math.cos(Math.PI / 4),
|
||||
y1: model.position.y + (model.style.signalR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2)),
|
||||
x2: model.position.x - (model.style.signalR + 1) * Math.cos(Math.PI / 4),
|
||||
y2: model.position.y - (model.style.signalR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2))
|
||||
},
|
||||
style: {
|
||||
lineWidth: 1.5,
|
||||
stroke: model.style.backgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.lamp);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
if (color) {
|
||||
this.lamp.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
|
||||
// 两条交叉黑线
|
||||
setStop(has) {
|
||||
if (has) {
|
||||
this.add(this.lstop);
|
||||
this.add(this.rstop);
|
||||
} else {
|
||||
this.remove(this.lstop);
|
||||
this.remove(this.rstop);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 自动进路箭头
|
||||
class AutoSig extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
let rotation = Math.PI;
|
||||
if (model.drict != 1) {
|
||||
// 右侧
|
||||
rotation = 0;
|
||||
}
|
||||
|
||||
// 箭头
|
||||
const x = model.position.x + model.drict * (model.lampCount * model.style.signalR + model.style.signalLampStandardWidth) * 2;
|
||||
const y = model.position.y - model.style.signalLampStandardWidth;
|
||||
this.arrowsControl = new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
rotation: rotation,
|
||||
origin: [x, y],
|
||||
shape: {
|
||||
points: arrows(x, y, model.style.stationControlDistance / 8, model.style.signalR * 0.8)
|
||||
},
|
||||
style: {
|
||||
stroke: model.style.sidelineColor,
|
||||
lineWidth: 0.6,
|
||||
fill: model.style.signalLampGreenColor
|
||||
}
|
||||
});
|
||||
this.add(this.arrowsControl);
|
||||
}
|
||||
|
||||
// 停止动画
|
||||
animationRecover() {
|
||||
this.arrowsControl.stopAnimation(false);
|
||||
}
|
||||
|
||||
// 箭头颜色
|
||||
setColor(color) {
|
||||
if (color) {
|
||||
this.arrowsControl.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
|
||||
// 箭头闪烁
|
||||
arrowsAnimation() {
|
||||
const fill = this.arrowsControl.style.fill;
|
||||
const style = this.model.style;
|
||||
this.arrowsControl.animate('style', true)
|
||||
.when(1000, { fill: style.backgroundColor, stroke: style.backgroundColor })
|
||||
.when(2000, { fill: fill, stroke: style.sidelineColor })
|
||||
.when(3000, { fill: style.backgroundColor, stroke: style.backgroundColor })
|
||||
.when(4000, { fill: fill, stroke: style.sidelineColor })
|
||||
.start();
|
||||
}
|
||||
}
|
||||
|
||||
// 运行方向三角
|
||||
class JSigDrict extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
// 箭头
|
||||
const model = this.model;
|
||||
this.sigDrict = new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
points: triangular(model.position.x, model.position.y, model.drict, model.style.signalR)
|
||||
},
|
||||
style: {
|
||||
stroke: model.style.backgroundColor,
|
||||
lineWidth: 0.5,
|
||||
fill: model.style.signalLampYellowColor
|
||||
}
|
||||
});
|
||||
this.add(this.sigDrict);
|
||||
}
|
||||
}
|
||||
|
||||
// 信号灯 几灯、高柱等
|
||||
class JSiglamp extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
this.lamps = new Group({name: `${model.name}_Lamps`});
|
||||
this.poles = new Group({name: `${model.name}_Poles`});
|
||||
this._subType = 'SignalLamp';
|
||||
this._val = '3'; /** 信号机*/
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
this.text = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x + model.namePosition.x,
|
||||
y: model.position.y + model.posit * (model.style.signalR + model.namePosition.y),
|
||||
text: model.signalName,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: model.posit === 1 ? 'top' : 'bottom',
|
||||
textFont: 'bold ' + (model.style.textFontSize + 1) + 'px ' + model.style.textFontFormat,
|
||||
textFill: model.style.signalTextGreen
|
||||
}
|
||||
});
|
||||
|
||||
this.ver = new Polyline({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z - 2,
|
||||
shape: {
|
||||
points: [
|
||||
[model.position.x, model.position.y + model.style.signalR * 1.2],
|
||||
[model.position.x, model.position.y - model.style.signalR * 1.2]
|
||||
]
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.signalLampStandardWidth,
|
||||
stroke: model.style.signalLampStandardColor
|
||||
}
|
||||
});
|
||||
|
||||
this.hor = new Polyline({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z - 1,
|
||||
shape: {
|
||||
points: [
|
||||
[model.position.x, model.position.y],
|
||||
[model.position.x + model.drict * model.style.signalR * 1.2, model.position.y]
|
||||
]
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.signalLampStandardWidth,
|
||||
stroke: model.style.signalLampStandardColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.lamps);
|
||||
this.add(this.poles);
|
||||
this.setShowName(model.isShowName);
|
||||
this.setShowHighSigType(model.highType);
|
||||
|
||||
// 旋转
|
||||
if (model.rotate) {
|
||||
this.transformRotation(this.ver);
|
||||
this.transformRotation(this.hor);
|
||||
}
|
||||
}
|
||||
|
||||
// border显示
|
||||
setBorderVisible(isVisible) {
|
||||
if (isVisible) {
|
||||
this.textBorder.show();
|
||||
this.lampsBorder.show();
|
||||
} else {
|
||||
this.textBorder.hide();
|
||||
this.lampsBorder.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// 设置显示信号灯名称
|
||||
setShowName(isShow) {
|
||||
if (isShow) this.add(this.text); else this.remove(this.text);
|
||||
}
|
||||
|
||||
// 显示信号灯名称颜色
|
||||
setNameColor(color) {
|
||||
this.text.setStyle({ textFill: color });
|
||||
}
|
||||
|
||||
setShowHighSigType(type) {
|
||||
const model = this.model;
|
||||
this.lamps.removeAll();
|
||||
this.poles.removeAll();
|
||||
this.poles.add(this.ver);
|
||||
if (type === '01') this.poles.remove(this.hor); else this.poles.add(this.hor);
|
||||
const highPosition = this.getEndPosition(model.highType);
|
||||
for (let i = 0; i < model.lampCount; i++) {
|
||||
const lamp = new Lamp({
|
||||
style: model.style,
|
||||
zlevel: this.zlevel,
|
||||
lampCount: model.lampCount,
|
||||
position: {
|
||||
x: highPosition.x + i * model.drict * model.style.signalR * 2,
|
||||
y: highPosition.y
|
||||
},
|
||||
index: i + 1,
|
||||
origin: {
|
||||
x: model.position.x,
|
||||
y: model.position.y
|
||||
},
|
||||
rotate: model.rotate,
|
||||
drict: model.drict,
|
||||
highType: model.highType
|
||||
});
|
||||
this.lamps.add(lamp);
|
||||
}
|
||||
|
||||
this.delay = new Text({
|
||||
zlevel: this.zlevel,
|
||||
style: {
|
||||
x: model.position.x - model.drict * (model.style.signalLampStandardWidth),
|
||||
y: model.position.y,
|
||||
text: this.model.delayCount || 0,
|
||||
textAlign: model.drict > 0 ? 'right' : 'left',
|
||||
textVerticalAlign: 'middle',
|
||||
textFont: 'bold ' + (model.style.textFontSize + 1) + 'px ' + model.style.textFontFormat,
|
||||
textFill: model.style.signalTextRed
|
||||
}
|
||||
});
|
||||
this.add(this.delay);
|
||||
|
||||
this.sigDriction = new JSigDrict({
|
||||
style: model.style,
|
||||
zlevel: this.zlevel,
|
||||
position: {
|
||||
x: highPosition.x + model.drict * (model.lampCount * model.style.signalR * 2 + model.style.signalR - 1),
|
||||
y: model.position.y
|
||||
},
|
||||
drict: model.drict,
|
||||
origin: {
|
||||
x: model.position.x,
|
||||
y: model.position.y
|
||||
},
|
||||
rotate: model.rotate
|
||||
});
|
||||
|
||||
this.autoSig = new AutoSig({
|
||||
style: model.style,
|
||||
zlevel: this.zlevel,
|
||||
position: {
|
||||
x: highPosition.x,
|
||||
y: highPosition.y
|
||||
},
|
||||
lampCount: model.lampCount,
|
||||
drict: model.drict,
|
||||
origin: {
|
||||
x: model.position.x,
|
||||
y: model.position.y
|
||||
},
|
||||
rotate: model.rotate
|
||||
});
|
||||
|
||||
// 旋转
|
||||
if (model.rotate) {
|
||||
this.transformRotation(this.sigDriction);
|
||||
this.transformRotation(this.autoSig);
|
||||
this.transformRotation(this.lamps);
|
||||
this.transformRotation(this.delay);
|
||||
}
|
||||
|
||||
const rect = this.lamps.getBoundingRect();
|
||||
rect.union(this.hor.getBoundingRect());
|
||||
this.lampsBorder = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z - 3,
|
||||
silent: true,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: model.style.borderColor,
|
||||
fill: model.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.textBorder = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z - 1,
|
||||
silent: true,
|
||||
shape: this.text.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: model.style.borderColor,
|
||||
fill: model.style.borderContextBackgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.lampsBorder);
|
||||
this.add(this.textBorder);
|
||||
}
|
||||
|
||||
// 整体旋转信号灯
|
||||
transformRotation(item) {
|
||||
if (this.model.rotate) {
|
||||
const origin = [this.model.position.x, this.model.position.y];
|
||||
const rotation = -Math.PI / 180 * Number(this.model.rotate);
|
||||
item.origin = origin;
|
||||
item.rotation = rotation;
|
||||
item.dirty();
|
||||
}
|
||||
}
|
||||
|
||||
setColorByIndex(index, color) {
|
||||
for (let i = 0; i < this.model.lampCount; i++) {
|
||||
if (this.lamps.childAt(i).model.index === index) {
|
||||
this.lamps.childAt(i).setColor(color);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
setStopByIndex(index, has) {
|
||||
for (let i = 0; i < this.model.lampCount; i++) {
|
||||
if (this.lamps.childAt(i).model.index === index) {
|
||||
this.lamps.childAt(i).setStop(has);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
setDelayUnlockAnimation() {
|
||||
this.delay.show();
|
||||
}
|
||||
|
||||
setAutoFlickerAnimation() {
|
||||
this.autoSig.arrowsAnimation();
|
||||
}
|
||||
|
||||
setRecover() {
|
||||
this.delay.hide();
|
||||
this.autoSig.animationRecover();
|
||||
this.setNameColor(this.model.style.signalTextGreen);
|
||||
}
|
||||
|
||||
setColorSig(color) {
|
||||
this.autoSig.setColor(color);
|
||||
}
|
||||
|
||||
getEndPosition(type) {
|
||||
if (type === '01') {
|
||||
return {
|
||||
x: this.model.position.x + this.model.drict * this.model.style.signalR * 3 / 2,
|
||||
y: this.model.position.y
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
x: this.hor.shape.points[1][0] + this.model.drict * this.model.style.signalR,
|
||||
y: this.hor.shape.points[1][1]
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
setShowSigDrict(showSigDrict) {
|
||||
if (showSigDrict) this.add(this.sigDriction); else this.remove(this.sigDriction);
|
||||
}
|
||||
|
||||
setAutoSig(isShow) {
|
||||
if (isShow) this.add(this.autoSig); else this.remove(this.autoSig);
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.lamps) {
|
||||
var distance = this.model.style.signalR;
|
||||
this.lamps.dirty();
|
||||
const rect = this.lamps.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + Math.cos(Number(this.model.rotate)) * rect.width / 2 || (this.model.position.x),
|
||||
y: rect.y + Math.cos(Number(this.model.rotate)) * rect.height / 2 - distance || (this.model.position.y - distance)
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
/** 按钮*/
|
||||
class SigButton extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this._subType = 'SignalButton';
|
||||
this.z = 10;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
this.sigNormalButtom = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
_subType: this._subType,
|
||||
_val: '1',
|
||||
shape: {
|
||||
x: model.position.x - model.style.signalR,
|
||||
y: 0,
|
||||
width: model.style.signalR * 2,
|
||||
height: model.style.signalR * 2
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.2,
|
||||
stroke: model.style.signalButtonDashColor,
|
||||
fill: model.style.signalButtonColor
|
||||
}
|
||||
});
|
||||
|
||||
this.sigNormalButtomDown = new Polyline({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
silent: true,
|
||||
shape: { points: [] },
|
||||
style: {
|
||||
lineWidth: 0.8,
|
||||
stroke: model.style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.sigReentryButton = new Circle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
_subType: this._subType,
|
||||
_val: '2', // 折返按钮
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: 0,
|
||||
r: model.style.signalR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.2,
|
||||
stroke: model.style.signalButtonDashColor,
|
||||
fill: model.style.signalButtonColor
|
||||
}
|
||||
});
|
||||
|
||||
this.sigReentryButtonDown = new Arc({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
silent: true,
|
||||
shape: {
|
||||
cx: 0,
|
||||
cy: 0,
|
||||
r: 0,
|
||||
startAngle: Math.PI * 8 / 5,
|
||||
endAngle: Math.PI * 4 / 5,
|
||||
clockwise: false
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.8,
|
||||
stroke: model.style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.sigNormalButtom);
|
||||
this.add(this.sigReentryButton);
|
||||
this.setSigDrict();
|
||||
}
|
||||
|
||||
setSigDrict() {
|
||||
const padding = 1;
|
||||
const model = this.model;
|
||||
const r = model.style.signalR * 0.8;
|
||||
if (model.drict === 1) {
|
||||
this.sigNormalButtom.attrKV('shape', {
|
||||
y: model.position.y - 1 / 2 * r
|
||||
});
|
||||
this.sigReentryButton.attrKV('shape', {
|
||||
cy: model.position.y - 5 / 2 * r
|
||||
});
|
||||
} else {
|
||||
this.sigReentryButton.attrKV('shape', {
|
||||
cy: model.position.y + 5 / 2 * r
|
||||
});
|
||||
this.sigNormalButtom.attrKV('shape', {
|
||||
y: model.position.y - 3 / 2 * r
|
||||
});
|
||||
}
|
||||
|
||||
this.sigNormalButtomDown.attrKV('shape', {
|
||||
points: [
|
||||
[model.position.x - padding + r, this.sigNormalButtom.shape.y + padding],
|
||||
[model.position.x + padding - r, this.sigNormalButtom.shape.y + padding],
|
||||
[model.position.x + padding - r, this.sigNormalButtom.shape.y + padding * 2 + r]
|
||||
]
|
||||
});
|
||||
|
||||
this.sigReentryButtonDown.attrKV('shape', {
|
||||
cx: this.sigReentryButton.shape.cx,
|
||||
cy: this.sigReentryButton.shape.cy,
|
||||
r: this.sigReentryButton.shape.r - padding
|
||||
});
|
||||
}
|
||||
|
||||
colorRecover() {
|
||||
this.sigNormalButtom.setStyle('fill', this.model.style.signalButtonColor);
|
||||
this.sigReentryButton.setStyle('fill', this.model.style.signalButtonColor);
|
||||
}
|
||||
|
||||
animationRecover() {
|
||||
this.sigNormalButtom.stopAnimation(true);
|
||||
this.sigReentryButton.stopAnimation(true);
|
||||
}
|
||||
|
||||
recover() {
|
||||
this.colorRecover();
|
||||
this.animationRecover();
|
||||
}
|
||||
|
||||
setButtonStatus(buttonStatus) {
|
||||
switch (buttonStatus) {
|
||||
case '00':
|
||||
case '01':
|
||||
this.remove(this.sigNormalButtomDown);
|
||||
this.remove(this.sigReentryButtonDown);
|
||||
this.recover();
|
||||
break;
|
||||
case '02':
|
||||
this.add(this.sigNormalButtomDown);
|
||||
break;
|
||||
case '03':
|
||||
this.add(this.sigReentryButtonDown);
|
||||
break;
|
||||
case '04':
|
||||
this.remove(this.sigNormalButtomDown);
|
||||
this.sigNormalButtom.animateStyle(true)
|
||||
.when(1000, {
|
||||
fill: this.model.style.signalButtonLightenColor
|
||||
})
|
||||
.when(2000, {
|
||||
fill: this.model.style.backgroundColor
|
||||
})
|
||||
.start();
|
||||
break;
|
||||
case '05':
|
||||
this.remove(this.sigReentryButtonDown);
|
||||
this.sigReentryButton.animateStyle(true)
|
||||
.when(1000, {
|
||||
fill: this.model.style.signalButtonLightenColor
|
||||
})
|
||||
.when(2000, {
|
||||
fill: this.model.style.backgroundColor
|
||||
})
|
||||
.start();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint(val) {
|
||||
var view = null;
|
||||
switch (val) {
|
||||
case '1': {
|
||||
view = this.sigNormalButtom;
|
||||
break;
|
||||
}
|
||||
case '2': {
|
||||
view = this.sigReentryButton;
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (view) {
|
||||
var distance = 2;
|
||||
var rect = view.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
export default class Signal extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.selected = false;
|
||||
this.lampCount = parseInt(model.lampPositionType);
|
||||
this._create();
|
||||
|
||||
this.on('mousedown', this.mouseclick);
|
||||
this.on('mouseout', this.mouseleave);
|
||||
this.on('mouseover', this.mouseenter);
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const state = this.state;
|
||||
const style = this.style;
|
||||
const drict = model.directionType === '01' ? -1 : 1;
|
||||
const posit = model.positionType === '01' ? -1 : 1;
|
||||
|
||||
// 信号灯文字说明
|
||||
this.siglamp = new JSiglamp({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
position: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + posit * style.signalDistance
|
||||
},
|
||||
drict: drict,
|
||||
posit: posit,
|
||||
signalName: model.name,
|
||||
namePosition: model.namePosition,
|
||||
isShowName: model.nameShow,
|
||||
highType: model.lampPostType,
|
||||
lampCount: parseInt(model.lampPositionType),
|
||||
showSigDrict: this.showSigDrict,
|
||||
pop: true,
|
||||
rotate: model.rotate
|
||||
});
|
||||
|
||||
// 信号灯按钮
|
||||
this.sigButton = new SigButton({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
position: {
|
||||
x: model.buttonPosition.x,
|
||||
y: model.buttonPosition.y - posit * style.signalDistance
|
||||
},
|
||||
drict: posit,
|
||||
pop: false
|
||||
});
|
||||
|
||||
this.add(this.siglamp);
|
||||
|
||||
this.mouseStateRecover();
|
||||
this.setState(state);
|
||||
}
|
||||
|
||||
setButtonStatus(model) {
|
||||
if (model.buttonShow) {
|
||||
this.add(this.sigButton);
|
||||
} else {
|
||||
this.remove(this.sigButton);
|
||||
}
|
||||
|
||||
if (this.sigButton) {
|
||||
this.sigButton.setButtonStatus(model.buttonStatus);
|
||||
}
|
||||
}
|
||||
|
||||
setShowSigDrict(isShow) {
|
||||
this.siglamp.setShowSigDrict(isShow);
|
||||
}
|
||||
|
||||
setAutoSig(isShow) {
|
||||
this.siglamp.setAutoSig(isShow);
|
||||
}
|
||||
|
||||
setShowHighSigType(hightp) {
|
||||
if (this.siglamp) {
|
||||
this.highType = hightp;
|
||||
this.siglamp.setShowHighSigType(hightp);
|
||||
}
|
||||
}
|
||||
|
||||
isPop(e) {
|
||||
for (var i = 0; i < this.childCount(); i++) {
|
||||
const rect = this.childAt(i).getBoundingRect();
|
||||
if (rect.contain(e.offsetX, e.offsetY) && this.childAt(i).pop) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 关闭
|
||||
close() {
|
||||
if (this.lampCount === 1) {
|
||||
if (this.model.useType === '05') {
|
||||
/** 单灯 调车信号机*/
|
||||
this.siglamp.setColorByIndex(1, this.style.signalLampBlueColor);
|
||||
} else {
|
||||
/** 单灯 出站信号机 */
|
||||
/** 单灯 阻挡信号机*/
|
||||
/** 单灯 阻挡兼调车信号 */
|
||||
/** 单灯 列兼调信号机 */
|
||||
this.siglamp.setColorByIndex(1, this.style.signalTextRed);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 开放
|
||||
open() {
|
||||
if (this.lampCount === 1) {
|
||||
/** 单灯 出站信号机*/
|
||||
/** 单灯 阻隔信号机*/
|
||||
this.siglamp.setColorByIndex(1, this.style.signalLampGreenColor);
|
||||
}
|
||||
}
|
||||
|
||||
// 列车进路
|
||||
trainRoute() {
|
||||
if (this.lampCount === 1) {
|
||||
/** 单灯 列兼调信号*/
|
||||
this.siglamp.setColorByIndex(1, this.style.signalLampYellowColor);
|
||||
}
|
||||
}
|
||||
|
||||
// 调车进路
|
||||
shuntRoute() {
|
||||
if (this.lampCount === 1) {
|
||||
/** 单灯 列兼调信号*/
|
||||
/** 单灯 阻挡兼调车信号*/
|
||||
this.siglamp.setColorByIndex(1, this.style.signalLampWhiteColor);
|
||||
}
|
||||
}
|
||||
|
||||
// 引导
|
||||
guid() {
|
||||
|
||||
}
|
||||
|
||||
// 封锁
|
||||
block() {
|
||||
this.siglamp.setColorByIndex(1, this.style.signalTextRed);
|
||||
this.siglamp.setNameColor(this.style.sectionBlockTextColor);
|
||||
}
|
||||
|
||||
// 功能封锁
|
||||
functionBlock() {
|
||||
|
||||
}
|
||||
|
||||
// 信号保护区段监视状态显示
|
||||
signalblock() {
|
||||
}
|
||||
|
||||
// 故障
|
||||
fault() {
|
||||
}
|
||||
|
||||
// 物理点灯
|
||||
logicalLight() {
|
||||
for (var i = 0; i < this.lampCount; i++) {
|
||||
this.siglamp.setStopByIndex(i + 1, false);
|
||||
}
|
||||
}
|
||||
|
||||
// 逻辑点灯
|
||||
physicsLight() {
|
||||
for (var i = 0; i < this.lampCount; i++) {
|
||||
this.siglamp.setStopByIndex(i + 1, true);
|
||||
}
|
||||
}
|
||||
|
||||
// 设置自动进路模式状态类型
|
||||
setAutoRouteOpen() {
|
||||
if (this.model.linkageAutoRouteShow) {
|
||||
this.siglamp.setAutoSig(true);
|
||||
} else {
|
||||
this.siglamp.setAutoSig(false);
|
||||
}
|
||||
|
||||
this.siglamp.setRecover();
|
||||
this.siglamp.setColorSig(this.style.signalLampGreenColor);
|
||||
}
|
||||
|
||||
// 信号机进路自动触发模式状态类型
|
||||
setAutoAccessOpen() {
|
||||
if (this.model.atsAutoTriggerShow) {
|
||||
this.siglamp.setAutoSig(true);
|
||||
} else {
|
||||
this.siglamp.setAutoSig(false);
|
||||
}
|
||||
|
||||
this.siglamp.setRecover();
|
||||
this.siglamp.setColorSig(this.style.signalLampYellowColor);
|
||||
}
|
||||
|
||||
// 设置自动信号模式状态类型
|
||||
setAutoSignalOpen() {
|
||||
this.siglamp.setShowSigDrict(true);
|
||||
}
|
||||
|
||||
// 隐藏自动信号和自动进路
|
||||
setAutoClose() {
|
||||
this.siglamp.setColorSig(this.style.backgroundColor);
|
||||
this.siglamp.setAutoSig(false);
|
||||
this.siglamp.setShowSigDrict(false);
|
||||
}
|
||||
|
||||
// 自动信号和自动进路开始动画
|
||||
setAutoFlicker() {
|
||||
this.siglamp.setAutoFlickerAnimation();
|
||||
}
|
||||
|
||||
// 设置延时解锁
|
||||
setDelayUnlock() {
|
||||
this.siglamp.setDelayUnlockAnimation();
|
||||
}
|
||||
|
||||
// 恢复状态
|
||||
recover() {
|
||||
this.siglamp.setRecover();
|
||||
}
|
||||
|
||||
setState(state) {
|
||||
this.recover();
|
||||
/** 设置状态 (点灯类型)*/
|
||||
switch (state.status) {
|
||||
case '01': this.close(); break; // 关闭
|
||||
case '02': this.open(); break; // 开放
|
||||
case '03': this.guid(); break; // 引导
|
||||
case '04': this.block(); break; // 封锁
|
||||
case '05': this.fault(); break; // 故障
|
||||
case '06': this.block(); break; // 功能封锁
|
||||
case '07': this.signalblock(); break; // 信号保护区段检测
|
||||
}
|
||||
|
||||
/** 进路性质类型*/
|
||||
switch (state.natureType) {
|
||||
case '01': this.trainRoute(); break; // 列车进路
|
||||
case '02': this.shuntRoute(); break; // 调车进路
|
||||
}
|
||||
|
||||
/** 设置点灯类型*/
|
||||
switch (state.lightType) {
|
||||
case '01': this.logicalLight(); break; // 设置逻辑点灯
|
||||
case '02': this.physicsLight(); break; // 设置物理点灯
|
||||
}
|
||||
|
||||
/** 设置自动类型*/
|
||||
switch (state.autoType) {
|
||||
case '01': this.setAutoClose(); break; // 隐藏 隐藏自动信号和自动进路
|
||||
case '02': this.setAutoSignalOpen(); break; // 显示 设置自动信号模式状态类型
|
||||
case '03': this.setAutoRouteOpen(); break; // 显示 设置自动进路模式状态类型
|
||||
case '04': this.setAutoAccessOpen(); break; // 显示 信号机进路自动触发模式状态类型
|
||||
}
|
||||
|
||||
/** 延时解锁*/
|
||||
state.delayType = '02';
|
||||
switch (state.delayType) {
|
||||
case '01': break; // 未延时解锁
|
||||
case '02': break; // 人工闭塞延时解锁
|
||||
case '03': break; // 自动闭塞延时解锁
|
||||
}
|
||||
|
||||
/** 信号机进路办理，先停止动画，再判断当前颜色是否闪烁*/
|
||||
if (state.routeSetting && (state.autoType == '03' || state.autoType == '04')) {
|
||||
this.setAutoFlicker();
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint(val) {
|
||||
if (val === '1' || val === '2') {
|
||||
return this.sigButton.getShapeTipPoint(val);
|
||||
} else {
|
||||
return this.siglamp.getShapeTipPoint(val);
|
||||
}
|
||||
}
|
||||
|
||||
mouseStateVisible() {
|
||||
this.siglamp.setBorderVisible(true);
|
||||
this.siglamp.setNameColor('#000');
|
||||
}
|
||||
|
||||
mouseStateRecover() {
|
||||
this.siglamp.setBorderVisible(false);
|
||||
this.siglamp.setNameColor(this.style.signalTextGreen);
|
||||
}
|
||||
|
||||
mouseclick(e) {
|
||||
if ([3].includes(e.which)) {
|
||||
this.selected = !this.selected;
|
||||
if (this.selected) {
|
||||
this.mouseStateVisible();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseenter() {
|
||||
if (!this.selected) {
|
||||
this.mouseStateVisible();
|
||||
}
|
||||
}
|
||||
|
||||
mouseleave() {
|
||||
if (!this.selected) {
|
||||
this.mouseStateRecover();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,10 +1,11 @@
|
||||
/**/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Isogon from 'zrender/src/graphic/shape/Isogon';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import { flashlight } from './libs/ShapePoints';
|
||||
import ESafeDoor from './element/ESafeDoor';
|
||||
import ESafeStand from './element/ESafeStand';
|
||||
import ESafeEmergent from './element/ESafeEmergent';
|
||||
|
||||
class StationStand extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
@ -15,33 +16,22 @@ class StationStand extends Group {
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.z = 40;
|
||||
this.doors = new Group();
|
||||
this._create(model);
|
||||
this._create();
|
||||
this.setVisible(model.visible);
|
||||
this.setState(state);
|
||||
}
|
||||
_create(model) {
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
const drict = model.doorLocationType == '01' ? 1 : -1;
|
||||
this.stationStand = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x - model.width / 2,
|
||||
y: 0,
|
||||
width: model.width,
|
||||
height: model.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.sidelineColor,
|
||||
fill: this.style.stationStandSpareColor
|
||||
}
|
||||
});
|
||||
|
||||
/** 站台折返策略*/
|
||||
const beyond = 4;
|
||||
const height = 5;
|
||||
const width = 10;
|
||||
const offsetx = (model.width - width / 2);
|
||||
const offsety = (model.height + height + this.style.stationStandDistance) / 2;
|
||||
const offsety = (model.height + height + style.StationStand.standDistance) / 2;
|
||||
|
||||
this.reentry = new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
@ -51,7 +41,7 @@ class StationStand extends Group {
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
fill: this.style.stationStandNoHumanReentryColor
|
||||
fill: style.StationStand.stationNoHumanReentryColor
|
||||
}
|
||||
});
|
||||
this.add(this.reentry);
|
||||
@ -69,9 +59,9 @@ class StationStand extends Group {
|
||||
text: 'H',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
fontSize: this.style.stationStandHeadFontSize + 'px ' + this.style.textFontFormat,
|
||||
textFill: this.style.stationStandCenterDetainTrainColor,
|
||||
textStroke: this.style.backgroundColor
|
||||
fontSize: style.StationStand.stationHeadFontSize + 'px ' + style.textFontFormat,
|
||||
textFill: style.StationStand.stationCenterDetainTrainColor,
|
||||
textStroke: style.StationStand.backgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
@ -81,7 +71,7 @@ class StationStand extends Group {
|
||||
if (model.doorLocationType == '02') {
|
||||
textLevelT = [0, 5];
|
||||
}
|
||||
const timeX = model.position.x - drict * (model.width / 2 + this.style.textFontSize + distance);
|
||||
const timeX = model.position.x - drict * (model.width / 2 + style.textFontSize + distance);
|
||||
this.time = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
@ -90,9 +80,9 @@ class StationStand extends Group {
|
||||
x: timeX,
|
||||
y: 0,
|
||||
text: model.parkingTime,
|
||||
textFill: this.style.stationStandTimeTextColor,
|
||||
textFill: style.StationStand.stationTimeTextColor,
|
||||
textAlign: 'middle',
|
||||
textFont: this.style.textFontSize + 'px ' + this.style.textFontFormat
|
||||
textFont: style.textFontSize + 'px ' + style.textFontFormat
|
||||
}
|
||||
});
|
||||
this.add(this.time);
|
||||
@ -102,7 +92,7 @@ class StationStand extends Group {
|
||||
if (model.doorLocationType == '01') {
|
||||
textLevelP = [0, 15];
|
||||
}
|
||||
const levelX = model.position.x - drict * (model.width / 2 + this.style.textFontSize + distance);
|
||||
const levelX = model.position.x - drict * (model.width / 2 + style.textFontSize + distance);
|
||||
this.level = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
@ -111,144 +101,63 @@ class StationStand extends Group {
|
||||
x: levelX,
|
||||
y: 0,
|
||||
text: model.intervalRunTime,
|
||||
textFill: this.style.stationStandTimeTextColor,
|
||||
textFill: style.StationStand.stationTimeTextColor,
|
||||
textAlign: 'middle',
|
||||
textFont: this.style.textFontSize + 'px ' + this.style.textFontFormat
|
||||
textFont: style.textFontSize + 'px ' + style.textFontFormat
|
||||
}
|
||||
});
|
||||
this.add(this.level);
|
||||
|
||||
/** 站台紧急关闭*/
|
||||
this.emergent = new Isogon({
|
||||
const emergentH = drict ? style.StationStand.standSafeHeight - style.StationStand.standDistance / 2: style.StationStand.standDistance / 2;
|
||||
const emergentX = model.position.x;
|
||||
const emergentY = model.position.y + drict * (style.StationStand.standDistance + emergentH);
|
||||
this.emergent = new ESafeEmergent({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x,
|
||||
y: 0,
|
||||
r: this.style.stationStandDistance / 2,
|
||||
n: 4
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandEmergentCloseColor,
|
||||
fill: this.style.stationStandEmergentCloseColor
|
||||
}
|
||||
style: style,
|
||||
x: emergentX,
|
||||
y: emergentY,
|
||||
r: style.StationStand.standDistance / 2,
|
||||
n: 4
|
||||
});
|
||||
this.doors.add(this.emergent);
|
||||
|
||||
/** 屏蔽门*/
|
||||
const padding = 0.1;
|
||||
this.safeDoorL = new Rect({
|
||||
this.safeDoor = new ESafeDoor({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x - model.width / 2 - padding,
|
||||
y: model.position.y,
|
||||
width: model.width / 4 + padding,
|
||||
height: this.style.statonStandSafeHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandDoorDefaultColor,
|
||||
fill: this.style.stationStandDoorDefaultColor
|
||||
}
|
||||
z: 1,
|
||||
style: style,
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
width: model.width,
|
||||
height: style.StationStand.standSafeHeight,
|
||||
show: model.hasDoor
|
||||
});
|
||||
|
||||
this.safeDoorC = new Rect({
|
||||
/** 列车站台*/
|
||||
const standH = drict > 0 ? 0 : model.height;
|
||||
const standX = model.position.x - model.width / 2;
|
||||
const standY = model.position.y + drict * (style.StationStand.standDistance + standH);
|
||||
this.safeStand = new ESafeStand({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
shape: {
|
||||
x: model.position.x - model.width / 4 - padding,
|
||||
y: model.position.y,
|
||||
width: model.width / 2 + padding * 2,
|
||||
height: this.style.statonStandSafeHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandDoorDefaultColor,
|
||||
fill: this.style.stationStandDoorDefaultColor
|
||||
}
|
||||
z: 1,
|
||||
style: style,
|
||||
x: standX,
|
||||
y: standY,
|
||||
width: model.width,
|
||||
height: model.height
|
||||
});
|
||||
|
||||
this.safeDoorR = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x + model.width / 4,
|
||||
y: model.position.y,
|
||||
width: model.width / 4 + padding,
|
||||
height: this.style.statonStandSafeHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandDoorDefaultColor,
|
||||
fill: this.style.stationStandDoorDefaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.setHasSafeDoor(model.hasDoor);
|
||||
this.setDrict(model.doorLocationType);
|
||||
this.setVisible(model.visible);
|
||||
this.setState(model);
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
setDrict(doorLocationType) {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
if (doorLocationType === '01') {
|
||||
const distance = model.position.y + style.stationStandDistance + style.statonStandSafeHeight;
|
||||
this.text.setStyle('y', distance + model.height / 2 - style.stationStandHeadFontSize / 2);
|
||||
this.time.setStyle('y', distance + model.height - style.textFontSize);
|
||||
this.level.setStyle('y', distance - model.height + style.textFontSize / 1.2);
|
||||
this.emergent.setShape('y', distance - style.stationStandDistance / 2);
|
||||
this.stationStand.setShape('y', distance);
|
||||
} else {
|
||||
const distance = model.position.y - style.stationStandDistance;
|
||||
this.text.setStyle('y', distance - model.height / 2 - style.stationStandHeadFontSize / 2);
|
||||
this.time.setStyle('y', distance - model.height + style.textFontSize);
|
||||
this.level.setStyle('y', distance - model.height - style.textFontSize / 2);
|
||||
this.emergent.setShape('y', distance + style.stationStandDistance / 2);
|
||||
this.stationStand.setShape('y', distance - model.height);
|
||||
}
|
||||
this.add(this.doors);
|
||||
this.add(this.stationStand);
|
||||
|
||||
const rect = this.stationStand.getBoundingRect();
|
||||
rect.union(this.doors.getBoundingRect());
|
||||
this.standBorder = new Rect({
|
||||
zlevel: this.model.zlevel,
|
||||
silent: true,
|
||||
z: this.z - 1,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: style.borderColor,
|
||||
fill: style.transparentColor
|
||||
}
|
||||
});
|
||||
this.add(this.standBorder);
|
||||
}
|
||||
setHasSafeDoor(hasDoor) {
|
||||
if (hasDoor) {
|
||||
this.doors.add(this.safeDoorL);
|
||||
this.doors.add(this.safeDoorC);
|
||||
this.doors.add(this.safeDoorR);
|
||||
} else {
|
||||
this.doors.remove(this.safeDoorL);
|
||||
this.doors.remove(this.safeDoorC);
|
||||
this.doors.remove(this.safeDoorR);
|
||||
}
|
||||
this.add(this.emergent);
|
||||
this.add(this.safeDoor);
|
||||
this.add(this.safeStand);
|
||||
}
|
||||
|
||||
setVisible(visible) {
|
||||
if (visible) {
|
||||
this.eachChild((it) => {
|
||||
it.show();
|
||||
});
|
||||
this.eachChild(elem => { elem.show(); });
|
||||
} else {
|
||||
this.eachChild((it) => {
|
||||
it.hide();
|
||||
});
|
||||
this.eachChild(elem => { elem.hide(); });
|
||||
}
|
||||
}
|
||||
|
||||
@ -257,33 +166,31 @@ class StationStand extends Group {
|
||||
this.time.hide();
|
||||
this.level.hide();
|
||||
this.text.hide();
|
||||
this.emergent.hide();
|
||||
this.reentry.hide();
|
||||
if (this.model.visible) { this.safeDoorC.show(); }
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.emergent.setVisible(false);
|
||||
if (this.model.visible) { this.safeDoor.hasDoor(true); }
|
||||
this.safeDoor.setColor(this.style.StationStand.standDoorDefaultColor);
|
||||
}
|
||||
|
||||
/** 空闲*/
|
||||
spare() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandSpareColor);
|
||||
this.safeStand.setColor(this.style.StationStand.standSpareColor);
|
||||
}
|
||||
|
||||
/** 列车停站*/
|
||||
stop() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandStopColor);
|
||||
this.safeStand.setColor(this.style.StationStand.standStopColor);
|
||||
}
|
||||
|
||||
/** 指定列车跳站*/
|
||||
designatedJumpStop() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandDesignatedJumpStopColor);
|
||||
this.safeStand.setColor(this.style.StationStand.standDesignatedJumpStopColor);
|
||||
}
|
||||
|
||||
/** 站台紧急关闭*/
|
||||
emergentClose() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandSpareColor);
|
||||
this.emergent.show();
|
||||
this.safeStand.setColor(this.style.StationStand.standSpareColor);
|
||||
this.emergent.setVisible(true);
|
||||
}
|
||||
|
||||
/** 未设置跳停*/
|
||||
@ -292,7 +199,7 @@ class StationStand extends Group {
|
||||
|
||||
/** 站台跳停*/
|
||||
jumpStop() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandJumpStopColor);
|
||||
this.safeStand.setColor(this.style.StationStand.standJumpStopColor);
|
||||
}
|
||||
|
||||
/** 未设置扣车*/
|
||||
@ -303,13 +210,13 @@ class StationStand extends Group {
|
||||
/** 车站扣车*/
|
||||
standDetainTrain() {
|
||||
this.text.show();
|
||||
this.text.setStyle('textFill', this.style.stationStandDetainTrainTextColor);
|
||||
this.text.setStyle('textFill', this.style.StationStand.standDetainTrainTextColor);
|
||||
}
|
||||
|
||||
/** 中心扣车*/
|
||||
centerDetainTrain() {
|
||||
this.text.show();
|
||||
this.text.setStyle('textFill', this.style.stationStandCenterDetainTrainColor);
|
||||
this.text.setStyle('textFill', this.style.StationStand.standCenterDetainTrainColor);
|
||||
}
|
||||
|
||||
/** 中心+车站扣车*/
|
||||
@ -339,33 +246,27 @@ class StationStand extends Group {
|
||||
|
||||
/** 开门*/
|
||||
openDoor() {
|
||||
this.safeDoorC.hide();
|
||||
this.safeDoor.hasDoor(true);
|
||||
}
|
||||
|
||||
/** 关门*/
|
||||
closeDoor() {
|
||||
if (this.model.model.visible) { this.safeDoorC.show(); }
|
||||
if (this.model.model.visible) { this.safeDoor.hasDoor(false); }
|
||||
}
|
||||
|
||||
/** 屏蔽门正常*/
|
||||
doorNormal() {
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoor.setColor(this.style.StationStand.standDoorDefaultColor);
|
||||
}
|
||||
|
||||
/** 屏蔽门故障*/
|
||||
doorFault() {
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoor.setColor(this.style.StationStand.standSplitDoorColor);
|
||||
}
|
||||
|
||||
/** 屏蔽门切除*/
|
||||
doorSplit() {
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoor.setColor(this.style.StationStand.standSplitDoorColor);
|
||||
}
|
||||
|
||||
/** 无折返(默认)*/
|
||||
@ -376,17 +277,17 @@ class StationStand extends Group {
|
||||
/** 无人折返*/
|
||||
noHumanReentry() {
|
||||
this.reentry.show();
|
||||
this.reentry.setStyle('fill', this.style.stationStandNoHumanReentryColor);
|
||||
this.reentry.setStyle('fill', this.style.StationStand.standNoHumanReentryColor);
|
||||
}
|
||||
/** 自动换端*/
|
||||
autoChangeEnds() {
|
||||
this.reentry.show();
|
||||
this.reentry.setStyle('fill', this.style.stationStandAutoChangeEndsColor);
|
||||
this.reentry.setStyle('fill', this.style.StationStand.standAutoChangeEndsColor);
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
setState(state) {
|
||||
this.recover();
|
||||
switch (model.status) {
|
||||
switch (state.status) {
|
||||
case '01': /** 空闲*/
|
||||
this.spare();
|
||||
break;
|
||||
@ -398,17 +299,17 @@ class StationStand extends Group {
|
||||
break;
|
||||
}
|
||||
|
||||
if (Number(model.parkingTime) >= 0) {
|
||||
this.setManuallyArmisticeTime(model.parkingTime);
|
||||
if (Number(state.parkingTime) >= 0) {
|
||||
this.setManuallyArmisticeTime(state.parkingTime);
|
||||
}
|
||||
|
||||
if (Number(model.intervalRunTime) > 0) {
|
||||
this.setManuallyOperationLevel(model.intervalRunTime);
|
||||
if (Number(state.intervalRunTime) > 0) {
|
||||
this.setManuallyOperationLevel(state.intervalRunTime);
|
||||
}
|
||||
|
||||
/** 设置跳停*/
|
||||
if (model.status == '01') {
|
||||
switch (model.jumpStopStatus) {
|
||||
if (state.status == '01') {
|
||||
switch (state.jumpStopStatus) {
|
||||
case '01': /** 未设置跳停*/
|
||||
this.unJumpStop();
|
||||
break;
|
||||
@ -422,7 +323,7 @@ class StationStand extends Group {
|
||||
}
|
||||
|
||||
/** 设置扣车*/
|
||||
switch (model.holdStatus) {
|
||||
switch (state.holdStatus) {
|
||||
case '01': /** 未设置扣车*/
|
||||
this.unDetainTrain();
|
||||
break;
|
||||
@ -438,7 +339,7 @@ class StationStand extends Group {
|
||||
}
|
||||
|
||||
/** 设置屏蔽门开关*/
|
||||
switch (model.screenDoorOpenStatus) {
|
||||
switch (state.screenDoorOpenStatus) {
|
||||
case '01':
|
||||
this.closeDoor(); /** 关门*/
|
||||
break;
|
||||
@ -448,7 +349,7 @@ class StationStand extends Group {
|
||||
}
|
||||
|
||||
/** 设置屏蔽门状态*/
|
||||
switch (model.screenDoorStatus) {
|
||||
switch (state.screenDoorStatus) {
|
||||
case '01':
|
||||
this.doorNormal(); /** 正常*/
|
||||
break;
|
||||
@ -460,7 +361,7 @@ class StationStand extends Group {
|
||||
}
|
||||
|
||||
/** 设置折返策略*/
|
||||
switch (model.reentryStrategy) {
|
||||
switch (state.reentryStrategy) {
|
||||
case '04': /** 默认*/
|
||||
case '01':
|
||||
this.noReentry(); /** 无折返策略*/
|
||||
@ -475,7 +376,7 @@ class StationStand extends Group {
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
const rect = this.stationStand.getBoundingRect();
|
||||
const rect = this.safeStand.getBoundingRect();
|
||||
if (rect) {
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
@ -484,39 +385,5 @@ class StationStand extends Group {
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
mouseStatusVisible() {
|
||||
this.standBorder.show();
|
||||
this.stationStand.setStyle({ fill: this.style.borderContextBackgroundColor});
|
||||
}
|
||||
|
||||
mouseStatusRecover() {
|
||||
this.standBorder.hide();
|
||||
this.stationStand.setStyle({ fill: this.style.stationStandSpareColor});
|
||||
this.setState(this.model);
|
||||
}
|
||||
|
||||
mouseclick(e) {
|
||||
if ([3].includes(e.which)) {
|
||||
this.selected = !this.selected;
|
||||
if (this.selected) {
|
||||
this.mouseStatusRecover();
|
||||
this.mouseStatusVisible();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseenter(e) {
|
||||
if (!this.selected) {
|
||||
this.mouseStatusRecover();
|
||||
this.mouseStatusVisible();
|
||||
}
|
||||
}
|
||||
|
||||
mouseleave(e) {
|
||||
if (!this.selected) {
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
}
|
||||
}
|
||||
export default StationStand;
|
||||
|
||||
487
src/jmap/shape/StationStand_1.js
Normal file
487
src/jmap/shape/StationStand_1.js
Normal file
@ -0,0 +1,487 @@
|
||||
/**/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Isogon from 'zrender/src/graphic/shape/Isogon';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import { flashlight } from './libs/ShapePoints';
|
||||
|
||||
class StationStand extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.z = 40;
|
||||
this.doors = new Group();
|
||||
this._create(model);
|
||||
}
|
||||
_create(model) {
|
||||
const drict = model.doorLocationType == '01' ? 1 : -1;
|
||||
this.stationStand = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x - model.width / 2,
|
||||
y: 0,
|
||||
width: model.width,
|
||||
height: model.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.sidelineColor,
|
||||
fill: this.style.stationStandSpareColor
|
||||
}
|
||||
});
|
||||
/** 站台折返策略*/
|
||||
const beyond = 4;
|
||||
const height = 5;
|
||||
const width = 10;
|
||||
const offsetx = (model.width - width / 2);
|
||||
const offsety = (model.height + height + this.style.stationStandDistance) / 2;
|
||||
|
||||
this.reentry = new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
points: flashlight(model.position.x, model.position.y, drict, width, height, offsetx, offsety, beyond)
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
fill: this.style.stationStandNoHumanReentryColor
|
||||
}
|
||||
});
|
||||
this.add(this.reentry);
|
||||
|
||||
/** 站台扣车*/
|
||||
const distance = 0;
|
||||
const textX = model.position.x + drict * (model.width / 2 + model.textFontSize + distance);
|
||||
this.text = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: textX,
|
||||
y: 0,
|
||||
text: 'H',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
fontSize: this.style.stationStandHeadFontSize + 'px ' + this.style.textFontFormat,
|
||||
textFill: this.style.stationStandCenterDetainTrainColor,
|
||||
textStroke: this.style.backgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
|
||||
/** 停站时间*/
|
||||
let textLevelT = [0, 0];
|
||||
if (model.doorLocationType == '02') {
|
||||
textLevelT = [0, 5];
|
||||
}
|
||||
const timeX = model.position.x - drict * (model.width / 2 + this.style.textFontSize + distance);
|
||||
this.time = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
position: textLevelT,
|
||||
style: {
|
||||
x: timeX,
|
||||
y: 0,
|
||||
text: model.parkingTime,
|
||||
textFill: this.style.stationStandTimeTextColor,
|
||||
textAlign: 'middle',
|
||||
textFont: this.style.textFontSize + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
this.add(this.time);
|
||||
|
||||
/** 区间运行时间*/
|
||||
let textLevelP = [0, 2];
|
||||
if (model.doorLocationType == '01') {
|
||||
textLevelP = [0, 15];
|
||||
}
|
||||
const levelX = model.position.x - drict * (model.width / 2 + this.style.textFontSize + distance);
|
||||
this.level = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
position: textLevelP,
|
||||
style: {
|
||||
x: levelX,
|
||||
y: 0,
|
||||
text: model.intervalRunTime,
|
||||
textFill: this.style.stationStandTimeTextColor,
|
||||
textAlign: 'middle',
|
||||
textFont: this.style.textFontSize + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
this.add(this.level);
|
||||
|
||||
/** 站台紧急关闭*/
|
||||
this.emergent = new Isogon({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x,
|
||||
y: 0,
|
||||
r: this.style.stationStandDistance / 2,
|
||||
n: 4
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandEmergentCloseColor,
|
||||
fill: this.style.stationStandEmergentCloseColor
|
||||
}
|
||||
});
|
||||
this.doors.add(this.emergent);
|
||||
|
||||
/** 屏蔽门*/
|
||||
const padding = 0.1;
|
||||
this.safeDoorL = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x - model.width / 2 - padding,
|
||||
y: model.position.y,
|
||||
width: model.width / 4 + padding,
|
||||
height: this.style.statonStandSafeHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandDoorDefaultColor,
|
||||
fill: this.style.stationStandDoorDefaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.safeDoorC = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
shape: {
|
||||
x: model.position.x - model.width / 4 - padding,
|
||||
y: model.position.y,
|
||||
width: model.width / 2 + padding * 2,
|
||||
height: this.style.statonStandSafeHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandDoorDefaultColor,
|
||||
fill: this.style.stationStandDoorDefaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.safeDoorR = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x + model.width / 4,
|
||||
y: model.position.y,
|
||||
width: model.width / 4 + padding,
|
||||
height: this.style.statonStandSafeHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: this.style.stationStandDoorDefaultColor,
|
||||
fill: this.style.stationStandDoorDefaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.setHasSafeDoor(model.hasDoor);
|
||||
this.setDrict(model.doorLocationType);
|
||||
this.setVisible(model.visible);
|
||||
this.setState(model);
|
||||
}
|
||||
setDrict(doorLocationType) {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
if (doorLocationType === '01') {
|
||||
const distance = model.position.y + style.stationStandDistance + style.statonStandSafeHeight;
|
||||
this.text.setStyle('y', distance + model.height / 2 - style.stationStandHeadFontSize / 2);
|
||||
this.time.setStyle('y', distance + model.height - style.textFontSize);
|
||||
this.level.setStyle('y', distance - model.height + style.textFontSize / 1.2);
|
||||
this.emergent.setShape('y', distance - style.stationStandDistance / 2);
|
||||
this.stationStand.setShape('y', distance);
|
||||
} else {
|
||||
const distance = model.position.y - style.stationStandDistance;
|
||||
this.text.setStyle('y', distance - model.height / 2 - style.stationStandHeadFontSize / 2);
|
||||
this.time.setStyle('y', distance - model.height + style.textFontSize);
|
||||
this.level.setStyle('y', distance - model.height - style.textFontSize / 2);
|
||||
this.emergent.setShape('y', distance + style.stationStandDistance / 2);
|
||||
this.stationStand.setShape('y', distance - model.height);
|
||||
}
|
||||
this.add(this.doors);
|
||||
this.add(this.stationStand);
|
||||
|
||||
const rect = this.stationStand.getBoundingRect();
|
||||
rect.union(this.doors.getBoundingRect());
|
||||
this.standBorder = new Rect({
|
||||
zlevel: this.model.zlevel,
|
||||
silent: true,
|
||||
z: this.z - 1,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: style.borderColor,
|
||||
fill: style.transparentColor
|
||||
}
|
||||
});
|
||||
this.add(this.standBorder);
|
||||
}
|
||||
setHasSafeDoor(hasDoor) {
|
||||
if (hasDoor) {
|
||||
this.doors.add(this.safeDoorL);
|
||||
this.doors.add(this.safeDoorC);
|
||||
this.doors.add(this.safeDoorR);
|
||||
} else {
|
||||
this.doors.remove(this.safeDoorL);
|
||||
this.doors.remove(this.safeDoorC);
|
||||
this.doors.remove(this.safeDoorR);
|
||||
}
|
||||
}
|
||||
|
||||
setVisible(visible) {
|
||||
if (visible) {
|
||||
this.eachChild((it) => {
|
||||
it.show();
|
||||
});
|
||||
} else {
|
||||
this.eachChild((it) => {
|
||||
it.hide();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 恢复初始状态*/
|
||||
recover() {
|
||||
this.time.hide();
|
||||
this.level.hide();
|
||||
this.text.hide();
|
||||
this.emergent.hide();
|
||||
this.reentry.hide();
|
||||
if (this.model.visible) { this.safeDoorC.show(); }
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
}
|
||||
|
||||
/** 空闲*/
|
||||
spare() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandSpareColor);
|
||||
}
|
||||
|
||||
/** 列车停站*/
|
||||
stop() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandStopColor);
|
||||
}
|
||||
|
||||
/** 指定列车跳站*/
|
||||
designatedJumpStop() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandDesignatedJumpStopColor);
|
||||
}
|
||||
|
||||
/** 站台紧急关闭*/
|
||||
emergentClose() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandSpareColor);
|
||||
this.emergent.show();
|
||||
}
|
||||
|
||||
/** 未设置跳停*/
|
||||
unJumpStop() {
|
||||
}
|
||||
|
||||
/** 站台跳停*/
|
||||
jumpStop() {
|
||||
this.stationStand.setStyle('fill', this.style.stationStandJumpStopColor);
|
||||
}
|
||||
|
||||
/** 未设置扣车*/
|
||||
unDetainTrain() {
|
||||
this.text.hide();
|
||||
}
|
||||
|
||||
/** 车站扣车*/
|
||||
standDetainTrain() {
|
||||
this.text.show();
|
||||
this.text.setStyle('textFill', this.style.stationStandDetainTrainTextColor);
|
||||
}
|
||||
|
||||
/** 中心扣车*/
|
||||
centerDetainTrain() {
|
||||
this.text.show();
|
||||
this.text.setStyle('textFill', this.style.stationStandCenterDetainTrainColor);
|
||||
}
|
||||
|
||||
/** 中心+车站扣车*/
|
||||
standAndCenterDetainTrain() {
|
||||
this.text.show();
|
||||
}
|
||||
|
||||
/** 人工设置停战时间*/
|
||||
setManuallyArmisticeTime(val) {
|
||||
this.time.show();
|
||||
this.time.attr({
|
||||
style: {
|
||||
text: val
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** 人工设置运行等级*/
|
||||
setManuallyOperationLevel(val) {
|
||||
this.level.show();
|
||||
this.level.attr({
|
||||
style: {
|
||||
text: val
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** 开门*/
|
||||
openDoor() {
|
||||
this.safeDoorC.hide();
|
||||
}
|
||||
|
||||
/** 关门*/
|
||||
closeDoor() {
|
||||
if (this.model.model.visible) { this.safeDoorC.show(); }
|
||||
}
|
||||
|
||||
/** 屏蔽门正常*/
|
||||
doorNormal() {
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandDoorDefaultColor);
|
||||
}
|
||||
|
||||
/** 屏蔽门故障*/
|
||||
doorFault() {
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
}
|
||||
|
||||
/** 屏蔽门切除*/
|
||||
doorSplit() {
|
||||
this.safeDoorL.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorC.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
this.safeDoorR.setStyle('fill', this.style.stationStandSplitDoorColor);
|
||||
}
|
||||
|
||||
/** 无折返(默认)*/
|
||||
noReentry() {
|
||||
this.reentry.hide();
|
||||
}
|
||||
|
||||
/** 无人折返*/
|
||||
noHumanReentry() {
|
||||
this.reentry.show();
|
||||
this.reentry.setStyle('fill', this.style.stationStandNoHumanReentryColor);
|
||||
}
|
||||
/** 自动换端*/
|
||||
autoChangeEnds() {
|
||||
this.reentry.show();
|
||||
this.reentry.setStyle('fill', this.style.stationStandAutoChangeEndsColor);
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
this.recover();
|
||||
switch (model.status) {
|
||||
case '01': /** 空闲*/
|
||||
this.spare();
|
||||
break;
|
||||
case '02': /** 列车停站*/
|
||||
this.stop();
|
||||
break;
|
||||
case '03': /** 站台紧急关闭*/
|
||||
this.emergentClose();
|
||||
break;
|
||||
}
|
||||
|
||||
if (Number(model.parkingTime) >= 0) {
|
||||
this.setManuallyArmisticeTime(model.parkingTime);
|
||||
}
|
||||
|
||||
if (Number(model.intervalRunTime) > 0) {
|
||||
this.setManuallyOperationLevel(model.intervalRunTime);
|
||||
}
|
||||
|
||||
/** 设置跳停*/
|
||||
if (model.status == '01') {
|
||||
switch (model.jumpStopStatus) {
|
||||
case '01': /** 未设置跳停*/
|
||||
this.unJumpStop();
|
||||
break;
|
||||
case '02': /** 指定站台跳停*/
|
||||
this.designatedJumpStop();
|
||||
break;
|
||||
case '03': /** 站台全部跳停*/
|
||||
this.jumpStop();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/** 设置扣车*/
|
||||
switch (model.holdStatus) {
|
||||
case '01': /** 未设置扣车*/
|
||||
this.unDetainTrain();
|
||||
break;
|
||||
case '02': /** 车站扣车*/
|
||||
this.standDetainTrain();
|
||||
break;
|
||||
case '03': /** 中心扣车*/
|
||||
this.centerDetainTrain();
|
||||
break;
|
||||
case '04': /** 中心+车站扣车*/
|
||||
this.standAndCenterDetainTrain();
|
||||
break;
|
||||
}
|
||||
|
||||
/** 设置屏蔽门开关*/
|
||||
switch (model.screenDoorOpenStatus) {
|
||||
case '01':
|
||||
this.closeDoor(); /** 关门*/
|
||||
break;
|
||||
case '02':
|
||||
this.openDoor(); /** 开门*/
|
||||
break;
|
||||
}
|
||||
|
||||
/** 设置屏蔽门状态*/
|
||||
switch (model.screenDoorStatus) {
|
||||
case '01':
|
||||
this.doorNormal(); /** 正常*/
|
||||
break;
|
||||
case '02':
|
||||
this.doorFault(); /** 故障*/
|
||||
break;
|
||||
case '03':
|
||||
this.doorSplit(); /** 切除*/
|
||||
}
|
||||
|
||||
/** 设置折返策略*/
|
||||
switch (model.reentryStrategy) {
|
||||
case '04': /** 默认*/
|
||||
case '01':
|
||||
this.noReentry(); /** 无折返策略*/
|
||||
break;
|
||||
case '02':
|
||||
this.noHumanReentry(); /** 无人折返*/
|
||||
break;
|
||||
case '03':
|
||||
this.autoChangeEnds(); /** 自动换端*/
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
const rect = this.stationStand.getBoundingRect();
|
||||
if (rect) {
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
export default StationStand;
|
||||
80
src/jmap/shape/element/ESafeDoor.js
Normal file
80
src/jmap/shape/element/ESafeDoor.js
Normal file
@ -0,0 +1,80 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
class ESafeDoor extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
const padding = 0.1;
|
||||
|
||||
this.safeL = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
x: model.x - model.width / 2 - padding,
|
||||
y: model.y,
|
||||
width: model.width / 4 + padding,
|
||||
height: model.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: style.StationStand.standDoorDefaultColor,
|
||||
fill: style.StationStand.standDoorDefaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.safeC = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 1,
|
||||
shape: {
|
||||
x: model.x - model.width / 4 - padding,
|
||||
y: model.y,
|
||||
width: model.width / 2 + padding * 2,
|
||||
height: model.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: style.StationStand.standDoorDefaultColor,
|
||||
fill: style.StationStand.standDoorDefaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.safeR = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
x: model.x + model.width / 4,
|
||||
y: model.y,
|
||||
width: model.width / 4 + padding,
|
||||
height: model.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: style.StationStand.standDoorDefaultColor,
|
||||
fill: style.StationStand.standDoorDefaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.safeL);
|
||||
this.add(this.safeC);
|
||||
this.add(this.safeR);
|
||||
}
|
||||
|
||||
hasDoor(show) {
|
||||
show ? this.safeR.show() : this.safeC.hide();
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.safeL.setStyle('fill', color);
|
||||
this.safeC.setStyle('fill', color);
|
||||
this.safeR.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
|
||||
export default ESafeDoor;
|
||||
39
src/jmap/shape/element/ESafeEmergent.js
Normal file
39
src/jmap/shape/element/ESafeEmergent.js
Normal file
@ -0,0 +1,39 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Isogon from 'zrender/src/graphic/shape/Isogon';
|
||||
|
||||
class ESafeEmergent extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.emergent = new Isogon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
r: style.StationStand.standDistance / 2,
|
||||
n: model.n
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: style.StationStand.standEmergentCloseColor,
|
||||
fill: style.StationStand.standEmergentCloseColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.emergent);
|
||||
}
|
||||
|
||||
setVisible(show) {
|
||||
show ? this.emergent.show(): this.emergent.hide();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESafeEmergent;
|
||||
39
src/jmap/shape/element/ESafeStand.js
Normal file
39
src/jmap/shape/element/ESafeStand.js
Normal file
@ -0,0 +1,39 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
class ESafeStand extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.stand = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
width: model.width,
|
||||
height: model.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: style.sidelineColor,
|
||||
fill: style.StationStand.standSpareColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.stand);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.stand.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
|
||||
export default ESafeStand;
|
||||
@ -72,7 +72,7 @@ class Beijing extends defaultSkin {
|
||||
/** 信号机宽度 */
|
||||
signalR: 6,
|
||||
/** 自动信号宽度*/
|
||||
signalSigAutoWidth: 20,
|
||||
signalSigAutoWidth: 10,
|
||||
/** 延迟解锁字体大小*/
|
||||
signalDelayTextFontSize: 10,
|
||||
/** 信号机名称字体大小*/
|
||||
@ -110,6 +110,54 @@ class Beijing extends defaultSkin {
|
||||
/** 信号灯蓝色*/
|
||||
signalLampBlueColor: '#0070C0'
|
||||
};
|
||||
|
||||
this[deviceType.StationStand] = {
|
||||
/** 站台和屏蔽门之间的距离*/
|
||||
standDistance: 9,
|
||||
/** 站台屏蔽门高度*/
|
||||
standSafeHeight: 1.6,
|
||||
/** 站台首端字体大小*/
|
||||
standHeadFontSize: 9,
|
||||
/** 站台无人折返*/
|
||||
standNoHumanReentryColor: '#0F16DA',
|
||||
/** 站台自动换端*/
|
||||
standAutoChangeEndsColor: '#0BF400',
|
||||
/** 站台空闲颜色*/
|
||||
standSpareColor: '#606060',
|
||||
/** 站台列车停站颜色*/
|
||||
standStopColor: '#FEFE00',
|
||||
/** 站台跳停颜色*/
|
||||
standJumpStopColor: '#9A99FF',
|
||||
/** 站台指定列车跳停颜色*/
|
||||
standDesignatedJumpStopColor: 'lightSkyBlue',
|
||||
/** 站台紧急关闭颜色*/
|
||||
standEmergentCloseColor: '#F61107',
|
||||
/** 停站时间字体颜色*/
|
||||
standTimeTextColor: '#FFFFFF',
|
||||
/** 车站扣车颜色*/
|
||||
standDetainTrainColor: '#E4EF50',
|
||||
/** 中心扣车颜色*/
|
||||
standCenterDetainTrainColor: '#FFFFFF',
|
||||
/** 车站+中心扣车颜色*/
|
||||
standAndCenterDetainTrainColor: '#F61107',
|
||||
/** 屏蔽门默认颜色*/
|
||||
standDoorDefaultColor: '#00FF00',
|
||||
/** 屏蔽门切除颜色*/
|
||||
standSplitDoorColor: '#F61107',
|
||||
/** 车站扣除文字颜色*/
|
||||
standDetainTrainTextColor: '#E4EF50',
|
||||
/** 计数器字体颜色*/
|
||||
stationCounterTextColor: '#FFFFFF',
|
||||
/** 计数器边框颜色*/
|
||||
stationCounterBorderColor: '#E4EF50',
|
||||
/** 延迟解锁倒计时和设备文字之间的距离*/
|
||||
stationDelayUnlockDistance: 3,
|
||||
/** 延时解锁字体颜色*/
|
||||
stationDelayUnlockTextColor: '#FFFFFF',
|
||||
/** 延迟解锁边框颜色*/
|
||||
stationDelayUnlockBorderColor: '#FFFFFF'
|
||||
};
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -39,7 +39,7 @@ export default {
|
||||
stateLoaded() { console.log('stateLoaded'); },
|
||||
viewUpdate() { console.log('viewUpdate'); },
|
||||
stateUpdate() { console.log('stateUpdate'); },
|
||||
optionsUpdate() { console.log('optionsUpdate'); }
|
||||
// optionsUpdate() { console.log('optionsUpdate'); }
|
||||
}
|
||||
});
|
||||
this.jmap.on('selected', this.selected);
|
||||
@ -82,10 +82,10 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
selected(e) {
|
||||
console.log('selected', e, this.jmap);
|
||||
// console.log('selected', e, this.jmap);
|
||||
},
|
||||
contextmenu(e) {
|
||||
console.log('contextmenu', e);
|
||||
// console.log('contextmenu', e);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user