地图绘制信号机添加字段(不生成进路的信号机终端)

This commit is contained in:
joylink_cuiweidong 2020-08-06 10:55:38 +08:00
parent 353d5f7e68
commit 1a844d20e7
4 changed files with 154 additions and 120 deletions

View File

@ -94,107 +94,6 @@ export default {
},
realData: {},
kmRangeCoordMap: {},
option: {
title: {
text: '',
left: 'center'
},
grid: {
top: '30px',
left: '120px',
right: '40px',
bottom: '65px',
containLabel: true,
backgroundColor: 'floralwhite'
},
toolbox: {
},
tooltip: {
axisPointer: {
trigger: 'item',
type: 'cross'
},
formatter: this.axisTooltip,
borderWidth: 1
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: [],
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
snap: true,
label: {
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
}
}
],
yAxis: {
type: 'value',
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat
},
axisPointer: {
xAxisIndex: 'all',
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white'
}
},
min: 0,
max: 0
},
series: [],
dataZoom: [
{
type: 'inside'
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
bottom: '20px'
}
]
},
absoluteTime: 2 * 3600,
indexKmRangeMap: {},
dialogLoading: false,
@ -396,9 +295,110 @@ export default {
async loadInitData(series) {
this.myChart && this.myChart.showLoading();
await this.xAxisInit();
await this.yAxisInit();
await this.loadInitChart(series);
const option = {
title: {
text: '',
left: 'center'
},
grid: {
top: '30px',
left: '120px',
right: '40px',
bottom: '65px',
containLabel: true,
backgroundColor: 'floralwhite'
},
toolbox: {
},
tooltip: {
axisPointer: {
trigger: 'item',
type: 'cross'
},
formatter: this.axisTooltip,
borderWidth: 1
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: [],
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
snap: true,
label: {
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
}
}
],
yAxis: {
type: 'value',
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat
},
axisPointer: {
xAxisIndex: 'all',
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white'
}
},
min: 0,
max: 0
},
series: [],
dataZoom: [
{
type: 'inside'
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
bottom: '20px'
}
]
};
await this.xAxisInit(option);
await this.yAxisInit(option);
await this.loadInitChart(series, option);
this.myChart && this.myChart.hideLoading();
this.handlerUpdateData();
},
@ -425,7 +425,7 @@ export default {
}
return series;
},
loadInitChart(series) {
loadInitChart(series, option) {
return new Promise((resolve, reject) => {
try {
this.destroy();
@ -433,12 +433,12 @@ export default {
const offsetTime = 3600;
const initTime = toTimeStamp(formatDuring(this.$store.state.training.initTime));
startValue = initTime - this.PlanConvert.TranslationTime;
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
this.option.series = series;
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
option.series = series;
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(this.option);
this.myChart.setOption(option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.mouseClick);
}
@ -463,7 +463,7 @@ export default {
yAxisLableFormat(value, index) {
return '';
},
xAxisInit() {
xAxisInit(option) {
const list = [];
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
list.push(time);
@ -472,19 +472,19 @@ export default {
const startValue = 3600 * 6;
const offsetTime = 3600 * 1;
this.option.xAxis[0].data = list;
if (!this.option.dataZoom[0].startValue) {
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
option.xAxis[0].data = list;
if (!option.dataZoom[0].startValue) {
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
}
if (!this.option.dataZoom[0].endValue) {
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
if (!option.dataZoom[0].endValue) {
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
}
},
yAxisInit() {
yAxisInit(option) {
if (Object.keys(this.PlanConvert).length) {
this.option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
this.option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
}
},
axisTooltip(param) {

View File

@ -65,6 +65,29 @@
>{{ $t('map.activate') }}</el-button>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'multiSelectHover')">
<el-form-item :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-select
v-model="formModel[item.prop]"
filterable
multiple
:placeholder="item.placeholder"
:disabled="item.disabled"
:clearable="item.clearable"
>
<el-option
v-for="option in item.options"
:key="option.code"
:label="handleLabel(option, item.optionLabel)"
:value="option.code"
/>
</el-select>
<el-button
:type="item.buttonShowType ? 'danger' : 'primary'"
@click="item.hover(item.buttonType)"
>{{ $t('map.activate') }}</el-button>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'input')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-input v-model="formModel[item.prop]" type="text" :disabled="item.disabled" maxlength="30" :show-word-limit="true" @input="((val)=>{deviceChange(val, item)})" />

View File

@ -85,6 +85,7 @@ class Model {
this.ctc = true; // 是否灭灯显示
this.noOverlap = false; // 是否无延续保护
this.routeEnd = false; // 是否进路终端
this.ignoreRouteEnd = []; // 不生成进路的信号机终端
}
SwitchModel() {
this._type = 'Switch';

View File

@ -277,7 +277,9 @@ export default {
{ prop: 'turnBack', label: '是否自动折返始端:', type: 'checkbox', isHidden: this.editModel.virtual},
{ prop: 'ctc', label: '是否灭灯显示(CTC级)', type: 'checkbox'},
{ prop: 'noOverlap', label: '是否无延续保护', type: 'checkbox'},
{ prop: 'routeEnd', label: '是否进路终端', type: 'checkbox'}
{ prop: 'routeEnd', label: '是否进路终端', type: 'checkbox'},
{ prop: 'ignoreRouteEnd', label: '不生成进路的信号机终端', type: 'multiSelectHover', optionLabel: 'name&&code', optionValue: 'code', options: this.signalList, hover: this.hover, buttonType: 'signalIgnoreRouteEnd', buttonShowType: this.signalIgnoreRouteEnd }
]
},
map: {
@ -330,6 +332,9 @@ export default {
},
signalSectionShow() {
return this.field == 'signalSection';
},
signalIgnoreRouteEnd() {
return this.field == 'signalIgnoreRouteEnd';
}
},
mounted() {
@ -357,7 +362,7 @@ export default {
this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
},
deviceSelect(selected) {
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase() && this.field.toUpperCase() != 'selectSingalCode'.toUpperCase()) {
if (selected && selected._type.toUpperCase() === 'Signal'.toUpperCase() && this.field.toUpperCase() != 'selectSingalCode'.toUpperCase() && this.field.toUpperCase() != 'signalIgnoreRouteEnd'.toUpperCase()) {
this.editModel = getModel('Signal');
this.$refs.dataform && this.$refs.dataform.resetFields();
this.activeName = 'first';
@ -376,6 +381,11 @@ export default {
this.activeName = 'first';
this.field = '';
this.$emit('deviceSelect', '');
} else if (selected && selected._type === 'Signal' && this.field == 'signalIgnoreRouteEnd') {
if (!this.editModel.ignoreRouteEnd.includes(selected.code) && this.editModel.code != selected.code) {
this.editModel.ignoreRouteEnd.push(selected.code);
}
this.activeName = 'first';
}
},
updateMapModel(data) {