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

增加绘图表示灯&&线条颜色

Browse Source
This commit is contained in:
fan 2020-03-19 16:17:34 +08:00
parent 16caa26336
commit 36b7d7309a
15 changed files with 790 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/i18n/langs/en/map.js
View File

@ -609,5 +609,6 @@ export default {
physicalSectionName: 'Physical section name',
routePhysicalSectionData: 'Route physical section data',
routeSideDefenseSwitch: 'Route side defense switch',
switchID: 'Switch ID'
switchID: 'Switch ID',
lineColor: 'Line Color'
};

3
src/i18n/langs/zh/map.js
View File

@ -604,5 +604,6 @@ export default {
routeSideDefenseSwitch: '进路侧防道岔',
switchID: '道岔ID',
normalPosition: '定位',
reversePosition: '反位'
reversePosition: '反位',
lineColor: '线条颜色'
};

1
src/jmapNew/config/skinCode/bejing_01.js
View File

@ -462,7 +462,6 @@ class SkinCode extends defaultStyle {
textColor: '#000000'
}
};
this[deviceType.ZcControl] = {
// 是否显示
visible: true,

109
src/jmapNew/config/skinCode/chengdu_03.js
View File

@ -405,7 +405,114 @@ class SkinCode extends defaultStyle {
controlColor: '#FFFF00' // 控制灯颜色
}
};
this[deviceType.PowerSupply] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.Maintain] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.NoOneReturn] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11,
fontWeight: 'normal',
distance: 5
},
lamp: {
radiusR: 6,
controlColor: '#FFFFFF'
}
};
this[deviceType.AtsControl] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.ChainControl] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.IntersiteControl] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.CenterCommunication] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.LeuControl] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.LocalControl] = {
displayCondition: '03', // 显示条件 （01所有模式下显示 02 行调显示 03现地显示）
text: {
fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细
distance: 5 // 灯跟文字距离
},
lamp: {
radiusR: 6, // 控制灯大小
controlColor: '#00FF00' // 控制灯颜色
}
};
this[deviceType.ZcControl] = {
text: {
fontSize: 11, // 字体大小

45
src/jmapNew/constant/deviceRender.js
View File

@ -145,5 +145,50 @@ deviceRender[deviceType.GuideLock] = {
_type: deviceType.GuideLock,
zlevel: 1
};
/** AtsControl ATS通信表示灯 */
deviceRender[deviceType.AtsControl] = {
_type: deviceType.AtsControl,
zlevel: 1
};
/** CenterCommunication 中心通信表示灯 */
deviceRender[deviceType.CenterCommunication] = {
_type: deviceType.AtsControl,
zlevel: 1
};
/** ChainControl 连锁主备状态表示灯 */
deviceRender[deviceType.ChainControl] = {
_type: deviceType.ChainControl,
zlevel: 1
};
/** IntersiteControl 站间通信表示灯 */
deviceRender[deviceType.IntersiteControl] = {
_type: deviceType.IntersiteControl,
zlevel: 1
};
/** LeuControl LEU通信表示灯 */
deviceRender[deviceType.LeuControl] = {
_type: deviceType.LeuControl,
zlevel: 1
};
/** LocalControl 现地主备状态表示灯 */
deviceRender[deviceType.LocalControl] = {
_type: deviceType.LocalControl,
zlevel: 1
};
/** Maintain 维护工作站表示灯 */
deviceRender[deviceType.Maintain] = {
_type: deviceType.Maintain,
zlevel: 1
};
/** PowerSupply 电源状态表示灯 */
deviceRender[deviceType.PowerSupply] = {
_type: deviceType.PowerSupply,
zlevel: 1
};
/** NoOneReturn 无人折返状态表示灯 */
deviceRender[deviceType.NoOneReturn] = {
_type: deviceType.NoOneReturn,
zlevel: 1
};
export default deviceRender;

11
src/jmapNew/constant/deviceType.js
View File

@ -22,7 +22,16 @@ const deviceType = {
Line: 'Line',
Text: 'Text',
CheckBox: 'CheckBox',
AutomaticRoute:'AutomaticRoute'
AutomaticRoute:'AutomaticRoute',
AtsControl: 'AtsControl',
CenterCommunication: 'CenterCommunication',
ChainControl: 'ChainControl',
IntersiteControl: 'IntersiteControl',
LeuControl: 'LeuControl',
LocalControl: 'LocalControl',
Maintain: 'Maintain',
PowerSupply: 'PowerSupply',
NoOneReturn: 'NoOneReturn'
};
export default deviceType;

4
src/jmapNew/shape/Line/index.js
View File

@ -28,7 +28,7 @@ export default class Line2 extends Group {
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,
z: this.z,
shape: {
x1: model.points[i].x,
y1: model.points[i].y,
@ -37,7 +37,7 @@ export default class Line2 extends Group {
},
style: {
lineWidth: model.width,
stroke: style.Line.lineColor
stroke: model.lineColor || style.Line.lineColor
}
}));
}

53
src/jmapNew/shape/SaidLamp/EMouse.js Normal file
View File

@ -0,0 +1,53 @@
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.deviceStyle.lamp.radiusR + this.device.deviceStyle.text.distance - 30,
fontWeight: 'normal',
fontSize: this.device.deviceStyle.mouseOverStyle.fontSize,
fontFamily: this.device.deviceStyle.mouseOverStyle.fontFamily,
text: this.device.model.name,
textFill: this.device.deviceStyle.mouseOverStyle.fontColor,
textAlign: this.device.deviceStyle.mouseOverStyle.textAlign,
textVerticalAlign: this.device.deviceStyle.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.deviceStyle.mouseOverStyle.arcColor);
this.device.control.setTextColor(this.device.deviceStyle.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.deviceStyle.lamp.controlColor);
this.device.control.setTextColor('#FFFFFF');
this.device.control.setTextBorder(false);
this.device.control.setArcBorder(false);
}
}
}
}

103
src/jmapNew/shape/SaidLamp/index.js Normal file
View File

@ -0,0 +1,103 @@
import Group from 'zrender/src/container/Group';
import EControl from '../element/EControl';
import EMouse from './EMouse';
import {isShowThePrdType} from '../../utils/handlePath';
export default class AtsControl 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.deviceStyle = style[model._type];
this.isShowShape = true;
if (isShowThePrdType(model.prdType, this.deviceStyle.displayCondition) || model.previewOrMapDraw) {
this.create();
this.createMouseEvent();
this.setState(model);
}
if (model.previewOrMapDraw) {
this.setShowMode();
}
}
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.deviceStyle.lamp.radiusR
},
subType: 'Control',
lineWidth: 0,
fill: this.deviceStyle.lamp.controlColor
},
text: {
position: [0, 0],
x: model.position.x,
y: model.position.y + this.deviceStyle.lamp.radiusR + this.deviceStyle.text.distance,
fontWeight: this.deviceStyle.text.fontWeight,
fontSize: this.deviceStyle.text.fontSize,
fontFamily: this.style.fontFamily,
text: model.name,
textFill: '#fff',
textAlign: 'middle',
textVerticalAlign: 'top'
},
style: this.style
});
this.add(this.control);
}
// 设置状态
setState(model) {
if (!this.isShowShape) return;
}
createMouseEvent() {
if (this.deviceStyle.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;
}
setShowMode() {
const showMode = this.model.showMode;
const showConditions = this.deviceStyle.displayCondition;
if (showConditions === '01' || showMode === showConditions) {
this.control && this.control.show();
} else {
this.control && this.control.hide();
}
}
setShowStation(stationCode) {
if (!stationCode || this.model.stationCode === stationCode) {
this.control && this.control.show();
this.isShowShape = true;
this.setState(this.model);
} else {
this.control && this.control.hide();
this.isShowShape = false;
}
}
}

10
src/jmapNew/shape/factory.js
View File

@ -21,6 +21,7 @@ import AutoTurnBack from './Automactic/index.js';
import OutFrame from './OutFrame/index.js';
import CheckBox from './checkBox/checkBox.js';
import AutomaticRoute from './AutomacticRoute/index.js';
import AtsControl from './SaidLamp/index.js';
/** 图库*/
const mapShape = {};
@ -46,6 +47,15 @@ mapShape[deviceType.AxleReset] = AxleReset;
mapShape[deviceType.GuideLock] = GuideLock;
mapShape[deviceType.CheckBox] = CheckBox;
mapShape[deviceType.AutomaticRoute] = AutomaticRoute;
mapShape[deviceType.AtsControl] = AtsControl;
mapShape[deviceType.CenterCommunication] = AtsControl;
mapShape[deviceType.ChainControl] = AtsControl;
mapShape[deviceType.IntersiteControl] = AtsControl;
mapShape[deviceType.LeuControl] = AtsControl;
mapShape[deviceType.LocalControl] = AtsControl;
mapShape[deviceType.Maintain] = AtsControl;
mapShape[deviceType.PowerSupply] = AtsControl;
mapShape[deviceType.NoOneReturn] = AtsControl;
function shapefactory(device, jmap) {
const type = device._type;

44
src/jmapNew/utils/parser.js
View File

@ -135,6 +135,41 @@ export function parser(data, skinCode, showConfig) {
mapDevice[elem.code] = createDevice(deviceType.OutFrame, elem, propConvert, showConfig);
}, this);
zrUtil.each(data.atsControlList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.AtsControl, elem, propConvert, showConfig);
});
zrUtil.each(data.centerCommunicationList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.CenterCommunication, elem, propConvert, showConfig);
});
zrUtil.each(data.chainControlList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.ChainControl, elem, propConvert, showConfig);
});
zrUtil.each(data.intersiteControlList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.IntersiteControl, elem, propConvert, showConfig);
});
zrUtil.each(data.leuControlList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.LeuControl, elem, propConvert, showConfig);
});
zrUtil.each(data.localControlList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.LocalControl, elem, propConvert, showConfig);
});
zrUtil.each(data.maintainList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.Maintain, elem, propConvert, showConfig);
});
zrUtil.each(data.powerSupplyList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.PowerSupply, elem, propConvert, showConfig);
});
zrUtil.each(data.noOneReturnList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.NoOneReturn, elem, propConvert, showConfig);
});
zrUtil.each(data.trainWindowList || [], elem => {
mapDevice[elem.code] = createDevice(deviceType.TrainWindow, elem, propConvert, showConfig);
if (elem.sectionCode) {
@ -230,6 +265,15 @@ export function updateMapData(state, model) {
case deviceType.GuideLock: updateForList(model, state, 'totalGuideLockButtonVOList'); break;
case deviceType.OutFrame: updateForList(model, state, 'outerFrameList'); break;
case deviceType.AutomaticRoute: updateForList(model, state, 'automaticRouteButtonList'); break;
case deviceType.AtsControl: updateForList(model, state, 'atsControlList'); break;
case deviceType.CenterCommunication: updateForList(model, state, 'centerCommunicationList'); break;
case deviceType.ChainControl: updateForList(model, state, 'chainControlList'); break;
case deviceType.IntersiteControl: updateForList(model, state, 'intersiteControlList'); break;
case deviceType.LeuControl: updateForList(model, state, 'leuControlList'); break;
case deviceType.LocalControl: updateForList(model, state, 'localControlList'); break;
case deviceType.Maintain: updateForList(model, state, 'maintainList'); break;
case deviceType.PowerSupply: updateForList(model, state, 'powerSupplyList'); break;
case deviceType.NoOneReturn: updateForList(model, state, 'noOneReturnList'); break;
}
}
}

63
src/store/modules/map.js
View File

@ -361,6 +361,69 @@ const map = {
return [];
}
},
atsControlList: (state) => {
if (state.map) {
return state.map.atsControlList || [];
} else {
return [];
}
},
centerCommunicationList: (state) => {
if (state.map) {
return state.map.centerCommunicationList || [];
} else {
return [];
}
},
chainControlList: (state) => {
if (state.map) {
return state.map.chainControlList || [];
} else {
return [];
}
},
intersiteControlList: (state) => {
if (state.map) {
return state.map.intersiteControlList || [];
} else {
return [];
}
},
leuControlList: (state) => {
if (state.map) {
return state.map.leuControlList || [];
} else {
return [];
}
},
powerSupplyList: (state) => {
if (state.map) {
return state.map.powerSupplyList || [];
} else {
return [];
}
},
maintainList: (state) => {
if (state.map) {
return state.map.maintainList || [];
} else {
return [];
}
},
localControlList: (state) => {
if (state.map) {
return state.map.localControlList || [];
} else {
return [];
}
},
noOneReturnList: (state) => {
if (state.map) {
return state.map.noOneReturnList || [];
} else {
return [];
}
},
automaticRouteButtonList: (state) => {
if (state.map) {
return state.map.automaticRouteButtonList || [];

332
src/views/newMap/newMapdraft/mapoperate/controlLamp.vue Normal file
View File

@ -0,0 +1,332 @@
<template>
<el-tabs v-model="activeName" class="card">
<el-tab-pane class="view-control" label="控制灯" name="first">
<div style="height: calc(100% - 46px);">
<el-scrollbar wrap-class="scrollbar-wrapper">
<config-list ref="dataform" :form="form" :form-model="editModel" :rules="rules" />
</el-scrollbar>
</div>
<div class="button_box">
<el-button-group class="map-draft-group">
<el-button type="primary" size="small" @click="edit">{{ $t('map.updateObj') }}</el-button>
<el-button type="danger" size="small" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
</el-button-group>
</div>
</el-tab-pane>
<el-tab-pane class="view-control" :label="$t('map.newConstruction')" name="second">
<div style="height: calc(100% - 46px);">
<el-scrollbar wrap-class="scrollbar-wrapper">
<config-data ref="make" :form="formMake" :form-model="addModel" :rules="createRules" />
</el-scrollbar>
</div>
<div class="button_box">
<el-button-group class="map-draft-group">
<el-button type="primary" size="small" @click="create">{{ $t('map.create') }}</el-button>
</el-button-group>
</div>
</el-tab-pane>
</el-tabs>
</template>
<script>
import { mapGetters } from 'vuex';
import { getUID } from '@/jmapNew/utils/Uid';
import ConfigList from './config/list';
import ConfigData from './config/data';
import { deepAssign } from '@/utils/index';
export default {
name: 'ControlLamp',
components: {
ConfigList,
ConfigData
},
props: {
selected: {
type: Object,
default: function () {
return null;
}
}
},
data() {
return {
activeName: 'first',
autoList: [],
typeList: [
{ name: 'LEU通信', value: 'LeuControl' },
{ name: '站间通信', value: 'IntersiteControl' },
{ name: '中心通信', value: 'CenterCommunication'},
{ name: 'ATS通信', value: 'AtsControl' },
{ name: '现地主备状态', value: 'LocalControl' },
{ name: '连锁主备状态', value: 'ChainControl' },
{ name: '维护工作站', value: 'Maintain'},
{ name: '电源', value: 'PowerSupply'},
{ name: '无人折返', value: 'NoOneReturn'}
],
editModel: {
code: '',
type: '',
name: '',
stationCode: '', // 所属设备集中站
position: {
x: 0,
y: 0
}
},
addModel: {
code: '',
type: '',
name: '',
stationCode: '', // 所属设备集中站
position: {
x: 0,
y: 0
}
},
rules: {
code: [
{ required: true, message: this.$t('rules.pleaseSelectEncoding'), trigger: 'change' }
],
name: [
{ required: true, message: this.$t('rules.pleaseEnterStatusSignal'), trigger: 'blur' }
],
'position.x': [
{ required: true, message: this.$t('rules.trainPositionX'), trigger: 'blur' }
],
'position.y': [
{ required: true, message: this.$t('rules.trainPositionY'), trigger: 'blur' }
]
}
};
},
computed: {
...mapGetters('map', [
'stationList',
'atsControlList',
'centerCommunicationList',
'chainControlList',
'intersiteControlList',
'leuControlList',
'localControlList',
'maintainList',
'powerSupplyList',
'noOneReturnList'
]),
form() {
const form = {
labelWidth: '150px',
items: {
code: {
name: '',
item: []
},
draw: {
name: this.$t('map.drawData'),
item: [
{ prop:'type', label: '表示灯类型:', type: 'select', optionLabel: 'name', optionValue: 'value', options: this.typeList, disabled: true },
{ prop: 'code', label: `${this.$t('map.code')}`, type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.selectLists, change: true, deviceChange: this.deviceChange },
{ prop: 'name', label: '表示灯名称:', type: 'input' },
{ prop: 'position', label: '坐标:', type: 'coordinate', width: '140px', children: [
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
] },
{ prop:'stationCode', label: '所属集中站:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList}
]
}
}
};
return form;
},
formMake() {
const form = {
labelWidth: '150px',
items: [
{ prop:'type', label: '表示灯类型:', type: 'select', optionLabel: 'name', optionValue: 'value', options: this.typeList, change: true, deviceChange: this.typeChange },
{ prop: 'name', label: '表示灯名称:', type: 'input' },
{ prop: 'position', label: '坐标:', type: 'coordinate', width: '140px', children: [
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '25px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '25px' }
] },
{ prop:'stationCode', label: '所属集中站:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList}
]
};
return form;
},
createRules: function () {
return {
type: [
{ required: true, message: '请选择表示灯类型', trigger: 'change' }
],
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
'position.x': [
{ required: true, message: this.$t('rules.trainPositionX'), trigger: 'blur' }
],
'position.y': [
{ required: true, message: this.$t('rules.trainPositionY'), trigger: 'blur' }
]
};
}
},
watch: {
selected(val, oldVal) {
this.deviceSelect(val);
}
},
mounted() {
},
methods: {
typeChange(type) {
this.$refs.dataform.resetFields();
this.$refs.make.resetFields();
this.addModel.type = type;
this.handleTypes(type);
},
handleTypes(type) {
switch (type) {
case 'AtsControl':
this.selectLists = this.atsControlList;
break;
case 'CenterCommunication':
this.selectLists = this.centerCommunicationList;
break;
case 'ChainControl':
this.selectLists = this.chainControlList;
break;
case 'IntersiteControl':
this.selectLists = this.intersiteControlList;
break;
case 'LeuControl':
this.selectLists = this.leuControlList;
break;
case 'LocalControl':
this.selectLists = this.localControlList;
break;
case 'Maintain':
this.selectLists = this.maintainList;
break;
case 'PowerSupply':
this.selectLists = this.powerSupplyList;
break;
case 'NoOneReturn':
this.selectLists = this.noOneReturnList;
break;
}
},
changeStation(code) { // 选择对应的所属设备集中站
this.autoList.forEach(elem => {
if (elem.code == code) {
this.addModel.stationCode = elem.stationCode;
}
});
},
changeEditStation(code) { // 选择对应的所属设备集中站
this.autoList.forEach(elem => {
if (elem.code == code) {
this.editModel.stationCode = elem.stationCode;
}
});
},
deviceChange(code) {
this.$emit('setCenter', code);
this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
},
deviceSelect(selected) {
this.$refs.dataform.resetFields();
this.$refs.make.resetFields();
if (selected && selected._type.toUpperCase() === 'LeuControl'.toUpperCase() || selected._type.toUpperCase() === 'IntersiteControl'.toUpperCase() ||
selected._type.toUpperCase() === 'CenterCommunication'.toUpperCase() || selected._type.toUpperCase() === 'AtsControl'.toUpperCase() ||
selected._type.toUpperCase() === 'LocalControl'.toUpperCase() || selected._type.toUpperCase() === 'ChainControl'.toUpperCase() ||
selected._type.toUpperCase() === 'Maintain'.toUpperCase() || selected._type.toUpperCase() === 'PowerSupply'.toUpperCase() || selected._type.toUpperCase() === 'NoOneReturn'.toUpperCase()) {
this.activeName = 'first';
this.editModel = deepAssign(this.editModel, selected);
this.editModel.type = selected._type;
}
},
// 创建对象
create() {
this.$refs.make.validate((valid) => {
if (valid) {
const uid = getUID(this.addModel.type, this.selectLists); // 根据类型写 uid 前缀命名
const models = [];
const model = {
_type: this.addModel.type,
code: uid,
name: this.addModel.name,
position: {
x: this.addModel.position.x,
y: this.addModel.position.y
},
stationCode: this.addModel.stationCode // 所属设备集中站
};
models.push(model);
this.$emit('updateMapModel', models);
this.$refs.make.resetForm();
}
});
},
// 修改对象
edit() {
this.$refs['dataform'].validate((valid) => {
if (valid) {
const data = Object.assign({_type: this.editModel.type}, this.editModel);
this.$emit('updateMapModel', [data]);
}
});
},
// 删除对象
deleteObj() {
const selected = this.$store.getters['map/getDeviceByCode'](this.editModel.code);
if (selected && selected._type.toUpperCase() === 'LeuControl'.toUpperCase() || selected._type.toUpperCase() === 'IntersiteControl'.toUpperCase() ||
selected._type.toUpperCase() === 'CenterCommunication'.toUpperCase() || selected._type.toUpperCase() === 'AtsControl'.toUpperCase() ||
selected._type.toUpperCase() === 'LocalControl'.toUpperCase() || selected._type.toUpperCase() === 'ChainControl'.toUpperCase() ||
selected._type.toUpperCase() === 'Maintain'.toUpperCase() || selected._type.toUpperCase() === 'PowerSupply'.toUpperCase() || selected._type.toUpperCase() === 'NoOneReturn'.toUpperCase()) {
this.$confirm(this.$t('tip.confirmDeletion'), this.$t('tip.hint'), {
confirmButtonText: this.$t('tip.confirm'),
cancelButtonText: this.$t('tip.cancel'),
type: 'warning'
}).then(() => {
this.$emit('updateMapModel', {...selected, _dispose: true});
this.$refs.dataform.resetFields();
}).catch(() => {
this.$message.info(this.$t('tip.cancelledDelete'));
});
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.view-control{
height: 100%;
}
.card {
height: 100%;
}
.coordinate {
overflow: hidden;
.title {
text-align: right;
font-size: 14px;
color: #606266;
line-height: 40px;
padding: 0 12px 0 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 28px;
width: 160px;
font-weight: bold;
display: block;
float: left;
}
}
.map-draft-group {
color: #3E44BE;
}
</style>

14
src/views/newMap/newMapdraft/mapoperate/index.vue
View File

@ -100,6 +100,14 @@
@setCenter="setCenter"
/>
</el-tab-pane>
<el-tab-pane label="表示灯" class="tab_pane_box" name="ControlLamp">
<control-lamp
ref="ControlLamp"
:selected="selected"
@updateMapModel="updateMapModel"
@setCenter="setCenter"
/>
</el-tab-pane>
<el-tab-pane :label="$t('map.train')" class="tab_pane_box" name="Train">
<train-draft
ref="Train"
@ -180,6 +188,7 @@ import OutFrameDraft from './outFrameControl';
import LcControlDraft from './lcControl';
import ImageControlDraft from './ImageControl';
import CheckboxDraft from './checkboxDraft';
import ControlLamp from './controlLamp';
import { ViewMode } from '@/scripts/ConstDic';
@ -203,7 +212,8 @@ export default {
OutFrameDraft,
LcControlDraft,
ImageControlDraft,
CheckboxDraft
CheckboxDraft,
ControlLamp
},
props: {
selected: {
@ -303,6 +313,8 @@ export default {
this.enabledTab = 'Section';
} else if (type == 'AutomaticRoute' || type == 'AutoTurnBack' || type == 'AxleReset' || type == 'LimitControl' || type == 'GuideLock') {
this.enabledTab = 'ControlDraft';
} else if (type == 'AtsControl' || type == 'CenterCommunication' || type == 'ChainControl' || type == 'InteresiteControl' || type == 'LeuControl' || type == 'LocalControl' || type == 'Maintain' || type == 'PowerSupply' || type == 'NoOneReturn') {
this.enabledTab = 'ControlLamp';
} else {
this.enabledTab = type;
}

3
src/views/newMap/newMapdraft/mapoperate/line.vue
View File

@ -117,6 +117,7 @@ export default {
code: '',
type: '',
width: 1,
lineColor: '',
showConditions: '01',
points: []
},
@ -172,6 +173,7 @@ export default {
item: [
{ prop: 'code', label: this.$t('map.lineCoding'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.lineList, change: true, deviceChange: this.deviceChange },
{ prop: 'type', label: this.$t('map.lineType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.LineTypeList },
{ prop: 'lineColor', label: this.$t('map.lineColor'), type: 'color' },
{ prop: 'width', label: this.$t('map.lineWidth'), type: 'number', min: 1, placeholder: 'px' },
{ prop: 'showConditions', label: this.$t('map.showConditions'), type: 'radio', optionLabel: 'label', optionValue:'value', radioList: this.showConditionsList},
{ prop: 'points', label: this.$t('map.segmentCoordinates'), type: 'points', width: '100px', isHidden: !this.isPointsShow, addPoint: this.addPoint, delPoint: this.delPoint }
@ -230,6 +232,7 @@ export default {
code: getUID('Line', this.lineList),
type: this.addModel.type,
width: this.addModel.width,
lineColor: '#FFFFFF',
points: JSON.parse(pointArr)
};
this.$emit('updateMapModel', model);