joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

desc: 修改代码

Browse Source
This commit is contained in:
zyy 2019-07-17 15:54:01 +08:00
parent 22c1b93a40
commit c5c5a4c9f9
7 changed files with 147 additions and 180 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/jmap/config/deviceStyle.js
View File

@ -1,10 +1,12 @@
import beijingSkin from '../theme/bejing';
import fuzhouSkin from '../theme/fuzhou';
/** 皮肤配置*/
const deviceSkin = {
'02': fuzhouSkin,
'03': beijingSkin,
'04': beijingSkin,
'05': beijingSkin
'04': beijingSkin, // 八通
'05': beijingSkin // 成都
};
export function selectSkinStyle(code) {

127
src/jmap/shape/Section.js
View File

@ -43,8 +43,6 @@ export default class Section extends Group {
}
this.setState(state);
}
this.mouseStateRecover();
}
/** 创建区段*/
@ -121,23 +119,18 @@ export default class Section extends Group {
// 计算区段坐标位置
const x = Math.min(model.points[0].x, model.points[model.points.length - 1].x) + Math.abs(model.points[model.points.length - 1].x - model.points[0].x) / 2 + model.namePosition.x;
const y = Math.min(model.points[0].y, model.points[model.points.length - 1].y) + Math.abs(model.points[model.points.length - 1].y - model.points[0].y) / 2 + model.namePosition.y;
/** 区段名称*/
if (model.nameShow) {
let tempx = x;
let tempy = y - (style.Section.sectionWidth + style.textFontSize + style.nameDistance);
let tempy = y;
// 如果不是道岔区段
if (model.type !== '03') {
// 如果逻辑区段，让名称和区段距离减少
// 计算文字和物理区段的距离
// 如果不是逻辑区段，让名称和区段保持点距离
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
if (model.type === '02') {
if (model.type === '01') {
tempx += traingle.getSin(style.textFontSize * 0.8 + style.nameDistance);
tempy += traingle.getCos(style.textFontSize * 0.8 + style.nameDistance) - style.textFontSize * 2;
const parent = this.jmap.getDeviceByCode(model.parentCode);
if (parent) {
model.name = `${parent.name}-${model.name}`;
}
}
}
@ -146,7 +139,7 @@ export default class Section extends Group {
this.sectionText = new ETextName({
_subType: 'Text',
zlevel: this.zlevel + 3,
z: 6,
z: this.z + 6,
x: tempx,
y: tempy,
text: model.name,
@ -154,37 +147,10 @@ export default class Section extends Group {
textFill: style.textFontColor,
textAlign: 'center',
textPosition: 'inside',
textVerticalAlign: 'middle',
style: this.style
});
this.add(this.sectionText);
// if (!model.isSwitchSection) {
// this.sectionTextBorder = new Rect({
// zlevel: model.zlevel + 3,
// z: 5,
// shape: this.sectionText.getBoundingRect(),
// style: {
// lineDash: [3, 3],
// stroke: '#fff', // 白色
// fill: model.type == '02' ? style.sectionLogicalBackgroundColor : '#00FFFF' // 蓝色
// }
// });
// this.add(this.sectionTextBorder);
// }
// this.sectionTextShadow = new ETextName({
// zlevel: this.zlevel + 3,
// z: 5,
// x: tempx,
// y: tempy,
// text: model.name,
// textFont: 'bold ' + (fontSize + 1) + 'px ' + style.textFontFormat
// textFill: style.textShadowColor,
// textAlign: 'middle',
// textPosition: 'top',
// style: this.style
// });
// this.add(this.sectionTextShadow);
}
/** 站台轨名称*/
@ -347,30 +313,28 @@ export default class Section extends Group {
traingle = new JTriangle(model.points[0], model.points[1]);
this.lPartition = new ESeparator({
style: style,
borderBorderShow: model.borderBorderShow,
zlevel: this.zlevel - 2,
zlevel: this.zlevel + 1,
traingle: traingle,
point: {
x: model.points[0].x,
y: model.points[0].y
},
sepType: model.sepTypeLeft,
drict: -1
drict: -1 // 方向
});
/** 创建右侧分隔符*/
traingle = new JTriangle(model.points[model.points.length - 2], model.points[model.points.length - 1]);
this.rPartition = new ESeparator({
style: style,
borderBorderShow: model.borderBorderShow,
zlevel: this.zlevel - 2,
zlevel: this.zlevel + 1,
traingle: traingle,
point: {
x: model.points[model.points.length - 1].x,
y: model.points[model.points.length - 1].y
},
sepType: model.sepTypeRight,
drict: 1
drict: 1 // 方向
});
/** 添加视图*/
@ -657,75 +621,4 @@ export default class Section extends Group {
y: rect.y + rect.height / 2.7 - distance
};
}
setTrainWindowEventShow(show) {
let trainWindowCode = this.model.trainWindowCode;
if (this.model.isSwitchSection && this.model.parentCode) {
const device = this.jmap.getDeviceByCode(this.model.parentCode);
if (device) {
trainWindowCode = device.trainWindowCode;
}
}
const trainWindow= this.jmap.getDeviceByCode(trainWindowCode);
trainWindow && trainWindow.instance &&trainWindow.instance.setTrainWindowEventShow(show);
}
mouseStateVisible(subType) {
this.setTrainWindowEventShow(true);
if (this.model.isSwitchSection) {
if (subType == 'Text') {
this.sectionTextShadow && this.sectionTextShadow.show();
} else {
// 道岔区段
const refSwitch = this.jmap.getDeviceByCode(this.model.relSwitchCode);
refSwitch && refSwitch.instance && refSwitch.instance.mouseStateVisible();
}
} else {
this.section && this.section.setBorderVisible(true);
this.sectionTextBorder && this.sectionTextBorder.show();
this.sectionText && this.sectionText.setStyle({ textFill: '#000' });
if (this.model.type == '02' && this.model.parentCode) {
this.sectionText && this.sectionText.show();
}
}
}
mouseStateRecover() {
this.setTrainWindowEventShow(false);
this.sectionTextShadow && this.sectionTextShadow.hide();
if (this.model.isSwitchSection) {
// 道岔区段
const refSwitch = this.jmap.getDeviceByCode(this.model.relSwitchCode);
refSwitch && refSwitch.instance && refSwitch.instance.mouseStateRecover();
} else {
this.section && this.section.setBorderVisible(false);
this.sectionTextBorder && this.sectionTextBorder.hide();
this.sectionText && this.sectionText.setStyle({ textFill: '#fff' });
if (this.model.type == '02' && this.model.parentCode) {
this.sectionText && this.sectionText.hide();
}
}
}
mouseclick(e) {
if ([3].includes(e.which)) {
this.selected = !this.selected;
if (this.selected) {
this.mouseStateVisible(e.target._subType);
}
}
}
mouseenter(e) {
if (!this.selected) {
this.mouseStateVisible(e.target._subType);
}
}
mouseleave(e) {
if (!this.selected) {
this.mouseStateRecover();
}
}
}

17
src/jmap/shape/element/ELines.js
View File

@ -1,7 +1,6 @@
import Group from 'zrender/src/container/Group';
import Line from 'zrender/src/graphic/shape/Line';
import BezierCurve from 'zrender/src/graphic/shape/BezierCurve';
import Rect from 'zrender/src/graphic/shape/Rect';
/** 创建区段线集合*/
export default class ELines extends Group {
@ -59,22 +58,6 @@ export default class ELines extends Group {
}));
}
}
if (!model.isSwitchSection) {
this.lineBorder = new Rect({
zlevel: this.zlevel,
z: this.z - 1,
silent: true,
shape: this.getBoundingRect(),
style: {
lineDash: [3, 3],
stroke: model.style.borderColor,
fill: model.style.transparentColor
}
});
this.add(this.lineBorder);
}
}
}

71
src/jmap/shape/element/ESeparator.js
View File

@ -14,43 +14,39 @@ export default class ESeparator extends Group {
}
_create(model) {
if (model && this.style) {
this.partition = new Polyline({
zlevel: this.zlevel,
z: this.z,
shape: {
points: [
[model.point.x, model.point.y],
[model.point.x, model.point.y]
]
},
style: {
lineWidth: this.style.Section.sectionSeparatorWidth,
stroke: this.style.Section.sectionSeparatorColor
}
});
this.partition = new Polyline({
zlevel: this.zlevel,
z: this.z,
shape: {
points: []
},
style: {
lineWidth: this.style.Section.sectionSeparatorWidth,
stroke: this.style.Section.sectionSeparatorColor
}
});
this.circle = new Circle({
zlevel: this.zlevel,
z: this.z + 9,
shape: {
cx: model.point.x,
cy: model.point.y,
r: this.style.Section.sectionWidth
},
style: {
stroke: this.style.Section.sectionInvadeColor,
GBaseLineWidth: 0.5,
fill: this.style.transparentColor
}
});
this.circle = new Circle({
zlevel: this.zlevel,
z: this.z + 9,
shape: {
cx: model.point.x,
cy: model.point.y,
r: this.style.Section.sectionWidth
},
style: {
stroke: this.style.Section.sectionInvadeColor,
GBaseLineWidth: 0.5,
fill: this.style.transparentColor
}
});
this.add(this.partition);
this.setType(model.sepType, model.borderBorderShow);
}
this.add(this.partition);
this.setType();
}
setType(type, show) {
setType() {
const type = this.model.sepType;
const model = this.model;
if (model && this.style && model.traingle) {
this.remove(this.circle);
@ -80,6 +76,7 @@ export default class ESeparator extends Group {
[model.point.x + model.drict * (this.style.Section.sectionWidth) * 1.2, model.point.y + (this.style.Section.sectionWidth * 1.2)]
]);
this.add(this.partition);
this.partition.setStyle({'lineWidth': this.style.Section.sectionEndSeparatorWidth, 'stroke': this.style.Section.sectionEndSeparatorStroke });
} else if (type === '04') {
this.add(this.circle);
}
@ -90,13 +87,5 @@ export default class ESeparator extends Group {
this.rotation = Math.PI * 2 - Math.atan2(model.traingle.absy, model.traingle.absx) * model.traingle.drictx * model.traingle.dricty;
this.dirty(); // 可以无需调用
}
if (this.partition) {
if (type === '03' && !show) {
this.partition.hide();
} else {
this.partition.show();
}
}
}
}

5
src/jmap/theme/bejing.js
View File

@ -7,7 +7,7 @@ class Beijing extends defaultSkin {
this.Link = {
textFontColor: ''
};
this.Section = {
this[deviceType.Section] = {
/** 区段 宽度*/
sectionWidth: 5,
/** 区段宽超出宽度*/
@ -22,6 +22,8 @@ class Beijing extends defaultSkin {
sectionSpeedLimitDistance: 5,
/** 分隔符宽度*/
sectionSeparatorWidth: 1.2,
sectionEndSeparatorWidth: 1.2, // 尽头分隔符宽度
sectionEndSeparatorStroke: '#7F7F7F', // 尽头分隔符颜色
/** 区段侵入颜色*/
sectionInvadeColor: '#EF0C08',
/** 限速线颜色*/
@ -108,7 +110,6 @@ class Beijing extends defaultSkin {
/** 信号灯蓝色*/
signalLampBlueColor: '#0070C0'
};
}
}

99
src/jmap/theme/fuzhou.js Normal file
View File

@ -0,0 +1,99 @@
import defaultSkin from '../config/defaultSkin';
import deviceType from '../constant/deviceType';
class Fuzhou extends defaultSkin {
constructor() {
super();
this.Link = {
textFontColor: ''
};
this[deviceType.Section] = {
/** 区段 宽度*/
sectionWidth: 5,
/** 区段宽超出宽度*/
sectionBeyondWidth: 1,
/** 计轴 半径*/
sectionAxleR: 3,
/** 计轴和区段之间的距离*/ /** 需要添加*/
sectionAxleDistance: 5,
/** 限速线的宽短*/
sectionSpeedLimitLinewidth: 1,
/** 限速线距离区段距离*/
sectionSpeedLimitDistance: 5,
sectionSeparatorWidth: 1.2, // 分隔符宽度
sectionEndSeparatorWidth: 3.5, // 尽头分隔符宽度
sectionEndSeparatorStroke: '#3F3F3F', // 尽头分隔符颜色
/** 区段侵入颜色*/
sectionInvadeColor: '#EF0C08',
/** 限速线颜色*/
sectionSpeedLimitColor: '#FFFF00',
sectionLogicalBackgroundColor: '#FFFF00', // 逻辑区段颜色
/** 区段计轴颜色*/
sectionAxleColor: '#FFFFFF',
/** 区段边界符颜色*/
sectionSeparatorColor: '#3149C3',
/** 区段空闲颜色*/
sectionSpareColor: '#3F3F3F',
/** 逻辑区段名称颜色*/
sectionLogicalTextColor: '#FFFFFF',
/** 区段通信车占用颜色**/
sectionCommunicationOccupiedColor: '#FF329A',
/** 区段非通讯车占用颜色*/
sectionUnCommunicationOccupiedColor: '#FE0000',
/** 区段路由锁定颜色*/
sectionRouteLockColor: '#FFFFFF',
/** 区段故障锁定颜色*/
sectionFaultLockColor: '#9B4A0A',
/** 区段未定义颜色*/
sectionUndefinedColor: '#0071C1',
/** 保护区段锁闭*/
sectionProtectionSectionLockedColor: '#FEFF00',
/** 区段计轴预复位*/
sectionAxleResetColor: '#00FFFF',
/** 区段封锁颜色*/
sectionBlockColor: '#800080',
/** 区段atc切除颜色*/
sectionAtcExcisionColor: '#A0522D',
/** 区段ats切除颜色*/
sectionAtsExcisionColor: '#A0522D',
/** 区段延时释放颜色*/
sectionTimeReleaseColor: '#3F3F3F',
/** 区段保护锁闭*/
sectionProtectiveLockColor: '#FFFF00',
/** 区段保护延时解锁*/
sectionProtectiveTimeReleaseColor: '#0071C1',
sectionAxleFailure: '#E6A23C' // #FFFF00 计轴失效
};
this[deviceType.Signal] = {
/** 信号机宽度 */
signalR: 5,
/** 设备距离区段的距离*/
signalDistance: 19,
/** 信号灯按钮颜色*/
signalButtonColor: 'darkgreen',
/** 信号灯按钮闪烁颜色*/
signalButtonLightenColor: '#E4EF50',
/** 信号灯灯柱颜色*/
signalLampStandardColor: '#3149C3', // #3E44BE,
/** 信号灯锁闭*/
signalBlockColor: '#EF0C08',
/** 信号灯灰色*/
signalLampGrayColor: '#51545D',
/** 信号灯红色*/
signalLampRedColor: '#EF0C08',
/** 信号灯绿色*/
signalLampGreenColor: '#4DD43F',
/** 信号灯黄色*/
signalLampYellowColor: '#E4EF50',
/** 信号灯白色*/
signalLampWhiteColor: '#FFFFFF',
/** 信号灯蓝色*/
signalLampBlueColor: '#3E44BE'
};
}
}
const fuzhouSkin = new Fuzhou();
export default fuzhouSkin;

2
src/views/jmap/index.vue
View File

@ -56,7 +56,7 @@ export default {
getPublishMapDetail('03').then(resp => {
this.jmap.loadData(resp.data);
this.jmap.setDefaultState();
// this.jmap.setDefaultState();
this.jmap.setLevelInvisible([deviceType.Link]);
});