修改 车站 道岔地图绘制 配置

This commit is contained in:
zyy 2019-07-29 17:10:30 +08:00
parent 4da098c1fd
commit 264eea1d78
6 changed files with 167 additions and 231 deletions

View File

@ -56,12 +56,12 @@ export const attribute = {
{ prop: 'rightFdCode', label: '右侧正向Link:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: [], optionCode: 'linkList' },
{ prop: 'rightSdCode', label: '右侧侧向Link:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: [], optionCode: 'linkList' },
{ prop: 'lp', label: 'Link 起点坐标:', type: 'coordinate', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'lp.x', firstLevel: 'lp', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'lp.y', firstLevel: 'lp', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
] },
{ prop: 'rp', label: 'Link 终点坐标:', type: 'coordinate', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'rp.x', firstLevel: 'rp', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'rp.y', firstLevel: 'rp', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
] }
],
rules: {
@ -87,8 +87,8 @@ export const attribute = {
{ prop: 'type', label: '区段类型:', type: 'select', optionLabel: 'name', optionValue: 'code', options: [], optionCode: 'SectionTypeList' },
{ prop: 'name', label: '区段名称:', type: 'input' },
{ prop: 'namePoint', label: '区段名称偏移量:', type: 'coordinate', width: '160px', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
{ prop: 'namePoint.x', firstLevel: 'namePoint', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
{ prop: 'namePoint.y', firstLevel: 'namePoint', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
] },
{ prop: 'kmRangeLeft', label: '左侧公里标(米):', type: 'number', min: 0, placeholder: '' },
{ prop: 'kmRangeRight', label: '右侧公里标(米):', type: 'number', min: 0, placeholder: '' },
@ -100,26 +100,26 @@ export const attribute = {
{ prop: 'isStandTrack', label: '是否站台轨:', type: 'checkbox', isHidden: true, hiddenName: 'isSectionType' },
{ prop: 'standTrackName', label: '站台轨名称:', type: 'input', isHidden: true, hiddenName: 'isstandTrackNameShow' },
{ prop: 'standTrackNamePosition', label: '站台轨名称偏移量:', type: 'coordinate', isHidden: true, hiddenName: 'isstandTrackNameShow', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'standTrackNamePosition.x', firstLevel: 'standTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'standTrackNamePosition.y', firstLevel: 'standTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
] },
{ prop: 'relStandCode', label: '站台编码:', type: 'selectHover', optionLabel: 'code&&name', optionValue: 'code', options: [], optionCode: 'stationStandList', buttonType: 'relStandCode', hover: 'hover', isButtonType: 'isButtonType', buttonShowType: false, isHidden: true, hiddenName: 'isrelStandCode' },
{ prop: 'isReentryTrack', label: '是否折返轨:', type: 'checkbox', isHidden: true, hiddenName: 'isSectionType' },
{ prop: 'reentryTrackName', label: '折返轨名称:', type: 'input', isHidden: true, hiddenName: 'isreentryTrackName' },
{ prop: 'reentryTrackNamePosition', label: '折返轨名称偏移量:', type: 'coordinate', isHidden: true, hiddenName: 'isreentryTrackName', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'reentryTrackNamePosition.x', firstLevel: 'reentryTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'reentryTrackNamePosition.y', firstLevel: 'reentryTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
] },
{ prop: 'isTransferTrack', label: '是否转换轨:', type: 'checkbox', isHidden: true, hiddenName: 'isSectionType' },
{ prop: 'transferTrackName', label: '转换轨名称:', type: 'input', isHidden: true, hiddenName: 'istransferTrackName' },
{ prop: 'transferTrackNamePosition', label: '转换轨名称偏移量:', type: 'coordinate', isHidden: true, hiddenName: 'istransferTrackName', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'transferTrackNamePosition.x', firstLevel: 'transferTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'transferTrackNamePosition.y', firstLevel: 'transferTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
] },
{ prop: 'destinationCode', label: '目的地码:', type: 'input', isHidden: true, hiddenName: 'isdestinationCode' },
{ prop: 'destinationCodePoint', label: '目的地码坐标:', type: 'coordinate', isHidden: true, hiddenName: 'isdestinationCode', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'destinationCodePoint.x', firstLevel: 'destinationCodePoint', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'destinationCodePoint.y', firstLevel: 'destinationCodePoint', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
] },
{ prop: 'destinationCodeShow', label: '是否显示目的地码:', type: 'checkbox', isHidden: true, hiddenName: 'isdestinationCode' },
{ prop: 'leftStopPointOffset', label: '左向停车点偏移量:', type: 'number', min: 0, placeholder: '', isHidden: true, hiddenName: 'isStopPointOffset' },
@ -137,8 +137,8 @@ export const attribute = {
{ prop: 'offsetRight', label: '右侧Link偏移量:', type: 'number', min: 0, placeholder: '米', isHidden: true, hiddenName: 'isSectionType' },
{ prop: 'isSegmentation', label: '是否分割:', type: 'checkbox', isHidden: true, hiddenName: 'isSectionType' },
{ prop: 'segmentationPosition', label: '默认背景:', type: 'coordinate', isHidden: true, hiddenName: 'issegmentationPosition', children: [
{ prop: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'segmentationPosition.x', firstLevel: 'segmentationPosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'segmentationPosition.y', firstLevel: 'segmentationPosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
] },
{ prop: 'isCurve', label: '是否曲线:', type: 'checkbox', isHidden: true, hiddenName: 'isSectionType' },
{ prop: 'points', label: '区段显示坐标:', type: 'points', width: '160px', isHidden: true, hiddenName: 'isPointsShow', pointDisabled: true, pointDisabledName: 'pointDisabledName', addPoint: 'addPoint', addPointChange: 'addPoint', delPoint: 'delPoint', delPointChange: 'delPoint' },
@ -261,5 +261,94 @@ export const attribute = {
]
}
}
},
switch: {
attr: {
labelWidth: '170px',
items: [
{ prop: 'stationCode', label: '所属设备集中站:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: [], optionCode: 'stationList' },
{ prop: 'code', label: '道岔编码:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: [], optionCode: 'switchList', change: true, deviceChange: 'deviceChange' },
{ prop: 'name', label: '道岔名称:', type: 'input' },
{ prop: 'nameShow', label: '是否显示道岔名称:', type: 'checkbox' },
{ prop: 'namePoint.x', firstLevel: 'namePoint', secondLevel: 'x', label: '道岔名称x偏移量:', type: 'number', placeholder: 'px' },
{ prop: 'namePoint.y', firstLevel: 'namePoint', secondLevel: 'y', label: '道岔名称y偏移量:', type: 'number', placeholder: 'px' },
{ prop: 'turnTime', label: '道岔时间:', type: 'number', min: 0, max: 1000, placeholder: 's' },
{ prop: 'timeoutShow', label: '是否显示道岔时间:', type: 'checkbox' },
{ prop: 'sectionACode', label: '关联的A Section Code:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: [], optionCode: 'sectionList' },
{ prop: 'sectionBCode', label: '关联的B Section Code:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: [], optionCode: 'sectionList' },
{ prop: 'sectionCCode', label: '关联的C Section Code:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: [], optionCode: 'sectionList' },
{ prop: 'tp.x', firstLevel: 'tp', secondLevel: 'x', label: '时间x坐标偏移量:', type: 'number', placeholder: 'px' },
{ prop: 'tp.y', firstLevel: 'tp', secondLevel: 'y', label: '时间y坐标偏移量:', type: 'number', placeholder: 'px' }
],
rules: {
code: [
{ required: true, message: '请选择设备', trigger: 'change' }
],
name: [
{ required: true, message: '请输入道岔名称', trigger: 'blur' }
],
'namePoint.x': [
{ required: true, message: '请输入道岔名称坐标x', trigger: 'blur' }
],
'namePoint.y': [
{ required: true, message: '请输入道岔名称坐标y', trigger: 'blur' }
],
stationCode: [
{ required: true, message: '请输入设备集中站', trigger: 'change' }
],
turnTime: [
{ required: true, message: '请输入道岔时间', trigger: 'blur' }
],
'tp.x': [
{ required: true, message: '请输入时间坐标x', trigger: 'blur' }
],
'tp.y': [
{ required: true, message: '请输入时间坐标y', trigger: 'blur' }
]
}
}
},
station: {
attr: {
labelWidth: '150px',
items: [
{ prop: 'concentrateStationCode', label: '所属联锁站编码:', type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: [], optionCode: 'stationList' },
{ prop: 'code', label: '车站编码:', type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: [], optionCode: 'stationList', change: true, deviceChange: 'deviceChange' },
{ prop: 'zcCode', label: '所属zc区域编码:', type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: [], optionCode: 'zcList' },
{ prop: 'centralized', label: '是否集中站:', type: 'checkbox' },
{ prop: 'name', label: '车站名称:', type: 'input' },
{ prop: 'runPlanName', label: '真实名称:', type: 'input' },
{ prop: 'visible', label: '是否显示:', type: 'checkbox' },
{ prop: 'nameFont', label: '车站字体:', type: 'font', placeholder: '车站字体' },
{ prop: 'nameFontColor', label: '车站字体颜色:', type: 'color' },
{ prop: 'kmPostShow', label: '是否显示公里标名称:', type: 'checkbox' },
{ prop: 'kmRange', label: '公里标距离:', type: 'number', min: 0, placeholder: '米' },
{ prop: 'kmPost', label: '公里标名称:', type: 'input' },
{ prop: 'kmPostFont', label: '公里标字体:', type: 'font', placeholder: '公里标字体' },
{ prop: 'kmPostFontColor', label: '公里标字体颜色:', type: 'color' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'y', label: 'x坐标:', type: 'number', placeholder: 'px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y坐标:', type: 'number', placeholder: 'px' }
],
rules: {
code: [
{ required: true, message: '请选择设备', trigger: 'change' }
],
name: [
{ required: true, message: '请输入车站名称', trigger: 'blur' }
],
kmRange: [
{ required: true, message: '请输入公里标距离', trigger: 'blur' }
],
kmPost: [
{ required: true, message: '请输入公里标名称', trigger: 'blur' }
],
'position.x': [
{ required: true, message: '请输入x坐标', trigger: 'blur' }
],
'position.y': [
{ required: true, message: '请输入y坐标', trigger: 'blur' }
]
}
}
}
};

View File

@ -428,10 +428,10 @@ const map = {
setMapData: (state, map) => {
state.map = map;
},
mapRender: (devices) => {
mapRender: (state, devices) => {
Vue.prototype.$jlmap && Vue.prototype.$jlmap.render(devices);
},
mapUpdate: (devices) => {
mapUpdate: (state, devices) => {
Vue.prototype.$jlmap && Vue.prototype.$jlmap.update(devices);
},
setTrainDetails: (state, details) => {

View File

@ -265,7 +265,6 @@ export default {
this.mapSaveing = true;
this.$store.dispatch('map/saveMapDeviceDefaultConvert').then(() => {
console.log(Object.assign(map, { mapId: this.$route.params.mapId }));
saveMap(Object.assign(map, { mapId: this.$route.params.mapId })).then(response => {
this.$message.success('保存成功');
this.mapSaveing = false;

View File

@ -76,7 +76,7 @@
</template>
<template v-if="checkFieldType(item, 'color')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-color-picker v-model="formModel[item.prop]" :predefine="skins" :disabled="item.disabled" />
<el-color-picker v-model="formModel[item.prop]" show-alpha :predefine="skins" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'radio')">
@ -91,8 +91,8 @@
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="item.width">{{ item.label }}</span>
<div v-for="opt in item.children" :key="opt.code" class="listWidth">
<el-form-item :label="opt.label" :prop="[item.prop][opt.prop]" :label-width="opt.labelWidth">
<el-input-number v-model="formModel[item.prop][opt.prop]" :label="opt.label" :disabled="opt.disabled" />
<el-form-item :label="opt.label" :prop="opt.prop" :label-width="opt.labelWidth">
<el-input-number v-model="formModel[opt.firstLevel][opt.secondLevel]" :label="opt.label" :disabled="opt.disabled" />
</el-form-item>
</div>
</div>
@ -148,12 +148,21 @@
<el-checkbox v-model="formModel[item.prop]" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'font')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-font v-model="formModel[item.prop]" :disabled="item.disabled" :placeholder="item.placeholder" />
</el-form-item>
</template>
</template>
</el-form></template>
<script>
import ElFont from '@/views/components/font/index';
export default {
name: 'ConfigList',
components: {
ElFont
},
props: {
formModel: {
type: Object,

View File

@ -3,77 +3,7 @@
<el-tabs v-model="activeName">
<el-tab-pane class="view-control" label="属性" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" label-width="150px" size="mini" :rules="rules">
<el-form-item label="所属联锁站编码:" prop="concentrateStationCode">
<el-select v-model="editModel.concentrateStationCode">
<el-option
v-for="item in stationList"
:key="item.code"
:label="item.code + ' (' + item.name+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="车站编码:" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in stationList"
:key="item.code"
:label="item.code + ' (' + item.name+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="所属zc区域编码:" prop="zcCode">
<el-select v-model="editModel.zcCode" filterable>
<el-option
v-for="item in zcList"
:key="item.code"
:label="item.code + ' (' + item.name + ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="是否集中站:" prop="centralized">
<el-checkbox v-model="editModel.centralized" />
</el-form-item>
<el-form-item label="车站名称:" prop="name">
<el-input v-model="editModel.name" />
</el-form-item>
<el-form-item label="真实名称:" prop="runPlanName">
<el-input v-model="editModel.runPlanName" />
</el-form-item>
<el-form-item label="是否显示:" prop="visible">
<el-checkbox v-model="editModel.visible" />
</el-form-item>
<el-form-item label="车站字体:" prop="nameFont">
<el-font v-model="editModel.nameFont" placeholder="车站字体" />
</el-form-item>
<el-form-item label="车站字体颜色:" prop="nameFontColor">
<el-color-picker v-model="editModel.nameFontColor" show-alpha :predefine="skins" />
</el-form-item>
<el-form-item label="是否显示公里标名称:" prop="kmPostShow">
<el-checkbox v-model="editModel.kmPostShow" />
</el-form-item>
<el-form-item label="公里标距离:" prop="kmRange">
<el-input-number v-model="editModel.kmRange" :min="0" />
</el-form-item>
<el-form-item label="公里标名称:" prop="kmPost">
<el-input v-model="editModel.kmPost" />
</el-form-item>
<el-form-item label="公里标字体:" prop="kmPostFont">
<el-font v-model="editModel.kmPostFont" placeholder="公里标字体" />
</el-form-item>
<el-form-item label="公里标字体颜色:" prop="kmPostFontColor">
<el-color-picker v-model="editModel.kmPostFontColor" show-alpha :predefine="skins" />
</el-form-item>
<el-form-item label="x坐标:" prop="position.x">
<el-input-number v-model="editModel.position.x" />px
</el-form-item>
<el-form-item label="y坐标:" prop="position.y">
<el-input-number v-model="editModel.position.y" />px
</el-form-item>
</el-form>
<config-list ref="dataform" :form="form" :form-model="editModel" :rules="rules" />
</el-scrollbar>
<el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">修改</el-button>
@ -106,12 +36,13 @@
<script>
import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid';
import ElFont from '@/views/components/font/index';
import ConfigList from './config/list';
import { getAttrList, getAttrRules } from '@/scripts/attribute';
export default {
name: 'StationDraft',
components: {
ElFont
ConfigList
},
props: {
selected: {
@ -127,6 +58,7 @@ export default {
},
data() {
return {
form: getAttrList('station', 'attr', this),
activeName: 'first',
editModel: {
centralized: false,
@ -153,26 +85,6 @@ export default {
sectionCode: ''
},
skins: [],
rules: {
code: [
{ required: true, message: '请选择设备', trigger: 'change' }
],
name: [
{ required: true, message: '请输入车站名称', trigger: 'blur' }
],
kmRange: [
{ required: true, message: '请输入公里标距离', trigger: 'blur' }
],
kmPost: [
{ required: true, message: '请输入公里标名称', trigger: 'blur' }
],
'position.x': [
{ required: true, message: '请输入x坐标', trigger: 'blur' }
],
'position.y': [
{ required: true, message: '请输入y坐标', trigger: 'blur' }
]
},
mergeRules: {
sectionCode: [
{ required: true, message: '请选择物理区段名称', trigger: 'blur' }
@ -187,6 +99,15 @@ export default {
'zcList',
'skinStyle'
]),
rules() {
const baseRules = getAttrRules('station', 'attr');
//
this.$nextTick(function () {
this.$refs.dataform.clearValidate();
});
return baseRules.rules;
},
PhysicalSectionList() {
let list = [];
if (this.sectionList && this.sectionList.length) {
@ -200,8 +121,11 @@ export default {
this.deviceSelect(val);
},
$route() {
this.$refs.form.resetFields();
this.$refs.dataform.resetFields();
this.activeName = 'first';
},
'$store.state.map.mapDataLoadedCount': function() {
this.form = getAttrList('station', 'attr', this);
}
},
methods: {
@ -210,7 +134,7 @@ export default {
this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
},
deviceSelect(model) {
this.$refs.form.resetFields();
this.$refs.dataform.resetFields();
this.$refs.make.resetFields();
if (model && model._type.toUpperCase() === 'Station'.toUpperCase()) {
const selected = model.model;
@ -290,7 +214,7 @@ export default {
},
//
edit() {
this.$refs['form'].validate((valid) => {
this.$refs['dataform'].validate((valid) => {
if (valid) {
this.$emit('addOrUpdateMapModel', this.buildEditModel());
}

View File

@ -3,82 +3,7 @@
<el-tabs v-model="activeName">
<el-tab-pane class="view-control" label="属性" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" label-width="170px" size="mini" :rules="rules">
<el-form-item label="所属设备集中站:" prop="stationCode">
<el-select v-model="editModel.stationCode" filterable>
<el-option
v-for="item in stationList"
:key="item.code"
:label="item.name + ' (' + item.code+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="道岔编码:" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in switchList"
:key="item.code"
:label="item.code + ' (' + item.name+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="道岔名称:" prop="name">
<el-input v-model="editModel.name" />
</el-form-item>
<el-form-item label="是否显示道岔名称:" prop="nameShow">
<el-checkbox v-model="editModel.nameShow" />
</el-form-item>
<el-form-item label="道岔名称x偏移量:" prop="namePoint.x">
<el-input-number v-model="editModel.namePoint.x" />px
</el-form-item>
<el-form-item label="道岔名称y偏移量:" prop="namePoint.y">
<el-input-number v-model="editModel.namePoint.y" />px
</el-form-item>
<el-form-item label="道岔时间:" prop="turnTime">
<el-input-number v-model="editModel.turnTime" :min="0" :max="1000" />s
</el-form-item>
<el-form-item label="是否显示道岔时间:" prop="timeoutShow">
<el-checkbox v-model="editModel.timeoutShow" />
</el-form-item>
<el-form-item label="关联的A Section Code:" prop="sectionACode">
<el-select v-model="editModel.sectionACode" filterable>
<el-option
v-for="item in sectionList"
:key="item.code"
:label="item.name + ' (' + item.code+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="关联的B Section Code:" prop="sectionBCode">
<el-select v-model="editModel.sectionBCode" filterable>
<el-option
v-for="item in sectionList"
:key="item.code"
:label="item.name + ' (' + item.code+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="关联的C Section Code:" prop="sectionCCode">
<el-select v-model="editModel.sectionCCode" filterable>
<el-option
v-for="item in sectionList"
:key="item.code"
:label="item.name + ' (' + item.code+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="时间x坐标偏移量:" prop="tp.x">
<el-input-number v-model="editModel.tp.x" />px
</el-form-item>
<el-form-item label="时间y坐标偏移量:" prop="tp.y">
<el-input-number v-model="editModel.tp.y" />px
</el-form-item>
</el-form>
<config-list ref="dataform" :form="form" :form-model="editModel" :rules="rules" />
</el-scrollbar>
<el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">修改</el-button>
@ -111,10 +36,13 @@
<script>
import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid';
import ConfigList from './config/list';
import { getAttrList, getAttrRules } from '@/scripts/attribute';
export default {
name: 'SwitchDraft',
components: {
ConfigList
},
props: {
selected: {
@ -130,6 +58,7 @@ export default {
},
data() {
return {
form: getAttrList('switch', 'attr', this),
sectionsCollection: [],
activeName: 'first',
editModel: {
@ -147,44 +76,9 @@ export default {
x: 0,
y: 0
}
},
rules: {
code: [
{ required: true, message: '请选择设备', trigger: 'change' }
],
name: [
{ required: true, message: '请输入道岔名称', trigger: 'blur' }
],
'namePoint.x': [
{ required: true, message: '请输入道岔名称坐标x', trigger: 'blur' }
],
'namePoint.y': [
{ required: true, message: '请输入道岔名称坐标y', trigger: 'blur' }
],
stationCode: [
{ required: true, message: '请输入设备集中站', trigger: 'change' }
],
turnTime: [
{ required: true, message: '请输入道岔时间', trigger: 'blur' }
],
'tp.x': [
{ required: true, message: '请输入时间坐标x', trigger: 'blur' }
],
'tp.y': [
{ required: true, message: '请输入时间坐标y', trigger: 'blur' }
]
}
};
},
watch: {
selected: function (val, oldVal) {
this.deviceSelect(val);
},
$route() {
this.$refs.form.resetFields();
this.activeName = 'first';
}
},
computed: {
datasCollection: function () {
const list = [];
@ -201,6 +95,15 @@ export default {
}
return list;
},
rules() {
const baseRules = getAttrRules('link', 'attr');
//
this.$nextTick(function () {
this.$refs.dataform.clearValidate();
});
return baseRules.rules;
},
...mapGetters('map', [
'linkList',
'sectionList',
@ -209,6 +112,18 @@ export default {
'skinStyle'
])
},
watch: {
selected: function (val, oldVal) {
this.deviceSelect(val);
},
$route() {
this.$refs.dataform.resetFields();
this.activeName = 'first';
},
'$store.state.map.mapDataLoadedCount': function() {
this.form = getAttrList('switch', 'attr', this);
}
},
mounted() {
},
methods: {
@ -220,7 +135,7 @@ export default {
this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
},
deviceSelect(model) {
this.$refs.form.resetFields();
this.$refs.dataform.resetFields();
if (model && model._type.toUpperCase() === 'Switch'.toUpperCase()) {
const selected = model.model;
this.editModel.name = selected.name;
@ -351,7 +266,7 @@ export default {
},
//
edit() {
this.$refs['form'].validate((valid) => {
this.$refs['dataform'].validate((valid) => {
if (valid) {
this.$emit('addOrUpdateMapModel', this.buildEditModel());
}