Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test
This commit is contained in:
joylink_cuiweidong
commit
c14814890f
@ -1,124 +0,0 @@
|
||||
export default class defaultStyle {
|
||||
constructor() {
|
||||
/** 透明填充 颜色*/
|
||||
this.transparentColor = 'rgba(0,0,0,0)';
|
||||
|
||||
/** 默认背景 颜色*/
|
||||
this.backgroundColor = '#000000';
|
||||
|
||||
/** 默认提示背景 颜色*/
|
||||
this.tipBackgroundColor = 'yellow';
|
||||
|
||||
/** 默认边线 颜色*/
|
||||
this.sidelineColor = '#FFFFFF';
|
||||
|
||||
/** 默认字体 大小*/
|
||||
this.textFontSize = 10;
|
||||
|
||||
/** 默认字体 族类*/
|
||||
this.fontFamily = '宋体';
|
||||
|
||||
/** 默认字体颜色*/
|
||||
this.textFontColor = '#C0C0C0';
|
||||
|
||||
/** 默认提示字体大小*/
|
||||
this.arrowFontSize = 10;
|
||||
|
||||
/** 列车长度*/
|
||||
this.trainWidth = 40;
|
||||
|
||||
/** 列车高度*/
|
||||
this.trainHeight = 20;
|
||||
|
||||
/** 列车字号*/
|
||||
this.trainTextFontSize = 12;
|
||||
|
||||
/** 列车HDSA字号*/
|
||||
this.trainHSDATextFontSize = 9;
|
||||
|
||||
/** 列车信号的半径*/
|
||||
this.trainConflictR = 3;
|
||||
|
||||
/** 列车信号距离车的距离*/
|
||||
this.trainConflictDistance = 5;
|
||||
|
||||
/** 列车车头比车身高出的长度;上下相比车体伸出去的边框*/
|
||||
this.trainMoreLength = 0;
|
||||
|
||||
/** 列车和车头之间的间距*/
|
||||
this.trainHeadDistance = 4;
|
||||
|
||||
/** 列车竖杠的宽度*/
|
||||
this.trainConntWidth = 3;
|
||||
|
||||
/** 列车竖杠和方向之间的间隔*/
|
||||
this.trainPadding = 4;
|
||||
|
||||
/** 列车方向的宽度*/
|
||||
this.trainArrowWidth = 6;
|
||||
|
||||
/** 列车和区段之间的距离*/
|
||||
this.trainDistance = 30;
|
||||
|
||||
/** 列车边线颜色*/
|
||||
this.trainSidelineColor = '#C0C0C0';
|
||||
|
||||
/** 列车背景*/
|
||||
this.trainBackground = '#000000';
|
||||
|
||||
/** 列车 灰色*/
|
||||
this.trainGrayColor = '#C0C0C0';
|
||||
|
||||
/** 列车 白色*/
|
||||
this.trainWitheColor = '#FFFFFF';
|
||||
|
||||
/** 列车 棕色*/
|
||||
this.trainBrownColor = '#A0522D';
|
||||
|
||||
/** 列车 黄色*/
|
||||
this.trainYellowColor = '#FFFF00';
|
||||
|
||||
/** 列车 棕灰色 */
|
||||
this.trainBrown1Color = '#725A64';
|
||||
|
||||
/** 列车 绿色*/
|
||||
this.trainGreenColor = '#00FF00';
|
||||
|
||||
/** 列车 蓝色*/
|
||||
this.trainBlueColor = '#3265FF';
|
||||
|
||||
/** 列车 红色*/
|
||||
this.trainRedColor = '#FF0000';
|
||||
|
||||
/** 列车 橘色*/
|
||||
this.trainOrangeColor = 'orange';
|
||||
|
||||
/** 列车 紫色*/
|
||||
this.trainPurpleColor = 'purple';
|
||||
|
||||
/** 列车 粉色*/
|
||||
this.trainPinkColor = 'pink';
|
||||
|
||||
/** 车次窗高度*/
|
||||
this.trainWindowWidth = 40;
|
||||
|
||||
/** 车次窗高度*/
|
||||
this.trainWindowHeight = 15;
|
||||
|
||||
/** 列车文字颜色*/
|
||||
this.trainTextColor = '#ffffff';
|
||||
|
||||
/** 灯包围框样式 */
|
||||
this.arcBorderStyle = {
|
||||
lineDash: [3, 3],
|
||||
stroke: '#FFFFFF',
|
||||
fill: 'rgba(0,0,0,0)'
|
||||
};
|
||||
/** 字体包围框样式 */
|
||||
this.textBorderStyle = {
|
||||
lineDash: [3, 3],
|
||||
stroke: '#FFFFFF',
|
||||
fill: '#00FFFF'
|
||||
};
|
||||
}
|
||||
}
|
||||
@ -1,10 +0,0 @@
|
||||
const mapDeviceStyle = {
|
||||
// '01': 'chengdu_04',
|
||||
'02': 'fuzhou_01'
|
||||
// '03': 'bejing_01',
|
||||
// '04': 'chengdu_03'
|
||||
};
|
||||
|
||||
export function selectLineCode(code) {
|
||||
return Object.assign({}, require(`./skinCode/${mapDeviceStyle[code || '02']}`).default);
|
||||
}
|
||||
@ -1,547 +0,0 @@
|
||||
import defaultStyle from '../defaultStyle';
|
||||
import deviceType from '../../constant/deviceType';
|
||||
|
||||
class SkinCode extends defaultStyle {
|
||||
constructor() {
|
||||
super();
|
||||
this[deviceType.Link] = {
|
||||
lineWidthColor: '#FFFFFF', // line 颜色
|
||||
linkWidth: 4.4, // link 宽度
|
||||
linkColor: '#3F3F3F', // link 线条颜色
|
||||
linkTextColor: '#FFFFFF' // link 字体颜色
|
||||
};
|
||||
|
||||
this[deviceType.Section] = {
|
||||
active: {
|
||||
routeColor: false // 进路触发颜色
|
||||
},
|
||||
text: {
|
||||
show: true, // 物理区段名称显示
|
||||
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
|
||||
distance: 18, // 文字离区段距离
|
||||
fontSize: 11, // 字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
fontColor: '#FFFFFF', // 字体颜色
|
||||
textAlign: 'center', // 水平对齐方式
|
||||
textPosition: 'inside', // 文字位置
|
||||
textVerticalAlign: 'middle' // 文字垂直对齐方式
|
||||
},
|
||||
logicText: {
|
||||
show: true, // 逻辑区段名称显示
|
||||
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
|
||||
distance: 6, // 文字离区段距离
|
||||
fontSize: 8, // 字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
fontColor: '#FFFFFF', // 字体颜色
|
||||
textAlign: 'center', // 水平对齐方式
|
||||
textPosition: 'inside', // 文字位置
|
||||
textVerticalAlign: 'middle' // 文字垂直对齐方式
|
||||
},
|
||||
standText: {
|
||||
show: true, // 站台轨名称显示
|
||||
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
|
||||
distance: 30, // 文字离区段距离
|
||||
fontSize: 11, // 字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
fontColor: '#FFFFFF', // 字体颜色
|
||||
textAlign: 'center', // 水平对齐方式
|
||||
textPosition: 'inside', // 文字位置
|
||||
textVerticalAlign: 'middle' // 文字垂直对齐方式
|
||||
},
|
||||
reentryText: {
|
||||
show: true, // 折返轨名称显示
|
||||
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
|
||||
distance: 30, // 文字离区段距离
|
||||
fontSize: 11, // 字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
fontColor: '#FFFFFF', // 字体颜色
|
||||
textAlign: 'center', // 水平对齐方式
|
||||
textPosition: 'inside', // 文字位置
|
||||
textVerticalAlign: 'middle' // 文字垂直对齐方式
|
||||
},
|
||||
transferText: {
|
||||
show: true, // 转换轨名称显示
|
||||
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
|
||||
distance: 28, // 文字离区段距离
|
||||
fontSize: 11, // 字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
fontColor: '#FFFFFF', // 字体颜色
|
||||
textAlign: 'center', // 水平对齐方式
|
||||
textPosition: 'inside', // 文字位置
|
||||
textVerticalAlign: 'middle' // 文字垂直对齐方式
|
||||
},
|
||||
destinationText: {
|
||||
show: true, // 目的码名称显示
|
||||
opposite: true, // 对称相反
|
||||
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
|
||||
distance: 10, // 文字离区段距离
|
||||
fontSize: 10, // 字体大小
|
||||
fontWeight: 'bold', // 字体粗细
|
||||
fontColor: 'yellow', // 字体颜色
|
||||
textAlign: 'center', // 水平对齐方式
|
||||
textPosition: 'inside', // 文字位置
|
||||
textVerticalAlign: 'middle' // 文字垂直对齐方式
|
||||
},
|
||||
line: {
|
||||
width: 5, // 区段宽度
|
||||
beyondWidth: 1, // 区段宽超出宽度
|
||||
invadeColor: '#EF0C08', // 区段侵入颜色
|
||||
spareColor: '#3F3F3F', // 区段空闲颜色
|
||||
communicationOccupiedColor: '#FF329A', // 区段通信车占用颜色
|
||||
unCommunicationOccupiedColor: '#FE0000', // 区段非通讯车占用颜色
|
||||
routeLockColor: '#FFFFFF', // 区段路由锁定颜色
|
||||
faultLockColor: '#9B4A0A', // 区段故障锁定颜色
|
||||
undefinedColor: '#0071C1', // 区段未定义颜色
|
||||
protectionLockedColor: '#FEFF00', // 保护区段锁闭(未用)
|
||||
blockColor: '#800080', // 区段封锁颜色
|
||||
atcExcisionColor: '#A0522D', // 区段atc切除颜色
|
||||
atsExcisionColor: '#A0522D', // 区段ats切除颜色
|
||||
timeReleaseColor: '#3F3F3F', // 区段延时释放颜色
|
||||
protectiveLockColor: '#FFFF00', // 区段保护锁闭
|
||||
protectiveTimeReleaseColor: '#0071C1', // 区段保护延时解锁
|
||||
logicalColor: '#FFFF00', // 逻辑区段颜色 (未用)
|
||||
logicalTextColor: '#FFFFFF' // 逻辑区段名称颜色 (未用)
|
||||
},
|
||||
axle: {
|
||||
radius: 3, // 计轴 半径
|
||||
distance: 5, // 计轴和区段之间的距离 （未用）
|
||||
color: '#FFFFFF', // 区段计轴颜色
|
||||
resetColor: '#00FFFF', // 区段计轴预复位颜色
|
||||
Failure: '#E6A23C' // #FFFF00 计轴失效
|
||||
},
|
||||
speedLimit: { // 限速元素
|
||||
width: 1, // 限速线的宽短
|
||||
distance: 5, // 限速线距离区段距离
|
||||
lineColor: '#FFFF00', // 限速线颜色
|
||||
nameShow: false // 名称显示
|
||||
},
|
||||
separator: {
|
||||
z: 6, // 分割符层级
|
||||
width: 1.2, // 分隔符宽度
|
||||
endWidth: 3.5, // 尽头分隔符宽度
|
||||
endColor: '#3F3F3F', // 尽头分隔符颜色
|
||||
color: '#3149C3' // 区段边界符颜色
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.Signal] = {
|
||||
distance: 3, // 设备距离区段的距离
|
||||
post: {
|
||||
standardColor: '#3149C3', // 灯珠颜色
|
||||
standardWidth: 2 // 灯珠宽度
|
||||
},
|
||||
text: {
|
||||
show: true, // 信号机名称显示
|
||||
distance: 0, // 文字和灯杆的距离
|
||||
isNoRotation: true, // 是否禁止旋转
|
||||
isAlignCenter: true, // 信号字体对其方式
|
||||
fontSize: 11, // 信号机名称字体大小
|
||||
fontWeight: 'bold', // 信号机名称字体粗细
|
||||
defaultColor: '#FFFFFF', // 信号灯字体默认色
|
||||
blockColor: '#FFFFFF', // 信号灯字体锁定颜色
|
||||
checkColor: '#00FF00', // 信号字体
|
||||
nameBorderShow: true // 信号机名字边框显示
|
||||
},
|
||||
lamp: {
|
||||
guidName: 'defult', // 默认引导类型
|
||||
stopWidth: 2, // 禁止线宽度
|
||||
borderWidth: 1, // 信号灯边框线宽度
|
||||
borderColor: '#3149C3', // 信号灯边框线颜色
|
||||
radiusR: 6, // 信号灯半径
|
||||
blockColor: '#EF0C08', // 信号灯锁闭
|
||||
grayColor: '#7F7F7F', // 信号灯灰色
|
||||
redColor: '#FF0000', // 信号灯红色
|
||||
greenColor: '#00FF00', // 信号灯绿色
|
||||
yellowColor: '#FFFF00', // 信号灯黄色
|
||||
whiteColor: '#FFFFFF', // 信号灯白色
|
||||
blueColor: '#0070C0' // 信号灯蓝色
|
||||
},
|
||||
route: {
|
||||
direction: false, // 自动进路方向
|
||||
offset: { x: -4, y: 0 }, // 自动进路偏移量
|
||||
routeColor: '#00FF00' // 自动进路
|
||||
},
|
||||
auto: {
|
||||
direction: false, // 自动通过方向
|
||||
offset: { x: -4, y: 0}, // 自动通过偏移量
|
||||
width: 5, // 自动宽度
|
||||
autoRoute: '#00FF00', // 自动进路
|
||||
autoTrigger: '#FFFF00', // 自动触发
|
||||
manualControl: '#FFFF00', // 人工控制
|
||||
outConflict: '#C00808' // 出车冲突
|
||||
},
|
||||
delay: {
|
||||
direction: true, // 延时解锁方向
|
||||
offset: { x: 15, y: -10}, // 延时解锁偏移量
|
||||
fontSize: 11, // 延迟解锁字体大小
|
||||
fontColor: '#FF0000', // 延迟解锁颜色
|
||||
fontWeight: 'bold' // 字体粗细
|
||||
},
|
||||
button: {
|
||||
distance: 5, // 信号灯按钮距离区段的距离
|
||||
borderDashColor: '#FFFFFF', // 信号灯按钮边线
|
||||
buttonColor: 'darkgreen', // 信号灯按钮颜色
|
||||
buttonLightenColor: '#E4EF50' // 信号灯按钮闪烁颜色
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.StationStand] = {
|
||||
common: { // 通用属性
|
||||
textFontSize: 11 // 站台默认字体大小
|
||||
},
|
||||
safetyDoor: { // 屏蔽门
|
||||
height: 3, // 站台屏蔽门高度
|
||||
distance: 8, // 站台和屏蔽门之间的距离
|
||||
defaultColor: '#00FF00', // 屏蔽门默认颜色
|
||||
splitDoorColor: '#F61107' // 屏蔽门切除颜色
|
||||
},
|
||||
stand: { // 站台
|
||||
headFontSize: 11, // 站台首端字体大小
|
||||
spareColor: '#606060', // 站台空闲颜色
|
||||
stopColor: '#FEFE00', // 站台列车停站颜色
|
||||
jumpStopColor: '#9A99FF', // 站台跳停颜色
|
||||
designatedJumpStopColor: 'lightSkyBlue' // 站台指定列车跳停颜色
|
||||
},
|
||||
standEmergent: { // 紧急关闭
|
||||
mergentR: 4, // 站台紧急关闭半径
|
||||
offset: {x: 0, y: 40}, // 站台紧急关闭偏移量
|
||||
closeColor: '#F61107' // 站台紧急关闭颜色
|
||||
},
|
||||
reentry: { // 站台折返策略
|
||||
position: 0, // 折返方向
|
||||
offset: {x: -16, y: 20}, // 折返偏移量
|
||||
noHumanColor: '#0F16DA', // 站台无人折返
|
||||
autoChangeEndsColor: '#0BF400' // 站台自动换端
|
||||
},
|
||||
detainCar: { // 扣车
|
||||
text: 'H', // 扣车显示内容
|
||||
position: -1, // 扣车方向
|
||||
offset: {x: -8, y: -6}, // 扣车偏移量
|
||||
trainColor: '#E4EF50', // 车站扣车颜色
|
||||
centerTrainColor: '#FFFFFF', // 中心扣车颜色
|
||||
andCenterTrainColor: '#F61107', // 车站+中心扣车颜色
|
||||
detainTrainTextColor: '#E4EF50' // 车站扣除文字颜色
|
||||
},
|
||||
stopTime: { // 停站时间
|
||||
position: 1, // 运行时间方向
|
||||
offset: {x: -8, y: 26}, // 运行时间偏移量
|
||||
textColor: '#FFFFFF' // 停站时间字体颜色
|
||||
},
|
||||
level: { // 运行等级
|
||||
position: 1, // 运行等级方向
|
||||
offset: {x: -8, y: 6}, // 运行等级偏移量
|
||||
textColor: '#FFFFFF' // 停站等级字体颜色
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.StationControl] = {
|
||||
text: {
|
||||
distance: 2, // 灯和文字之间的距离
|
||||
fontSize: 11, // 字体大小
|
||||
fontFormat: 'consolas', // 字体格式
|
||||
fontColor: '#ffffff', // 字体颜色
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
textAlign: 'middle', // 字体水平对齐
|
||||
textVerticalAlign: 'top' // 字体垂直对齐
|
||||
},
|
||||
lamp: {
|
||||
count: 2, // 控制模式灯个数
|
||||
offset: {x: 0, y: 0}, // 控制模式灯偏移量
|
||||
radiusR: 4, // 控制模式灯的半径
|
||||
distance: 36, // 控制模式之间灯之间的距离
|
||||
grayColor: '#7F7F7F', // 控制模式灰色
|
||||
greenColor: '#00FF00', // 控制模式绿色
|
||||
redColor: '#FF0000', // 控制模式红色
|
||||
yellowColor: '#FFFF00', // 控制模式黄色
|
||||
emergencyControlShow: false, // 紧急站控显示
|
||||
centerControlShow: true, // 中控显示
|
||||
substationControlShow: true, // 站控按钮显示
|
||||
interconnectedControlShow: false // 联锁控显示
|
||||
},
|
||||
arrow: {
|
||||
show: true // 控制模式箭头显隐
|
||||
},
|
||||
mouseOverStyle: { // 鼠标悬浮样式
|
||||
fontSize: null,
|
||||
fontFormat: 'consolas',
|
||||
fontColor: '#000',
|
||||
fontWeight: 'normal',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.StationCounter] = {
|
||||
text: {
|
||||
distance: 2, // 计数器名称和文字的距离
|
||||
fontColor: '#FFFFFF', // 计数器字体颜色
|
||||
borderColor: '#E4EF50' // 计数器边框颜色
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.StationDelayUnlock] = {
|
||||
text: {
|
||||
distance: 3, // 延迟解锁和设备之间的距离
|
||||
fontColor: '#FFFFFF', // 延时解锁字体颜色
|
||||
borderColor: '#FFFFFF' // 延迟解锁边框颜色
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
kmPostShow: true, // 公里标显示
|
||||
kilometerPosition: 'up' // 公里标朝向
|
||||
};
|
||||
|
||||
this[deviceType.Switch] = {
|
||||
text: {
|
||||
show: true, // 道岔名称显示
|
||||
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
|
||||
offset: {x: 0, y: 8}, // 道岔名称与区段距离
|
||||
fontSize: 11, // 字体大小
|
||||
fontColor: '#C0C0C0', // 道岔名称颜色
|
||||
fontWeight: 'bold', // 字体粗细
|
||||
borderColor: '#FE0000', // 道岔边框颜色
|
||||
lossColor: '#FFFFFF', // 道岔失去颜色
|
||||
locateColor: '#00FF00', // 道岔定位颜色
|
||||
inversionColor: '#9C9D09', // 道岔反位颜色
|
||||
monolockColor: '#870E10' // 道岔单锁颜色
|
||||
},
|
||||
core: {
|
||||
length: 6 // 道岔单边长度
|
||||
},
|
||||
block: { // 道岔封锁配置
|
||||
nameBorderShow: true, // 道岔名称是否有包围框 显示
|
||||
contentRectShow: false // 道岔封锁显示
|
||||
},
|
||||
monolock: { // 道岔单锁配置
|
||||
locationColor: '#ea282c', // 道岔单锁定位颜色 (红色)
|
||||
inversionColor: '#ea282c', // 道岔单锁反位颜色 (红色)
|
||||
rectShow: false // 道岔单锁 矩形框是否显示
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.Line] = {
|
||||
lineColor: '#FFFFFF' // 线条颜色
|
||||
};
|
||||
|
||||
this[deviceType.LcControl] = {
|
||||
text: {
|
||||
fontSize: 10, // 灯字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
distance: 5 // 灯跟文字距离
|
||||
},
|
||||
lamp: {
|
||||
radiusR: 6, // 灯大小
|
||||
controlColor: '#FFFF00' // 灯颜色
|
||||
},
|
||||
mouseOverStyle: {
|
||||
fontSize: 10,
|
||||
fontFormat: 'consolas',
|
||||
fontColor: '#FFF000',
|
||||
fontWeight: 'normal',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
arcColor: '#00FFFF',
|
||||
textColor: '#000000'
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.ZcControl] = {
|
||||
text: {
|
||||
fontSize: 10, // 字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
distance: 5 // 灯跟文字距离
|
||||
},
|
||||
lamp: {
|
||||
radiusR: 6, // 灯大小
|
||||
controlColor: '#00FF00' // 灯颜色
|
||||
},
|
||||
mouseOverStyle: {
|
||||
fontSize: 10,
|
||||
fontFormat: 'consolas',
|
||||
fontColor: '#FFF000',
|
||||
fontWeight: 'normal',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
arcColor: '#00FFFF',
|
||||
textColor: '#000000'
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.LimitControl] = {
|
||||
text: {
|
||||
fontSize: 10, // 字体大小
|
||||
fontWeight: 'normal', // 字体粗细
|
||||
distance: 5 // 灯跟文字距离
|
||||
},
|
||||
lamp: {
|
||||
radiusR: 6, // 灯大小
|
||||
controlColor: '#ECE9D8' // 灯颜色
|
||||
},
|
||||
mouseOverStyle: {
|
||||
fontSize: 10,
|
||||
fontFormat: 'consolas',
|
||||
fontColor: '#FFF000',
|
||||
fontWeight: 'normal',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textColor: '#000000',
|
||||
arcColor: '#00FFFF'
|
||||
}
|
||||
};
|
||||
|
||||
this[deviceType.TrainWindow] = {
|
||||
lineColor: '#4DD43F', // 车次窗颜色
|
||||
lineDash: null, // 车次窗虚线间隔
|
||||
lineWidth: 1, // 车次窗线宽
|
||||
trainWindowSmooth: 0 // 车次窗矩形圆滑程度
|
||||
};
|
||||
|
||||
this[deviceType.Train] = {
|
||||
trainBody: {
|
||||
trainBodyLineWidth: 0, // 车身line宽
|
||||
changeTrainWidth: true, // 是否根据车身上车组号、服务号、车次号、目的地码显示情况改变列车长度
|
||||
specialTrainType: [
|
||||
{
|
||||
type: '03',
|
||||
serviceNumber: 'MM',
|
||||
nameFormat: 'serviceNumber:groupNumber'
|
||||
},
|
||||
{
|
||||
type: '02',
|
||||
nameFormat: 'targetCode:groupNumber'
|
||||
}
|
||||
], // 特殊列车类型需设置显示格式
|
||||
lrPadding: 1, // 两边间隔
|
||||
upPadding: 1, // 上边距离
|
||||
trainBodyFillColor: '#000000', // 列车车身填充颜色
|
||||
trainNameFormat: 'targetCode:serviceNumber:tripNumber'// 列车显示格式
|
||||
},
|
||||
hsda: {
|
||||
trainHSDATextFontSize: 8// 列车HDSA字号
|
||||
},
|
||||
trainNumber: {
|
||||
targetCodePrefix: '000', // 目的地码前缀
|
||||
defaultTargetCode: 'AAA', // 默认目的地码
|
||||
trainTargetTextAlign: 'left', // 车次号文字显示位置
|
||||
trainNumberOffset: { x: 1, y: 1}// 目的地码偏移量
|
||||
},
|
||||
trainServer: {
|
||||
serviceNumberPrefix: '00', // 服务号(表号)前缀
|
||||
defaultServiceNumber: 'BB', // 默认服务号（表号）
|
||||
trainServerOffset: { x: 26, y: 1}// 列车服务号偏移
|
||||
},
|
||||
trainTarget: {
|
||||
tripNumberPrefix: '0000', // 车次号前缀
|
||||
defaultDirectionCode: 'D', // 默认车次号1
|
||||
defaultTripNumber: 'CCC', // 默认车次号2
|
||||
trainTargetOffset: { x: 42, y: 1}// 列车车次号偏移
|
||||
},
|
||||
trainTargetNumber: {
|
||||
groupNumberPrefix: '000', // 车组号前缀
|
||||
defaultGroupNumber: 'EEE', // 默认车组号
|
||||
trainTargetNumberOffset: {x: 0, y: 1}// 车组号偏移量
|
||||
},
|
||||
trainHead: {
|
||||
trainMoreLength: 1, // 列车车头比车身高出的长度,上下相比车体伸出去的边框
|
||||
trainHeadTriangleFirst: { x: 0, y: 0}, // 列车车头三角坐标1偏移量
|
||||
trainHeadTriangleSecond: { x: 4, y: 7.5}, // 列车车头三角坐标2偏移量
|
||||
trainHeadTriangleThird: { x: 0, y: 15}, // 列车车头三角坐标3偏移量
|
||||
trainHeadRectHeight: 15, // 列车车头矩形高度
|
||||
trainConntWidth: 4, // 列车竖杠的宽度
|
||||
trainHeadFillColor: '#EF0C08'// 列车车头矩形填充颜色
|
||||
},
|
||||
common: {
|
||||
trainHeight: 17, // 列车高度
|
||||
trainHeadDistance: 2, // 列车和车头之间的间距
|
||||
trainWidth: 76, // 列车长度
|
||||
trainTextFontSize: 15, // 列车字号
|
||||
fontFamily: 'consolas', // 默认字体 族类
|
||||
nameFontSize: 15, // 字体大小
|
||||
haveTextHSDA: false, // 是否需创建textHSDA对象
|
||||
haveArrowText: true, // 是否需创建arrowText对象
|
||||
haveTrainBorder: false, // 是否需创建trainBorder对象
|
||||
aspectRatio: 8 / 15, // 字体宽高比例（用以拼接text是计算位置）
|
||||
textOffset: 1, // 字体偏移（用以控制字体据车头的距离）
|
||||
trainWidthMoreText: 2 // 计算列车长度时--列车长比text多出尺寸
|
||||
},
|
||||
trainStatusStyle: {
|
||||
destinationStatus: [
|
||||
{status: '01', showColor: '#FFFFFF'},
|
||||
{status: '02', showColor: '#00FF00'},
|
||||
{status: '03', showColor: '#3265FF'},
|
||||
{status: '04', showColor: '#9B4A09'},
|
||||
{status: '05', showColor: '#EF0C08'},
|
||||
{status: '06', showColor: '#FFFFFF'},
|
||||
{status: '07', showColor: '#FFFF00'}
|
||||
], // 目的地状态 01准点 02早点 03严重早点 04晚点 05严重晚点 06头码车 07ATP切除
|
||||
destinationStatusSetText: 'trainServer', // 目的地状态设置的对应哪个text的颜色
|
||||
directionType: [
|
||||
{
|
||||
type: '01',
|
||||
lineLShow: false,
|
||||
lineRShow: false,
|
||||
arrowLShow: false,
|
||||
arrowRShow: false
|
||||
},
|
||||
{
|
||||
type: '02',
|
||||
lineLShow: false,
|
||||
lineRShow: false,
|
||||
arrowLShow: false,
|
||||
arrowRShow: true
|
||||
},
|
||||
{
|
||||
type: '03',
|
||||
lineLShow: false,
|
||||
lineRShow: false,
|
||||
arrowLShow: true,
|
||||
arrowRShow: false
|
||||
}
|
||||
], // 运行方向状态类型对应车头显示状态 01未知方向 02从左往右 上行 03从右往左 下行
|
||||
directionStopType: [
|
||||
{type: '01', lineLShow: false, lineRShow: false},
|
||||
{type: '02', lineLShow: false, lineRShow: true},
|
||||
{type: '03', lineLShow: true, lineRShow: false}
|
||||
], // 列车停止方向类型对应车头显示状态 01未知方向 02从左往右 上行 03从右往左 下行
|
||||
runModeStatus: [
|
||||
{
|
||||
status: '01',
|
||||
trainLColor: '#EF0C08',
|
||||
trainRColor: '#EF0C08'
|
||||
},
|
||||
{
|
||||
status: '02',
|
||||
trainLColor: '#00FF00',
|
||||
trainRColor: '#00FF00'
|
||||
},
|
||||
{
|
||||
status: '03',
|
||||
trainLColor: '#FFFF00',
|
||||
trainRColor: '#FFFF00'
|
||||
},
|
||||
{
|
||||
status: '04',
|
||||
trainLColor: '#EA700D',
|
||||
trainRColor: '#EA700D'
|
||||
},
|
||||
{
|
||||
status: '05',
|
||||
trainLColor: '#A0522D',
|
||||
trainRColor: '#A0522D'
|
||||
}
|
||||
], // 列车运行模式对应车头颜色 01信号中断 02 ATO自动驾驶模式AM 03 ATP监控下的人工驾驶模式CM 04 限制人工驾驶模式RM 05 非限制人工驾驶模式RM
|
||||
runControlStatus: [], // 设置运行控制状态类型 eg:{status: '01', hShow: false, sShow: false}
|
||||
doorStatus: [], // 设置车门状态类型 eg:{status: '01', dShow: false}
|
||||
communicationStatus: [], // 设置通信状态 eg:{status: '01', trainColor:'#725A64'}
|
||||
alarmStatus: [], // 设置报警状态 eg:{status: '01', aShow: false}
|
||||
serverNoType: []// 服务号状态类型 eg:{type: '01', showColor: '#FFFFFF'}
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export default new SkinCode();
|
||||
@ -1,117 +0,0 @@
|
||||
import deviceType from './deviceType';
|
||||
|
||||
const deviceRender = {};
|
||||
|
||||
/** link渲染配置*/
|
||||
deviceRender[deviceType.Link] = {
|
||||
_type: deviceType.Link,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** Section渲染配置*/
|
||||
deviceRender[deviceType.Section] = {
|
||||
_type: deviceType.Section,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** Signal渲染配置*/
|
||||
deviceRender[deviceType.Signal] = {
|
||||
_type: deviceType.Signal,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** Switch渲染配置*/
|
||||
deviceRender[deviceType.Switch] = {
|
||||
_type: deviceType.Switch,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** Station渲染配置*/
|
||||
deviceRender[deviceType.Station] = {
|
||||
_type: deviceType.Station,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** StationStand渲染配置*/
|
||||
deviceRender[deviceType.StationStand] = {
|
||||
_type: deviceType.StationStand,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** StationControl渲染配置*/
|
||||
deviceRender[deviceType.StationControl] = {
|
||||
_type: deviceType.StationControl,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** ImageControl渲染配置*/
|
||||
deviceRender[deviceType.ImageControl] = {
|
||||
_type: deviceType.ImageControl,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** ZcControl渲染配置*/
|
||||
deviceRender[deviceType.ZcControl] = {
|
||||
_type: deviceType.ZcControl,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** LcControl渲染配置*/
|
||||
deviceRender[deviceType.LcControl] = {
|
||||
_type: deviceType.LcControl,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** LimitControl渲染配置*/
|
||||
deviceRender[deviceType.LimitControl] = {
|
||||
_type: deviceType.LimitControl,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** StationDelayUnlock渲染配置*/
|
||||
deviceRender[deviceType.StationDelayUnlock] = {
|
||||
_type: deviceType.StationDelayUnlock,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** Train渲染配置*/
|
||||
deviceRender[deviceType.Train] = {
|
||||
_type: deviceType.Train,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** TrainWindow渲染配置*/
|
||||
deviceRender[deviceType.TrainWindow] = {
|
||||
_type: deviceType.TrainWindow,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** Line渲染配置*/
|
||||
deviceRender[deviceType.Line] = {
|
||||
_type: deviceType.Line,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** Text渲染配置*/
|
||||
deviceRender[deviceType.Text] = {
|
||||
_type: deviceType.Text,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
/** TrainWindow渲染配置*/
|
||||
deviceRender[deviceType.TrainWindow] = {
|
||||
_type: deviceType.TrainWindow,
|
||||
zlevel: 1
|
||||
};
|
||||
/** Train渲染配置*/
|
||||
deviceRender[deviceType.TRain] = {
|
||||
_type: deviceType.TRain,
|
||||
zlevel: 1
|
||||
};
|
||||
/** CheckBox渲染配置*/
|
||||
deviceRender[deviceType.CheckBox] = {
|
||||
_type: deviceType.CheckBox,
|
||||
zlevel: 1
|
||||
};
|
||||
|
||||
export default deviceRender;
|
||||
@ -1,334 +0,0 @@
|
||||
import deviceType from './deviceType';
|
||||
|
||||
const deviceState = {};
|
||||
|
||||
deviceState[deviceType.Section] = {
|
||||
/** 区段状态*/
|
||||
status: {
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State00: '00', /** 未定义状态 */
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02', /** 通信车占用 */
|
||||
State03: '03', /** 非通信车占用 */
|
||||
State04: '04', /** 进路锁闭 */
|
||||
State05: '05', /** 故障锁闭 */
|
||||
State06: '06', /** 封锁 */
|
||||
State07: '07', /** ATC切除 */
|
||||
State08: '08', /** ATS切除 */
|
||||
State09: '09', /** 进路延续保护 */
|
||||
State10: '10', /** 延时释放 */
|
||||
State11: '11', /** 保护区段锁闭 */
|
||||
State12: '12', /** 保护区段延时解锁 */
|
||||
State13: '13', /** ARB出清检测错误状态 */
|
||||
State14: '14' /** 计轴失效 */
|
||||
},
|
||||
/** 限速*/
|
||||
speedUpperLimit: {
|
||||
Default: -1 /** 不限速*/
|
||||
},
|
||||
/** 是否切除*/
|
||||
cutOff: {
|
||||
Default: false /** 是否切除*/
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.Switch] = {
|
||||
/** 定位状态*/
|
||||
locateType: {
|
||||
Default: '01', /** 道岔位置类型 - 定位（缺省值）*/
|
||||
State01: '01', /** 道岔位置类型 - 定位 */
|
||||
State02: '02', /** 道岔位置类型 - 反位 */
|
||||
State03: '03', /** 道岔位置类型 - 失去表示 */
|
||||
State04: '04' /** 道岔位置类型 - 挤岔 */
|
||||
},
|
||||
/** 道岔状态*/
|
||||
status: {
|
||||
Default: '01', /** 道岔状态类型 - 空闲（缺省值）*/
|
||||
State01: '01', /** 道岔状态类型 - 空闲 */
|
||||
State02: '02', /** 道岔状态类型 - 通信车占用 */
|
||||
State03: '03', /** 道岔状态类型 - 非通信车占用 */
|
||||
State04: '04', /** 道岔状态类型 - 进路锁闭 */
|
||||
State05: '05', /** 道岔状态类型 - 故障锁闭 */
|
||||
State06: '06', /** 道岔状态类型 - 进路延续保护 */
|
||||
State07: '07', /** 道岔状态类型 - 进路延续保护解锁 */
|
||||
State08: '08', /** 道岔状态类型 - ATC切除 */
|
||||
State09: '09', /** 道岔状态类型 - ATS切除 */
|
||||
State10: '10', /** 道岔状态类型 - 人工单锁 */
|
||||
State11: '11', /** 道岔状态类型 - 逻辑锁 */
|
||||
State12: '12', /** 道岔状态类型 - 人工锁+逻辑锁 */
|
||||
State13: '13', /** 道岔状态类型 - 延时释放*/
|
||||
State14: '14' /** 道岔状态类型 - 封锁*/
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
},
|
||||
/** 是否切除*/
|
||||
cutOff: {
|
||||
Default: false /** 是否切除*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.Signal] = {
|
||||
/** 进路性质类型 */
|
||||
natureType: {
|
||||
Default: '00', /** 无状态（缺省值）*/
|
||||
State01: '01', /** 列车进路 */
|
||||
State02: '02', /** 调车进路 */
|
||||
State03: '03' /** 折返进路 */
|
||||
},
|
||||
/** 信号机状态类型 */
|
||||
status: {
|
||||
Default: '01', /** 关闭（缺省值）*/
|
||||
State01: '01', /** 关闭 */
|
||||
State02: '02', /** 开放正向 */
|
||||
State03: '03', /** 开放侧向 */
|
||||
State04: '04', /** 引导 */
|
||||
State05: '05', /** 封锁 */
|
||||
State06: '06', /** 故障 */
|
||||
State07: '07', /** 功能封锁 */
|
||||
State08: '08' /** 信号保护区段监视 */
|
||||
},
|
||||
/** 信号机状态类型 */
|
||||
lightType: {
|
||||
Default: '01', /** 物理点灯（缺省值）*/
|
||||
State01: '01', /** 物理点灯 */
|
||||
State02: '02' /** 逻辑点灯 */
|
||||
},
|
||||
/** 信号机延时状态类型 */
|
||||
delayType: {
|
||||
Default: '01', /** 未延时解锁（缺省值）*/
|
||||
State01: '01', /** 未延时解锁 */
|
||||
State02: '02', /** 人工闭塞延时解锁 */
|
||||
State03: '03' /** 自动闭塞延时解锁 */
|
||||
},
|
||||
/** 信号机自动信号状态类型 */
|
||||
autoType: {
|
||||
Default: '01', /** 隐藏（缺省值）*/
|
||||
State01: '01', /** 隐藏 */
|
||||
State02: '02', /** 设置自动信号模式状态类型 */
|
||||
State03: '03', /** 设置自动进路模式状态类型 */
|
||||
State04: '04' /** 信号机进路自动触发模式状态类型 */
|
||||
},
|
||||
/** 信号机自动通过信号状态类型 */
|
||||
autoRouteType: {
|
||||
Default: '01', /** 不自动通过（缺省值）*/
|
||||
State01: '01', /** 不自动通过 */
|
||||
State02: '02' /** 自动通过 */
|
||||
},
|
||||
/** 信号机按钮状态类型 */
|
||||
buttonState: {
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02', /** 选择基本进路始端 */
|
||||
State03: '03', /** 选择折返进路始端 */
|
||||
State04: '04', /** 基本进路终端待选 */
|
||||
State05: '05' /** 折返进路终端待选 */
|
||||
},
|
||||
/** 引导信号按钮状态类型 */
|
||||
guideStatus: {
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02' /** 引导 */
|
||||
|
||||
},
|
||||
/** 道岔定位状态*/
|
||||
switchLocateType: {
|
||||
Default: '01', /** 定位（缺省值）*/
|
||||
State01: '01', /** 定位*/
|
||||
State02: '02' /** 反位*/
|
||||
},
|
||||
/** 信号机进路办理*/
|
||||
routeSetting: {
|
||||
Default: false /** 信号机进路办理*/
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.Station] = {
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.StationControl] = {
|
||||
/** 控制模式状态 */
|
||||
status: {
|
||||
Default: '01', /** 中控（缺省值）*/
|
||||
State01: '01', /** 中控 */
|
||||
State02: '02', /** 站控 */
|
||||
State03: '03' /** 紧急站控 */
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.StationDelayUnlock] = {
|
||||
/** 延迟解锁状态*/
|
||||
status: {
|
||||
Default: '01', /** 关闭（默认值）*/
|
||||
State01: '01', /** 关闭 */
|
||||
State02: '02' /** 显示 */
|
||||
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.StationStand] = {
|
||||
/** 车站状态*/
|
||||
status: {
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02', /** 列车停站 */
|
||||
State05: '03' /** 站台紧急关闭 */
|
||||
},
|
||||
/** 屏蔽门状态*/
|
||||
screenDoorStatus: {
|
||||
Default: '01', /** 关门（缺省值）*/
|
||||
State01: '01', /** 正常 */
|
||||
State02: '02', /** 故障 */
|
||||
State03: '03' /** 切除 */
|
||||
},
|
||||
/** 屏蔽门开门状态*/
|
||||
screenDoorOpenStatus: {
|
||||
Default: '01', /** 关门（缺省值）*/
|
||||
State01: '01', /** 关门 */
|
||||
State02: '02' /** 开门 */
|
||||
},
|
||||
/** 扣车状态*/
|
||||
holdStatus: {
|
||||
Default: '01', /** 未设置扣车（缺省值）*/
|
||||
State01: '01', /** 未设置扣车*/
|
||||
State02: '02', /** 车站扣车*/
|
||||
State03: '03', /** 中心扣车*/
|
||||
State04: '04' /** 中心+车站扣车*/
|
||||
},
|
||||
/** 跳停*/
|
||||
jumpStopStatus: {
|
||||
Default: '01', /** 未设置跳停（缺省值）*/
|
||||
State01: '01', /** 未设置跳停 */
|
||||
State02: '02', /** 指定列车跳停 */
|
||||
State03: '03' /** 全部跳停 */
|
||||
},
|
||||
/** 停站时间*/
|
||||
parkingTime: {
|
||||
Default: -1 /** 无停站时间*/
|
||||
},
|
||||
/** 运行等级*/
|
||||
intervalRunTime: {
|
||||
Default: -1 /** 无运行等级*/
|
||||
},
|
||||
/** 折返策略*/
|
||||
reentryStrategy: {
|
||||
Default: '01', /** 默认（缺省值）*/
|
||||
State01: '01', /** 无折返策略 */
|
||||
State02: '02', /** 无人折返 */
|
||||
State03: '03', /** 自动换端 */
|
||||
State04: '04' /** 默认 */
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.Train] = {
|
||||
/** 列车类型*/
|
||||
type: {
|
||||
Default: '01', /** 计划车-指运行图编制出的有车组号、表号、车次号的列车（缺省值）*/
|
||||
State01: '01', /** 计划车-指运行图编制出的有车组号、表号、车次号的列车*/
|
||||
State02: '02', /** 头码车-指赋予了车组号和运行目的地的非计划列车*/
|
||||
State03: '03' /** 人工车-指由调度员手工添加的并人工组织运行的只赋予车组号的非计划列车*/
|
||||
},
|
||||
/** 服务号状态类型*/
|
||||
serverNoType: {
|
||||
Default: '01', /** 显示服务号，白色（缺省值）*/
|
||||
State01: '01', /** 显示服务号，白色 */
|
||||
State02: '02', /** 显示车组号（计划车、头码车），黄色 */
|
||||
State03: '03' /** 显示车组号（人工车），粉色 */
|
||||
},
|
||||
/** 目的地状态类型*/
|
||||
destinationStatus: {
|
||||
Default: '01', /** 准点（缺省值）*/
|
||||
State01: '01', /** 准点*/
|
||||
State02: '02', /** 早点*/
|
||||
State03: '03', /** 严重早点*/
|
||||
State04: '04', /** 晚点*/
|
||||
State05: '05', /** 严重晚点*/
|
||||
State06: '06', /** 头码车*/
|
||||
State07: '07' /** ATP切除*/
|
||||
},
|
||||
/** 运行方向状态类型*/
|
||||
directionType: {
|
||||
Default: '01', /** 未知方向（缺省值）*/
|
||||
State01: '01', /** 未知方向 */
|
||||
State02: '02', /** 从左向右 */
|
||||
State03: '03' /** 从右向左 */
|
||||
},
|
||||
/** 运行状态*/
|
||||
runStatus: {
|
||||
Default: '01', /** 停止（缺省值）*/
|
||||
State01: '01', /** 停止 */
|
||||
State02: '02' /** 运行 */
|
||||
},
|
||||
/** 运行模式*/
|
||||
runMode: {
|
||||
Default: '01', /** 未知模式（缺省值）*/
|
||||
State01: '01', /** 未知模式 */
|
||||
State02: '02', /** ATO自动驾驶模式 AM */
|
||||
State03: '03', /** ATP监控下的人工驾驶模式 CM */
|
||||
State04: '04', /** 限制人工驾驶模式 RM */
|
||||
State05: '05' /** 非限制人工驾驶模式 RM */
|
||||
},
|
||||
/** 运行控制状态类型*/
|
||||
runControlStatus: {
|
||||
Default: '01', /** 正常（缺省值）*/
|
||||
State01: '01', /** 正常 */
|
||||
State02: '02', /** 扣车 */
|
||||
State03: '03' /** 跳停 */
|
||||
},
|
||||
/** 车门状态 */
|
||||
doorStatus: {
|
||||
Default: '01', /** 关门（缺省值）*/
|
||||
State01: '01', /** 关门 */
|
||||
State02: '02', /** 开门 */
|
||||
State03: '03' /** 故障 */
|
||||
},
|
||||
/** 通信状态类型*/
|
||||
communicationStatus: {
|
||||
Default: '01', /** 正常（缺省值）*/
|
||||
State01: '01', /** 正常 */
|
||||
State02: '02' /** 故障 */
|
||||
},
|
||||
/** 计划冲突状态*/
|
||||
planConflictStatus: {
|
||||
Default: '01', /** 无冲突（缺省值）*/
|
||||
State01: '01', /** 无冲突 */
|
||||
State02: '02' /** 有冲突 */
|
||||
},
|
||||
/** 报警状态*/
|
||||
alarmStatus: {
|
||||
Default: '01', /** 无报警（缺省值）*/
|
||||
State01: '01', /** 无报警 */
|
||||
State02: '02' /** 有报警 */
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
export default deviceState;
|
||||
@ -1,23 +0,0 @@
|
||||
const deviceType = {
|
||||
Link: 'Link',
|
||||
Section: 'Section',
|
||||
Switch: 'Switch',
|
||||
Signal: 'Signal',
|
||||
ZcControl: 'ZcControl',
|
||||
LcControl: 'LcControl',
|
||||
LimitControl: 'LimitControl',
|
||||
ImageControl: 'ImageControl',
|
||||
Station: 'Station',
|
||||
StationStand: 'StationStand',
|
||||
StationControl: 'StationControl',
|
||||
StationCounter: 'StationCounter',
|
||||
ButtonControl: 'ButtonControl',
|
||||
StationDelayUnlock: 'StationDelayUnlock',
|
||||
Train: 'Train',
|
||||
TrainWindow: 'TrainWindow',
|
||||
Line: 'Line',
|
||||
Text: 'Text',
|
||||
CheckBox: 'CheckBox'
|
||||
};
|
||||
|
||||
export default deviceType;
|
||||
@ -1,82 +0,0 @@
|
||||
import Eventful from 'zrender/src/mixin/Eventful';
|
||||
|
||||
class KeyboardController extends Eventful {
|
||||
constructor(jmap) {
|
||||
super();
|
||||
this.$jmap = jmap;
|
||||
this.$zr = jmap.getZr();
|
||||
this.events = jmap.getEvents();
|
||||
this.initData();
|
||||
this.initHandler(this.$zr);
|
||||
}
|
||||
|
||||
initHandler(zr) {
|
||||
if (zr) {
|
||||
var keydownHandle = this.keydown.bind(this);
|
||||
var keyupHandle = this.keyup.bind(this);
|
||||
var dom = this.$zr.dom;
|
||||
|
||||
this.enable = function (opts) {
|
||||
opts = opts || {};
|
||||
this._keyOnDownUp = opts.keyOnDownUp || true;
|
||||
|
||||
dom.addEventListener('keydown', keydownHandle, false);
|
||||
dom.addEventListener('keyup', keyupHandle, false);
|
||||
dom.focus();
|
||||
};
|
||||
|
||||
this.disable = function () {
|
||||
dom.removeEventListener('keydown', keydownHandle, false);
|
||||
dom.removeEventListener('keyup', keyupHandle, false);
|
||||
};
|
||||
|
||||
this.dispose = function() {
|
||||
this.disable();
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
initData() {
|
||||
this._keyboards = [
|
||||
{ key: 'Control', keyCode: 17, active: false },
|
||||
{ key: 'Shift', keyCode: 16, active: false },
|
||||
{ key: 'Alt', keyCode: 18, active: false }
|
||||
];
|
||||
}
|
||||
|
||||
keydown(e) {
|
||||
if (this._keyOnDownUp && !e.repeat) {
|
||||
var index = this._keyboards.findIndex(
|
||||
elem=> { return elem.keyCode == e.keyCode; }
|
||||
);
|
||||
|
||||
if (index >= 0) {
|
||||
this._keyboards[index].active = true;
|
||||
} else {
|
||||
var str = '';
|
||||
this._keyboards.forEach(elem => {
|
||||
if (elem.active) {
|
||||
str += elem.key;
|
||||
str += '_';
|
||||
}
|
||||
});
|
||||
|
||||
str += e.key.toUpperCase();
|
||||
this.trigger(this.events.Keyboard, str);
|
||||
this._keyboards.forEach(elem => { elem.active = false; });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
keyup(e) {
|
||||
if (this._keyOnDownUp && !e.repeat) {
|
||||
this._keyboards.forEach(elem=> {
|
||||
if (elem.keyCode == e.keyCode) {
|
||||
elem.active = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default KeyboardController;
|
||||
400
src/jmap/map.js
400
src/jmap/map.js
@ -1,400 +0,0 @@
|
||||
import * as zrUtil from 'zrender/src/core/util';
|
||||
import zrender from 'zrender';
|
||||
import localStore from 'storejs';
|
||||
import Painter from './painter';
|
||||
import Options from './options';
|
||||
import MouseController from './mouseController';
|
||||
import KeyboardController from './keyboardController';
|
||||
import deviceState from './constant/deviceState';
|
||||
import deviceType from './constant/deviceType';
|
||||
import { selectLineCode } from './config/deviceStyle';
|
||||
import { deviceFactory, createBoundingRect, calculateDCenter } from './utils/parser';
|
||||
import { deepAssign } from '@/utils/index';
|
||||
|
||||
const renderer = 'canvas';
|
||||
const devicePixelRatio = 1;
|
||||
|
||||
class Jlmap {
|
||||
constructor(opts) {
|
||||
// 回调事件
|
||||
this.methods = opts.methods;
|
||||
|
||||
// 鼠标事件
|
||||
this.events = { __Pan: 'pan', __Zoom: 'zoom', Selected: 'selected', Contextmenu: 'contextmenu', DataZoom: 'dataZoom', Keyboard: 'keyboard'};
|
||||
|
||||
// 线路参数
|
||||
this.lineCode = '';
|
||||
|
||||
// 皮肤风格
|
||||
this.style = {};
|
||||
|
||||
// 设备数据
|
||||
this.mapDevice = {};
|
||||
|
||||
// 默认状态
|
||||
this.defaultStateDict = this.loadDefaultState();
|
||||
|
||||
this.initMapInstance(opts);
|
||||
}
|
||||
|
||||
// 初始化属性有鼠标事件 缩放等
|
||||
initMapInstance(opts) {
|
||||
const width = opts.dom.clientWidth;
|
||||
const height = opts.dom.clientHeight;
|
||||
this.zoomOnMouseWheel = opts.options.zoomOnMouseWheel;
|
||||
|
||||
this.$zr = zrender.init(opts.dom, deepAssign({ renderer, devicePixelRatio, width, height }, opts.config));
|
||||
this.$zr.dom.setAttribute('tabIndex', -1);
|
||||
this.$options = new Options(deepAssign({ scaleRate: 1, offsetX: 0, offsetY: 0 }, opts.options || {}), (dataZoom) => { this.$mouseController.trigger(this.events.DataZoom, dataZoom); }); // 缩放
|
||||
this.$painter = new Painter(this);
|
||||
this.$painter.updateZrSize({width: this.$zr.getWidth(), height: this.$zr.getHeight()});
|
||||
this.$painter.updateTransform(this.$options);
|
||||
|
||||
this.optionsHandler = this.setOptions.bind(this);
|
||||
|
||||
this.$mouseController = new MouseController(this);
|
||||
this.$mouseController.enable();
|
||||
|
||||
this.$mouseController.on(this.events.__Pan, this.optionsHandler);
|
||||
this.$mouseController.on(this.events.__Zoom, this.optionsHandler);
|
||||
|
||||
this.$keyboardController = new KeyboardController(this);
|
||||
this.$keyboardController.enable();
|
||||
}
|
||||
|
||||
loadStyle(lineCode) {
|
||||
return selectLineCode(lineCode);
|
||||
}
|
||||
|
||||
loadDefaultState() {
|
||||
const defaultStateDict = {};
|
||||
|
||||
zrUtil.each(Object.keys(deviceState), (type) => {
|
||||
defaultStateDict[type] = {};
|
||||
zrUtil.each(Object.keys(deviceState[type] || {}), (state) => {
|
||||
defaultStateDict[type][state] = deviceState[type][state].Default;
|
||||
}, this);
|
||||
}, this);
|
||||
|
||||
return defaultStateDict;
|
||||
}
|
||||
|
||||
setMap(map, mapDevice) {
|
||||
// 保存皮肤类型
|
||||
if (map.skinVO) {
|
||||
this.lineCode = map.skinVO.code;
|
||||
this.$options.scaleRate = map.skinVO.scaling || 1;
|
||||
this.$options.offsetX = map.skinVO.origin ? map.skinVO.origin.x : 0;
|
||||
this.$options.offsetY = map.skinVO.origin ? map.skinVO.origin.y : 0;
|
||||
}
|
||||
|
||||
// 更新视图大小
|
||||
this.$painter.updateTransform({ scaleRate: this.$options.scaleRate, offsetX: this.$options.offsetX, offsetY: this.$options.offsetY });
|
||||
|
||||
// 解析后的数据
|
||||
this.mapDevice = mapDevice;
|
||||
|
||||
// 加载对应皮肤
|
||||
this.style = this.loadStyle(this.lineCode);
|
||||
|
||||
// 数据加载完成 回调
|
||||
if (this.methods.dataLoaded instanceof Function) { this.methods.dataLoaded(this.mapDevice); }
|
||||
|
||||
// 初次渲染视图
|
||||
this.$painter.repaint(this.mapDevice);
|
||||
|
||||
// 视图加载完成 回调
|
||||
if (this.methods.viewLoaded instanceof Function) { this.methods.viewLoaded(this.mapDevice); }
|
||||
}
|
||||
|
||||
setMapDevice(mapDevice) {
|
||||
this.mapDevice = mapDevice;
|
||||
}
|
||||
|
||||
setDefaultState() {
|
||||
const list = [];
|
||||
|
||||
Object.values(this.mapDevice).forEach(elem => {
|
||||
const code = elem.code;
|
||||
const type = elem._type;
|
||||
// 列车不需要设置默认状态
|
||||
type != deviceType.Train && list.push(Object.assign({ code, _type: type }, this.defaultStateDict[type]));
|
||||
});
|
||||
|
||||
this.update(list);
|
||||
|
||||
if (this.methods.stateLoaded instanceof Function) { this.methods.stateLoaded(list); }
|
||||
}
|
||||
|
||||
setOptions(opts) {
|
||||
const options = this.pullBack(opts);
|
||||
this.$options.update(options);
|
||||
this.$painter.updateTransform(this.$options);
|
||||
|
||||
if (this.$options.disabled == true) {
|
||||
this.$mouseController.disable();
|
||||
} else {
|
||||
opts['zoomOnMouseWheel'] = this.zoomOnMouseWheel;
|
||||
this.$mouseController.enable(opts);
|
||||
}
|
||||
|
||||
if (this.methods.optionsUpdate instanceof Function) { this.methods.optionsUpdate(this.$options); }
|
||||
}
|
||||
|
||||
setCenter(deviceCode) {
|
||||
const device = this.mapDevice[deviceCode];
|
||||
if (device && device.instance) {
|
||||
var rect = createBoundingRect(device.instance);
|
||||
var dcenter = calculateDCenter(rect, { width: this.$zr.getWidth(), height: this.$zr.getHeight() });
|
||||
this.setOptions(dcenter);
|
||||
}
|
||||
}
|
||||
|
||||
setLayerVisible(layer) {
|
||||
this.$painter.setLayerVisible(layer);
|
||||
}
|
||||
|
||||
setLevelVisible(list) {
|
||||
this.$painter.setLevelVisible(list);
|
||||
}
|
||||
|
||||
render(list) {
|
||||
(list || []).forEach(elem => {
|
||||
const code = elem.code;
|
||||
const type = elem._type;
|
||||
const oDevice = this.mapDevice[code] || deviceFactory(type, elem);
|
||||
const nDevice = deepAssign(oDevice || {}, elem);
|
||||
this.$painter.delete(oDevice);
|
||||
delete this.mapDevice[code];
|
||||
if (!elem._dispose) {
|
||||
this.mapDevice[code] = nDevice;
|
||||
this.$painter.add(nDevice);
|
||||
}
|
||||
});
|
||||
|
||||
if (this.methods.viewUpdate instanceof Function) { this.methods.viewUpdate(list); }
|
||||
}
|
||||
|
||||
// 中间处理
|
||||
hookHandle(oDevice, elem) {
|
||||
const code = elem.code;
|
||||
const type = elem._type;
|
||||
// 如果是延时计时，需要保存计数值到全局
|
||||
if (type === deviceType.StationCounter) {
|
||||
let val = '' + elem.val;
|
||||
if (val === '0' || !elem.val) {
|
||||
val = elem.val = localStore.get(code) || '0';
|
||||
}
|
||||
|
||||
localStore(code, val);
|
||||
}
|
||||
|
||||
for (var prop in elem) {
|
||||
if (oDevice[prop] != elem[prop]) {
|
||||
deepAssign(oDevice, elem);
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
// 后处理
|
||||
postHandle(list) {
|
||||
list.forEach(elem => {
|
||||
const code = elem.code;
|
||||
const type = elem._type;
|
||||
if (type == deviceType.Switch) {
|
||||
const item = this.mapDevice[code];
|
||||
if (item) {
|
||||
const sectionA = this.mapDevice[item.sectionACode];
|
||||
const sectionB = this.mapDevice[item.sectionBCode];
|
||||
const sectionC = this.mapDevice[item.sectionCCode];
|
||||
if (sectionA && sectionB && sectionC) {
|
||||
item['cutOff'] = sectionA.cutOff;
|
||||
item['sectionAstatus'] = sectionA.status;
|
||||
item['sectionBstatus'] = sectionB.status;
|
||||
item['sectionCstatus'] = sectionC.status;
|
||||
}
|
||||
}
|
||||
|
||||
this.$painter.update(item);
|
||||
}
|
||||
|
||||
if (type == deviceType.Section) {
|
||||
const item = this.mapDevice[code];
|
||||
if (item) {
|
||||
const swch = this.mapDevice[item.relSwitchCode];
|
||||
if (swch) {
|
||||
const sectionA = this.mapDevice[swch.sectionACode];
|
||||
const sectionB = this.mapDevice[swch.sectionBCode];
|
||||
const sectionC = this.mapDevice[swch.sectionCCode];
|
||||
if (sectionA && sectionB && sectionC) {
|
||||
swch['cutOff'] = sectionA.cutOff;
|
||||
swch['sectionAstatus'] = sectionA.status;
|
||||
swch['sectionBstatus'] = sectionB.status;
|
||||
swch['sectionCstatus'] = sectionC.status;
|
||||
}
|
||||
|
||||
this.$painter.update(swch);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
update(list) {
|
||||
(list || []).forEach(elem => {
|
||||
const code = elem.code;
|
||||
const type = elem._type;
|
||||
const oDevice = this.mapDevice[code] || deviceFactory(type, elem);
|
||||
if (elem.dispose) {
|
||||
this.$painter.delete(oDevice);
|
||||
} else {
|
||||
if (this.hookHandle(oDevice, elem)) {
|
||||
this.$painter.update(oDevice);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 状态后处理
|
||||
this.postHandle(list || []);
|
||||
|
||||
if (this.methods.stateUpdate instanceof Function) { this.methods.stateUpdate(list); }
|
||||
}
|
||||
|
||||
pullBack(payload) {
|
||||
if (payload.type === 'zoom') {
|
||||
const zrWidth = this.$zr.getWidth();
|
||||
const zrHeight = this.$zr.getHeight();
|
||||
const originX = payload.originX || zrWidth / 2;
|
||||
const originY = payload.originY || zrHeight / 2;
|
||||
const x = (this.$options.offsetX + originX) / this.$options.scaleRate;
|
||||
const y = (this.$options.offsetY + originY) / this.$options.scaleRate;
|
||||
const newScaleRate = this.$options.getScaleRate(payload.scale);
|
||||
const dx = originX - (x * newScaleRate - this.$options.offsetX);
|
||||
const dy = originY - (y * newScaleRate - this.$options.offsetY);
|
||||
payload.dx = dx;
|
||||
payload.dy = dy;
|
||||
}
|
||||
|
||||
return payload || {};
|
||||
}
|
||||
|
||||
getZr() {
|
||||
return this.$zr;
|
||||
}
|
||||
|
||||
getEvents() {
|
||||
return this.events;
|
||||
}
|
||||
|
||||
getDeviceByCode(code) {
|
||||
return this.mapDevice[code];
|
||||
}
|
||||
|
||||
getShapeTipPoint(opts) {
|
||||
const device = this.mapDevice[opts.code];
|
||||
if (device) {
|
||||
return this.$painter.getShapeTipPoint(device.instance, opts);
|
||||
}
|
||||
}
|
||||
|
||||
resize(opt) {
|
||||
this.$zr.resize(opt);
|
||||
this.$painter.updateZrSize(opt);
|
||||
}
|
||||
|
||||
refresh() {
|
||||
this.$painter.refresh();
|
||||
}
|
||||
|
||||
clearTrainView() {
|
||||
this.$painter.clearLevel(deviceType.Train);
|
||||
zrUtil.each(Object.values(this.mapDevice), device => {
|
||||
if (device._type == deviceType.Train) {
|
||||
device.instance = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
clear() {
|
||||
this.lineCode = '';
|
||||
this.style = {};
|
||||
this.mapDevice = {};
|
||||
this.$painter.clear();
|
||||
}
|
||||
|
||||
dispose() {
|
||||
this.off(this.events.Pan, this.optionsHandler);
|
||||
this.off(this.events.Zoom, this.optionsHandler);
|
||||
|
||||
this.clear();
|
||||
|
||||
this.$mouseController.dispose();
|
||||
this.$keyboardController.dispose();
|
||||
this.$zr && zrender.dispose(this.$zr);
|
||||
this.$painter.dispose();
|
||||
}
|
||||
|
||||
on(eventname, cb, context) {
|
||||
const idx = Object.values(this.events).indexOf(eventname);
|
||||
if (idx >= 0) {
|
||||
switch (eventname) {
|
||||
case this.events.Selected:
|
||||
this.$mouseController.on(this.events.Selected, cb, context);
|
||||
break;
|
||||
case this.events.Contextmenu:
|
||||
this.$mouseController.on(this.events.Contextmenu, cb, context);
|
||||
break;
|
||||
case this.events.DataZoom:
|
||||
this.$mouseController.on(this.events.DataZoom, cb, context);
|
||||
break;
|
||||
case this.events.Keyboard:
|
||||
this.$keyboardController.on(this.events.Keyboard, cb, context);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
off(eventname, cb) {
|
||||
const idx = Object.values(this.events).indexOf(eventname);
|
||||
if (idx >= 0) {
|
||||
switch (eventname) {
|
||||
case this.events.Selected:
|
||||
this.$mouseController.off(this.events.Selected, cb);
|
||||
break;
|
||||
case this.events.Contextmenu:
|
||||
this.$mouseController.off(this.events.Contextmenu, cb);
|
||||
break;
|
||||
case this.events.DataZoom:
|
||||
this.$mouseController.off(this.events.DataZoom, cb);
|
||||
break;
|
||||
case this.events.Keyboard:
|
||||
this.$keyboardController.off(this.events.keyboard, cb);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
renderCheckBox(model) {
|
||||
const type = model._type;
|
||||
const code = model.code;
|
||||
const oDevice = this.mapDevice[code] || deviceFactory(type, model);
|
||||
const nDevice = deviceFactory(type, Object.assign(oDevice.model || {}, model));
|
||||
delete this.mapDevice[code];
|
||||
this.$painter.delete(oDevice);
|
||||
if (!model._dispose) {
|
||||
this.mapDevice[code] = nDevice;
|
||||
this.$painter.add(nDevice);
|
||||
}
|
||||
}
|
||||
deleteCheckBox(code) {
|
||||
const oDevice = this.mapDevice[code];
|
||||
if (oDevice) {
|
||||
delete this.mapDevice[code];
|
||||
this.$painter.delete(oDevice);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default Jlmap;
|
||||
@ -1,306 +0,0 @@
|
||||
import deviceType from './constant/deviceType';
|
||||
import Eventful from 'zrender/src/mixin/Eventful';
|
||||
import * as eventTool from 'zrender/src/core/event';
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
|
||||
class EventModel {
|
||||
constructor(e) {
|
||||
this.clientX = e.event.clientX;
|
||||
this.clientY = e.event.clientY;
|
||||
|
||||
let view = e.target;
|
||||
while (view) {
|
||||
if (Object.values(deviceType).includes(view._type)) {
|
||||
this.deviceCode = view._code;
|
||||
this.deviceType = view._type;
|
||||
this.eventTarget = view;
|
||||
break;
|
||||
}
|
||||
|
||||
if (view._subType) {
|
||||
this.subType = view._subType;
|
||||
}
|
||||
if (view._val) {
|
||||
this.val = view._val;
|
||||
}
|
||||
|
||||
view = view.parent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class MouseController extends Eventful {
|
||||
constructor(jmap) {
|
||||
super();
|
||||
this.$jmap = jmap;
|
||||
this.deviceList = [];
|
||||
this.rightClickPoint = {
|
||||
x: 0,
|
||||
y: 0
|
||||
}; // 右键点击坐标
|
||||
this.$zr = jmap.getZr();
|
||||
this.events = jmap.getEvents();
|
||||
this.initHandler(this.$zr);
|
||||
}
|
||||
|
||||
initHandler(zr) {
|
||||
if (zr) {
|
||||
zr.on('click', this.click, this);
|
||||
zr.on('contextmenu', this.contextmenu, this);
|
||||
zr.on('mousemove', this.moveEvent, this);
|
||||
|
||||
this.enable = function (opts) {
|
||||
opts = opts || {};
|
||||
this._moveOnMouseMove = opts.moveOnMouseMove || true;
|
||||
this._zoomOnMouseWheel = opts.zoomOnMouseWheel || false;
|
||||
this._preventDefaultMouseMove = opts.preventDefaultMouseMove || true;
|
||||
|
||||
this.disable();
|
||||
|
||||
zr.on('mousedown', this.mousedown, this);
|
||||
zr.on('mousemove', this.mousemove, this);
|
||||
zr.on('mouseup', this.mouseup, this);
|
||||
zr.on('mousewheel', this.mousewheel, this);
|
||||
};
|
||||
|
||||
this.disable = function () {
|
||||
zr.off('mousedown', this.mousedown);
|
||||
zr.off('mousemove', this.mousemove);
|
||||
zr.off('mouseup', this.mouseup);
|
||||
zr.off('mousewheel', this.mousewheel);
|
||||
};
|
||||
|
||||
this.dispose = function () {
|
||||
zr.off('click', this.click);
|
||||
zr.off('contextmenu', this.contextmenu);
|
||||
zr.off('mousemove', this.moveEvent);
|
||||
this.disable();
|
||||
};
|
||||
|
||||
this.isDragging = function () { return this._dragging; };
|
||||
}
|
||||
}
|
||||
|
||||
mousedown(e) {
|
||||
// if (eventTool.notLeftMouse(e)) {
|
||||
// return;
|
||||
// }
|
||||
|
||||
this.$zr.dom.focus();
|
||||
if (e.which == 1 || e.which == 3) {
|
||||
var x = e.offsetX;
|
||||
var y = e.offsetY;
|
||||
|
||||
this._x = x;
|
||||
this._y = y;
|
||||
this._dragging = true;
|
||||
if (e.which == 3 && this._zoomOnMouseWheel) {
|
||||
this.handleMouseDownRight(e);
|
||||
} else if (e.which == 1 && this._zoomOnMouseWheel) {
|
||||
this.handleMouseDownLeft(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mousemove(e) {
|
||||
// if (eventTool.notLeftMouse(e) ||
|
||||
// !this._moveOnMouseMove ||
|
||||
// !this._dragging
|
||||
// ) {
|
||||
// return;
|
||||
// }
|
||||
|
||||
const oldX = this._x;
|
||||
const oldY = this._y;
|
||||
|
||||
const dx = e.offsetX - oldX;
|
||||
const dy = e.offsetY - oldY;
|
||||
|
||||
this._x = e.offsetX;
|
||||
this._y = e.offsetY;
|
||||
|
||||
if (e.which == 1) {
|
||||
this._preventDefaultMouseMove && eventTool.stop(e.event);
|
||||
|
||||
this.trigger(this.events.__Pan, { dx, dy, oldX, oldY, newX: this._x, newY: this._y });
|
||||
} else if (e.which === 3 && this._zoomOnMouseWheel) {
|
||||
this.handleMouseMoveRight({x: e.offsetX, y: e.offsetY});
|
||||
}
|
||||
}
|
||||
|
||||
mouseup(e) {
|
||||
if (!eventTool.notLeftMouse(e)) {
|
||||
this._dragging = false;
|
||||
}
|
||||
if (this._zoomOnMouseWheel && this.$jmap.mapDevice['check_box']) {
|
||||
this.eventTarget = this.$jmap.mapDevice['check_box'].instance;
|
||||
this.handleBoundingRect(this.eventTarget);
|
||||
var em = this.checkEvent(e);
|
||||
this.trigger(this.events.Selected, em);
|
||||
}
|
||||
}
|
||||
|
||||
mousewheel(e) {
|
||||
const shouldZoom = this._zoomOnMouseWheel;
|
||||
const wheelDelta = e.wheelDelta;
|
||||
const originX = e.offsetX;
|
||||
const originY = e.offsetY;
|
||||
|
||||
if (wheelDelta === 0 || !shouldZoom) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (shouldZoom) {
|
||||
eventTool.stop(e.event);
|
||||
let scale = 1;
|
||||
if (wheelDelta > 0) {
|
||||
scale = 1;
|
||||
} else if (wheelDelta < 0) {
|
||||
scale = -1;
|
||||
}
|
||||
|
||||
this.trigger(this.events.__Zoom, {type: this.events.__Zoom, scale, originX, originY });
|
||||
}
|
||||
}
|
||||
|
||||
click(e) {
|
||||
var em = this.checkEvent(e);
|
||||
this.trigger(this.events.Selected, em);
|
||||
}
|
||||
|
||||
contextmenu(e) {
|
||||
var em = this.checkEvent(e);
|
||||
this.trigger(this.events.Contextmenu, em);
|
||||
}
|
||||
|
||||
moveEvent(e) {
|
||||
const newEm = new EventModel(e);
|
||||
const trainDetails = store.state.map.trainDetails;
|
||||
if (trainDetails) {
|
||||
if (newEm.deviceType != deviceType.Train || trainDetails.code != newEm.deviceCode) {
|
||||
var instance = (this.$jmap.getDeviceByCode(trainDetails.code) || {} ).instance;
|
||||
instance && instance.removeTrainDetail && instance.removeTrainDetail();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
checkEvent(e) {
|
||||
var oldEm = new EventModel(this.$zr.curEvent || { event: {} });
|
||||
var newEm = new EventModel(e);
|
||||
if ([1, 3].includes(e.which)) {
|
||||
// 查找之前和当前鼠标选中的实例
|
||||
var oldDevice = this.$jmap.getDeviceByCode(oldEm.deviceCode) || {};
|
||||
var newDevice = this.$jmap.getDeviceByCode(newEm.deviceCode) || {};
|
||||
var oldInstance = (this.$jmap.getDeviceByCode(oldEm.deviceCode) || {}).instance || {};
|
||||
var newInstance = (this.$jmap.getDeviceByCode(newEm.deviceCode) || {}).instance || {};
|
||||
|
||||
// 如果之前和当前选中的实例不一致
|
||||
if (oldInstance != newInstance) {
|
||||
// 如果实例有取消选择函数并且被点击，则执行取消选中函数
|
||||
if (oldInstance.mouseEvent && oldInstance.mouseEvent.mouseout) {
|
||||
// 视图数据设置点击标志，同步执行
|
||||
oldDevice['down'] = false;
|
||||
oldInstance.mouseEvent['mouseout'](e);
|
||||
}
|
||||
|
||||
// 如果实例有选中函数并且被点击，则执行选中函数
|
||||
if (e.which == 3 && newInstance.mouseEvent && newInstance.mouseEvent.mouseover) {
|
||||
newDevice['down'] = true;
|
||||
newInstance.mouseEvent['mouseover'](e);
|
||||
}
|
||||
}
|
||||
|
||||
// 保存当前实例到全局
|
||||
this.$zr.curEvent = e;
|
||||
}
|
||||
|
||||
return newEm;
|
||||
}
|
||||
|
||||
// 处理鼠标右键按下事件
|
||||
handleMouseDownRight(e) {
|
||||
this.rightClickPoint.x = e.offsetX;
|
||||
this.rightClickPoint.y = e.offsetY;
|
||||
}
|
||||
// 处理鼠标左键按下事件
|
||||
handleMouseDownLeft(e) {
|
||||
const em = new EventModel(e);
|
||||
this.eventTarget = em.eventTarget;
|
||||
if (this.eventTarget && this.eventTarget._type === deviceType.CheckBox) {
|
||||
this.handleBoundingRect(this.eventTarget);
|
||||
} else {
|
||||
this.$jmap.deleteCheckBox('check_box');
|
||||
this.eventTarget = '';
|
||||
this.deviceList = [];
|
||||
}
|
||||
}
|
||||
// 通过包围盒筛选选中区域的元素
|
||||
handleBoundingRect(eventTarget) {
|
||||
this.deviceList = [];
|
||||
const boundingRect = this.createFakeBoundingRect(eventTarget);
|
||||
const deviceList = Object.values(this.$jmap.mapDevice);
|
||||
const includeDeviceList = [];
|
||||
deviceList.forEach( item =>{
|
||||
if (item.instance && item.instance._type == deviceType.Section) {
|
||||
let deviceBoundingRect = {};
|
||||
if (item.type == '03') {
|
||||
deviceBoundingRect = {
|
||||
x1: item.namePosition.x,
|
||||
y1: item.namePosition.y,
|
||||
x2: item.namePosition.x,
|
||||
y2: item.namePosition.y
|
||||
};
|
||||
} else {
|
||||
deviceBoundingRect = {
|
||||
x1: item.points[0].x,
|
||||
y1: item.points[0].y,
|
||||
x2: item.points[item.points.length - 1].x,
|
||||
y2: item.points[item.points.length - 1].y
|
||||
};
|
||||
}
|
||||
if (this.whetherInclude(boundingRect, deviceBoundingRect )) {
|
||||
includeDeviceList.push(item);
|
||||
}
|
||||
}
|
||||
if (item.instance && item.instance._type == deviceType.Switch) {
|
||||
const deviceBoundingRect = {
|
||||
x1: item.intersection.x,
|
||||
y1: item.intersection.y,
|
||||
x2: item.intersection.x,
|
||||
y2: item.intersection.y
|
||||
};
|
||||
if (this.whetherInclude(boundingRect, deviceBoundingRect )) {
|
||||
includeDeviceList.push(item);
|
||||
}
|
||||
}
|
||||
});
|
||||
this.deviceList = includeDeviceList;
|
||||
store.dispatch('map/setSeclectDeviceList', this.deviceList);
|
||||
}
|
||||
// 生成包围盒对象坐标
|
||||
createFakeBoundingRect(instance) {
|
||||
return {
|
||||
x1: instance.model.point.x,
|
||||
y1: instance.model.point.y,
|
||||
x2: instance.model.point.x + instance.model.width,
|
||||
y2: instance.model.point.y + instance.model.height
|
||||
};
|
||||
}
|
||||
|
||||
// 判断元素包围盒是否在选中区域
|
||||
whetherInclude(boundingRect1, boundingRect2) {
|
||||
return boundingRect1.x1 <= boundingRect2.x1 && boundingRect1.y1 <= boundingRect2.y1 && boundingRect1.x2 >= boundingRect2.x2 && boundingRect1.y2 >= boundingRect2.y2;
|
||||
}
|
||||
|
||||
// 右键拖动区域大小
|
||||
handleMouseMoveRight(point2) {
|
||||
const point1 = this.rightClickPoint;
|
||||
const x = Math.min(point1.x, point2.x) + this.$jmap.$options.offsetX;
|
||||
const y = Math.min(point1.y, point2.y) + this.$jmap.$options.offsetY;
|
||||
const width = Math.abs(point1.x - point2.x);
|
||||
const height = Math.abs(point1.y - point2.y);
|
||||
this.$jmap.renderCheckBox({code: 'check_box', _type: 'CheckBox', point: {x: x, y: y}, width: width, height: height });
|
||||
}
|
||||
}
|
||||
|
||||
export default MouseController;
|
||||
@ -1,100 +0,0 @@
|
||||
class Options {
|
||||
constructor(opts, trigger) {
|
||||
this.scaleIndex = 0;
|
||||
this.scaleList = [
|
||||
0.8, 0.9,
|
||||
1, 1.2, 1.4, 1.6, 1.8,
|
||||
2, 2.2, 2.4, 2.6, 2.8,
|
||||
3, 3.2, 3.4, 3.6, 3.8,
|
||||
4, 4.2, 4.4, 4.6, 4.8,
|
||||
5, 5.2, 5.4, 5.6, 5.8,
|
||||
6, 6.2, 6.4, 6.6, 6.8,
|
||||
7, 7.2, 7.4, 7.6, 7.8,
|
||||
8
|
||||
];
|
||||
|
||||
if (Number.isFinite(opts.scaleRate)) {
|
||||
const idx = this.scaleList.indexOf(opts.scaleRate);
|
||||
if (idx >= 0) {
|
||||
this.scaleIndex = idx;
|
||||
}
|
||||
}
|
||||
|
||||
this.scaleRate = opts.scaleRate || this.scaleList[this.scaleIndex]; // 缩放比例
|
||||
|
||||
this.offsetX = opts.offsetX || 0; // x偏移
|
||||
|
||||
this.offsetY = opts.offsetY || 0; // y偏移
|
||||
|
||||
this.throttle = opts.throttle || 100; // 刷新频率
|
||||
|
||||
this.disabled = false;
|
||||
|
||||
this.moveOnMouseMove = true;
|
||||
|
||||
this.zoomOnMouseWheel = false;
|
||||
|
||||
this.preventDefaultMouseMove = true;
|
||||
|
||||
this.trigger = trigger;
|
||||
}
|
||||
|
||||
update(payload) {
|
||||
if (Number.isFinite(payload.dx)) {
|
||||
this.offsetX -= payload.dx;
|
||||
}
|
||||
if (Number.isFinite(payload.dy)) {
|
||||
this.offsetY -= payload.dy;
|
||||
}
|
||||
|
||||
if (Number.isFinite(payload.offsetX)) {
|
||||
this.offsetX = payload.offsetX;
|
||||
}
|
||||
if (Number.isFinite(payload.offsetY)) {
|
||||
this.offsetY = payload.offsetY;
|
||||
}
|
||||
|
||||
if (Number.isFinite(payload.scale)) {
|
||||
if (Number.isFinite(payload.scale)) {
|
||||
if ((this.scaleIndex + payload.scale) >= 0 && (this.scaleIndex + payload.scale) < this.scaleList.length) {
|
||||
this.scaleIndex = this.scaleIndex + payload.scale;
|
||||
}
|
||||
}
|
||||
this.scaleRate = this.scaleList[this.scaleIndex];
|
||||
}
|
||||
|
||||
if (Number.isFinite(payload.scaleRate)) {
|
||||
const idx = this.scaleList.indexOf(payload.scaleRate);
|
||||
if (idx < 0) {
|
||||
return;
|
||||
}
|
||||
this.scaleIndex = idx;
|
||||
this.scaleRate = payload.scaleRate;
|
||||
}
|
||||
|
||||
if (payload.disabled === true || payload.disabled === false) {
|
||||
this.disabled = payload.disabled;
|
||||
}
|
||||
|
||||
if (payload.moveOnMouseMove === true || payload.moveOnMouseMove === false) {
|
||||
this.moveOnMouseMove = payload.moveOnMouseMove;
|
||||
}
|
||||
|
||||
if (payload.zoomOnMouseWheel === true || payload.zoomOnMouseWheel === false) {
|
||||
this.zoomOnMouseWheel = payload.zoomOnMouseWheel;
|
||||
}
|
||||
|
||||
if (this.trigger instanceof Function) { this.trigger(this); }
|
||||
}
|
||||
|
||||
getScaleRate(scale) {
|
||||
if (Number.isFinite(scale)) {
|
||||
if ((this.scaleIndex + scale) >= 0 && (this.scaleIndex + scale) < this.scaleList.length) {
|
||||
return this.scaleList[this.scaleIndex + scale];
|
||||
}
|
||||
}
|
||||
return this.scaleList[this.scaleIndex];
|
||||
}
|
||||
}
|
||||
|
||||
export default Options;
|
||||
@ -1,271 +0,0 @@
|
||||
import * as zrUtil from 'zrender/src/core/util';
|
||||
import * as vector from 'zrender/src/core/vector';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import deviceType from './constant/deviceType';
|
||||
import shapefactory from './shape/factory';
|
||||
import TransformHandle from './transformHandle';
|
||||
|
||||
class Painter {
|
||||
constructor(jmap) {
|
||||
// 父级实例
|
||||
this.$jmap = jmap;
|
||||
this.$zr = jmap.getZr();
|
||||
|
||||
// 图层数据
|
||||
this.mapInstanceLevel = {};
|
||||
|
||||
// 初始图层
|
||||
this.initLevels();
|
||||
|
||||
// 视图控制器
|
||||
this.$transformHandle = new TransformHandle(this);
|
||||
}
|
||||
|
||||
/**
|
||||
* 初始绘图实例
|
||||
* @param {*} dom
|
||||
* @param {*} config
|
||||
*/
|
||||
initLevels() {
|
||||
// 图层分级策略
|
||||
this.layerBranch = {};
|
||||
this.layerBranch['01'] = (type) => { return type == deviceType.Link; }; // 逻辑图层级
|
||||
this.layerBranch['02'] = (type) => { return type != deviceType.Link; }; // 物理图层级
|
||||
this.layerBranch['03'] = (type) => { return true; }; // 混合图层级
|
||||
|
||||
// 添加父级图层
|
||||
this.parentLevel = new Group({ name: '__parent__' });
|
||||
this.$zr.add(this.parentLevel);
|
||||
|
||||
// 添加子级图层
|
||||
zrUtil.each(Object.values(deviceType), (type) => {
|
||||
const level = new Group({ name: `__${type}__` });
|
||||
this.mapInstanceLevel[type] = level;
|
||||
this.parentLevel.add(level);
|
||||
});
|
||||
|
||||
// 设置默认显示图级
|
||||
this.setLayerVisible('02');
|
||||
}
|
||||
|
||||
/**
|
||||
* 重绘视图
|
||||
* @param {*} mapDevice
|
||||
*/
|
||||
repaint(mapDevice) {
|
||||
// 清空视图
|
||||
this.clear();
|
||||
|
||||
// 创建视图
|
||||
Object.values(mapDevice).forEach(device => {
|
||||
this.add(device);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 添加视图
|
||||
* @param {*} device
|
||||
*/
|
||||
add(device) {
|
||||
try {
|
||||
const instance = shapefactory(device, this.$jmap);
|
||||
if (instance) {
|
||||
device.instance = instance;
|
||||
this.$transformHandle.transformView(instance);
|
||||
this.mapInstanceLevel[device._type].add(instance);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除视图
|
||||
* @param {*} device
|
||||
*/
|
||||
delete(device) {
|
||||
const instance = device.instance;
|
||||
if (instance) {
|
||||
this.mapInstanceLevel[device._type].remove(instance);
|
||||
}
|
||||
}
|
||||
|
||||
checkIntersect(device) {
|
||||
var intersect = false;
|
||||
var befor = device.instance;
|
||||
var train = shapefactory(device, this.$jmap);
|
||||
|
||||
this.mapInstanceLevel[deviceType.Train].eachChild(elem => {
|
||||
if (elem !== befor && elem.getBoundingRect().intersect(train.getBoundingRect())) {
|
||||
intersect = true;
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
return intersect;
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新列车
|
||||
* @param {*} device
|
||||
*/
|
||||
updateTrain(device) {
|
||||
var oldTrainWindowModel = null;
|
||||
var instance = device.instance;
|
||||
var curModel = device;
|
||||
|
||||
if (instance) {
|
||||
oldTrainWindowModel = device.trainWindowModel;
|
||||
}
|
||||
|
||||
if (curModel.sectionCode) {
|
||||
curModel.sectionModel = this.$jmap.getDeviceByCode(curModel.sectionCode);
|
||||
}
|
||||
|
||||
if (curModel.trainWindowCode) {
|
||||
curModel.trainWindowModel = this.$jmap.getDeviceByCode(curModel.trainWindowCode);
|
||||
}
|
||||
|
||||
if (instance && oldTrainWindowModel && this.checkIntersect(device)) {
|
||||
device.trainWindowModel = oldTrainWindowModel;
|
||||
}
|
||||
|
||||
instance && this.mapInstanceLevel[deviceType.Train].remove(instance);
|
||||
this.add(device);
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新视图
|
||||
* @param {*} device
|
||||
*/
|
||||
update(device) {
|
||||
if (device) {
|
||||
try {
|
||||
if (device._dispose) {
|
||||
this.delete(device);
|
||||
} else if (deviceType.Train == device._type) {
|
||||
this.updateTrain(device);
|
||||
} else {
|
||||
const instance = device.instance;
|
||||
if (instance) {
|
||||
instance.setState(device);
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新transform变化
|
||||
* @param {*} opt
|
||||
*/
|
||||
updateTransform(opt) {
|
||||
this.$transformHandle.updateTransform(opt);
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新zrender尺寸
|
||||
* @param {*} opt
|
||||
*/
|
||||
updateZrSize(opt) {
|
||||
this.$transformHandle.updateZrSize(opt);
|
||||
}
|
||||
|
||||
/**
|
||||
* 过去坐标提示位置
|
||||
* @param {*} opts
|
||||
*/
|
||||
getShapeTipPoint(instance, opts) {
|
||||
if (instance) {
|
||||
var point = instance.getShapeTipPoint(opts);
|
||||
if (point) {
|
||||
// 矩阵变换
|
||||
var transform = this.$transformHandle.transform;
|
||||
var transPoint = vector.applyTransform([], [point.x, point.y], transform);
|
||||
return {
|
||||
x: transPoint[0],
|
||||
y: transPoint[1]
|
||||
};
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置逻辑和物理图层
|
||||
* @param {*} layer
|
||||
*/
|
||||
setLayerVisible(layer) {
|
||||
zrUtil.each(Object.values(deviceType), type => {
|
||||
const level = this.mapInstanceLevel[type];
|
||||
if (this.layerBranch[layer](type)) {
|
||||
level.show();
|
||||
} else {
|
||||
level.hide();
|
||||
}
|
||||
}, this);
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置图层可见
|
||||
* @param {*} code
|
||||
*/
|
||||
setLevelVisible(list) {
|
||||
zrUtil.each(Object.values(deviceType), type => {
|
||||
const level = this.mapInstanceLevel[type];
|
||||
if (list.includes(type)) {
|
||||
level.show();
|
||||
} else {
|
||||
level.hide();
|
||||
}
|
||||
}, this);
|
||||
}
|
||||
|
||||
/**
|
||||
* 刷新图层
|
||||
*/
|
||||
refresh() {
|
||||
this.$zr.refresh();
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除图层
|
||||
*/
|
||||
clearLevel(type) {
|
||||
const level = this.mapInstanceLevel[type];
|
||||
if (level) {
|
||||
level.removeAll();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除canvas
|
||||
*/
|
||||
clear() {
|
||||
zrUtil.each(Object.values(this.mapInstanceLevel), (level) => {
|
||||
level && level.removeAll();
|
||||
}, this);
|
||||
|
||||
this.refresh();
|
||||
}
|
||||
|
||||
/**
|
||||
* 销毁图层
|
||||
*/
|
||||
dispose() {
|
||||
this.mapInstanceLevel = {};
|
||||
this.parentLevel = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* 父级图层
|
||||
*/
|
||||
getParentLevel() {
|
||||
return this.parentLevel;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Painter;
|
||||
@ -1,67 +0,0 @@
|
||||
/*
|
||||
* lC区域控制模式
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import EControl from '../element/EControl';
|
||||
|
||||
export default class ButtonControl extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this.z = 20;
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = 10;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
this.control = new EControl({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
arc: {
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: this.style.ButtonControl.lamp.radiusR
|
||||
},
|
||||
lineWidth: 0,
|
||||
fill: this.style.ButtonControl.lamp.controlColor
|
||||
},
|
||||
text: {
|
||||
position: [0, 0],
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.ButtonControl.lamp.radiusR + this.style.ButtonControl.text.distance,
|
||||
fontWeight: this.style.ButtonControl.text.fontWeight,
|
||||
fontSize: this.style.ButtonControl.text.fontSize,
|
||||
fontFamily: this.style.fontFamily,
|
||||
text: model.text || '按图折返',
|
||||
textFill: '#fff',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
},
|
||||
style: this.style
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(model) {
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.control) {
|
||||
var distance = 2;
|
||||
var rect = this.control.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,69 +0,0 @@
|
||||
/*
|
||||
* 图片list
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Image from 'zrender/src/graphic/Image';
|
||||
|
||||
export default class ImageControl extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.z = model.zIndex || 1;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
this.image = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
origin: {
|
||||
x: model.position.x,
|
||||
y: model.position.y
|
||||
},
|
||||
rotation: -Math.PI / 180 * model.rotate,
|
||||
style: {
|
||||
image: model.url,
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
width: model.width,
|
||||
height: model.height
|
||||
}
|
||||
});
|
||||
this.add(this.image);
|
||||
// 旋转
|
||||
if (model.rotate) {
|
||||
this.transformRotation(this.image);
|
||||
}
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
}
|
||||
|
||||
// 整体图片
|
||||
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();
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.image) {
|
||||
var distance = 2;
|
||||
var rect = this.image.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,53 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
export default class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
this.text = new Text({
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z+1,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: this.device.model.position.x,
|
||||
y: this.device.model.position.y + this.device.style.LcControl.lamp.radiusR + this.device.style.LcControl.text.distance-30,
|
||||
fontWeight: 'normal',
|
||||
fontSize: this.device.style.LcControl.mouseOverStyle.fontSize,
|
||||
fontFamily: this.device.style.LcControl.mouseOverStyle.fontFamily,
|
||||
text: this.device.model.name,
|
||||
textFill: this.device.style.LcControl.mouseOverStyle.fontColor,
|
||||
textAlign: this.device.style.LcControl.mouseOverStyle.textAlign,
|
||||
textVerticalAlign: this.device.style.LcControl.mouseOverStyle.textVerticalAlign
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
this.text.hide();
|
||||
}
|
||||
mouseover(e) {
|
||||
if (e.target && e.target._subType == 'Text') {
|
||||
this.text.show();
|
||||
} else {
|
||||
this.device.control.setControlColor(this.device.style.LcControl.mouseOverStyle.arcColor);
|
||||
this.device.control.setTextColor(this.device.style.LcControl.mouseOverStyle.textColor);
|
||||
this.device.control.setTextBorder(true);
|
||||
this.device.control.setArcBorder(true);
|
||||
}
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
if (e.target && e.target._subType == 'Text') {
|
||||
this.text.hide();
|
||||
} else {
|
||||
this.device.control.setControlColor(this.device.style.LcControl.lamp.controlColor);
|
||||
this.device.control.setTextColor('#FFFFFF');
|
||||
this.device.control.setTextBorder(false);
|
||||
this.device.control.setArcBorder(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,78 +0,0 @@
|
||||
/*
|
||||
* lC区域控制模式
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import EControl from '../element/EControl';
|
||||
import EMouse from './EMouse';
|
||||
|
||||
export default class LcControl extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this.z = 20;
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create();
|
||||
this.createMouseEvent();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
this.control = new EControl({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
arc: {
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: this.style.LcControl.lamp.radiusR
|
||||
},
|
||||
lineWidth: 0,
|
||||
fill: this.style.LcControl.lamp.controlColor
|
||||
},
|
||||
text: {
|
||||
position: [0, 0],
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.LcControl.lamp.radiusR + this.style.LcControl.text.distance,
|
||||
fontWeight: this.style.LcControl.text.fontWeight,
|
||||
fontSize: this.style.LcControl.text.fontSize,
|
||||
fontFamily: this.style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: '#fff',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
},
|
||||
style: this.style
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(model) {
|
||||
}
|
||||
|
||||
createMouseEvent() {
|
||||
if (this.style.LcControl.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.control) {
|
||||
var distance = 2;
|
||||
var rect = this.control.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,54 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
export default class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
this.text = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z+1,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: this.device.model.position.x,
|
||||
y: this.device.model.position.y + this.device.style.LimitControl.lamp.radiusR + this.device.style.LimitControl.text.distance-30,
|
||||
fontWeight: this.device.style.LimitControl.mouseOverStyle.fontWeight,
|
||||
fontSize: this.device.style.LimitControl.mouseOverStyle.fontSize,
|
||||
fontFamily: this.device.style.LimitControl.mouseOverStyle.fontFormat,
|
||||
text: this.device.model.name,
|
||||
textFill: this.device.style.LimitControl.mouseOverStyle.fontColor,
|
||||
textAlign: this.device.style.LimitControl.mouseOverStyle.textAlign,
|
||||
textVerticalAlign: this.device.style.LimitControl.mouseOverStyle.textVerticalAlign
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
this.text.hide();
|
||||
}
|
||||
mouseover(e) {
|
||||
if (e.target && e.target._subType == 'Text') {
|
||||
this.text.show();
|
||||
} else {
|
||||
this.device.control.setControlColor(this.device.style.LimitControl.mouseOverStyle.arcColor);
|
||||
this.device.control.setTextColor(this.device.style.LimitControl.mouseOverStyle.textColor);
|
||||
this.device.control.setTextBorder(true);
|
||||
this.device.control.setArcBorder(true);
|
||||
}
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
if (e.target && e.target._subType == 'Text') {
|
||||
this.text.hide();
|
||||
} else {
|
||||
this.device.control.setControlColor(this.device.style.LimitControl.lamp.controlColor);
|
||||
this.device.control.setTextColor('#FFFFFF');
|
||||
this.device.control.setTextBorder(false);
|
||||
this.device.control.setArcBorder(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,82 +0,0 @@
|
||||
/*
|
||||
* 权限临时限速
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import EControl from '../element/EControl';
|
||||
import EMouse from './EMouse';
|
||||
|
||||
export default class LimitControl extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this.selected = false;
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.z = 20;
|
||||
this.create(model);
|
||||
this.createMouseEvent();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create(model) {
|
||||
this.control = new EControl({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
arc: {
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: this.style.LimitControl.lamp.radiusR
|
||||
},
|
||||
lineWidth: 0,
|
||||
fill: this.style.LimitControl.lamp.controlColor,
|
||||
mouseover: this.mouseoverArc,
|
||||
mouseout: this.mouseoutArc
|
||||
},
|
||||
text: {
|
||||
position: [0, 0],
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.LimitControl.lamp.radiusR + this.style.LimitControl.text.distance,
|
||||
fontWeight: this.style.LimitControl.text.fontWeight,
|
||||
fontSize: this.style.LimitControl.text.fontSize,
|
||||
fontFamily: this.style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: '#fff',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
mouseover: this.mouseoverText,
|
||||
mouseout: this.mouseoutText
|
||||
},
|
||||
style: this.style
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(model) {
|
||||
}
|
||||
|
||||
createMouseEvent() {
|
||||
if (this.style.LimitControl.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.control) {
|
||||
var distance = 2;
|
||||
var rect = this.control.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,54 +0,0 @@
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
export default class Line2 extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 0;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
if (model && model.points.length > 1) {
|
||||
for (let i = 0; i < (model.points.length - 1); i++) {
|
||||
this.add(new Line({
|
||||
zlevel: model.zlevel,
|
||||
z: model.isLogic ? this.z : this.z + 1,
|
||||
shape: {
|
||||
x1: model.points[i].x,
|
||||
y1: model.points[i].y,
|
||||
x2: model.points[i + 1].x,
|
||||
y2: model.points[i + 1].y
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.width,
|
||||
stroke: style.Line.lineColor
|
||||
}
|
||||
}));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
setLineType(type) {
|
||||
switch (type) {
|
||||
case '01': break;
|
||||
case '02':
|
||||
this.eachChild((child) => {
|
||||
child.setStyle('lineDash', [4]);
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
this.setLineType(model.type);
|
||||
}
|
||||
}
|
||||
@ -1,39 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
// import Vue from 'vue';
|
||||
// import store from '@/store';
|
||||
|
||||
class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
if (this.device.link) {
|
||||
const rect = this.device.link.getBoundingRect();
|
||||
this.lineBorder = new Rect({
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z - 1,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: '#fff',
|
||||
fill: this.device.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.lineBorder);
|
||||
this.lineBorder.hide();
|
||||
}
|
||||
}
|
||||
|
||||
mouseover(e) {
|
||||
this.lineBorder && this.lineBorder.show();
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
this.lineBorder && this.lineBorder.hide();
|
||||
}
|
||||
}
|
||||
export default EMouse;
|
||||
@ -1,68 +0,0 @@
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import EMouse from './EMouse';
|
||||
|
||||
class Link extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
let textPosition = 'insideBottom';
|
||||
if (model.lp.x !== model.rp.x && model.lp.y !== model.rp.y) {
|
||||
textPosition = model.lp.y > model.rp.y ? 'insideLeft' : 'insideRight';
|
||||
}
|
||||
// 标准link
|
||||
this.link = new Line({
|
||||
zlevel: this.zlevel,
|
||||
z: 0,
|
||||
shape: {
|
||||
x1: model.lp.x,
|
||||
y1: model.lp.y,
|
||||
x2: model.rp.x,
|
||||
y2: model.rp.y
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Link.linkWidth,
|
||||
stroke: style.Link.linkColor,
|
||||
text: model.name,
|
||||
textDistance: style.Link.linkWidth * 2,
|
||||
textPosition: textPosition, // 'inside',
|
||||
textAlign: 'middle',
|
||||
fontSize: style.Link.textFontSize,
|
||||
textFill: style.Link.linkTextColor,
|
||||
textStroke: style.Link.backgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.link);
|
||||
const path = window.location.href;
|
||||
if (path.includes('/map/draw')) {
|
||||
// 鼠标事件
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
}
|
||||
|
||||
tipBasePoint() {
|
||||
}
|
||||
|
||||
getBoundingRect() {
|
||||
return this.link.getBoundingRect();
|
||||
}
|
||||
}
|
||||
|
||||
export default Link;
|
||||
@ -1,85 +0,0 @@
|
||||
// import Group from 'zrender/src/container/Group';
|
||||
// import Line from 'zrender/src/graphic/shape/Line';
|
||||
// import Circle from 'zrender/src/graphic/shape/Circle';
|
||||
import Path from 'zrender/src/graphic/Path';
|
||||
|
||||
// 计轴
|
||||
export const EAxle = Path.extend({
|
||||
type: 'EAxle',
|
||||
shape: {
|
||||
point: null
|
||||
},
|
||||
buildPath: function (ctx, model) {
|
||||
if (model && model.style && model.traingle) {
|
||||
const axleLength = 2 * model.style.Section.axle.radius;
|
||||
const positionx = model.point.x + model.drictx * (model.traingle.getCos(axleLength));
|
||||
const positiony = model.point.y + model.dricty * (model.traingle.getCos(axleLength));
|
||||
// 圆弧
|
||||
const arcX = positionx - model.dricty * model.traingle.getSin(axleLength);
|
||||
const arcY = positiony + model.drictx * model.traingle.getSin(axleLength);
|
||||
const arcR = model.style.Section.axle.radius;
|
||||
ctx.arc(arcX, arcY, arcR, 0, 2 * Math.PI, false);
|
||||
ctx.closePath();
|
||||
|
||||
const x1 = positionx - model.traingle.getCos(axleLength) - model.dricty * model.traingle.getSin(axleLength);
|
||||
const y1 = positiony + model.drictx * model.traingle.getSin(axleLength) - model.traingle.getSin(axleLength);
|
||||
const x2 = positionx + model.traingle.getCos(axleLength) - model.dricty * model.traingle.getSin(axleLength);
|
||||
const y2 = positiony + model.drictx * model.traingle.getSin(axleLength) + model.traingle.getSin(axleLength);
|
||||
ctx.moveTo(x1, y1);
|
||||
ctx.lineTo(x2, y2);
|
||||
ctx.closePath();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// export default class EAxle extends Group {
|
||||
// constructor(model) {
|
||||
// super();
|
||||
// this.model = model;
|
||||
// this.zlevel = model.zlevel;
|
||||
// this.z = 5;
|
||||
// this.create(model);
|
||||
// }
|
||||
|
||||
// create(model) {
|
||||
// if (model && model.style && model.traingle) {
|
||||
// const axleLength = 2 * model.style.Section.axle.radius;
|
||||
// const positionx = model.point.x + model.drictx * (model.traingle.getCos(axleLength));
|
||||
// const positiony = model.point.y + model.dricty * (model.traingle.getCos(axleLength));
|
||||
|
||||
// this.line = new Line({
|
||||
// zlevel: this.zlevel,
|
||||
// z: this.z,
|
||||
// progressive: model.progressive,
|
||||
// shape: {
|
||||
// x1: positionx - model.traingle.getCos(axleLength) - model.dricty * model.traingle.getSin(axleLength),
|
||||
// y1: positiony + model.drictx * model.traingle.getSin(axleLength) - model.traingle.getSin(axleLength),
|
||||
// x2: positionx + model.traingle.getCos(axleLength) - model.dricty * model.traingle.getSin(axleLength),
|
||||
// y2: positiony + model.drictx * model.traingle.getSin(axleLength) + model.traingle.getSin(axleLength)
|
||||
// },
|
||||
// style: {
|
||||
// GBaseLineWidth: 1,
|
||||
// stroke: model.style.Section.axle.color
|
||||
// }
|
||||
// });
|
||||
// this.axle = new Circle({
|
||||
// zlevel: this.zlevel,
|
||||
// z: this.z,
|
||||
// progressive: model.progressive,
|
||||
// shape: {
|
||||
// cx: positionx - model.dricty * model.traingle.getSin(axleLength),
|
||||
// cy: positiony + model.drictx * model.traingle.getSin(axleLength),
|
||||
// r: model.style.Section.axle.radius
|
||||
// },
|
||||
// style: {
|
||||
// GBaseLineWidth: 1,
|
||||
// stroke: model.style.Section.axle.color,
|
||||
// fill: model.style.transparentColor
|
||||
// }
|
||||
// });
|
||||
|
||||
// this.add(this.line);
|
||||
// this.add(this.axle);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
@ -1,42 +0,0 @@
|
||||
import Path from 'zrender/src/graphic/Path';
|
||||
|
||||
// 成都三号线 折返进路
|
||||
export const EBackArrow = Path.extend({
|
||||
type: 'EBackArrow',
|
||||
shape: {
|
||||
points: null
|
||||
},
|
||||
buildPath: function (ctx, shape) {
|
||||
const points = shape.points;
|
||||
var r = shape.height;
|
||||
var x = points.x + shape.drict * shape.width / 2;
|
||||
var y = points.y;
|
||||
ctx.moveTo(points.x - shape.drict * shape.width, points.y + shape.height);
|
||||
ctx.lineTo(points.x + shape.drict * shape.width / 2, points.y + shape.height);
|
||||
if (shape.drict) {
|
||||
ctx.arc(x, y, r, Math.PI / 2, Math.PI * 3 / 2, true);
|
||||
} else {
|
||||
ctx.arc(x, y, r, Math.PI / 2, Math.PI * 3 / 2, false);
|
||||
}
|
||||
ctx.moveTo(points.x + shape.drict * shape.width / 2, points.y - shape.height);
|
||||
ctx.lineTo(points.x - shape.drict * (shape.width - 5), points.y - shape.height);
|
||||
}
|
||||
});
|
||||
|
||||
// 箭头
|
||||
export const EBackArrowTriangle = Path.extend({
|
||||
type: 'EBackArrowTriangle',
|
||||
shape: {
|
||||
points: null
|
||||
},
|
||||
buildPath: function (ctx, shape) {
|
||||
const points = shape.points;
|
||||
ctx.moveTo(points.x - shape.drict * (shape.width - 5), points.y - shape.height - 3);
|
||||
if (shape.drict) {
|
||||
ctx.lineTo(points.x - shape.drict * shape.width, points.y - shape.height);
|
||||
} else {
|
||||
ctx.lineTo(points.x - shape.drict * shape.width, points.y - shape.height);
|
||||
}
|
||||
ctx.lineTo(points.x - shape.drict * (shape.width - 5), points.y - shape.height + 3);
|
||||
}
|
||||
});
|
||||
@ -1,218 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import BezierCurve from 'zrender/src/graphic/shape/BezierCurve';
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import JTriangle from '../../utils/JTriangle';
|
||||
// import Path from 'zrender/src/graphic/Path';
|
||||
|
||||
// 创建区段限速限集合
|
||||
// export const ELimitLines = Path.extend({
|
||||
// type: 'ELimitLines',
|
||||
// shape: {
|
||||
// points: null
|
||||
// },
|
||||
// buildPath: function (ctx, model) {
|
||||
// /** 创建区段*/
|
||||
// if (model && model.points.length > 1) {
|
||||
// if (model.isCurve) {
|
||||
// ctx.beginPath();
|
||||
// const shape = {};
|
||||
// for (let i = 1; i < (model.points.length - 1); i++) {
|
||||
// shape[`cpx${i}`] = model.points[i].x;
|
||||
// shape[`cpy${i}`] = model.points[i].y;
|
||||
// }
|
||||
// shape[`x1`] = model.points[0].x;
|
||||
// shape[`y1`] = model.points[0].y;
|
||||
// shape[`x2`] = model.points[model.points.length - 1].x;
|
||||
// shape[`y2`] = model.points[model.points.length - 1].y;
|
||||
|
||||
// ctx.moveTo(shape[`x1`], shape[`y1`]);
|
||||
// if (model.points.length <= 3) {
|
||||
// ctx.quadraticCurveTo(shape[`cpx1`], shape[`cpy1`], shape[`x2`], shape[`y2`]);
|
||||
// } else {
|
||||
// ctx.bezierCurveTo(shape[`cpx1`], shape[`cpy1`], shape[`cpx2`], shape[`cpy2`], shape[`x2`], shape[`y2`]);
|
||||
// }
|
||||
// } else {
|
||||
// const swPadding = model.style.Switch.core.length; // 定位和反位时区段距离岔芯的距离
|
||||
// var switchWidth = model.style.Section.line.width + model.style.Section.line.beyondWidth; // 道岔宽度
|
||||
// const beg = Object.assign({}, model.points[0]);
|
||||
// const end = Object.assign({}, model.points[model.points.length - 1]);
|
||||
// if (model.isSwitchSection && beg.y !== end.y) {
|
||||
// const swch = model.switch;
|
||||
// if (swch) {
|
||||
// const traingle = new JTriangle(swch.intersection, swch.skew);
|
||||
// if ((swch.intersection.x === beg.x) && (swch.intersection.y === beg.y)) {
|
||||
// beg.x = beg.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
|
||||
// beg.y = beg.y + traingle.dricty * (swPadding + switchWidth);
|
||||
// }
|
||||
|
||||
// if ((swch.intersection.x === end.x) && (swch.intersection.y === end.y)) {
|
||||
// end.x = end.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
|
||||
// end.y = end.y + traingle.dricty * (swPadding + switchWidth);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// if (model.points.length == 2) {
|
||||
// ctx.moveTo(beg.x, beg.y);
|
||||
// ctx.lineTo(end.x, end.y);
|
||||
// ctx.closePath();
|
||||
// } else {
|
||||
// ctx.moveTo(beg.x, beg.y);
|
||||
// ctx.lineTo(model.points[1].x, model.points[1].y);
|
||||
// ctx.closePath();
|
||||
|
||||
// for (let i = 1; i < (model.points.length - 2); i++) {
|
||||
// ctx.moveTo(model.points[i].x, model.points[i].y);
|
||||
// ctx.lineTo(model.points[i + 1].x, model.points[i + 1].y);
|
||||
// ctx.closePath();
|
||||
// }
|
||||
// ctx.moveTo(model.points[model.points.length - 2].x, model.points[model.points.length - 2].y);
|
||||
// ctx.lineTo(end.x, end.y);
|
||||
// ctx.closePath();
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
export default class ELimitLines extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.z;
|
||||
this.create(model);
|
||||
}
|
||||
|
||||
create(model) {
|
||||
/** 创建区段*/
|
||||
if (model && model.points.length > 1) {
|
||||
if (model.isCurve) {
|
||||
const shape = {};
|
||||
for (let i = 1; i < (model.points.length - 1); i++) {
|
||||
shape[`cpx${i}`] = model.points[i].x;
|
||||
shape[`cpy${i}`] = model.points[i].y;
|
||||
}
|
||||
|
||||
shape[`x1`] = model.points[0].x;
|
||||
shape[`y1`] = model.points[0].y;
|
||||
shape[`x2`] = model.points[model.points.length - 1].x;
|
||||
shape[`y2`] = model.points[model.points.length - 1].y;
|
||||
|
||||
this.add(new BezierCurve({
|
||||
isLine: true,
|
||||
zlevel: this.zlevel,
|
||||
progressive: model.progressive,
|
||||
z: this.z,
|
||||
culling: true,
|
||||
shape: shape,
|
||||
position: model.position,
|
||||
style: {
|
||||
lineWidth: model.style.Section.speedLimit.width,
|
||||
stroke: model.style.Section.speedLimit.lineColor,
|
||||
fillOpacity: 0
|
||||
}
|
||||
}));
|
||||
} else {
|
||||
// const beg = Object.assign({}, model.points[0]);
|
||||
// const end = Object.assign({}, model.points[model.points.length - 1]);
|
||||
|
||||
const swPadding = model.style.Switch.core.length; // 定位和反位时区段距离岔芯的距离
|
||||
var switchWidth = model.style.Section.line.width + model.style.Section.line.beyondWidth; // 道岔宽度
|
||||
const beg = Object.assign({}, model.points[0]);
|
||||
const end = Object.assign({}, model.points[model.points.length - 1]);
|
||||
if (model.isSwitchSection && beg.y !== end.y) {
|
||||
const swch = model.switch;
|
||||
if (swch) {
|
||||
const traingle = new JTriangle(swch.intersection, swch.skew);
|
||||
if ((swch.intersection.x === beg.x) && (swch.intersection.y === beg.y)) {
|
||||
beg.x = beg.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
|
||||
beg.y = beg.y + traingle.dricty * (swPadding + switchWidth);
|
||||
}
|
||||
|
||||
if ((swch.intersection.x === end.x) && (swch.intersection.y === end.y)) {
|
||||
end.x = end.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
|
||||
end.y = end.y + traingle.dricty * (swPadding + switchWidth);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (model.points.length == 2) {
|
||||
this.add(new Line({
|
||||
isLine: true,
|
||||
zlevel: this.zlevel,
|
||||
progressive: model.progressive,
|
||||
z: this.z,
|
||||
position: model.position,
|
||||
shape: {
|
||||
x1: beg.x,
|
||||
y1: beg.y,
|
||||
x2: end.x,
|
||||
y2: end.y
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.Section.speedLimit.width,
|
||||
stroke: model.style.Section.speedLimit.lineColor
|
||||
}
|
||||
}));
|
||||
} else {
|
||||
this.add(new Line({
|
||||
isLine: true,
|
||||
zlevel: this.zlevel,
|
||||
progressive: model.progressive,
|
||||
z: this.z,
|
||||
position: model.position,
|
||||
shape: {
|
||||
x1: beg.x,
|
||||
y1: beg.y,
|
||||
x2: model.points[1].x,
|
||||
y2: model.points[1].y
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.Section.speedLimit.width,
|
||||
stroke: model.style.Section.speedLimit.lineColor
|
||||
}
|
||||
}));
|
||||
|
||||
for (let i = 1; i < (model.points.length - 2); i++) {
|
||||
this.add(new Line({
|
||||
isLine: true,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
progressive: model.progressive,
|
||||
position: model.position,
|
||||
shape: {
|
||||
x1: model.points[i].x,
|
||||
y1: model.points[i].y,
|
||||
x2: model.points[i + 1].x,
|
||||
y2: model.points[i + 1].y
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.Section.speedLimit.width,
|
||||
stroke: model.style.Section.speedLimit.lineColor
|
||||
}
|
||||
}));
|
||||
}
|
||||
|
||||
this.add(new Line({
|
||||
isLine: true,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: model.position,
|
||||
progressive: model.progressive,
|
||||
shape: {
|
||||
x1: model.points[model.points.length - 2].x,
|
||||
y1: model.points[model.points.length - 2].y,
|
||||
x2: end.x,
|
||||
y2: end.y
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.Section.speedLimit.width,
|
||||
stroke: model.style.Section.speedLimit.lineColor
|
||||
}
|
||||
}));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,91 +0,0 @@
|
||||
// import Path from 'zrender/src/graphic/Path';
|
||||
|
||||
// 成都三号线 临时限速名称显示
|
||||
// export const ELimitName = Path.extend({
|
||||
// type: 'ELimitName',
|
||||
// shape: {
|
||||
// points: null
|
||||
// },
|
||||
// buildPath: function (ctx, shape) {
|
||||
// const points = shape.points;
|
||||
// const y = points.y - 15;
|
||||
// ctx.moveTo(points.x, y);
|
||||
// ctx.lineTo(points.x - shape.drict * shape.style.Section.speedLimit.drogueWidth, y);
|
||||
// ctx.lineTo(points.x - shape.drict * (shape.style.Section.speedLimit.drogueWidth + 5), y - 5);
|
||||
// ctx.lineTo(points.x - shape.drict * shape.style.Section.speedLimit.drogueWidth, y - 10);
|
||||
// ctx.lineTo(points.x, y - 10);
|
||||
// ctx.lineTo(points.x, y);
|
||||
// }
|
||||
// });
|
||||
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
|
||||
export default class ELimitName extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.z;
|
||||
this.create(model);
|
||||
}
|
||||
|
||||
create(model) {
|
||||
const rectW = model.style.Section.speedLimit.drogueWidth;
|
||||
const rectH = model.style.Section.speedLimit.drogueHeight;
|
||||
this.add(new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 9,
|
||||
shape: {
|
||||
points: [
|
||||
[model.x, model.y],
|
||||
[model.x - model.drict * rectW, model.y],
|
||||
[model.x - model.drict * (rectW + rectH / 2), model.y - rectH / 2],
|
||||
[model.x - model.drict * rectW, model.y - rectH],
|
||||
[model.x, model.y - rectH]
|
||||
]
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
fill: model.style.Section.speedLimit.nameBackground
|
||||
}
|
||||
}));
|
||||
|
||||
// 公里标内容
|
||||
this.add(new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 10,
|
||||
style: {
|
||||
x: model.x - model.drict * 2,
|
||||
y: model.y,
|
||||
fontWeight: 'normal',
|
||||
fontSize: model.style.Section.speedLimit.nameNumberFontSize,
|
||||
fontFamily: model.style.fontFamily,
|
||||
text: '15',
|
||||
textFill: model.style.Section.speedLimit.nameNumberColor,
|
||||
textAlign: model.drict == -1 ? 'left' : 'right',
|
||||
textPosition: model.style.Section.text.textPosition || 'inside',
|
||||
textVerticalAlign: 'bottom'
|
||||
}
|
||||
}));
|
||||
|
||||
// 公里值
|
||||
this.add(new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 10,
|
||||
style: {
|
||||
x: model.x,
|
||||
y: model.y + 12,
|
||||
fontWeight: 'normal',
|
||||
fontSize: model.style.Section.speedLimit.kilometerFontSize,
|
||||
fontFamily: model.style.fontFamily,
|
||||
text: '17.981km',
|
||||
textFill: model.style.Section.speedLimit.kilometerColor,
|
||||
textAlign: model.drict == -1 ? 'left' : 'right',
|
||||
textPosition: model.style.Section.text.textPosition || 'inside',
|
||||
textVerticalAlign: 'bottom'
|
||||
}
|
||||
}));
|
||||
}
|
||||
}
|
||||
@ -1,102 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import BezierCurve from 'zrender/src/graphic/shape/BezierCurve';
|
||||
|
||||
/** 创建区段线集合*/
|
||||
export default class ELines extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.z;
|
||||
this.create(model);
|
||||
}
|
||||
|
||||
create(model) {
|
||||
/** 创建区段*/
|
||||
if (model && model.points.length > 1) {
|
||||
if (model.isCurve) {
|
||||
const shape = {};
|
||||
for (let i = 1; i < (model.points.length - 1); i++) {
|
||||
shape[`cpx${i}`] = model.points[i].x;
|
||||
shape[`cpy${i}`] = model.points[i].y;
|
||||
}
|
||||
|
||||
shape[`x1`] = model.points[0].x;
|
||||
shape[`y1`] = model.points[0].y;
|
||||
shape[`x2`] = model.points[model.points.length - 1].x;
|
||||
shape[`y2`] = model.points[model.points.length - 1].y;
|
||||
|
||||
this.add(new BezierCurve({
|
||||
isLine: true,
|
||||
zlevel: this.zlevel,
|
||||
progressive: model.progressive,
|
||||
z: this.z + 1,
|
||||
culling: true,
|
||||
shape: shape,
|
||||
style: {
|
||||
lineWidth: model.style.Section.line.width,
|
||||
stroke: model.style.Section.line.spareColor,
|
||||
fillOpacity: 0
|
||||
}
|
||||
}));
|
||||
} else {
|
||||
for (let i = 0; i < (model.points.length - 1); i++) {
|
||||
this.add(new Line({
|
||||
isLine: true,
|
||||
zlevel: this.zlevel,
|
||||
progressive: model.progressive,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x1: model.points[i].x,
|
||||
y1: model.points[i].y,
|
||||
x2: model.points[i + 1].x,
|
||||
y2: model.points[i + 1].y
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.Section.line.width,
|
||||
stroke: model.style.Section.line.spareColor
|
||||
}
|
||||
}));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
setStyle(styles) {
|
||||
this.eachChild((child) => {
|
||||
if (child.setStyle && child.isLine) {
|
||||
child.setStyle(styles);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
animateStyle(loop, animates) {
|
||||
if (animates && animates.length) {
|
||||
this.eachChild((child) => {
|
||||
if (child.animateStyle && child.isLine) {
|
||||
let an = child.animateStyle(loop);
|
||||
animates.forEach(elem => {
|
||||
an = an.when(elem.time, elem.styles);
|
||||
});
|
||||
an.start();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
stopAnimation(flag) {
|
||||
this.eachChild((child) => {
|
||||
if (child.stopAnimation && child.isLine) {
|
||||
child.stopAnimation(flag);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
setBorderVisible(isVisible) {
|
||||
this.lineBorder && this.lineBorder.hide();
|
||||
if (isVisible) {
|
||||
this.lineBorder && this.lineBorder.show();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,152 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
// import Vue from 'vue';
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
class EMouse extends Group {
|
||||
constructor(device, code) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.code = code;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
if (this.device.name) {
|
||||
const rect = this.device.name.getBoundingRect();
|
||||
if (!this.device.isSwitchSection) {
|
||||
this.sectionTextBorder = new Rect({
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z + 4,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: '#fff', // 白色
|
||||
fill: this.device.model.sectionType == '02' ? this.device.style.Section.line.logicalColor : '#00FFFF' // 蓝色
|
||||
}
|
||||
});
|
||||
this.add(this.sectionTextBorder);
|
||||
this.sectionTextBorder.hide();
|
||||
}
|
||||
|
||||
const fontSize = this.device.model.type == '02' ? this.device.style.Section.text.fontSize + 2 : this.device.style.Section.text.fontSize;
|
||||
this.TextName = new Text({
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z + 4,
|
||||
style: {
|
||||
x: rect.x + (rect.width / 2),
|
||||
y: rect.y + (rect.height / 2),
|
||||
fontWeight: 'normal',
|
||||
fontSize: fontSize,
|
||||
fontFamily: this.device.style.fontFamily,
|
||||
text: this.device.model.name,
|
||||
textFill: '#000',
|
||||
textAlign: this.device.style.Section.text.textAlign,
|
||||
textPosition: this.device.style.Section.text.textPosition || 'inside',
|
||||
textVerticalAlign: this.device.style.Section.text.textVerticalAlign || null
|
||||
}
|
||||
});
|
||||
this.add(this.TextName);
|
||||
this.TextName.hide();
|
||||
|
||||
this.sectionTextShadow = new Text({
|
||||
zlevel: this.zlevel + 3,
|
||||
z: 5,
|
||||
position: [4, -2],
|
||||
silent: true,
|
||||
style: {
|
||||
x: rect.x + (rect.width / 2),
|
||||
y: rect.y + (rect.height / 2),
|
||||
text: this.device.model.name,
|
||||
textFill: this.device.style.Section.mouseOverStyle.textShadowColor, // 黄色
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: 'bold ' + (fontSize + 1) + 'px ' + this.device.style.fontFamily
|
||||
}
|
||||
});
|
||||
this.add(this.sectionTextShadow);
|
||||
this.sectionTextShadow.hide();
|
||||
}
|
||||
if (this.device.section) {
|
||||
const rect = this.device.section.getBoundingRect();
|
||||
this.lineBorder = new Rect({
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z - 1,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.device.style.Section.mouseOverStyle.borderColor,
|
||||
fill: this.device.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.lineBorder);
|
||||
this.lineBorder.hide();
|
||||
}
|
||||
}
|
||||
|
||||
getInstanceByCode(code) {
|
||||
return (store.getters['map/getDeviceByCode'](code) || {}).instance;
|
||||
}
|
||||
|
||||
mouseover(e) {
|
||||
if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) {
|
||||
const instance = this.getInstanceByCode(this.device.model.relSwitchCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseover) {
|
||||
instance.mouseEvent.mouseover(e);
|
||||
}
|
||||
} else {
|
||||
this.TextName && this.TextName.show();
|
||||
this.sectionTextBorder && this.sectionTextBorder.show();
|
||||
this.lineBorder && this.lineBorder.show();
|
||||
const instance = this.getInstanceByCode(this.device.model.trainWindowCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseEnter) {
|
||||
instance.mouseEvent.mouseEnter(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
this.sectionTextShadow && this.sectionTextShadow.hide();
|
||||
if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) {
|
||||
const instance = this.getInstanceByCode(this.device.model.relSwitchCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseout) {
|
||||
instance.mouseEvent.mouseout(e);
|
||||
}
|
||||
} else {
|
||||
this.TextName && this.TextName.hide();
|
||||
this.sectionTextBorder && this.sectionTextBorder.hide();
|
||||
this.lineBorder && this.lineBorder.hide();
|
||||
const instance = this.getInstanceByCode(this.device.model.trainWindowCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseLeave) {
|
||||
instance.mouseEvent.mouseLeave(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseEnter(e) {
|
||||
this.TextName && this.TextName.show();
|
||||
this.sectionTextBorder && this.sectionTextBorder.show();
|
||||
this.lineBorder && this.lineBorder.show();
|
||||
if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) {
|
||||
const instance = this.getInstanceByCode(this.device.model.relSwitchCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseEnter) {
|
||||
instance.mouseEvent.mouseEnter(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseLeave(e) {
|
||||
this.TextName && this.TextName.hide();
|
||||
this.sectionTextBorder && this.sectionTextBorder.hide();
|
||||
this.lineBorder && this.lineBorder.hide();
|
||||
if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) {
|
||||
const instance = this.getInstanceByCode(this.device.model.relSwitchCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseLeave) {
|
||||
instance.mouseEvent.mouseLeave(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
export default EMouse;
|
||||
@ -1,72 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
|
||||
/** 延时释放*/
|
||||
export default class ERelease extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
|
||||
this.isNew = true;
|
||||
this.lines = new Line({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: model.shape,
|
||||
progressive: model.progressive,
|
||||
style: {
|
||||
lineWidth: model.lineWidth,
|
||||
stroke: model.stroke
|
||||
}
|
||||
});
|
||||
this.add(this.lines);
|
||||
}
|
||||
}
|
||||
|
||||
setStyle(model) {
|
||||
this.create();
|
||||
this.lines.setStyle(model);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.lines.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.lines.show();
|
||||
}
|
||||
|
||||
// 开始动画
|
||||
animateStyle(loop, animates) {
|
||||
this.create();
|
||||
if (animates && animates.length) {
|
||||
this.eachChild((child) => {
|
||||
if (child.animateStyle) {
|
||||
let an = child.animateStyle(loop);
|
||||
animates.forEach(elem => {
|
||||
an = an.when(elem.time, elem.styles);
|
||||
});
|
||||
an.start();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 结束动画
|
||||
stopAnimation(flag) {
|
||||
this.create();
|
||||
this.eachChild((child) => {
|
||||
if (child.stopAnimation) {
|
||||
child.stopAnimation(flag);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -1,92 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polyline from 'zrender/src/graphic/shape/Polyline';
|
||||
import Circle from 'zrender/src/graphic/shape/Circle';
|
||||
|
||||
/** 分隔符*/
|
||||
export default class ESeparator extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.style.Section.separator.z || 6;
|
||||
this.style = model.style;
|
||||
this.setType();
|
||||
}
|
||||
|
||||
createModel(points, lineWidth = null, stroke = null) {
|
||||
const model = this.model;
|
||||
this.partition = new Polyline({
|
||||
zlevel: this.zlevel,
|
||||
progressive: model.progressive,
|
||||
z: this.z,
|
||||
shape: {
|
||||
points: points
|
||||
},
|
||||
style: {
|
||||
lineWidth: lineWidth || this.style.Section.separator.width,
|
||||
stroke: stroke || this.style.Section.separator.color
|
||||
}
|
||||
});
|
||||
this.add(this.partition);
|
||||
}
|
||||
|
||||
// 创建 侵限分隔符
|
||||
createCircle() {
|
||||
const model = this.model;
|
||||
this.circle = new Circle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
progressive: model.progressive,
|
||||
shape: {
|
||||
cx: model.point.x,
|
||||
cy: model.point.y,
|
||||
r: this.style.Section.line.width
|
||||
},
|
||||
style: {
|
||||
stroke: this.style.Section.line.invadeColor,
|
||||
GBaseLineWidth: 0.5,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
this.add(this.circle);
|
||||
}
|
||||
|
||||
setType() {
|
||||
const type = this.model.sepType;
|
||||
const model = this.model;
|
||||
if (model && this.style && model.traingle) {
|
||||
if (type === '01') { // 普通分割
|
||||
const points = [
|
||||
[model.point.x, model.point.y - (this.style.Section.line.width)],
|
||||
[model.point.x, model.point.y + (this.style.Section.line.width)]
|
||||
];
|
||||
this.createModel(points);
|
||||
} else if (type === '02') { // 单侧分割符
|
||||
const points = [
|
||||
[model.point.x + model.drict * (this.style.Section.line.width), model.point.y - (this.style.Section.line.width * 1.5)],
|
||||
[model.point.x, model.point.y - (this.style.Section.line.width * 1.5)],
|
||||
[model.point.x, model.point.y + (this.style.Section.line.width * 1.5)]
|
||||
];
|
||||
this.createModel(points);
|
||||
} else if (type === '03') { // 尽头分隔符
|
||||
const points = [
|
||||
[model.point.x + model.drict * (this.style.Section.line.width) * 1.2, model.point.y - (this.style.Section.line.width * 1.2)],
|
||||
[model.point.x, model.point.y - (this.style.Section.line.width * 1.2)],
|
||||
[model.point.x, model.point.y + (this.style.Section.line.width * 1.2)],
|
||||
[model.point.x + model.drict * (this.style.Section.line.width) * 1.2, model.point.y + (this.style.Section.line.width * 1.2)]
|
||||
];
|
||||
const lineWidth = this.style.Section.separator.endWidth;
|
||||
const stroke = this.style.Section.separator.endColor;
|
||||
this.createModel(points, lineWidth, stroke);
|
||||
} else if (type === '04') { // 侵限分隔符
|
||||
this.createCircle();
|
||||
}
|
||||
}
|
||||
|
||||
if (model.traingle) {
|
||||
this.origin = [model.point.x, model.point.y];
|
||||
this.rotation = Math.PI * 2 - Math.atan2(model.traingle.absy, model.traingle.absx) * model.traingle.drictx * model.traingle.dricty;
|
||||
this.dirty(); // 可以无需调用
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,847 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import ETextName from '../element/ETextName'; // 名称文字 (共有)
|
||||
import ERelease from './ERelease'; // 线段 (共有)
|
||||
import ELimitLines from './ELimitLines'; // 区段限速 (私有)
|
||||
import ELines from './ELines'; // 创建多线条 曲线 (私有)
|
||||
import ESeparator from './ESeparator'; // 分隔符 (私有)
|
||||
import EMouse from './EMouse';
|
||||
import { EAxle } from './EAxle'; // 创建计轴 (私有)
|
||||
import { EBackArrow, EBackArrowTriangle } from './EBackArrow'; // 折返进路箭头
|
||||
import ELimitName from './ELimitName'; // 成都三号线 限速名称
|
||||
import JTriangle from '../../utils/JTriangle';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
/** 区段*/
|
||||
export default class Section extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 5 + parseInt(model.layer || 0);
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create();
|
||||
this.createMouseEvent();
|
||||
this.createMouse(); // 框选鼠标移入移事件
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
// 01:物理区段；02逻辑区段；03道岔区段
|
||||
this.createSectionText(); // 创建区段文字
|
||||
if (model.type === '01' && (
|
||||
model.logicSectionNum.length <= 0 ||
|
||||
model.logicSectionNum.length == 1 && model.logicSectionNum[0] == 0) ||
|
||||
model.type === '02') {
|
||||
this.createSection(); // 创建区段
|
||||
this.creatRelease(); // 创建延时释放
|
||||
this.createSeparator(); // 创建分隔符
|
||||
this.createTurnBack(); // 创建成都三号线 折返箭头
|
||||
if (model.type === '01') {
|
||||
this.createAxles(); // 创建计轴
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
createMouseEvent() {
|
||||
// 鼠标事件
|
||||
if (this.style.Section.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this, this.model.relSwitchCode);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
|
||||
/** 创建区段*/
|
||||
createSection() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
// 创建区段
|
||||
this.section = new ELines({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
isSwitchSection: model.isSwitchSection,
|
||||
isCurve: model.isCurve,
|
||||
points: model.points,
|
||||
style: style
|
||||
});
|
||||
|
||||
this.add(this.section);
|
||||
}
|
||||
|
||||
// 折返箭头
|
||||
createTurnBack() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
if (model.isReentryTrack && style.Section.shuttleBack) {
|
||||
const radius = 3;
|
||||
model.drict = 1; // 箭头朝向 (是折返轨加一个方向选择) 目前在区段右边
|
||||
const width = style.Section.line.width * 2;
|
||||
const height = style.Section.line.width * 1;
|
||||
const turnBackDistance = style.Section.shuttleBack.distance + radius * 4;
|
||||
|
||||
const points = model.points;
|
||||
let x = -model.drict * width * 1.2;
|
||||
let y = -turnBackDistance;
|
||||
|
||||
if (model.drict < 0) {
|
||||
x += points[0].x;
|
||||
y += points[0].y;
|
||||
} else {
|
||||
x += points[points.length - 1].x;
|
||||
y += points[points.length - 1].y;
|
||||
}
|
||||
|
||||
this.turnBack = new EBackArrow({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 10,
|
||||
shape: {
|
||||
drict: model.drict,
|
||||
width: width,
|
||||
height: height,
|
||||
points: {
|
||||
x: x,
|
||||
y: y
|
||||
}
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Section.separator.width,
|
||||
stroke: style.Section.separator.color,
|
||||
fill: 'rgba(0, 0, 0, 0)'
|
||||
}
|
||||
});
|
||||
this.turnBackriangle = new EBackArrowTriangle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 10,
|
||||
shape: {
|
||||
drict: model.drict,
|
||||
width: width,
|
||||
height: height,
|
||||
points: {
|
||||
x: x,
|
||||
y: y
|
||||
}
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Section.separator.width,
|
||||
stroke: style.Section.separator.color,
|
||||
fill: style.Section.separator.color
|
||||
}
|
||||
});
|
||||
this.add(this.turnBack);
|
||||
this.add(this.turnBackriangle);
|
||||
this.turnBack.hide();
|
||||
this.turnBackriangle.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// 创建延时释放 (需要在创建)
|
||||
creatRelease() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
|
||||
this.release = new ERelease({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x1: model.points[0].x + traingle.getCos(traingle.absz / 3),
|
||||
y1: model.points[0].y + traingle.getSin(traingle.absz / 3),
|
||||
x2: model.points[0].x + traingle.getCos(traingle.absz / 3 * 2),
|
||||
y2: model.points[0].y + traingle.getSin(traingle.absz / 3 * 2)
|
||||
},
|
||||
lineWidth: style.Section.line.width,
|
||||
stroke: style.Section.line.spareColor
|
||||
});
|
||||
|
||||
this.add(this.release);
|
||||
}
|
||||
|
||||
// 创建限速线 (需要在创建)
|
||||
creatSpeedLimit() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
|
||||
let x = traingle.drictx * (style.Section.speedLimit.distance) * traingle.getSinRate();
|
||||
let y = traingle.dricty * (style.Section.speedLimit.distance) * traingle.getCosRate();
|
||||
if (x == Infinity) { x = 0; }
|
||||
if (y == Infinity) { y = 0; }
|
||||
if (!this.speedLimitLeft && !this.speedLimitRight) {
|
||||
this.speedLimitLeft = new ELimitLines({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [x, -y],
|
||||
style: style,
|
||||
switch: model.switch,
|
||||
isSwitchSection: model.isSwitchSection,
|
||||
relSwitchCode: model.relSwitchCode,
|
||||
isCurve: model.isCurve, // 是否曲线
|
||||
points: model.points
|
||||
});
|
||||
this.speedLimitRight = new ELimitLines({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [-x, y],
|
||||
style: style,
|
||||
switch: model.switch,
|
||||
isSwitchSection: model.isSwitchSection,
|
||||
relSwitchCode: model.relSwitchCode,
|
||||
isCurve: model.isCurve, // 是否曲线
|
||||
points: model.points
|
||||
});
|
||||
if (style.Section.speedLimit.nameShow) {
|
||||
// 开头 起点位置
|
||||
this.speedLimitNameLeft = new ELimitName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 10,
|
||||
drict: -1,
|
||||
x: model.points[0].x,
|
||||
y: model.points[0].y - 15,
|
||||
style: style
|
||||
});
|
||||
// 终点位置
|
||||
this.speedLimitNameRight = new ELimitName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 10,
|
||||
drict: 1,
|
||||
x: model.points[model.points.length - 1].x,
|
||||
y: model.points[model.points.length - 1].y - 15,
|
||||
style: style
|
||||
});
|
||||
this.add(this.speedLimitNameLeft);
|
||||
this.add(this.speedLimitNameRight);
|
||||
}
|
||||
}
|
||||
this.add(this.speedLimitLeft);
|
||||
this.add(this.speedLimitRight);
|
||||
}
|
||||
|
||||
// 创建区段名称
|
||||
createSectionText() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
if (model && style) {
|
||||
// 计算区段坐标位置
|
||||
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;
|
||||
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;
|
||||
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
|
||||
const drict = model.trainPosType != '01' ? 1 : -1;
|
||||
if (model.type == '01' && style.Section.text.show && model.nameShow && !model.isSwitchSection) { // 物理区段名称
|
||||
const opposite = style.Section.text.opposite ? -1 : 1;
|
||||
const tempx = x + traingle.getSin(style.Section.text.distance);
|
||||
const tempy = y + traingle.getCos(style.Section.text.distance) * (style.Section.text.position || opposite * drict);
|
||||
this.name = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
style: this.style,
|
||||
silent: false,
|
||||
x: tempx + model.namePosition.x,
|
||||
y: tempy + model.namePosition.y,
|
||||
fontWeight: style.Section.text.fontWeight,
|
||||
fontSize: style.Section.text.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: style.Section.text.fontColor,
|
||||
textAlign: style.Section.text.textAlign,
|
||||
textPosition: style.Section.text.textPosition,
|
||||
textVerticalAlign: style.Section.text.textVerticalAlign
|
||||
});
|
||||
this.add(this.name);
|
||||
} else if (model.type == '02' && style.Section.logicText.show && model.nameShow) { // 逻辑区段
|
||||
const opposite = style.Section.logicText.opposite ? -1 : 1;
|
||||
const tempx = x + traingle.getSin(style.Section.logicText.distance);
|
||||
const tempy = y + traingle.getCos(style.Section.logicText.distance) * (style.Section.logicText.position || opposite * drict);
|
||||
this.name = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
style: this.style,
|
||||
silent: false,
|
||||
x: tempx + model.namePosition.x,
|
||||
y: tempy + model.namePosition.y,
|
||||
fontWeight: style.Section.logicText.fontWeight,
|
||||
fontSize: style.Section.logicText.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: style.Section.logicText.fontColor,
|
||||
textAlign: style.Section.logicText.textAlign,
|
||||
textPosition: style.Section.logicText.textPosition,
|
||||
textVerticalAlign: style.Section.logicText.textVerticalAlign
|
||||
});
|
||||
this.add(this.name);
|
||||
} else if (model.type == '03' && model.nameShow) { // 道岔区段 (实际道岔计轴区段)
|
||||
this.name = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
style: this.style,
|
||||
silent: false,
|
||||
x: x + model.namePosition.x,
|
||||
y: y + model.namePosition.y + style.Section.text.distance * drict,
|
||||
fontWeight: style.Section.text.fontWeight,
|
||||
fontSize: style.Section.text.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: style.Section.text.fontColor,
|
||||
textAlign: style.Section.text.textAlign,
|
||||
textPosition: style.Section.text.textPosition,
|
||||
textVerticalAlign: style.Section.text.textVerticalAlign
|
||||
});
|
||||
this.add(this.name);
|
||||
}
|
||||
|
||||
/** 站台轨名称*/
|
||||
if (model.isStandTrack && model.standTrackNameShow && style.Section.standText.show) {
|
||||
const opposite = style.Section.standText.opposite ? -1 : 1;
|
||||
const tempx = x + traingle.getSin(style.Section.standText.distance);
|
||||
const tempy = y + traingle.getCos(style.Section.standText.distance) * (style.Section.standText.position || opposite * drict);
|
||||
this.standTrackText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
silent: false,
|
||||
x: tempx + model.standTrackNamePosition.x,
|
||||
y: tempy + model.standTrackNamePosition.y,
|
||||
fontWeight: style.Section.standText.fontWeight,
|
||||
fontSize: style.Section.standText.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.standTrackName,
|
||||
textFill: style.Section.standText.fontColor,
|
||||
textAlign: style.Section.standText.textAlign,
|
||||
textPosition: style.Section.standText.textPosition,
|
||||
textVerticalAlign: style.Section.standText.textVerticalAlign
|
||||
});
|
||||
this.add(this.standTrackText);
|
||||
}
|
||||
|
||||
/** 折返轨名称*/
|
||||
if (model.isReentryTrack && model.reentryTrackNameShow && style.Section.reentryText.show) {
|
||||
const opposite = style.Section.reentryText.opposite ? -1 : 1;
|
||||
const tempx = x + traingle.getSin(style.Section.reentryText.distance);
|
||||
const tempy = y + traingle.getCos(style.Section.reentryText.distance) * (style.Section.reentryText.position || opposite * drict);
|
||||
this.reentryTrackText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
silent: false,
|
||||
x: tempx + model.reentryTrackNamePosition.x,
|
||||
y: tempy + model.reentryTrackNamePosition.y,
|
||||
fontWeight: style.Section.reentryText.fontWeight,
|
||||
fontSize: style.Section.reentryText.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.reentryTrackName,
|
||||
textFill: style.Section.reentryText.fontColor,
|
||||
textAlign: style.Section.reentryText.textAlign,
|
||||
textPosition: style.Section.reentryText.textPosition,
|
||||
textVerticalAlign: style.Section.reentryText.textVerticalAlign
|
||||
});
|
||||
this.add(this.reentryTrackText);
|
||||
}
|
||||
|
||||
/** 转换轨名称*/
|
||||
if (model.isTransferTrack && model.transferTrackNameShow && style.Section.transferText.show) {
|
||||
const opposite = style.Section.transferText.opposite ? -1 : 1;
|
||||
const tempx = x + traingle.getSin(style.Section.transferText.distance);
|
||||
const tempy = y + traingle.getCos(style.Section.transferText.distance) * (style.Section.transferText.position || opposite * drict);
|
||||
this.transferTrackText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
silent: false,
|
||||
x: tempx + model.transferTrackNamePosition.x,
|
||||
y: tempy + model.transferTrackNamePosition.y,
|
||||
fontWeight: style.Section.transferText.fontWeight,
|
||||
fontSize: style.Section.transferText.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.transferTrackName,
|
||||
textFill: style.Section.transferText.fontColor,
|
||||
textAlign: style.Section.transferText.textAlign,
|
||||
textPosition: style.Section.transferText.textPosition,
|
||||
textVerticalAlign: style.Section.transferText.textVerticalAlign
|
||||
});
|
||||
this.add(this.transferTrackText);
|
||||
}
|
||||
|
||||
/** 目的码名称*/
|
||||
if (model.destinationCode && model.destinationNameShow && style.Section.destinationText.show) {
|
||||
const opposite = style.Section.destinationText.opposite ? -1 : 1;
|
||||
const tempx = x + traingle.getSin(style.Section.destinationText.distance);
|
||||
const tempy = y + traingle.getCos(style.Section.destinationText.distance) * (style.Section.destinationText.position || opposite * drict);
|
||||
this.destinationText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
silent: false,
|
||||
x: tempx + model.destinationCodePoint.x,
|
||||
y: tempy + model.destinationCodePoint.y,
|
||||
fontWeight: style.Section.destinationText.fontWeight,
|
||||
fontSize: style.Section.destinationText.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.destinationCode,
|
||||
textFill: style.Section.destinationText.fontColor,
|
||||
textAlign: style.Section.destinationText.textAlign,
|
||||
textPosition: style.Section.destinationText.textPosition,
|
||||
textVerticalAlign: style.Section.destinationText.textVerticalAlign
|
||||
});
|
||||
this.add(this.destinationText);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 创建计轴 (需要在创建)
|
||||
createAxles() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
/** 创建四个计轴*/
|
||||
let traingle = null;
|
||||
if (model && style && model.axleShow && model.points && model.points.length > 1) {
|
||||
traingle = new JTriangle(model.points[0], model.points[1]);
|
||||
this.lUpAxle = new EAxle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 5, // 层级大于道岔z 否则会压住显示完整
|
||||
shape: {
|
||||
point: {
|
||||
x: model.points[0].x,
|
||||
y: model.points[0].y
|
||||
},
|
||||
drictx: 1,
|
||||
dricty: -1,
|
||||
traingle: traingle,
|
||||
style: style
|
||||
},
|
||||
style: {
|
||||
GBaseLineWidth: 1,
|
||||
stroke: style.Section.axle.color
|
||||
}
|
||||
});
|
||||
this.lBottomAxle = new EAxle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 5, // 层级大于道岔z 否则会压住显示完整
|
||||
shape: {
|
||||
point: {
|
||||
x: model.points[0].x,
|
||||
y: model.points[0].y
|
||||
},
|
||||
drictx: 1,
|
||||
dricty: 1,
|
||||
traingle: traingle,
|
||||
style: style
|
||||
},
|
||||
style: {
|
||||
GBaseLineWidth: 1,
|
||||
stroke: style.Section.axle.color
|
||||
}
|
||||
});
|
||||
|
||||
traingle = new JTriangle(model.points[model.points.length - 2], model.points[model.points.length - 1]);
|
||||
this.rUpAxle = new EAxle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 5, // 层级大于道岔z 否则会压住显示完整
|
||||
shape: {
|
||||
point: {
|
||||
x: model.points[model.points.length - 1].x,
|
||||
y: model.points[model.points.length - 1].y
|
||||
},
|
||||
drictx: -1,
|
||||
dricty: -1,
|
||||
traingle: traingle,
|
||||
style: style
|
||||
},
|
||||
style: {
|
||||
GBaseLineWidth: 1,
|
||||
stroke: style.Section.axle.color
|
||||
}
|
||||
});
|
||||
this.rBottomAxle = new EAxle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 5, // 层级大于道岔z 否则会压住显示完整
|
||||
shape: {
|
||||
point: {
|
||||
x: model.points[model.points.length - 1].x,
|
||||
y: model.points[model.points.length - 1].y
|
||||
},
|
||||
drictx: -1,
|
||||
dricty: 1,
|
||||
traingle: traingle,
|
||||
style: style
|
||||
},
|
||||
style: {
|
||||
GBaseLineWidth: 1,
|
||||
stroke: style.Section.axle.color
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.lUpAxle);
|
||||
this.add(this.rUpAxle);
|
||||
this.add(this.lBottomAxle);
|
||||
this.add(this.rBottomAxle);
|
||||
}
|
||||
}
|
||||
|
||||
// 创建分隔符 (内层需要在创建)
|
||||
createSeparator() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
let traingle = null;
|
||||
|
||||
if (model && style && model.points && model.points.length > 1) {
|
||||
/** 创建左侧分隔符*/
|
||||
traingle = new JTriangle(model.points[0], model.points[1]);
|
||||
this.lPartition = new ESeparator({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
traingle: traingle,
|
||||
point: {
|
||||
x: model.points[0].x,
|
||||
y: model.points[0].y
|
||||
},
|
||||
sepType: model.sepTypeLeft,
|
||||
drict: -1 // 方向
|
||||
});
|
||||
|
||||
/** 创建右侧分隔符*/
|
||||
traingle = new JTriangle(model.points[model.points.length - 2], model.points[model.points.length - 1]);
|
||||
this.rPartition = new ESeparator({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
traingle: traingle,
|
||||
point: {
|
||||
x: model.points[model.points.length - 1].x,
|
||||
y: model.points[model.points.length - 1].y
|
||||
},
|
||||
sepType: model.sepTypeRight,
|
||||
drict: 1 // 方向
|
||||
});
|
||||
|
||||
/** 添加视图*/
|
||||
this.add(this.lPartition);
|
||||
this.add(this.rPartition);
|
||||
}
|
||||
}
|
||||
|
||||
/** 设置区段集合显隐*/
|
||||
setInvisible() {
|
||||
const invisible = this.model.type === '02' && this.model.logicSectionShow;
|
||||
this.eachChild((child) => {
|
||||
child.attr('invisible', invisible);
|
||||
});
|
||||
}
|
||||
|
||||
/** 设置区段恢复默认状态*/
|
||||
recover() {
|
||||
if (this.section) {
|
||||
this.section.stopAnimation(true);
|
||||
this.section.setStyle({
|
||||
fill: this.style.backgroundColor,
|
||||
stroke: this.style.Section.line.spareColor,
|
||||
lineWidth: this.style.Section.line.width
|
||||
});
|
||||
|
||||
if (this.release) {
|
||||
this.release.hide();
|
||||
}
|
||||
if (this.speedLimitLeft && this.speedLimitRight) {
|
||||
this.remove(this.speedLimitLeft);
|
||||
this.remove(this.speedLimitRight);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** 未定义状态 00*/
|
||||
undefine() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.undefinedColor,
|
||||
lineWidth: this.style.Section.line.width
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 空闲状态 01*/
|
||||
spare() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.spareColor,
|
||||
lineWidth: this.style.Section.line.width
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 通信车占用状态 02*/
|
||||
communicationOccupied() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.communicationOccupiedColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 非通信车占用状态 03*/
|
||||
unCommunicationOccupied() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.unCommunicationOccupiedColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 进路锁闭 04*/
|
||||
routeLock() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.routeLockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 封锁 06*/
|
||||
block() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.blockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 故障锁定状态 05*/
|
||||
faultLock() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.faultLockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** atc切除状态 07*/
|
||||
atcExcision() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.atcExcisionColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** ats切除状态 08*/
|
||||
atsExcision() {
|
||||
if (this.section) {
|
||||
this.atcExcision();
|
||||
this.section.animateStyle(true, [
|
||||
{ time: 1000, styles: { stroke: this.style.backgroundColor } },
|
||||
{ time: 2000, styles: { stroke: this.style.Section.line.atsExcisionColor, lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth } }
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
/** 保护区段锁闭 09*/
|
||||
protectiveLock() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.protectiveLockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 延时释放 10*/
|
||||
async timeRelease() {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.routeLockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
|
||||
if (this.release) {
|
||||
this.release.show();
|
||||
this.release.setStyle({
|
||||
stroke: this.style.Section.line.routeLockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
this.release.animateStyle(true, [
|
||||
{ time: 1000, styles: { stroke: this.style.Section.line.routeLockColor } },
|
||||
{ time: 2000, styles: { stroke: this.style.Section.line.timeReleaseColor } }
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
/** 保护区段延时解锁 11*/
|
||||
protectiveTimeRelease() {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.line.protectiveLockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
this.release && this.release.show();
|
||||
this.release && this.release.setStyle({
|
||||
stroke: this.style.Section.line.protectiveLockColor,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
this.release && this.release.animateStyle(true, [
|
||||
{ time: 1000, styles: { stroke: this.style.Section.line.protectiveLockColor } },
|
||||
{ time: 2000, styles: { stroke: this.style.Section.line.protectiveTimeReleaseColor } }
|
||||
]);
|
||||
}
|
||||
|
||||
/** 区段切除*/
|
||||
sectionCutOff() {
|
||||
const lineWidth = this.style.Section.line.width + (this.model.status != '01' ? this.style.Section.line.beyondWidth : 0);
|
||||
if (this.section) {
|
||||
this.section.animateStyle(true, [
|
||||
{ time: 0, styles: { lineWidth: lineWidth } },
|
||||
{ time: 1000, styles: { stroke: this.style.backgroundColor } },
|
||||
{ time: 2000, styles: { lineWidth: lineWidth } }
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
/** 设置限速*/
|
||||
setSpeedUpperLimit() {
|
||||
if (this.section) {
|
||||
this.creatSpeedLimit();
|
||||
}
|
||||
}
|
||||
|
||||
/** 计轴预复位 12*/
|
||||
axleReset() {
|
||||
if (this.release) {
|
||||
this.release.show();
|
||||
this.release && this.release.setStyle({
|
||||
stroke: this.style.Section.axle.resetColor,
|
||||
fill: 'green'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 计轴失效 13*/
|
||||
alxeFailure() {
|
||||
if (this.section) {
|
||||
this.section.setStyle({
|
||||
stroke: this.style.Section.axle.Failure,
|
||||
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 设置状态*/
|
||||
setState(model) {
|
||||
this.recover();
|
||||
if (model.status == '01' || model.status == '00' || model.status == undefined) {
|
||||
if (this.name && this.style.Section.active.routeColor) {
|
||||
this.name.setStyle({textFill: this.style.Section.text.fontColor});
|
||||
}
|
||||
} else {
|
||||
if (this.name && this.style.Section.active.routeColor) {
|
||||
this.name.setStyle({textFill: 'green'});
|
||||
}
|
||||
}
|
||||
switch (model.status) {
|
||||
case '00': /** 未定义*/
|
||||
this.undefine();
|
||||
break;
|
||||
case '01': /** 空闲*/
|
||||
this.spare(); // 空闲状态下 名称白色 其他条件为绿色
|
||||
break;
|
||||
case '02': /** 通信车占用*/
|
||||
this.communicationOccupied();
|
||||
break;
|
||||
case '03': /** 非通信车占用*/
|
||||
this.unCommunicationOccupied();
|
||||
break;
|
||||
case '04': /** 进路锁闭*/
|
||||
this.routeLock();
|
||||
break;
|
||||
case '05': /** 故障锁闭*/
|
||||
this.faultLock();
|
||||
break;
|
||||
case '06': /** 封锁*/
|
||||
this.block();
|
||||
break;
|
||||
case '07': /** ATC切除*/
|
||||
this.atcExcision();
|
||||
break;
|
||||
case '08': /** ATS切除*/
|
||||
this.atsExcision();
|
||||
break;
|
||||
case '09': /** 保护区段锁闭 */
|
||||
this.protectiveLock();
|
||||
break;
|
||||
case '10': /** 延时释放 */
|
||||
this.timeRelease();
|
||||
break;
|
||||
case '11': /** 保护区段延时解锁*/
|
||||
this.protectiveTimeRelease();
|
||||
break;
|
||||
case '12': /** 计轴预复位*/
|
||||
this.axleReset();
|
||||
break;
|
||||
case '13': /** ARB出清检测错误状态*/
|
||||
break;
|
||||
case '14': /** 计轴失效*/
|
||||
this.alxeFailure();
|
||||
break;
|
||||
}
|
||||
|
||||
/** 区段切除*/
|
||||
if (model.cutOff) {
|
||||
this.sectionCutOff();
|
||||
}
|
||||
/** 是否限速*/
|
||||
if (model.speedUpperLimit >= 0) {
|
||||
this.setSpeedUpperLimit();
|
||||
}
|
||||
}
|
||||
|
||||
createMouse() {
|
||||
const rect = this.getBoundingRect();
|
||||
this.lineBorder = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z - 1,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: '#fff',
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.lineBorder);
|
||||
this.lineBorder.hide();
|
||||
}
|
||||
|
||||
mouseout() {
|
||||
this.lineBorder && this.lineBorder.show();
|
||||
}
|
||||
|
||||
mouseover() {
|
||||
this.lineBorder && this.lineBorder.hide();
|
||||
}
|
||||
|
||||
/** 计算提示位置*/
|
||||
getShapeTipPoint() {
|
||||
let rect = this.getBoundingRect();
|
||||
let distance = this.style.Section.line.width / 2;
|
||||
if (this.section) {
|
||||
rect = this.section.getBoundingRect();
|
||||
if (this.model.type !== '02' && this.model.nameShow) {
|
||||
if (this.model.trainPosType == '01') {
|
||||
distance = distance + this.style.Section.text.distance + this.style.Section.text.fontSize;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y + rect.height / 2.7 - distance
|
||||
};
|
||||
}
|
||||
|
||||
getBoundingRect() {
|
||||
if (this.section) {
|
||||
return this.section.getBoundingRect();
|
||||
} else {
|
||||
return super.getBoundingRect();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,63 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
export default class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.zlevel = device.zlevel;
|
||||
this.style = device.style;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
this.lampRect = new Rect({
|
||||
silent: true,
|
||||
zlevel: this.zlevel,
|
||||
z: 6,
|
||||
shape: this.device.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: this.style.Signal.mouseOverStyle.borderLineDash,
|
||||
stroke: this.style.Signal.mouseOverStyle.borderLineColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.nameRect = new Rect({
|
||||
silent: true,
|
||||
zlevel: this.zlevel,
|
||||
z: 5,
|
||||
shape: this.device.sigName.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: this.style.Signal.mouseOverStyle.borderLineDash,
|
||||
stroke: this.style.Signal.mouseOverStyle.borderLineColor,
|
||||
fill: this.style.Signal.mouseOverStyle.nameBackgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.lampRect.hide();
|
||||
this.nameRect.hide();
|
||||
this.add(this.lampRect);
|
||||
this.add(this.nameRect);
|
||||
}
|
||||
|
||||
mouseover(e) {
|
||||
this.nameRect.show();
|
||||
this.lampRect.show();
|
||||
this.device.lamps.forEach(elem => {
|
||||
elem.setBorderColor(this.style.Signal.mouseOverStyle.lampBorderLineColor);
|
||||
});
|
||||
this.device.sigName && this.device.sigName.setColor(this.style.backgroundColor);
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
this.nameRect.hide();
|
||||
this.lampRect.hide();
|
||||
this.device.lamps.forEach(elem => {
|
||||
elem.setBorderColor(this.style.Signal.lamp.borderColor);
|
||||
});
|
||||
this.device.setState(this.device.model);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,77 +0,0 @@
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import { arrow } from '../utils/ShapePoints';
|
||||
|
||||
class ESigPass extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
const rotation = model.drict != 1? 0 : Math.PI;
|
||||
|
||||
this.isNew = true;
|
||||
this.arrow = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
origin: [model.x, model.y],
|
||||
rotation: rotation,
|
||||
shape: {
|
||||
points: arrow(model.x, model.y, style.Signal.auto.width, style.Signal.lamp.radiusR * 0.8)
|
||||
},
|
||||
style: {
|
||||
stroke: model.stroke,
|
||||
lineWidth: model.lineWidth,
|
||||
fill: model.fill
|
||||
}
|
||||
});
|
||||
this.add(this.arrow);
|
||||
}
|
||||
}
|
||||
|
||||
// 停止动画
|
||||
animationRecover() {
|
||||
this.create();
|
||||
this.arrow.stopAnimation(false);
|
||||
}
|
||||
|
||||
// 箭头颜色
|
||||
setColor(color) {
|
||||
this.create();
|
||||
this.arrow.setStyle('fill', color);
|
||||
}
|
||||
|
||||
// 箭头闪烁
|
||||
arrowsAnimation() {
|
||||
this.create();
|
||||
|
||||
const style = this.model.style;
|
||||
const fill = this.arrow.style.fill;
|
||||
|
||||
this.arrow.animateStyle(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();
|
||||
}
|
||||
|
||||
// 隐藏
|
||||
hide() {
|
||||
this.create();
|
||||
this.arrow.hide();
|
||||
}
|
||||
|
||||
// 显示
|
||||
show() {
|
||||
this.create();
|
||||
this.arrow.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigPass;
|
||||
@ -1,113 +0,0 @@
|
||||
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';
|
||||
|
||||
class ESigButton extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
const padding = 1;
|
||||
const r = style.Signal.lamp.radiusR * 0.8;
|
||||
|
||||
this.isNew = true;
|
||||
this.sigNormalButtom = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
_subType: 'SignalButton',
|
||||
_val: '1',
|
||||
shape: {
|
||||
x: model.x - style.Signal.lamp.radiusR,
|
||||
y: model.y - r + r * model.posit,
|
||||
width: style.Signal.lamp.radiusR * 2,
|
||||
height: style.Signal.lamp.radiusR * 2
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.2,
|
||||
stroke: style.Signal.button.borderDashColor,
|
||||
fill: style.Signal.button.buttonColor
|
||||
}
|
||||
});
|
||||
|
||||
this.sigNormalButtomDown = new Polyline({
|
||||
_subType: 'SignalButton',
|
||||
_val: '1',
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
silent: true,
|
||||
shape: { points: [
|
||||
[model.x - padding + r, this.sigNormalButtom.shape.y + padding],
|
||||
[model.x + padding - r, this.sigNormalButtom.shape.y + padding],
|
||||
[model.x + padding - r, this.sigNormalButtom.shape.y + padding * 2 + r]
|
||||
] },
|
||||
style: {
|
||||
lineWidth: 0.8,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.sigReentryButton = new Circle({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
_subType: 'SignalButton',
|
||||
_val: '2', // 折返按钮
|
||||
shape: {
|
||||
cx: model.x,
|
||||
cy: model.y - 5 / 2 * r * model.posit,
|
||||
r: style.Signal.lamp.radiusR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.2,
|
||||
stroke: style.Signal.button.borderDashColor,
|
||||
fill: style.Signal.button.buttonColor
|
||||
}
|
||||
});
|
||||
|
||||
this.sigReentryButtonDown = new Arc({
|
||||
_subType: 'SignalButton',
|
||||
_val: '2', // 折返按钮
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
silent: true,
|
||||
shape: {
|
||||
cx: this.sigReentryButton.shape.cx,
|
||||
cy: this.sigReentryButton.shape.cy,
|
||||
r: this.sigReentryButton.shape.r - padding,
|
||||
startAngle: Math.PI * 8 / 5,
|
||||
endAngle: Math.PI * 4 / 5,
|
||||
clockwise: false
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.8,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.sigNormalButtom);
|
||||
this.add(this.sigReentryButton);
|
||||
this.hide();
|
||||
}
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.sigNormalButtom.hide();
|
||||
this.sigReentryButton.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.sigNormalButtom.show();
|
||||
this.sigReentryButton.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigButton;
|
||||
@ -1,59 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
class ESigDelay extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
|
||||
this.isNew = true;
|
||||
this.name = new Text({
|
||||
_subType: model._subType,
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
silent: model.silent || false,
|
||||
style: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
fontWeight: model.fontWeight,
|
||||
fontSize: model.fontSize,
|
||||
fontFamily: model.fontFamily,
|
||||
text: model.text,
|
||||
textFill: model.textFill,
|
||||
textAlign: model.textAlign,
|
||||
textPosition: model.textPosition || 'inside',
|
||||
textVerticalAlign: model.textVerticalAlign || null
|
||||
}
|
||||
});
|
||||
this.add(this.name);
|
||||
}
|
||||
}
|
||||
|
||||
setStyle(model) {
|
||||
this.create();
|
||||
this.name.setStyle(model);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.create();
|
||||
this.name.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.name.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.name.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigDelay;
|
||||
@ -1,111 +0,0 @@
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
class ESigLamp extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.lamp = new Arc({
|
||||
_subType: 'SignalLamp',
|
||||
_val: '3',
|
||||
name: model.index,
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
cx: model.x,
|
||||
cy: model.y,
|
||||
r: style.Signal.lamp.radiusR
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Signal.lamp.borderWidth,
|
||||
fill: style.backgroundColor,
|
||||
stroke: style.Signal.lamp.borderColor
|
||||
}
|
||||
});
|
||||
|
||||
this.lstop = new Line({
|
||||
_subType: 'SignalLamp',
|
||||
_val: '3',
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
origin: {
|
||||
x: model.originX,
|
||||
y: model.originY
|
||||
},
|
||||
shape: {
|
||||
x1: model.x + (style.Signal.lamp.radiusR + 1) * Math.cos(Math.PI / 4),
|
||||
y1: model.y + (style.Signal.lamp.radiusR + 1) * Math.sin(Math.PI / 4),
|
||||
x2: model.x - (style.Signal.lamp.radiusR + 1) * Math.cos(Math.PI / 4),
|
||||
y2: model.y - (style.Signal.lamp.radiusR + 1) * Math.sin(Math.PI / 4)
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Signal.lamp.stopWidth,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.rstop = new Line({
|
||||
_subType: 'SignalLamp',
|
||||
_val: '3',
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
origin: {
|
||||
x: model.originX,
|
||||
y: model.originY
|
||||
},
|
||||
shape: {
|
||||
x1: model.x + (style.Signal.lamp.radiusR + 1) * Math.cos(Math.PI / 4),
|
||||
y1: model.y + (style.Signal.lamp.radiusR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2)),
|
||||
x2: model.x - (style.Signal.lamp.radiusR + 1) * Math.cos(Math.PI / 4),
|
||||
y2: model.y - (style.Signal.lamp.radiusR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2))
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Signal.lamp.stopWidth,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.lamp);
|
||||
this.add(this.lstop);
|
||||
this.add(this.rstop);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
if (this.model.style.Signal.lamp.borderVariable) {
|
||||
this.lamp.setStyle({ fill: color, stroke: color });
|
||||
} else {
|
||||
this.lamp.setStyle({ fill: color });
|
||||
}
|
||||
}
|
||||
|
||||
setBorderColor(color) {
|
||||
this.lamp.setStyle({stroke: color});
|
||||
}
|
||||
|
||||
setStyle(data) {
|
||||
this.lamp.setStyle(data);
|
||||
}
|
||||
|
||||
setStop(has) {
|
||||
if (has) {
|
||||
this.lstop.show();
|
||||
this.rstop.show();
|
||||
} else {
|
||||
this.lstop.hide();
|
||||
this.rstop.hide();
|
||||
}
|
||||
}
|
||||
|
||||
getBoundingRect() {
|
||||
return this.lamp.getBoundingRect();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigLamp;
|
||||
@ -1,56 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
class ESigName extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
this.name = new Text({
|
||||
_subType: 'SignalLamp',
|
||||
_val: '3',
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
silent: model.silent,
|
||||
style: {
|
||||
textBorderColor: 'red',
|
||||
textBorderWidth: 0,
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
fontWeight: model.fontWeight,
|
||||
fontSize: model.fontSize,
|
||||
fontFamily: model.fontFamily,
|
||||
text: model.text,
|
||||
textFill: model.textFill,
|
||||
textAlign: model.textAlign,
|
||||
textPosition: model.textPosition || 'inside',
|
||||
textVerticalAlign: model.textVerticalAlign || null
|
||||
}
|
||||
});
|
||||
this.add(this.name);
|
||||
}
|
||||
|
||||
setStyle(model) {
|
||||
this.name.setStyle(model);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.name.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
// 隐藏
|
||||
hide() {
|
||||
this.name.hide();
|
||||
}
|
||||
|
||||
// 显示
|
||||
show() {
|
||||
this.name.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigName;
|
||||
@ -1,70 +0,0 @@
|
||||
import Polyline from 'zrender/src/graphic/shape/Polyline';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
class ESigPost extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.ver = new Polyline({
|
||||
_subType: 'SignalLamp',
|
||||
_val: '3',
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: [
|
||||
[model.x, model.y + style.Signal.lamp.radiusR * 1.2],
|
||||
[model.x, model.y - style.Signal.lamp.radiusR * 1.2]
|
||||
]
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Signal.post.standardWidth,
|
||||
stroke: style.Signal.post.standardColor
|
||||
}
|
||||
});
|
||||
|
||||
this.hor = new Polyline({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: [
|
||||
[model.x, model.y],
|
||||
[model.x + model.drict * style.Signal.lamp.radiusR * 1.2, model.y]
|
||||
]
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Signal.post.standardWidth,
|
||||
stroke: style.Signal.post.standardColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.ver);
|
||||
this.add(this.hor);
|
||||
|
||||
model.type === '01' ? this.hor.hide() : this.hor.show();
|
||||
}
|
||||
|
||||
getLampPosition(type) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
if (type === '01') {
|
||||
return {
|
||||
x: model.x + model.drict * style.Signal.lamp.radiusR * 3 / 2,
|
||||
y: model.y
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
x: this.hor.shape.points[1][0] + model.drict * style.Signal.lamp.radiusR,
|
||||
y: this.hor.shape.points[1][1]
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigPost;
|
||||
@ -1,48 +0,0 @@
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import { triangular } from '../utils/ShapePoints';
|
||||
|
||||
class ESigDrict extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.isNew = true;
|
||||
this.sigDrict = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: triangular(model.x, model.y, model.drict, style.Signal.lamp.radiusR)
|
||||
},
|
||||
style: {
|
||||
stroke: style.backgroundColor,
|
||||
lineWidth: 0.5,
|
||||
fill: style.Signal.route.routeColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.sigDrict);
|
||||
}
|
||||
}
|
||||
|
||||
// 隐藏
|
||||
hide() {
|
||||
this.create();
|
||||
this.sigDrict.hide();
|
||||
}
|
||||
|
||||
// 显示
|
||||
show() {
|
||||
this.create();
|
||||
this.sigDrict.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigDrict;
|
||||
@ -1,518 +0,0 @@
|
||||
/*
|
||||
* 信号机
|
||||
*/
|
||||
|
||||
import ESigPost from './ESigPost';
|
||||
import ESigLamp from './ESigLamp';
|
||||
import ESigAuto from './ESigAuto';
|
||||
import ESigRoute from './ESigRoute';
|
||||
import ESigButton from './ESigButton';
|
||||
import ESigDelay from './ESigDelay';
|
||||
import ESigName from './ESigName';
|
||||
import EMouse from './EMouse';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import BoundingRect from 'zrender/src/core/BoundingRect';
|
||||
|
||||
class Signal extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.count = parseInt(model.lampPositionType);
|
||||
this.lamps = new Array(this.count);
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 7;
|
||||
this.create();
|
||||
this.createMouseEvent();
|
||||
this.transformRotation(this);
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
const drict = this.model.directionShowType == '01' ? -1 : 1; // 朝向 左:右
|
||||
const posit = this.model.positionType == '01' ? -1 : 1; // 位置 上:下
|
||||
|
||||
// 信号机高柱矮柱
|
||||
this.sigPost = new ESigPost({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
drict: drict,
|
||||
type: model.lampPostType,
|
||||
x: model.position.x,
|
||||
y: model.position.y + posit * (style.Signal.distance + style.Section.line.width + style.Signal.lamp.radiusR)
|
||||
});
|
||||
|
||||
// 信号灯
|
||||
const endPoint = this.sigPost.getLampPosition(model.lampPostType);
|
||||
this.lamps = [];
|
||||
for (let i = 0; i < this.count; i++) {
|
||||
const lamp = new ESigLamp({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
drict: drict,
|
||||
x: endPoint.x + i * drict * style.Signal.lamp.radiusR * 2,
|
||||
y: endPoint.y,
|
||||
originX: model.position.x,
|
||||
originY: model.position.y
|
||||
});
|
||||
|
||||
this.lamps.push(lamp);
|
||||
}
|
||||
|
||||
// 信号机名称
|
||||
const sigNameX = model.position.x - drict * (style.Signal.post.standardWidth) + model.namePosition.x;
|
||||
const sigNameY = model.position.y + posit * (style.Signal.distance + style.Section.line.width + style.Signal.lamp.radiusR * 2 + model.namePosition.y + style.Signal.text.distance);
|
||||
const textAlign = style.Signal.text.isAlignCenter ? 'middle' : this.model.directionShowType == '01' ? 'right' : 'left';
|
||||
const textVerticalAlign = posit == 1 ? 'top' : 'bottom';
|
||||
this.sigName = new ESigName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
silent: false,
|
||||
isNoRotation: style.Signal.text.isNoRotation,
|
||||
style: style,
|
||||
x: sigNameX,
|
||||
y: sigNameY,
|
||||
text: model.name,
|
||||
fontWeight: style.Signal.text.fontWeight,
|
||||
fontSize: style.Signal.text.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
textFill: style.Signal.text.defaultColor,
|
||||
textAlign: textAlign,
|
||||
textVerticalAlign: textVerticalAlign
|
||||
});
|
||||
|
||||
// 自动进路
|
||||
const sigRouteH = style.Signal.route.direction ? this.count * style.Signal.lamp.radiusR * 2 : -style.Signal.lamp.radiusR * 2;
|
||||
const sigRouteX = endPoint.x + (style.Signal.route.offset.x + sigRouteH) * drict;
|
||||
const sigRouteY = endPoint.y + (style.Signal.route.offset.y);
|
||||
this.sigRoute = new ESigRoute({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
x: sigRouteX,
|
||||
y: sigRouteY,
|
||||
drict: drict
|
||||
});
|
||||
|
||||
// 自动通过
|
||||
const sigAutoH = style.Signal.auto.direction ? this.count * style.Signal.lamp.radiusR * 2 : -style.Signal.lamp.radiusR * 2;
|
||||
const sigAutoX = endPoint.x + (style.Signal.auto.offset.x + sigAutoH) * drict;
|
||||
const sigAutoY = endPoint.y + (style.Signal.auto.offset.y);
|
||||
this.sigAuto = new ESigAuto({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
count: this.count,
|
||||
drict: drict,
|
||||
x: sigAutoX,
|
||||
y: sigAutoY,
|
||||
width: style.Signal.auto.width,
|
||||
fill: style.Signal.auto.autoRoute,
|
||||
lineWidth: 0.6,
|
||||
stroke: style.sidelineColor
|
||||
});
|
||||
|
||||
// 延迟解锁
|
||||
const sigDelayH = style.Signal.delay.direction ? this.count * style.Signal.lamp.radiusR * 2 : -style.Signal.lamp.radiusR * 2;
|
||||
const sigDelayX = endPoint.x + (style.Signal.delay.offset.x + sigDelayH) * drict;
|
||||
const sigDelayY = endPoint.y - (style.Signal.delay.offset.y) * posit;
|
||||
this.sigDelay = new ESigDelay({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
x: sigDelayX,
|
||||
y: sigDelayY,
|
||||
fontWeight: style.Signal.delay.fontWeight,
|
||||
fontSize: style.Signal.delay.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: this.model.delayCount || '0',
|
||||
textFill: style.Signal.delay.fontColor,
|
||||
textAlign: drict > 0 ? 'right' : 'left',
|
||||
textVerticalAlign: 'middle'
|
||||
});
|
||||
|
||||
// 信号灯按钮
|
||||
this.sigButton = new ESigButton({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
posit: posit,
|
||||
show: model.buttonShow,
|
||||
x: model.buttonPosition.x,
|
||||
y: model.buttonPosition.y - posit * (style.Signal.button.distance + style.Signal.lamp.radiusR * 2)
|
||||
});
|
||||
|
||||
this.add(this.sigPost);
|
||||
this.lamps.forEach(lamp => { this.add(lamp); });
|
||||
this.add(this.sigName);
|
||||
|
||||
this.style.Signal.text.show && model.nameShow ? this.sigName.show() : this.sigName.hide();
|
||||
this.add(this.sigAuto);
|
||||
this.add(this.sigRoute);
|
||||
this.add(this.sigDelay);
|
||||
// this.add(this.sigButton);
|
||||
}
|
||||
|
||||
createMouseEvent() {
|
||||
if (this.style.Signal.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
|
||||
// 整体旋转信号灯
|
||||
transformRotation(device) {
|
||||
if (this.model.rotate) {
|
||||
device.eachChild(item => {
|
||||
if (item instanceof Group) {
|
||||
this.transformRotation(item);
|
||||
} else if (item && item.model && item.model.isNoRotation) {
|
||||
item.origin = [this.model.position.x, this.model.position.y];
|
||||
item.rotation = -Math.PI / 180 * Number(this.model.rotate);
|
||||
item.dirty();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 关闭
|
||||
close() {
|
||||
if (this.count == 2 && this.model.lightType == '01') { // 双灯 物理点灯
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(false);
|
||||
this.lamps[1].setColor(this.style.backgroundColor);
|
||||
}
|
||||
} else if (this.count == 2 && this.model.lightType == '02') { // 双灯 逻辑点灯
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(true);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(true);
|
||||
this.lamps[1].setColor(this.style.backgroundColor);
|
||||
}
|
||||
} else if (this.count == 1 && this.model.lightType == '01') { // 单灯 物理点灯
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
if (this.model.useType == '05') {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.blueColor);
|
||||
} else {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
}
|
||||
}
|
||||
} else if (this.count == 1 && this.model.lightType == '02') { // 单灯 逻辑点灯
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(true);
|
||||
if (this.model.useType == '05') {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.blueColor);
|
||||
} else {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
}
|
||||
}
|
||||
} else if (this.count == 1) {
|
||||
if (this.lamps[0]) {
|
||||
if (this.model.useType == '05') {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.blueColor);
|
||||
} else {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* count 1单灯 2双灯 lightType 01物理点灯 02逻辑点灯*/
|
||||
openPositive() {
|
||||
if (this.count == 2 && this.model.lightType == '01') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.greenColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(false);
|
||||
this.lamps[1].setColor(this.style.backgroundColor);
|
||||
}
|
||||
} else if (this.count == 2 && this.model.lightType == '02') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(true);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.greenColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(true);
|
||||
this.lamps[1].setColor(this.style.backgroundColor);
|
||||
}
|
||||
} else if (this.count == 1 && this.model.lightType == '01') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.greenColor);
|
||||
}
|
||||
} else if (this.count == 1 && this.model.lightType == '02') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(true);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.greenColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
/* count 1单灯 2双灯 lightType 01物理点灯 02逻辑点灯*/
|
||||
openLateral() {
|
||||
if (this.count == 2 && this.model.lightType == '01') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
this.lamps[0].setColor(this.style.backgroundColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(false);
|
||||
this.lamps[1].setColor(this.style.Signal.lamp.yellowColor);
|
||||
}
|
||||
} else if (this.count == 2 && this.model.lightType == '02') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(true);
|
||||
this.lamps[0].setColor(this.style.backgroundColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(true);
|
||||
this.lamps[1].setColor(this.style.Signal.lamp.yellowColor);
|
||||
}
|
||||
} else if (this.count == 1 && this.model.lightType == '01') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
// 出站信号机/阻隔信号机
|
||||
if (['02', '06'].includes(this.model.useType)) {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.greenColor);
|
||||
} else {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.whiteColor);
|
||||
}
|
||||
}
|
||||
} else if (this.count == 1 && this.model.lightType == '02') {
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(true);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.greenColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
// 列车进路
|
||||
trainRoute() {
|
||||
if (this.count == 1) {
|
||||
/** 单灯 列兼调信号*/
|
||||
this.lamps[0] && this.lamps[0].setColor(this.style.Signal.lamp.yellowColor);
|
||||
}
|
||||
}
|
||||
|
||||
// 调车进路
|
||||
shuntRoute() {
|
||||
if (this.count == 1) {
|
||||
/** 单灯 列兼调信号*/
|
||||
/** 单灯 阻挡兼调车信号*/
|
||||
this.lamps[0] && this.lamps[0].setColor(this.style.Signal.lamp.whiteColor);
|
||||
}
|
||||
}
|
||||
|
||||
// 引导
|
||||
guid() {
|
||||
if (this.count == 2 && this.model.lightType == '01' && this.style.Signal.lamp.guidName != 'chengdu_03') { // 双灯 物理点灯 允许引导信号
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(false);
|
||||
this.lamps[1].setColor(this.style.Signal.lamp.yellowColor);
|
||||
}
|
||||
} else if (this.count == 1 && this.model.lightType == '01' && this.style.Signal.lamp.guidName == 'chengdu_03') {
|
||||
this.lamps[0].setStop(false);
|
||||
this.lamps[0].setStyle({ fill: this.style.Signal.lamp.yellowColor, stroke: this.style.Signal.lamp.redColor, lineWidth: 2.5 });
|
||||
}
|
||||
}
|
||||
|
||||
// 封锁
|
||||
block() {
|
||||
if (this.count == 1) {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
// this.siglamp.setNameBorder(1)
|
||||
}
|
||||
this.sigName.setColor(this.style.Signal.text.blockColor);
|
||||
if (this.style.Signal.text.nameBorderShow) {
|
||||
this.sigName.setStyle({textBorderWidth: 1});
|
||||
this.sigName.setColor('#fff');
|
||||
}
|
||||
}
|
||||
|
||||
// 功能封锁
|
||||
functionBlock() {
|
||||
if (this.count == 1) {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
// this.siglamp.setRectBlockByIndex(1, true);
|
||||
}
|
||||
}
|
||||
|
||||
// 信号保护区段监视状态显示
|
||||
signalCheck() {
|
||||
if (this.count == 1) {
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.redColor);
|
||||
this.sigName.setColor(this.style.Signal.text.checkColor);
|
||||
}
|
||||
}
|
||||
|
||||
// 故障
|
||||
fault() {
|
||||
if (this.count == 2 && this.model.lightType == '01') { // 双灯 物理点灯
|
||||
if (this.lamps[0]) {
|
||||
this.lamps[0].setStop(false);
|
||||
this.lamps[0].setColor(this.style.Signal.lamp.blueColor);
|
||||
}
|
||||
if (this.lamps[1]) {
|
||||
this.lamps[1].setStop(false);
|
||||
this.lamps[1].setColor(this.style.Signal.lamp.blueColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 物理点灯
|
||||
logicalLight() {
|
||||
this.lamps.forEach(lamp => { lamp.setStop(false); });
|
||||
}
|
||||
|
||||
// 逻辑点灯
|
||||
physicsLight() {
|
||||
this.lamps.forEach(lamp => { lamp.setStop(true); });
|
||||
}
|
||||
|
||||
// 设置自动进路模式状态类型
|
||||
setAutoRouteOpen() {
|
||||
this.sigAuto.setColor(this.style.Signal.auto.autoRoute);
|
||||
if (this.model.linkageAutoRouteShow) {
|
||||
this.sigAuto.show();
|
||||
} else {
|
||||
this.sigAuto.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// 信号机进路自动触发模式状态类型
|
||||
setAutoTriggerOpen() {
|
||||
this.sigAuto.setColor(this.style.Signal.auto.autoTrigger);
|
||||
if (this.model.atsAutoTriggerShow) {
|
||||
this.sigAuto.show();
|
||||
} else {
|
||||
this.sigAuto.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// 设置自动信号模式状态类型
|
||||
setAutoSignalOpen() {
|
||||
this.sigRoute.show();
|
||||
}
|
||||
|
||||
// 隐藏自动信号和自动进路
|
||||
setAutoClose() {
|
||||
this.sigAuto.hide();
|
||||
this.sigAuto.setColor(this.style.backgroundColor);
|
||||
this.sigRoute.hide();
|
||||
}
|
||||
|
||||
// 自动信号和自动进路开始动画
|
||||
setAutoFlicker() {
|
||||
this.sigAuto.arrowsAnimation();
|
||||
}
|
||||
|
||||
// 设置延时解锁
|
||||
setDelayUnlock() {
|
||||
this.sigDelay.show();
|
||||
}
|
||||
|
||||
// 恢复状态
|
||||
recover() {
|
||||
this.sigName.setStyle({textBorderWidth: 0});
|
||||
this.sigAuto.hide();
|
||||
this.sigRoute.hide();
|
||||
this.sigDelay.hide();
|
||||
this.sigAuto.animationRecover();
|
||||
this.sigName.setColor(this.style.Signal.text.defaultColor);
|
||||
if (this.style.Signal.lamp.guidName == 'chengdu_03') {
|
||||
this.lamps[0].setStyle({ lineWidth: this.style.Signal.lamp.borderWidth });
|
||||
}
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
this.recover();
|
||||
/** 设置状态 (点灯类型)*/
|
||||
switch (model.status) {
|
||||
case '01': this.close(); break; // 关闭
|
||||
case '02': this.openPositive(); break; // 开放正向
|
||||
case '03': this.openLateral(); break; // 开放侧向
|
||||
case '04': this.guid(); break; // 引导
|
||||
case '05': this.block(); break; // 封锁
|
||||
case '06': this.fault(); break; // 故障
|
||||
case '07': this.block(); break; // 功能封锁
|
||||
case '08': this.signalCheck(); break; // 信号保护区段检测
|
||||
}
|
||||
|
||||
/** 进路性质类型*/
|
||||
switch (model.natureType) {
|
||||
case '01': this.trainRoute(); break; // 列车进路
|
||||
case '02': this.shuntRoute(); break; // 调车进路
|
||||
}
|
||||
|
||||
/** 设置点灯类型*/
|
||||
switch (model.lightType) {
|
||||
case '01': this.logicalLight(); break; // 设置逻辑点灯
|
||||
case '02': this.physicsLight(); break; // 设置物理点灯
|
||||
}
|
||||
|
||||
/** 设置自动类型*/
|
||||
switch (model.autoType) {
|
||||
case '01': this.setAutoClose(); break; // 隐藏 隐藏自动信号和自动进路
|
||||
case '02': this.setAutoSignalOpen(); break; // 显示 设置自动信号模式状态类型
|
||||
case '03': this.setAutoRouteOpen(); break; // 显示 设置自动进路模式状态类型
|
||||
case '04': this.setAutoTriggerOpen(); break; // 显示 信号机进路自动触发模式状态类型
|
||||
}
|
||||
|
||||
/** 延时解锁*/
|
||||
switch (model.delayType) {
|
||||
case '01': break; // 未延时解锁
|
||||
case '02': this.setDelayUnlock(); break; // 人工闭塞延时解锁
|
||||
case '03': this.setDelayUnlock(); break; // 自动闭塞延时解锁
|
||||
}
|
||||
|
||||
/** 信号机进路办理，先停止动画，再判断当前颜色是否闪烁*/
|
||||
if (model.routeSetting && (model.autoType == '03' || model.autoType == '04')) {
|
||||
this.setAutoFlicker();
|
||||
}
|
||||
}
|
||||
|
||||
getBoundingRect() {
|
||||
const rect = this.sigPost.getBoundingRect();
|
||||
this.lamps.forEach(elem => {
|
||||
rect.union(elem.getBoundingRect());
|
||||
});
|
||||
return rect;
|
||||
}
|
||||
|
||||
getShapeTipPoint(opts) {
|
||||
var rect = new BoundingRect(0, 0, 0, 0);
|
||||
var drict = this.model.directionShowType == '01' ? -1 : 1; // 朝向 左:右
|
||||
var offsetY = this.model.positionType == '01' ? this.style.Signal.text.fontSize : 0; // 位置 上:下
|
||||
if (opts.val == '1' || opts.val == '2') {
|
||||
rect = this.sigButton.getBoundingRect();
|
||||
} else {
|
||||
rect = this.sigPost.getBoundingRect();
|
||||
}
|
||||
|
||||
return {
|
||||
x: rect.x + drict * this.style.Signal.post.standardWidth,
|
||||
y: rect.y - offsetY
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export default Signal;
|
||||
@ -1,75 +0,0 @@
|
||||
/*
|
||||
* 车站
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import ETextName from '../element/ETextName'; // 名称文字 (共有)
|
||||
|
||||
export default class Station extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 40;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
if (model.visible) {
|
||||
// 公里标名称是否显示
|
||||
this.stationText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
fontWeight: model.fontWeight,
|
||||
fontSize: model.nameFont || 18,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFill: model.nameFontColor
|
||||
});
|
||||
this.add(this.stationText);
|
||||
const path = window.location.href;
|
||||
if (style.Station.kmPostShow || path.includes('/map/draw')) {
|
||||
// 公里标是否显示
|
||||
let direction = 1;
|
||||
if (this.style.Station.kilometerPosition == 'up') {
|
||||
direction = -1;
|
||||
}
|
||||
this.mileageText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
x: model.position.x,
|
||||
y: model.position.y + ((parseInt(model.nameFont) + 2) * direction),
|
||||
fontWeight: model.fontWeight,
|
||||
fontSize: model.kmPostFont || 18,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.kmPost,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFill: model.kmPostFontColor
|
||||
});
|
||||
this.add(this.mileageText);
|
||||
model.kmPostShow ? this.mileageText.show() : this.mileageText.hide();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
setState(model) {
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,52 +0,0 @@
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
class ESigAuto extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
|
||||
this.arrow = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: model.point
|
||||
},
|
||||
style: {
|
||||
stroke: model.stroke,
|
||||
lineWidth: model.lineWidth,
|
||||
fill: model.fill
|
||||
}
|
||||
});
|
||||
this.add(this.arrow);
|
||||
}
|
||||
|
||||
// 停止动画
|
||||
animationRecover() {
|
||||
this.arrow.stopAnimation(false);
|
||||
}
|
||||
|
||||
// 箭头颜色
|
||||
setColor(color) {
|
||||
this.arrow.setStyle('fill', color);
|
||||
}
|
||||
|
||||
// 箭头闪烁
|
||||
arrowsAnimation() {
|
||||
const style = this.model.style;
|
||||
const fill = this.arrow.style.Signal.fill;
|
||||
this.arrow.animateStyle(true)
|
||||
.when(1000, { fill: style.backgroundColor, stroke: style.backgroundColor })
|
||||
.when(2000, { fill: fill, stroke: style.Signal.sidelineColor })
|
||||
.when(3000, { fill: style.backgroundColor, stroke: style.backgroundColor })
|
||||
.when(4000, { fill: fill, stroke: style.Signal.sidelineColor })
|
||||
.start();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESigAuto;
|
||||
@ -1,62 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
export default class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
this.text = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z + 1,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: this.device.model.position.x - this.device.style.StationControl.lamp.distance / 2 + this.device.style.StationControl.lamp.offset.x,
|
||||
y: this.device.model.position.y + this.device.style.StationControl.lamp.offset.y + this.device.style.StationControl.lamp.radiusR + this.device.style.StationControl.text.distance - 40,
|
||||
fontWeight: this.device.style.StationControl.mouseOverStyle.fontWeight,
|
||||
fontSize: this.device.style.StationControl.mouseOverStyle.fontSize,
|
||||
fontFamily: this.device.style.StationControl.mouseOverStyle.fontFormat,
|
||||
text: '',
|
||||
textFill: this.device.style.StationControl.mouseOverStyle.fontColor,
|
||||
textAlign: this.device.style.StationControl.mouseOverStyle.textAlign,
|
||||
textVerticalAlign: this.device.style.StationControl.mouseOverStyle.textVerticalAlign
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.text);
|
||||
this.text.hide();
|
||||
}
|
||||
setTextContext(text) {
|
||||
if (text) {
|
||||
this.text.setStyle('text', text);
|
||||
}
|
||||
}
|
||||
mouseover(e) {
|
||||
if (e.target) {
|
||||
let name = '';
|
||||
switch (e.target.parent._subType) {
|
||||
case 'emergency':
|
||||
name = '紧急站控';
|
||||
break;
|
||||
case 'center':
|
||||
name = '中控';
|
||||
break;
|
||||
case 'substation':
|
||||
name = '站控';
|
||||
break;
|
||||
}
|
||||
// debugger;
|
||||
this.setTextContext(name);
|
||||
this.text.show();
|
||||
}
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
this.text.hide();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,73 +0,0 @@
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
/** 单个控制灯*/
|
||||
export default class ESingleControl extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this._subType = model._subType;
|
||||
this.z = 20;
|
||||
this.onmouseover = model.mouseover;
|
||||
this.onmouseout = model.mouseout;
|
||||
this.create(model);
|
||||
}
|
||||
|
||||
create(model) {
|
||||
var _subType = 'ControlSignal';
|
||||
var _val = '0';
|
||||
if (model.pop) {
|
||||
_subType = 'ControlButton';
|
||||
_val = '1';
|
||||
}
|
||||
var _nameType = this._subType;
|
||||
this.control = new Arc({
|
||||
pop: model.pop,
|
||||
_subType: _subType,
|
||||
_nameType: _nameType,
|
||||
_val: _val,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
cx: model.point.x,
|
||||
cy: model.point.y,
|
||||
r: model.style.StationControl.lamp.radiusR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.5,
|
||||
fill: model.style.StationControl.lamp.grayColor,
|
||||
stroke: model.style.StationControl.lamp.grayColor
|
||||
}
|
||||
});
|
||||
|
||||
this.text = new Text({
|
||||
pop: model.pop,
|
||||
_subType: _subType,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.point.x,
|
||||
y: model.point.y + model.style.StationControl.lamp.radiusR + model.style.StationControl.text.distance,
|
||||
fontWeight: model.style.StationControl.text.fontWeight,
|
||||
fontSize: model.style.StationControl.text.fontSize,
|
||||
fontFamily: model.style.StationControl.text.fontFormat,
|
||||
text: model.context,
|
||||
textFill: model.style.StationControl.text.fontColor,
|
||||
textAlign: model.style.StationControl.text.textAlign,
|
||||
textVerticalAlign: model.style.StationControl.text.textVerticalAlign
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
this.add(this.text);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
if (color) {
|
||||
this.control.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,166 +0,0 @@
|
||||
/*
|
||||
* 控制模式
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import ESingleControl from './ESingleControl'; // 单个信号灯 (私有)
|
||||
import EArrow from './EArrow';
|
||||
import { arrow } from '../utils/ShapePoints';
|
||||
import EMouse from './EMouse';
|
||||
|
||||
/** 控制模式*/
|
||||
export default class StationControl extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this.selected = false;
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 1;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create();
|
||||
this.createMouseEvent();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
// 紧急站控
|
||||
if (this.style.StationControl.lamp.emergencyControlShow) {
|
||||
this.emergencyControl = new ESingleControl({
|
||||
_subType: 'emergency',
|
||||
style: this.style,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
point: {
|
||||
x: model.position.x - this.style.StationControl.lamp.distance * 3 / 2 + this.style.StationControl.lamp.offset.x,
|
||||
y: model.position.y + this.style.StationControl.lamp.offset.y
|
||||
},
|
||||
context: model.jjzkContent,
|
||||
pop: false
|
||||
});
|
||||
this.add(this.emergencyControl);
|
||||
}
|
||||
// 中控按钮
|
||||
if (this.style.StationControl.lamp.centerControlShow) {
|
||||
this.centerControl = new ESingleControl({
|
||||
_subType: 'center',
|
||||
style: this.style,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
point: {
|
||||
x: model.position.x - this.style.StationControl.lamp.distance / 2 + this.style.StationControl.lamp.offset.x,
|
||||
y: model.position.y + this.style.StationControl.lamp.offset.y
|
||||
},
|
||||
context: model.zokContent,
|
||||
pop: false
|
||||
});
|
||||
this.add(this.centerControl);
|
||||
}
|
||||
// 站控按钮
|
||||
if (this.style.StationControl.lamp.substationControlShow) {
|
||||
this.substationControl = new ESingleControl({
|
||||
_subType: 'substation',
|
||||
style: this.style,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
point: {
|
||||
x: model.position.x + this.style.StationControl.lamp.distance / 2 + this.style.StationControl.lamp.offset.x,
|
||||
y: model.position.y + this.style.StationControl.lamp.offset.y
|
||||
},
|
||||
context: model.zakContent,
|
||||
pop: false
|
||||
});
|
||||
this.add(this.substationControl);
|
||||
}
|
||||
// 联锁控
|
||||
if (this.style.StationControl.lamp.interconnectedControlShow) {
|
||||
this.interconnectedControl = new ESingleControl({
|
||||
_subType: 'interconnected',
|
||||
style: this.style,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
point: {
|
||||
x: model.position.x + this.style.StationControl.lamp.distance * 3 / 2 + this.style.StationControl.lamp.offset.x,
|
||||
y: model.position.y + this.style.StationControl.lamp.offset.y
|
||||
},
|
||||
context: model.lskContent || '联锁控',
|
||||
pop: false
|
||||
});
|
||||
this.add(this.interconnectedControl);
|
||||
}
|
||||
// 箭头
|
||||
if (this.style.StationControl.arrow.show) {
|
||||
const point = arrow(this.model.position.x, this.model.position.y + this.style.StationControl.lamp.radiusR / 2, this.style.StationControl.lamp.distance / 6, this.style.StationControl.lamp.radiusR * 0.8);
|
||||
this.arrowsControl = new EArrow({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: this.style,
|
||||
count: this.count,
|
||||
drict: 1,
|
||||
point: point,
|
||||
x: model.position.x + this.style.StationControl.lamp.offset.x,
|
||||
y: model.position.y + this.style.StationControl.lamp.radiusR / 2 + this.style.StationControl.lamp.offset.y,
|
||||
fill: this.style.StationControl.lamp.grayColor,
|
||||
lineWidth: 1,
|
||||
stroke: this.style.sidelineColor
|
||||
});
|
||||
this.add(this.arrowsControl);
|
||||
}
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(model) {
|
||||
switch (model.status) {
|
||||
case '00': // 无状态
|
||||
this.emergencyControl && this.emergencyControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
this.substationControl && this.substationControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
this.centerControl && this.centerControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
break;
|
||||
case '01': // 中控
|
||||
this.emergencyControl && this.emergencyControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
this.substationControl && this.substationControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
this.centerControl && this.centerControl.setColor(this.style.StationControl.lamp.greenColor);
|
||||
break;
|
||||
case '02': // 站控
|
||||
this.emergencyControl && this.emergencyControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
this.substationControl && this.substationControl.setColor(this.style.StationControl.lamp.yellowColor);
|
||||
this.centerControl && this.centerControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
break;
|
||||
case '03': // 紧急站控
|
||||
this.emergencyControl && this.emergencyControl.setColor(this.style.StationControl.lamp.redColor);
|
||||
this.substationControl && this.substationControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
this.centerControl && this.centerControl.setColor(this.style.StationControl.lamp.grayColor);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/** 按钮是否按下*/
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
createMouseEvent() {
|
||||
if (this.style.ZcControl.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
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;
|
||||
}
|
||||
}
|
||||
@ -1,90 +0,0 @@
|
||||
/*
|
||||
* 计数器
|
||||
*/
|
||||
import Polyline from 'zrender/src/graphic/shape/Polyline';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
export default class StationCounter extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 30;
|
||||
this.create();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
this.counter = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
fontWeight: 'normal',
|
||||
fontSize: style.textFontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.val,
|
||||
textFill: style.StationCounter.text.fontColor,
|
||||
textAlign: 'middle',
|
||||
textStrokeWidth: 1
|
||||
}
|
||||
});
|
||||
|
||||
this.rect = this.counter.getBoundingRect();
|
||||
|
||||
this.vPadding = 0;
|
||||
this.lPadding = 2;
|
||||
this.table = new Polyline({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
points: [
|
||||
[this.rect.x - this.lPadding, this.rect.y - this.vPadding],
|
||||
[this.rect.x + this.lPadding + this.rect.width, this.rect.y - this.vPadding],
|
||||
[this.rect.x + this.lPadding + this.rect.width, this.rect.y + this.vPadding + this.rect.height],
|
||||
[this.rect.x - this.lPadding, this.rect.y + this.vPadding + this.rect.height],
|
||||
[this.rect.x - this.lPadding, this.rect.y - this.vPadding]]
|
||||
},
|
||||
style: {
|
||||
stroke: style.StationCounter.text.borderColor
|
||||
}
|
||||
});
|
||||
|
||||
this.counterName = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.rect.width + this.vPadding + style.textFontSize + style.StationCounter.text.distance,
|
||||
fontWeight: 'bold',
|
||||
fontSize: style.textFontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: style.StationCounter.text.fontColor,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textStrokeWidth: 1
|
||||
}
|
||||
});
|
||||
this.add(this.counterName);
|
||||
this.add(this.table);
|
||||
this.add(this.counter);
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,107 +0,0 @@
|
||||
/*
|
||||
* 延迟解锁
|
||||
*/
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
export default class StationDelayUnlock extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 1;
|
||||
this.create();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
this.text = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
fontWeight: 'normal',
|
||||
fontSize: model.textFont,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.deviceName + ' ',
|
||||
textFill: style.StationDelayUnlock.text.fontColor,
|
||||
textStrokeWidth: 1,
|
||||
textAlign: 'left'
|
||||
}
|
||||
});
|
||||
|
||||
const fontSize = parseInt(model.textFont.split(' ')[0]) || 30;
|
||||
this.time = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + fontSize + style.StationDelayUnlock.text.distance,
|
||||
fontWeight: 'normal',
|
||||
fontSize: model.textFont,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.remainTime || '',
|
||||
textFill: style.StationDelayUnlock.text.fontColor,
|
||||
textStrokeWidth: 1,
|
||||
textAlign: 'left'
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
this.add(this.time);
|
||||
|
||||
this.lPadding = 3;
|
||||
this.vPadding = 3;
|
||||
this.rect = this.getBoundingRect();
|
||||
if (this.rect.width < 35) this.rect.width = 35;
|
||||
if (this.rect.height < 20) this.rect.height = 20;
|
||||
|
||||
this.table = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z - 1,
|
||||
shape: {
|
||||
x: model.position.x - this.lPadding,
|
||||
y: model.position.y - this.vPadding,
|
||||
width: this.rect.width + this.lPadding * 2,
|
||||
height: this.rect.height + this.vPadding * 2
|
||||
},
|
||||
style: {
|
||||
stroke: style.StationDelayUnlock.text.borderColor,
|
||||
fill: style.backgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.table);
|
||||
}
|
||||
|
||||
/** 延时解锁关闭*/
|
||||
delayClose() {
|
||||
this.time.setStyle('text', '');
|
||||
this.text.setStyle('text', '');
|
||||
this.table.setStyle('stroke', this.style.backgroundColor);
|
||||
}
|
||||
|
||||
/** 延时解锁计数*/
|
||||
delayUnlock() {
|
||||
this.table.setStyle('stroke', this.style.sidelineColor);
|
||||
this.time.setStyle('text', '' + this.model.remainTime);
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
switch (model.status) {
|
||||
case '01': this.delayClose(); break; // 关闭
|
||||
case '02': this.delayUnlock(); break; // 延迟解锁
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,53 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
class EDetain extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.isNew = true;
|
||||
this.detain = new Text({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
text: style.StationStand.detainCar.text,
|
||||
textAlign: model.textAlign,
|
||||
textVerticalAlign: model.textVerticalAlign,
|
||||
fontSize: `${style.StationStand.stand.headFontSize} px ${style.fontFamily}`,
|
||||
textFill: style.StationStand.detainCar.centerTrainColor,
|
||||
textStroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.detain);
|
||||
}
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.create();
|
||||
this.detain.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.detain.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.detain.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default EDetain;
|
||||
@ -1,87 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
|
||||
class EJump extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
this.create();
|
||||
this.setStatus(model.jumpStopStatus);
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.isNew = true;
|
||||
this.jump = new Text({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
style: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
fontWeight: 'normal',
|
||||
fontSize: style.StationStand.common.textFontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: style.StationStand.jump.text,
|
||||
textFill: style.StationStand.jump.textColor,
|
||||
textAlign: model.textAlign,
|
||||
textVerticalAlign: model.textVerticalAlign
|
||||
}
|
||||
});
|
||||
this.jumpArc = new Arc({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
cx: model.cx,
|
||||
cy: model.cy,
|
||||
r: style.StationStand.jump.r
|
||||
},
|
||||
style: {
|
||||
stroke: style.StationStand.jump.arcColor,
|
||||
fill: style.StationStand.jump.fillColor
|
||||
}
|
||||
});
|
||||
this.add(this.jumpArc);
|
||||
this.add(this.jump);
|
||||
this.jumpArc.hide();
|
||||
}
|
||||
}
|
||||
|
||||
setName(val) {
|
||||
this.create();
|
||||
this.jump.setStyle('text', val);
|
||||
}
|
||||
setStatus(val) {
|
||||
switch (val) {
|
||||
case '03':
|
||||
this.jumpArc.show();
|
||||
break;
|
||||
case '02':
|
||||
this.jumpArc.hide();
|
||||
break;
|
||||
case '01':
|
||||
this.jumpArc.hide();
|
||||
break;
|
||||
}
|
||||
}
|
||||
setColor(color) {
|
||||
this.create();
|
||||
this.jump.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.jump.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.jump.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default EJump;
|
||||
@ -1,57 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
class ELevel extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.isNew = true;
|
||||
this.level = new Text({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
style: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
fontWeight: 'normal',
|
||||
fontSize: style.StationStand.common.textFontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: style.StationStand.level.textColor,
|
||||
textAlign: 'middle'
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.level);
|
||||
}
|
||||
}
|
||||
|
||||
setName(val) {
|
||||
this.create();
|
||||
this.level.setStyle('text', val);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.create();
|
||||
this.level.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.level.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.level.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ELevel;
|
||||
@ -1,38 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
export default class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.zlevel = device.zlevel;
|
||||
this.style = device.style;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
this.border = new Rect({
|
||||
silent: true,
|
||||
zlevel: this.zlevel,
|
||||
z: 0,
|
||||
shape: this.device.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: this.style.StationStand.mouseOverStyle.borderLineDash,
|
||||
stroke: this.style.StationStand.mouseOverStyle.borderLineColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
this.border.hide();
|
||||
this.add(this.border);
|
||||
}
|
||||
|
||||
mouseover(e) {
|
||||
this.border.show();
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
this.border.hide();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,49 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import { flashlight } from '../utils/ShapePoints.js';
|
||||
|
||||
class EReentry extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
|
||||
this.isNew = true;
|
||||
this.reentry = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: flashlight(model.x, model.y, model.drict, 10, 5, 0, 0, 4)
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.lineWidth,
|
||||
fill: model.fill
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.reentry);
|
||||
}
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.create();
|
||||
this.reentry.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.reentry.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.reentry.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default EReentry;
|
||||
@ -1,80 +0,0 @@
|
||||
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.safetyDoor.defaultColor,
|
||||
fill: style.StationStand.safetyDoor.defaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.safeC = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
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.safetyDoor.defaultColor,
|
||||
fill: style.StationStand.safetyDoor.defaultColor
|
||||
}
|
||||
});
|
||||
|
||||
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.safetyDoor.defaultColor,
|
||||
fill: style.StationStand.safetyDoor.defaultColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.safeL);
|
||||
this.add(this.safeC);
|
||||
this.add(this.safeR);
|
||||
}
|
||||
|
||||
hasDoor(show) {
|
||||
show ? this.safeC.hide() : this.safeC.show();
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.safeL.setStyle('fill', color);
|
||||
this.safeC.setStyle('fill', color);
|
||||
this.safeR.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
|
||||
export default ESafeDoor;
|
||||
@ -1,48 +0,0 @@
|
||||
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.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.isNew = true;
|
||||
this.emergent = new Isogon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
r: model.r,
|
||||
n: model.n
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: style.StationStand.standEmergent.closeColor,
|
||||
fill: style.StationStand.standEmergent.closeColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.emergent);
|
||||
}
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.emergent.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.emergent.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESafeEmergent;
|
||||
@ -1,39 +0,0 @@
|
||||
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.stand.spareColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.stand);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.stand.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
|
||||
export default ESafeStand;
|
||||
@ -1,57 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
class ETime extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.isNew = false;
|
||||
}
|
||||
|
||||
create() {
|
||||
if (!this.isNew) {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.isNew = true;
|
||||
this.time = new Text({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
style: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
fontWeight: 'normal',
|
||||
fontSize: style.StationStand.common.textFontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: style.StationStand.stopTime.textColor,
|
||||
textAlign: 'middle'
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.time);
|
||||
}
|
||||
}
|
||||
|
||||
setName(val) {
|
||||
this.create();
|
||||
this.time.setStyle('text', val);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.create();
|
||||
this.time.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.create();
|
||||
this.time.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.create();
|
||||
this.time.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ETime;
|
||||
@ -1,417 +0,0 @@
|
||||
/**/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import ETime from './ETime';
|
||||
import ELevel from './ELevel';
|
||||
import EReentry from './EReentry';
|
||||
import EDetain from './EDetain';
|
||||
import ESafeDoor from './ESafeDoor';
|
||||
import ESafeStand from './ESafeStand';
|
||||
import ESafeEmergent from './ESafeEmergent';
|
||||
import EMouse from './EMouse';
|
||||
import EJump from './EJump';
|
||||
|
||||
class StationStand extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 1;
|
||||
this.doors = new Group();
|
||||
this.create();
|
||||
this.createMouseEvent();
|
||||
this.setVisible(model.visible);
|
||||
this.setState(model);
|
||||
}
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
const drict = model.doorLocationType == '01' ? 1 : -1;
|
||||
|
||||
/** 列车站台*/
|
||||
const standH = drict > 0 ? style.StationStand.safetyDoor.height : model.height;
|
||||
const standX = model.position.x - model.width / 2;
|
||||
const standY = model.position.y + drict * (style.StationStand.safetyDoor.distance + standH);
|
||||
this.safeStand = new ESafeStand({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
x: standX,
|
||||
y: standY,
|
||||
width: model.width,
|
||||
height: model.height
|
||||
});
|
||||
this.add(this.safeStand);
|
||||
|
||||
if (model.direction != '03') {
|
||||
/** 屏蔽门*/
|
||||
this.safeDoor = new ESafeDoor({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
width: model.width,
|
||||
height: style.StationStand.safetyDoor.height,
|
||||
show: model.hasDoor
|
||||
});
|
||||
|
||||
/** 站台紧急关闭*/
|
||||
const emergentH = drict > 0 ? style.StationStand.standEmergent.mergentR + style.StationStand.safetyDoor.height : style.StationStand.standEmergent.mergentR;
|
||||
const emergentX = model.position.x + drict * (style.StationStand.standEmergent.offset.x);
|
||||
const emergentY = model.position.y + drict * (style.StationStand.standEmergent.offset.y + emergentH);
|
||||
this.emergent = new ESafeEmergent({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
style: style,
|
||||
x: emergentX,
|
||||
y: emergentY,
|
||||
r: style.StationStand.standEmergent.mergentR,
|
||||
n: 4
|
||||
});
|
||||
|
||||
/** 站台折返策略*/
|
||||
const reentryD = style.StationStand.reentry.position ? model.height + 6 : -style.StationStand.safetyDoor.distance - style.StationStand.safetyDoor.height;
|
||||
const reentryH = drict > 0 ? style.StationStand.standEmergent.mergentR : style.StationStand.standEmergent.mergentR + style.StationStand.safetyDoor.distance + reentryD;
|
||||
const reentryX = model.position.x - (style.StationStand.reentry.position || drict) * (style.StationStand.reentry.offset.x - model.width / 2);
|
||||
const reentryY = model.position.y + (style.StationStand.reentry.position || drict) * (style.StationStand.reentry.offset.y) + drict * reentryH;
|
||||
this.reentry = new EReentry({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
style: style,
|
||||
drict: drict,
|
||||
x: reentryX,
|
||||
y: reentryY,
|
||||
lineWidth: 0,
|
||||
fill: style.StationStand.reentry.noHumanColor
|
||||
});
|
||||
|
||||
const distance = style.StationStand.safetyDoor.height * 2 - style.StationStand.stand.headFontSize / 2 - 2;
|
||||
|
||||
/** 站台扣车*/
|
||||
const detainD = style.StationStand.detainCar.position ? model.height - distance : -style.StationStand.safetyDoor.height;
|
||||
const detainH = drict > 0 ? style.StationStand.standEmergent.mergentR : style.StationStand.standEmergent.mergentR + style.StationStand.safetyDoor.distance + detainD;
|
||||
const detainX = model.position.x - (style.StationStand.detainCar.position || drict) * (style.StationStand.detainCar.offset.x - model.width / 2);
|
||||
const detainY = model.position.y + (style.StationStand.detainCar.position || drict) * (style.StationStand.detainCar.offset.y) + drict * detainH;
|
||||
this.detain = new EDetain({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
x: detainX,
|
||||
y: detainY,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
});
|
||||
|
||||
/** 停站时间*/
|
||||
const timeD = style.StationStand.stopTime.position ? model.height - distance : -style.StationStand.safetyDoor.height;
|
||||
const timeH = drict > 0 ? style.StationStand.standEmergent.mergentR : style.StationStand.standEmergent.mergentR + style.StationStand.safetyDoor.distance + timeD;
|
||||
const timeX = model.position.x - (style.StationStand.stopTime.position || drict) * (style.StationStand.stopTime.offset.x - model.width / 2);
|
||||
const timeY = model.position.y + (style.StationStand.stopTime.position || drict) * (style.StationStand.stopTime.offset.y) + drict * timeH;
|
||||
this.time = new ETime({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
style: style,
|
||||
x: timeX,
|
||||
y: timeY,
|
||||
name: model.parkingTime || '30'
|
||||
});
|
||||
|
||||
/** 运行等级*/
|
||||
const levelD = style.StationStand.level.position ? model.height - distance : -style.StationStand.safetyDoor.height;
|
||||
const levelH = drict > 0 ? style.StationStand.standEmergent.mergentR : style.StationStand.standEmergent.mergentR + style.StationStand.safetyDoor.distance + levelD;
|
||||
const levelX = model.position.x - (style.StationStand.level.position || drict) * (style.StationStand.level.offset.x - model.width / 2);
|
||||
const levelY = model.position.y + (style.StationStand.level.position || drict) * (style.StationStand.level.offset.y) + drict * levelH;
|
||||
this.level = new ELevel({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
style: style,
|
||||
x: levelX,
|
||||
y: levelY,
|
||||
name: model.intervalRunTime || '5'
|
||||
});
|
||||
|
||||
/** 列车停跳 */
|
||||
if (style.StationStand.common.haveJumpShow) {
|
||||
const jumpD = style.StationStand.jump.position ? model.height - distance : -style.StationStand.safetyDoor.height;
|
||||
const jumpH = drict > 0 ? style.StationStand.standEmergent.mergentR : style.StationStand.standEmergent.mergentR + style.StationStand.safetyDoor.distance + jumpD;
|
||||
const jumpX = model.position.x - (style.StationStand.jump.position || drict) * (style.StationStand.jump.offset.x - model.width / 2);
|
||||
const jumpY = model.position.y + (style.StationStand.jump.position || drict) * (style.StationStand.jump.offset.y) + drict * jumpH;
|
||||
const jumpCX = model.position.x - (style.StationStand.jump.position || drict) * (style.StationStand.jump.offset.x - model.width / 2);
|
||||
const jumpCY = model.position.y + (style.StationStand.jump.position || drict) * (style.StationStand.jump.offset.y - style.StationStand.common.textFontSize / 2) + drict * jumpH;
|
||||
this.jump = new EJump({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
style: style,
|
||||
x: jumpX,
|
||||
y: jumpY,
|
||||
cx: jumpCX,
|
||||
cy: jumpCY,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
jumpStopStatus: model.jumpStopStatus
|
||||
});
|
||||
this.add(this.jump);
|
||||
}
|
||||
|
||||
this.add(this.safeDoor);
|
||||
this.add(this.emergent);
|
||||
this.add(this.detain);
|
||||
this.add(this.reentry);
|
||||
this.add(this.time);
|
||||
this.add(this.level);
|
||||
}
|
||||
}
|
||||
|
||||
createMouseEvent() {
|
||||
if (this.style.StationStand.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
|
||||
setVisible(visible) {
|
||||
if (visible) {
|
||||
this.eachChild(elem => { elem.show(); });
|
||||
} else {
|
||||
this.eachChild(elem => { elem.hide(); });
|
||||
}
|
||||
}
|
||||
|
||||
/** 恢复初始状态*/
|
||||
recover() {
|
||||
this.time && this.time.hide();
|
||||
this.level && this.level.hide();
|
||||
this.detain && this.detain.hide();
|
||||
this.reentry && this.reentry.hide();
|
||||
this.emergent && this.emergent.hide();
|
||||
this.jump && this.jump.hide();
|
||||
if (this.model.visible) { this.safeDoor && this.safeDoor.hasDoor(false); }
|
||||
this.safeDoor && this.safeDoor.setColor(this.style.StationStand.safetyDoor.defaultColor);
|
||||
}
|
||||
|
||||
/** 空闲*/
|
||||
spare() {
|
||||
this.safeStand && this.safeStand.setColor(this.style.StationStand.stand.spareColor);
|
||||
}
|
||||
|
||||
/** 列车停站*/
|
||||
stop() {
|
||||
this.safeStand && this.safeStand.setColor(this.style.StationStand.stand.stopColor);
|
||||
}
|
||||
|
||||
/** 指定列车跳站*/
|
||||
designatedJumpStop() {
|
||||
this.safeStand && this.safeStand.setColor(this.style.StationStand.stand.designatedJumpStopColor);
|
||||
this.jump && this.jump.show();
|
||||
this.jump && this.jump.setStatus(this.model.jumpStopStatus);
|
||||
}
|
||||
|
||||
/** 站台紧急关闭*/
|
||||
emergentClose() {
|
||||
this.safeStand && this.safeStand.setColor(this.style.StationStand.stand.spareColor);
|
||||
this.emergent && this.emergent.show();
|
||||
}
|
||||
|
||||
/** 未设置跳停*/
|
||||
unJumpStop() {
|
||||
this.jump && this.jump.hide();
|
||||
this.jump && this.jump.setStatus(this.model.jumpStopStatus);
|
||||
}
|
||||
|
||||
/** 站台跳停*/
|
||||
jumpStop() {
|
||||
this.safeStand && this.safeStand.setColor(this.style.StationStand.stand.jumpStopColor);
|
||||
this.jump && this.jump.show();
|
||||
this.jump && this.jump.setStatus(this.model.jumpStopStatus);
|
||||
}
|
||||
|
||||
/** 未设置扣车*/
|
||||
unDetainTrain() {
|
||||
this.detain && this.detain.hide();
|
||||
}
|
||||
|
||||
/** 车站扣车*/
|
||||
standDetainTrain() {
|
||||
this.detain && this.detain.show();
|
||||
this.detain && this.detain.setColor(this.style.StationStand.detainCar.detainTrainTextColor);
|
||||
}
|
||||
|
||||
/** 中心扣车*/
|
||||
centerDetainTrain() {
|
||||
this.detain && this.detain.show();
|
||||
this.detain && this.detain.setColor(this.style.StationStand.detainCar.centerTrainColor);
|
||||
}
|
||||
|
||||
/** 中心+车站扣车*/
|
||||
standAndCenterDetainTrain() {
|
||||
this.detain && this.detain.show();
|
||||
this.detain && this.detain.setColor(this.style.StationStand.detainCar.andCenterTrainColor);
|
||||
}
|
||||
|
||||
/** 人工设置停战时间*/
|
||||
setManuallyArmisticeTime(val) {
|
||||
this.time && this.time.show();
|
||||
this.time && this.time.setName(val);
|
||||
}
|
||||
|
||||
/** 人工设置运行等级*/
|
||||
setManuallyOperationLevel(val) {
|
||||
this.level && this.level.show();
|
||||
this.level && this.level.setName(val);
|
||||
}
|
||||
|
||||
/** 开门*/
|
||||
openDoor() {
|
||||
this.safeDoor && this.safeDoor.hasDoor(true);
|
||||
}
|
||||
|
||||
/** 关门*/
|
||||
closeDoor() {
|
||||
this.safeDoor && this.safeDoor.hasDoor(false);
|
||||
}
|
||||
|
||||
/** 屏蔽门正常*/
|
||||
doorNormal() {
|
||||
this.safeDoor && this.safeDoor.setColor(this.style.StationStand.safetyDoor.defaultColor);
|
||||
}
|
||||
|
||||
/** 屏蔽门故障*/
|
||||
doorFault() {
|
||||
this.safeDoor && this.safeDoor.setColor(this.style.StationStand.safetyDoor.splitDoorColor);
|
||||
}
|
||||
|
||||
/** 屏蔽门切除*/
|
||||
doorSplit() {
|
||||
this.safeDoor && this.safeDoor.setColor(this.style.StationStand.safetyDoor.splitDoorColor);
|
||||
}
|
||||
|
||||
/** 无折返(默认)*/
|
||||
noReentry() {
|
||||
this.reentry && this.reentry.hide();
|
||||
}
|
||||
|
||||
/** 无人折返*/
|
||||
noHumanReentry() {
|
||||
this.reentry && this.reentry.show();
|
||||
this.reentry && this.reentry.setColor(this.style.StationStand.reentry.noHumanColor);
|
||||
}
|
||||
/** 自动换端*/
|
||||
autoChangeEnds() {
|
||||
this.reentry && this.reentry.show();
|
||||
this.reentry && this.reentry.setColor(this.style.StationStand.reentry.autoChangeEndsColor);
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
getBoundingRect() {
|
||||
const rect = this.safeStand.getBoundingRect();
|
||||
this.safeDoor && rect.union(this.safeDoor.getBoundingRect());
|
||||
|
||||
return rect;
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
const rect = this.getBoundingRect();
|
||||
if (rect) {
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
export default StationStand;
|
||||
@ -1,21 +0,0 @@
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
/** 名称元素*/
|
||||
export default function ELockRect(model) {
|
||||
const TextName = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 2,
|
||||
shape: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
width: model.width,
|
||||
height: model.width
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.lineWidth,
|
||||
stroke: model.stroke,
|
||||
fill: model.fill
|
||||
}
|
||||
});
|
||||
return TextName;
|
||||
}
|
||||
@ -1,128 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.create();
|
||||
this.craeteSwitchBorder();
|
||||
}
|
||||
create() {
|
||||
if (this.device.name) {
|
||||
// 创建锁闭框
|
||||
const rect = this.device.name.getNameText().getBoundingRect();
|
||||
let textWidth = rect.width * 0.8;
|
||||
if (this.device.triangle.drictx !== 1) {
|
||||
// rect.x += rect.width;
|
||||
textWidth = -textWidth;
|
||||
}
|
||||
|
||||
this.textRect = new Rect({
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z,
|
||||
silent: true,
|
||||
shape: {
|
||||
x: rect.x,
|
||||
y: rect.y,
|
||||
width: textWidth,
|
||||
height: rect.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 1,
|
||||
lineDash: [3, 3],
|
||||
stroke: this.device.style.Switch.mouseOverStyle.borderColor,
|
||||
fill: this.device.style.Switch.mouseOverStyle.borderBackgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.textRect);
|
||||
this.textRect.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// 创建道岔边框
|
||||
craeteSwitchBorder() {
|
||||
const sectionA = this.getInstanceByCode(this.device.model.sectionACode);
|
||||
const sectionB = this.getInstanceByCode(this.device.model.sectionBCode);
|
||||
const sectionC = this.getInstanceByCode(this.device.model.sectionCCode);
|
||||
const rect = this.device.getBoundingRect();
|
||||
|
||||
sectionA && rect.union(sectionA.getBoundingRect());
|
||||
sectionB && rect.union(sectionB.getBoundingRect());
|
||||
sectionC && rect.union(sectionC.getBoundingRect());
|
||||
|
||||
this.switchBorder = new Rect({
|
||||
zlevel: this.device.model.zlevel,
|
||||
z: this.device.z,
|
||||
silent: true,
|
||||
shape: Object.assign({ r: 4 }, rect),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.device.style.Switch.mouseOverStyle.borderColor,
|
||||
fill: this.device.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.switchBorder);
|
||||
this.switchBorder.hide();
|
||||
}
|
||||
|
||||
getInstanceByCode(code) {
|
||||
return (store.getters['map/getDeviceByCode'](code) || {}).instance;
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
this.switchBorder && this.switchBorder.hide();
|
||||
this.device.setTextStyle({
|
||||
textFill: this.device.style.backgroundColor
|
||||
});
|
||||
this.textRect && this.textRect.hide();
|
||||
this.device.setState(this.device.model);
|
||||
|
||||
const section = store.getters['map/getDeviceByCode'](this.device.model.sectionACode) || {};
|
||||
const parentSection = store.getters['map/getDeviceByCode'](section.parentCode) || {};
|
||||
const instance = this.getInstanceByCode(parentSection.trainWindowCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseLeave) {
|
||||
instance.mouseEvent.mouseLeave(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseover(e) {
|
||||
this.switchBorder && this.switchBorder.show();
|
||||
this.device.setLossAction(false);
|
||||
this.device.setSwitchCoreColor(this.device.style.Switch.mouseOverStyle.borderBackgroundColor);
|
||||
this.device.setTextStyle({
|
||||
textFill: '#000'
|
||||
});
|
||||
this.textRect && this.textRect.show();
|
||||
|
||||
const section = store.getters['map/getDeviceByCode'](this.device.model.sectionACode) || {};
|
||||
const parentSection = store.getters['map/getDeviceByCode'](section.parentCode) || {};
|
||||
const instance = this.getInstanceByCode(parentSection.trainWindowCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseEnter) {
|
||||
instance.mouseEvent.mouseEnter(e);
|
||||
}
|
||||
}
|
||||
|
||||
mouseEnter(e) {
|
||||
this.switchBorder && this.switchBorder.show();
|
||||
this.device.setLossAction(false);
|
||||
this.device.setSwitchCoreColor(this.device.style.Switch.mouseOverStyle.borderBackgroundColor);
|
||||
this.device.setTextStyle({
|
||||
textFill: '#000'
|
||||
});
|
||||
this.textRect && this.textRect.show();
|
||||
}
|
||||
|
||||
mouseLeave(e) {
|
||||
this.switchBorder && this.switchBorder.hide();
|
||||
this.device.setTextStyle({
|
||||
textFill: this.device.style.backgroundColor
|
||||
});
|
||||
this.textRect && this.textRect.hide();
|
||||
this.device.setState(this.device.model);
|
||||
}
|
||||
}
|
||||
export default EMouse;
|
||||
@ -1,77 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
|
||||
class ESwCore extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
this.skewLine = new Line({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
silent: true,
|
||||
shape: {
|
||||
x1: model.intersectionX,
|
||||
y1: model.intersectionY,
|
||||
x2: model.intersectionX + model.triangle.drictx * model.triangle.getCotRate() * model.coverLength,
|
||||
y2: model.intersectionY + model.triangle.dricty * model.coverLength
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.lineWidth,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.line = new Line({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
silent: true,
|
||||
shape: {
|
||||
x1: model.intersectionX - model.triangle.getCotRate() * model.coverLength,
|
||||
y1: model.intersectionY,
|
||||
x2: model.intersectionX + model.triangle.getCotRate() * model.coverLength,
|
||||
y2: model.intersectionY
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.lineWidth,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.line);
|
||||
this.add(this.skewLine);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.line.hide();
|
||||
this.skewLine.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.line.show();
|
||||
this.skewLine.show();
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.line.setStyle('stroke', color);
|
||||
this.skewLine.setStyle('stroke', color);
|
||||
}
|
||||
|
||||
stopAnimation(flag) {
|
||||
this.line.stopAnimation(flag);
|
||||
this.skewLine.stopAnimation(flag);
|
||||
}
|
||||
|
||||
animateStyle(cb) {
|
||||
this.eachChild((child) => {
|
||||
cb(child);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export default ESwCore;
|
||||
@ -1,69 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
|
||||
class ESwLnversion extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
this.relocShelter = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: model.shelterPoints
|
||||
},
|
||||
style: {
|
||||
fill: style.backgroundColor
|
||||
},
|
||||
cursor: model.cursor,
|
||||
onmouseover: model.onmouseover,
|
||||
onmouseout: model.onmouseout
|
||||
});
|
||||
const rpx = Math.abs(model.triangle.getCos(model.halfWidth)) + 0.2;
|
||||
this.relocShelter.position = [-model.triangle.drictx * rpx, -model.triangle.dricty * 0.2];
|
||||
|
||||
this.section = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 1,
|
||||
shape: {
|
||||
points: model.sectionPoints
|
||||
},
|
||||
style: {
|
||||
fill: style.Section.line.spareColor
|
||||
},
|
||||
cursor: model.cursor,
|
||||
onmouseover: model.onmouseover,
|
||||
onmouseout: model.onmouseout
|
||||
});
|
||||
|
||||
this.hide();
|
||||
this.add(this.relocShelter);
|
||||
this.add(this.section);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.relocShelter.hide();
|
||||
this.section.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.relocShelter.show();
|
||||
this.section.show();
|
||||
}
|
||||
|
||||
stopAnimation(flag) {
|
||||
this.section.stopAnimation(flag);
|
||||
}
|
||||
|
||||
getSection() {
|
||||
return this.section;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default ESwLnversion;
|
||||
@ -1,44 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
|
||||
class ESwLocal extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.locShelter = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: model.shelterPoints
|
||||
},
|
||||
style: {
|
||||
fill: style.backgroundColor
|
||||
},
|
||||
cursor: model.cursor,
|
||||
onmouseover: model.onmouseover,
|
||||
onmouseout: model.onmouseout
|
||||
});
|
||||
|
||||
const lpx = Math.abs(model.triangle.getCos(1));
|
||||
this.locShelter.position = [model.triangle.drictx * lpx, -model.triangle.dricty * 0.2];
|
||||
this.locShelter.show();
|
||||
this.add(this.locShelter);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.locShelter.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.locShelter.show();
|
||||
}
|
||||
}
|
||||
|
||||
export default ESwLocal;
|
||||
@ -1,98 +0,0 @@
|
||||
import LangStorage from '@/utils/lang';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
class ESwName extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.nameText = new Text({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 6,
|
||||
style: {
|
||||
x: model.nameTextX,
|
||||
y: model.nameTextY,
|
||||
fontWeight: style.Switch.text.fontWeight,
|
||||
fontSize: style.Switch.text.fontSize,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.name,
|
||||
textAlign: model.triangle.drictx === 1 ? 'left' : 'right',
|
||||
textVerticalAlign: 'middle',
|
||||
textFill: style.Switch.text.fontColor
|
||||
}
|
||||
});
|
||||
|
||||
const rect = this.nameText.getBoundingRect();
|
||||
let textWidth = rect.width * 0.8;
|
||||
if (model.triangle.drictx !== 1) {
|
||||
rect.x += rect.width;
|
||||
textWidth = -textWidth;
|
||||
}
|
||||
|
||||
this.textRect = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 10,
|
||||
silent: true,
|
||||
shape: {
|
||||
x: rect.x,
|
||||
y: rect.y,
|
||||
width: textWidth,
|
||||
height: rect.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
// lineDash: [3, 3],
|
||||
stroke: style.Switch.text.borderColor,
|
||||
fill: style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
const data = LangStorage.getLang() == 'en' ? 'Turnout section' : '道岔区段名称';
|
||||
|
||||
this.arrowText = new Text({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 20,
|
||||
style: {
|
||||
x: model.arrowTextX,
|
||||
y: model.arrowTextY,
|
||||
fontSize: style.arrowFontSize,
|
||||
fontWeight: style.Switch.text.fontWeight,
|
||||
fontFamily: style.fontFamily,
|
||||
text: `${data}: ${model.sectionName}`,
|
||||
textFill: '#000',
|
||||
textAlign: 'left',
|
||||
textPadding: 3,
|
||||
textBackgroundColor: style.tipBackgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.textRect);
|
||||
this.add(this.nameText);
|
||||
this.add(this.arrowText);
|
||||
|
||||
this.arrowText.hide();
|
||||
model.nameShow ? this.nameText.show() : this.nameText.hide();
|
||||
}
|
||||
|
||||
getArrowText() {
|
||||
return this.arrowText;
|
||||
}
|
||||
|
||||
getNameText() {
|
||||
return this.nameText;
|
||||
}
|
||||
|
||||
getTextRect() {
|
||||
return this.textRect;
|
||||
}
|
||||
}
|
||||
|
||||
export default ESwName;
|
||||
@ -1,426 +0,0 @@
|
||||
/*
|
||||
* 道岔
|
||||
*/
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import JTriangle from '../../utils/JTriangle';
|
||||
import ESwName from './ESwName.js';
|
||||
import ESwCore from './ESwCore.js';
|
||||
import ESwLocal from './ESwLocal.js';
|
||||
import ESwLnversion from './ESwLnversion';
|
||||
import ELockRect from './ELockRect';
|
||||
import EMouse from './EMouse';
|
||||
|
||||
export default class Switch extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 6;
|
||||
this.triangle = new JTriangle(model.intersection, model.skew);
|
||||
this.create();
|
||||
this.createLockRect(); // 创建单锁矩形框显示
|
||||
this.createMouseEvent();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
createMouseEvent() {
|
||||
// 鼠标事件
|
||||
if (this.style.Switch.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
let halfWidth = style.Section.line.width / 2;
|
||||
const switchWidth = style.Section.line.width + style.Section.line.beyondWidth * 2 + 0.8;
|
||||
const swPadding = style.Switch.core.length;
|
||||
const directx = this.triangle.drictx;
|
||||
const directy = this.triangle.dricty;
|
||||
const direct = -this.triangle.drictx * this.triangle.dricty;
|
||||
const coverLength = switchWidth * 1.5;
|
||||
|
||||
this.swCore = new ESwCore({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
intersectionX: model.intersection.x,
|
||||
intersectionY: model.intersection.y,
|
||||
coverLength: coverLength,
|
||||
lineWidth: switchWidth,
|
||||
triangle: this.triangle
|
||||
});
|
||||
|
||||
halfWidth += 0.3;
|
||||
const point1 = [model.intersection.x - directx * halfWidth, model.intersection.y + directy * halfWidth];
|
||||
const point2 = [point1[0] + directx * switchWidth / this.triangle.getSinRate(), point1[1]];
|
||||
const point3 = [point2[0] + directx * this.triangle.getCotRate() * swPadding, point2[1] + directy * swPadding];
|
||||
const point4 = [point3[0] + direct * this.triangle.getSin(switchWidth), point3[1] - direct * this.triangle.getCos(switchWidth)];
|
||||
this.locShelter = new ESwLocal({ // 定位
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
shelterPoints: [point1, point2, point3, point4],
|
||||
cursor: 'pointer',
|
||||
triangle: this.triangle,
|
||||
onmouseover: () => { this.name.getArrowText().show(); },
|
||||
onmouseout: () => { this.name.getArrowText().hide(); }
|
||||
});
|
||||
|
||||
const slen = switchWidth / this.triangle.getSinRate();
|
||||
const rpoint1 = [model.intersection.x + directx * halfWidth, model.intersection.y - directy * halfWidth];
|
||||
const rpoint2 = [rpoint1[0] + directx * (swPadding + switchWidth * this.triangle.getCotRate()), rpoint1[1]];
|
||||
const rpoint3 = [rpoint2[0], rpoint2[1] + directy * switchWidth];
|
||||
const rpoint4 = [rpoint1[0] + this.triangle.getCos(slen), rpoint1[1] + this.triangle.getSin(slen)];
|
||||
|
||||
const switchWidth1 = style.Section.line.width / 2 + 0.1;
|
||||
const width1 = switchWidth1 * this.triangle.getSinRate();
|
||||
const height1 = switchWidth1 * this.triangle.getCosRate();
|
||||
const width2 = (height1 + switchWidth1) / this.triangle.getTanRate();
|
||||
const width3 = (style.Section.line.width / this.triangle.getSinRate()) - width2 - width1;
|
||||
const spoint1 = [model.intersection.x + directx * width3, model.intersection.y - directy * switchWidth1];
|
||||
const spoint2 = [spoint1[0] - directx * (width2 + width1) - directx * width3, spoint1[1]];
|
||||
const spoint3 = [model.intersection.x - directx * width3, model.intersection.y + directy * switchWidth1];
|
||||
const spoint4 = [spoint1[0] + directx * (width2 + width1) - directx * width3, spoint3[1]];
|
||||
|
||||
this.relocShelter = new ESwLnversion({ // 反位
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
shelterPoints: [rpoint1, rpoint2, rpoint3, rpoint4],
|
||||
sectionPoints: [spoint1, spoint2, spoint3, spoint4],
|
||||
cursor: 'pointer',
|
||||
halfWidth: halfWidth,
|
||||
triangle: this.triangle,
|
||||
onmouseover: () => { this.name.getArrowText().show(); },
|
||||
onmouseout: () => { this.name.getArrowText().hide(); }
|
||||
});
|
||||
|
||||
this.releaseBackground = new Line({ // 区段上遮盖段
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x1: model.intersection.x - (coverLength * this.triangle.getCotRate()),
|
||||
y1: model.intersection.y,
|
||||
x2: model.intersection.x + (coverLength * this.triangle.getCotRate()),
|
||||
y2: model.intersection.y
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.Section.line.width + style.Section.line.beyondWidth + 1,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
const arrowTextX = model.intersection.x + 10;
|
||||
const arrowTextY = model.intersection.y + 15;
|
||||
const nameTextX = model.namePosition.x + model.intersection.x + directx * (style.Section.line.width * 3 + style.Switch.text.offset.x) * this.triangle.getCotRate();
|
||||
const nameTextY = model.namePosition.y + model.intersection.y + style.Switch.text.offset.y * (style.Switch.text.position || directy);
|
||||
|
||||
this.name = new ESwName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
arrowTextX: arrowTextX,
|
||||
arrowTextY: arrowTextY,
|
||||
nameTextX: nameTextX,
|
||||
nameTextY: nameTextY,
|
||||
sectionName: model.sectionName,
|
||||
name: model.name,
|
||||
nameShow: style.Switch.text.show,
|
||||
triangle: this.triangle
|
||||
});
|
||||
|
||||
this.add(this.swCore); // 岔芯link
|
||||
this.add(this.locShelter);
|
||||
this.add(this.relocShelter);
|
||||
this.add(this.releaseBackground);
|
||||
this.add(this.name);
|
||||
style.Switch.text.show && model.nameShow ? this.name.show() : this.name.hide();
|
||||
}
|
||||
|
||||
createLockRect() {
|
||||
const offsetX = this.model.locateType == '01' ? 3 : 0;
|
||||
this.lockRect = new ELockRect({ // 锁定矩形
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 6,
|
||||
x: this.model.intersection.x - this.style.Switch.monolock.rectWidth / 2 + offsetX,
|
||||
y: this.model.intersection.y - this.style.Switch.monolock.rectWidth / 2,
|
||||
width: this.style.Switch.monolock.rectWidth,
|
||||
lineWidth: 1.8,
|
||||
stroke: this.style.Switch.monolock.rectBorderColor,
|
||||
fill: this.style.transparentColor
|
||||
});
|
||||
this.add(this.lockRect);
|
||||
this.lockRect.hide();
|
||||
}
|
||||
|
||||
/** 名称动画*/
|
||||
nameTextAnimation() {
|
||||
this.name.getNameText().animateStyle(true)
|
||||
.when(0, { textFill: this.style.backgroundColor })
|
||||
.when(1000, { textFill: this.style.Switch.text.lossColor })
|
||||
.when(2000, { textFill: this.style.backgroundColor })
|
||||
.start();
|
||||
|
||||
this.name.getTextRect().animateStyle(true)
|
||||
.when(0, { textFill: this.style.backgroundColor })
|
||||
.when(1000, { textFill: this.style.Switch.text.borderColor })
|
||||
.when(2000, { textFill: this.style.backgroundColor })
|
||||
.start();
|
||||
}
|
||||
|
||||
/** 设置岔芯是否隐藏*/
|
||||
setSwitchCoreInvisible(invisible) {
|
||||
if (invisible) {
|
||||
this.swCore.hide();
|
||||
} else {
|
||||
this.swCore.show();
|
||||
}
|
||||
}
|
||||
|
||||
/** 设置岔芯颜色*/
|
||||
setSwitchCoreColor(color) {
|
||||
this.swCore && this.swCore.setColor(color);
|
||||
}
|
||||
|
||||
/** 设置道岔文字颜色*/
|
||||
setTextColor(color) {
|
||||
this.name.getNameText().setStyle({textFill: color});
|
||||
}
|
||||
|
||||
/** 设置道岔背景颜色*/
|
||||
setTextStyle(style) {
|
||||
this.name.getNameText().setStyle(style);
|
||||
}
|
||||
|
||||
/** 设置道岔文字边框颜色 (道岔封锁) */
|
||||
setHasTextBorder(width) {
|
||||
this.name.getTextRect().setStyle({lineWidth: width});
|
||||
}
|
||||
|
||||
/** 恢复状态*/
|
||||
recover() {
|
||||
this.lockRect.hide();
|
||||
this.setSwitchCoreColor(this.style.backgroundColor);
|
||||
this.name.getNameText().stopAnimation(false);
|
||||
this.swCore.stopAnimation(false);
|
||||
this.relocShelter.stopAnimation(false);
|
||||
this.relocShelter.hide();
|
||||
this.releaseBackground.hide();
|
||||
this.setHasTextBorder(0);
|
||||
}
|
||||
|
||||
/** 定位*/
|
||||
setLocationAction() {
|
||||
this.recover();
|
||||
this.setSwitchCoreInvisible(true);
|
||||
this.locShelter.show();
|
||||
this.relocShelter.hide();
|
||||
this.setTextColor(this.style.Switch.text.locateColor);
|
||||
}
|
||||
|
||||
/** 反位*/
|
||||
setInversionAction() {
|
||||
this.recover();
|
||||
this.setSwitchCoreInvisible(true);
|
||||
this.setTextColor(this.style.Switch.text.inversionColor);
|
||||
this.locShelter.hide();
|
||||
this.relocShelter.show();
|
||||
this.setSectionState(this.relocShelter.getSection(), 'fill', this.model);
|
||||
}
|
||||
|
||||
/** 失去*/
|
||||
setLossAction(nameFlicker) {
|
||||
this.recover();
|
||||
this.locShelter.hide();
|
||||
this.relocShelter.hide();
|
||||
this.setSwitchCoreInvisible(false);
|
||||
this.setTextColor(this.style.Switch.text.lossColor);
|
||||
nameFlicker && this.nameTextAnimation();
|
||||
}
|
||||
|
||||
/** 挤叉*/
|
||||
setForkAction() {
|
||||
this.setLossAction(true);
|
||||
this.swCore.animateStyle(item => {
|
||||
item.animateStyle(true)
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: 'red' })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
}
|
||||
|
||||
/** 空闲*/
|
||||
spare() {
|
||||
}
|
||||
|
||||
/** 单锁*/
|
||||
setMonolock() {
|
||||
if (this.style.Switch.monolock.rectShow) { // 判断单锁矩形是否显示
|
||||
this.lockRect.show();
|
||||
}
|
||||
switch (this.model.locateType) {
|
||||
case '01': // 定位
|
||||
this.setTextColor(this.style.Switch.monolock.locationColor); // 设置道岔名称颜色
|
||||
break;
|
||||
case '02': // 反位
|
||||
this.setTextColor(this.style.Switch.monolock.inversionColor); // 设置道岔名称颜色
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/** 封锁 */
|
||||
block() {
|
||||
if (this.style.Switch.block.nameBorderShow) {
|
||||
this.setHasTextBorder(1);
|
||||
} else if (this.style.Switch.block.contentRectShow) {
|
||||
this.lockRect.show();
|
||||
this.lockRect.setStyle({stroke: this.style.Switch.block.contentRectColor});
|
||||
}
|
||||
}
|
||||
|
||||
/** 延时释放*/
|
||||
timeRelease() {
|
||||
this.setSwitchCoreInvisible(true);
|
||||
this.releaseBackground.show();
|
||||
}
|
||||
|
||||
/** 设置道岔切除*/
|
||||
setSwitchCutOff() {
|
||||
this.setSwitchCoreInvisible(true);
|
||||
switch (this.model.locateType) {
|
||||
case '01':
|
||||
this.releaseBackground.hide();
|
||||
break;
|
||||
case '02':
|
||||
this.relocShelter && this.relocShelter.getSection().animateStyle(true)
|
||||
.when(1000, { fill: this.style.backgroundColor })
|
||||
.start();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
sectionCutOff(section) {
|
||||
const lineWidth = this.style.Section.line.width + (this.model.sectionAstatus != '01' ? this.style.Section.line.beyondWidth : 0);
|
||||
if (section) {
|
||||
section.animateStyle(true, [
|
||||
{ time: 0, styles: { lineWidth: lineWidth } },
|
||||
{ time: 1000, styles: { stroke: this.style.backgroundColor } },
|
||||
{ time: 2000, styles: { lineWidth: lineWidth } }
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
setSectionState(section, style, state) {
|
||||
if (section && !section.animators.length) {
|
||||
switch (state.sectionAstatus) {
|
||||
case '00': break;
|
||||
case '01': /** 空闲*/
|
||||
section.setStyle(style, this.style.Section.line.spareColor);
|
||||
break;
|
||||
case '02': /** 通信车占用*/
|
||||
section.setStyle(style, this.style.Section.line.communicationOccupiedColor);
|
||||
break;
|
||||
case '03': /** 非通信车占用*/
|
||||
section.setStyle(style, this.style.Section.line.unCommunicationOccupiedColor);
|
||||
break;
|
||||
case '04': /** 进路锁闭*/
|
||||
section.setStyle(style, this.style.Section.line.routeLockColor);
|
||||
break;
|
||||
case '05': /** 故障锁闭*/
|
||||
section.setStyle(style, this.style.Section.line.faultLockColor);
|
||||
break;
|
||||
case '06': /** 封锁*/
|
||||
section.setStyle(style, this.style.Section.line.blockColor);
|
||||
break;
|
||||
case '07': /** ATC切除*/
|
||||
section.setStyle(style, this.style.Section.line.atcExcisionColor);
|
||||
break;
|
||||
case '08': /** ATS切除*/
|
||||
section.setStyle(style, this.style.Section.line.atsExcisionColor);
|
||||
section.animateStyle(true)
|
||||
.when(1000, { fill: this.style.backgroundColor })
|
||||
.when(2000, { fill: this.style.Section.line.atsExcisionColor })
|
||||
.start();
|
||||
break;
|
||||
case '09': /** 进路延续保护 */
|
||||
section.setStyle(style, this.style.Section.line.protectiveLockColor);
|
||||
break;
|
||||
}
|
||||
|
||||
if (state.cutOff) {
|
||||
this.sectionCutOff(section);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
setLocateType(model) {
|
||||
switch (model.locateType) {
|
||||
case '01':
|
||||
this.setLocationAction(); /** 定位*/
|
||||
break;
|
||||
case '02':
|
||||
this.setInversionAction(); /** 反位*/
|
||||
break;
|
||||
case '03':
|
||||
this.setLossAction(true); /** 失去*/
|
||||
break;
|
||||
case '04':
|
||||
this.setForkAction(); /** 挤岔*/
|
||||
break;
|
||||
default:
|
||||
this.setLocationAction();
|
||||
}
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
this.setLocateType(model);
|
||||
|
||||
switch (model.status) {
|
||||
case '01':
|
||||
this.spare(); /** 空闲*/
|
||||
break;
|
||||
case '10':
|
||||
this.setMonolock(); /** 单锁*/
|
||||
break;
|
||||
case '13':
|
||||
this.timeRelease(); /** 延时释放*/
|
||||
break;
|
||||
case '14':
|
||||
this.block(); /** 封锁*/
|
||||
break;
|
||||
}
|
||||
|
||||
/** 区段切除*/
|
||||
if (model.cutOff) {
|
||||
this.setSwitchCutOff();
|
||||
}
|
||||
}
|
||||
|
||||
getBoundingRect() {
|
||||
return this.name.getBoundingRect();
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
const text = this.name.getNameText();
|
||||
if (text) {
|
||||
const rect = text.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,44 +0,0 @@
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
export default class Text2 extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.name = model.code;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.z = 6;
|
||||
this.create();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
create() {
|
||||
var model = this.model;
|
||||
var [direction, content] = model.content.split('::');
|
||||
if (direction == 'V') {
|
||||
content = content.split('').join('\n');
|
||||
} else if (direction != 'H') {
|
||||
content = model.content;
|
||||
}
|
||||
|
||||
this.text = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
text: content,
|
||||
textFont: model.font,
|
||||
textFill: model.fontColor,
|
||||
textAlign: 'middle'
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
}
|
||||
}
|
||||
@ -1,66 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import LangStorage from '@/utils/lang';
|
||||
|
||||
class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
let destinationText = '';
|
||||
switch (this.device.model.destinationStatus) {
|
||||
case '01': destinationText = LangStorage.getLang() == 'en' ? 'on time' : '准点'; break;
|
||||
case '02': destinationText = LangStorage.getLang() == 'en' ? 'early' : '早点'; break;
|
||||
case '03': destinationText = LangStorage.getLang() == 'en' ? 'early seriously' : '严重早点'; break;
|
||||
case '04': destinationText = LangStorage.getLang() == 'en' ? 'late' : '晚点'; break;
|
||||
case '05': destinationText = LangStorage.getLang() == 'en' ? 'late seriously ' : '严重晚点'; break;
|
||||
default: destinationText = LangStorage.getLang() == 'en' ? 'unknown' : '未知'; break;
|
||||
}
|
||||
let trainType = '';
|
||||
switch (this.device.model.type) {
|
||||
case '01': trainType = LangStorage.getLang() == 'en' ? 'Plan the car' : '计划车'; break;
|
||||
case '02': trainType = LangStorage.getLang() == 'en' ? 'Head size car' : '头码车'; break;
|
||||
case '03': trainType = LangStorage.getLang() == 'en' ? 'Artificial car' : '人工车'; break;
|
||||
default: trainType = LangStorage.getLang() == 'en' ? 'unknown' : '未知'; break;
|
||||
}
|
||||
let text = '';
|
||||
if (LangStorage.getLang() == 'en') {
|
||||
text = ` The planned train: ${trainType} \n Table No.: ${this.device.model.serviceNumber} \n Train Trip No.: ${this.device.model.tripNumber}\n Destination: ${this.device.model.targetCode ? this.device.model.targetCode : ''}\n Train No.: ${this.device.model.groupNumber}\n Early or late: ${destinationText}\n Direction: ${this.device.model.directionType == '02' ? 'up' : 'down'}\n Crew No.: \n Start Station: \n Terminal Station: \n Occupied Track: ${this.device.model.sectionModel ? this.device.model.sectionModel.name : ''}\n Current Station: \n Train-ground communication: normal \n Operation Speed level: 4 \n Detained: ${this.device.model.runControlStatus == '01' ? 'Normal' : this.device.model.runControlStatus == '03' ? 'Skip to continue moving' : 'Detained'}\n Stationary: ${this.device.model.runStatus == '02' ? 'No' : 'Yes'}\n Blocked: No \n Speed: ${this.device.model.speed || 0} km/h \n Authorized Distance: ${this.device.model.maLen || 0} m`;
|
||||
} else {
|
||||
text = `列车类型: ${trainType} \n表\0\0\0\0号: ${this.device.model.serviceNumber}\n车\0次\0号: ${this.device.model.tripNumber}\n目的地号: ${this.device.model.targetCode ? this.device.model.targetCode : ''}\n车\0组\0号: ${this.device.model.groupNumber}\n早\0晚\0点: ${destinationText}\n运行方向: ${this.device.model.directionType == '02' ? '上行' : '下行'}\n乘务组号: \n起点站名: \n终点站名: \n占用轨道: ${this.device.model.sectionModel ? this.device.model.sectionModel.name : ''}\n所在车站: \n车地通信: 正常\n运行等级: 4\n扣车状态: ${this.device.model.runControlStatus == '01' ? '正常' : this.device.model.runControlStatus == '03' ? '跳停' : '扣车'}\n停稳状态: ${this.device.model.runStatus == '02' ? '未停稳' : '停稳'}\n阻塞状态: 无\n列车速度: ${this.device.model.speed || 0} km/h\n列车移动授权距离: ${this.device.model.maLen || 0} m`;
|
||||
}
|
||||
// 文字描述
|
||||
this.arrowText = new Text({
|
||||
zlevel: this.device.model.zlevel,
|
||||
z: this.device.model.z + 10,
|
||||
style: {
|
||||
x: this.device.model.point.x + 50,
|
||||
y: this.device.model.point.y + 25,
|
||||
text: text,
|
||||
textFill: '#000',
|
||||
textAlign: 'letf',
|
||||
textFont: 10 + 'px consolas',
|
||||
textPadding: 3,
|
||||
textBackgroundColor: this.device.model.style.tipBackgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.arrowText);
|
||||
this.arrowText.hide();
|
||||
}
|
||||
|
||||
mouseover() {
|
||||
this.device.deviceModel.down = true;
|
||||
this.arrowText.show();
|
||||
}
|
||||
|
||||
mouseout() {
|
||||
if (this.device.deviceModel.down) {
|
||||
this.arrowText.hide();
|
||||
this.device.deviceModel.down = false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
export default EMouse;
|
||||
@ -1,240 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import TrainBodyBox from './TrainBodyBox';
|
||||
import '../StationStand/EDetain';
|
||||
import ETextName from '../element/ETextName'; // 名称文字 (共有)
|
||||
import EMouse from './EMouse';
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
|
||||
/** 车身*/
|
||||
export default class TrainBody extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.deviceModel = model.model;
|
||||
this.nameFormat = model.nameFormat;
|
||||
this.create();
|
||||
this.createMouse(); // 鼠标事件
|
||||
}
|
||||
|
||||
createMouse() {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
if (this.deviceModel.down) {
|
||||
store.dispatch('map/setTrainDetails', this.deviceModel);
|
||||
this.mouseEvent.mouseover();
|
||||
}
|
||||
|
||||
this.on('mouseover', () => {
|
||||
store.dispatch('map/setTrainDetails', this.deviceModel);
|
||||
this.mouseEvent.mouseover();
|
||||
});
|
||||
this.on('mouseout', () => {
|
||||
store.dispatch('map/setTrainDetails', null);
|
||||
this.mouseEvent.mouseout();
|
||||
});
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
this.trainBodyBox = new TrainBodyBox({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
point: model.point,
|
||||
style: style
|
||||
});
|
||||
|
||||
const beginX = (model.point.x + style.Train.trainBody.lrPadding);
|
||||
const beginY = (model.point.y - style.Train.hsda.trainHSDATextFontSize - style.Train.hsda.upPaddingHSDA);
|
||||
const margin = (style.Train.common.trainWidth - style.Train.hsda.lrPaddingHSDA * 2) / 4;
|
||||
|
||||
this.textH = style.Train.common.haveTextHSDA ? new ETextName({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
x: parseInt(beginX + margin * 0),
|
||||
y: parseInt(beginY),
|
||||
text: style.Train.hsda.textHContent,
|
||||
textFill: style.trainYellowColor,
|
||||
fontSize: style.Train.hsda.trainHSDATextFontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
}) : '';
|
||||
this.textS = style.Train.common.haveTextHSDA ? new ETextName({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
x: parseInt(beginX + margin * 1),
|
||||
y: parseInt(beginY),
|
||||
text: style.Train.hsda.textSContent,
|
||||
textFill: style.trainBlueColor,
|
||||
fontSize: style.Train.hsda.trainHSDATextFontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
}) : '';
|
||||
this.textD = style.Train.common.haveTextHSDA ? new ETextName({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
x: parseInt(beginX + margin * 2),
|
||||
y: parseInt(beginY),
|
||||
text: style.Train.hsda.textDContent,
|
||||
textFill: style.trainGreenColor,
|
||||
fontSize: style.Train.hsda.trainHSDATextFontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
}) : '';
|
||||
this.textA = style.Train.common.haveTextHSDA ? new ETextName({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
x: parseInt(beginX + margin * 3),
|
||||
y: parseInt(beginY),
|
||||
text: style.Train.hsda.textAContent,
|
||||
textFill: style.trainRedColor,
|
||||
fontSize: style.Train.hsda.trainHSDATextFontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
}) : '';
|
||||
const serviceNumber = style.Train.trainServer.serviceNumberPrefix + (model.serviceNumber || style.Train.trainServer.defaultServiceNumber) + '';// 服务号(表号)
|
||||
const tripNumber = style.Train.trainTarget.tripNumberPrefix + (style.Train.trainTarget.defaultDirectionCode
|
||||
? (model.directionCode || style.Train.trainTarget.defaultDirectionCode) + (model.tripNumber || style.Train.trainTarget.defaultTripNumber)
|
||||
: model.tripNumber || style.Train.trainTarget.defaultTripNumber) + ''; // 车次号
|
||||
const targetCode = style.Train.trainNumber.targetCodePrefix + (model.targetCode || style.Train.trainNumber.defaultTargetCode) + ''; // 目的地码
|
||||
const groupNumber = style.Train.trainTargetNumber.groupNumberPrefix + (model.groupNumber || style.Train.trainTargetNumber.defaultGroupNumber) + ''; // 车组号
|
||||
this.textTrainServer = new ETextName({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 1,
|
||||
x: parseInt(model.point.x + style.Train.trainServer.trainServerOffset.x),
|
||||
y: parseInt(model.point.y + style.Train.trainServer.trainServerOffset.y),
|
||||
text: serviceNumber.substring(serviceNumber.length - style.Train.trainServer.serviceNumberPrefix.length),
|
||||
textFill: style.trainTextColor,
|
||||
fontSize: model.fontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: 'left',
|
||||
textVerticalAlign: 'top'
|
||||
});
|
||||
this.textTrainTarget = new ETextName({
|
||||
zlevel: this.model.zlevel,
|
||||
z: this.model.z + 1,
|
||||
x: parseInt(model.point.x + model.style.Train.trainTarget.trainTargetOffset.x),
|
||||
y: parseInt(model.point.y + model.style.Train.trainTarget.trainTargetOffset.y),
|
||||
text: tripNumber.substring(tripNumber.length - style.Train.trainTarget.tripNumberPrefix.length),
|
||||
textFill: style.trainTextColor,
|
||||
fontSize: model.fontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: style.Train.trainTarget.trainTargetTextAlign,
|
||||
textVerticalAlign: 'top'
|
||||
});
|
||||
this.textTrainNumber = new ETextName({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 1,
|
||||
x: parseInt(model.point.x + style.Train.trainNumber.trainNumberOffset.x),
|
||||
y: parseInt(model.point.y + style.Train.trainNumber.trainNumberOffset.y),
|
||||
text: targetCode.substring(targetCode.length - 3),
|
||||
textFill: style.trainTextColor,
|
||||
textStroke: style.trainTextColor,
|
||||
fontWeight: 400,
|
||||
textStrokeWidth: 0,
|
||||
fontSize: model.fontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: 'left',
|
||||
textVerticalAlign: 'top'
|
||||
});
|
||||
this.textTrainTargetNumber = new ETextName({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 1,
|
||||
x: parseInt(model.point.x - style.Train.trainBody.lrPadding),
|
||||
y: parseInt(model.point.y + style.Train.trainBody.upPadding),
|
||||
text: groupNumber.substring(groupNumber.length - 3),
|
||||
textFill: style.trainTextColor,
|
||||
textStroke: style.trainTextColor,
|
||||
textStrokeWidth: 0,
|
||||
fontSize: model.fontSize,
|
||||
fontFamily: style.Train.common.fontFamily,
|
||||
textAlign: 'left',
|
||||
textVerticalAlign: 'top'
|
||||
});
|
||||
this.formatChangePosition(model, style);
|
||||
this.add(this.trainBodyBox);
|
||||
if (style.Train.common.haveTextHSDA) {
|
||||
this.add(this.textH);
|
||||
this.add(this.textS);
|
||||
this.add(this.textD);
|
||||
this.add(this.textA);
|
||||
}
|
||||
}
|
||||
|
||||
removeTrainDetail() {
|
||||
this.mouseEvent.mouseout();
|
||||
store.dispatch('map/setTrainDetails', null);
|
||||
this.deviceModel.down = false;
|
||||
}
|
||||
setTrainColor(color) {
|
||||
this.trainBodyBox && this.trainBodyBox.setStyle('fill', color);
|
||||
}
|
||||
setTextTrainServerColor(color) {
|
||||
this.textTrainServer && this.textTrainServer.setStyle('textFill', color);
|
||||
this.textTrainServer && this.textTrainServer.setStyle('textStroke', color);
|
||||
}
|
||||
setTextTrainTargetColor(color) {
|
||||
this.textTrainTarget && this.textTrainTarget.setStyle('textFill', color);
|
||||
this.textTrainTarget && this.textTrainTarget.setStyle('textStroke', color);
|
||||
}
|
||||
setTextTrainNumberColor(color) {
|
||||
this.textTrainNumber && this.textTrainNumber.setStyle('textFill', color);
|
||||
this.textTrainNumber && this.textTrainNumber.setStyle('textStroke', color);
|
||||
}
|
||||
setTextTrainTargetNumberColor(color) {
|
||||
this.textTrainTargetNumber && this.textTrainTargetNumber.setStyle('textFill', color);
|
||||
this.textTrainTargetNumber && this.textTrainTargetNumber.setStyle('textStroke', color);
|
||||
}
|
||||
setHShow(isShow) {
|
||||
if (this.textH) {
|
||||
isShow ? this.textH.show() : this.textH.hide();
|
||||
}
|
||||
}
|
||||
setSShow(isShow) {
|
||||
if (this.textS) {
|
||||
isShow ? this.textS.show() : this.textS.hide();
|
||||
}
|
||||
}
|
||||
setDShow(isShow) {
|
||||
if (this.textD) {
|
||||
isShow ? this.textD.show() : this.textD.hide();
|
||||
}
|
||||
}
|
||||
setAShow(isShow) {
|
||||
if (this.textA) {
|
||||
isShow ? this.textA.show() : this.textA.hide();
|
||||
}
|
||||
}
|
||||
setBodyBoxShape(key, color) {
|
||||
this.trainBodyBox && this.trainBodyBox.setColor(key, color);
|
||||
}
|
||||
formatChangePosition(model, style) {
|
||||
if (this.nameFormat) {
|
||||
const arr = this.nameFormat.split(':');
|
||||
let widthText = 0;
|
||||
arr.forEach(ele => {
|
||||
if (ele == 'targetCode') {
|
||||
this.textTrainNumber.setStyle('x', parseInt(model.point.x + widthText + style.Train.common.textOffset) );
|
||||
widthText += this.textTrainNumber.getBoundingRect().width;
|
||||
this.add(this.textTrainNumber);
|
||||
} else if (ele == 'serviceNumber') {
|
||||
this.textTrainServer.setStyle('x', parseInt(model.point.x + widthText + style.Train.common.textOffset));
|
||||
widthText += this.textTrainServer.getBoundingRect().width;
|
||||
this.add(this.textTrainServer);
|
||||
} else if (ele == 'tripNumber') {
|
||||
this.textTrainTarget.setStyle('x', parseInt(model.point.x + widthText + style.Train.common.textOffset));
|
||||
widthText += this.textTrainTarget.getBoundingRect().width;
|
||||
this.add(this.textTrainTarget);
|
||||
} else if (ele == 'groupNumber') {
|
||||
this.textTrainTargetNumber.setStyle('x', parseInt(model.point.x + widthText + style.Train.common.textOffset));
|
||||
widthText += this.textTrainTargetNumber.getBoundingRect().width;
|
||||
this.add(this.textTrainTargetNumber);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
export default class TrainBodyBox extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
const model = this.model;
|
||||
this.trainBodyBox = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
x: model.point.x,
|
||||
y: model.point.y,
|
||||
width: model.style.Train.common.trainWidth,
|
||||
height: model.style.Train.common.trainHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: model.style.Train.trainBody.trainBodyLineWidth,
|
||||
stroke: model.style.trainSidelineColor,
|
||||
fill: model.style.Train.trainBody.trainBodyFillColor
|
||||
},
|
||||
cursor: 'pointer'
|
||||
});
|
||||
this.add(this.trainBodyBox);
|
||||
}
|
||||
setColor(key, color) {
|
||||
this.trainBodyBox.setStyle(key, color);
|
||||
}
|
||||
}
|
||||
@ -1,61 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
|
||||
/** 车头*/
|
||||
export default class TrainHead extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
const baseMargin = (model.drect === -1 ? 1 : 0);
|
||||
this.line = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
x: model.point.x - baseMargin * (style.Train.trainHead.trainConntWidth),
|
||||
y: model.point.y,
|
||||
width: style.Train.trainHead.trainConntWidth * model.scale,
|
||||
height: style.Train.trainHead.trainHeadRectHeight
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.1,
|
||||
stroke: style.trainSidelineColor,
|
||||
fill: style.Train.trainHead.trainHeadFillColor
|
||||
}
|
||||
});
|
||||
this.arrow = new Polygon({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
points: [
|
||||
[model.point.x + model.drect * (style.Train.trainHead.trainHeadTriangleFirst.x), model.point.y + style.Train.trainHead.trainHeadTriangleFirst.y],
|
||||
[model.point.x + model.drect * (style.Train.trainHead.trainHeadTriangleSecond.x), model.point.y + style.Train.trainHead.trainHeadTriangleSecond.y],
|
||||
[model.point.x + model.drect * (style.Train.trainHead.trainHeadTriangleThird.x), model.point.y + style.Train.trainHead.trainHeadTriangleThird.y]
|
||||
]
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.1,
|
||||
stroke: style.trainSidelineColor,
|
||||
fill: style.Train.trainHead.trainHeadFillColor
|
||||
}
|
||||
});
|
||||
|
||||
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();
|
||||
}
|
||||
}
|
||||
@ -1,409 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import TrainHead from './TrainHead';
|
||||
import TrainBody from './TrainBody';
|
||||
import BoundingRect from 'zrender/src/core/BoundingRect';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
/** 列车 */
|
||||
export default class Train extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.z = 40;
|
||||
this.size = 0;
|
||||
this.section = null;
|
||||
this.fontSize = style.Train.common.useSelfText ? style.Train.common.nameFontSize || style.Train.common.trainTextFontSize : model.nameFontSize || style.Train.common.nameFontSize || style.Train.common.trainTextFontSize;
|
||||
this.newScale = this.fontSize / style.Train.common.trainTextFontSize;
|
||||
this.nameFormat = style.Train.common.useSelfFormat ? style.Train.trainBody.trainNameFormat : model.nameFormat || style.Train.trainBody.trainNameFormat;
|
||||
if ( style.Train.trainBody.specialTrainType.length > 0) {
|
||||
style.Train.trainBody.specialTrainType.some((item) =>{
|
||||
if (model.type === item.type) {
|
||||
this.nameFormat = item.nameFormat;
|
||||
model.serviceNumber = item.serviceNumber ? item.serviceNumber : model.serviceNumber;
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
this.create();
|
||||
this.setState(model);
|
||||
}
|
||||
|
||||
_computed() {
|
||||
const model = this.model;
|
||||
const style = this.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.Train.common.trainWidth - model.trainWindowModel.width) / 2);
|
||||
break;
|
||||
case '02': // 从左向右
|
||||
this.point.x = this.point.x + model.trainWindowModel.width / 2 - style.Train.trainHead.trainConntWidth * this.newScale - style.Train.common.trainWidth;
|
||||
break;
|
||||
case '03': // 从右向左
|
||||
this.point.x = this.point.x - model.trainWindowModel.width / 2 + style.Train.trainHead.trainConntWidth * this.newScale;
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
this.point = model.position;
|
||||
this.traingle = null;
|
||||
}
|
||||
}
|
||||
create() {
|
||||
this._computed();
|
||||
this.isChangeTrainWidth(this.model, this.style);
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
if (this.point) {
|
||||
this.trainB = new TrainBody({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
point: this.point,
|
||||
destinationStatus: model.destinationStatus,
|
||||
serviceNumber: model.serviceNumber,
|
||||
tripNumber: model.tripNumber,
|
||||
targetCode: model.targetCode,
|
||||
groupNumber: model.groupNumber,
|
||||
directionType: model.directionType,
|
||||
directionCode: model.directionCode,
|
||||
sectionModel: model.sectionModel,
|
||||
runControlStatus: model.runControlStatus,
|
||||
runStatus: model.runStatus,
|
||||
fontSize: this.fontSize,
|
||||
nameFormat: this.nameFormat,
|
||||
type: model.type,
|
||||
speed: model.speed,
|
||||
maLen: model.maLen,
|
||||
model: model
|
||||
});
|
||||
this.trainL = new TrainHead({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
point: {
|
||||
x: this.point.x - style.Train.common.trainHeadDistance,
|
||||
y: this.point.y
|
||||
},
|
||||
drect: -1,
|
||||
scale: this.newScale
|
||||
});
|
||||
|
||||
this.trainR = new TrainHead({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
point: {
|
||||
x: this.point.x + style.Train.common.trainWidth + style.Train.common.trainHeadDistance,
|
||||
y: this.point.y
|
||||
},
|
||||
drect: 1,
|
||||
scale: this.newScale
|
||||
});
|
||||
|
||||
this.add(this.trainB);
|
||||
this.add(this.trainL);
|
||||
this.add(this.trainR);
|
||||
}
|
||||
if (style.Train.common.haveTrainBorder) {
|
||||
this.createTrainBorder();
|
||||
}
|
||||
}
|
||||
|
||||
// 获取设备提示坐标
|
||||
getShapeTipPoint() {
|
||||
}
|
||||
|
||||
// 恢复颜色状态
|
||||
recover() {
|
||||
this.trainB && this.trainB.setHShow(false);
|
||||
this.trainB && this.trainB.setSShow(false);
|
||||
this.trainB && this.trainB.setDShow(false);
|
||||
this.trainB && this.trainB.setAShow(false);
|
||||
|
||||
this.trainL && this.trainL.setLineShow(false);
|
||||
this.trainR && this.trainR.setLineShow(false);
|
||||
this.trainL && this.trainL.setArrowShow(false);
|
||||
this.trainR && this.trainR.setArrowShow(false);
|
||||
}
|
||||
|
||||
// 设置服务号状态类型
|
||||
setServerNoType(type) {
|
||||
if (this.style.Train.trainStatusStyle.serverNoType.length > 0) {
|
||||
const flag = this.style.Train.trainStatusStyle.serverNoType.some((item) =>{
|
||||
if (type === item.type) {
|
||||
this.trainB && this.trainB.setTextTrainServerColor(item.showColor);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
if (this.style.Train.trainStatusStyle.defaultServerNoColor && !flag) {
|
||||
this.trainB && this.trainB.setTextTrainServerColor(this.style.Train.trainStatusStyle.defaultServerNoColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 设置目的地状态
|
||||
setDestinationStatus(status) {
|
||||
if (this.style.Train.trainStatusStyle.destinationStatus.length > 0) {
|
||||
const flag = this.style.Train.trainStatusStyle.destinationStatus.some((item) =>{
|
||||
if (status === item.status) {
|
||||
switch (this.style.Train.trainStatusStyle.destinationStatusSetText) {
|
||||
case 'trainTarget':
|
||||
this.trainB && this.trainB.setTextTrainTargetColor(item.showColor);
|
||||
break;
|
||||
case 'trainServer':
|
||||
this.trainB && this.trainB.setTextTrainServerColor(item.showColor);
|
||||
break;
|
||||
case 'trainWindowBorder':
|
||||
this.trainB && this.trainB.setBodyBoxShape('stroke', item.showColor);
|
||||
break;
|
||||
default:
|
||||
this.trainB && this.trainB.setTextTrainTargetColor(item.showColor);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
});
|
||||
if (this.style.Train.trainStatusStyle.defaultDestinationColor && !flag) {
|
||||
switch (this.style.Train.trainStatusStyle.destinationStatusSetText) {
|
||||
case 'trainTarget':
|
||||
this.trainB && this.trainB.setTextTrainTargetColor(this.style.Train.trainStatusStyle.defaultDestinationColor);
|
||||
break;
|
||||
case 'trainServer':
|
||||
this.trainB && this.trainB.setTextTrainServerColor(this.style.Train.trainStatusStyle.defaultDestinationColor);
|
||||
break;
|
||||
case 'trainWindowBorder':
|
||||
this.trainB && this.trainB.setBodyBoxShape('stroke', this.style.Train.trainStatusStyle.defaultDestinationColor);
|
||||
break;
|
||||
default:
|
||||
this.trainB && this.trainB.setTextTrainTargetColor(this.style.Train.trainStatusStyle.defaultDestinationColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 设置运行方向状态类型
|
||||
setDirectionType(type, flag) {
|
||||
if (this.style.Train.trainStatusStyle.directionType.length > 0) {
|
||||
this.style.Train.trainStatusStyle.directionType.forEach((item) => {
|
||||
if (type === item.type) {
|
||||
let lineLShow = item.lineLShow;
|
||||
let arrowLShow = item.arrowLShow;
|
||||
let lineRShow = item.lineRShow;
|
||||
let arrowRShow = item.arrowRShow;
|
||||
if (flag) {
|
||||
lineLShow = !item.lineLShow;
|
||||
arrowLShow = !item.arrowLShow;
|
||||
lineRShow = !item.lineRShow;
|
||||
arrowRShow = !item.arrowRShow;
|
||||
}
|
||||
this.trainL && this.trainL.setLineShow(lineLShow);
|
||||
this.trainL && this.trainL.setArrowShow(arrowLShow);
|
||||
this.trainR && this.trainR.setLineShow(lineRShow);
|
||||
this.trainR && this.trainR.setArrowShow(arrowRShow);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 设置列车停止方向类型
|
||||
setDirectionStopType(type) {
|
||||
if (this.style.Train.trainStatusStyle.directionStopType.length > 0) {
|
||||
this.style.Train.trainStatusStyle.directionStopType.forEach((item) => {
|
||||
if (type === item.type) {
|
||||
this.trainL && this.trainL.setLineShow(item.lineLShow);
|
||||
this.trainR && this.trainR.setLineShow(item.lineRShow);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 设置运行状态
|
||||
setRunStatus(status, flag) {
|
||||
switch (status) {
|
||||
case '01': // 停止
|
||||
this.setDirectionStopType(this.model.directionType); // 设置运行方向状态类型
|
||||
break;
|
||||
case '02': // 运行
|
||||
this.setDirectionType(this.model.directionType, flag); // 设置运行方向状态类型
|
||||
break;
|
||||
}
|
||||
|
||||
}
|
||||
// 设置运行模式
|
||||
setRunMode(status) {
|
||||
if (this.style.Train.trainStatusStyle.runModeStatus.length > 0) {
|
||||
this.style.Train.trainStatusStyle.runModeStatus.some((item) => {
|
||||
if (status === item.status) {
|
||||
this.trainL && this.trainL.setColor(item.trainLColor);
|
||||
this.trainR && this.trainR.setColor(item.trainRColor);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 设置运行控制状态类型
|
||||
setRunControlStatus(status) {
|
||||
if (this.style.Train.trainStatusStyle.runControlStatus.length > 0) {
|
||||
this.style.Train.trainStatusStyle.runControlStatus.some((item) => {
|
||||
if (status === item.status) {
|
||||
this.trainB && this.trainB.setHShow(item.hShow);
|
||||
this.trainB && this.trainB.setSShow(item.sShow);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 设置车门状态类型
|
||||
setDoorStatus(status) {
|
||||
if (this.style.Train.trainStatusStyle.doorStatus.length > 0) {
|
||||
this.style.Train.trainStatusStyle.doorStatus.some((item) => {
|
||||
if (status === item.status) {
|
||||
this.trainB && this.trainB.setDShow(item.dShow);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 设置通信状态类型
|
||||
setCommunicationStatus() {
|
||||
if (this.style.Train.trainStatusStyle.communicationStatus.length > 0) {
|
||||
this.style.Train.trainStatusStyle.communicationStatus.some((item) => {
|
||||
if (status === item.status) {
|
||||
this.trainB && this.trainB.setTrainColor(item.trainColor);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 设置报警状态
|
||||
setAlarmStatus(status) {
|
||||
if (this.style.Train.trainStatusStyle.alarmStatus.length > 0) {
|
||||
this.style.Train.trainStatusStyle.alarmStatus.some((item) => {
|
||||
if (status === item.status) {
|
||||
this.trainB && this.trainB.setAShow(item.aShow);
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
setTrainTypeStatus(type) {
|
||||
if (this.style.Train.trainStatusStyle.trainTypeStatus) {
|
||||
this.style.Train.trainStatusStyle.trainTypeStatus.some((item) => {
|
||||
if ( type === item.type) {
|
||||
item.serviceNumberColor && this.trainB && this.trainB.setTextTrainServerColor(item.serviceNumberColor);
|
||||
item.trainNumberColor && this.trainB && this.trainB.setTextTrainNumberColor(item.trainNumberColor);
|
||||
item.trainTargetColor && this.trainB && this.trainB.setTextTrainTargetColor(item.trainTargetColor);
|
||||
item.groupNumberColor && this.trainB && this.trainB.setTextTrainTargetNumberColor(item.groupNumberColor);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 设置状态
|
||||
setState(model) {
|
||||
this.model = model;
|
||||
// let points = [];
|
||||
const flag = false;
|
||||
// if (this.model.sectionModel && this.model.sectionModel.points) {
|
||||
// points = this.model.sectionModel.points;
|
||||
// if (points.length) {
|
||||
// const pointFlag = points[0].x - points[points.length - 1].x;
|
||||
// if (pointFlag > 0) {
|
||||
// flag = true; // 方向去反
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
if (model) {
|
||||
this.recover();
|
||||
this.setServerNoType(model.serverNoType); // 设置服务号状态类型
|
||||
this.setDestinationStatus(model.destinationStatus); // 设置目的地状态
|
||||
this.setRunStatus(model.runStatus, flag); // 设置运行状态
|
||||
this.setRunMode(model.runMode); // 设置运行模式
|
||||
this.setRunControlStatus(model.runControlStatus); // 设置运行控制状态类型
|
||||
this.setDoorStatus(model.doorStatus); // 设置车门状态类型
|
||||
this.setCommunicationStatus(model.communicationStatus); // 设置通信状态类型
|
||||
this.setAlarmStatus(model.alarmStatus); // 设置报警状态
|
||||
this.setTrainTypeStatus(model.type); // 根据列车类型设置列车识别号样式
|
||||
}
|
||||
}
|
||||
// 是否根据车身上车组号、服务号、车次号、目的地码显示情况改变列车长度
|
||||
isChangeTrainWidth(model, style) {
|
||||
if (!style.Train.trainBody.changeTrainWidth) { return; }
|
||||
if (this.nameFormat) {
|
||||
const arr = this.nameFormat.split(':');
|
||||
arr.forEach(ele => {
|
||||
switch (ele) {
|
||||
case 'targetCode': {
|
||||
this.size += (style.Train.trainNumber.targetCodePrefix || '').length;
|
||||
break;
|
||||
}
|
||||
case 'serviceNumber': {
|
||||
this.size += (style.Train.trainServer.serviceNumberPrefix || '').length;
|
||||
break;
|
||||
}
|
||||
case 'tripNumber': {
|
||||
this.size += (style.Train.trainTarget.tripNumberPrefix || '').length;
|
||||
break;
|
||||
}
|
||||
case 'groupNumber': {
|
||||
this.size += (style.Train.trainTargetNumber.groupNumberPrefix || '').length;
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.size = 9;
|
||||
}
|
||||
this.style.Train.common.trainWidth = this.size * this.fontSize * this.style.Train.common.aspectRatio + this.style.Train.common.trainWidthMoreText;
|
||||
}
|
||||
removeTrainDetail() {
|
||||
this.trainB && this.trainB.removeTrainDetail();
|
||||
}
|
||||
|
||||
getBoundingRect() {
|
||||
const list = [this.trainB, this.trainL, this.trainR];
|
||||
let rect = null;
|
||||
|
||||
list.forEach(elem => {
|
||||
if (elem) {
|
||||
const 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);
|
||||
}
|
||||
createTrainBorder() {
|
||||
const rect = Object.assign({}, this.getBoundingRect());
|
||||
rect.x -= this.style.Train.common.trainWidth / 2;
|
||||
rect.y -= 5;
|
||||
rect.width += this.style.Train.common.trainWidth;
|
||||
rect.height += 10;
|
||||
|
||||
this.trainBorder = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
silent: true,
|
||||
shape: rect,
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.trainBorder);
|
||||
}
|
||||
}
|
||||
@ -1,37 +0,0 @@
|
||||
export default class EMouse {
|
||||
constructor(device) {
|
||||
this.device = device;
|
||||
}
|
||||
|
||||
mouseover(e) {
|
||||
if (this.device.prdType) {
|
||||
this.device.setVisible(true);
|
||||
const instance = this.device.getInstanceByCode(this.device.model.sectionCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseover) {
|
||||
instance.mouseEvent.mouseEnter(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (this.device.prdType) {
|
||||
this.device.setVisible(false || this.device.model.trainWindowShow);
|
||||
const instance = this.device.getInstanceByCode(this.device.model.sectionCode);
|
||||
if (instance && instance.mouseEvent && instance.mouseEvent.mouseout) {
|
||||
instance.mouseEvent.mouseLeave(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseEnter(e) {
|
||||
if (this.device.prdType) {
|
||||
this.device.setVisible(true);
|
||||
}
|
||||
}
|
||||
|
||||
mouseLeave(e) {
|
||||
if (this.device.prdType ) {
|
||||
this.device.setVisible(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,83 +0,0 @@
|
||||
/* 车次窗*/
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import EMouse from './EMouse';
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
|
||||
class TrainWindow extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.z = 9;
|
||||
this.prdType = store.state.training.prdType;
|
||||
this.create(model);
|
||||
this.createMouseEvent();
|
||||
this.setState(model);
|
||||
}
|
||||
create(model) {
|
||||
if (this.prdType !== '01') {
|
||||
this.createTrainWindow();
|
||||
}
|
||||
}
|
||||
|
||||
createMouseEvent() {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
|
||||
/** 创建车次窗*/
|
||||
createTrainWindow() {
|
||||
const model = this.model;
|
||||
const point = model.point || model.position;
|
||||
this.trainRect = new Polygon({
|
||||
_subType: 'TrainWindow',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z - 1,
|
||||
shape: {
|
||||
smooth: this.style.TrainWindow.trainWindowSmooth,
|
||||
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: this.style.TrainWindow.lineDash,
|
||||
lineWidth: this.style.TrainWindow.lineWidth,
|
||||
stroke: this.style.TrainWindow.lineColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
this.add(this.trainRect);
|
||||
}
|
||||
|
||||
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) {
|
||||
this.setVisible(model.trainWindowShow);
|
||||
}
|
||||
|
||||
setVisible(show) {
|
||||
this.trainRect && this.trainRect.setStyle('lineWidth', show ? 1 : 0);
|
||||
|
||||
}
|
||||
|
||||
getInstanceByCode(code) {
|
||||
return (store.getters['map/getDeviceByCode'](code) || {}).instance;
|
||||
}
|
||||
}
|
||||
|
||||
export default TrainWindow;
|
||||
@ -1,54 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
export default class EMouse extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.device = device;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
this.text = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: this.device.zlevel,
|
||||
z: this.device.z+1,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: this.device.model.position.x,
|
||||
y: this.device.model.position.y + this.device.style.ZcControl.lamp.radiusR + this.device.style.ZcControl.text.distance-30,
|
||||
fontWeight: this.device.style.ZcControl.mouseOverStyle.fontWeight,
|
||||
fontSize: this.device.style.ZcControl.mouseOverStyle.fontSize,
|
||||
fontFamily: this.device.style.ZcControl.mouseOverStyle.fontFormat,
|
||||
text: this.device.model.name,
|
||||
textFill: this.device.style.ZcControl.mouseOverStyle.fontColor,
|
||||
textAlign: this.device.style.ZcControl.mouseOverStyle.textAlign,
|
||||
textVerticalAlign: this.device.style.ZcControl.mouseOverStyle.textVerticalAlign
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
this.text.hide();
|
||||
}
|
||||
mouseover(e) {
|
||||
if (e.target && e.target._subType == 'Text') {
|
||||
this.text.show();
|
||||
} else {
|
||||
this.device.control.setControlColor(this.device.style.ZcControl.mouseOverStyle.arcColor);
|
||||
this.device.control.setTextColor(this.device.style.ZcControl.mouseOverStyle.textColor);
|
||||
this.device.control.setTextBorder(true);
|
||||
this.device.control.setArcBorder(true);
|
||||
}
|
||||
}
|
||||
|
||||
mouseout(e) {
|
||||
if (!this.device.model.down) {
|
||||
if (e.target && e.target._subType == 'Text') {
|
||||
this.text.hide();
|
||||
} else {
|
||||
this.device.control.setControlColor(this.device.style.ZcControl.lamp.controlColor);
|
||||
this.device.control.setTextColor('#FFFFFF');
|
||||
this.device.control.setTextBorder(false);
|
||||
this.device.control.setArcBorder(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,80 +0,0 @@
|
||||
/*
|
||||
* ZC区域控制模式
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import EControl from '../element/EControl';
|
||||
import EMouse from './EMouse';
|
||||
|
||||
export default class ZcControl extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this.z = 20;
|
||||
this._code = model.code;
|
||||
this._type = model._type;
|
||||
this.zlevel = model.zlevel;
|
||||
this.model = model;
|
||||
this.style = style;
|
||||
this.create(model);
|
||||
this.createMouseEvent();
|
||||
this.setState(model);
|
||||
|
||||
}
|
||||
|
||||
create(model) {
|
||||
this.control = new EControl({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
arc: {
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: this.style.ZcControl.lamp.radiusR
|
||||
},
|
||||
lineWidth: 0,
|
||||
fill: this.style.ZcControl.lamp.controlColor,
|
||||
mouseover: this.mouseoverArc,
|
||||
mouseout: this.mouseoutArc
|
||||
},
|
||||
text: {
|
||||
position: [0, 0],
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.ZcControl.lamp.radiusR + this.style.ZcControl.text.distance,
|
||||
fontWeight: this.style.ZcControl.text.fontWeight,
|
||||
fontSize: this.style.ZcControl.text.fontSize,
|
||||
fontFamily: this.style.fontFamily,
|
||||
text: model.name,
|
||||
textFill: '#fff',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
mouseover: this.mouseoverText,
|
||||
mouseout: this.mouseoutText
|
||||
},
|
||||
style: this.style
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(model) {
|
||||
}
|
||||
createMouseEvent() {
|
||||
if (this.style.ZcControl.mouseOverStyle) {
|
||||
this.mouseEvent = new EMouse(this);
|
||||
this.add(this.mouseEvent);
|
||||
this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
|
||||
this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
|
||||
}
|
||||
}
|
||||
getShapeTipPoint() {
|
||||
if (this.control) {
|
||||
var distance = 2;
|
||||
var rect = this.control.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,46 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
export default class checkBox extends Group {
|
||||
constructor(model, style) {
|
||||
super();
|
||||
this.model = model;
|
||||
this._type = model._type;
|
||||
this._code = model.code;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.z;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
this.grouper = new Group({
|
||||
id: model.code,
|
||||
position: [model.point.x, model.point.y]
|
||||
});
|
||||
this.box = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
draggable: false,
|
||||
shape: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: this.model.width,
|
||||
height: this.model.height
|
||||
},
|
||||
style: {
|
||||
fill: 'rgb(135,206,250,0.2)'
|
||||
}
|
||||
});
|
||||
this.grouper.add(this.box);
|
||||
this.add(this.grouper);
|
||||
}
|
||||
setModel(dx, dy) {
|
||||
this.model.point.x += dx;
|
||||
this.model.point.y += dy;
|
||||
}
|
||||
setSize(width, height) {
|
||||
this.model.width = width;
|
||||
this.model.height = height;
|
||||
}
|
||||
}
|
||||
@ -1,106 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import { createBoundingRect } from '../../utils/parser';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
/** lc zc limit 单灯元素*/
|
||||
export default class EControl extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.z;
|
||||
this.style = model.style;
|
||||
this.textStyle = model.text;
|
||||
this.arcStyle = model.arc;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
this.control = new Arc({
|
||||
_subType: 'Control',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: this.arcStyle.shape,
|
||||
style: {
|
||||
lineWidth: this.arcStyle.lineWidth,
|
||||
fill: this.arcStyle.fill
|
||||
},
|
||||
onmouseover: this.arcStyle.mouseover,
|
||||
onmouseout: this.arcStyle.mouseout
|
||||
});
|
||||
|
||||
this.text = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: this.textStyle.position,
|
||||
style: {
|
||||
x: this.textStyle.x,
|
||||
y: this.textStyle.y,
|
||||
fontWeight: this.textStyle.fontWeight,
|
||||
fontSize: this.textStyle.fontSize,
|
||||
fontFamily: this.textStyle.fontFamily,
|
||||
text: this.textStyle.text,
|
||||
textFill: this.textStyle.textFill,
|
||||
textAlign: this.textStyle.textAlign,
|
||||
textVerticalAlign: this.textStyle.textVerticalAlign
|
||||
},
|
||||
onmouseover: this.textStyle.mouseover,
|
||||
onmouseout: this.textStyle.mouseout
|
||||
});
|
||||
const arcRect = this.getArcBoundingRect();
|
||||
const textRect = this.getTextBoundingRect();
|
||||
this.arcBorder = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
silent: true,
|
||||
shape: arcRect,
|
||||
style: {
|
||||
lineDash: this.style.arcBorderStyle.lineDash,
|
||||
stroke: this.style.arcBorderStyle.stroke,
|
||||
fill: this.style.arcBorderStyle.fill
|
||||
}
|
||||
});
|
||||
this.textBorder = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z-1,
|
||||
silent: true,
|
||||
shape: textRect,
|
||||
style: {
|
||||
lineDash: this.style.textBorderStyle.lineDash,
|
||||
stroke: this.style.textBorderStyle.stroke,
|
||||
fill: this.style.textBorderStyle.fill
|
||||
}
|
||||
});
|
||||
this.add(this.control);
|
||||
this.add(this.text);
|
||||
this.add(this.textBorder);
|
||||
this.add(this.arcBorder);
|
||||
this.textBorder.hide();
|
||||
this.arcBorder.hide();
|
||||
}
|
||||
setTextBorder(flag) {
|
||||
flag?this.textBorder.show():this.textBorder.hide();
|
||||
}
|
||||
setArcBorder(flag) {
|
||||
flag?this.arcBorder.show():this.arcBorder.hide();
|
||||
}
|
||||
getTextBoundingRect() {
|
||||
return createBoundingRect(this.text);
|
||||
}
|
||||
getArcBoundingRect() {
|
||||
return createBoundingRect(this.control);
|
||||
}
|
||||
setControlColor(color) {
|
||||
if (color) {
|
||||
this.control.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
setTextColor(color) {
|
||||
if (color) {
|
||||
this.text.setStyle('textFill', color);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,71 +0,0 @@
|
||||
// import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
/** 名称元素*/
|
||||
export default function ETextName(model) {
|
||||
const TextName = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
silent: model.silent || false,
|
||||
style: {
|
||||
x: model.x,
|
||||
y: model.y,
|
||||
fontWeight: model.fontWeight,
|
||||
fontSize: model.fontSize,
|
||||
fontFamily: model.fontFamily,
|
||||
text: model.text,
|
||||
textStrokeWidth: model.textStrokeWidth,
|
||||
textFill: model.textFill,
|
||||
textAlign: model.textAlign,
|
||||
textPosition: model.textPosition || 'inside',
|
||||
textVerticalAlign: model.textVerticalAlign || null
|
||||
}
|
||||
});
|
||||
return TextName;
|
||||
}
|
||||
// export default class ETextName extends Group {
|
||||
// constructor(model) {
|
||||
// super();
|
||||
// this.model = model;
|
||||
// this.zlevel = model.zlevel;
|
||||
// this.z = model.z;
|
||||
// this.create();
|
||||
// }
|
||||
|
||||
// create() {
|
||||
// this.TextName = new Text({
|
||||
// _subType: this.model._subType,
|
||||
// zlevel: this.zlevel,
|
||||
// z: this.z,
|
||||
// silent: this.model.silent || false,
|
||||
// style: {
|
||||
// x: this.model.x,
|
||||
// y: this.model.y,
|
||||
// text: this.model.text,
|
||||
// textFont: this.model.textFont,
|
||||
// textFill: this.model.textFill,
|
||||
// textAlign: this.model.textAlign,
|
||||
// textPosition: this.model.textPosition || 'inside',
|
||||
// textVerticalAlign: this.model.textVerticalAlign || null
|
||||
// }
|
||||
// });
|
||||
// this.add(this.TextName);
|
||||
// }
|
||||
|
||||
// setStyle(model) {
|
||||
// this.TextName.setStyle(model);
|
||||
// }
|
||||
|
||||
// setColor(color) {
|
||||
// this.TextName.setStyle('textFill', color);
|
||||
// }
|
||||
|
||||
// hide() {
|
||||
// this.TextName.hide();
|
||||
// }
|
||||
|
||||
// show() {
|
||||
// this.TextName.show();
|
||||
// }
|
||||
// }
|
||||
@ -1,53 +0,0 @@
|
||||
import deviceType from '../constant/deviceType';
|
||||
import Link from './Link/index.js';
|
||||
import Section from './Section/index.js';
|
||||
import Signal from './Signal/index.js';
|
||||
import Station from './Station/index.js';
|
||||
import StationControl from './StationControl/index.js';
|
||||
import ImageControl from './ImageControl/index.js';
|
||||
import LcControl from './LcControl/index.js';
|
||||
import LimitControl from './LimitControl/index.js';
|
||||
import Switch from './Switch/index.js';
|
||||
import ZcControl from './ZcControl/index.js';
|
||||
import ButtonControl from './ButtonControl/index.js';
|
||||
import StationCounter from './StationCounter/index.js';
|
||||
import StationDelayUnlock from './StationDelayUnlock/index.js';
|
||||
import StationStand from './StationStand/index.js';
|
||||
import TrainWindow from './TrainWindow/index.js';
|
||||
import Train from './Train/index.js';
|
||||
import Line from './Line/index.js';
|
||||
import Text2 from './Text/index.js';
|
||||
import CheckBox from './checkBox/checkBox.js';
|
||||
|
||||
/** 图库*/
|
||||
const mapShape = {};
|
||||
mapShape[deviceType.Link] = Link;
|
||||
mapShape[deviceType.Section] = Section;
|
||||
mapShape[deviceType.Signal] = Signal;
|
||||
mapShape[deviceType.Station] = Station;
|
||||
mapShape[deviceType.StationControl] = StationControl;
|
||||
mapShape[deviceType.ImageControl] = ImageControl;
|
||||
mapShape[deviceType.LcControl] = LcControl;
|
||||
mapShape[deviceType.LimitControl] = LimitControl;
|
||||
mapShape[deviceType.Switch] = Switch;
|
||||
mapShape[deviceType.ZcControl] = ZcControl;
|
||||
mapShape[deviceType.ButtonControl] = ButtonControl;
|
||||
mapShape[deviceType.StationCounter] = StationCounter;
|
||||
mapShape[deviceType.StationDelayUnlock] = StationDelayUnlock;
|
||||
mapShape[deviceType.StationStand] = StationStand;
|
||||
mapShape[deviceType.TrainWindow] = TrainWindow;
|
||||
mapShape[deviceType.Train] = Train;
|
||||
mapShape[deviceType.Line] = Line;
|
||||
mapShape[deviceType.Text] = Text2;
|
||||
mapShape[deviceType.CheckBox] = CheckBox;
|
||||
|
||||
function shapefactory(device, jmap) {
|
||||
const type = device._type;
|
||||
const shape = mapShape[type];
|
||||
if (shape instanceof Function) {
|
||||
// eslint-disable-next-line
|
||||
return new shape(device, jmap.style);
|
||||
}
|
||||
}
|
||||
|
||||
export default shapefactory;
|
||||
@ -1,102 +0,0 @@
|
||||
import Path from 'zrender/src/graphic/Path';
|
||||
|
||||
/** 指向箭头坐标*/
|
||||
export function arrow(modelX, modelY, length, radius) {
|
||||
return [
|
||||
[modelX - length, modelY],
|
||||
[modelX - length + radius / 1.5, modelY - radius / 1.2],
|
||||
[modelX - length + radius / 1.5, modelY - radius / 3],
|
||||
[modelX + length, modelY - radius / 3],
|
||||
[modelX + length, modelY + radius / 3],
|
||||
[modelX - length + radius / 1.5, modelY + radius / 3],
|
||||
[modelX - length + radius / 1.5, modelY + radius / 1.2]
|
||||
];
|
||||
}
|
||||
|
||||
/** 指向三角形坐标*/
|
||||
export function triangular(modelX, modelY, drict, radius) {
|
||||
return [
|
||||
[modelX, modelY],
|
||||
[modelX - drict * (radius + 2), modelY - radius],
|
||||
[modelX - drict * (radius + 2), modelY + radius]
|
||||
];
|
||||
}
|
||||
|
||||
/** 屏蔽门手电筒*/
|
||||
export function flashlight(modelX, modelY, drict, width, height, offsetx, offsety, beyond) {
|
||||
return [
|
||||
[modelX + drict * (offsetx), modelY + drict * offsety - (height + beyond) / 2],
|
||||
[modelX + drict * (offsetx + beyond), modelY + drict * offsety - height / 2],
|
||||
[modelX + drict * (offsetx + beyond + width), modelY + drict * offsety - height / 2],
|
||||
[modelX + drict * (offsetx + beyond + width), modelY + drict * offsety + height / 2],
|
||||
[modelX + drict * (offsetx + beyond), modelY + drict * offsety + height / 2],
|
||||
[modelX + drict * (offsetx), modelY + drict * offsety + (height + beyond) / 2]
|
||||
];
|
||||
}
|
||||
|
||||
/** 区段限速体带方向*/
|
||||
export function limitArrows(modelX, modelY, drict, radius) {
|
||||
return [
|
||||
[modelX + drict * radius, modelY - radius],
|
||||
[modelX + drict * radius, modelY + radius],
|
||||
[modelX - drict * radius, modelY + radius],
|
||||
[modelX - drict * radius * 1.8, modelY],
|
||||
[modelX - drict * radius, modelY - radius]
|
||||
];
|
||||
}
|
||||
|
||||
/** 区段折返标记*/
|
||||
export function turnbackArrows(modelX, modelY, drict, width, height) {
|
||||
return [
|
||||
[modelX - drict * (width - 1), modelY + height],
|
||||
[modelX + drict * width / 2, modelY + height],
|
||||
[modelX + drict * width / 2, modelY - height],
|
||||
[modelX - drict * (width - 3), modelY - height]
|
||||
];
|
||||
}
|
||||
|
||||
export const Ugraph = Path.extend({
|
||||
type: 'ugraph',
|
||||
|
||||
shape: {
|
||||
points: null,
|
||||
counterclockwise: true
|
||||
},
|
||||
|
||||
style: {
|
||||
stroke: '#000',
|
||||
fill: null
|
||||
},
|
||||
|
||||
buildPath: function (ctx, shape) {
|
||||
var points = shape.points;
|
||||
var r = Math.abs(points[1][1] - points[2][1]) / 2;
|
||||
var x = Math.abs(points[1][0] + points[2][0]) / 2;
|
||||
var y = Math.abs(points[1][1] + points[2][1]) / 2;
|
||||
ctx.moveTo(points[0][0], points[0][1]);
|
||||
ctx.lineTo(points[1][0], points[1][1]);
|
||||
|
||||
shape.counterclockwise && ctx.arc(x, y, r, Math.PI / 2, Math.PI * 3 / 2, false);
|
||||
shape.counterclockwise || ctx.arc(x, y, r, Math.PI / 2, -Math.PI / 2, true);
|
||||
|
||||
ctx.moveTo(points[2][0], points[2][1]);
|
||||
ctx.lineTo(points[3][0], points[3][1]);
|
||||
|
||||
ctx.closePath();
|
||||
|
||||
points = shape.points;
|
||||
r = Math.abs(points[1][1] - points[2][1]) / 2;
|
||||
x = Math.abs(points[1][0] + points[2][0]) / 2;
|
||||
y = Math.abs(points[1][1] + points[2][1]) / 2;
|
||||
ctx.moveTo(points[0][0], points[0][1]);
|
||||
ctx.lineTo(points[1][0], points[1][1]);
|
||||
|
||||
shape.counterclockwise && ctx.arc(x, y, r, Math.PI / 2, Math.PI * 3 / 2, false);
|
||||
shape.counterclockwise || ctx.arc(x, y, r, Math.PI / 2, -Math.PI / 2, true);
|
||||
|
||||
ctx.moveTo(points[2][0], points[2][1]);
|
||||
ctx.lineTo(points[3][0], points[3][1]);
|
||||
|
||||
ctx.closePath();
|
||||
}
|
||||
});
|
||||
@ -1,34 +0,0 @@
|
||||
class Theme {
|
||||
constructor(code) {
|
||||
this._code = '02';
|
||||
this._mapMenu = {
|
||||
// '01': 'chengdu_04',
|
||||
'02': 'fuzhou_01',
|
||||
// '03': 'beijing_01',
|
||||
// '04': 'chengdu_03',
|
||||
'05': 'fuzhou_01' // 国际版运行图皮肤 指向05 福州线路
|
||||
};
|
||||
}
|
||||
|
||||
// 加载菜单组件
|
||||
loadMenuComponent(code) {
|
||||
return Object.assign({}, require(`./${this._mapMenu[code || this._code]}/menus/index`).default);
|
||||
}
|
||||
|
||||
// 加载运行图计划表组件
|
||||
loadPlanComponent(code) {
|
||||
return Object.assign({}, require(`./${this._mapMenu[code || this._code]}/planSchedule/index`).default);
|
||||
}
|
||||
|
||||
// 加载运行图解析和转化函数
|
||||
loadPlanConvert(code) {
|
||||
return require(`./${this._mapMenu[code || this._code]}/planConvert`).default;
|
||||
}
|
||||
|
||||
// 共有字段转换
|
||||
loadPropConvert(code) {
|
||||
return require(`./${this._mapMenu[code || this._code]}/model`).default;
|
||||
}
|
||||
}
|
||||
|
||||
export default Theme;
|
||||
@ -1,86 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm notice-info"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="360px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
>
|
||||
<div class="context">
|
||||
<template v-for="(message,index) in messages">
|
||||
<div :key="index">{{ message }}</div>
|
||||
</template>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="8">
|
||||
<el-button :id="domIdSure" type="primary" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { OperationEvent } from '@/scripts/ConstDic';
|
||||
|
||||
export default {
|
||||
name: 'NoticeInfo',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
messages: [this.$t('tip.commandFailed')],
|
||||
operate: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return this.$t('tip.hint');
|
||||
},
|
||||
domIdSure() {
|
||||
return this.dialogShow ? OperationEvent.Command.close.notice.domId : '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, messages) {
|
||||
this.operate = operate || {};
|
||||
this.dialogShow = true;
|
||||
this.messages = [this.$t('tip.commandFailed')];
|
||||
if (messages) {
|
||||
this.messages = messages;
|
||||
}
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
this.doClose();
|
||||
},
|
||||
cancel() {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.notice-info .context {
|
||||
padding-bottom: 40px !important;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
</style>
|
||||
@ -1,372 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm confirm-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="360px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
>
|
||||
<div class="context">
|
||||
<template v-for="(message,index) in messages">
|
||||
<span :key="index">{{ message }}</span>
|
||||
</template>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'ConfirmControl',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
operate: {},
|
||||
messages: '',
|
||||
operation: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
if (this.operation === OperationEvent.Signal.arrangementRoute.menu.operation) {
|
||||
return this.$t('menu.accessSetting');
|
||||
} else if (this.operation === OperationEvent.Signal.signalClose.menu.operation) {
|
||||
return this.$t('menu.menuSignal.signalOff');
|
||||
} else if (this.operation === OperationEvent.Signal.reopenSignal.menu.operation) {
|
||||
return this.$t('menu.menuSignal.signalReopen');
|
||||
} else if (this.operation === OperationEvent.Signal.cancelTrainRoute.menu.operation) {
|
||||
return this.$t('menu.cancelTheWay');
|
||||
} else if (this.operation === OperationEvent.Signal.humanControl.menu.operation) {
|
||||
return this.$t('menu.approachManualControl');
|
||||
} else if (this.operation === OperationEvent.Signal.atsAutoControl.menu.operation) {
|
||||
return this.$t('menu.accessToATSAutomaticControl');
|
||||
} else if (this.operation === OperationEvent.StationStand.setRunLevel.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.setRunLevel');
|
||||
} else if (this.operation === OperationEvent.StationStand.setStopTime.menu.operation) {
|
||||
return this.$t('menu.stopTime');
|
||||
} else if (this.operation === OperationEvent.StationStand.setBackStrategy.menu.operation) {
|
||||
return this.$t('menu.setSwitchbackStrategy');
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation === OperationEvent.Signal.arrangementRoute.menu.operation) {
|
||||
/** 进路设置*/
|
||||
return OperationEvent.Signal.arrangementRoute.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Signal.signalClose.menu.operation) {
|
||||
/** 信号关灯*/
|
||||
return OperationEvent.Signal.signalClose.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Signal.reopenSignal.menu.operation) {
|
||||
/** 信号重开*/
|
||||
return OperationEvent.Signal.reopenSignal.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Signal.cancelTrainRoute.menu.operation) {
|
||||
/** 取消进路*/
|
||||
return OperationEvent.Signal.cancelTrainRoute.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Signal.humanControl.menu.operation) {
|
||||
/** 进路交人工控*/
|
||||
return OperationEvent.Signal.humanControl.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Signal.atsAutoControl.menu.operation) {
|
||||
/** 进路交ATS自动控*/
|
||||
return OperationEvent.Signal.atsAutoControl.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.StationStand.setRunLevel.menu.operation) {
|
||||
/** 设置运行等级*/
|
||||
return OperationEvent.StationStand.setRunLevel.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.StationStand.setStopTime.menu.operation) {
|
||||
/** 设置停站时间*/
|
||||
return OperationEvent.StationStand.setStopTime.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.StationStand.setBackStrategy.menu.operation) {
|
||||
/** 设置折返策略*/
|
||||
return OperationEvent.StationStand.setBackStrategy.confirm.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate) {
|
||||
if (!this.dialogShow) {
|
||||
this.loading = false;
|
||||
this.operate = operate || {};
|
||||
this.messages = operate.messages;
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
if (this.operation === OperationEvent.Signal.arrangementRoute.menu.operation) {
|
||||
/** 进路设置*/
|
||||
this.routeSetting();
|
||||
} else if (this.operation === OperationEvent.Signal.signalClose.menu.operation) {
|
||||
/** 信号关灯*/
|
||||
this.signalClose();
|
||||
} else if (this.operation === OperationEvent.Signal.reopenSignal.menu.operation) {
|
||||
/** 信号重开*/
|
||||
this.reopenSignal();
|
||||
} else if (this.operation === OperationEvent.Signal.cancelTrainRoute.menu.operation) {
|
||||
/** 取消进路*/
|
||||
this.cancelTrainRoute();
|
||||
} else if (this.operation === OperationEvent.Signal.humanControl.menu.operation) {
|
||||
/** 进路交人工控*/
|
||||
this.humanControl();
|
||||
} else if (this.operation === OperationEvent.Signal.atsAutoControl.menu.operation) {
|
||||
/** 进路交ATS自动控*/
|
||||
this.atsAutoControl();
|
||||
} else if (this.operation === OperationEvent.StationStand.setRunLevel.menu.operation) {
|
||||
/** 设置运行等级*/
|
||||
this.setRunLevel();
|
||||
} else if (this.operation === OperationEvent.StationStand.setStopTime.menu.operation) {
|
||||
/** 停站时间*/
|
||||
this.setStopTime();
|
||||
} else if (this.operation === OperationEvent.StationStand.setBackStrategy.menu.operation) {
|
||||
/** 设置折返策略*/
|
||||
this.setBackStrategy();
|
||||
}
|
||||
},
|
||||
// 进路设置
|
||||
routeSetting() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.Signal.arrangementRoute.confirm.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 信号关灯
|
||||
signalClose() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.Signal.signalClose.confirm.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 信号重开
|
||||
reopenSignal() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.Signal.reopenSignal.confirm.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 取消进路
|
||||
cancelTrainRoute() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.Signal.cancelTrainRoute.confirm.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 进路交人工控
|
||||
humanControl() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.humanControl.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 进路交ATS自动控
|
||||
atsAutoControl() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.atsAutoControl.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 设置运行等级
|
||||
setRunLevel() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.StationStand.setRunLevel.confirm.operation,
|
||||
val: this.operate.val
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 停站时间
|
||||
setStopTime() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.StationStand.setStopTime.confirm.operation,
|
||||
val: this.operate.val
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 设置折返策略
|
||||
setBackStrategy() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.StationStand.setBackStrategy.confirm.operation,
|
||||
val: this.operate.val
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.confirm-control .context {
|
||||
padding-bottom: 40px !important;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
</style>
|
||||
@ -1,165 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm confirm-control-speed"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="540px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
>
|
||||
<div style="height: 60px; padding-left: 20px">
|
||||
<span style="font-size: 18px">{{ message }}</span>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="6" :offset="6">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { OperationEvent } from '@/scripts/ConstDic';
|
||||
|
||||
export default {
|
||||
name: 'ConfirmControlSpeed',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
type: '',
|
||||
operation: '',
|
||||
message: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation === OperationEvent.Section.setSpeed.order.operation) {
|
||||
return this.$t('menu.menuSection.sectionSetSpeedLimit');
|
||||
} else if (this.operation === OperationEvent.Section.cancelSpeed.order.operation) {
|
||||
return this.$t('menu.menuSection.sectionCancelSpeedLimit');
|
||||
} else if (this.operation === OperationEvent.Switch.setSpeed.order.operation) {
|
||||
return this.$t('menu.switchSettingSpeedLimit');
|
||||
} else if (this.operation === OperationEvent.Switch.cancelSpeed.order.operation) {
|
||||
return this.$t('menu.menuSection.sectionCancelSpeedLimit');
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation === OperationEvent.Section.setSpeed.order.operation) {
|
||||
/** 区段设置限速*/
|
||||
return OperationEvent.Section.setSpeed.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Section.cancelSpeed.order.operation) {
|
||||
/** 区段取消限速*/
|
||||
return OperationEvent.Section.cancelSpeed.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Switch.setSpeed.order.operation) {
|
||||
/** 道岔设置限速*/
|
||||
return OperationEvent.Switch.setSpeed.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Switch.cancelSpeed.order.operation) {
|
||||
/** 道岔取消限速*/
|
||||
return OperationEvent.Switch.cancelSpeed.confirm.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate) {
|
||||
if (!this.dialogShow) {
|
||||
this.type = operate.type;
|
||||
this.operation = operate.operation;
|
||||
this.message = operate.message;
|
||||
}
|
||||
|
||||
this.loading = false;
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
type: this.type
|
||||
};
|
||||
|
||||
if (this.operation === OperationEvent.Section.setSpeed.order.operation) {
|
||||
/** 区段设置限速*/
|
||||
operate.operation = OperationEvent.Section.setSpeed.confirm.operation;
|
||||
} else if (this.operation === OperationEvent.Section.cancelSpeed.order.operation) {
|
||||
/** 区段取消限速*/
|
||||
operate.operation = OperationEvent.Section.cancelSpeed.confirm.operation;
|
||||
} else if (this.operation === OperationEvent.Switch.setSpeed.order.operation) {
|
||||
/** 道岔设置限速*/
|
||||
operate.operation = OperationEvent.Switch.setSpeed.confirm.operation;
|
||||
} else if (this.operation === OperationEvent.Switch.cancelSpeed.order.operation) {
|
||||
/** 道岔取消限速*/
|
||||
operate.operation = OperationEvent.Switch.cancelSpeed.confirm.operation;
|
||||
}
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
if (valid) {
|
||||
this.$emit('setOperate', { step: 1, success: true });
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$emit('setOperate', { step: 0, success: false });
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: this.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
if (valid) {
|
||||
this.$emit('setOperate', { step: 0, success: false });
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.confirm-control-speed .context {
|
||||
padding-bottom: 40px !important;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
</style>
|
||||
@ -1,128 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm route-unlock-confirm"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="500px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
>
|
||||
<div style="height: 60px; padding-left: 20px">
|
||||
<span>{{ $t('menu.in') }}{{ stationName }}【{{ signalName }}】{{ $t('menu.signalConfirmed') }}</span>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="6" :offset="6">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
|
||||
export default {
|
||||
name: 'RouteUnlockConfirm',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
signalName: '',
|
||||
stationName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.signalDeblocking');
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.Signal.unlock.confirm.domId : '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
this.stationName = '';
|
||||
this.signalName = '';
|
||||
if (selected) {
|
||||
this.signalName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
|
||||
this.loading = false;
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.unlock.confirm.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
if (valid) {
|
||||
this.$emit('setOperate', { step: 1, success: true });
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$emit('setOperate', { step: 0, success: false });
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
if (valid) {
|
||||
this.$emit('setOperate', { step: 0, success: false });
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.route-unlock-confirm .context {
|
||||
padding-bottom: 40px !important;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
</style>
|
||||
@ -1,180 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm confirm-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="360px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
>
|
||||
<div class="context">
|
||||
<template v-for="(message,index) in messages">
|
||||
<span :key="index">{{ message }}</span>
|
||||
</template>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { OperationEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'ConfirmTrain',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
operate: {},
|
||||
messages: '',
|
||||
operation: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
if (this.operation === OperationEvent.Train.addTrainId.menu.operation) {
|
||||
return this.$t('menu.menuTrain.addTrainId');
|
||||
} else if (this.operation === OperationEvent.Train.editTrainId.menu.operation) {
|
||||
return this.$t('menu.menuTrain.editTrainId');
|
||||
} else if (this.operation === OperationEvent.Train.delTrainId.menu.operation) {
|
||||
return this.$t('menu.menuTrain.deleteTrainId');
|
||||
} else if (this.operation === OperationEvent.Train.moveTrainId.menu.operation) {
|
||||
return this.$t('menu.menuTrain.moveTrainId');
|
||||
} else if (this.operation === OperationEvent.Train.switchTrainId.menu.operation) {
|
||||
return this.$t('menu.menuTrain.switchTrainId');
|
||||
} else if (this.operation === OperationEvent.Train.editTrainNo.menu.operation) {
|
||||
return this.$t('menu.menuTrain.editTrainNo');
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation === OperationEvent.Train.addTrainId.menu.operation) {
|
||||
/** 添加列车识别号*/
|
||||
return OperationEvent.Train.addTrainId.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Train.editTrainId.menu.operation) {
|
||||
/** 修改列车识别号*/
|
||||
return OperationEvent.Train.editTrainId.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Train.delTrainId.menu.operation) {
|
||||
/** 删除列车识别号*/
|
||||
return OperationEvent.Train.delTrainId.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Train.moveTrainId.menu.operation) {
|
||||
/** 移动列车识别号*/
|
||||
return OperationEvent.Train.moveTrainId.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Train.switchTrainId.menu.operation) {
|
||||
/** 交换列车识别号*/
|
||||
return OperationEvent.Train.switchTrainId.confirm.domId;
|
||||
} else if (this.operation === OperationEvent.Train.editTrainNo.menu.operation) {
|
||||
/** 修改车组号*/
|
||||
return OperationEvent.Train.editTrainNo.confirm.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate) {
|
||||
if (!this.dialogShow) {
|
||||
this.loading = false;
|
||||
this.operate = operate || {};
|
||||
this.messages = operate.messages;
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('map/setTrainWindowShow', false);
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
if (this.operation === OperationEvent.Train.addTrainId.menu.operation) {
|
||||
this.routeSetting();
|
||||
} else if (this.operation === OperationEvent.Train.editTrainId.menu.operation) {
|
||||
this.routeSetting();
|
||||
} else if (this.operation === OperationEvent.Train.delTrainId.menu.operation) {
|
||||
this.routeSetting();
|
||||
} else if (this.operation === OperationEvent.Train.moveTrainId.menu.operation) {
|
||||
this.routeSetting();
|
||||
} else if (this.operation === OperationEvent.Train.switchTrainId.menu.operation) {
|
||||
this.routeSetting();
|
||||
} else if (this.operation === OperationEvent.Train.editTrainNo.menu.operation) {
|
||||
this.routeSetting();
|
||||
}
|
||||
},
|
||||
// 进路设置
|
||||
routeSetting() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.Train.addTrainId.confirm.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: this.operate.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.confirm-control .context {
|
||||
padding-bottom: 40px !important;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
</style>
|
||||
@ -1,453 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm route-cmd-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="840px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<div style="padding: 10px 20px; border: 1px solid lightgray;">
|
||||
<span class="base-label">{{ $t('menu.commandInformation') }}</span>
|
||||
<el-form label-position="center" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="this.$t('menu.type')" label-width="40px">
|
||||
<el-select v-model="operation" size="small" disabled>
|
||||
<el-option
|
||||
v-for="option in typeList"
|
||||
:key="option.code"
|
||||
:label="option.name"
|
||||
:value="option.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="this.$t('menu.stationName')" label-width="80px">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="this.$t('menu.signalName')" label-width="100px">
|
||||
<el-input v-model="signalName" size="small" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table
|
||||
ref="tempData"
|
||||
class="table"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
height="200"
|
||||
>
|
||||
<el-table-column prop="order" :width="110" :label="this.$t('menu.serialNumber2')" />
|
||||
<el-table-column prop="date" :width="160" :label="this.$t('menu.time')" />
|
||||
<el-table-column prop="context" :width="180" :label="this.$t('menu.implementationProcess')" />
|
||||
<el-table-column prop="result" :label="this.$t('menu.executionResult')" />
|
||||
</el-table>
|
||||
<span class="notice">{{ message }}</span>
|
||||
<el-row class="button-group">
|
||||
<el-col :span="2" :offset="3">
|
||||
<el-button :id="domIdCommand" type="primary" :disabled="cmdDisabled[0]" @click="command">{{ $t('menu.release') }}<span
|
||||
v-show="timeCountCommand>0"
|
||||
>({{ timeCountCommand }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdConfirm1" style="width:120px;" type="primary" :disabled="cmdDisabled[1]" @click="confirm1">{{ $t('menu.firstConfirm') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdConfirm2" type="primary" style="width:120px;" :disabled="cmdDisabled[2]" @click="confirm2">{{ $t('menu.secondConfirm') }}<span
|
||||
v-show="timeCountConfirm>0"
|
||||
>({{ timeCountConfirm }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdStop" type="primary" :disabled="stpDisabled" @click="stop">{{ $t('menu.suspend') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdClose" @click="close">{{ $t('global.close') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
<confirm-signal-unlock ref="confirmSignalUnlock" @setOperate="getOperate" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import { now } from '@/utils/date';
|
||||
import ConfirmSignalUnlock from './childDialog/confirmSignalUnlock';
|
||||
|
||||
export default {
|
||||
name: 'RouteCmdControl',
|
||||
components: {
|
||||
ConfirmSignalUnlock
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
backOperate: '',
|
||||
selected: '',
|
||||
order: 0,
|
||||
row: null,
|
||||
timer: null,
|
||||
operation: '',
|
||||
cmdDisabled: [true, true, true],
|
||||
stpDisabled: true,
|
||||
tempData: [],
|
||||
message: '',
|
||||
timeCountCommand: -1,
|
||||
timeCountConfirm: -1,
|
||||
stationName: '',
|
||||
signalName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
typeList() {
|
||||
return [
|
||||
{ code: OperationEvent.Signal.unlock.menu.operation, name: this.$t('menu.menuSignal.signalDeblock') },
|
||||
{ code: OperationEvent.Signal.guide.menu.operation, name: this.$t('menu.menuSignal.guideRouteHandle') }
|
||||
];
|
||||
},
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCommand() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
return OperationEvent.Signal.unlock.order.domId;
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
return OperationEvent.Signal.guide.order.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdConfirm1() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
return OperationEvent.Signal.unlock.confirm1.domId;
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
return OperationEvent.Signal.guide.confirm1.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdConfirm2() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
return OperationEvent.Signal.unlock.confirm2.domId;
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
return OperationEvent.Signal.guide.confirm2.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdStop() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
return OperationEvent.Signal.unlock.stop.domId;
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
return OperationEvent.Signal.guide.stop.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdClose() {
|
||||
if (this.dialogShow) {
|
||||
return OperationEvent.Command.close.menu.domId;
|
||||
}
|
||||
return '';
|
||||
},
|
||||
title() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
return '信号解封';
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
return '办理引导进路';
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
cmdDisabled: {
|
||||
handler(val, oldVal) {
|
||||
this.stpDisabled = true;
|
||||
val.forEach((elem, index) => {
|
||||
// 在确定1之前的操作才可以终止
|
||||
if (elem == false && index >= 1 && index <= 2) {
|
||||
this.stpDisabled = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
this.timer = setInterval(() => {
|
||||
if (!this.$store.state.menuOperation.break) {
|
||||
if (this.timeCountCommand > 0) {
|
||||
this.timeCountCommand--;
|
||||
} else if (this.timeCountCommand == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountCommand = -1;
|
||||
}
|
||||
if (this.timeCountConfirm > 0) {
|
||||
this.timeCountConfirm--;
|
||||
} else if (this.timeCountConfirm == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountConfirm = -1;
|
||||
}
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
if (!this.dialogShow) {
|
||||
this.signalName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase()) {
|
||||
this.signalName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
this.selected = selected;
|
||||
}
|
||||
|
||||
this.order = 0;
|
||||
this.operation = operate.operation;
|
||||
|
||||
this.tempData = [];
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.cmdDisabled = [false, true, true];
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.stpDisabled = true;
|
||||
this.setMessage(this.$t('tip.releaseTip'));
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
command() {
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 第一步带弹框处理*/
|
||||
this.commandHasPopUp();
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 第一步不带弹框处理*/
|
||||
this.commandNoPopUp();
|
||||
}
|
||||
},
|
||||
commandHasPopUp() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
operate.operation = OperationEvent.Signal.unlock.order.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.firstConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
this.$refs.confirmSignalUnlock.doShow(operate, this.selected);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
commandNoPopUp() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
operate.operation = OperationEvent.Signal.guide.order.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.firstConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 1 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm1() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
operate.operation = OperationEvent.Signal.unlock.confirm1.operation;
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
operate.operation = OperationEvent.Signal.guide.confirm1.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.secondConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = 10;
|
||||
this.setButtonEnable({ step: 2 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm2() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
operate.operation = OperationEvent.Signal.unlock.confirm2.operation;
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
operate.operation = OperationEvent.Signal.guide.confirm2.operation;
|
||||
}
|
||||
this.setMessage('');
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
stop() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
operate.operation = OperationEvent.Signal.unlock.stop.operation;
|
||||
} else if (this.operation == OperationEvent.Signal.guide.menu.operation) {
|
||||
/** 办理引导进路*/
|
||||
operate.operation = OperationEvent.Signal.guide.stop.operation;
|
||||
}
|
||||
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSuspend'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
close() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Command.close.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
getOperate(operate) {
|
||||
/** 弹框返回值处理*/
|
||||
if (this.operation == OperationEvent.Signal.unlock.menu.operation) {
|
||||
/** 信号解封*/
|
||||
this.backOperate = operate;
|
||||
this.setButtonEnable(operate);
|
||||
if (operate.success) {
|
||||
this.timeCountCommand = 30;
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.confirmedSuccess') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.cancelSuccess') });
|
||||
}
|
||||
}
|
||||
},
|
||||
setButtonEnable(param) {
|
||||
this.cmdDisabled = [true, true, true];
|
||||
if (param && param.step >= 0) {
|
||||
this.cmdDisabled[param.step] = false;
|
||||
}
|
||||
},
|
||||
setMessage(message) {
|
||||
this.message = message;
|
||||
},
|
||||
writeRecord(param) {
|
||||
this.tempData.push(param);
|
||||
},
|
||||
editRecord(param) {
|
||||
this.tempData.forEach(elem => {
|
||||
if (elem.order == param.order) {
|
||||
for (var prop in param) {
|
||||
elem[prop] = param[prop];
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,332 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm signal-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="300px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="11"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="11" :offset="2"><span>{{ $t('menu.signal') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="11" :offset="2">
|
||||
<el-input v-model="signalName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('menu.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('menu.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<confirm-control ref="confirmControl" />
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent, getDomIdByOperation } from '@/scripts/ConstDic';
|
||||
import ConfirmControl from './childDialog/confirmControl';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'RouteControl',
|
||||
components: {
|
||||
ConfirmControl,
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
selected: null,
|
||||
operation: null,
|
||||
stationName: '',
|
||||
signalName: ''
|
||||
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.close.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? getDomIdByOperation(this.operation) : '';
|
||||
},
|
||||
title() {
|
||||
if (this.operation == OperationEvent.Signal.cancelTrainRoute.menu.operation) {
|
||||
return this.$t('menu.menuSignal.cancelTheTrainApproach');
|
||||
} else if (this.operation == OperationEvent.Signal.signalClose.menu.operation) {
|
||||
return this.$t('menu.menuSignal.signalOff');
|
||||
} else if (this.operation == OperationEvent.Signal.reopenSignal.menu.operation) {
|
||||
return this.$t('menu.menuSignal.reopenTrainSignal');
|
||||
} else if (this.operation == OperationEvent.Signal.setAutoInterlock.menu.operation) {
|
||||
return this.$t('menu.menuSignal.setInterlockAutoRoute');
|
||||
} else if (this.operation == OperationEvent.Signal.cancelAutoInterlock.menu.operation) {
|
||||
return this.$t('menu.menuSignal.cancelInterlockAutoRoute');
|
||||
} else if (this.operation == OperationEvent.Signal.setAutoTrigger.menu.operation) {
|
||||
return this.$t('menu.menuSignal.setInterlockAutoTrigger');
|
||||
} else if (this.operation == OperationEvent.Signal.cancelAutoTrigger.menu.operation) {
|
||||
return this.$t('menu.menuSignal.cancelInterlockAutoTrigger');
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
if (!this.dialogShow) {
|
||||
this.signalName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase()) {
|
||||
this.signalName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
this.selected = selected;
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
if (this.operation == OperationEvent.Signal.cancelTrainRoute.menu.operation) {
|
||||
/** 取消列车进路*/
|
||||
this.cancelTrainRoute();
|
||||
} else if (this.operation == OperationEvent.Signal.signalClose.menu.operation) {
|
||||
/** 信号关灯*/
|
||||
this.signalClose();
|
||||
} else if (this.operation == OperationEvent.Signal.reopenSignal.menu.operation) {
|
||||
/** 信号重开*/
|
||||
this.reopenSignal();
|
||||
} else if (this.operation == OperationEvent.Signal.setAutoInterlock.menu.operation) {
|
||||
/** 设置联锁自动进路*/
|
||||
this.setAutoInterlock();
|
||||
} else if (this.operation == OperationEvent.Signal.cancelAutoInterlock.menu.operation) {
|
||||
/** 取消联锁自动进路*/
|
||||
this.cancelAutoInterlock();
|
||||
} else if (this.operation == OperationEvent.Signal.setAutoTrigger.menu.operation) {
|
||||
/** 设置联锁自动触发*/
|
||||
this.setAutoTrigger();
|
||||
} else if (this.operation == OperationEvent.Signal.cancelAutoTrigger.menu.operation) {
|
||||
/** 取消联锁自动触发*/
|
||||
this.cancelAutoTrigger();
|
||||
}
|
||||
},
|
||||
// 取消列车进路
|
||||
cancelTrainRoute() {
|
||||
if (this.$store.state.training.prdType == '01') {
|
||||
/** 现地工作站*/
|
||||
this.cancelTrainRouteByLocal();
|
||||
} else if (this.$store.state.training.prdType == '02') {
|
||||
/** 行调工作站*/
|
||||
this.cancelTrainRouteByCentral();
|
||||
}
|
||||
},
|
||||
// 现地工作站取消进路
|
||||
cancelTrainRouteByLocal() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.cancelTrainRoute.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 行调工作站取消进路
|
||||
cancelTrainRouteByCentral() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.cancelTrainRoute.menu.operation,
|
||||
messages: [this.$t('tip.signalModeToManualModeTipPrefix') + this.signalName + this.$t('tip.signalModeToManualModeTipSuffix')]
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.$refs.confirmControl.doShow(operate, this.selected);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 信号关灯
|
||||
signalClose() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.signalClose.menu.operation,
|
||||
messages: [this.$t('menu.menuSignal.signalOff') + this.$t('global.colon') + this.signalName]
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.$refs.confirmControl.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 信号重开
|
||||
reopenSignal() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.reopenSignal.menu.operation,
|
||||
messages: [this.$t('menu.menuSignal.signalReopen') + this.$t('global.colon') + this.signalName]
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.$refs.confirmControl.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 设置联锁自动进路
|
||||
setAutoInterlock() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.setAutoInterlock.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 取消联锁自动进路
|
||||
cancelAutoInterlock() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.cancelAutoInterlock.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 设置联锁自动触发
|
||||
setAutoTrigger() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.setAutoTrigger.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 取消联锁自动触发
|
||||
cancelAutoTrigger() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.cancelAutoTrigger.menu.operation
|
||||
};
|
||||
|
||||
this.doClose();
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 取消
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Command.close.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,165 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm route-detail"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="340px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="10"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="10" :offset="2"><span>{{ $t('menu.startSignal') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="10">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-input v-model="signalName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table">
|
||||
<span>{{ $t('menu.routeList') }}</span>
|
||||
<el-table
|
||||
ref="tempTable"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
:height="140"
|
||||
>
|
||||
<el-table-column :label="this.$t('menu.route')">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="this.$t('menu.controlState')" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.controlType == '01'">{{ $t('menu.automatic') }}</span>
|
||||
<span v-else>{{ $t('menu.artificial') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'RouteDetail',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
tempData: [],
|
||||
stationName: '',
|
||||
signalName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'signalList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.Signal.detail.menu.domId : '';
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.queryAccessControlMode');
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected, tempData) {
|
||||
// 如果不是因为断点激活则需要，初始化菜单初始值
|
||||
if (!this.dialogShow) {
|
||||
this.signalName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase()) {
|
||||
this.signalName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
this.tempData = tempData || [];
|
||||
}
|
||||
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.detail.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,317 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm route-hand-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="360px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="10"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="10" :offset="2"><span>{{ $t('menu.startSignal') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="10">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-input v-model="signalName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table">
|
||||
<span>{{ $t('menu.routeList') }}</span>
|
||||
<el-table
|
||||
ref="tempTable"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
:height="140"
|
||||
>
|
||||
<el-table-column :id="domIdChoose" prop="name" :label="this.$t('menu.route')" style="margin-left:30px">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox v-model="scope.row.check" :disabled="scope.row.disabled" />
|
||||
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{ scope.row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="controlType" :label="this.$t('menu.controlState')" :width="80">
|
||||
<template slot-scope="scope">
|
||||
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">
|
||||
<span v-if="scope.row.controlType == '01'">{{ $t('menu.automatic2') }}</span>
|
||||
<span v-else>{{ $t('menu.artificial') }}</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="conflictCheck" :label="this.$t('menu.conflictCheck')" :width="80">
|
||||
<template slot-scope="scope">
|
||||
<span
|
||||
:style="{color: scope.row.disabled ? '#CBCBCB':'unset'}"
|
||||
>{{ scope.row.conflictCheck }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button
|
||||
:id="domIdConfirm"
|
||||
type="primary"
|
||||
:disabled="commitDisabled"
|
||||
:loading="loading"
|
||||
@click="commit"
|
||||
>{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<confirm-control ref="confirmControl" />
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { MapDeviceType, OperationEvent, getDomIdByOperation } from '@/scripts/ConstDic';
|
||||
import ConfirmControl from './childDialog/confirmControl';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'RouteHandControl',
|
||||
components: {
|
||||
ConfirmControl,
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
tempData: [],
|
||||
operation: null,
|
||||
selection: [],
|
||||
stationName: '',
|
||||
signalName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'signalList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdChoose() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Signal.humanControl.menu.operation) {
|
||||
return OperationEvent.Signal.humanControl.choose.domId;
|
||||
} else if (this.operation == OperationEvent.Signal.atsAutoControl.menu.operation) {
|
||||
return OperationEvent.Signal.atsAutoControl.choose.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? getDomIdByOperation(this.operation) : '';
|
||||
},
|
||||
title() {
|
||||
if (this.operation == OperationEvent.Signal.humanControl.menu.operation) {
|
||||
return this.$t('menu.menuSignal.humanControl');
|
||||
} else if (this.operation == OperationEvent.Signal.atsAutoControl.menu.operation) {
|
||||
return this.$t('menu.menuSignal.atsAutoControl');
|
||||
}
|
||||
return '';
|
||||
},
|
||||
commitDisabled() {
|
||||
let disabled = true;
|
||||
if (this.selection && this.selection.length) {
|
||||
disabled = false;
|
||||
}
|
||||
|
||||
return disabled;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 深度数据状态
|
||||
tempData: {
|
||||
handler(val, oldVal) {
|
||||
this.checkTableDataSelction(val);
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected, tempData) {
|
||||
// 如果不是断点激活，而是第一次显示则初始化
|
||||
if (!this.dialogShow) {
|
||||
this.signalName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase()) {
|
||||
this.signalName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
|
||||
if (tempData && tempData.length > 0) {
|
||||
tempData.forEach(elem => {
|
||||
elem.check = false;
|
||||
elem.disabled = false;
|
||||
// 设置禁用状态
|
||||
if (operate.operation === OperationEvent.Signal.humanControl.menu.operation &&
|
||||
elem.controlType != '01') {
|
||||
elem.disabled = true;
|
||||
} if (operate.operation === OperationEvent.Signal.atsAutoControl.menu.operation &&
|
||||
elem.controlType == '01') {
|
||||
elem.disabled = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this.tempData = tempData || [];
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$refs.tempTable.setCurrentRow();
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
checkTableDataSelction(data) {
|
||||
const selection = [];
|
||||
if (data && data.length > 0) {
|
||||
data.forEach(row => {
|
||||
if (row.check && !row.disabled) {
|
||||
selection.push(row);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (JSON.stringify(selection) !== JSON.stringify(this.selection)) {
|
||||
this.handleChooseChange(selection);
|
||||
this.selection = selection;
|
||||
}
|
||||
},
|
||||
serializeCodeListWithSeparator(sep) {
|
||||
const codeList = [];
|
||||
if (this.selection && this.selection.length) {
|
||||
this.selection.forEach(elem => {
|
||||
codeList.push(elem.code);
|
||||
});
|
||||
}
|
||||
return codeList.join(sep);
|
||||
},
|
||||
handleChooseChange(selection) {
|
||||
this.selection = selection;
|
||||
if (selection && selection.length) {
|
||||
const operate = {
|
||||
repeat: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: '',
|
||||
val: this.serializeCodeListWithSeparator('::'),
|
||||
selection: selection
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Signal.humanControl.menu.operation) {
|
||||
/** 自排关*/
|
||||
operate.operation = OperationEvent.Signal.humanControl.choose.operation;
|
||||
} else if (this.operation == OperationEvent.Signal.atsAutoControl.menu.operation) {
|
||||
/** 自排开*/
|
||||
operate.operation = OperationEvent.Signal.atsAutoControl.choose.operation;
|
||||
}
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
} else if (!selection) {
|
||||
this.$messageBox(this.$t('tip.selectAPieceOfData'));
|
||||
}
|
||||
},
|
||||
commit() {
|
||||
if (this.operation == OperationEvent.Signal.humanControl.menu.operation) {
|
||||
/** 自排关*/
|
||||
this.humanControl();
|
||||
} else if (this.operation == OperationEvent.Signal.atsAutoControl.menu.operation) {
|
||||
/** 自排开*/
|
||||
this.atsAutoControl();
|
||||
}
|
||||
},
|
||||
// 自排关
|
||||
humanControl() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.humanControl.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 自排开
|
||||
atsAutoControl() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.atsAutoControl.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,167 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm route-lock"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="340px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="10"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="10" :offset="2"><span>{{ $t('menu.signalName') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="10">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-input v-model="signalName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table">
|
||||
<span>{{ $t('menu.listOfSignalButtons') }}</span>
|
||||
<el-table
|
||||
ref="table"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
:height="140"
|
||||
>
|
||||
<el-table-column prop="name" :label="this.$t('menu.buttonName')" />
|
||||
<el-table-column prop="status" :label="this.$t('menu.buttonStatus')" />
|
||||
</el-table>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'RouteLock',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
tempData: [],
|
||||
operate: null,
|
||||
stationName: '',
|
||||
signalName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'signalList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.Signal.lock.menu.domId : '';
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.blockSignalButton');
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
// 入股不是断点激活，而是第一次显示需要初始化
|
||||
if (!this.dialogShow) {
|
||||
this.signalName = '';
|
||||
this.stationName = '';
|
||||
|
||||
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase()) {
|
||||
this.signalName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
|
||||
/** status 04:封锁*/
|
||||
const signal = (selected || {}).status;
|
||||
this.tempData = [{ code: selected.code, name: selected.name, status: signal.status != '04' ? this.$t('menu.unblocked') : this.$t('menu.blocked') }];
|
||||
const timer = setInterval(() => {
|
||||
if (this.$refs.table) {
|
||||
this.$refs.table.setCurrentRow(this.tempData[0]);
|
||||
clearInterval(timer);
|
||||
}
|
||||
}, 300);
|
||||
}
|
||||
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.lock.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,262 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm route-setting"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="500px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="8"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="8" :offset="2"><span>{{ $t('menu.startSignal') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="2">
|
||||
<el-input v-model="signalName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table
|
||||
ref="table"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%; margin-top:10px"
|
||||
size="mini"
|
||||
height="120"
|
||||
highlight-current-row
|
||||
@row-click="clickEvent"
|
||||
>
|
||||
<el-table-column :id="domIdChoose" prop="name" :label="this.$t('menu.route')" style="margin-left:30px" />
|
||||
<el-table-column prop="protectedSection" :label="this.$t('menu.protectionSection')" :width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getProtectedSectionName(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="canSetting" :label="this.$t('global.status')" :width="100">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.canSetting">{{ $t('menu.allowSelection') }}</span>
|
||||
<span v-else>{{ $t('menu.notAllowSelection') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row
|
||||
justify="
|
||||
center"
|
||||
class="button-group"
|
||||
>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button
|
||||
:id="domIdConfirm"
|
||||
type="primary"
|
||||
:loading="loading"
|
||||
:disabled="commitDisabled"
|
||||
@click="commit"
|
||||
>{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<confirm-control ref="confirmControl" />
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import ConfirmControl from './childDialog/confirmControl';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'RouteSelection',
|
||||
components: {
|
||||
ConfirmControl,
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tempData: [],
|
||||
beforeSectionList: [],
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
row: null,
|
||||
operation: '',
|
||||
display: true,
|
||||
stationName: '',
|
||||
signalName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdChoose() {
|
||||
return this.dialogShow ? OperationEvent.Signal.arrangementRoute.choose.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.Signal.arrangementRoute.menu.domId : '';
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.menuSignal.routeSelect');
|
||||
},
|
||||
commitDisabled() {
|
||||
let disabled = true;
|
||||
if (this.row) {
|
||||
disabled = !this.row.canSetting;
|
||||
}
|
||||
return disabled;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
getProtectedSectionName(row) {
|
||||
let name = '';
|
||||
if (row &&
|
||||
row.overlapSectionList &&
|
||||
row.overlapSectionList &&
|
||||
row.overlapSectionList.length > 0) {
|
||||
|
||||
const protect = row.overlapSectionList[0];
|
||||
name = `${protect.name}`;
|
||||
if (protect.parentName) {
|
||||
name = `${protect.parentName}${protect.name}`;
|
||||
}
|
||||
const station = this.$store.getters['map/getDeviceByCode'](protect.stationCode);
|
||||
if (station) {
|
||||
name = `${name}(${station.name})`;
|
||||
}
|
||||
}
|
||||
return name;
|
||||
},
|
||||
doShow(operate, selected, tempData) {
|
||||
// 如果不是断点激活，而是第一次显示，则需要设置初始值
|
||||
if (!this.dialogShow) {
|
||||
this.signalName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase()) {
|
||||
this.signalName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
|
||||
this.tempData = tempData || [];
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.restoreBeforeDevices();
|
||||
this.$refs.table.setCurrentRow();
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
restoreBeforeDevices() {
|
||||
// 恢复之前选中设备
|
||||
if (this.beforeSectionList && this.beforeSectionList.length) {
|
||||
this.beforeSectionList.forEach(elem => {
|
||||
elem.cutOff = false;
|
||||
});
|
||||
}
|
||||
|
||||
this.$store.dispatch('training/updateMapState', [... this.beforeSectionList]);
|
||||
this.beforeSectionList = [];
|
||||
},
|
||||
clickEvent(row, event, column) {
|
||||
this.row = row;
|
||||
if (row) {
|
||||
// 恢复进路区段的切除状态
|
||||
this.restoreBeforeDevices();
|
||||
|
||||
if (row.canSetting) {
|
||||
// 设置选中区段为切除状态
|
||||
if (row.containSectionList && row.containSectionList.length) {
|
||||
// 设置新选的进路区段为切除状态
|
||||
row.containSectionList.forEach(elem => {
|
||||
elem.cutOff = true;
|
||||
});
|
||||
}
|
||||
|
||||
this.$store.dispatch('training/updateMapState', [...row.containSectionList]);
|
||||
this.beforeSectionList = row.containSectionList || [];
|
||||
|
||||
// 设置选中指令
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.arrangementRoute.choose.operation,
|
||||
val: row.code
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
commit() {
|
||||
if (this.row && this.row.canSetting) {
|
||||
let names = '';
|
||||
if (this.row.overlapSectionList && this.row.overlapSectionList.length > 0) {
|
||||
names = names + this.row.overlapSectionList.map(elem => { return elem.name; }).join('');
|
||||
}
|
||||
if (this.row.overlapSwitchList && this.row.overlapSwitchList.length > 0) {
|
||||
names = names + this.row.overlapSwitchList.map(elem => { return elem.name; }).join('');
|
||||
}
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Signal.arrangementRoute.menu.operation,
|
||||
messages: [this.$t('menu.accessSetting') + this.$t('global.colon') + `${this.row.name}${names}(${this.row.stationName})`]
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.$refs.confirmControl.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
}
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Signal.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,457 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm section-cmd-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="840px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<div style="padding: 10px 20px; border: 1px solid lightgray;">
|
||||
<span class="base-label">{{ $t('menu.commandInformation') }}</span>
|
||||
<el-form label-position="center" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="this.$t('global.status')" label-width="40px">
|
||||
<el-select v-model="operation" size="small" disabled>
|
||||
<el-option
|
||||
v-for="option in typeList"
|
||||
:key="option.code"
|
||||
:label="option.name"
|
||||
:value="option.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="this.$t('menu.stationName')" label-width="80px">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="this.$t('menu.sectionName')" label-width="100px">
|
||||
<el-input v-model="sectionName" size="small" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table
|
||||
ref="tempData"
|
||||
class="table"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
height="200"
|
||||
>
|
||||
<el-table-column prop="order" :width="110" :label="this.$t('menu.serialNumber2')" />
|
||||
<el-table-column prop="date" :width="160" :label="this.$t('menu.time')" />
|
||||
<el-table-column prop="context" :width="180" :label="this.$t('menu.implementationProcess')" />
|
||||
<el-table-column prop="result" :label="this.$t('menu.executionResult')" />
|
||||
</el-table>
|
||||
<span class="notice">{{ message }}</span>
|
||||
<el-row class="button-group">
|
||||
<el-col :span="2" :offset="3">
|
||||
<el-button :id="domIdCommand" type="primary" :disabled="cmdDisabled[0]" @click="command">{{ $t('menu.release') }}<span
|
||||
v-show="timeCountCommand>0"
|
||||
>({{ timeCountCommand }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdConfirm1" type="primary" style="width:120px;" :disabled="cmdDisabled[1]" @click="confirm1">{{ $t('menu.firstConfirm') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdConfirm2" type="primary" style="width:120px;" :disabled="cmdDisabled[2]" @click="confirm2">{{ $t('menu.secondConfirm') }}<span
|
||||
v-show="timeCountConfirm>0"
|
||||
>({{ timeCountConfirm }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdStop" type="primary" :disabled="stpDisabled" @click="stop">{{ $t('menu.suspend') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdClose" @click="close">{{ $t('global.close') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import { now } from '@/utils/date';
|
||||
|
||||
export default {
|
||||
name: 'SectionCmdControl',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
backOperate: '',
|
||||
selected: '',
|
||||
order: 0,
|
||||
row: null,
|
||||
timer: null,
|
||||
operation: '',
|
||||
cmdDisabled: [true, true, true],
|
||||
stpDisabled: true,
|
||||
tempData: [],
|
||||
message: '',
|
||||
timeCountCommand: -1,
|
||||
timeCountConfirm: -1,
|
||||
stationName: '',
|
||||
sectionName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
typeList() {
|
||||
return [
|
||||
{ code: OperationEvent.Section.unlock.menu.operation, name: this.$t('menu.menuSection.sectionUnblock') },
|
||||
{ code: OperationEvent.Section.fault.menu.operation, name: this.$t('menu.menuSection.sectionFaultUnlock') },
|
||||
{ code: OperationEvent.Section.axlePreReset.menu.operation, name: this.$t('menu.menuSection.sectionAxisPreReset') }
|
||||
];
|
||||
},
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCommand() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
return OperationEvent.Section.unlock.order.domId;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
return OperationEvent.Section.fault.order.domId;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
return OperationEvent.Section.axlePreReset.order.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdConfirm1() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
return OperationEvent.Section.unlock.confirm1.domId;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
return OperationEvent.Section.fault.confirm1.domId;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
return OperationEvent.Section.axlePreReset.confirm1.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdConfirm2() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
return OperationEvent.Section.unlock.confirm2.domId;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
return OperationEvent.Section.fault.confirm2.domId;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
return OperationEvent.Section.axlePreReset.confirm2.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdStop() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
return OperationEvent.Section.unlock.stop.domId;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
return OperationEvent.Section.fault.stop.domId;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
return OperationEvent.Section.axlePreReset.stop.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdClose() {
|
||||
if (this.dialogShow) {
|
||||
return OperationEvent.Command.close.menu.domId;
|
||||
}
|
||||
return '';
|
||||
},
|
||||
title() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
return this.$t('menu.menuSection.sectionUnblock');
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
return this.$t('menu.menuSection.sectionFaultUnlock');
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
return this.$t('menu.menuSection.sectionAxisPreReset');
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
cmdDisabled: {
|
||||
handler(val, oldVal) {
|
||||
this.stpDisabled = true;
|
||||
val.forEach((elem, index) => {
|
||||
// 在确定1之前的操作才可以终止
|
||||
if (elem == false && index >= 1 && index <= 2) {
|
||||
this.stpDisabled = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
this.timer = setInterval(() => {
|
||||
if (!this.$store.state.menuOperation.break) {
|
||||
if (this.timeCountCommand > 0) {
|
||||
this.timeCountCommand--;
|
||||
} else if (this.timeCountCommand == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountCommand = -1;
|
||||
}
|
||||
if (this.timeCountConfirm > 0) {
|
||||
this.timeCountConfirm--;
|
||||
} else if (this.timeCountConfirm == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountConfirm = -1;
|
||||
}
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
if (!this.dialogShow) {
|
||||
this.sectionName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase()) {
|
||||
if (selected.type === '02') {
|
||||
const section = this.$store.getters['map/getDeviceByCode'](selected.parentCode);
|
||||
if (section) {
|
||||
this.sectionName += section.name;
|
||||
}
|
||||
}
|
||||
this.sectionName += selected.name;
|
||||
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
this.selected = selected;
|
||||
}
|
||||
|
||||
this.order = 0;
|
||||
this.operation = operate.operation || '';
|
||||
this.dialogShow = true;
|
||||
this.tempData = [];
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.cmdDisabled = [false, true, true];
|
||||
}
|
||||
this.stpDisabled = true;
|
||||
this.setMessage(this.$t('tip.releaseTip'));
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
command() {
|
||||
if (this.operation == OperationEvent.Section.fault.menu.operation ||
|
||||
this.operation == OperationEvent.Section.unlock.menu.operation ||
|
||||
this.operation == OperationEvent.Section.cancelSpeed.menu.operation ||
|
||||
this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 第一步不带弹框处理*/
|
||||
this.commandNoPopUp();
|
||||
} else {
|
||||
/** 第一步带弹框处理*/
|
||||
this.commandHasPopUp();
|
||||
}
|
||||
},
|
||||
commandHasPopUp() {
|
||||
},
|
||||
commandNoPopUp() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Section.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
operate.operation = OperationEvent.Section.unlock.order.operation;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
operate.operation = OperationEvent.Section.fault.order.operation;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
operate.operation = OperationEvent.Section.axlePreReset.order.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.firstConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 1 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm1() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Section.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
operate.operation = OperationEvent.Section.unlock.confirm1.operation;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
operate.operation = OperationEvent.Section.fault.confirm1.operation;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
operate.operation = OperationEvent.Section.axlePreReset.confirm1.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.secondConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = 10;
|
||||
this.setButtonEnable({ step: 2 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm2() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Section.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
operate.operation = OperationEvent.Section.unlock.confirm2.operation;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
operate.operation = OperationEvent.Section.fault.confirm2.operation;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
operate.operation = OperationEvent.Section.axlePreReset.confirm2.operation;
|
||||
}
|
||||
this.setMessage('');
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
stop() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Section.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.unlock.menu.operation) {
|
||||
/** 区段解封*/
|
||||
operate.operation = OperationEvent.Section.unlock.stop.operation;
|
||||
} else if (this.operation == OperationEvent.Section.fault.menu.operation) {
|
||||
/** 区段故障解锁*/
|
||||
operate.operation = OperationEvent.Section.fault.stop.operation;
|
||||
} else if (this.operation == OperationEvent.Section.axlePreReset.menu.operation) {
|
||||
/** 区段计轴预复位*/
|
||||
operate.operation = OperationEvent.Section.axlePreReset.stop.operation;
|
||||
}
|
||||
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSuspend'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
close() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Section.type,
|
||||
operation: OperationEvent.Command.close.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
getOperate(operate) {
|
||||
/** 弹框返回值处理*/
|
||||
},
|
||||
setButtonEnable(param) {
|
||||
this.cmdDisabled = [true, true, true];
|
||||
if (param && param.step >= 0) {
|
||||
this.cmdDisabled[param.step] = false;
|
||||
}
|
||||
},
|
||||
setMessage(message) {
|
||||
this.message = message;
|
||||
},
|
||||
writeRecord(param) {
|
||||
this.tempData.push(param);
|
||||
},
|
||||
editRecord(param) {
|
||||
this.tempData.forEach(elem => {
|
||||
if (elem.order == param.order) {
|
||||
for (var prop in param) {
|
||||
elem[prop] = param[prop];
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,200 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm section-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="300px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="11"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="11" :offset="2"><span>{{ $t('menu.section') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="11" :offset="2">
|
||||
<el-input v-model="sectionName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent, getDomIdByOperation } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'SectionControl',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
operation: '',
|
||||
stationName: '',
|
||||
sectionName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? getDomIdByOperation(this.operation) : '';
|
||||
},
|
||||
title() {
|
||||
if (this.operation == OperationEvent.Section.lock.menu.operation) {
|
||||
return this.$t('menu.menuSection.sectionBlockade');
|
||||
} else if (this.operation == OperationEvent.Section.split.menu.operation) {
|
||||
return this.$t('menu.menuSection.orbitalSectionResection');
|
||||
} else if (this.operation == OperationEvent.Section.active.menu.operation) {
|
||||
return this.$t('menu.menuSection.orbitalSectionActive');
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
if (!this.dialogShow) {
|
||||
this.sectionName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase()) {
|
||||
if (selected.type === '02') {
|
||||
const section = this.$store.getters['map/getDeviceByCode'](selected.parentCode);
|
||||
if (section) {
|
||||
this.sectionName += section.name;
|
||||
}
|
||||
}
|
||||
this.sectionName += selected.name;
|
||||
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
this.operation = operate.operation || '';
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
if (this.operation == OperationEvent.Section.lock.menu.operation) {
|
||||
/** 区段封锁*/
|
||||
this.lock();
|
||||
} else if (this.operation == OperationEvent.Section.split.menu.operation) {
|
||||
/** 轨道区段切除*/
|
||||
this.split();
|
||||
} else if (this.operation == OperationEvent.Section.active.menu.operation) {
|
||||
/** 轨道区段激活*/
|
||||
this.active();
|
||||
}
|
||||
},
|
||||
// 道岔单锁
|
||||
lock() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Section.type,
|
||||
operation: OperationEvent.Section.lock.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 轨道区段切除
|
||||
split() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Section.type,
|
||||
operation: OperationEvent.Section.split.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 轨道区段激活
|
||||
active() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Section.type,
|
||||
operation: OperationEvent.Section.active.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Section.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,583 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm section-cmd-speed"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="840px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<div style="padding: 10px 20px; border: 1px solid lightgray;">
|
||||
<span class="base-label">{{ $t('menu.commandInformation') }}</span>
|
||||
<el-form label-position="center" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<el-form-item :label="this.$t('menu.type')" label-width="40px">
|
||||
<el-select v-model="operation" size="small" disabled>
|
||||
<el-option
|
||||
v-for="option in typeList"
|
||||
:key="option.code"
|
||||
:label="option.name"
|
||||
:value="option.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item :label="this.$t('menu.stationName')" label-width="80px">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item :label="nameLabel" label-width="80px">
|
||||
<el-input v-model="name" size="small" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item :label="this.$t('menu.speedLimitValue')" label-width="80px">
|
||||
<el-select
|
||||
:id="domIdChoose"
|
||||
v-model="speed"
|
||||
size="small"
|
||||
:disabled="spdDisabled"
|
||||
@change="speedSelectChange"
|
||||
>
|
||||
<el-option v-for="item in speedList" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table
|
||||
ref="table"
|
||||
class="table"
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
height="200"
|
||||
>
|
||||
<el-table-column prop="order" :width="110" :label="this.$t('menu.serialNumber2')" />
|
||||
<el-table-column prop="date" :width="160" :label="this.$t('menu.time')" />
|
||||
<el-table-column prop="context" :width="180" :label="this.$t('menu.implementationProcess')" />
|
||||
<el-table-column prop="result" :label="this.$t('menu.executionResult')" />
|
||||
</el-table>
|
||||
<span class="notice">{{ message }}</span>
|
||||
<el-row class="button-group">
|
||||
<el-col :span="2" :offset="3">
|
||||
<el-button :id="domIdCommand" type="primary" :disabled="cmdDisabled[0]" @click="command">{{ $t('menu.release') }}<span
|
||||
v-show="timeCountCommand>0"
|
||||
>({{ timeCountCommand }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdConfirm1" type="primary" style="width:120px;" :disabled="cmdDisabled[1]" @click="confirm1">{{ $t('menu.firstConfirm') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdConfirm2" type="primary" style="width:120px;" :disabled="cmdDisabled[2]" @click="confirm2">{{ $t('menu.secondConfirm') }}<span
|
||||
v-show="timeCountConfirm>0"
|
||||
>({{ timeCountConfirm }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdStop" type="primary" :disabled="stpDisabled" @click="stop">{{ $t('menu.suspend') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdClose" @click="close">{{ $t('global.close') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
<confirm-control-speed ref="confirmControlSpeed" @setOperate="getOperate" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { OperationEvent } from '@/scripts/ConstDic';
|
||||
import ConfirmControlSpeed from './childDialog/confirmControlSpeed';
|
||||
import { now } from '@/utils/date';
|
||||
|
||||
export default {
|
||||
name: 'SectionCmdSpeed',
|
||||
components: {
|
||||
ConfirmControlSpeed
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
backOperate: '',
|
||||
selected: '',
|
||||
order: 0,
|
||||
row: null,
|
||||
timer: null,
|
||||
type: '',
|
||||
operation: '',
|
||||
cmdDisabled: [true, true, true],
|
||||
spdDisabled: false,
|
||||
stpDisabled: true,
|
||||
tableData: [],
|
||||
message: '',
|
||||
timeCountCommand: -1,
|
||||
timeCountConfirm: -1,
|
||||
maxSpeed: 80,
|
||||
speedSpace: 5,
|
||||
stationName: '',
|
||||
name: '',
|
||||
speed: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
nameLabel() {
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation ||
|
||||
this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
return this.$t('menu.sectionName');
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation ||
|
||||
this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
return this.$t('menu.switchName');
|
||||
}
|
||||
return null;
|
||||
},
|
||||
speedList() {
|
||||
const list = [];
|
||||
for (var i = 0; i * this.speedSpace <= this.maxSpeed; i++) {
|
||||
list.push(String(i * this.speedSpace));
|
||||
}
|
||||
return list;
|
||||
},
|
||||
typeList() {
|
||||
return [
|
||||
{ code: OperationEvent.Section.setSpeed.menu.operation, name: this.$t('menu.menuSection.sectionSetSpeedLimit') },
|
||||
{ code: OperationEvent.Section.cancelSpeed.menu.operation, name: this.$t('menu.menuSection.sectionCancelSpeedLimit') },
|
||||
{ code: OperationEvent.Switch.setSpeed.menu.operation, name: this.$t('menu.turnoutSettingSpeedLimit') },
|
||||
{ code: OperationEvent.Switch.cancelSpeed.menu.operation, name: this.$t('menu.turnoutCancelsSpeedLimit') }
|
||||
];
|
||||
},
|
||||
title() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
return this.$t('menu.menuSection.sectionSetSpeedLimit');
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
return this.$t('menu.menuSection.sectionCancelSpeedLimit');
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
return this.$t('menu.turnoutSettingSpeedLimit');
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
return this.$t('menu.turnoutCancelsSpeedLimit');
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdChoose() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
return OperationEvent.Section.setSpeed.choose.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
return OperationEvent.Switch.setSpeed.choose.domId;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
domIdCommand() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
return OperationEvent.Section.setSpeed.order.domId;
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
return OperationEvent.Section.cancelSpeed.order.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
return OperationEvent.Switch.setSpeed.order.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔取消限速*/
|
||||
return OperationEvent.Switch.cancelSpeed.order.domId;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
domIdConfirm1() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
return OperationEvent.Section.setSpeed.confirm1.domId;
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
return OperationEvent.Section.cancelSpeed.confirm1.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
return OperationEvent.Switch.setSpeed.confirm1.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔取消限速*/
|
||||
return OperationEvent.Switch.cancelSpeed.confirm1.domId;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
domIdConfirm2() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
return OperationEvent.Section.setSpeed.confirm2.domId;
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
return OperationEvent.Section.cancelSpeed.confirm2.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
return OperationEvent.Switch.setSpeed.confirm2.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
return OperationEvent.Switch.cancelSpeed.confirm2.domId;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
domIdStop() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
return OperationEvent.Section.setSpeed.stop.domId;
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
return OperationEvent.Section.cancelSpeed.stop.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
return OperationEvent.Switch.setSpeed.stop.domId;
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔取消限速*/
|
||||
return OperationEvent.Switch.cancelSpeed.stop.domId;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
domIdClose() {
|
||||
if (this.dialogShow) {
|
||||
return OperationEvent.Command.close.menu.domId;
|
||||
}
|
||||
return null;
|
||||
},
|
||||
isCancelSpeed() {
|
||||
return this.operation == OperationEvent.Section.cancelSpeed.menu.operation ||
|
||||
this.operation == OperationEvent.Switch.cancelSpeed.menu.operation;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
cmdDisabled: {
|
||||
handler(val, oldVal) {
|
||||
this.stpDisabled = true;
|
||||
this.spdDisabled = false;
|
||||
val.forEach((elem, index) => {
|
||||
// 取消操作禁止选择限速，并跳过该步骤
|
||||
if (elem == false && index >= 1 || this.isCancelSpeed) {
|
||||
this.spdDisabled = true;
|
||||
}
|
||||
|
||||
// 在确定1之前的操作才可终止
|
||||
if (elem == false && index >= 1) {
|
||||
this.stpDisabled = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
'speed': function (val) {
|
||||
if (val) this.cmdDisabled[0] = false;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
this.timer = setInterval(() => {
|
||||
if (!this.$store.state.menuOperation.break) {
|
||||
if (this.timeCountCommand > 0) {
|
||||
this.timeCountCommand--;
|
||||
} else if (this.timeCountCommand == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountCommand = -1;
|
||||
}
|
||||
if (this.timeCountConfirm > 0) {
|
||||
this.timeCountConfirm--;
|
||||
} else if (this.timeCountConfirm == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountConfirm = -1;
|
||||
}
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected, tempData) {
|
||||
if (!this.dialogShow) {
|
||||
this.name = '';
|
||||
this.stationName = '';
|
||||
if (selected) {
|
||||
if (operate.operation == OperationEvent.Section.setSpeed.menu.operation ||
|
||||
operate.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase()) {
|
||||
if (selected.type === '02') {
|
||||
const section = this.$store.getters['map/getDeviceByCode'](selected.parentCode);
|
||||
if (section) {
|
||||
this.name += section.name;
|
||||
}
|
||||
}
|
||||
this.name += selected.name;
|
||||
}
|
||||
} else if (operate.operation == OperationEvent.Switch.setSpeed.menu.operation ||
|
||||
operate.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
if (selected._type.toUpperCase() === 'Switch'.toUpperCase()) {
|
||||
this.name = selected.name;
|
||||
}
|
||||
}
|
||||
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
|
||||
this.speed = '';
|
||||
this.tableData = [];
|
||||
this.selected = selected;
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.cmdDisabled = [true, true, true];
|
||||
this.stpDisabled = true;
|
||||
this.order = 0;
|
||||
this.type = operate.type;
|
||||
this.operation = operate.operation;
|
||||
this.setMessage(this.$t('tip.selectSpeedLimitValueTip'));
|
||||
if (this.isCancelSpeed) {
|
||||
this.speed = `${tempData}`;
|
||||
this.spdDisabled = true;
|
||||
this.cmdDisabled = [false, true, true];
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
speedSelectChange(val) {
|
||||
const operate = {
|
||||
type: this.type,
|
||||
val: val
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
operate.operation = OperationEvent.Section.setSpeed.choose.operation;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
operate.operation = OperationEvent.Switch.setSpeed.choose.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.releaseTip'));
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 0 });
|
||||
}
|
||||
});
|
||||
},
|
||||
command() {
|
||||
const operate = {
|
||||
type: this.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
operate.operation = OperationEvent.Section.setSpeed.order.operation;
|
||||
operate.message = this.$t('menu.in') + `【${this.name}】` + this.$t('menu.sectionSetLimitPrefix') + `${this.speed}` + this.$t('menu.sectionLimitSuffix');
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
operate.operation = OperationEvent.Section.cancelSpeed.order.operation;
|
||||
operate.message = this.$t('menu.in') + `【${this.name}】` + this.$t('menu.sectionCancelLimitPrefix') + `${this.speed}` + this.$t('menu.sectionLimitSuffix');
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
operate.operation = OperationEvent.Switch.setSpeed.order.operation;
|
||||
operate.message = this.$t('menu.in') + `【${this.name}】` + this.$t('menu.switchSetLimitPrefix') + `${this.speed}` + this.$t('menu.sectionLimitSuffix');
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔取消限速*/
|
||||
operate.operation = OperationEvent.Switch.cancelSpeed.order.operation;
|
||||
operate.message = this.$t('menu.in') + `【${this.name}】` + this.$t('menu.switchCancelLimitPrefix') + `${this.speed}` + this.$t('menu.sectionLimitSuffix');
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.firstConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionSucceed') });
|
||||
this.$refs.confirmControlSpeed.doShow(operate, this.selected);
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm1() {
|
||||
const operate = {
|
||||
type: this.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
operate.operation = OperationEvent.Section.setSpeed.confirm1.operation;
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
operate.operation = OperationEvent.Section.cancelSpeed.confirm1.operation;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
operate.operation = OperationEvent.Switch.setSpeed.confirm1.operation;
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔取消限速*/
|
||||
operate.operation = OperationEvent.Switch.cancelSpeed.confirm1.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.secondConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = 10;
|
||||
this.setButtonEnable({ step: 2 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm2() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: this.type,
|
||||
val: this.speed
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
operate.operation = OperationEvent.Section.setSpeed.confirm2.operation;
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
operate.operation = OperationEvent.Section.cancelSpeed.confirm2.operation;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
operate.operation = OperationEvent.Switch.setSpeed.confirm2.operation;
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔取消限速*/
|
||||
operate.operation = OperationEvent.Switch.cancelSpeed.confirm2.operation;
|
||||
}
|
||||
|
||||
this.setMessage('');
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
stop() {
|
||||
const operate = {
|
||||
type: this.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Section.setSpeed.menu.operation) {
|
||||
/** 区段设置限速*/
|
||||
operate.operation = OperationEvent.Section.setSpeed.stop.operation;
|
||||
} else if (this.operation == OperationEvent.Section.cancelSpeed.menu.operation) {
|
||||
/** 区段取消限速*/
|
||||
operate.operation = OperationEvent.Section.cancelSpeed.stop.operation;
|
||||
} else if (this.operation == OperationEvent.Switch.setSpeed.menu.operation) {
|
||||
/** 道岔设置限速*/
|
||||
operate.operation = OperationEvent.Switch.setSpeed.stop.operation;
|
||||
} else if (this.operation == OperationEvent.Switch.cancelSpeed.menu.operation) {
|
||||
/** 道岔取消限速*/
|
||||
operate.operation = OperationEvent.Switch.cancelSpeed.stop.operation;
|
||||
}
|
||||
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSuspend'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
close() {
|
||||
const operate = {
|
||||
type: this.type,
|
||||
operation: OperationEvent.Command.close.menu.operation
|
||||
};
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickToClose'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
getOperate(operate) {
|
||||
if (operate.step) {
|
||||
this.setButtonEnable({ step: operate.step });
|
||||
}
|
||||
},
|
||||
setButtonEnable(param) {
|
||||
this.cmdDisabled = [true, true, true];
|
||||
if (param && param.step >= 0) {
|
||||
this.cmdDisabled[param.step] = false;
|
||||
}
|
||||
},
|
||||
setMessage(message) {
|
||||
this.message = message;
|
||||
},
|
||||
writeRecord(param) {
|
||||
this.tableData.push(param);
|
||||
},
|
||||
editRecord(param) {
|
||||
this.tableData.forEach(elem => {
|
||||
if (elem.order == param.order) {
|
||||
for (var prop in param) {
|
||||
elem[prop] = param[prop];
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,251 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm stand-run-level"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="500px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="10"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="10" :offset="2"><span>{{ $t('menu.stationStandStatus') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="10">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<div style="height: 32px;">
|
||||
<el-radio
|
||||
v-model="standStatus"
|
||||
label="02"
|
||||
style="line-height: 32px;"
|
||||
:style="{color: standStatus == '02' ? '' : 'red'}"
|
||||
disabled
|
||||
>{{ $t('menu.upDirection') }}</el-radio>
|
||||
<el-radio
|
||||
v-model="standStatus"
|
||||
label="01"
|
||||
style="line-height: 32px;"
|
||||
:style="{color: standStatus == '01' ? '' : 'red'}"
|
||||
disabled
|
||||
>{{ $t('menu.downDirection') }}</el-radio>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table">
|
||||
<span>{{ $t('menu.stationStandStatus') }}</span>
|
||||
<el-table ref="tempData" :data="tempData" border style="width: 100%; height: 170px;" size="mini">
|
||||
<el-table-column prop="name" :width="170" :label="this.$t('menu.switchbackStation')" />
|
||||
<el-table-column prop="station" :label="this.$t('menu.switchbackPlatform')" />
|
||||
<el-table-column prop="strategy" :label="this.$t('menu.switchbackStrategy')">
|
||||
<template slot-scope="scope">
|
||||
<el-select
|
||||
:id="domIdChoose"
|
||||
v-model="scope.row.strategy"
|
||||
size="mini"
|
||||
@change="strategySelectChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in strategyList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-row class="button-group">
|
||||
<span v-if="isSelect && tempData.length">{{ $t('menu.switchbackStrategyTip') }}</span>
|
||||
<span v-if="isConfirm && tempData.length">{{ $t('menu.setSwitchbackStrategyTipPrefix') + tempData[0].name + $t('menu.setSwitchbackStrategyTipSuffix') }}</span>
|
||||
</el-row>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" :disabled="!isConfirm" @click="commit">
|
||||
{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<confirm-control ref="confirmControl" />
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ConfirmControl from './childDialog/confirmControl';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import { mapGetters } from 'vuex';
|
||||
|
||||
export default {
|
||||
name: 'StandBackStrategy',
|
||||
components: {
|
||||
ConfirmControl,
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
tempData: [],
|
||||
strategyList: [
|
||||
{
|
||||
value: '01',
|
||||
label: this.$t('menu.noSwitchback')
|
||||
},
|
||||
{
|
||||
value: '02',
|
||||
label: this.$t('menu.noOneSwitchback')
|
||||
},
|
||||
{
|
||||
value: '03',
|
||||
label: this.$t('menu.automaticChange')
|
||||
},
|
||||
{
|
||||
value: '04',
|
||||
label: this.$t('menu.default')
|
||||
}
|
||||
],
|
||||
stationName: '',
|
||||
standStatus: '',
|
||||
selection: [],
|
||||
isSelect: true,
|
||||
isConfirm: false,
|
||||
strategy: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'stationList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setBackStrategy.menu.domId : '';
|
||||
},
|
||||
domIdChoose() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setBackStrategy.choose.domId : '';
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.setSwitchbackStrategy');
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
loadInitData(selected, opts) {
|
||||
this.tempData = [];
|
||||
const station = this.stationList.find(n => n.code == selected.stationCode);
|
||||
this.tempData.push({ name: station.name, station: selected.name, strategy: opts.reentryStrategy });
|
||||
},
|
||||
doShow(operate, selected, opts) {
|
||||
if (!this.dialogShow) {
|
||||
this.standStatus = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'StationStand'.toUpperCase()) {
|
||||
this.standStatus = selected.direction;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
this.loadInitData(selected, opts);
|
||||
}
|
||||
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
checkTableDataSelction(data) {
|
||||
const selection = [];
|
||||
if (data && data.length > 0) {
|
||||
data.forEach(row => {
|
||||
if (row.check && !row.disabled) {
|
||||
selection.push(row);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this.disabledSend = !selection.length;
|
||||
if (JSON.stringify(selection) !== JSON.stringify(this.selection)) {
|
||||
this.selection = selection;
|
||||
}
|
||||
},
|
||||
strategySelectChange(strategy) {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setBackStrategy.choose.operation,
|
||||
val: `${strategy}`
|
||||
};
|
||||
|
||||
this.strategy = strategy;
|
||||
this.isSelect = false;
|
||||
this.isConfirm = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
if (this.isConfirm) {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setBackStrategy.menu.operation,
|
||||
val: `${this.strategy}`
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
} else {
|
||||
this.doClose();
|
||||
}
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,270 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm stand-detain-train"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="320px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<div class="context">
|
||||
<span>{{ preContext }}{{ standName }}</span>
|
||||
</div>
|
||||
<el-row class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent, getDomIdByOperation } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'StandDetainTrain',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
standName: '',
|
||||
selected: null,
|
||||
operation: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? getDomIdByOperation(this.operation) : '';
|
||||
},
|
||||
title() {
|
||||
if (this.operation == OperationEvent.StationStand.setDetainTrain.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.detainTrain');
|
||||
} else if (this.operation == OperationEvent.StationStand.cancelDetainTrain.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.cancelDetainTrain');
|
||||
} else if (this.operation == OperationEvent.StationStand.cancelDetainTrainForce.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.cancelDetainTrainForce');
|
||||
} else if (this.operation == OperationEvent.StationStand.earlyDeparture.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.earlyDeparture');
|
||||
} else if (this.operation == OperationEvent.StationStand.setJumpStop.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.setJumpStop');
|
||||
} else if (this.operation == OperationEvent.StationStand.cancelJumpStop.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.cancelJumpStop');
|
||||
}
|
||||
return '';
|
||||
},
|
||||
preContext() {
|
||||
return this.title + ':';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
if (!this.dialogShow) {
|
||||
this.standName = '';
|
||||
if (selected) {
|
||||
this.standName = selected.name;
|
||||
}
|
||||
|
||||
this.selected = selected;
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
if (this.operation == OperationEvent.StationStand.setDetainTrain.menu.operation) {
|
||||
/** 设置扣车*/
|
||||
this.setDetainTrain();
|
||||
} else if (this.operation == OperationEvent.StationStand.cancelDetainTrain.menu.operation) {
|
||||
/** 取消扣车*/
|
||||
this.cancelDetainTrain();
|
||||
} else if (this.operation == OperationEvent.StationStand.cancelDetainTrainForce.menu.operation) {
|
||||
/** 强制取消扣车*/
|
||||
this.cancelDetainTrainForce();
|
||||
} else if (this.operation == OperationEvent.StationStand.earlyDeparture.menu.operation) {
|
||||
/** 提前发车*/
|
||||
this.earlyDeparture();
|
||||
} else if (this.operation == OperationEvent.StationStand.setJumpStop.menu.operation) {
|
||||
/** 设置跳停*/
|
||||
this.setJumpStop();
|
||||
} else if (this.operation == OperationEvent.StationStand.cancelJumpStop.menu.operation) {
|
||||
/** 取消跳停*/
|
||||
this.cancelJumpStop();
|
||||
}
|
||||
},
|
||||
// 设置扣车
|
||||
setDetainTrain() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setDetainTrain.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
if (!valid) {
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 取消扣车
|
||||
cancelDetainTrain() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.cancelDetainTrain.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
if (!valid) {
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 强制取消扣车
|
||||
cancelDetainTrainForce() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.cancelDetainTrainForce.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
if (!valid) {
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 提前发车
|
||||
earlyDeparture() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.earlyDeparture.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 设置跳停
|
||||
setJumpStop() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setJumpStop.menu.operation,
|
||||
val: this.selected.direction // 站台的上下行方向, 01:下行 /02:上行
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
// 取消跳停
|
||||
cancelJumpStop() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.cancelJumpStop.menu.operation,
|
||||
val: this.selected.direction // 站台的上下行方向, 01:下行 /02:上行
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.loading = false;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.stand-detain-train .context {
|
||||
height: 80px !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,179 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm stand-detail"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="400px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="10"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="10" :offset="2"><span>{{ $t('menu.platform') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="10">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-input v-model="standName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table">
|
||||
<span>{{ $t('menu.stationStandStatus') }}</span>
|
||||
<el-table ref="tempData" :data="tempData" border style="width: 100%" size="mini" highlight-current-row>
|
||||
<el-table-column prop="item" :width="140" :label="this.$t('menu.item')" />
|
||||
<el-table-column prop="status" :label="this.$t('global.status')" />
|
||||
</el-table>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
import { mapGetters } from 'vuex';
|
||||
|
||||
export default {
|
||||
name: 'StandDetail',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
tempData: [],
|
||||
stationName: '',
|
||||
standName: '',
|
||||
strategyMap: {
|
||||
'01': this.$t('menu.noSwitchback'),
|
||||
'02': this.$t('menu.noOneSwitchback'),
|
||||
'03': this.$t('menu.automaticChange'),
|
||||
'04': this.$t('menu.default')
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'stationList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.Command.close.confirm.domId : '';
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.menuStationStand.getStationStandStatus');
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
loadInitData(selected, opts) {
|
||||
this.tempData = [];
|
||||
|
||||
const index = this.stationList.findIndex(n => n.code == selected.stationCode);
|
||||
let stationStand, station;
|
||||
if (selected.direction == '01') { // 下行
|
||||
// 下行时，此站不是最后一站
|
||||
if (index != 0) {
|
||||
stationStand = this.$store.getters['map/getDeviceByCode'](this.stationList[index - 1].code);
|
||||
station = this.$store.getters['map/getDeviceByCode'](stationStand.stationCode);
|
||||
}
|
||||
} else {
|
||||
// 上行时，此站不是最后一站
|
||||
if (index != this.stationList.length - 1) {
|
||||
stationStand = this.$store.getters['map/getDeviceByCode'](this.stationList[index + 1].code);
|
||||
station = this.$store.getters['map/getDeviceByCode'](stationStand.stationCode);
|
||||
}
|
||||
}
|
||||
|
||||
/** 01: 未设置扣车 02: 车站扣车 03: 中心扣车 04: 中心+车站扣车*/
|
||||
this.tempData.push({ item: this.$t('menu.stationDetainTrain'), status: opts.holdStatus == '02' || opts.holdStatus == '04' ? this.$t('menu.hasBeenSet') : this.$t('menu.notSet') });
|
||||
this.tempData.push({ item: this.$t('menu.centerDetainTrain'), status: opts.holdStatus == '03' || opts.holdStatus == '04' ? this.$t('menu.hasBeenSet') : this.$t('menu.notSet') });
|
||||
this.tempData.push({ item: this.$t('menu.stopTime'), status: opts.parkingTime != -1 ? opts.parkingTime : this.$t('menu.automatic2') });
|
||||
if (!stationStand || !station) {
|
||||
this.tempData.push({ item: this.$t('menu.runLevel'), status: this.$t('menu.automatic2') });
|
||||
} else {
|
||||
this.tempData.push({ item: this.$t('menu.runLevel'), status: opts.intervalRunTime > 0 ? this.$t('menu.to') + station.name + stationStand.name + this.$t('global.colon') + this.$t('menu.artificial') : this.$t('menu.to') + station.name + stationStand.name + this.$t('menu.automatic2') });
|
||||
}
|
||||
this.tempData.push({ item: this.$t('menu.jumpStop'), status: opts.jumpStopStatus != '01' ? this.$t('menu.hasBeenSet') : this.$t('menu.notSet') });
|
||||
this.tempData.push({ item: this.$t('menu.downSwitchbackStrategy'), status: this.strategyMap[opts.reentryStrategy] ? this.strategyMap[opts.reentryStrategy] : this.$t('menu.default') });
|
||||
},
|
||||
doShow(operate, selected, opts) {
|
||||
if (!this.dialogShow) {
|
||||
this.standName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'StationStand'.toUpperCase()) {
|
||||
this.standName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
this.loadInitData(selected, opts);
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.Command.close.confirm.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,191 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm stand-detain-train-all"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="390px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-radio-group style="padding: 10px 20px; border: 1px double lightgray;width:100%;">
|
||||
<span class="base-label" style="font-size:14px;">{{ $t('menu.range') }}</span>
|
||||
<el-row>
|
||||
<el-radio-group v-model="upDown" style="width:100%;" @change="choose">
|
||||
<el-col :span="11">
|
||||
<el-radio :id="upDown == '01' ? domIdChoose : ''" label="02">{{ $t('menu.uplinkBroadly') }}</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="11" :offset="1">
|
||||
<el-radio :id="upDown == '02' ? domIdChoose : ''" label="01">{{ $t('menu.downlinkBroadly') }}</el-radio>
|
||||
</el-col>
|
||||
</el-radio-group>
|
||||
</el-row>
|
||||
</el-radio-group>
|
||||
|
||||
<div class="table">
|
||||
<span>{{ $t('menu.detainTrainStationList') }}</span>
|
||||
<el-table
|
||||
ref="tempData"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
:empty-text="this.$t('menu.allStationsHaveNoDetainTrainStatus')"
|
||||
height="160"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column prop="stationName" :label="this.$t('menu.stationName')" />
|
||||
<el-table-column prop="standName" :width="140" :label="this.$t('menu.detainTrainStation')" />
|
||||
</el-table>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" :disabled="disabled" @click="commit">{{ $t('global.confirm') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'StandDetainTrainAll',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
upDown: '01',
|
||||
tempData: [],
|
||||
disabled: true,
|
||||
operation: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'stationStandList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdChoose() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.cancelDetainTrainAll.choose.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.cancelDetainTrainAll.menu.domId : '';
|
||||
},
|
||||
title() {
|
||||
if (this.operation == OperationEvent.StationStand.cancelDetainTrainAll.menu.operation) {
|
||||
return this.$t('menu.menuStationStand.cancelDetainTrainAll');
|
||||
} else {
|
||||
return this.$t('menu.menuStationStand.cancelJumpStopAll');
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
loadTableData() {
|
||||
this.tempData = [];
|
||||
this.stationStandList.forEach(elem => {
|
||||
/** status 01: 未扣车*/
|
||||
const stand = (this.$store.getters['map/getDeviceByCode'](elem.code) || {}).status;
|
||||
const station = (this.$store.getters['map/getDeviceByCode'](elem.stationCode) || {});
|
||||
if (station && stand && stand.holdStatus != '01' && Number(elem.direction) == Number(this.upDown)) {
|
||||
this.tempData.push({ stationName: station.name, standName: elem.name });
|
||||
}
|
||||
});
|
||||
|
||||
// 如果存在未扣车的情况，才可以做此操作
|
||||
if (this.tempData.length > 0) {
|
||||
this.disabled = false;
|
||||
}
|
||||
},
|
||||
doShow(operate, selected) {
|
||||
// 不是断点激活的菜单应该将状态初始化
|
||||
if (!this.dialogShow) {
|
||||
this.loading = false;
|
||||
this.upDown = selected.direction;
|
||||
this.loadTableData();
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
choose(upDown) {
|
||||
// 重新设置扣车站台
|
||||
this.loadTableData();
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.cancelDetainTrainAll.choose.operation,
|
||||
val: `${upDown}`
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.cancelDetainTrainAll.menu.operation,
|
||||
val: this.upDown
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,269 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm stand-run-level"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="500px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="10"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="10" :offset="2"><span>{{ $t('menu.platform') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="10">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-input v-model="standName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table">
|
||||
<span>{{ $t('menu.stationStandStatus') }}</span>
|
||||
<el-table ref="tempData" :data="tempData" border style="width: 100%; height: 170px;" size="mini">
|
||||
<el-table-column prop="name" :width="210" :label="this.$t('menu.nextPlatform')" />
|
||||
<el-table-column prop="time" :label="this.$t('menu.intervalRunningTime')">
|
||||
<template slot-scope="scope">
|
||||
<el-select :id="domIdChoose" v-model="scope.row.time" size="mini" @change="timeSelectChange">
|
||||
<el-option
|
||||
v-for="item in timeList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="check" :label="this.$t('menu.alwaysEffective')">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox :id="domIdCheck" ref="check" v-model="scope.row.check" @change="checkChange" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-row class="button-group">
|
||||
<span v-if="isSelect && tempData.length">{{ $t('menu.setRunLevelTip') }}</span>
|
||||
<span v-if="isConfirm && tempData.length">{{ $t('menu.setRunLevelStationTip') + tempData[0].name }}</span>
|
||||
</el-row>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" :disabled="!isConfirm" @click="commit">
|
||||
{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<confirm-control ref="confirmControl" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import ConfirmControl from './childDialog/confirmControl';
|
||||
import { mapGetters } from 'vuex';
|
||||
|
||||
export default {
|
||||
name: 'StandRunLevel',
|
||||
components: {
|
||||
ConfirmControl
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
tempData: [],
|
||||
maxRunLevel: 300,
|
||||
stationName: '',
|
||||
standName: '',
|
||||
selection: [],
|
||||
isSelect: true,
|
||||
isConfirm: false,
|
||||
time: ''
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
// 深度数据状态
|
||||
tempData: {
|
||||
handler(val, oldVal) {
|
||||
this.checkTableDataSelction(val);
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'stationList',
|
||||
'stationStandList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setRunLevel.menu.domId : '';
|
||||
},
|
||||
domIdChoose() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setRunLevel.choose.domId : '';
|
||||
},
|
||||
domIdCheck() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setRunLevel.check.domId : '';
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.menuStationStand.setRunLevel');
|
||||
},
|
||||
timeList() {
|
||||
const list = [
|
||||
{ value: 0, label: this.$t('menu.automatic2') },
|
||||
{ value: 1, label: '1' }
|
||||
];
|
||||
for (var i = 60; i <= this.maxRunLevel; i++) {
|
||||
list.push({ value: i, label: `${i}` });
|
||||
}
|
||||
|
||||
return list;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
loadInitData(selected, opts) {
|
||||
this.tempData = [];
|
||||
const index = this.stationList.findIndex(n => n.code == selected.stationCode);
|
||||
if (selected.direction == '01') { // 下行
|
||||
// 下行时，此站不是最后一站
|
||||
if (index != 0) {
|
||||
const stationStand = this.$store.getters['map/getDeviceByCode'](this.stationStandList[index + 1].code);
|
||||
const station = this.$store.getters['map/getDeviceByCode'](stationStand.stationCode);
|
||||
this.tempData.push({ name: `${stationStand.name}(${station.name})`, time: opts.intervalRunTime ? opts.intervalRunTime : 0, check: opts.intervalRunTimeValidStatus });
|
||||
}
|
||||
} else {
|
||||
// 上行时，此站不是最后一站
|
||||
if (index != this.stationList.length) {
|
||||
const stationStand = this.$store.getters['map/getDeviceByCode'](this.stationStandList[index + 1].code);
|
||||
const station = this.$store.getters['map/getDeviceByCode'](stationStand.stationCode);
|
||||
this.tempData.push({ name: `${stationStand.name}(${station.name})`, time: opts.intervalRunTime ? opts.intervalRunTime : 0, check: opts.intervalRunTimeValidStatus });
|
||||
}
|
||||
}
|
||||
},
|
||||
doShow(operate, selected, opts) {
|
||||
// 如果不是断点激活窗口，而是第一次显示窗口时，需要初始化窗口数据
|
||||
if (!this.dialogShow) {
|
||||
this.standName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'StationStand'.toUpperCase()) {
|
||||
this.standName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
this.loadInitData(selected, opts);
|
||||
}
|
||||
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
checkTableDataSelction(data) {
|
||||
const selection = [];
|
||||
if (data && data.length > 0) {
|
||||
data.forEach(row => {
|
||||
if (row.check && !row.disabled) {
|
||||
selection.push(row);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this.disabledSend = !selection.length;
|
||||
if (JSON.stringify(selection) !== JSON.stringify(this.selection)) {
|
||||
this.selection = selection;
|
||||
}
|
||||
},
|
||||
timeSelectChange(time) {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setRunLevel.choose.operation,
|
||||
val: time.toString()
|
||||
};
|
||||
|
||||
this.time = time.toString();
|
||||
this.isSelect = false;
|
||||
this.isConfirm = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
},
|
||||
checkChange(check) {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setRunLevel.check.operation,
|
||||
val: check.toString()
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
if (this.isConfirm) {
|
||||
const forver = !!this.tempData[0].check;
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setRunLevel.menu.operation,
|
||||
messages: [`${this.$t('menu.menuStationStand.setRunLevel')}${this.$t('global.colon')}${this.tempData[0].name}-${this.standName},${this.tempData[0].time == 0 ? this.$t('menu.runTimeAutomatically') : `${this.$t('menu.runningTimeIs')}${this.tempData[0].time}s`},${this.$t('menu.effectiveFrequencyIs')}${this.tempData[0].check ? this.$t('menu.alwaysEffective') : this.$t('menu.onceEffective')}`],
|
||||
val: [this.time, forver].join('::')
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.$refs.confirmControl.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
});
|
||||
} else {
|
||||
this.doClose();
|
||||
}
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,255 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm stand-stop-time"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="430px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row class="header">
|
||||
<el-col :span="11"><span>{{ $t('menu.stationName') }}</span></el-col>
|
||||
<el-col :span="11" :offset="2"><span>{{ $t('menu.platformName') }}</span></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-col>
|
||||
<el-col :span="11" :offset="2">
|
||||
<el-input v-model="standName" size="small" disabled />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div style="padding: 10px 15px; border: 1px double lightgray; margin: 20px 0px; height: 60px;">
|
||||
<span class="base-label">{{ $t('menu.controlMode') }}</span>
|
||||
<div style=" position: relative; top:-10px;">
|
||||
<el-radio-group v-model="control" @change="chooseControl">
|
||||
<el-radio :id="control === '01'? '': domIdChoose1" label="01">{{ $t('menu.automatic2') }}</el-radio>
|
||||
<el-radio :id="control === '02'? '': domIdChoose1" label="02">{{ $t('menu.artificial') }}</el-radio>
|
||||
</el-radio-group>
|
||||
<el-input-number
|
||||
:id="domIdInput"
|
||||
v-model="time"
|
||||
:disabled="disabledInput"
|
||||
controls-position="right"
|
||||
:min="0"
|
||||
size="mini"
|
||||
style="width: 125px; padding-left:25px"
|
||||
@change="inputTime"
|
||||
/><span> {{ $t('global.second') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 0px 15px; height: 30px;">
|
||||
<div style=" position: relative; top:-5px;">
|
||||
<el-radio-group v-model="direction">
|
||||
<el-radio label="02" :disabled="disabledUp">{{ $t('menu.upDirection') }}</el-radio>
|
||||
<el-radio label="01" :disabled="disabledDown">{{ $t('menu.downDirection') }}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 10px 15px; border: 1px double lightgray; height: 60px;">
|
||||
<span class="base-label">{{ $t('menu.effectiveNumber') }}</span>
|
||||
<div style=" position: relative; top:-10px;">
|
||||
<el-radio-group v-model="effective" :disabled="disabledTime" @change="chooseEffective">
|
||||
<el-radio :id="effective === false? '': domIdChoose2" :label="false">{{ $t('menu.onceEffective') }}</el-radio>
|
||||
<el-radio :id="effective === true? '': domIdChoose2" :label="true">{{ $t('menu.alwaysEffective') }}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<confirm-control ref="confirmControl" />
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import ConfirmControl from './childDialog/confirmControl';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'StandStopTime',
|
||||
components: {
|
||||
ConfirmControl,
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
time: 0,
|
||||
control: '01',
|
||||
direction: '01',
|
||||
effective: false,
|
||||
selected: null,
|
||||
standName: '',
|
||||
stationName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.close.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setStopTime.menu.domId : '';
|
||||
},
|
||||
domIdChoose1() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setStopTime.choose1.domId : '';
|
||||
},
|
||||
domIdChoose2() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setStopTime.choose2.domId : '';
|
||||
},
|
||||
domIdInput() {
|
||||
return this.dialogShow ? OperationEvent.StationStand.setStopTime.input.domId : '';
|
||||
},
|
||||
disabledUp() {
|
||||
if (this.selected) {
|
||||
return this.selected.direction !== '02';
|
||||
}
|
||||
return true;
|
||||
},
|
||||
disabledDown() {
|
||||
if (this.selected) {
|
||||
return this.selected.direction !== '01';
|
||||
}
|
||||
return true;
|
||||
},
|
||||
disabledInput() {
|
||||
return this.control === '01'; // 如果是自动则不可以设置
|
||||
},
|
||||
disabledTime() {
|
||||
return this.control === '01'; // 如果是自动则不可以设置
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.stopTime');
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected, tempDate) {
|
||||
// 如果不是断点激活，则需要对初始值进行初始化
|
||||
if (!this.dialogShow) {
|
||||
this.standName = '';
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'StationStand'.toUpperCase()) {
|
||||
this.standName = selected.name;
|
||||
const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
|
||||
if (station) {
|
||||
this.stationName = station.name;
|
||||
}
|
||||
}
|
||||
|
||||
this.control = Number(tempDate.parkingTime) === -1 ? '01' : '02';
|
||||
this.time = Number(tempDate.parkingTime) === -1 ? 15 : Number(tempDate.parkingTime);
|
||||
this.effective = !!tempDate.parkingValidStatus;
|
||||
this.direction = selected.direction;
|
||||
this.selected = selected || {};
|
||||
}
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
chooseControl(control) {
|
||||
/** 自动时的默认时间*/
|
||||
if (control == '01') {
|
||||
this.inputTime = 15;
|
||||
this.effective = true;
|
||||
}
|
||||
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setStopTime.choose1.operation,
|
||||
val: `${control}`
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
},
|
||||
chooseEffective(effective) {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setStopTime.choose2.operation,
|
||||
val: `${effective}`
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
},
|
||||
inputTime(time) {
|
||||
const operate = {
|
||||
repeat: true,
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setStopTime.input.operation,
|
||||
val: `${time}`
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
}
|
||||
});
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.StationStand.setStopTime.menu.operation,
|
||||
val: [`${this.control}`, this.time, this.effective].join('::'),
|
||||
messages: [`${this.$t('menu.stopTime') + this.$t('global.colon') + this.stationName} - ${this.standName}, ${this.$t('menu.stopTimeIs')}${this.control == '01' ? this.$t('menu.automatic2') : this.time + this.$t('global.second')}, ${this.$t('menu.effectiveFrequencyIs')}${this.effective == false ? this.$t('menu.alwaysEffective') : this.$t('menu.onceEffective')}`]
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.$refs.confirmControl.doShow(operate);
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.StationStand.type,
|
||||
operation: OperationEvent.Command.close.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => { this.doClose(); });
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,409 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm station-cmd-control"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="840px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<div style="padding: 10px 20px; border: 1px solid lightgray;">
|
||||
<span class="base-label">{{ $t('menu.commandInformation') }}</span>
|
||||
<el-form label-position="center" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
<el-form-item :label="this.$t('menu.type')" label-width="40px">
|
||||
<el-select v-model="operation" size="small" disabled style="width:230px">
|
||||
<el-option
|
||||
v-for="option in typeList"
|
||||
:key="option.code"
|
||||
:label="option.name"
|
||||
:value="option.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-form-item :label="this.$t('menu.stationName')" label-width="100px">
|
||||
<el-input v-model="stationName" size="small" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table
|
||||
ref="tempData"
|
||||
class="table"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
height="200"
|
||||
>
|
||||
<el-table-column prop="order" :width="110" :label="this.$t('menu.serialNumber2')" />
|
||||
<el-table-column prop="date" :width="160" :label="this.$t('menu.time')" />
|
||||
<el-table-column prop="context" :width="180" :label="this.$t('menu.implementationProcess')" />
|
||||
<el-table-column prop="result" :label="this.$t('menu.executionResult')" />
|
||||
</el-table>
|
||||
<span class="notice">{{ message }}</span>
|
||||
<el-row class="button-group">
|
||||
<el-col :span="2" :offset="3">
|
||||
<el-button :id="domIdCommand" type="primary" :disabled="cmdDisabled[0]" @click="command">{{ $t('menu.release') }}<span
|
||||
v-show="timeCountCommand>0"
|
||||
>({{ timeCountCommand }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdConfirm1" type="primary" style="width:120px;" :disabled="cmdDisabled[1]" @click="confirm1">{{ $t('menu.firstConfirm') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdConfirm2" type="primary" style="width:120px;" :disabled="cmdDisabled[2]" @click="confirm2">{{ $t('menu.secondConfirm') }}<span
|
||||
v-show="timeCountConfirm>0"
|
||||
>({{ timeCountConfirm }})</span></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="2">
|
||||
<el-button :id="domIdStop" type="primary" :disabled="stpDisabled" @click="stop">{{ $t('menu.suspend') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" :offset="1">
|
||||
<el-button :id="domIdClose" @click="close">{{ $t('global.close') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import { now } from '@/utils/date';
|
||||
|
||||
export default {
|
||||
name: 'StationCmdControl',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
backOperate: '',
|
||||
order: 0,
|
||||
row: null,
|
||||
timer: null,
|
||||
operation: '',
|
||||
cmdDisabled: [true, true, true],
|
||||
stpDisabled: true,
|
||||
tempData: [],
|
||||
message: '',
|
||||
timeCountCommand: -1,
|
||||
timeCountConfirm: -1,
|
||||
stationName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
typeList() {
|
||||
return [
|
||||
{ code: OperationEvent.Station.powerUnLock.menu.operation, name: this.$t('menu.menuStation.powerUnLock') },
|
||||
{ code: OperationEvent.Station.execKeyOperationTest.menu.operation, name: this.$t('menu.menuStation.execKeyOperationTest') }
|
||||
];
|
||||
},
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
domIdCommand() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
return OperationEvent.Station.powerUnLock.order.domId;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
return OperationEvent.Station.execKeyOperationTest.order.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdConfirm1() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
return OperationEvent.Station.powerUnLock.confirm1.domId;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
return OperationEvent.Station.execKeyOperationTest.confirm1.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdConfirm2() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
return OperationEvent.Station.powerUnLock.confirm2.domId;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
return OperationEvent.Station.execKeyOperationTest.confirm2.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdStop() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
return OperationEvent.Station.powerUnLock.stop.domId;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
return OperationEvent.Station.execKeyOperationTest.stop.domId;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
domIdClose() {
|
||||
if (this.dialogShow) {
|
||||
return OperationEvent.Command.close.menu.domId;
|
||||
}
|
||||
return '';
|
||||
},
|
||||
title() {
|
||||
if (this.dialogShow) {
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
return this.$t('menu.signalDeblocking');
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
return this.$t('menu.menuStation.execKeyOperationTest');
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
cmdDisabled: {
|
||||
handler(val, oldVal) {
|
||||
this.stpDisabled = true;
|
||||
val.forEach((elem, index) => {
|
||||
// 在确定1之前的操作才可以终止
|
||||
if (elem == false && index >= 1 && index <= 2) {
|
||||
this.stpDisabled = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
this.timer = setInterval(() => {
|
||||
if (!this.$store.state.menuOperation.break) {
|
||||
if (this.timeCountCommand > 0) {
|
||||
this.timeCountCommand--;
|
||||
} else if (this.timeCountCommand == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountCommand = -1;
|
||||
}
|
||||
if (this.timeCountConfirm > 0) {
|
||||
this.timeCountConfirm--;
|
||||
} else if (this.timeCountConfirm == 0) {
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.timeCountConfirm = -1;
|
||||
}
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
methods: {
|
||||
doShow(operate, selected) {
|
||||
if (!this.dialogShow) {
|
||||
this.stationName = '';
|
||||
if (selected && selected._type.toUpperCase() === 'Station'.toUpperCase()) {
|
||||
this.stationName = selected.name;
|
||||
}
|
||||
|
||||
this.order = 0;
|
||||
this.operation = operate.operation;
|
||||
this.tempData = [];
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.cmdDisabled = [false, true, true];
|
||||
}
|
||||
this.stpDisabled = true;
|
||||
this.dialogShow = true;
|
||||
this.setMessage(this.$t('tip.releaseTip'));
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
command() {
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation ||
|
||||
this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 第一步不带弹框处理*/
|
||||
this.commandNoPopUp();
|
||||
} else {
|
||||
/** 第一步带弹框处理*/
|
||||
this.commandHasPopUp();
|
||||
}
|
||||
},
|
||||
commandHasPopUp() {
|
||||
},
|
||||
commandNoPopUp() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Station.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
operate.operation = OperationEvent.Station.powerUnLock.order.operation;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
operate.operation = OperationEvent.Station.execKeyOperationTest.order.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.firstConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 1 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickReleaseCommand'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm1() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Station.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
operate.operation = OperationEvent.Station.powerUnLock.confirm1.operation;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
operate.operation = OperationEvent.Station.execKeyOperationTest.confirm1.operation;
|
||||
}
|
||||
|
||||
this.setMessage(this.$t('tip.secondConfirmTip'));
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = 10;
|
||||
this.setButtonEnable({ step: 2 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickFirstConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
confirm2() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Station.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
operate.operation = OperationEvent.Station.powerUnLock.confirm2.operation;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
operate.operation = OperationEvent.Station.execKeyOperationTest.confirm2.operation;
|
||||
}
|
||||
|
||||
this.setMessage('');
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.timeCountCommand = -1;
|
||||
this.timeCountConfirm = -1;
|
||||
this.setButtonEnable({ step: -1 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSecondConfirm'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
stop() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Station.type
|
||||
};
|
||||
|
||||
if (this.operation == OperationEvent.Station.powerUnLock.menu.operation) {
|
||||
/** 上电解锁*/
|
||||
operate.operation = OperationEvent.Station.powerUnLock.stop.operation;
|
||||
} else if (this.operation == OperationEvent.Station.execKeyOperationTest.menu.operation) {
|
||||
/** 执行关键操作测试*/
|
||||
operate.operation = OperationEvent.Station.execKeyOperationTest.stop.operation;
|
||||
}
|
||||
|
||||
this.writeRecord({ order: ++this.order, date: now(), context: this.$t('menu.clickSuspend'), result: '' });
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.setButtonEnable({ step: 0 });
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionSucceed') });
|
||||
} else {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionFailed') });
|
||||
}
|
||||
}).catch(() => {
|
||||
this.editRecord({ order: this.order, date: now(), context: this.$t('menu.clickSuspend'), result: this.$t('tip.executionException') });
|
||||
});
|
||||
},
|
||||
close() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Station.type,
|
||||
operation: OperationEvent.Command.close.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
getOperate(operate) {
|
||||
/** 弹框返回值处理*/
|
||||
},
|
||||
setButtonEnable(param) {
|
||||
this.cmdDisabled = [true, true, true];
|
||||
if (param && param.step >= 0) {
|
||||
this.cmdDisabled[param.step] = false;
|
||||
}
|
||||
},
|
||||
setMessage(message) {
|
||||
this.message = message;
|
||||
},
|
||||
writeRecord(param) {
|
||||
this.tempData.push(param);
|
||||
},
|
||||
editRecord(param) {
|
||||
this.tempData.forEach(elem => {
|
||||
if (elem.order == param.order) {
|
||||
for (var prop in param) {
|
||||
elem[prop] = param[prop];
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,124 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="fuzhou-01__systerm station-human-control-all"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="430px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
>
|
||||
<div class="context">
|
||||
<span>{{ title }}</span>
|
||||
</div>
|
||||
<el-row justify="center" class="button-group">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8" :offset="4">
|
||||
<el-button :id="domIdCancel" @click="cancel">{{ $t('global.cancel') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<notice-info ref="noticeInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from './childDialog/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'StationHumanControlAll',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
operation: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return this.$t('menu.fullConcentrationStationAccessManualControl');
|
||||
},
|
||||
domIdCancel() {
|
||||
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
|
||||
},
|
||||
domIdConfirm() {
|
||||
return this.dialogShow ? OperationEvent.Station.humanControlALL.menu.domId : '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('training/tipReload');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
doShow(operate) {
|
||||
if (!this.dialogShow) {
|
||||
this.loading = false;
|
||||
this.operation = operate.operation;
|
||||
}
|
||||
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
commit() {
|
||||
const operate = {
|
||||
send: true,
|
||||
type: MapDeviceType.Station.type,
|
||||
label: MapDeviceType.Station.label,
|
||||
operation: OperationEvent.Station.humanControlALL.menu.operation
|
||||
};
|
||||
|
||||
this.loading = true;
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
this.loading = false;
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.$refs.noticeInfo.doShow(operate);
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
type: MapDeviceType.Station.type,
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('training/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.station-human-control-all .context {
|
||||
padding-bottom: 40px !important;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user