Merge branch 'master' of https://git.qcloud.com/joylink/jl-nclient
This commit is contained in:
zyy
commit
d50dc24121
@ -98,4 +98,14 @@ deviceRender[deviceType.Text] = {
|
|||||||
progressive: 7
|
progressive: 7
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/** TrainWindow渲染配置*/
|
||||||
|
deviceRender[deviceType.TrainWindow] = {
|
||||||
|
zlevel: 5,
|
||||||
|
progressive: 4,
|
||||||
|
};
|
||||||
|
/** Train渲染配置*/
|
||||||
|
deviceRender[deviceType.TRain] = {
|
||||||
|
zlevel: 6,
|
||||||
|
progressive: 4,
|
||||||
|
};
|
||||||
export default deviceRender;
|
export default deviceRender;
|
||||||
|
|||||||
@ -309,6 +309,167 @@ fuzhouSkin[deviceType.StationCounter] = {
|
|||||||
/** 计数器边框颜色*/
|
/** 计数器边框颜色*/
|
||||||
stationCounterBorderColor: '#E4EF50'
|
stationCounterBorderColor: '#E4EF50'
|
||||||
};
|
};
|
||||||
|
fuzhouSkin[deviceType.StationStand] = {
|
||||||
|
/** 站台空闲颜色*/
|
||||||
|
stationStandSpareColor: '#74747C',
|
||||||
|
|
||||||
|
/** 列车边线颜色*/
|
||||||
|
trainSidelineColor: '#C0C0C0',
|
||||||
|
|
||||||
|
/** 站台和屏蔽门之间的距离*/
|
||||||
|
stationStandDistance: 8,
|
||||||
|
|
||||||
|
/** 站台无人折返*/
|
||||||
|
stationStandNoHumanReentryColor: '#0F16DA',
|
||||||
|
|
||||||
|
/** 站台首端字体大小*/
|
||||||
|
stationStandHeadFontSize: 10,
|
||||||
|
|
||||||
|
/** 中心扣车颜色*/
|
||||||
|
stationStandCenterDetainTrainColor: '#FFFFFF',
|
||||||
|
|
||||||
|
/** 默认字体 族类*/
|
||||||
|
textFontFormat: '宋体', //consolas
|
||||||
|
|
||||||
|
/** 默认背景 颜色*/
|
||||||
|
backgroundColor: '#000000',
|
||||||
|
|
||||||
|
/** 默认字体 大小*/
|
||||||
|
textFontSize: 8.2,
|
||||||
|
|
||||||
|
/** 停站时间字体颜色*/
|
||||||
|
stationStandTimeTextColor: '#FFFFFF',
|
||||||
|
|
||||||
|
/** 站台紧急关闭颜色*/
|
||||||
|
stationStandEmergentCloseColor: '#F61107',
|
||||||
|
|
||||||
|
/** 站台屏蔽门高度*/
|
||||||
|
statonStandSafeHeight: 1.6,
|
||||||
|
|
||||||
|
/** 屏蔽门默认颜色*/
|
||||||
|
stationStandDoorDefaultColor: '#4DD43F',
|
||||||
|
|
||||||
|
/** 站台列车停站颜色*/
|
||||||
|
stationStandStopColor: '#FEFE00',
|
||||||
|
|
||||||
|
/** 站台指定列车跳停颜色*/
|
||||||
|
stationStandDesignatedJumpStopColor: 'lightSkyBlue',
|
||||||
|
|
||||||
|
/** 站台跳停颜色*/
|
||||||
|
stationStandJumpStopColor: '#9A99FF',
|
||||||
|
|
||||||
|
/** 车站扣除文字颜色*/
|
||||||
|
stationstandDetainTrainTextColor: '#E4EF50',
|
||||||
|
|
||||||
|
/** 屏蔽门切除颜色*/
|
||||||
|
stationStandSplitDoorColor: '#F61107',
|
||||||
|
|
||||||
|
/** 站台自动换端*/
|
||||||
|
stationStandAutoChangeEndsColor: '#0BF400',
|
||||||
|
|
||||||
|
/** 默认border文字背景色*/
|
||||||
|
borderContextBackgroundColor: '#00FFFF',
|
||||||
|
|
||||||
|
/** 默认边线 颜色*/
|
||||||
|
sidelineColor: '#FFFFFF',
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
fuzhouSkin[deviceType.TrainWindow] = {
|
||||||
|
/** 车次窗高度*/
|
||||||
|
trainWindowWidth: 40,
|
||||||
|
|
||||||
|
/** 车次窗高度*/
|
||||||
|
trainWindowHeight: 15,
|
||||||
|
|
||||||
|
/** 车次窗颜色*/
|
||||||
|
trainWindowColor: '#4DD43F',
|
||||||
|
|
||||||
|
/** 透明填充 颜色*/
|
||||||
|
transparentColor: 'rgba(0,0,0,0)',
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
fuzhouSkin[deviceType.Train] = {
|
||||||
|
/** 列车长度*/
|
||||||
|
trainWidth: 76,
|
||||||
|
|
||||||
|
/** 列车高度*/
|
||||||
|
trainHeight: 17,
|
||||||
|
|
||||||
|
/** 列车字号*/
|
||||||
|
trainTextFontSize: 15,
|
||||||
|
|
||||||
|
// 列车文字间距
|
||||||
|
trainTextSpaceBetween: 27,
|
||||||
|
|
||||||
|
|
||||||
|
/** 列车HDSA字号*/
|
||||||
|
trainHSDATextFontSize: 8,
|
||||||
|
|
||||||
|
/** 列车信号的半径*/
|
||||||
|
trainConflictR: 3,
|
||||||
|
|
||||||
|
/** 列车信号距离车的距离*/
|
||||||
|
trainConflictDistance: 5,
|
||||||
|
|
||||||
|
/** 列车车头比车身高出的长度,上下相比车体伸出去的边框*/
|
||||||
|
trainMoreLength: 1,
|
||||||
|
|
||||||
|
/** 列车和车头之间的间距*/
|
||||||
|
trainHeadDistance: 2,
|
||||||
|
|
||||||
|
/** 列车竖杠的宽度*/
|
||||||
|
trainConntWidth: 4,
|
||||||
|
|
||||||
|
/** 列车竖杠和方向之间的间隔*/
|
||||||
|
trainPadding: 1,
|
||||||
|
|
||||||
|
/** 列车方向的宽度*/
|
||||||
|
trainArrowWidth: 6,
|
||||||
|
|
||||||
|
/** 列车和区段之间的距离*/
|
||||||
|
trainDistance: 18,
|
||||||
|
|
||||||
|
/** 列车背景*/
|
||||||
|
trainBackground: 'rgba(0,0,0,0)',
|
||||||
|
|
||||||
|
/** 列车边线颜色*/
|
||||||
|
trainSidelineColor: '#C0C0C0',
|
||||||
|
|
||||||
|
/** 列车文字颜色*/
|
||||||
|
trainTextColor: '#ffffff',
|
||||||
|
|
||||||
|
/** 列车 灰色*/
|
||||||
|
trainGrayColor: '#C0C0C0',
|
||||||
|
|
||||||
|
/** 列车 白色*/
|
||||||
|
trainWitheColor: '#FFFFFF',
|
||||||
|
|
||||||
|
/** 列车 棕色*/
|
||||||
|
trainBrownColor: '#9B4A09',
|
||||||
|
|
||||||
|
/** 列车 黄色*/
|
||||||
|
trainYellowColor: '#FFFF00',
|
||||||
|
|
||||||
|
/** 列车 绿色*/
|
||||||
|
trainGreenColor: '#00AF50',
|
||||||
|
|
||||||
|
/** 列车 蓝色*/
|
||||||
|
trainBlueColor: '#3265FF',
|
||||||
|
|
||||||
|
/** 列车 红色*/
|
||||||
|
trainRedColor: '#EF0C08',
|
||||||
|
|
||||||
|
/** 列车 橘色*/
|
||||||
|
trainOrangeColor: '#EA700D',
|
||||||
|
|
||||||
|
/** 列车 紫色*/
|
||||||
|
trainPurpleColor: 'purple',
|
||||||
|
|
||||||
|
/** 列车 粉色*/
|
||||||
|
trainPinkColor: 'pink',
|
||||||
|
};
|
||||||
/** 皮肤配置*/
|
/** 皮肤配置*/
|
||||||
const deviceSkin = {
|
const deviceSkin = {
|
||||||
'03': fuzhouSkin,
|
'03': fuzhouSkin,
|
||||||
|
|||||||
@ -42,8 +42,7 @@ export default class ImageControl extends Group {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
setState(model) {
|
setState(state) {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 整体图片
|
// 整体图片
|
||||||
|
|||||||
@ -16,13 +16,15 @@ export default class LcControl extends Group {
|
|||||||
this.model = model;
|
this.model = model;
|
||||||
this.state = state;
|
this.state = state;
|
||||||
this.style = style;
|
this.style = style;
|
||||||
this._create(model);
|
this._create();
|
||||||
|
|
||||||
this.on('mouseout', this.mouseleave);
|
this.on('mouseout', this.mouseleave);
|
||||||
this.on('mouseover', this.mouseenter);
|
this.on('mouseover', this.mouseenter);
|
||||||
}
|
}
|
||||||
|
|
||||||
_create(model) {
|
_create() {
|
||||||
|
const model = this.model;
|
||||||
|
const state = this.state;
|
||||||
this.control = new Arc({
|
this.control = new Arc({
|
||||||
_subType: 'Control',
|
_subType: 'Control',
|
||||||
zlevel: this.zlevel,
|
zlevel: this.zlevel,
|
||||||
@ -98,14 +100,12 @@ export default class LcControl extends Group {
|
|||||||
this.add(this.textShadow);
|
this.add(this.textShadow);
|
||||||
this.add(this.textBorder);
|
this.add(this.textBorder);
|
||||||
this.add(this.controlBorder);
|
this.add(this.controlBorder);
|
||||||
this.setState(this.state);
|
this.setState(state);
|
||||||
this.mouseStatusRecover();
|
this.mouseStateRecover();
|
||||||
}
|
}
|
||||||
|
|
||||||
// 设置状态
|
// 设置状态
|
||||||
setState(state) {
|
setState(state) {}
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
getShapeTipPoint() {
|
getShapeTipPoint() {
|
||||||
if (this.control) {
|
if (this.control) {
|
||||||
@ -119,7 +119,7 @@ export default class LcControl extends Group {
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseStatusVisible(subType) {
|
mouseStateVisible(subType) {
|
||||||
if (subType == 'Text') {
|
if (subType == 'Text') {
|
||||||
this.textShadow.show();
|
this.textShadow.show();
|
||||||
}
|
}
|
||||||
@ -132,26 +132,25 @@ export default class LcControl extends Group {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseStatusRecover() {
|
mouseStateRecover() {
|
||||||
this.textShadow.hide();
|
this.textShadow.hide();
|
||||||
this.textBorder.hide();
|
this.textBorder.hide();
|
||||||
this.controlBorder.hide();
|
this.controlBorder.hide();
|
||||||
this.text.setStyle({ textFill: '#fff' });
|
this.text.setStyle({ textFill: '#fff' });
|
||||||
this.control.setStyle({ fill: this.style.lcControlColor });
|
this.control.setStyle({ fill: this.style.lcControlColor });
|
||||||
// this.setState(this.state);
|
this.setState(this.state);
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseenter(e) {
|
mouseenter(e) {
|
||||||
if (e.target._subType) {
|
if (e.target._subType) {
|
||||||
console.log(e.target, e.target._subType);
|
this.mouseStateRecover();
|
||||||
// this.mouseStatusRecover();
|
this.mouseStateVisible(e.target._subType);
|
||||||
this.mouseStatusVisible(e.target._subType);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseleave(e) {
|
mouseleave(e) {
|
||||||
if (e.target._subType) {
|
if (e.target._subType) {
|
||||||
this.mouseStatusRecover();
|
this.mouseStateRecover();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -102,7 +102,7 @@ export default class LimitControl extends Group {
|
|||||||
this.add(this.textBorder);
|
this.add(this.textBorder);
|
||||||
this.add(this.controlBorder);
|
this.add(this.controlBorder);
|
||||||
this.setState(this.state);
|
this.setState(this.state);
|
||||||
this.mouseStatusRecover();
|
this.mouseStateRecover();
|
||||||
}
|
}
|
||||||
|
|
||||||
// 设置状态
|
// 设置状态
|
||||||
@ -121,7 +121,7 @@ export default class LimitControl extends Group {
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseStatusVisible(subType) {
|
mouseStateVisible(subType) {
|
||||||
if (subType == 'Text') {
|
if (subType == 'Text') {
|
||||||
this.textShadow.show();
|
this.textShadow.show();
|
||||||
}
|
}
|
||||||
@ -134,7 +134,7 @@ export default class LimitControl extends Group {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseStatusRecover() {
|
mouseStateRecover() {
|
||||||
this.textShadow.hide();
|
this.textShadow.hide();
|
||||||
this.textBorder.hide();
|
this.textBorder.hide();
|
||||||
this.controlBorder.hide();
|
this.controlBorder.hide();
|
||||||
@ -147,23 +147,23 @@ export default class LimitControl extends Group {
|
|||||||
if ([3].includes(e.which)) {
|
if ([3].includes(e.which)) {
|
||||||
this.selected = !this.selected;
|
this.selected = !this.selected;
|
||||||
if (this.selected) {
|
if (this.selected) {
|
||||||
// this.mouseStatusRecover();
|
// this.mouseStateRecover();
|
||||||
this.mouseStatusVisible('Control');
|
this.mouseStateVisible('Control');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseenter(e) {
|
mouseenter(e) {
|
||||||
if (!this.selected && e.target._subType) {
|
if (!this.selected && e.target._subType) {
|
||||||
// this.mouseStatusRecover();
|
// this.mouseStateRecover();
|
||||||
this.mouseStatusVisible(e.target._subType);
|
this.mouseStateVisible(e.target._subType);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseleave(e) {
|
mouseleave(e) {
|
||||||
if (e.target && e.target._subType) {
|
if (e.target && e.target._subType) {
|
||||||
if (!this.selected && e.target._subType) {
|
if (!this.selected && e.target._subType) {
|
||||||
this.mouseStatusRecover();
|
this.mouseStateRecover();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -3,7 +3,7 @@ import Group from 'zrender/src/container/Group';
|
|||||||
|
|
||||||
class Link extends Group {
|
class Link extends Group {
|
||||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||||
super();
|
super({name: _code});
|
||||||
this._code = _code;
|
this._code = _code;
|
||||||
this._type = _type;
|
this._type = _type;
|
||||||
this.zlevel = zlevel;
|
this.zlevel = zlevel;
|
||||||
|
|||||||
@ -38,45 +38,6 @@ class Lamp extends Group {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// let shapeDate = null;
|
|
||||||
// if (model.highType === '01') {
|
|
||||||
// // 矮柱
|
|
||||||
// if (model.drict != 1) {
|
|
||||||
// // 左侧
|
|
||||||
// shapeDate = {
|
|
||||||
// x: model.origin.x + model.drict * model.lampCount * 2 * model.style.signalR - 2.5,
|
|
||||||
// y: model.origin.y + model.drict * model.style.signalR - 1,
|
|
||||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
|
||||||
// height: model.style.signalR * 2 + 2
|
|
||||||
// };
|
|
||||||
// } else {
|
|
||||||
// shapeDate = {
|
|
||||||
// x: model.origin.x - model.drict + 1.5,
|
|
||||||
// y: model.origin.y - model.drict * model.style.signalR - 1,
|
|
||||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
|
||||||
// height: model.style.signalR * 2 + 2
|
|
||||||
// };
|
|
||||||
// }
|
|
||||||
// } else {
|
|
||||||
// // 高柱
|
|
||||||
// if (model.drict != 1) {
|
|
||||||
// // 左侧
|
|
||||||
// shapeDate = {
|
|
||||||
// x: model.origin.x + model.drict * model.lampCount * 2 * model.style.signalR - 2.5 - 3,
|
|
||||||
// y: model.origin.y + model.drict * model.style.signalR - 1,
|
|
||||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
|
||||||
// height: model.style.signalR * 2 + 2
|
|
||||||
// };
|
|
||||||
// } else {
|
|
||||||
// shapeDate = {
|
|
||||||
// x: model.origin.x - model.drict + 1.5 + 3,
|
|
||||||
// y: model.origin.y - model.drict * model.style.signalR - 1,
|
|
||||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
|
||||||
// height: model.style.signalR * 2 + 2
|
|
||||||
// };
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
this.lstop = new Line({
|
this.lstop = new Line({
|
||||||
zlevel: this.zlevel + 1,
|
zlevel: this.zlevel + 1,
|
||||||
z: this.z,
|
z: this.z,
|
||||||
@ -210,7 +171,6 @@ class JSigDrict extends Group {
|
|||||||
zlevel: this.zlevel,
|
zlevel: this.zlevel,
|
||||||
z: this.z,
|
z: this.z,
|
||||||
shape: {
|
shape: {
|
||||||
// points: triangular(model.position.x, model.position.y + model.drict * model.style.signalLampStandardWidth, model.drict, model.style.signalR),
|
|
||||||
points: triangular(model.position.x, model.position.y, model.drict, model.style.signalR)
|
points: triangular(model.position.x, model.position.y, model.drict, model.style.signalR)
|
||||||
},
|
},
|
||||||
style: {
|
style: {
|
||||||
|
|||||||
@ -6,7 +6,7 @@ import Text from 'zrender/src/graphic/Text';
|
|||||||
|
|
||||||
export default class Station extends Group {
|
export default class Station extends Group {
|
||||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||||
super();
|
super({name: _code});
|
||||||
this.z = 40;
|
this.z = 40;
|
||||||
this._code = _code;
|
this._code = _code;
|
||||||
this._type = _type;
|
this._type = _type;
|
||||||
@ -20,6 +20,8 @@ export default class Station extends Group {
|
|||||||
_create() {
|
_create() {
|
||||||
const model = this.model;
|
const model = this.model;
|
||||||
const style = this.style;
|
const style = this.style;
|
||||||
|
const state = this.state;
|
||||||
|
|
||||||
if (model.visible) {
|
if (model.visible) {
|
||||||
this.stationText = new Text({
|
this.stationText = new Text({
|
||||||
zlevel: this.zlevel,
|
zlevel: this.zlevel,
|
||||||
@ -54,7 +56,7 @@ export default class Station extends Group {
|
|||||||
this.add(this.stationText);
|
this.add(this.stationText);
|
||||||
this.add(this.mileageText);
|
this.add(this.mileageText);
|
||||||
this.setShowMileageText(model.kmPostShow);
|
this.setShowMileageText(model.kmPostShow);
|
||||||
this.setState(this.state);
|
this.setState(state);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -8,7 +8,7 @@ import Group from 'zrender/src/container/Group';
|
|||||||
/** 单个控制灯*/
|
/** 单个控制灯*/
|
||||||
class SingleControl extends Group {
|
class SingleControl extends Group {
|
||||||
constructor(model) {
|
constructor(model) {
|
||||||
super();
|
super({name: `${model.name}`});
|
||||||
this.model = model;
|
this.model = model;
|
||||||
this.zlevel = model.zlevel;
|
this.zlevel = model.zlevel;
|
||||||
this._subType = model._subType;
|
this._subType = model._subType;
|
||||||
@ -72,7 +72,7 @@ class SingleControl extends Group {
|
|||||||
/** 控制模式*/
|
/** 控制模式*/
|
||||||
export default class StationControl extends Group {
|
export default class StationControl extends Group {
|
||||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||||
super();
|
super({name: _code});
|
||||||
this.selected = false;
|
this.selected = false;
|
||||||
this._code = _code;
|
this._code = _code;
|
||||||
this._type = _type;
|
this._type = _type;
|
||||||
@ -87,10 +87,13 @@ export default class StationControl extends Group {
|
|||||||
|
|
||||||
_create() {
|
_create() {
|
||||||
const model = this.model;
|
const model = this.model;
|
||||||
|
const state = this.state;
|
||||||
|
|
||||||
this.emergencyControl = new SingleControl({
|
this.emergencyControl = new SingleControl({
|
||||||
_subType: 'emergency',
|
_subType: 'emergency',
|
||||||
style: this.style,
|
style: this.style,
|
||||||
zlevel: this.zlevel,
|
zlevel: this.zlevel,
|
||||||
|
name: `${this._code}_Emergency`,
|
||||||
point: {
|
point: {
|
||||||
x: model.position.x - this.style.stationControlDistance,
|
x: model.position.x - this.style.stationControlDistance,
|
||||||
y: model.position.y
|
y: model.position.y
|
||||||
@ -103,6 +106,7 @@ export default class StationControl extends Group {
|
|||||||
_subType: 'center',
|
_subType: 'center',
|
||||||
style: this.style,
|
style: this.style,
|
||||||
zlevel: this.zlevel,
|
zlevel: this.zlevel,
|
||||||
|
name: `${this._code}_Center`,
|
||||||
point: {
|
point: {
|
||||||
x: model.position.x,
|
x: model.position.x,
|
||||||
y: model.position.y
|
y: model.position.y
|
||||||
@ -115,6 +119,7 @@ export default class StationControl extends Group {
|
|||||||
_subType: 'substation',
|
_subType: 'substation',
|
||||||
style: this.style,
|
style: this.style,
|
||||||
zlevel: this.zlevel,
|
zlevel: this.zlevel,
|
||||||
|
name: `${this._code}_Substation`,
|
||||||
point: {
|
point: {
|
||||||
x: model.position.x + this.style.stationControlDistance,
|
x: model.position.x + this.style.stationControlDistance,
|
||||||
y: model.position.y
|
y: model.position.y
|
||||||
@ -126,6 +131,7 @@ export default class StationControl extends Group {
|
|||||||
this.textShadow = new Text({
|
this.textShadow = new Text({
|
||||||
zlevel: this.zlevel,
|
zlevel: this.zlevel,
|
||||||
z: this.z + 1,
|
z: this.z + 1,
|
||||||
|
name: `${this._code}_TextShadow`,
|
||||||
position: [0, -4],
|
position: [0, -4],
|
||||||
silent: true,
|
silent: true,
|
||||||
style: {
|
style: {
|
||||||
@ -143,8 +149,8 @@ export default class StationControl extends Group {
|
|||||||
this.add(this.centerControl);
|
this.add(this.centerControl);
|
||||||
this.add(this.emergencyControl);
|
this.add(this.emergencyControl);
|
||||||
this.add(this.textShadow);
|
this.add(this.textShadow);
|
||||||
this.setState(this.state);
|
this.setState(state);
|
||||||
this.mouseStatusRecover();
|
this.mouseStateRecover();
|
||||||
}
|
}
|
||||||
|
|
||||||
// 设置状态
|
// 设置状态
|
||||||
@ -195,7 +201,7 @@ export default class StationControl extends Group {
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseStatusVisible(subType) {
|
mouseStateVisible(subType) {
|
||||||
switch (subType) {
|
switch (subType) {
|
||||||
case 'emergency': this.textShadow.setStyle({ text: this.model.jjzkContent }); break;
|
case 'emergency': this.textShadow.setStyle({ text: this.model.jjzkContent }); break;
|
||||||
case 'center': this.textShadow.setStyle({ text: this.model.zokContent }); break;
|
case 'center': this.textShadow.setStyle({ text: this.model.zokContent }); break;
|
||||||
@ -204,19 +210,19 @@ export default class StationControl extends Group {
|
|||||||
this.textShadow.show();
|
this.textShadow.show();
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseStatusRecover() {
|
mouseStateRecover() {
|
||||||
this.textShadow.hide();
|
this.textShadow.hide();
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseenter(e) {
|
mouseenter(e) {
|
||||||
if (e.target.parent && e.target.parent._subType) {
|
if (e.target.parent && e.target.parent._subType) {
|
||||||
this.mouseStatusVisible(e.target.parent._subType);
|
this.mouseStateVisible(e.target.parent._subType);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseleave(e) {
|
mouseleave(e) {
|
||||||
if (e.target._subType) {
|
if (e.target._subType) {
|
||||||
this.mouseStatusRecover();
|
this.mouseStateRecover();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -7,7 +7,7 @@ import Text from 'zrender/src/graphic/Text';
|
|||||||
|
|
||||||
export default class StationCounter extends Group {
|
export default class StationCounter extends Group {
|
||||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||||
super();
|
super({name: _code});
|
||||||
this._code = _code;
|
this._code = _code;
|
||||||
this._type = _type;
|
this._type = _type;
|
||||||
this.model = model;
|
this.model = model;
|
||||||
@ -75,10 +75,10 @@ export default class StationCounter extends Group {
|
|||||||
this.add(this.counterName);
|
this.add(this.counterName);
|
||||||
this.add(this.table);
|
this.add(this.table);
|
||||||
this.add(this.counter);
|
this.add(this.counter);
|
||||||
this.setStatus(state);
|
this.setState(state);
|
||||||
}
|
}
|
||||||
|
|
||||||
setStatus(state) {
|
setState(state) {
|
||||||
}
|
}
|
||||||
|
|
||||||
getShapeTipPoint() {
|
getShapeTipPoint() {
|
||||||
|
|||||||
@ -7,7 +7,7 @@ import Group from 'zrender/src/container/Group';
|
|||||||
|
|
||||||
export default class StationDelayUnlock extends Group {
|
export default class StationDelayUnlock extends Group {
|
||||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||||
super();
|
super({name: _code});
|
||||||
this._code = _code;
|
this._code = _code;
|
||||||
this._type = _type;
|
this._type = _type;
|
||||||
this.model = model;
|
this.model = model;
|
||||||
@ -77,7 +77,7 @@ export default class StationDelayUnlock extends Group {
|
|||||||
});
|
});
|
||||||
this.add(this.table);
|
this.add(this.table);
|
||||||
|
|
||||||
this.setStatus(state);
|
this.setState(state);
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 延时解锁关闭*/
|
/** 延时解锁关闭*/
|
||||||
@ -93,7 +93,7 @@ export default class StationDelayUnlock extends Group {
|
|||||||
this.time.setStyle('text', '' + this.model.remainTime);
|
this.time.setStyle('text', '' + this.model.remainTime);
|
||||||
}
|
}
|
||||||
|
|
||||||
setStatus(state) {
|
setState(state) {
|
||||||
switch (state.status) {
|
switch (state.status) {
|
||||||
case '01': this.delayClose(); break; // 关闭
|
case '01': this.delayClose(); break; // 关闭
|
||||||
case '02': this.delayUnlock(); break; // 延迟解锁
|
case '02': this.delayUnlock(); break; // 延迟解锁
|
||||||
|
|||||||
528
src/jmap/shape/StationStand.js
Normal file
528
src/jmap/shape/StationStand.js
Normal file
@ -0,0 +1,528 @@
|
|||||||
|
/**/
|
||||||
|
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) {
|
||||||
|
// 方向值
|
||||||
|
let 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
|
||||||
|
}
|
||||||
|
});
|
||||||
|
/** 站台折返策略*/
|
||||||
|
let beyond = 4;
|
||||||
|
let height = 5;
|
||||||
|
let width = 10;
|
||||||
|
let offsetx = (model.width - width / 2);
|
||||||
|
let 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);
|
||||||
|
|
||||||
|
/** 站台扣车*/
|
||||||
|
let distance = 0;
|
||||||
|
let 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];
|
||||||
|
}
|
||||||
|
let 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];
|
||||||
|
}
|
||||||
|
let 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);
|
||||||
|
|
||||||
|
/** 屏蔽门*/
|
||||||
|
let 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);
|
||||||
|
this.mouseStatusRecover();
|
||||||
|
}
|
||||||
|
setDrict(doorLocationType) {
|
||||||
|
let model = this.model;
|
||||||
|
let style = this.style;
|
||||||
|
if (doorLocationType === '01') {
|
||||||
|
let 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 {
|
||||||
|
let 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);
|
||||||
|
|
||||||
|
|
||||||
|
let 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();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 设置扣车*/
|
||||||
|
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() {
|
||||||
|
let rect = this.stationStand.getBoundingRect();
|
||||||
|
if (rect) {
|
||||||
|
return {
|
||||||
|
x: rect.x + rect.width / 2,
|
||||||
|
y: rect.y
|
||||||
|
};
|
||||||
|
}
|
||||||
|
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;
|
||||||
@ -10,7 +10,7 @@ import JTriangle from '../utils/JTriangle';
|
|||||||
|
|
||||||
export default class Switch extends Group {
|
export default class Switch extends Group {
|
||||||
constructor({ _code, _type, zlevel, model, state }, style, jmap) {
|
constructor({ _code, _type, zlevel, model, state }, style, jmap) {
|
||||||
super();
|
super({name: _code});
|
||||||
this._code = _code;
|
this._code = _code;
|
||||||
this._type = _type;
|
this._type = _type;
|
||||||
this.model = model;
|
this.model = model;
|
||||||
@ -82,7 +82,7 @@ export default class Switch extends Group {
|
|||||||
stroke: style.backgroundColor
|
stroke: style.backgroundColor
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
this.switchView = new Group();
|
this.switchView = new Group({name: `${this._code}_SwitchView`});
|
||||||
this.switchView.add(line);
|
this.switchView.add(line);
|
||||||
this.switchView.add(skewLine);
|
this.switchView.add(skewLine);
|
||||||
|
|
||||||
@ -580,7 +580,7 @@ export default class Switch extends Group {
|
|||||||
stroke: this.style.switchTextBorderColor,
|
stroke: this.style.switchTextBorderColor,
|
||||||
fill: this.style.transparentColor
|
fill: this.style.transparentColor
|
||||||
});
|
});
|
||||||
this.setState(this.model);
|
this.setState(this.state);
|
||||||
}
|
}
|
||||||
|
|
||||||
mouseclick(e) {
|
mouseclick(e) {
|
||||||
|
|||||||
620
src/jmap/shape/Train.js
Normal file
620
src/jmap/shape/Train.js
Normal file
@ -0,0 +1,620 @@
|
|||||||
|
import Group from 'zrender/src/container/Group';
|
||||||
|
import Text from 'zrender/src/graphic/Text';
|
||||||
|
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||||
|
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||||
|
import BoundingRect from 'zrender/src/core/BoundingRect';
|
||||||
|
//import ModelType from '@/jlmap/model/ModelType';
|
||||||
|
import store from '@/store';
|
||||||
|
|
||||||
|
/** 车身*/
|
||||||
|
class TrainBody extends Group {
|
||||||
|
constructor(model) {
|
||||||
|
super();
|
||||||
|
this.model = model;
|
||||||
|
this._create(model);
|
||||||
|
}
|
||||||
|
|
||||||
|
_create(model) {
|
||||||
|
let textFont = model.style.trainTextFontSize + 'px ' + model.style.textFontFormat;
|
||||||
|
let TextFontHSDA = model.style.trainHSDATextFontSize + 'px ' + model.style.textFontFormat;
|
||||||
|
|
||||||
|
let destinationText = '';
|
||||||
|
switch (model.model.destinationStatus) {
|
||||||
|
case '01': destinationText = '准点'; break;
|
||||||
|
case '02': destinationText = '早点'; break;
|
||||||
|
case '03': destinationText = '严重早点'; break;
|
||||||
|
case '04': destinationText = '晚点'; break;
|
||||||
|
case '05': destinationText = '严重晚点'; break;
|
||||||
|
default: destinationText = '未知'; break;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 文字描述
|
||||||
|
this.arrowText = new Text({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
style: {
|
||||||
|
x: model.point.x + 50,
|
||||||
|
y: model.point.y + 25,
|
||||||
|
text: `列车类型: 计划车\n表\0\0\0\0号: ${model.model.serviceNumber}\n车\0次\0号: ${model.model.tripNumber}\n目的地号: ${model.model.targetCode ? model.model.targetCode : ''}\n车\0组\0号: ${model.model.groupNumber}\n早\0晚\0点: ${destinationText}\n运行方向: ${model.model.directionType == '02' ? '上行' : '下行'}\n乘务组号: \n起点站名: \n终点站名: \n占用轨道: ${model.model.sectionModel ? model.model.sectionModel.trackName : ''}\n所在车站: \n车地通信: 正常\n运行等级: 4\n扣车状态: ${model.model.runControlStatus == '01' ? '正常' : model.model.runControlStatus == '03' ? '跳停' : '扣车'}\n停稳状态: ${model.model.runStatus == '02' ? '未停稳' : '停稳'}\n阻塞状态: 无\n列车速度: ${model.model.speed || 0} km/h\n列车移动授权距离: ${model.model.maLen || 0} m`,
|
||||||
|
textFill: '#000',
|
||||||
|
textAlign: 'letf',
|
||||||
|
textFont: 10 + 'px consolas',
|
||||||
|
textPadding: 3,
|
||||||
|
textBackgroundColor: this.model.style.tipBackgroundColor,
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this.train = new Rect({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
shape: {
|
||||||
|
x: model.point.x,
|
||||||
|
y: model.point.y,
|
||||||
|
width: model.style.trainWidth,
|
||||||
|
height: model.style.trainHeight
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
lineWidth: 0.1,
|
||||||
|
stroke: model.style.trainSidelineColor,
|
||||||
|
fill: model.style.trainBrown1Color
|
||||||
|
},
|
||||||
|
cursor: 'pointer'
|
||||||
|
});
|
||||||
|
|
||||||
|
let lrPadding = 3; //两边间隔
|
||||||
|
let upPadding = 4; //上边距离
|
||||||
|
let beginX = (model.point.x + lrPadding);
|
||||||
|
let beginY = (model.point.y - model.style.trainHSDATextFontSize - upPadding);
|
||||||
|
let margin = (model.style.trainWidth - lrPadding * 2) / 4;
|
||||||
|
this.textH = new Text({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
style: {
|
||||||
|
x: parseInt(beginX + margin * 0),
|
||||||
|
y: parseInt(beginY),
|
||||||
|
text: 'H',
|
||||||
|
textFill: model.style.trainYellowColor,
|
||||||
|
textFont: TextFontHSDA,
|
||||||
|
textAlign: 'middle',
|
||||||
|
textVerticalAlign: 'top',
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this.textS = new Text({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
style: {
|
||||||
|
x: parseInt(beginX + margin * 1),
|
||||||
|
y: parseInt(beginY),
|
||||||
|
text: 'S',
|
||||||
|
textFill: model.style.trainBlueColor,
|
||||||
|
textFont: TextFontHSDA,
|
||||||
|
textAlign: 'middle',
|
||||||
|
textVerticalAlign: 'top',
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this.textD = new Text({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
style: {
|
||||||
|
x: parseInt(beginX + margin * 2),
|
||||||
|
y: parseInt(beginY),
|
||||||
|
text: 'D',
|
||||||
|
textFill: model.style.trainGreenColor,
|
||||||
|
textFont: TextFontHSDA,
|
||||||
|
textAlign: 'middle',
|
||||||
|
textVerticalAlign: 'top',
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this.textA = new Text({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
style: {
|
||||||
|
x: parseInt(beginX + margin * 3),
|
||||||
|
y: parseInt(beginY),
|
||||||
|
text: 'A',
|
||||||
|
textFill: model.style.trainRedColor,
|
||||||
|
textFont: TextFontHSDA,
|
||||||
|
textAlign: 'middle',
|
||||||
|
textVerticalAlign: 'top',
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
lrPadding = 4; //两边间隔
|
||||||
|
upPadding = 4; //上边距离
|
||||||
|
let serviceNumber = model.model.serviceNumber || 'AA';
|
||||||
|
let tripNumber = model.model.tripNumber || 'DDD';
|
||||||
|
|
||||||
|
serviceNumber = '00' + serviceNumber;
|
||||||
|
tripNumber = '000' + tripNumber;
|
||||||
|
this.textTrainServer = new Text({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
style: {
|
||||||
|
x: parseInt(model.point.x + lrPadding),
|
||||||
|
y: parseInt(model.point.y + upPadding),
|
||||||
|
text: serviceNumber.substring(serviceNumber.length - 2),
|
||||||
|
textFill: model.style.trainBrownColor,
|
||||||
|
textFont: textFont,
|
||||||
|
textAlign: 'left',
|
||||||
|
textVerticalAlign: 'top',
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this.textTrainTarget = new Text({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
style: {
|
||||||
|
x: parseInt(model.point.x + model.style.trainWidth - lrPadding),
|
||||||
|
y: parseInt(model.point.y + upPadding),
|
||||||
|
text: tripNumber.substring(tripNumber.length - 3),
|
||||||
|
textFill: model.style.trainYellowColor,
|
||||||
|
textFont: textFont,
|
||||||
|
textAlign: 'right',
|
||||||
|
textVerticalAlign: 'top',
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.add(this.train);
|
||||||
|
this.add(this.textH);
|
||||||
|
this.add(this.textS);
|
||||||
|
this.add(this.textD);
|
||||||
|
this.add(this.textA);
|
||||||
|
this.add(this.textTrainServer);
|
||||||
|
this.add(this.textTrainTarget);
|
||||||
|
}
|
||||||
|
setMouseOver() {
|
||||||
|
//store.dispatch('map/setTrainDetails', this.model);
|
||||||
|
this.details = store.state.map.trainDetails;
|
||||||
|
this.add(this.arrowText);
|
||||||
|
this.arrowText.attr({
|
||||||
|
style: {
|
||||||
|
x: this.details.point.x + 50,
|
||||||
|
y: this.details.point.y + 25,
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
setMouseOut() {
|
||||||
|
this.remove(this.arrowText);
|
||||||
|
//store.dispatch('map/setTrainDetails', null);
|
||||||
|
}
|
||||||
|
setTrainColor(color) {
|
||||||
|
this.train && this.train.setStyle('fill', color);
|
||||||
|
}
|
||||||
|
setTextTrainServerColor(color) {
|
||||||
|
this.textTrainServer.setStyle('textFill', color);
|
||||||
|
this.textTrainServer.setStyle('textStroke', color);
|
||||||
|
}
|
||||||
|
setTextTrainTargetColor(color) {
|
||||||
|
this.textTrainTarget.setStyle('textFill', color);
|
||||||
|
this.textTrainTarget.setStyle('textStroke', color);
|
||||||
|
}
|
||||||
|
setHShow(isShow) {
|
||||||
|
isShow ? this.textH.show() : this.textH.hide();
|
||||||
|
}
|
||||||
|
setSShow(isShow) {
|
||||||
|
isShow ? this.textS.show() : this.textS.hide();
|
||||||
|
}
|
||||||
|
setDShow(isShow) {
|
||||||
|
isShow ? this.textD.show() : this.textD.hide();
|
||||||
|
}
|
||||||
|
setAShow(isShow) {
|
||||||
|
isShow ? this.textA.show() : this.textA.hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 车头*/
|
||||||
|
class TrainHead extends Group {
|
||||||
|
constructor(model) {
|
||||||
|
super();
|
||||||
|
this.model = model;
|
||||||
|
this._create(model);
|
||||||
|
}
|
||||||
|
_create(model) {
|
||||||
|
let baseMargin = (model.drect === -1 ? 1 : 0);
|
||||||
|
this.line = new Rect({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
shape: {
|
||||||
|
x: model.point.x - baseMargin * (model.style.trainConntWidth),
|
||||||
|
y: model.point.y,
|
||||||
|
width: model.style.trainConntWidth,
|
||||||
|
height: model.style.trainHeight + 2 * model.style.trainMoreLength
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
lineWidth: 0.1,
|
||||||
|
stroke: model.style.trainSidelineColor,
|
||||||
|
fill: model.style.trainBackground
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let arrowMargin = model.style.trainPadding + model.style.trainConntWidth;
|
||||||
|
this.arrow = new Polygon({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: model.z,
|
||||||
|
shape: {
|
||||||
|
points: [
|
||||||
|
[model.point.x + model.drect * (arrowMargin), model.point.y + 1 - model.style.trainMoreLength],
|
||||||
|
[model.point.x + model.drect * (arrowMargin + model.style.trainArrowWidth), model.point.y + (model.style.trainHeight + model.style.trainMoreLength) / 2],
|
||||||
|
[model.point.x + model.drect * (arrowMargin), model.point.y - 1 + model.style.trainHeight + model.style.trainMoreLength]
|
||||||
|
]
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
lineWidth: 0.1,
|
||||||
|
stroke: model.style.trainSidelineColor,
|
||||||
|
fill: model.style.trainBackground
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this.add(this.line);
|
||||||
|
this.add(this.arrow);
|
||||||
|
}
|
||||||
|
setColor(color) {
|
||||||
|
this.line && this.line.setStyle('fill', color);
|
||||||
|
this.arrow && this.arrow.setStyle('fill', color);
|
||||||
|
}
|
||||||
|
setLineShow(isShow) {
|
||||||
|
isShow ? this.line.show() : this.line.hide();
|
||||||
|
}
|
||||||
|
setArrowShow(isShow) {
|
||||||
|
isShow ? this.arrow.show() : this.arrow.hide();
|
||||||
|
}
|
||||||
|
setInvisible(invisible) {
|
||||||
|
this.eachChild((child) => {
|
||||||
|
child.attr('invisible', invisible);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/** 列车 */
|
||||||
|
export default class Train 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.section = null;
|
||||||
|
this.selected = false;
|
||||||
|
this.fontSize = model.nameFontSize || style.trainTextFontSize;
|
||||||
|
this.newScale = this.fontSize / style.trainTextFontSize;
|
||||||
|
this._create(model, style);
|
||||||
|
this.on('mousedown', this.mouseclick);
|
||||||
|
this.on('mouseout', this.mouseleave);
|
||||||
|
this.on('mouseover', this.mouseenter);
|
||||||
|
}
|
||||||
|
|
||||||
|
_computed(model, style) {
|
||||||
|
if (model.trainWindowModel) {
|
||||||
|
this.point = {
|
||||||
|
x: model.trainWindowModel.point.x,
|
||||||
|
y: model.trainWindowModel.point.y
|
||||||
|
};
|
||||||
|
|
||||||
|
switch (model.directionType) {
|
||||||
|
case '01': { //未知方向
|
||||||
|
this.point.x = this.point.x + model.trainWindowModel.width / 2 + Math.abs((style.trainWidth - model.trainWindowModel.width) / 2);
|
||||||
|
} break;
|
||||||
|
case '02': { //从左向右
|
||||||
|
this.point.x = this.point.x + model.trainWindowModel.width / 2 - style.trainConntWidth * this.newScale - style.trainWidth;
|
||||||
|
} break;
|
||||||
|
case '03': { //从右向左
|
||||||
|
this.point.x = this.point.x - model.trainWindowModel.width / 2 + style.trainConntWidth * this.newScale;
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.point = model.position;
|
||||||
|
this.traingle = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
_create(model, style) {
|
||||||
|
//计算画图坐标点
|
||||||
|
this._computed(model, style);
|
||||||
|
|
||||||
|
//画图
|
||||||
|
if (this.point) {
|
||||||
|
// body
|
||||||
|
this.trainB = new TrainBody({
|
||||||
|
model: model,
|
||||||
|
style: style,
|
||||||
|
zlevel: this.zlevel,
|
||||||
|
z: this.z,
|
||||||
|
point: this.point
|
||||||
|
});
|
||||||
|
// left 头
|
||||||
|
this.trainL = new TrainHead({
|
||||||
|
style: style,
|
||||||
|
zlevel: this.zlevel,
|
||||||
|
z: this.z,
|
||||||
|
point: {
|
||||||
|
x: this.point.x - style.trainHeadDistance,
|
||||||
|
y: this.point.y
|
||||||
|
},
|
||||||
|
drect: -1
|
||||||
|
});
|
||||||
|
// right 头
|
||||||
|
this.trainR = new TrainHead({
|
||||||
|
style: style,
|
||||||
|
zlevel: this.zlevel,
|
||||||
|
z: this.z,
|
||||||
|
point: {
|
||||||
|
x: this.point.x + style.trainWidth + style.trainHeadDistance,
|
||||||
|
y: this.point.y
|
||||||
|
},
|
||||||
|
drect: 1
|
||||||
|
});
|
||||||
|
this.add(this.trainB);
|
||||||
|
this.add(this.trainL);
|
||||||
|
this.add(this.trainR);
|
||||||
|
|
||||||
|
let rect = Object.assign({}, this.getBoundingRect());
|
||||||
|
rect.x -= style.trainWidth / 2;
|
||||||
|
rect.y -= 5;
|
||||||
|
rect.width += style.trainWidth;
|
||||||
|
rect.height += 10;
|
||||||
|
|
||||||
|
this.trainBorder = new Rect({
|
||||||
|
zlevel: model.zlevel,
|
||||||
|
z: this.z,
|
||||||
|
silent: true,
|
||||||
|
shape: rect,
|
||||||
|
style: {
|
||||||
|
lineDash: [3, 3],
|
||||||
|
stroke: style.borderColor,
|
||||||
|
fill: style.transparentColor
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
this.add(this.trainBorder);
|
||||||
|
this.setState(model);
|
||||||
|
this.mouseStatusRecover();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
getShapeTipPoint() {
|
||||||
|
return {
|
||||||
|
x: (this.train.shape.x),
|
||||||
|
y: (this.train.shape.y)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
//恢复颜色状态
|
||||||
|
recover() {
|
||||||
|
this.trainB.setHShow(false);
|
||||||
|
this.trainB.setSShow(false);
|
||||||
|
this.trainB.setDShow(false);
|
||||||
|
this.trainB.setAShow(false);
|
||||||
|
this.trainL.setLineShow(false);
|
||||||
|
this.trainR.setLineShow(false);
|
||||||
|
this.trainL.setArrowShow(false);
|
||||||
|
this.trainR.setArrowShow(false);
|
||||||
|
}
|
||||||
|
//设置服务号状态类型
|
||||||
|
setServerNoType(type) {
|
||||||
|
switch (type) {
|
||||||
|
case '01': { //显示服务号 计划车
|
||||||
|
this.trainB.setTextTrainServerColor(this.style.trainWitheColor);
|
||||||
|
} break;
|
||||||
|
case '02': { //显示车组号: 头码车与人工车
|
||||||
|
this.trainB.setTextTrainServerColor(this.style.trainYellowColor);
|
||||||
|
} break;
|
||||||
|
default: {
|
||||||
|
this.trainB.setTextTrainServerColor(this.style.backgroundColor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//设置目的地状态
|
||||||
|
setDestinationStatus(status) {
|
||||||
|
switch (status) {
|
||||||
|
case '01': { //准点
|
||||||
|
this.trainB.setTextTrainTargetColor(this.style.trainWitheColor);
|
||||||
|
} break;
|
||||||
|
case '02': { //早点
|
||||||
|
this.trainB.setTextTrainTargetColor(this.style.trainGreenColor);
|
||||||
|
} break;
|
||||||
|
case '03': { //晚点
|
||||||
|
this.trainB.setTextTrainTargetColor(this.style.trainBrownColor);
|
||||||
|
} break;
|
||||||
|
case '04': { //头码车
|
||||||
|
this.trainB.setTextTrainTargetColor(this.style.trainYellowColor);
|
||||||
|
} break;
|
||||||
|
default: {
|
||||||
|
this.trainB.setTextTrainTargetColor(this.style.backgroundColor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//设置运行方向状态类型
|
||||||
|
setDirectionType(type) {
|
||||||
|
switch (type) {
|
||||||
|
case '01': { //未知方向
|
||||||
|
this.trainL.setLineShow(true);
|
||||||
|
this.trainR.setLineShow(true);
|
||||||
|
} break;
|
||||||
|
case '02': { //从左往右 上行
|
||||||
|
this.trainR.setLineShow(true);
|
||||||
|
this.trainR.setArrowShow(true);
|
||||||
|
} break;
|
||||||
|
case '03': { //从右往左 下行
|
||||||
|
this.trainL.setLineShow(true);
|
||||||
|
this.trainL.setArrowShow(true);
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 设置列车停止方向类型
|
||||||
|
setDirectionStopType(type) {
|
||||||
|
switch (type) {
|
||||||
|
case '01': { //未知方向
|
||||||
|
} break;
|
||||||
|
case '02': { //从左往右 上行
|
||||||
|
this.trainR.setLineShow(true);
|
||||||
|
} break;
|
||||||
|
case '03': { //从右往左 下行
|
||||||
|
this.trainL.setLineShow(true);
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//设置运行状态
|
||||||
|
setRunStatus(status) {
|
||||||
|
switch (status) {
|
||||||
|
case '01': { //停止
|
||||||
|
this.setDirectionStopType(this.model.directionType); //设置运行方向状态类型
|
||||||
|
} break;
|
||||||
|
case '02': { //运行
|
||||||
|
this.setDirectionType(this.model.directionType); //设置运行方向状态类型
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
//设置运行模式
|
||||||
|
setRunMode(status) {
|
||||||
|
switch (status) {
|
||||||
|
case '01': { //未知
|
||||||
|
this.trainL.setColor(this.style.trainWitheColor);
|
||||||
|
this.trainR.setColor(this.style.trainWitheColor);
|
||||||
|
} break;
|
||||||
|
case '02': { //ATO自动驾驶模式 AM
|
||||||
|
this.trainL.setColor(this.style.trainGreenColor);
|
||||||
|
this.trainR.setColor(this.style.trainGreenColor);
|
||||||
|
} break;
|
||||||
|
case '03': { //ATP监控下的人工驾驶模式 CM
|
||||||
|
this.trainL.setColor(this.style.trainYellowColor);
|
||||||
|
this.trainR.setColor(this.style.trainYellowColor);
|
||||||
|
} break;
|
||||||
|
case '04': { //限制人工驾驶模式 RM
|
||||||
|
this.trainL.setColor(this.style.trainBrownColor);
|
||||||
|
this.trainR.setColor(this.style.trainBrownColor);
|
||||||
|
} break;
|
||||||
|
case '05': { //非限制人工驾驶模式 RM
|
||||||
|
this.trainL.setColor(this.style.trainBrownColor);
|
||||||
|
this.trainR.setColor(this.style.trainBrownColor);
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//设置运行控制状态类型
|
||||||
|
setRunControlStatus(status) {
|
||||||
|
switch (status) {
|
||||||
|
case '01': { //正常
|
||||||
|
this.trainB.setHShow(false);
|
||||||
|
this.trainB.setSShow(false);
|
||||||
|
} break;
|
||||||
|
case '02': { //扣车
|
||||||
|
this.trainB.setHShow(true);
|
||||||
|
} break;
|
||||||
|
case '03': { //跳停
|
||||||
|
this.trainB.setSShow(true);
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//设置车门状态类型
|
||||||
|
setDoorStatus(status) {
|
||||||
|
switch (status) {
|
||||||
|
case '01': { //关门
|
||||||
|
this.trainB.setDShow(false);
|
||||||
|
} break;
|
||||||
|
case '02': { //开门
|
||||||
|
this.trainB.setDShow(true);
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//设置通信状态类型
|
||||||
|
setCommunicationStatus() {
|
||||||
|
switch (status) {
|
||||||
|
case '01': { //正常
|
||||||
|
this.trainB.setTrainColor(this.style.trainBrown1Color);
|
||||||
|
} break;
|
||||||
|
case '02': { //故障
|
||||||
|
this.trainB.setTrainColor(this.style.trainGrayColor);
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//设置报警状态
|
||||||
|
setAlarmStatus(status) {
|
||||||
|
switch (status) {
|
||||||
|
case '01': { //不报警
|
||||||
|
this.trainB.setAShow(false);
|
||||||
|
} break;
|
||||||
|
case '02': { //报警
|
||||||
|
this.trainB.setAShow(true);
|
||||||
|
} break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//设置状态
|
||||||
|
setState(model) {
|
||||||
|
if (model) {
|
||||||
|
this.recover();
|
||||||
|
this.setServerNoType(model.serverNoType); //设置服务号状态类型
|
||||||
|
this.setDestinationStatus(model.destinationStatus); //设置目的地状态
|
||||||
|
this.setRunStatus(model.runStatus); //设置运行状态
|
||||||
|
this.setRunMode(model.runMode); //设置运行模式
|
||||||
|
this.setRunControlStatus(model.runControlStatus); //设置运行控制状态类型
|
||||||
|
this.setDoorStatus(model.doorStatus); //设置车门状态类型
|
||||||
|
this.setCommunicationStatus(model.communicationStatus); //设置通信状态类型
|
||||||
|
this.setAlarmStatus(model.alarmStatus); //设置报警状态
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//获取列车包围框
|
||||||
|
getBoundingRect() {
|
||||||
|
let list = [this.trainB, this.trainL, this.trainR];
|
||||||
|
let rect = null;
|
||||||
|
|
||||||
|
list.forEach(elem => {
|
||||||
|
if (elem) {
|
||||||
|
let tempRect = elem.getBoundingRect();
|
||||||
|
if (tempRect.x && tempRect.y && tempRect.width && tempRect.height) {
|
||||||
|
if (rect) {
|
||||||
|
rect.union(tempRect);
|
||||||
|
} else {
|
||||||
|
rect = tempRect;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return rect || new BoundingRect(0, 0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
setSectionBorderShow(show) {
|
||||||
|
/* let section = store.getters['map/getViewInstanceByDevice']({ _type: ModelType.Section, _code: this.model.sectionCode });
|
||||||
|
show && section && section.mouseStatusVisible();
|
||||||
|
show || section && section.mouseStatusRecover();*/
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseStatusVisible() {
|
||||||
|
this.trainBorder.show();
|
||||||
|
this.setSectionBorderShow(true);
|
||||||
|
this.trainB.setMouseOver();
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseStatusRecover() {
|
||||||
|
this.trainBorder.hide();
|
||||||
|
this.setSectionBorderShow(false);
|
||||||
|
this.trainB.setMouseOut();
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseclick(e) {
|
||||||
|
if ([3].includes(e.which)) {
|
||||||
|
this.selected = !this.selected;
|
||||||
|
if (this.selected) {
|
||||||
|
this.mouseStatusVisible();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseenter(e) {
|
||||||
|
if (!this.selected) {
|
||||||
|
this.mouseStatusVisible();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseleave(e) {
|
||||||
|
if (!this.selected) {
|
||||||
|
this.mouseStatusRecover();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
129
src/jmap/shape/TrainWindow.js
Normal file
129
src/jmap/shape/TrainWindow.js
Normal file
@ -0,0 +1,129 @@
|
|||||||
|
/*车次窗*/
|
||||||
|
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||||
|
import Group from 'zrender/src/container/Group';
|
||||||
|
//import ModelType from '@/jlmap/model/ModelType';
|
||||||
|
import store from '@/store';
|
||||||
|
|
||||||
|
class TrainWindow 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 = 1;
|
||||||
|
this.selected = false;
|
||||||
|
this._create(model);
|
||||||
|
this.on('mousedown', this.mouseclick);
|
||||||
|
this.on('mouseout', this.mouseleave);
|
||||||
|
this.on('mouseover', this.mouseenter);
|
||||||
|
}
|
||||||
|
_create(model) {
|
||||||
|
let prdType = '02'//store.state.map.prdType;
|
||||||
|
if (prdType !== '01') {
|
||||||
|
this.createTrainWindow();
|
||||||
|
this.setTrainWindowEventShow(model.trainWindowShow);
|
||||||
|
this.setState(model);
|
||||||
|
this.mouseStatusRecover();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 创建车次窗*/
|
||||||
|
createTrainWindow() {
|
||||||
|
let model = this.model;
|
||||||
|
let point = model.point||model.position;
|
||||||
|
this.trainRect = new Polygon({
|
||||||
|
_subType: 'TrainWindow',
|
||||||
|
zlevel: this.zlevel - 1,
|
||||||
|
z: this.z,
|
||||||
|
shape: {
|
||||||
|
smooth: 0.01,
|
||||||
|
points: [
|
||||||
|
[point.x - model.width / 2, point.y],
|
||||||
|
[point.x + model.width / 2, point.y],
|
||||||
|
[point.x + model.width / 2, point.y + model.height],
|
||||||
|
[point.x - model.width / 2, point.y + model.height],
|
||||||
|
]
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
lineDash: [3, 3],
|
||||||
|
lineWidth: 1,
|
||||||
|
stroke: this.style.trainWindowColor,
|
||||||
|
fill: this.style.transparentColor
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.add(this.trainRect);
|
||||||
|
}
|
||||||
|
|
||||||
|
setTrainWindowEventShow(show) {
|
||||||
|
let lineWidth = show ? 1 : 0;
|
||||||
|
this.trainRect && this.trainRect.setStyle('lineWidth', lineWidth);
|
||||||
|
}
|
||||||
|
|
||||||
|
isPop(e) {
|
||||||
|
for (var i = 0; i < this.childCount(); i++) {
|
||||||
|
var rect = this.childAt(i).getBoundingRect();
|
||||||
|
if (rect.contain(e.offsetX, e.offsetY) && this.childAt(i).pop) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//设置状态
|
||||||
|
setState(model) {
|
||||||
|
}
|
||||||
|
|
||||||
|
getShapeTipPoint() {
|
||||||
|
if (this.stationControl) {
|
||||||
|
var distance = 2;
|
||||||
|
var rect = this.stationControl.getBoundingRect();
|
||||||
|
return {
|
||||||
|
x: rect.x + rect.width / 2,
|
||||||
|
y: rect.y - distance,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
setSectionEventShow(e, show) {
|
||||||
|
/*let section = store.getters['map/getViewInstanceByDevice']({ _type: ModelType.Section, _code: this.model.sectionCode });
|
||||||
|
|
||||||
|
show && section && section.mouseStatusVisible(e);
|
||||||
|
show || section && section.mouseStatusRecover(e);*/
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseStatusRecover(e) {
|
||||||
|
this.setTrainWindowEventShow(false);
|
||||||
|
this.setSectionEventShow(e, false);
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseStatusVisible(e) {
|
||||||
|
this.setTrainWindowEventShow(true);
|
||||||
|
this.setSectionEventShow(e, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseclick(e) {
|
||||||
|
if ([3].includes(e.which)) {
|
||||||
|
this.selected = !this.selected;
|
||||||
|
if (this.selected) {
|
||||||
|
this.mouseStatusVisible(e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseenter(e) {
|
||||||
|
if (!this.selected) {
|
||||||
|
this.mouseStatusVisible(e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
mouseleave(e) {
|
||||||
|
if (!this.selected) {
|
||||||
|
this.mouseStatusRecover(e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default TrainWindow;
|
||||||
@ -1,16 +1,18 @@
|
|||||||
import deviceType from '../config/deviceType';
|
import deviceType from '../config/deviceType';
|
||||||
import Link from './Link';
|
import Link from './Link';
|
||||||
import Section from './section';
|
import Section from './Section';
|
||||||
import Signal from './Signal';
|
import Signal from './Signal';
|
||||||
import Station from './station';
|
import Station from './Station';
|
||||||
import StationControl from './StationControl';
|
import StationControl from './StationControl';
|
||||||
import ImageControl from './ImageControl';
|
import ImageControl from './ImageControl';
|
||||||
import LcControl from './lcControl';
|
import LcControl from './LcControl';
|
||||||
import LimitControl from './limitControl';
|
import LimitControl from './LimitControl';
|
||||||
import Switch from './Switch';
|
import Switch from './Switch';
|
||||||
import ZcControl from './ZcControl';
|
import ZcControl from './ZcControl';
|
||||||
import StationCounter from './StationCounter';
|
import StationCounter from './StationCounter';
|
||||||
import StationDelayUnlock from './StationDelayUnlock';
|
import StationDelayUnlock from './StationDelayUnlock';
|
||||||
|
import TrainWindow from "./TrainWindow";
|
||||||
|
import Train from "./Train";
|
||||||
|
|
||||||
/** 图库*/
|
/** 图库*/
|
||||||
const mapShape = {};
|
const mapShape = {};
|
||||||
@ -26,6 +28,8 @@ mapShape[deviceType.Switch] = Switch;
|
|||||||
mapShape[deviceType.ZcControl] = ZcControl;
|
mapShape[deviceType.ZcControl] = ZcControl;
|
||||||
mapShape[deviceType.StationCounter] = StationCounter;
|
mapShape[deviceType.StationCounter] = StationCounter;
|
||||||
mapShape[deviceType.StationDelayUnlock] = StationDelayUnlock;
|
mapShape[deviceType.StationDelayUnlock] = StationDelayUnlock;
|
||||||
|
mapShape[deviceType.TrainWindow] = TrainWindow;
|
||||||
|
mapShape[deviceType.Train] = Train;
|
||||||
|
|
||||||
function shapefactory(type, device, jmap) {
|
function shapefactory(type, device, jmap) {
|
||||||
const style = jmap.getStyleDict();
|
const style = jmap.getStyleDict();
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user