This commit is contained in:
fan 2019-08-16 15:41:27 +08:00
commit 84f388b2d8
50 changed files with 1658 additions and 952 deletions

View File

@ -68,6 +68,6 @@ export default {
<style> <style>
.format { .format {
background-color: #C0C4CC; background-color: #C0C4CC;
width: 360px; width: 100%;
} }
</style> </style>

View File

@ -26,7 +26,7 @@
@node-click="handleNodeClick" @node-click="handleNodeClick"
@node-contextmenu="showContextMenu" @node-contextmenu="showContextMenu"
> >
<span slot-scope="{ node, data }"> <span slot-scope="{ node }">
<span v-if="node.data.type == 'skin'" class="el-icon-news">&nbsp;{{ node.label }}</span> <span v-if="node.data.type == 'skin'" class="el-icon-news">&nbsp;{{ node.label }}</span>
<span v-if="node.data.type == 'map'" class="el-icon-edit-outline">&nbsp;{{ node.label }}</span> <span v-if="node.data.type == 'map'" class="el-icon-edit-outline">&nbsp;{{ node.label }}</span>
</span> </span>
@ -49,20 +49,20 @@
<script> <script>
import { DeviceMenu } from '@/scripts/ConstDic'; import { DeviceMenu } from '@/scripts/ConstDic';
import { deleteMap, listMap, getMapTree, newMap, publishMap, editMap, saveAsMap, getMapDetail, postBuildMapImport } from '@/api/jmap/mapdraft'; import { getMapTree, getMapDetail, postBuildMapImport } from '@/api/jmap/mapdraft';
import PopMenu from '@/components/PopMenu'; // import PopMenu from '@/components/PopMenu';
import MapOperateMenu from './operateMenu'; import MapOperateMenu from './operateMenu';
import MapCreate from './create'; import MapCreate from './create';
import WindowResizeHandler from '@/mixin/WindowResizeHandler'; import WindowResizeHandler from '@/mixin/WindowResizeHandler';
import XLSX from 'xlsx'; import XLSX from 'xlsx';
import { translate, translateSheetTitle } from '@/scripts/translate'; import { translate, translateSheetTitle } from '@/scripts/translate';
import { sheet_to_json } from '@/utils/Export2Excel'; import { sheet_to_json } from '@/utils/Export2Excel';
import localStore from 'storejs'; // import localStore from 'storejs';
export default { export default {
name: 'MapListDraft', name: 'MapListDraft',
components: { components: {
PopMenu, // PopMenu,
MapCreate, MapCreate,
MapOperateMenu MapOperateMenu
}, },

View File

@ -1,102 +1,110 @@
<template> <template>
<el-card class="map-list-main" v-loading="loading"> <el-card v-loading="loading" class="map-list-main">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>产品类目</span> <span>产品类目</span>
</div> </div>
<el-input placeholder="输入关键字进行过滤" v-model="filterText" clearable> </el-input> <el-input v-model="filterText" placeholder="输入关键字进行过滤" clearable />
<el-scrollbar wrapClass="scrollbar-wrapper" :style="{ height: height +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height +'px' }">
<el-tree ref="trainingTree" :data="treeData" :filter-node-method="filterNode" :lazy="false" <el-tree
:props="defaultProps" class="tree-height-max" expand-on-click-node highlight-current ref="trainingTree"
@node-click="clickEvent"> :data="treeData"
<span slot-scope="{ node, data }"> :filter-node-method="filterNode"
<span v-if="node.data.type == 'skin'" class="el-icon-news">&nbsp;{{ node.label }}</span> :lazy="false"
<span v-if="node.data.type == 'prd'" class="el-icon-tickets">&nbsp;{{ node.label }}</span> :props="defaultProps"
<span v-if="node.data.type == 'trainingType'" class="el-icon-document">&nbsp;{{ node.label }}</span> class="tree-height-max"
<span v-if="node.data.type == 'trainingType'" class="el-icon-edit">&nbsp;{{ node.label }}</span> expand-on-click-node
</span> highlight-current
</el-tree> @node-click="clickEvent"
</el-scrollbar> >
</el-card> <span slot-scope="{ node }">
<span v-if="node.data.type == 'skin'" class="el-icon-news">&nbsp;{{ node.label }}</span>
<span v-if="node.data.type == 'prd'" class="el-icon-tickets">&nbsp;{{ node.label }}</span>
<span v-if="node.data.type == 'trainingType'" class="el-icon-document">&nbsp;{{ node.label }}</span>
<span v-if="node.data.type == 'trainingType'" class="el-icon-edit">&nbsp;{{ node.label }}</span>
</span>
</el-tree>
</el-scrollbar>
</el-card>
</template> </template>
<script> <script>
import { createTraining } from '@/api/jmap/training' import { getProductTree } from '@/api/management/mapprd';
import { getProductTree } from '@/api/management/mapprd';
export default { export default {
name: 'TreeOperate', name: 'TreeOperate',
props: { props: {
height: { height: {
type: Number type: Number,
} required: true
}, }
data() { },
return { data() {
loading: true, return {
defaultProps: { loading: true,
children: 'children', defaultProps: {
label: 'name', children: 'children',
}, label: 'name'
filterText: '', },
treeData: [], filterText: '',
node: {}, treeData: [],
point: { node: {},
x: 0, point: {
y: 0 x: 0,
} y: 0
} }
}, };
watch: { },
filterText(val) { watch: {
this.$refs.trainingTree.filter(val); filterText(val) {
} this.$refs.trainingTree.filter(val);
}, }
mounted() { },
this.refresh(); mounted() {
}, this.refresh();
methods: { },
filterNode(value, data) { methods: {
if (!value) return true; filterNode(value, data) {
return data.name.indexOf(value) !== -1; if (!value) return true;
}, return data.name.indexOf(value) !== -1;
showContextMenu(e, obj, node, vueElem) { },
e.preventDefault(); showContextMenu(e, obj, node, vueElem) {
this.point = { e.preventDefault();
x: e.clientX, this.point = {
y: e.clientY x: e.clientX,
} y: e.clientY
if (obj) { };
this.node = node; if (obj) {
this.$refs.menu.show(); this.node = node;
} this.$refs.menu.show();
}, }
clickEvent(obj, node, data) { },
this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null }); clickEvent(obj, node, data) {
this.$emit('loadData', node); this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null });
}, this.$emit('loadData', node);
convertTreeData(list) { },
let tree = []; convertTreeData(list) {
if (list && list.length) { const tree = [];
/*去除列表的training节点*/ if (list && list.length) {
list.forEach(elem => { /* 去除列表的training节点*/
elem.children = this.convertTreeData(elem.children); list.forEach(elem => {
if (elem.type !== 'trainingType') { elem.children = this.convertTreeData(elem.children);
tree.push(elem); if (elem.type !== 'trainingType') {
} tree.push(elem);
}) }
} });
return tree; }
}, return tree;
refresh() { },
getProductTree().then(response => { refresh() {
this.treeData = this.convertTreeData(response.data) getProductTree().then(response => {
this.$nextTick(() => { this.loading = false; }); this.treeData = this.convertTreeData(response.data);
}).catch(error => { this.$nextTick(() => { this.loading = false; });
this.$messageBox('刷新失败') }).catch(() => {
this.loading = false; this.$messageBox('刷新失败');
}); this.loading = false;
} });
} }
} }
};
</script> </script>
<style> <style>
@ -107,4 +115,4 @@
.el-tree-node.is-current>.el-tree-node__content { .el-tree-node.is-current>.el-tree-node__content {
background-color: #e4e3e3 !important; background-color: #e4e3e3 !important;
} }
</style> </style>

View File

@ -0,0 +1,160 @@
<template>
<!-- <el-dialog title="地图显示" :visible.sync="dialogTableVisible" :modal="false" width="460px" top="110px" right="0" custom-class="dialog-box" :close-on-click-modal="false"> -->
<transition name="fade">
<div v-show="dialogTableVisible" class="dialog-box">
<div class="title">
<div class="fl-title">地图显示</div>
<div class="fr-title" @click="doClose">
<i class="el-icon-close" />
</div>
</div>
<el-row type="flex" justify="center">
<el-form label-width="100px" class="demo-ruleForm">
<el-form-item label="视图显示" prop="name">
<el-radio-group v-model="viewSelect" @change="handleSelectView">
<el-radio-button :label="ViewMode.LOGIC">{{ $t('map.logicalView') }}</el-radio-button>
<el-radio-button :label="ViewMode.PHYSICAL">{{ $t('map.physicalView') }}</el-radio-button>
<el-radio-button :label="ViewMode.MIX">{{ $t('map.mixedView') }}</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item label="内容显示" prop="name">
<el-row v-if="ViewMode.LOGIC === viewSelect" class="logical-view" type="flex" justify="center" style="width: 100%;">
<el-checkbox-group v-model="logicalLevelsSelect" @change="handleSelectLogicalView">
<el-checkbox v-for="view in LogicalViewTypeList" :key="view.code" :label="view.code" size="mini">
{{ view.name }}</el-checkbox>
</el-checkbox-group>
</el-row>
<el-row v-if="ViewMode.PHYSICAL === viewSelect" class="physical-view" type="flex" justify="center" style="width: 100%;">
<el-checkbox-group v-model="physicalLevelsSelect" @change="handleSelectPhysicalView">
<el-checkbox v-for="view in PhysicalViewTypeList" :key="view.code" :label="view.code">
{{ view.name }}</el-checkbox>
</el-checkbox-group>
</el-row>
</el-form-item>
</el-form>
</el-row>
</div>
</transition>
<!-- </el-dialog> -->
</template>
<script>
import { ViewMode } from '@/scripts/ConstDic';
export default {
name: 'ConfigMap',
data () {
return {
ViewMode: ViewMode,
dialogTableVisible: false,
viewSelect: ViewMode.MIX,
LogicalViewTypeList: [
{ code: 'Link', name: this.$t('map.link') }
],
PhysicalViewTypeList: [
{ code: 'Section', name: this.$t('map.section') },
{ code: 'Signal', name: this.$t('map.signal') },
{ code: 'Switch', name: this.$t('map.switch') }
],
logicalLevelsSelect: [],
physicalLevelsSelect: []
};
},
mounted() {
this.initPage();
},
methods: {
doShow() {
this.dialogTableVisible = true;
},
doClose() {
this.dialogTableVisible = false;
},
initPage() {
this.$Dictionary.logicalViewType().then(list => {
this.LogicalViewTypeList = list;
this.LogicalViewTypeList.forEach(elem => {
this.logicalLevelsSelect.push(elem.code);
});
});
this.$Dictionary.physicalViewType().then(list => {
this.PhysicalViewTypeList = list;
this.PhysicalViewTypeList.forEach(elem => {
this.physicalLevelsSelect.push(elem.code);
});
});
},
handleSelectView(handle) {
this.$emit('handleSelectView', handle);
},
handleSelectLogicalView(handle) {
this.$emit('handleSelectLogicalView', handle);
},
handleSelectPhysicalView(handle) {
this.$emit('handleSelectPhysicalView', handle);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.demo-ruleForm{
width: 100%;
/deep/{
.el-form-item__label{
text-align: left;
}
.el-checkbox-group{
width: 100%;
}
}
}
.dialog-box{
background-color: #fff;
width: 460px;
box-shadow: 2px 2px 4px #c5c5c5;
position: absolute;
left: auto;
right: 24px;
top: 43px;
z-index: 10;
padding: 15px;
.title{
margin-bottom: 8px;
overflow: hidden;
.fl-title{
float: left;
}
.fr-title{
float: right;
cursor: pointer;
}
}
/deep/{
.el-dialog__body{
padding: 0 8px 8px 21px;
}
.el-checkbox{
margin-right: 14px;
}
.el-form-item{
margin-bottom: 2px;
}
}
}
.fade-enter-active, .fade-leave-active {
transition: opacity 0.5s;
}
.fade-enter, .fade-leave-to {
opacity: 0;
}
</style>

View File

@ -1,5 +1,16 @@
<template> <template>
<transition name="el-zoom-in-center"> <div>
<route-draft
ref="routeEdit"
:selected="selected"
:map-info="mapInfo"
:route-data="routeData"
:card-height="cardHeight"
@handleSelectView="handleSelectView"
/>
<route-detail ref="routeDetail" :map-info="mapInfo" @autoMaticoSelected="autoMaticoSelected" />
</div>
<!-- <transition name="el-zoom-in-center">
<div class="mapControl"> <div class="mapControl">
<el-card> <el-card>
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
@ -27,7 +38,7 @@
</el-card> </el-card>
<route-detail ref="routeDetail" :map-info="mapInfo" @autoMaticoSelected="autoMaticoSelected" /> <route-detail ref="routeDetail" :map-info="mapInfo" @autoMaticoSelected="autoMaticoSelected" />
</div> </div>
</transition> </transition> -->
</template> </template>
<script> <script>
import RouteDraft from './route'; import RouteDraft from './route';

View File

@ -0,0 +1,250 @@
<template>
<transition name="el-zoom-in-center">
<div class="map-control">
<el-card>
<div slot="header" class="clearfix">
<span>
{{ $t('map.mapName') }}
<b>{{ mapInfo.name }}</b>
</span>
<el-button
type="text"
style="float: right; padding: 3px 0; margin-right: 5px;"
@click="previewRouteEvent"
>{{ $t('map.preview') }}</el-button>
<el-button
type="text"
style="float: right; padding: 3px 0; margin-right: 5px;"
@click="createRouteEvent"
>{{ $t('map.newConstruction') }}</el-button>
<el-button
type="text"
style="float: right; padding: 3px 0; margin-right: 5px;"
@click="drawMap"
>地图绘制</el-button>
<el-button
type="text"
style="float: right; padding: 3px 0; margin-right: 5px;"
@click="showMap"
>地图显示参数</el-button>
</div>
<el-tabs v-model="enabledTab" type="card" @tab-click="changePane">
<el-tab-pane label="进路" name="route">
<route-operate
ref="routeOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</el-tab-pane>
<el-tab-pane label="交路" name="routing">
<routing-operate
ref="routingOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</el-tab-pane>
<el-tab-pane label="自动信号" name="automatic">
<automatic-operate
ref="automaticOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</el-tab-pane>
<el-tab-pane label="联动道岔" name="swtich">
<switch-operate
ref="SwitchOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</el-tab-pane>
<el-tab-pane label="路径单元" name="path">
<path-operate
ref="pathOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</el-tab-pane>
</el-tabs>
</el-card>
</div>
</transition>
</template>
<script>
import RouteOperate from './routeoperate/index';
import RoutingOperate from './routingoperate/index';
import AutomaticOperate from './automaticoperate/index';
import SwitchOperate from './switchoperate/index';
import PathOperate from './pathoperate/index';
export default {
name: 'DataRelation',
components: {
RouteOperate,
RoutingOperate,
AutomaticOperate,
SwitchOperate,
PathOperate
},
props: {
selected: {
type: Object,
default: function () {
return null;
}
},
mapInfo: {
type: Object,
default: function() { return {name: this.$t('map.pleaseSelectMap')}; }
},
cardHeight: {
type: [String, Number],
required: true
}
},
data() {
return {
enabledTab: 'route',
cardHeights: 0
};
},
computed: {
},
watch: {
},
mounted() {
},
methods: {
resizeCardHeight() {
var padding = 0;
this.cardHeights = this.cardHeight - padding - 130;
},
showMap() {
this.$emit('showMap');
},
createRouteEvent() {
switch (this.enabledTab) {
case 'route':
this.$refs.routeOperate.createRouteEvent();
break;
case 'routing':
this.$refs.routingOperate.createRouteEvent();
break;
case 'automatic':
this.$refs.automaticOperate.createRouteEvent();
break;
case 'swtich':
this.$refs.SwitchOperate.createRouteEvent();
break;
case 'path':
this.$refs.pathOperate.createRouteEvent();
break;
}
},
previewRouteEvent() {
switch (this.enabledTab) {
case 'route':
this.$refs.routeOperate.previewRouteEvent();
break;
case 'routing':
this.$refs.routingOperate.previewRouteEvent();
break;
case 'automatic':
this.$refs.automaticOperate.previewRouteEvent();
break;
case 'swtich':
this.$refs.SwitchOperate.previewRouteEvent();
break;
case 'path':
this.$refs.pathOperate.previewRouteEvent();
break;
}
},
changePane(data) {
this.enabledTab = data.name;
},
setSelected(selected) {
switch (this.enabledTab) {
case 'route':
this.$refs.routeOperate.setSelected(selected);
break;
case 'routing':
this.$refs.routingOperate.setSelected(selected);
break;
case 'automatic':
this.$refs.automaticOperate.setSelected(selected);
break;
case 'swtich':
this.$refs.SwitchOperate.setSelected(selected);
break;
case 'path':
this.$refs.pathOperate.setSelected(selected);
break;
}
},
handleSelectView(handle) {
this.$emit('handleSelectView', handle);
},
setCenter(code) {
this.$emit('setCenter', code);
},
drawMap() {
this.$emit('selectView', 'draft');
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.map-context {
display: block;
float: left;
margin-left: 5px;
}
.map-control {
float: right;
width: 100%;
}
.physical-view {
line-height: 25px;
height: 118px;
padding-left: 12px;
.el-checkbox {
width: 70px;
margin: 0;
margin-right: 30px;
}
}
/deep/ .map-draft-group {
float: right;
margin: 10px 5px;
}
/deep/ {
.view-control {
overflow-y: auto;
}
}
</style>

View File

@ -1,6 +1,15 @@
<template> <template>
<transition name="el-zoom-in-center"> <div>
<div class="mapControl"> <route-draft
ref="routeEdit"
:selected="selected"
:map-info="mapInfo"
:route-data="routeData"
:card-height="cardHeight"
@handleSelectView="handleSelectView"
/>
<route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" />
<!-- <div class="mapControl">
<el-card> <el-card>
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span> <span>
@ -24,8 +33,8 @@
</el-tabs> </el-tabs>
</el-card> </el-card>
<route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" /> <route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" />
</div> </div> -->
</transition> </div>
</template> </template>
<script> <script>
import RouteDraft from './route'; import RouteDraft from './route';

View File

@ -1,5 +1,17 @@
<template> <template>
<transition name="el-zoom-in-center"> <div>
<route-draft
ref="routeEdit"
:selected="selected"
:map-info="mapInfo"
:route-data="routeData"
:card-height="cardHeight"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
<route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" />
</div>
<!-- <transition name="el-zoom-in-center">
<div class="mapControl"> <div class="mapControl">
<el-card> <el-card>
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
@ -28,7 +40,7 @@
</el-card> </el-card>
<route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" /> <route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" />
</div> </div>
</transition> </transition> -->
</template> </template>
<script> <script>
import RouteDraft from './route'; import RouteDraft from './route';

View File

@ -1,5 +1,16 @@
<template> <template>
<transition name="el-zoom-in-center"> <div>
<route-draft
ref="routeEdit"
:selected="selected"
:map-info="mapInfo"
:route-data="routeData"
:card-height="cardHeight"
@handleSelectView="handleSelectView"
/>
<route-detail ref="routeDetail" :map-info="mapInfo" @routingSelected="routingSelected" />
</div>
<!-- <transition name="el-zoom-in-center">
<div class="mapControl"> <div class="mapControl">
<el-card> <el-card>
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
@ -27,7 +38,7 @@
</el-card> </el-card>
<route-detail ref="routeDetail" :map-info="mapInfo" @routingSelected="routingSelected" /> <route-detail ref="routeDetail" :map-info="mapInfo" @routingSelected="routingSelected" />
</div> </div>
</transition> </transition> -->
</template> </template>
<script> <script>
import RouteDraft from './route'; import RouteDraft from './route';

View File

@ -1,5 +1,16 @@
<template> <template>
<transition name="el-zoom-in-center"> <div>
<route-draft
ref="routeEdit"
:selected="selected"
:map-info="mapInfo"
:route-data="routeData"
:card-height="cardHeight"
@handleSelectView="handleSelectView"
/>
<route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" />
</div>
<!-- <transition name="el-zoom-in-center">
<div class="mapControl"> <div class="mapControl">
<el-card> <el-card>
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
@ -25,7 +36,7 @@
</el-card> </el-card>
<route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" /> <route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" />
</div> </div>
</transition> </transition> -->
</template> </template>
<script> <script>
import RouteDraft from './route'; import RouteDraft from './route';

View File

@ -4,7 +4,7 @@
<div class="map-view"> <div class="map-view">
<jlmap-visual ref="jlmapVisual" @onSelect="clickEvent" @onMenu="onContextmenu" /> <jlmap-visual ref="jlmapVisual" @onSelect="clickEvent" @onMenu="onContextmenu" />
</div> </div>
<div class="map-draft"> <div v-loading="loading" class="map-draft">
<div v-if="viewDraft==='draft'"> <div v-if="viewDraft==='draft'">
<map-operate <map-operate
ref="mapOperate" ref="mapOperate"
@ -12,6 +12,7 @@
:map-info="mapInfo" :map-info="mapInfo"
:selected="selected" :selected="selected"
:map-saveing="mapSaveing" :map-saveing="mapSaveing"
@hook:mounted="loading = false"
@handleSelectLogicalView="handleSelectLogicalView" @handleSelectLogicalView="handleSelectLogicalView"
@handleSelectPhysicalView="handleSelectPhysicalView" @handleSelectPhysicalView="handleSelectPhysicalView"
@handleSelectView="handleSelectView" @handleSelectView="handleSelectView"
@ -20,58 +21,28 @@
@addOrUpdateMapModel="addOrUpdateMapModel" @addOrUpdateMapModel="addOrUpdateMapModel"
@delMapModel="delMapModel" @delMapModel="delMapModel"
@setCenter="setCenter" @setCenter="setCenter"
@selectView="selectViewDraft"
@showMap="showMap"
/> />
</div> </div>
<div v-if="viewDraft==='route'"> <div v-if="viewDraft != 'draft'">
<route-operate <data-relation
ref="routeOperate" ref="dataRelation"
:card-height="cardHeight+25" :card-height="cardHeight"
:map-info="mapInfo" :map-info="mapInfo"
:selected="selected" :selected="selected"
@handleSelectView="handleSelectView" @handleSelectView="handleSelectView"
@setCenter="setCenter" @selectView="selectViewDraft"
/> @hook:mounted="loading = false"
</div> @showMap="showMap"
<div v-if="viewDraft==='routing'">
<routing-operate
ref="routingOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</div>
<div v-if="viewDraft==='automatic'">
<automatic-operate
ref="automaticOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</div>
<div v-if="viewDraft==='swtich'">
<switch-operate
ref="SwitchOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/>
</div>
<div v-if="viewDraft==='path'">
<path-operate
ref="pathOperate"
:card-height="cardHeight+25"
:map-info="mapInfo"
:selected="selected"
@handleSelectView="handleSelectView"
@setCenter="setCenter"
/> />
</div> </div>
<config-map
ref="configMap"
@handleSelectView="handleSelectView"
@handleSelectLogicalView="handleSelectLogicalView"
@handleSelectPhysicalView="handleSelectPhysicalView"
/>
</div> </div>
</div> </div>
</transition> </transition>
@ -81,25 +52,22 @@ import { saveMap, getMapDetail, verifyMap } from '@/api/jmap/mapdraft';
import { ViewMode, TrainingMode, getDeviceMenuByDeviceType } from '@/scripts/ConstDic'; import { ViewMode, TrainingMode, getDeviceMenuByDeviceType } from '@/scripts/ConstDic';
import { checkLoginLine } from '@/api/login'; import { checkLoginLine } from '@/api/login';
import JlmapVisual from '@/views/jlmap/index'; import JlmapVisual from '@/views/jlmap/index';
import RouteOperate from './routeoperate/index';
import RoutingOperate from './routingoperate/index';
import AutomaticOperate from './automaticoperate/index';
import MapOperate from './mapoperate/index'; import MapOperate from './mapoperate/index';
import SwitchOperate from './switchoperate/index';
import pathOperate from './pathoperate/index';
import WindowResizeHandler from '@/mixin/WindowResizeHandler'; import WindowResizeHandler from '@/mixin/WindowResizeHandler';
import { EventBus } from '@/scripts/event-bus'; import { EventBus } from '@/scripts/event-bus';
import ConfigMap from './configMap';
import DataRelation from './dataRelation/index';
import { setTimeout } from 'timers';
export default { export default {
name: 'MapView', name: 'MapView',
components: { components: {
JlmapVisual, JlmapVisual,
MapOperate, MapOperate,
RouteOperate, DataRelation,
RoutingOperate, ConfigMap
SwitchOperate,
pathOperate,
AutomaticOperate
}, },
mixins: [ mixins: [
WindowResizeHandler WindowResizeHandler
@ -113,18 +81,13 @@ export default {
autoSaveTask: null, autoSaveTask: null,
selected: null, selected: null,
mapInfo: { name: this.$t('map.pleaseSelectMap') }, mapInfo: { name: this.$t('map.pleaseSelectMap') },
timeDemon: null timeDemon: null,
loading: false
}; };
}, },
watch: { watch: {
'$store.state.map.mapDataLoadedCount': function (val) { '$store.state.map.mapDataLoadedCount': function (val) {
this.initAutoSaveTask(); this.initAutoSaveTask();
},
'viewDraft': function () {
this.initAutoSaveTask();
},
$route() {
this.loadInitPage();
} }
}, },
mounted() { mounted() {
@ -154,9 +117,17 @@ export default {
EventBus.$emit('viewLoading', false); EventBus.$emit('viewLoading', false);
}); });
}, },
showMap() {
this.$refs.configMap.doShow();
},
selectViewDraft(data) {
this.loading = true;
setTimeout(() => {
this.viewDraft = data;
}, 300);
},
loadInitPage() { loadInitPage() {
this.$store.dispatch('training/changeMode', { mode: TrainingMode.MAP_EDIT }); this.$store.dispatch('training/changeMode', { mode: TrainingMode.MAP_EDIT });
this.viewDraft = this.$route.params.view;
this.mapInfo = { name: this.$t('map.pleaseSelectMap'), id: this.$route.params.mapId }; this.mapInfo = { name: this.$t('map.pleaseSelectMap'), id: this.$route.params.mapId };
if (parseInt(this.mapInfo.id)) { if (parseInt(this.mapInfo.id)) {
this.mapInfo.name = this.$route.query.name; this.mapInfo.name = this.$route.query.name;
@ -208,22 +179,8 @@ export default {
clickEvent(em) { clickEvent(em) {
var device = this.getDeviceByEm(em); var device = this.getDeviceByEm(em);
this.onSelect(device); this.onSelect(device);
switch (this.viewDraft) { if (this.$refs.dataRelation) {
case 'route': this.$refs.dataRelation.setSelected(device);
this.$refs.routeOperate.setSelected(device);
break;
case 'routing':
this.$refs.routingOperate.setSelected(device);
break;
case 'automatic':
this.$refs.automaticOperate.setSelected(device);
break;
case 'swtich':
this.$refs.SwitchOperate.setSelected(device);
break;
case 'path':
this.$refs.pathOperate.setSelected(device);
break;
} }
}, },
// //

View File

@ -12,7 +12,7 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane class="view-control" :label="$t('map.operation')" name="second"> <el-tab-pane class="view-control" :label="$t('map.operation')" name="second">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<config-list ref="make" :form="makeForm" :form-model="addModel" :rules="createRules" /> <config-data ref="make" :form="makeForm" :form-model="addModel" :rules="createRules" />
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="create">{{ $t('map.create') }}</el-button> <el-button type="primary" @click="create">{{ $t('map.create') }}</el-button>
@ -26,11 +26,13 @@
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ConfigList from './config/list'; import ConfigList from './config/list';
import ConfigData from './config/data';
export default { export default {
name: 'ImageControlDraft', name: 'ImageControlDraft',
components: { components: {
ConfigList ConfigList,
ConfigData
}, },
props: { props: {
selected: { selected: {
@ -106,18 +108,27 @@ export default {
dataForm() { dataForm() {
const form = { const form = {
labelWidth: '150px', labelWidth: '150px',
items: [ items: {
{ prop: 'code', label: this.$t('map.code'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.resourceList, change: true, deviceChange: this.deviceChange }, draw: {
{ prop: 'name', label: this.$t('map.imageName'), type: 'input' }, name: '绘图数据',
{ prop: 'width', label: this.$t('map.imageWidth'), type: 'number', min: 0 }, item: [
{ prop: 'height', label: this.$t('map.imageHeight'), type: 'number', min: 0 }, { prop: 'code', label: this.$t('map.code'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.resourceList, change: true, deviceChange: this.deviceChange },
{ prop: 'zIndex', label: this.$t('map.imageZindex'), type: 'number', min: 0 }, { prop: 'name', label: this.$t('map.imageName'), type: 'input' },
{ prop: 'rotate', label: this.$t('map.rotateAngle'), type: 'number', min: 0 }, { prop: 'width', label: this.$t('map.imageWidth'), type: 'number', min: 0 },
{ prop: 'position', label: this.$t('map.imagePoint'), type: 'coordinate', width: '140px', children: [ { prop: 'height', label: this.$t('map.imageHeight'), type: 'number', min: 0 },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' }, { prop: 'zIndex', label: this.$t('map.imageZindex'), type: 'number', min: 0 },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' } { prop: 'rotate', label: this.$t('map.rotateAngle'), type: 'number', min: 0 },
] } { prop: 'position', label: this.$t('map.imagePoint'), 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' }
] }
]
},
map: {
name: '地图数据',
item: []
}
}
}; };
return form; return form;
}, },

View File

@ -0,0 +1,295 @@
<template>
<el-form ref="form" :label-width="form.labelWidth" size="mini" :rules="rules" :model="formModel">
<template v-for="item in form.items">
<template v-if="checkFieldType(item, 'select')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<template v-if="item.change">
<el-select
v-model="formModel[item.prop]"
filterable
:placeholder="item.placeholder"
:disabled="item.disabled"
@change="item.deviceChange"
>
<el-option
v-for="option in item.options"
:key="option[item.optionValue]"
:label="handleLabel(option, item.optionLabel)"
:value="option[item.optionValue]"
/>
</el-select>
</template>
<template v-else>
<el-select
v-model="formModel[item.prop]"
filterable
:placeholder="item.placeholder"
:disabled="item.disabled"
>
<el-option
v-for="option in item.options"
:key="option[item.optionValue]"
:label="handleLabel(option, item.optionLabel)"
:value="option[item.optionValue]"
/>
</el-select>
</template>
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'selectHover')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-select
v-model="formModel[item.prop]"
filterable
:placeholder="item.placeholder"
:disabled="item.disabled"
>
<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]" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'number')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<div v-if="!item.firstLevel">
<el-input-number v-model="formModel[item.prop]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" />
<span style="padding-left: 1px;">{{ item.placeholder }}</span>
</div>
<div v-else>
<el-input-number v-model="formModel[item.firstLevel][item.secondLevel]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" />
<span style="padding-left: 1px;">{{ item.placeholder }}</span>
</div>
</el-form-item>
</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]" show-alpha :predefine="skins" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'radio')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-radio-group v-model="formModel[item.prop]" :disabled="item.disabled">
<el-radio v-for="(opts, index) in item.radioList" :key="index" :border="item.border" :label="opts.value">{{ opts.label }}</el-radio>
</el-radio-group>
</el-form-item>
</template>
<!-- 坐标点并列显示 -->
<template v-if="checkFieldType(item, 'coordinate')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div v-for="opt in item.children" :key="opt.code" class="listWidth">
<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>
</template>
<!-- 多个坐标点绘制 -->
<template v-if="checkFieldType(item, 'points')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div class="point-section">
<template v-for="(point, index) in formModel[item.prop]">
<div :key="index" style="overflow: hidden;">
<el-form-item
label=""
:prop="'points[' + index + '].x'"
style="display: table; float: left;"
label-width="0px"
>
<el-input-number v-model="point.x" :disabled="item.pointDisabled" />
</el-form-item>
<span
style="display: table; margin-left: 8px; float: left; line-height: 28px;"
>
, </span>
<el-form-item
label=""
:prop="'points[' + index + '].y'"
style="display: table; float: left; margin-right: 5px;"
label-width="10px"
>
<el-input-number v-model="point.y" :disabled="item.pointDisabled" />
</el-form-item>
<el-button
icon="el-icon-plus"
:disabled="item.pointDisabled"
circle
class="point-button"
@click="item.addPoint(index)"
/>
<el-button
icon="el-icon-minus"
:disabled="index == 0 || index == formModel[item.prop].length - 1"
circle
class="point-button"
@click="item.delPoint(index)"
/>
</div>
</template>
</div>
</div>
</template>
<template v-if="checkFieldType(item, 'checkbox')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<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,
required: true
},
form: {
type: Object,
required: true
},
rules: {
type: Object,
default: function () {
return null;
}
}
},
data () {
return {
skins: []
};
},
methods: {
handleLabel(option, label) {
if (label == 'name') {
return option.name;
} else if (label == 'code') {
return option.code;
} else if (label == 'label') {
return option.label;
} else if (label == 'name&&code') {
return option.name + ' (' + option.code+ ')';
} else if (label == 'code&&name') {
return option.code + ' (' + option.name+ ')';
} else {
return option.label;
}
},
decompose(item, prop) {
if (!prop.includes('.')) {
return prop;
}
const keyArr = prop.split('.');
return keyArr[0][keyArr[1]];
},
checkFieldType(field, type) {
if (field.hasOwnProperty('show')) {
return field.type === type && field.show;
} else {
return field.type === type;
}
},
validate(callback) {
this.$refs.form.validate((valid) => {
if (valid) {
callback(true);
} else {
callback(false);
}
});
},
resetForm() {
this.$refs.form.resetFields();
},
clearValidate() {
this.$refs.form.clearValidate();
},
resetFields() {
this.$refs.form.resetFields();
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.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: 120px;
font-weight: bold;
display: block;
float: left;
margin-right: 7px;
}
.listWidth{
display: table;
float: left;
margin-right: 20px;
&:last-child{
margin: 0;
}
}
}
.point-section {
float: left;
width: calc(100% - 180px);
}
.point-button {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
float: left;
/deep/ {
.el-icon-plus,
.el-icon-minus {
transform: translateY(-5px);
}
}
}
.el-input-number--mini {
width: 110px;
}
</style>

View File

@ -1,160 +1,176 @@
<template> <template>
<el-form ref="form" :label-width="form.labelWidth" size="mini" :rules="rules" :model="formModel"> <el-form ref="form" :label-width="form.labelWidth" size="mini" :rules="rules" :model="formModel">
<template v-for="item in form.items"> <template v-for="(items, index) in form.items">
<template v-if="checkFieldType(item, 'select')"> <div v-if="items.item.length" :key="index" class="card">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required"> <div class="card_title">{{ items.name }}</div>
<template v-if="item.change"> <template v-for="item in items.item">
<el-select <template v-if="checkFieldType(item, 'select')">
v-model="formModel[item.prop]" <el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
filterable <template v-if="item.change">
:placeholder="item.placeholder" <el-select
:disabled="item.disabled" v-model="formModel[item.prop]"
@change="item.deviceChange" filterable
> :placeholder="item.placeholder"
<el-option :disabled="item.disabled"
v-for="option in item.options" @change="item.deviceChange"
:key="option[item.optionValue]" >
:label="handleLabel(option, item.optionLabel)" <el-option
:value="option[item.optionValue]" v-for="option in item.options"
/> :key="option[item.optionValue]"
</el-select> :label="handleLabel(option, item.optionLabel)"
</template> :value="option[item.optionValue]"
<template v-else> />
<el-select </el-select>
v-model="formModel[item.prop]" </template>
filterable <template v-else>
:placeholder="item.placeholder" <el-select
:disabled="item.disabled" v-model="formModel[item.prop]"
> filterable
<el-option :placeholder="item.placeholder"
v-for="option in item.options" :disabled="item.disabled"
:key="option[item.optionValue]" >
:label="handleLabel(option, item.optionLabel)" <el-option
:value="option[item.optionValue]" v-for="option in item.options"
/> :key="option[item.optionValue]"
</el-select> :label="handleLabel(option, item.optionLabel)"
</template> :value="option[item.optionValue]"
</el-form-item> />
</template> </el-select>
<template v-if="checkFieldType(item, 'selectHover')"> </template>
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-select
v-model="formModel[item.prop]"
filterable
:placeholder="item.placeholder"
:disabled="item.disabled"
>
<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]" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'number')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<div v-if="!item.firstLevel">
<el-input-number v-model="formModel[item.prop]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" />
<span style="padding-left: 1px;">{{ item.placeholder }}</span>
</div>
<div v-else>
<el-input-number v-model="formModel[item.firstLevel][item.secondLevel]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" />
<span style="padding-left: 1px;">{{ item.placeholder }}</span>
</div>
</el-form-item>
</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]" show-alpha :predefine="skins" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'radio')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<el-radio-group v-model="formModel[item.prop]" :disabled="item.disabled">
<el-radio v-for="(opts, index) in item.radioList" :key="index" :border="item.border" :label="opts.value">{{ opts.label }}</el-radio>
</el-radio-group>
</el-form-item>
</template>
<!-- 坐标点并列显示 -->
<template v-if="checkFieldType(item, 'coordinate')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div v-for="opt in item.children" :key="opt.code" class="listWidth">
<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> </el-form-item>
</div> </template>
</div> <template v-if="checkFieldType(item, 'selectHover')">
</template> <el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<!-- 多个坐标点绘制 --> <el-select
<template v-if="checkFieldType(item, 'points')"> v-model="formModel[item.prop]"
<div v-if="!item.isHidden" :key="item.prop" class="coordinate"> filterable
<span class="title" :style="{width: item.width}">{{ item.label }}</span> :placeholder="item.placeholder"
<div class="point-section"> :disabled="item.disabled"
<template v-for="(point, index) in formModel[item.prop]"> >
<div :key="index" style="overflow: hidden;"> <el-option
<el-form-item v-for="option in item.options"
label="" :key="option.code"
:prop="'points[' + index + '].x'" :label="handleLabel(option, item.optionLabel)"
style="display: table; float: left;" :value="option.code"
label-width="0px"
>
<el-input-number v-model="point.x" :disabled="item.pointDisabled" />
</el-form-item>
<span
style="display: table; margin-left: 8px; float: left; line-height: 28px;"
>
, </span>
<el-form-item
label=""
:prop="'points[' + index + '].y'"
style="display: table; float: left; margin-right: 5px;"
label-width="10px"
>
<el-input-number v-model="point.y" :disabled="item.pointDisabled" />
</el-form-item>
<el-button
icon="el-icon-plus"
:disabled="item.pointDisabled"
circle
class="point-button"
@click="item.addPoint(index)"
/>
<el-button
icon="el-icon-minus"
:disabled="index == 0 || index == formModel[item.prop].length - 1"
circle
class="point-button"
@click="item.delPoint(index)"
/> />
</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]" :disabled="item.disabled" />
</el-form-item>
</template>
<template v-if="checkFieldType(item, 'number')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<div v-if="!item.firstLevel">
<el-input-number v-model="formModel[item.prop]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" />
<span style="padding-left: 1px;">{{ item.placeholder }}</span>
</div> </div>
</template> <div v-else>
</div> <el-input-number v-model="formModel[item.firstLevel][item.secondLevel]" :min="item.min" :max="item.max" :label="item.label" :disabled="item.disabled" />
</div> <span style="padding-left: 1px;">{{ item.placeholder }}</span>
</template> </div>
<template v-if="checkFieldType(item, 'checkbox')"> </el-form-item>
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required"> </template>
<el-checkbox v-model="formModel[item.prop]" :disabled="item.disabled" /> <template v-if="checkFieldType(item, 'color')">
</el-form-item> <el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
</template> <el-color-picker v-model="formModel[item.prop]" show-alpha :predefine="skins" :disabled="item.disabled" />
<template v-if="checkFieldType(item, 'font')"> </el-form-item>
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required"> </template>
<el-font v-model="formModel[item.prop]" :disabled="item.disabled" :placeholder="item.placeholder" /> <template v-if="checkFieldType(item, 'radio')">
</el-form-item> <el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
</template> <el-radio-group v-model="formModel[item.prop]" :disabled="item.disabled">
<el-radio v-for="(opts, index) in item.radioList" :key="index" :border="item.border" :label="opts.value">{{ opts.label }}</el-radio>
</el-radio-group>
</el-form-item>
</template>
<!-- 坐标点并列显示 -->
<template v-if="checkFieldType(item, 'coordinate')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div v-for="opt in item.children" :key="opt.code" class="listWidth">
<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>
</template>
<!-- 多个坐标点绘制 -->
<template v-if="checkFieldType(item, 'points')">
<div v-if="!item.isHidden" :key="item.prop" class="coordinate">
<span class="title" :style="{width: item.width}">{{ item.label }}</span>
<div class="point-section">
<template v-for="(point, index) in formModel[item.prop]">
<div :key="index" style="overflow: hidden;">
<el-form-item
label=""
:prop="'points[' + index + '].x'"
style="display: table; float: left;"
label-width="0px"
>
<el-input-number v-model="point.x" :disabled="item.pointDisabled" />
</el-form-item>
<span
style="display: table; margin-left: 8px; float: left; line-height: 28px;"
>
, </span>
<el-form-item
label=""
:prop="'points[' + index + '].y'"
style="display: table; float: left; margin-right: 5px;"
label-width="10px"
>
<el-input-number v-model="point.y" :disabled="item.pointDisabled" />
</el-form-item>
<el-button
icon="el-icon-plus"
:disabled="item.pointDisabled"
circle
class="point-button"
@click="item.addPoint(index)"
/>
<el-button
icon="el-icon-minus"
:disabled="index == 0 || index == formModel[item.prop].length - 1"
circle
class="point-button"
@click="item.delPoint(index)"
/>
</div>
</template>
</div>
</div>
</template>
<template v-if="checkFieldType(item, 'checkbox')">
<el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
<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 v-if="checkFieldType(item, 'fontContent')">
<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.content]" :placeholder="item.placeholder" class="input-with-select">
<el-select slot="prepend" v-model="formModel[item.prepend]" :placeholder="item.placeholder">
<el-option label="水平" value="H" />
<el-option label="垂直" value="V" />
</el-select>
</el-input>
</el-form-item>
</template>
</template>
</div>
</template> </template>
</el-form></template> </el-form>
</template>
<script> <script>
import ElFont from '@/views/components/font/index'; import ElFont from '@/views/components/font/index';
@ -289,5 +305,36 @@ export default {
.el-input-number--mini { .el-input-number--mini {
width: 110px; width: 110px;
} }
.el-form{
padding: 10px;
padding-bottom: 0;
}
.card{
border: 1px solid #ccc;
padding: 10px;
box-sizing: border-box;
position: relative;
margin-bottom: 15px;
&:last-child{
margin-bottom: 0;
}
.card_title {
position: absolute;
left: 10px;
top: -8px;
background: #fff;
padding: 0px 5px;
}
}
/deep/ {
.input-with-select .el-input-group__prepend {
background-color: #fff;
}
}
</style> </style>

View File

@ -3,50 +3,7 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.property')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" :rules="editRules" label-width="120px" size="mini"> <config-list ref="form" :form="form" :form-model="editModel" :rules="rules" />
<el-form-item :label="$t('map.counterCoding')" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in counterList"
:key="item.code"
:label="item.code"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.counterName')" prop="name">
<el-input v-model="editModel.name" />
</el-form-item>
<el-form-item :label="$t('map.belongsStation')" 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="$t('map.counterType')" prop="type">
<el-select v-model="editModel.type" filterable :placeholder="$t('map.pleaseSelect')">
<el-option
v-for="item in typeList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.countMax')" prop="max">
<el-input-number v-model="editModel.max" :min="0" />
</el-form-item>
<el-form-item :label="$t('map.pointX')" prop="position.x">
<el-input-number v-model="editModel.position.x" />px
</el-form-item>
<el-form-item :label="$t('map.pointY')" prop="position.y">
<el-input-number v-model="editModel.position.y" />px
</el-form-item>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -89,10 +46,12 @@
<script> <script>
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ConfigList from './config/list';
export default { export default {
name: 'CounterDraft', name: 'CounterDraft',
components: { components: {
ConfigList
}, },
props: { props: {
selected: { selected: {
@ -147,7 +106,7 @@ export default {
] ]
}; };
}, },
editRules: function () { rules: function () {
return { return {
code: [ code: [
{ required: true, message: this.$t('map.pleaseSelectDevice'), trigger: 'change' } { required: true, message: this.$t('map.pleaseSelectDevice'), trigger: 'change' }
@ -171,6 +130,31 @@ export default {
{ required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'change' } { required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'change' }
] ]
}; };
},
form() {
const form = {
labelWidth: '120px',
items: {
draw: {
name: '绘图数据',
item: [
{ prop: 'code', label: this.$t('map.counterCoding'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.counterList, change: true, deviceChange: this.deviceChange },
{ prop: 'name', label: this.$t('map.counterName'), type: 'input' },
{ prop: 'stationCode', label: this.$t('map.belongsStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList },
{ prop: 'type', label: this.$t('map.counterType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.typeList },
{ prop: 'max', label: this.$t('map.countMax'), type: 'number', min: 0, placeholder: '个' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.pointX'), type: 'number', placeholder: 'px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.pointY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: [
]
}
}
};
return form;
} }
}, },
watch: { watch: {

View File

@ -3,43 +3,7 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.property')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" :rules="editRules" label-width="130px" size="mini"> <config-list ref="form" :form="form" :form-model="editModel" :rules="editRules" />
<el-form-item :label="$t('map.delayUnlockingCode')" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in delayShowList"
:key="item.code"
:label="item.code"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.belongsStation')" 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="$t('map.delayTime')" prop="unlockTime" disabled="true">
<el-input-number v-model="editModel.unlockTime" :min="0" :max="1000" />s
</el-form-item>
<el-form-item :label="$t('map.font')" prop="fontFamily">
<el-font v-model="editModel.fontFamily" />
</el-form-item>
<el-form-item :label="$t('map.color')" prop="textFontColor">
<el-color-picker v-model="editModel.textFontColor" show-alpha :predefine="skins" />
</el-form-item>
<el-form-item :label="$t('map.pointX')" prop="position.x">
<el-input-number v-model="editModel.position.x" />px
</el-form-item>
<el-form-item :label="$t('map.pointY')" prop="position.y">
<el-input-number v-model="editModel.position.y" />px
</el-form-item>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -72,12 +36,12 @@
<script> <script>
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ElFont from '@/views/components/font/index'; import ConfigList from './config/list';
export default { export default {
name: 'DelayUnlockDraft', name: 'DelayUnlockDraft',
components: { components: {
ElFont ConfigList
}, },
props: { props: {
selected: { selected: {
@ -148,6 +112,31 @@ export default {
{ required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'change' } { required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'change' }
] ]
}; };
},
form() {
const form = {
labelWidth: '120px',
items: {
draw: {
name: '绘图数据',
item: [
{ prop: 'code', label: this.$t('map.delayUnlockingCode'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.delayShowList, change: true, deviceChange: this.deviceChange },
{ prop: 'stationCode', label: this.$t('map.belongsStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList },
{ prop: 'unlockTime', label: this.$t('map.delayTime'), type: 'number', min: 0, max: 1000, placeholder: 's' },
{ prop: 'fontFamily', label: this.$t('map.font'), type: 'font' },
{ prop: 'textFontColor', label: this.$t('map.color'), type: 'color' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.pointX'), type: 'number', placeholder: 'px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.pointY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: [
]
}
}
};
return form;
} }
}, },
watch: { watch: {

View File

@ -21,26 +21,17 @@
:disabled="mapSaveing" :disabled="mapSaveing"
@click="verifyMapEvent" @click="verifyMapEvent"
>{{ $t('map.dataVerification') }}</el-button> >{{ $t('map.dataVerification') }}</el-button>
<el-button
type="text"
style="float: right; padding: 3px 0; margin-right: 5px;"
@click="dataRelation"
>构建数据关系</el-button>
<el-button
type="text"
style="float: right; padding: 3px 0; margin-right: 5px;"
@click="showMap"
>地图显示参数</el-button>
</div> </div>
<el-row type="flex" justify="center">
<el-radio-group v-model="viewSelect" @change="handleSelectView">
<el-radio-button :label="ViewMode.LOGIC">{{ $t('map.logicalView') }}</el-radio-button>
<el-radio-button :label="ViewMode.PHYSICAL">{{ $t('map.physicalView') }}</el-radio-button>
<el-radio-button :label="ViewMode.MIX">{{ $t('map.mixedView') }}</el-radio-button>
</el-radio-group>
</el-row>
<el-row v-if="ViewMode.LOGIC === viewSelect" class="logical-view" type="flex" justify="center">
<el-checkbox-group v-model="logicalLevelsSelect" @change="handleSelectLogicalView">
<el-checkbox v-for="view in LogicalViewTypeList" :key="view.code" :label="view.code">
{{ view.name }}</el-checkbox>
</el-checkbox-group>
</el-row>
<el-row v-if="ViewMode.PHYSICAL === viewSelect" class="physical-view" type="flex" justify="center">
<el-checkbox-group v-model="physicalLevelsSelect" @change="handleSelectPhysicalView">
<el-checkbox v-for="view in PhysicalViewTypeList" :key="view.code" :label="view.code">
{{ view.name }}</el-checkbox>
</el-checkbox-group>
</el-row>
<el-tabs v-model="enabledTab" type="card"> <el-tabs v-model="enabledTab" type="card">
<el-tab-pane :label="$t('map.link')" name="Link"> <el-tab-pane :label="$t('map.link')" name="Link">
<link-draft <link-draft
@ -326,6 +317,12 @@ export default {
}); });
}, },
methods: { methods: {
dataRelation() {
this.$emit('selectView', 'path');
},
showMap() {
this.$emit('showMap');
},
initPage() { initPage() {
this.$Dictionary.logicalViewType().then(list => { this.$Dictionary.logicalViewType().then(list => {
this.LogicalViewTypeList = list; this.LogicalViewTypeList = list;

View File

@ -3,40 +3,7 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.property')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" label-width="150px" size="mini" :rules="rules"> <config-list ref="form" :form="form" :form-model="editModel" :rules="rules" />
<el-form-item :label="$t('map.code')" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in lcList"
:key="item.code"
:label="item.name + '(' + item.code+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.statusSignalName')" prop="name">
<el-input v-model="editModel.name" />
</el-form-item>
<div class="coordinate">
<span class="title">{{ $t('map.stateSignalsPlotCoordinates') }}</span>
<el-form-item
label="x:"
prop="position.x"
style="display: table; float: left; margin-right: 20px;"
label-width="20px"
>
<el-input-number v-model="editModel.position.x" />
</el-form-item>
<el-form-item
label="y:"
prop="position.y"
style="display: table; float: left;"
label-width="20px"
>
<el-input-number v-model="editModel.position.y" />
</el-form-item>
</div>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -81,10 +48,12 @@
<script> <script>
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ConfigList from './config/list';
export default { export default {
name: 'LcControlDraft', name: 'LcControlDraft',
components: { components: {
ConfigList
}, },
props: { props: {
selected: { selected: {
@ -153,6 +122,30 @@ export default {
{ required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'blur' } { required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'blur' }
] ]
}; };
},
form() {
const form = {
labelWidth: '150px',
items: {
draw: {
name: '绘图数据',
item: [
{ prop: 'code', label: this.$t('map.code'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.lcList, change: true, deviceChange: this.deviceChange },
{ prop: 'name', label: this.$t('map.statusSignalName'), type: 'input' },
{ prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), type: 'coordinate', width: '150px', children: [
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: false },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: false }
] }
]
},
map: {
name: '地图数据',
item: [
]
}
}
};
return form;
} }
}, },
watch: { watch: {

View File

@ -3,40 +3,7 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.property')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" label-width="150px" size="mini" :rules="rules"> <config-list ref="form" :form="form" :form-model="editModel" :rules="rules" />
<el-form-item :label="$t('map.code')" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in tempSpeedLimitList"
:key="item.code"
:label="item.name + '(' + item.code+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.statusSignalName')" prop="name">
<el-input v-model="editModel.name" />
</el-form-item>
<div class="coordinate">
<span class="title">{{ $t('map.stateSignalsPlotCoordinates') }}</span>
<el-form-item
label="x:"
prop="position.x"
style="display: table; float: left; margin-right: 20px;"
label-width="20px"
>
<el-input-number v-model="editModel.position.x" />
</el-form-item>
<el-form-item
label="y:"
prop="position.y"
style="display: table; float: left;"
label-width="20px"
>
<el-input-number v-model="editModel.position.y" />
</el-form-item>
</div>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -45,30 +12,7 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane class="view-control" :label="$t('map.operation')" name="second"> <el-tab-pane class="view-control" :label="$t('map.operation')" name="second">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="make" label-width="150px" :rules="createRules" :model="addModel" size="mini"> <config-data ref="make" :form="formMake" :form-model="addModel" :rules="createRules" />
<el-form-item :label="$t('map.statusSignalName')" prop="name">
<el-input v-model="addModel.name" />
</el-form-item>
<div class="coordinate">
<span class="title">{{ $t('map.stateSignalsPlotCoordinates') }}</span>
<el-form-item
label="x:"
prop="position.x"
style="display: table; float: left; margin-right: 20px;"
label-width="20px"
>
<el-input-number v-model="addModel.position.x" />
</el-form-item>
<el-form-item
label="y:"
prop="position.y"
style="display: table; float: left;"
label-width="20px"
>
<el-input-number v-model="addModel.position.y" />
</el-form-item>
</div>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="create">{{ $t('map.create') }}</el-button> <el-button type="primary" @click="create">{{ $t('map.create') }}</el-button>
@ -81,10 +25,14 @@
<script> <script>
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ConfigList from './config/list';
import ConfigData from './config/data';
export default { export default {
name: 'LimitControlDraft', name: 'LimitControlDraft',
components: { components: {
ConfigList,
ConfigData
}, },
props: { props: {
selected: { selected: {
@ -141,6 +89,42 @@ export default {
'tempSpeedLimitList', 'tempSpeedLimitList',
'skinCode' 'skinCode'
]), ]),
form() {
const form = {
labelWidth: '150px',
items: {
draw: {
name: '绘图数据',
item: [
{ prop: 'code', label: this.$t('map.code'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.tempSpeedLimitList, change: true, deviceChange: this.deviceChange },
{ prop: 'name', label: this.$t('map.statusSignalName'), type: 'input' },
{ prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), 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' }
] }
]
},
map: {
name: '地图数据',
item: []
}
}
};
return form;
},
formMake() {
const form = {
labelWidth: '150px',
items: [
{ prop: 'name', label: this.$t('map.statusSignalName'), type: 'input' },
{ prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), 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' }
] }
]
};
return form;
},
createRules: function () { createRules: function () {
return { return {
name: [ name: [

View File

@ -3,71 +3,7 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.property')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" label-width="120px" size="mini" :rules="rules"> <config-list ref="form" :form="form" :form-model="editModel" :rules="rules" />
<el-form-item :label="$t('map.lineCoding')" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in lineList"
:key="item.code"
:label="item.code"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.lineType')" prop="type">
<el-select v-model="editModel.type" filterable>
<el-option
v-for="item in LineTypeList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.lineWidth')" prop="width">
<el-input-number v-model="editModel.width" :min="1" />px
</el-form-item>
<div class="coordinate">
<span class="title">{{ $t('map.segmentCoordinates') }}</span>
<div class="point-section">
<template v-for="(point, index) in editModel.points">
<div :key="index" style="overflow: hidden;">
<el-form-item
label=""
:prop="'points[' + index + '].x'"
style="display: table; float: left;"
label-width="0px"
>
<el-input-number v-model="point.x" />
</el-form-item>
<span style="display: table; margin-left: 8px; float: left; line-height: 28px;">
, </span>
<el-form-item
label=""
:prop="'points[' + index + '].y'"
style="display: table; float: left; margin-right: 5px;"
label-width="10px"
>
<el-input-number v-model="point.y" />
</el-form-item>
<el-button
icon="el-icon-plus"
circle
class="point-button"
@click="addPoint(editModel.points, index)"
/>
<el-button
icon="el-icon-minus"
:disabled="index == 0 || index == editModel.points.length - 1"
circle
class="point-button"
@click="delPoint(editModel.points,index)"
/>
</div>
</template>
</div>
</div>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -143,10 +79,12 @@
<script> <script>
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ConfigList from './config/list';
export default { export default {
name: 'StationStandDraft', name: 'StationStandDraft',
components: { components: {
ConfigList
}, },
props: { props: {
selected: { selected: {
@ -207,7 +145,32 @@ export default {
'lineList', 'lineList',
'stationList', 'stationList',
'skinCode' 'skinCode'
]) ]),
form() {
const form = {
labelWidth: '120px',
items: {
draw: {
name: '绘图数据',
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: 'width', label: this.$t('map.lineWidth'), type: 'number', min: 1, placeholder: 'px' },
{ prop: 'points', label: this.$t('map.segmentCoordinates'), type: 'points', width: '120px', isHidden: !this.isPointsShow, addPoint: this.addPoint, delPoint: this.delPoint }
]
},
map: {
name: '地图数据',
item: [
]
}
}
};
return form;
},
isPointsShow() {
return this.editModel.points.length > 0;
}
}, },
watch: { watch: {
selected(val, oldVal) { selected(val, oldVal) {
@ -243,16 +206,12 @@ export default {
this.activeName = 'second'; this.activeName = 'second';
} }
}, },
addPoint(points, index) { addPoint(index) {
const data = { x: 0, y: 0 }; const data = { x: 0, y: 0 };
if (points && points.length) { this.editModel.points.splice(index + 1, 0, data);
points.splice(index + 1, 0, data);
}
}, },
delPoint(points, index) { delPoint(index) {
if (points) { this.editModel.points.splice(index + 1, 0);
points.splice(index, 1);
}
}, },
create() { create() {
this.$refs['make'].validate((valid) => { this.$refs['make'].validate((valid) => {

View File

@ -1,18 +1,9 @@
<template> <template>
<div> <div>
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.drawData')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<config-list ref="drawform" :form="drawform" :form-model="editModel" :rules="rules" /> <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">{{ $t('map.updateObj') }}</el-button>
<el-button type="primary" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
</el-button-group>
</el-tab-pane>
<el-tab-pane class="view-control" :label="$t('map.mapData')" name="three">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<config-list ref="dataform" :form="dataform" :form-model="editModel" />
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -35,13 +26,13 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<template v-if="isNew"> <template v-if="isNew">
<config-list ref="make1" :form="formMake1" :form-model="addModel" :rules="makeRules1" /> <config-data ref="make1" :form="formMake1" :form-model="addModel" :rules="makeRules1" />
</template> </template>
<template v-if="isFd"> <template v-if="isFd">
<config-list ref="make2" :form="formMake2" :form-model="addModel" :rules="makeRules2" /> <config-data ref="make2" :form="formMake2" :form-model="addModel" :rules="makeRules2" />
</template> </template>
<template v-if="isSd"> <template v-if="isSd">
<config-list ref="make3" :form="formMake3" :form-model="addModel" :rules="makeRules3" /> <config-data ref="make3" :form="formMake3" :form-model="addModel" :rules="makeRules3" />
</template> </template>
</el-form> </el-form>
</el-scrollbar> </el-scrollbar>
@ -60,11 +51,13 @@ import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import { getUName } from '@/jmap/utils/Uname'; import { getUName } from '@/jmap/utils/Uname';
import ConfigList from './config/list'; import ConfigList from './config/list';
import ConfigData from './config/data';
export default { export default {
name: 'LinkDraft', name: 'LinkDraft',
components: { components: {
ConfigList ConfigList,
ConfigData
}, },
props: { props: {
selected: { selected: {
@ -160,36 +153,38 @@ export default {
...mapGetters('map', [ ...mapGetters('map', [
'linkList' 'linkList'
]), ]),
drawform() { form() {
const form = { const form = {
labelWidth: '130px', labelWidth: '130px',
items: [ items: {
{ prop: 'code', label: this.$t('map.linkCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList, change: true, deviceChange: this.deviceChange }, draw: {
{ prop: 'name', label: this.$t('map.linkName'), type: 'input' }, name: '绘图数据',
{ prop: 'lengthShow', label: this.$t('map.linkDisplayLength'), type: 'number', min: 50, placeholder: 'px' }, item: [
{ prop: 'color', label: this.$t('map.linkColor'), type: 'color' }, { prop: 'code', label: this.$t('map.linkCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList, change: true, deviceChange: this.deviceChange },
{ prop: 'leftFdCode', label: this.$t('map.linkLeftFdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList }, { prop: 'name', label: this.$t('map.linkName'), type: 'input' },
{ prop: 'leftSdCode', label: this.$t('map.linkLeftSdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList }, { prop: 'lengthShow', label: this.$t('map.linkDisplayLength'), type: 'number', min: 50, placeholder: 'px' },
{ prop: 'rightFdCode', label: this.$t('map.linkRightFdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList }, { prop: 'color', label: this.$t('map.linkColor'), type: 'color' },
{ prop: 'rightSdCode', label: this.$t('map.linkRightSdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList }, { prop: 'leftFdCode', label: this.$t('map.linkLeftFdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList },
{ prop: 'lp', label: this.$t('map.linkLp'), type: 'coordinate', width: '160px', children: [ { prop: 'leftSdCode', label: this.$t('map.linkLeftSdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList },
{ prop: 'lp.x', firstLevel: 'lp', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true }, { prop: 'rightFdCode', label: this.$t('map.linkRightFdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList },
{ prop: 'lp.y', firstLevel: 'lp', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true } { prop: 'rightSdCode', label: this.$t('map.linkRightSdCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList },
] }, { prop: 'lp', label: this.$t('map.linkLp'), type: 'coordinate', width: '160px', children: [
{ prop: 'rp', label: this.$t('map.linkRp'), type: 'coordinate', width: '160px', children: [ { prop: 'lp.x', firstLevel: 'lp', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: false },
{ prop: 'rp.x', firstLevel: 'rp', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true }, { prop: 'lp.y', firstLevel: 'lp', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: false }
{ prop: 'rp.y', firstLevel: 'rp', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true } ] },
] } { prop: 'rp', label: this.$t('map.linkRp'), type: 'coordinate', width: '160px', children: [
] { prop: 'rp.x', firstLevel: 'rp', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: false },
}; { prop: 'rp.y', firstLevel: 'rp', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: false }
return form; ] }
}, ]
dataform() { },
const form = { map: {
labelWidth: '130px', name: '地图数据',
items: [ item: [
{ prop: 'lengthFact', label: this.$t('map.linkActualLength'), type: 'number', min: 0, placeholder: this.$t('tip.meter') } { prop: 'lengthFact', label: this.$t('map.linkActualLength'), type: 'number', min: 0, placeholder: this.$t('tip.meter') }
] ]
}
}
}; };
return form; return form;
}, },
@ -275,7 +270,6 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
this.activeName = 'first'; this.activeName = 'first';
this.$refs.dataform.clearValidate(); this.$refs.dataform.clearValidate();
this.$refs.drawform.clearValidate();
}); });
} }
}, },
@ -291,7 +285,6 @@ export default {
deviceSelect(selected) { deviceSelect(selected) {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.dataform.clearValidate(); this.$refs.dataform.clearValidate();
this.$refs.drawform.clearValidate();
this.$refs.make.resetFields(); this.$refs.make.resetFields();
if (selected && selected._type.toUpperCase() === 'Link'.toUpperCase()) { if (selected && selected._type.toUpperCase() === 'Link'.toUpperCase()) {
this.editModel.name = selected.name; this.editModel.name = selected.name;

View File

@ -184,6 +184,7 @@ export default {
SectionSepTypeList: [], SectionSepTypeList: [],
TrainPositionTypeList: [], TrainPositionTypeList: [],
regionList: [], regionList: [],
viewSelect: false,
editModel: { editModel: {
code: '', code: '',
name: '', name: '',
@ -282,70 +283,81 @@ export default {
form() { form() {
const form = { const form = {
labelWidth: '160px', labelWidth: '160px',
items: [ items: {
{ prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', disabled: this.isStationCodeDisabled, options: this.stationList }, draw: {
{ prop: 'parentCode', label: this.$t('map.associatedSection'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', disabled: true, options: this.sectionList, isHidden: !this.isParentCode }, name: '绘图数据',
{ prop: 'code', label: this.$t('map.blockCoding'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.sectionList, change: true, deviceChange: this.deviceChange }, item: [
{ prop: 'type', label: this.$t('map.sectionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SectionTypeList }, { prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', mode: true, optionLabel: 'name&&code', optionValue: 'code', disabled: this.isStationCodeDisabled, options: this.stationList },
{ prop: 'name', label: this.$t('map.sectionNameColon'), type: 'input' }, { prop: 'parentCode', label: this.$t('map.associatedSection'), type: 'select', mode: true, optionLabel: 'code&&name', optionValue: 'code', disabled: true, options: this.sectionList, isHidden: !this.isParentCode },
{ prop: 'namePoint', label: this.$t('map.sectionNameOffset'), type: 'coordinate', width: '150px', children: [ { prop: 'code', label: this.$t('map.blockCoding'), type: 'select', mode: false, optionLabel: 'code&&name', optionValue: 'code', options: this.sectionList, change: true, deviceChange: this.deviceChange },
{ prop: 'namePoint.x', firstLevel: 'namePoint', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' }, { prop: 'type', label: this.$t('map.sectionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SectionTypeList },
{ prop: 'namePoint.y', firstLevel: 'namePoint', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' } { prop: 'name', label: this.$t('map.sectionNameColon'), type: 'input' },
] }, { prop: 'namePoint', label: this.$t('map.sectionNameOffset'), type: 'coordinate', width: '150px', children: [
{ prop: 'kmRangeLeft', label: this.$t('map.leftKilometerMark'), type: 'number', min: 0 }, { prop: 'namePoint.x', firstLevel: 'namePoint', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
{ prop: 'kmRangeRight', label: this.$t('map.rightKilometerMark'), type: 'number', min: 0 }, { prop: 'namePoint.y', firstLevel: 'namePoint', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
{ prop: 'region', label: this.$t('map.sectionColon'), type: 'select', optionLabel: 'label', optionValue: 'value', options: this.regionList }, ] },
{ prop: 'nameShow', label: this.$t('map.displayExtentName'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'kmRangeLeft', label: this.$t('map.leftKilometerMark'), type: 'number', min: 0 },
{ prop: 'axleShow', label: this.$t('map.displayAxleCounter'), type: 'checkbox', disabled: this.isStationAxleShow, isHidden: !this.isSectionType}, { prop: 'kmRangeRight', label: this.$t('map.rightKilometerMark'), type: 'number', min: 0 },
{ prop: 'logicSectionShow', label: this.$t('map.displayLogicalExtents'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'region', label: this.$t('map.sectionColon'), type: 'select', optionLabel: 'label', optionValue: 'value', options: this.regionList },
{ prop: 'logicSectionNameShow', label: this.$t('map.displayLogicalWxtentNames'), type: 'checkbox', disabled: this.islogicSectionNameShow, isHidden: !this.isSectionType }, { prop: 'nameShow', label: this.$t('map.displayExtentName'), type: 'checkbox', isHidden: !this.isSectionType },
{ prop: 'isStandTrack', label: this.$t('map.isStandTrack'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'axleShow', label: this.$t('map.displayAxleCounter'), type: 'checkbox', disabled: this.isStationAxleShow, isHidden: !this.isSectionType},
{ prop: 'standTrackName', label: this.$t('map.standTrackName'), type: 'input', isHidden: !this.isstandTrackNameShow }, { prop: 'logicSectionShow', label: this.$t('map.displayLogicalExtents'), type: 'checkbox', isHidden: !this.isSectionType },
{ prop: 'standTrackNamePosition', label: this.$t('map.standTrackNamePosition'), type: 'coordinate', width: '150px', isHidden: !this.isstandTrackNameShow, children: [ { prop: 'logicSectionNameShow', label: this.$t('map.displayLogicalWxtentNames'), type: 'checkbox', disabled: this.islogicSectionNameShow, isHidden: !this.isSectionType },
{ prop: 'standTrackNamePosition.x', firstLevel: 'standTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'}, { prop: 'isStandTrack', label: this.$t('map.isStandTrack'), type: 'checkbox', isHidden: !this.isSectionType },
{ prop: 'standTrackNamePosition.y', firstLevel: 'standTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'} { prop: 'standTrackName', label: this.$t('map.standTrackName'), type: 'input', isHidden: !this.isstandTrackNameShow },
] }, { prop: 'standTrackNamePosition', label: this.$t('map.standTrackNamePosition'), type: 'coordinate', width: '150px', isHidden: !this.isstandTrackNameShow, children: [
{ prop: 'relStandCode', label: this.$t('map.relStandCode'), type: 'selectHover', optionLabel: 'code&&name', optionValue: 'code', options: this.stationStandList, hover: this.hover, buttonType: 'relStandCode', buttonShowType: this.isButtonType, isHidden: !this.isrelStandCode }, { prop: 'standTrackNamePosition.x', firstLevel: 'standTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'},
{ prop: 'isReentryTrack', label: this.$t('map.isReentryTrack'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'standTrackNamePosition.y', firstLevel: 'standTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'}
{ prop: 'reentryTrackName', label: this.$t('map.reentryTrackName'), type: 'input', isHidden: !this.isreentryTrackName }, ] },
{ prop: 'reentryTrackNamePosition', label: this.$t('map.reentryTrackNamePosition'), type: 'coordinate', width: '150px', isHidden: !this.isreentryTrackName, children: [ { prop: 'relStandCode', label: this.$t('map.relStandCode'), type: 'selectHover', optionLabel: 'code&&name', optionValue: 'code', options: this.stationStandList, hover: this.hover, buttonType: 'relStandCode', buttonShowType: this.isButtonType, isHidden: !this.isrelStandCode },
{ prop: 'reentryTrackNamePosition.x', firstLevel: 'reentryTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'}, { prop: 'isReentryTrack', label: this.$t('map.isReentryTrack'), type: 'checkbox', isHidden: !this.isSectionType },
{ prop: 'reentryTrackNamePosition.y', firstLevel: 'reentryTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'} { prop: 'reentryTrackName', label: this.$t('map.reentryTrackName'), type: 'input', isHidden: !this.isreentryTrackName },
] }, { prop: 'reentryTrackNamePosition', label: this.$t('map.reentryTrackNamePosition'), type: 'coordinate', width: '150px', isHidden: !this.isreentryTrackName, children: [
{ prop: 'isTransferTrack', label: this.$t('map.isTransferTrack'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'reentryTrackNamePosition.x', firstLevel: 'reentryTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'},
{ prop: 'transferTrackName', label: this.$t('map.transferTrackName'), type: 'input', isHidden: !this.istransferTrackName }, { prop: 'reentryTrackNamePosition.y', firstLevel: 'reentryTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'}
{ prop: 'transferTrackNamePosition', label: this.$t('map.transferTrackNamePosition'), type: 'coordinate', width: '150px', isHidden: !this.istransferTrackName, children: [ ] },
{ prop: 'transferTrackNamePosition.x', firstLevel: 'transferTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'}, { prop: 'isTransferTrack', label: this.$t('map.isTransferTrack'), type: 'checkbox', isHidden: !this.isSectionType },
{ prop: 'transferTrackNamePosition.y', firstLevel: 'transferTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'} { prop: 'transferTrackName', label: this.$t('map.transferTrackName'), type: 'input', isHidden: !this.istransferTrackName },
] }, { prop: 'transferTrackNamePosition', label: this.$t('map.transferTrackNamePosition'), type: 'coordinate', width: '150px', isHidden: !this.istransferTrackName, children: [
{ prop: 'destinationCode', label: this.$t('map.destinationCode'), type: 'input', isHidden: !this.isdestinationCode }, { prop: 'transferTrackNamePosition.x', firstLevel: 'transferTrackNamePosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'},
{ prop: 'destinationCodePoint', label: this.$t('map.destinationCodePoint'), type: 'coordinate', width: '150px', isHidden: !this.isdestinationCode, children: [ { prop: 'transferTrackNamePosition.y', firstLevel: 'transferTrackNamePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'}
{ prop: 'destinationCodePoint.x', firstLevel: 'destinationCodePoint', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'}, ] },
{ prop: 'destinationCodePoint.y', firstLevel: 'destinationCodePoint', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'} { prop: 'destinationCode', label: this.$t('map.destinationCode'), type: 'input', isHidden: !this.isdestinationCode },
] }, { prop: 'destinationCodePoint', label: this.$t('map.destinationCodePoint'), type: 'coordinate', width: '150px', isHidden: !this.isdestinationCode, children: [
{ prop: 'destinationCodeShow', label: this.$t('map.destinationCodeShow'), type: 'checkbox', isHidden: !this.isdestinationCode }, { prop: 'destinationCodePoint.x', firstLevel: 'destinationCodePoint', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px'},
{ prop: 'leftStopPointOffset', label: this.$t('map.leftStopPointOffset'), type: 'number', min: 0, isHidden: !this.isStopPointOffset }, { prop: 'destinationCodePoint.y', firstLevel: 'destinationCodePoint', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px'}
{ prop: 'rightStopPointOffset', label: this.$t('map.rightStopPointOffset'), type: 'number', min: 0, isHidden: !this.isStopPointOffset }, ] },
{ prop: 'isSwitchSection', label: this.$t('map.isSwitchSection'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'destinationCodeShow', label: this.$t('map.destinationCodeShow'), type: 'checkbox', isHidden: !this.isdestinationCode },
{ prop: 'relSwitchCode', label: this.$t('map.relSwitchCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.switchList, change: true, deviceChange: this.deviceChange, isHidden: !this.isRelSwitchCode }, { prop: 'leftStopPointOffset', label: this.$t('map.leftStopPointOffset'), type: 'number', min: 0, isHidden: !this.isStopPointOffset },
{ prop: 'logicSectionNameSort', label: this.$t('map.logicSectionNameSort'), type: 'radio', isHidden: !this.isLogicSectionNameSort, radioList: [ { prop: 'rightStopPointOffset', label: this.$t('map.rightStopPointOffset'), type: 'number', min: 0, isHidden: !this.isStopPointOffset },
{value: true, label: this.$t('map.fromSmallToLarge')}, { prop: 'isSwitchSection', label: this.$t('map.isSwitchSection'), type: 'checkbox', isHidden: !this.isSectionType },
{value: false, label: this.$t('map.fromLargeToSmall')} { prop: 'relSwitchCode', label: this.$t('map.relSwitchCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.switchList, change: true, deviceChange: this.deviceChange, isHidden: !this.isRelSwitchCode },
] }, { prop: 'logicSectionNameSort', label: this.$t('map.logicSectionNameSort'), type: 'radio', isHidden: !this.isLogicSectionNameSort, radioList: [
{ prop: 'linkCode', label: this.$t('map.relevanceLinkCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList, disabled: true, isHidden: !this.isSectionType }, {value: true, label: this.$t('map.fromSmallToLarge')},
{ prop: 'sepTypeLeft', label: this.$t('map.sepTypeLeft'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SectionSepTypeList, isHidden: !this.isSectionType }, {value: false, label: this.$t('map.fromLargeToSmall')}
{ prop: 'offsetLeft', label: this.$t('map.sectionOffsetLeft'), type: 'number', min: 0, placeholder: '米', isHidden: !this.isSectionType }, ] },
{ prop: 'sepTypeRight', label: this.$t('map.sepTypeRight'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SectionSepTypeList, isHidden: !this.isSectionType }, { prop: 'linkCode', label: this.$t('map.relevanceLinkCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList, disabled: true, isHidden: !this.isSectionType },
{ prop: 'offsetRight', label: this.$t('map.sectionOffsetRight'), type: 'number', min: 0, placeholder: '米', isHidden: !this.isSectionType }, { prop: 'sepTypeLeft', label: this.$t('map.sepTypeLeft'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SectionSepTypeList, isHidden: !this.isSectionType },
{ prop: 'isSegmentation', label: this.$t('map.isSegmentation'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'offsetLeft', label: this.$t('map.sectionOffsetLeft'), type: 'number', min: 0, placeholder: '米', isHidden: !this.isSectionType },
{ prop: 'segmentationPosition', label: this.$t('map.segmentationPosition'), type: 'coordinate', width: '150px', isHidden: !this.issegmentationPosition, children: [ { prop: 'sepTypeRight', label: this.$t('map.sepTypeRight'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SectionSepTypeList, isHidden: !this.isSectionType },
{ prop: 'segmentationPosition.x', firstLevel: 'segmentationPosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true }, { prop: 'offsetRight', label: this.$t('map.sectionOffsetRight'), type: 'number', min: 0, placeholder: '米', isHidden: !this.isSectionType },
{ prop: 'segmentationPosition.y', firstLevel: 'segmentationPosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true } { prop: 'isSegmentation', label: this.$t('map.isSegmentation'), type: 'checkbox', isHidden: !this.isSectionType },
] }, { prop: 'segmentationPosition', label: this.$t('map.segmentationPosition'), type: 'coordinate', width: '150px', isHidden: !this.issegmentationPosition, children: [
{ prop: 'isCurve', label: this.$t('map.isCurve'), type: 'checkbox', isHidden: !this.isSectionType }, { prop: 'segmentationPosition.x', firstLevel: 'segmentationPosition', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px', disabled: true },
{ prop: 'points', label: this.$t('map.sectionPoints'), type: 'points', width: '160px', isHidden: !this.isPointsShow, pointDisabled: this.pointDisabledName, addPoint: this.addPoint, delPoint: this.delPoint }, { prop: 'segmentationPosition.y', firstLevel: 'segmentationPosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px', disabled: true }
{ prop: 'trainPosType', label: this.$t('map.trainPosType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.TrainPositionTypeList, isHidden: !this.isSectionType } ] },
] { prop: 'isCurve', label: this.$t('map.isCurve'), type: 'checkbox', isHidden: !this.isSectionType },
{ prop: 'points', label: this.$t('map.sectionPoints'), type: 'points', width: '160px', isHidden: !this.isPointsShow, pointDisabled: this.pointDisabledName, addPoint: this.addPoint, delPoint: this.delPoint },
{ prop: 'trainPosType', label: this.$t('map.trainPosType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.TrainPositionTypeList, isHidden: !this.isSectionType }
]
},
map: {
name: '地图数据',
item: [
{ prop: 'trainPosType', label: this.$t('map.trainPosType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.TrainPositionTypeList, isHidden: !this.isSectionType }
]
}
}
}; };
return form; return form;
}, },
@ -536,6 +548,7 @@ export default {
deviceSelect(selected) { deviceSelect(selected) {
if (!this.fieldS) { // if (!this.fieldS) { //
this.editModel.points = []; this.editModel.points = [];
this.$refs.dataform.clearValidate();
if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase()) { if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase()) {
this.editModel.code = selected.code; this.editModel.code = selected.code;
this.editModel.name = selected.name; this.editModel.name = selected.name;

View File

@ -196,32 +196,41 @@ export default {
form() { form() {
const form = { const form = {
labelWidth: '150px', labelWidth: '150px',
items: [ items: {
{ prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList }, draw: {
{ prop: 'code', label: this.$t('map.signalCodeColon'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.signalList, change: true, deviceChange: this.deviceChange }, name: '绘图数据',
{ prop: 'name', label: this.$t('map.signalNameColon'), type: 'input' }, item: [
{ prop: 'uniqueName', label: this.$t('map.signalUniqueName'), type: 'input' }, { prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList },
{ prop: 'nameShow', label: this.$t('map.signalDisplayName'), type: 'checkbox' }, { prop: 'code', label: this.$t('map.signalCodeColon'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.signalList, change: true, deviceChange: this.deviceChange },
{ prop: 'lampPostType', label: this.$t('map.lampPostType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalLampPostTypeList }, { prop: 'name', label: this.$t('map.signalNameColon'), type: 'input' },
{ prop: 'lampPositionType', label: this.$t('map.lampPositionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalLampPositionTypeList }, { prop: 'uniqueName', label: this.$t('map.signalUniqueName'), type: 'input' },
{ prop: 'useType', label: this.$t('map.signalUseType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalUseTypeList }, { prop: 'nameShow', label: this.$t('map.signalDisplayName'), type: 'checkbox' },
{ prop: 'potLampType', label: this.$t('map.potLampType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalPotLampTypeList }, { prop: 'lampPostType', label: this.$t('map.lampPostType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalLampPostTypeList },
{ prop: 'directionType', label: this.$t('map.signalDirectionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalDirectionTypeList }, { prop: 'lampPositionType', label: this.$t('map.lampPositionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalLampPositionTypeList },
{ prop: 'positionType', label: this.$t('map.signalPositionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalPositionTypeList }, { prop: 'useType', label: this.$t('map.signalUseType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalUseTypeList },
{ prop: 'linkCode', label: 'LinkCode:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList }, { prop: 'potLampType', label: this.$t('map.potLampType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalPotLampTypeList },
{ prop: 'offset', label: this.$t('map.signalOffset'), type: 'number', min: 0, placeholder: this.$t('tip.meter') }, { prop: 'directionType', label: this.$t('map.signalDirectionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalDirectionTypeList },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.signalPositionX'), type: 'number', placeholder: this.$t('tip.meter') }, { prop: 'positionType', label: this.$t('map.signalPositionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SignalPositionTypeList },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.signalPositionY'), type: 'number', placeholder: this.$t('tip.meter') }, { prop: 'linkCode', label: 'LinkCode:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.linkList },
{ prop: 'rotate', label: this.$t('map.signalRotate'), type: 'number', min: -90, max: 90, placeholder: this.$t('tip.angle') }, { prop: 'offset', label: this.$t('map.signalOffset'), type: 'number', min: 0, placeholder: this.$t('tip.meter') },
{ prop: 'namePosition.x', firstLevel: 'namePosition', secondLevel: 'x', label: this.$t('map.signalNamePositionX'), type: 'number', placeholder: 'px' }, { prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.signalPositionX'), type: 'number', placeholder: this.$t('tip.meter') },
{ prop: 'namePosition.y', firstLevel: 'namePosition', secondLevel: 'x', label: this.$t('map.signalNamePositionY'), type: 'number', placeholder: 'px' }, { prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.signalPositionY'), type: 'number', placeholder: this.$t('tip.meter') },
{ prop: 'buttonShow', label: this.$t('map.signalButtonShow'), type: 'checkbox' }, { prop: 'rotate', label: this.$t('map.signalRotate'), type: 'number', min: -90, max: 90, placeholder: this.$t('tip.angle') },
{ prop: 'buttonPosition.x', firstLevel: 'buttonPosition', secondLevel: 'x', label: this.$t('map.signalButtonPositionX'), type: 'number', placeholder: 'px' }, { prop: 'namePosition.x', firstLevel: 'namePosition', secondLevel: 'x', label: this.$t('map.signalNamePositionX'), type: 'number', placeholder: 'px' },
{ prop: 'buttonPosition.y', firstLevel: 'buttonPosition', secondLevel: 'x', label: this.$t('map.signalButtonPositionY'), type: 'number', placeholder: 'px' }, { prop: 'namePosition.y', firstLevel: 'namePosition', secondLevel: 'x', label: this.$t('map.signalNamePositionY'), type: 'number', placeholder: 'px' },
{ prop: 'guideShow', label: this.$t('map.signalGuideShow'), type: 'checkbox' }, { prop: 'buttonShow', label: this.$t('map.signalButtonShow'), type: 'checkbox' },
{ prop: 'guidePosition.x', firstLevel: 'guidePosition', secondLevel: 'x', label: this.$t('map.signalGuidePositionX'), type: 'number', placeholder: 'px' }, { prop: 'buttonPosition.x', firstLevel: 'buttonPosition', secondLevel: 'x', label: this.$t('map.signalButtonPositionX'), type: 'number', placeholder: 'px' },
{ prop: 'guidePosition.y', firstLevel: 'guidePosition', secondLevel: 'x', label: this.$t('map.signalGuidePositionY'), type: 'number', placeholder: 'px' } { prop: 'buttonPosition.y', firstLevel: 'buttonPosition', secondLevel: 'x', label: this.$t('map.signalButtonPositionY'), type: 'number', placeholder: 'px' },
] { prop: 'guideShow', label: this.$t('map.signalGuideShow'), type: 'checkbox' },
{ prop: 'guidePosition.x', firstLevel: 'guidePosition', secondLevel: 'x', label: this.$t('map.signalGuidePositionX'), type: 'number', placeholder: 'px' },
{ prop: 'guidePosition.y', firstLevel: 'guidePosition', secondLevel: 'x', label: this.$t('map.signalGuidePositionY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: []
}
}
}; };
return form; return form;
}, },

View File

@ -100,24 +100,33 @@ export default {
form() { form() {
const form = { const form = {
labelWidth: '150px', labelWidth: '150px',
items: [ items: {
{ prop: 'concentrateStationCode', label: this.$t('map.concentrateStationCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.stationList }, draw: {
{ prop: 'code', label: this.$t('map.stationCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.stationList, change: true, deviceChange: this.deviceChange }, name: '绘图数据',
{ prop: 'zcCode', label: this.$t('map.zcCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.zcList }, item: [
{ prop: 'centralized', label: this.$t('map.centralized'), type: 'checkbox' }, { prop: 'concentrateStationCode', label: this.$t('map.concentrateStationCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.stationList },
{ prop: 'name', label: this.$t('map.stationNameColon'), type: 'input' }, { prop: 'code', label: this.$t('map.stationCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.stationList, change: true, deviceChange: this.deviceChange },
{ prop: 'runPlanName', label: this.$t('map.stationRunPlanName'), type: 'input' }, { prop: 'zcCode', label: this.$t('map.zcCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.zcList },
{ prop: 'visible', label: this.$t('map.stationVisible'), type: 'checkbox' }, { prop: 'centralized', label: this.$t('map.centralized'), type: 'checkbox' },
{ prop: 'nameFont', label: this.$t('map.stationNameFont'), type: 'font', placeholder: this.$t('tip.stationFont') }, { prop: 'name', label: this.$t('map.stationNameColon'), type: 'input' },
{ prop: 'nameFontColor', label: this.$t('map.stationNameFontColor'), type: 'color' }, { prop: 'runPlanName', label: this.$t('map.stationRunPlanName'), type: 'input' },
{ prop: 'kmPostShow', label: this.$t('map.stationKmPostShow'), type: 'checkbox' }, { prop: 'visible', label: this.$t('map.stationVisible'), type: 'checkbox' },
{ prop: 'kmRange', label: this.$t('map.stationKmRange'), type: 'number', min: 0, placeholder: this.$t('tip.meter') }, { prop: 'nameFont', label: this.$t('map.stationNameFont'), type: 'font', placeholder: this.$t('tip.stationFont') },
{ prop: 'kmPost', label: this.$t('map.stationKmPost'), type: 'input' }, { prop: 'nameFontColor', label: this.$t('map.stationNameFontColor'), type: 'color' },
{ prop: 'kmPostFont', label: this.$t('map.stationKmPostFont'), type: 'font', placeholder: this.$t('tip.kilometerFont') }, { prop: 'kmPostShow', label: this.$t('map.stationKmPostShow'), type: 'checkbox' },
{ prop: 'kmPostFontColor', label: this.$t('map.stationKmPostFontColor'), type: 'color' }, { prop: 'kmRange', label: this.$t('map.stationKmRange'), type: 'number', min: 0, placeholder: this.$t('tip.meter') },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.stationPositionX'), type: 'number', placeholder: 'px' }, { prop: 'kmPost', label: this.$t('map.stationKmPost'), type: 'input' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.stationPositionY'), type: 'number', placeholder: 'px' } { prop: 'kmPostFont', label: this.$t('map.stationKmPostFont'), type: 'font', placeholder: this.$t('tip.kilometerFont') },
] { prop: 'kmPostFontColor', label: this.$t('map.stationKmPostFontColor'), type: 'color' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.stationPositionX'), type: 'number', placeholder: 'px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.stationPositionY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: []
}
}
}; };
return form; return form;
}, },

View File

@ -91,18 +91,27 @@ export default {
form() { form() {
const form = { const form = {
labelWidth: '160px', labelWidth: '160px',
items: [ items: {
{ prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList }, draw: {
{ prop: 'code', label: this.$t('map.stationControlCode'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.stationControlList, change: true, deviceChange: this.deviceChange }, name: '绘图数据',
{ prop: 'zcCode', label: this.$t('map.zcCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.zcList }, item: [
{ prop: 'name', label: this.$t('map.stationControlName'), type: 'input' }, { prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList },
{ prop: 'zokContent', label: this.$t('map.zokContent'), type: 'input' }, { prop: 'code', label: this.$t('map.stationControlCode'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.stationControlList, change: true, deviceChange: this.deviceChange },
{ prop: 'zakContent', label: this.$t('map.zakContent'), type: 'input' }, { prop: 'zcCode', label: this.$t('map.zcCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.zcList },
{ prop: 'jjzkContent', label: this.$t('map.jjzkContent'), type: 'input' }, { prop: 'name', label: this.$t('map.stationControlName'), type: 'input' },
{ prop: 'zzkContent', label: this.$t('map.zzkContent'), type: 'input' }, { prop: 'zokContent', label: this.$t('map.zokContent'), type: 'input' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.stationControlPositionX'), type: 'number', placeholder: 'px' }, { prop: 'zakContent', label: this.$t('map.zakContent'), type: 'input' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.stationControlPositionY'), type: 'number', placeholder: 'px' } { prop: 'jjzkContent', label: this.$t('map.jjzkContent'), type: 'input' },
] { prop: 'zzkContent', label: this.$t('map.zzkContent'), type: 'input' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.stationControlPositionX'), type: 'number', placeholder: 'px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.stationControlPositionY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: []
}
}
}; };
return form; return form;
}, },

View File

@ -121,21 +121,30 @@ export default {
form() { form() {
const form = { const form = {
labelWidth: '130px', labelWidth: '130px',
items: [ items: {
{ prop: 'deviceStationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.stationList }, draw: {
{ prop: 'code', label: this.$t('map.relStandCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.stationStandList, change: true, deviceChange: this.deviceChange }, name: '绘图数据',
{ prop: 'name', label: this.$t('map.stationstandNameColon'), type: 'input', disabled: true }, item: [
{ prop: 'stationCode', label: this.$t('map.belongsStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList }, { prop: 'deviceStationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.stationList },
{ prop: 'direction', label: this.$t('map.stationstandTopBottom'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.RunDirectionTypeList }, { prop: 'code', label: this.$t('map.relStandCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.stationStandList, change: true, deviceChange: this.deviceChange },
{ prop: 'visible', label: this.$t('map.stationVisible'), type: 'checkbox' }, { prop: 'name', label: this.$t('map.stationstandNameColon'), type: 'input', disabled: true },
{ prop: 'nameShow', label: this.$t('map.stationstandShowName'), type: 'checkbox' }, { prop: 'stationCode', label: this.$t('map.belongsStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList },
{ prop: 'doorLocationType', label: this.$t('map.stationstandDirection'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.DoorLocationTypeList }, { prop: 'direction', label: this.$t('map.stationstandTopBottom'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.RunDirectionTypeList },
{ prop: 'hasDoor', label: this.$t('map.stationstandHasDoor'), type: 'checkbox' }, { prop: 'visible', label: this.$t('map.stationVisible'), type: 'checkbox' },
{ prop: 'width', label: this.$t('map.stationstandWidth'), type: 'number', min: 0, max: 2000, placeholder: 'px' }, { prop: 'nameShow', label: this.$t('map.stationstandShowName'), type: 'checkbox' },
{ prop: 'height', label: this.$t('map.stationstandHeight'), type: 'number', min: 0, max: 2000, placeholder: 'px' }, { prop: 'doorLocationType', label: this.$t('map.stationstandDirection'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.DoorLocationTypeList },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.stationstandPositionX'), type: 'number', placeholder: 'px' }, { prop: 'hasDoor', label: this.$t('map.stationstandHasDoor'), type: 'checkbox' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.stationstandPositionY'), type: 'number', placeholder: 'px' } { prop: 'width', label: this.$t('map.stationstandWidth'), type: 'number', min: 0, max: 2000, placeholder: 'px' },
] { prop: 'height', label: this.$t('map.stationstandHeight'), type: 'number', min: 0, max: 2000, placeholder: 'px' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.stationstandPositionX'), type: 'number', placeholder: 'px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.stationstandPositionY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: []
}
}
}; };
return form; return form;
}, },

View File

@ -96,21 +96,32 @@ export default {
form() { form() {
const form = { const form = {
labelWidth: '170px', labelWidth: '170px',
items: [ items: {
{ prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList }, draw: {
{ prop: 'code', label: this.$t('map.switchCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.switchList, change: true, deviceChange: this.deviceChange }, name: '绘图数据',
{ prop: 'name', label: this.$t('map.switchName'), type: 'input' }, item: [
{ prop: 'nameShow', label: this.$t('map.switchShowName'), type: 'checkbox' }, { prop: 'stationCode', label: this.$t('map.equipmentStation'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.stationList },
{ prop: 'namePoint.x', firstLevel: 'namePoint', secondLevel: 'x', label: this.$t('map.switchPositionX'), type: 'number', placeholder: 'px' }, { prop: 'code', label: this.$t('map.switchCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.switchList, change: true, deviceChange: this.deviceChange },
{ prop: 'namePoint.y', firstLevel: 'namePoint', secondLevel: 'y', label: this.$t('map.switchPositionY'), type: 'number', placeholder: 'px' }, { prop: 'name', label: this.$t('map.switchName'), type: 'input' },
{ prop: 'turnTime', label: this.$t('map.turnTime'), type: 'number', min: 0, max: 1000, placeholder: 's' }, { prop: 'nameShow', label: this.$t('map.switchShowName'), type: 'checkbox' },
{ prop: 'timeoutShow', label: this.$t('map.timeoutShow'), type: 'checkbox' }, { prop: 'namePoint.x', firstLevel: 'namePoint', secondLevel: 'x', label: this.$t('map.switchPositionX'), type: 'number', placeholder: 'px' },
{ prop: 'sectionACode', label: this.$t('map.sectionACode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList }, { prop: 'namePoint.y', firstLevel: 'namePoint', secondLevel: 'y', label: this.$t('map.switchPositionY'), type: 'number', placeholder: 'px' },
{ prop: 'sectionBCode', label: this.$t('map.sectionBCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList }, { prop: 'turnTime', label: this.$t('map.turnTime'), type: 'number', min: 0, max: 1000, placeholder: 's' },
{ prop: 'sectionCCode', label: this.$t('map.sectionCCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList }, { prop: 'timeoutShow', label: this.$t('map.timeoutShow'), type: 'checkbox' },
{ prop: 'tp.x', firstLevel: 'tp', secondLevel: 'x', label: this.$t('map.switchTpX'), type: 'number', placeholder: 'px' }, { prop: 'sectionACode', label: this.$t('map.sectionACode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList },
{ prop: 'tp.y', firstLevel: 'tp', secondLevel: 'y', label: this.$t('map.switchTpY'), type: 'number', placeholder: 'px' } { prop: 'sectionBCode', label: this.$t('map.sectionBCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList },
] { prop: 'sectionCCode', label: this.$t('map.sectionCCode'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList },
{ prop: 'tp.x', firstLevel: 'tp', secondLevel: 'x', label: this.$t('map.switchTpX'), type: 'number', placeholder: 'px' },
{ prop: 'tp.y', firstLevel: 'tp', secondLevel: 'y', label: this.$t('map.switchTpY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '绘图数据',
item: [
]
}
}
}; };
return form; return form;
}, },

View File

@ -3,38 +3,7 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.property')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" label-width="110px" size="mini" :rules="rules"> <config-list ref="form" :form="form" :form-model="editModel" :rules="rules" />
<el-form-item :label="$t('map.textCode')" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in textList"
:key="item.code"
:label="item.code"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="$t('map.textContent')" prop="content">
<el-input v-model="editModel.content" :placeholder="$t('map.pleaseSelect')" class="input-with-select">
<el-select slot="prepend" v-model="editModel.prepend" :placeholder="$t('map.pleaseSelect')">
<el-option label="水平" value="H" />
<el-option label="垂直" value="V" />
</el-select>
</el-input>
</el-form-item>
<el-form-item :label="$t('map.textFont')" prop="font">
<el-font v-model="editModel.font" :placeholder="$t('map.font')" />
</el-form-item>
<el-form-item :label="$t('map.textFontColor')" prop="fontColor">
<el-color-picker v-model="editModel.fontColor" :predefine="skins" />
</el-form-item>
<el-form-item :label="$t('map.pointX')" prop="position.x">
<el-input-number v-model="editModel.position.x" />px
</el-form-item>
<el-form-item :label="$t('map.pointY')" prop="position.y">
<el-input-number v-model="editModel.position.y" />px
</el-form-item>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -71,12 +40,12 @@
<script> <script>
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ElFont from '@/views/components/font/index'; import ConfigList from './config/list';
export default { export default {
name: 'StationStandDraft', name: 'StationStandDraft',
components: { components: {
ElFont ConfigList
}, },
props: { props: {
selected: { selected: {
@ -142,7 +111,31 @@ export default {
'textList', 'textList',
'stationList', 'stationList',
'skinCode' 'skinCode'
]) ]),
form() {
const form = {
labelWidth: '130px',
items: {
draw: {
name: '绘图数据',
item: [
{ prop: 'code', label: this.$t('map.textCode'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.textList, change: true, deviceChange: this.deviceChange },
{ prop: 'content', label: this.$t('map.textContent'), type: 'fontContent', content: 'content', prepend: 'prepend', placeholder: this.$t('map.pleaseSelect') },
{ prop: 'font', label: this.$t('map.textFont'), type: 'font', placeholder: this.$t('map.font') },
{ prop: 'fontColor', label: this.$t('map.textFontColor'), type: 'color' },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: this.$t('map.pointX'), type: 'number', placeholder: 'px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: this.$t('map.pointY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: [
]
}
}
};
return form;
}
}, },
watch: { watch: {
selected: function (val, oldVal) { selected: function (val, oldVal) {

View File

@ -3,40 +3,7 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane class="view-control" :label="$t('map.property')" name="first"> <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<el-form ref="form" :model="editModel" label-width="120px" size="mini" :rules="rules"> <config-list ref="form" :form="form" :form-model="editModel" :rules="rules" />
<el-form-item :label="$t('map.trainWindowCode')" prop="code">
<el-select v-model="editModel.code" filterable @change="deviceChange">
<el-option
v-for="item in trainWindowList"
:key="item.code"
:label="item.code"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.trainWindowWidth')" prop="width">
<el-input-number v-model="editModel.width" :min="0" />px
</el-form-item>
<el-form-item :label="$t('map.trainWindowHeight')" prop="height">
<el-input-number v-model="editModel.height" :min="0" />px
</el-form-item>
<el-form-item :label="$t('map.trainWindowSectionCode')" prop="sectionCode">
<el-select v-model="editModel.sectionCode">
<el-option
v-for="item in filterSectionList"
:key="item.code"
:label="item.code + ' (' + item.name+ ')'"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('map.pointX')" prop="point.x">
<el-input-number v-model="editModel.point.x" />px
</el-form-item>
<el-form-item :label="$t('map.pointY')" prop="point.y">
<el-input-number v-model="editModel.point.y" />px
</el-form-item>
</el-form>
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft"> <el-button-group class="map-draft">
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button> <el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
@ -73,9 +40,13 @@
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import JTriangle from '@/jmap/utils/JTriangle'; import JTriangle from '@/jmap/utils/JTriangle';
import ConfigList from './config/list';
export default { export default {
name: 'TrainWindowDraft', name: 'TrainWindowDraft',
components: {
ConfigList
},
props: { props: {
selected: { selected: {
type: Object, type: Object,
@ -151,6 +122,30 @@ export default {
} }
return list; return list;
}, },
form() {
const form = {
labelWidth: '120px',
items: {
draw: {
name: '绘图数据',
item: [
{ prop: 'code', label: this.$t('map.trainWindowCode'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.trainWindowList, change: true, deviceChange: this.deviceChange },
{ prop: 'width', label: this.$t('map.trainWindowWidth'), type: 'number', min: 0, placeholder: 'px' },
{ prop: 'height', label: this.$t('map.trainWindowHeight'), type: 'number', min: 0, placeholder: 'px' },
{ prop: 'sectionCode', label: this.$t('map.trainWindowSectionCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.filterSectionList },
{ prop: 'point.x', firstLevel: 'point', secondLevel: 'x', label: this.$t('map.pointX'), type: 'number', placeholder: 'px' },
{ prop: 'point.y', firstLevel: 'point', secondLevel: 'y', label: this.$t('map.pointY'), type: 'number', placeholder: 'px' }
]
},
map: {
name: '地图数据',
item: [
]
}
}
};
return form;
},
style() { style() {
return this.$jlmap.style; return this.$jlmap.style;
} }

View File

@ -12,7 +12,7 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane class="view-control" :label="$t('map.operation')" name="second"> <el-tab-pane class="view-control" :label="$t('map.operation')" name="second">
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }"> <el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
<config-list ref="make" :form="formMake" :form-model="addModel" :rules="createRules" /> <config-data ref="make" :form="formMake" :form-model="addModel" :rules="createRules" />
</el-scrollbar> </el-scrollbar>
<el-button-group class="map-draft-group"> <el-button-group class="map-draft-group">
<el-button type="primary" @click="create">{{ $t('map.create') }}</el-button> <el-button type="primary" @click="create">{{ $t('map.create') }}</el-button>
@ -26,11 +26,13 @@
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import { getUID } from '@/jmap/utils/Uid'; import { getUID } from '@/jmap/utils/Uid';
import ConfigList from './config/list'; import ConfigList from './config/list';
import ConfigData from './config/data';
export default { export default {
name: 'ZcControlDraft', name: 'ZcControlDraft',
components: { components: {
ConfigList ConfigList,
ConfigData
}, },
props: { props: {
selected: { selected: {
@ -95,15 +97,24 @@ export default {
form() { form() {
const form = { const form = {
labelWidth: '150px', labelWidth: '150px',
items: [ items: {
{ prop: 'code', label: this.$t('map.zcCodeColon'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.zcList, change: true, deviceChange: this.deviceChange }, draw: {
{ prop: 'name', label: this.$t('map.statusSignalName'), type: 'input' }, name: '绘图数据',
{ prop: 'visible', label: this.$t('map.showZc'), type: 'checkboxx' }, item: [
{ prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), type: 'coordinate', width: '140px', children: [ { prop: 'code', label: this.$t('map.zcCodeColon'), type: 'select', optionLabel: 'code', optionValue: 'code', options: this.zcList, change: true, deviceChange: this.deviceChange },
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' }, { prop: 'name', label: this.$t('map.statusSignalName'), type: 'input' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' } { prop: 'visible', label: this.$t('map.showZc'), type: 'checkboxx' },
] } { prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), 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' }
] }
]
},
map: {
name: '地图数据',
item: []
}
}
}; };
return form; return form;
}, },

View File

@ -38,9 +38,9 @@
:edit-model="editModel" :edit-model="editModel"
:skin-code="skinCode" :skin-code="skinCode"
@refresh="refresh" @refresh="refresh"
@mapSelected="mapSelected"
@jlmap3d="jlmap3d" @jlmap3d="jlmap3d"
/> />
<!-- @mapSelected="mapSelected" -->
</el-card> </el-card>
</template> </template>
@ -48,7 +48,7 @@
<script> <script>
import { DeviceMenu } from '@/scripts/ConstDic'; import { DeviceMenu } from '@/scripts/ConstDic';
import { getMapTree, getMapDetail, postBuildMapImport } from '@/api/jmap/mapdraft'; import { getMapTree, getMapDetail, postBuildMapImport } from '@/api/jmap/mapdraft';
import { UrlConfig } from '@/router/index'; // import { UrlConfig } from '@/router/index';
import { translate, translateSheetTitle } from '@/scripts/translate'; import { translate, translateSheetTitle } from '@/scripts/translate';
import { sheet_to_json } from '@/utils/Export2Excel'; import { sheet_to_json } from '@/utils/Export2Excel';
// import PopMenu from '@/components/PopMenu'; // import PopMenu from '@/components/PopMenu';
@ -118,14 +118,14 @@ export default {
if (obj && obj.type == 'map') { if (obj && obj.type == 'map') {
this.editModel = obj; this.editModel = obj;
this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null }); this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null });
this.mapSelected({ view: 'draft' }); // this.mapSelected({ view: 'draft' });
}
},
mapSelected(data) {
if (data && this.editModel) {
this.$router.push({ path: `${UrlConfig.map.draft}/${this.editModel.id}/${data.view}`, query: { name: this.editModel.name } });
} }
}, },
// mapSelected(data) {
// if (data && this.editModel) {
// this.$router.push({ path: `${UrlConfig.map.draft}/${this.editModel.id}/${data.view}`, query: { name: this.editModel.name } });
// }
// },
jlmap3d() { jlmap3d() {
this.$router.push({ path: '/jlmap3d/edit', query: { mapid: this.editModel.id } }); this.$router.push({ path: '/jlmap3d/edit', query: { mapid: this.editModel.id } });
}, },

View File

@ -63,26 +63,6 @@ export default {
label: this.$t('map.deleteObj'), label: this.$t('map.deleteObj'),
handler: this.deleteObj handler: this.deleteObj
}, },
{
label: this.$t('map.editRoute'),
handler: this.editRoute
},
{
label: this.$t('map.editRouting'),
handler: this.editRouting
},
{
label: this.$t('map.editAutoRouting'),
handler: this.editAutoRouting
},
{
label: this.$t('map.setSwitch'),
handler: this.setSwitch
},
{
label: this.$t('map.pathUnit'),
handler: this.pathUnit
},
{ {
label: this.$t('map.jlmap3d'), label: this.$t('map.jlmap3d'),
handler: this.jlmap3d handler: this.jlmap3d
@ -176,21 +156,6 @@ export default {
}).catch(() => { }).catch(() => {
}); });
}, },
editRoute() {
this.$emit('mapSelected', { view: 'route' });
},
editRouting() {
this.$emit('mapSelected', { view: 'routing' });
},
editAutoRouting() {
this.$emit('mapSelected', { view: 'automatic' });
},
setSwitch() {
this.$emit('mapSelected', { view: 'swtich' });
},
pathUnit() {
this.$emit('mapSelected', { view: 'path' });
},
jlmap3d() { jlmap3d() {
this.$emit('jlmap3d'); this.$emit('jlmap3d');
}, },

View File

@ -196,9 +196,8 @@ export default {
overflow: hidden !important; overflow: hidden !important;
} }
.planEdit__tool .el-dialog { /* .planEdit__tool .el-dialog {
overflow: hidden !important; overflow: hidden !important;
/* background: rgba(0, 85, 231, 1);*/
background: rgba(202, 221, 253, 0.88);; background: rgba(202, 221, 253, 0.88);;
box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset; box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset;
border: 2px solid #727375; border: 2px solid #727375;
@ -489,5 +488,5 @@ export default {
.planEdit__tool .el-dialog .el-tree__empty-block { .planEdit__tool .el-dialog .el-tree__empty-block {
background: #E9E9E9 !important; background: #E9E9E9 !important;
color: #000 !important; color: #000 !important;
} } */
</style> </style>

View File

@ -125,11 +125,13 @@ export default {
props: { props: {
skinCode: { skinCode: {
type: String, type: String,
required: true default: ''
}, },
planConvert: { planConvert: {
type: Object, type: Object,
required: true default: function() {
return { };
}
} }
}, },
data() { data() {

View File

@ -115,7 +115,7 @@ export default {
.el-tree { .el-tree {
margin: 10px !important; margin: 10px !important;
background: #ECE9D8 !important; // background: #ECE9D8 !important;
} }
} }
</style> </style>