地图绘制代码调整
This commit is contained in:
joylink_cuiweidong
parent
7ff599d49f
commit
98d55deb64
@ -124,7 +124,7 @@
|
||||
<div class="point-section">
|
||||
<template v-for="(point, index) in formModel[item.prop]">
|
||||
<div :key="index" style="overflow: hidden;">
|
||||
<span style="display: table; margin-right: 3px; font-size: 14px; float: left; line-height: 28px;">{{ index == 0 ? '(起点)' : index == formModel[item.prop].length - 1 ? '(终点)' : `(中点${index})` }}</span>
|
||||
<span v-if="!item.hiddenSpan" style="display: table; margin-right: 3px; font-size: 14px; float: left; line-height: 28px;">{{ index == 0 ? '(起点)' : index == formModel[item.prop].length - 1 ? '(终点)' : `(中点${index})` }}</span>
|
||||
<el-form-item
|
||||
:prop="'points[' + index + '].x'"
|
||||
style="display: table; float: left;"
|
||||
@ -307,7 +307,7 @@ export default {
|
||||
/deep/ {
|
||||
.el-icon-plus,
|
||||
.el-icon-minus {
|
||||
transform: translateY(-5px);
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -401,7 +401,7 @@ export default {
|
||||
/deep/ {
|
||||
.el-icon-plus,
|
||||
.el-icon-minus {
|
||||
transform: translateY(-5px);
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -13,69 +13,7 @@
|
||||
</el-tab-pane>
|
||||
<el-tab-pane class="view-control" :label="$t('map.newConstruction')" name="second" :lazy="lazy">
|
||||
<div class="view-control-content">
|
||||
<el-form ref="make" label-width="120px" :model="addModel" size="mini" :rules="makeRules">
|
||||
<el-form-item :label="$t('map.lineType')" prop="type">
|
||||
<el-select v-model="addModel.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="addModel.width" :min="1" />px
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('map.lineColor')" prop="lineColor">
|
||||
<el-color-picker v-model="addModel.lineColor" show-alpha />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('map.showConditions')" prop="showConditions">
|
||||
<el-radio-group v-model="addModel.showConditions">
|
||||
<el-radio v-for="each in showConditionsList" :key="each.value" :label="each.value">{{ each.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<div class="coordinate">
|
||||
<span class="title">{{ $t('map.linePoint') }}</span>
|
||||
<div class="point-section">
|
||||
<template v-for="(point, index) in addModel.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="addPointAddModel(index)"
|
||||
/>
|
||||
<el-button
|
||||
icon="el-icon-minus"
|
||||
:disabled="index == 0 || index == addModel.points.length - 1"
|
||||
circle
|
||||
class="point-button"
|
||||
@click="delPointAddModel(index)"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
<config-data ref="make" :form="createForm" :form-model="addModel" :rules="makeRules" />
|
||||
</div>
|
||||
<div class="button_box">
|
||||
<el-button-group class="map-draft-group">
|
||||
@ -92,12 +30,14 @@ import Cookies from 'js-cookie';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { getUID } from '@/jmapNew/utils/Uid';
|
||||
import ConfigList from './config/list';
|
||||
import ConfigData from './config/data';
|
||||
import { deepAssign } from '@/utils/index';
|
||||
|
||||
export default {
|
||||
name: 'StationStandDraft',
|
||||
components: {
|
||||
ConfigList
|
||||
ConfigList,
|
||||
ConfigData
|
||||
},
|
||||
props: {
|
||||
selected: {
|
||||
@ -194,6 +134,18 @@ export default {
|
||||
};
|
||||
return form;
|
||||
},
|
||||
createForm() {
|
||||
const form = {
|
||||
labelWidth: '120px',
|
||||
items: [
|
||||
{ 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: 'lineColor', label: this.$t('map.lineColor'), type: 'color' },
|
||||
{ prop: 'showConditions', label: this.$t('map.showConditions'), type: 'radio', optionLabel: 'label', optionValue:'value', radioList: this.showConditionsList},
|
||||
{ prop: 'points', label: this.$t('map.linePoint'), type: 'points', width: '100px', hiddenSpan:true, addPoint: this.addPointAddModel, delPoint: this.delPointAddModel }]
|
||||
};
|
||||
return form;
|
||||
},
|
||||
isPointsShow() {
|
||||
return this.editModel.points.length > 0;
|
||||
}
|
||||
|
||||
@ -13,56 +13,7 @@
|
||||
</el-tab-pane>
|
||||
<el-tab-pane class="view-control" :label="$t('map.newConstruction')" name="second" :lazy="lazy">
|
||||
<div class="view-control-content">
|
||||
<el-form ref="make" label-width="120px" :model="addModel" size="mini" :rules="makeRules">
|
||||
<el-form-item :label="$t('map.lineWidth')" prop="width">
|
||||
<el-input-number v-model="addModel.width" :min="1" />px
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('map.showConditions')" prop="showConditions">
|
||||
<el-radio-group v-model="addModel.showConditions">
|
||||
<el-radio v-for="each in showConditionsList" :key="each.value" :label="each.value">{{ each.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<div class="coordinate">
|
||||
<span class="title">{{ $t('map.linePoint') }}</span>
|
||||
<div class="point-section">
|
||||
<template v-for="(point, index) in addModel.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="addPointAddModel(index)"
|
||||
/>
|
||||
<el-button
|
||||
icon="el-icon-minus"
|
||||
:disabled="index == 0 || index == addModel.points.length - 1"
|
||||
circle
|
||||
class="point-button"
|
||||
@click="delPointAddModel(index)"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
<config-data ref="make" :form="createForm" :form-model="addModel" :rules="makeRules" />
|
||||
</div>
|
||||
<div class="button_box">
|
||||
<el-button-group class="map-draft-group">
|
||||
@ -79,12 +30,14 @@ import Cookies from 'js-cookie';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { getUID } from '@/jmapNew/utils/Uid';
|
||||
import ConfigList from './config/list';
|
||||
import ConfigData from './config/data';
|
||||
import { deepAssign } from '@/utils/index';
|
||||
|
||||
export default {
|
||||
name: 'StationStandDraft',
|
||||
components: {
|
||||
ConfigList
|
||||
ConfigList,
|
||||
ConfigData
|
||||
},
|
||||
props: {
|
||||
selected: {
|
||||
@ -176,6 +129,16 @@ export default {
|
||||
},
|
||||
isPointsShow() {
|
||||
return this.editModel.points.length > 0;
|
||||
},
|
||||
createForm() {
|
||||
const form = {
|
||||
labelWidth: '120px',
|
||||
items: [
|
||||
{ prop: 'width', label: this.$t('map.lineWidth'), type: 'number', min:1, placeholder: 'px'},
|
||||
{ prop: 'showConditions', label: this.$t('map.showConditions'), type: 'radio', optionLabel: 'label', optionValue:'value', radioList: this.showConditionsList},
|
||||
{ prop: 'points', label: this.$t('map.linePoint'), type: 'points', width: '100px', hiddenSpan:true, addPoint: this.addPointAddModel, delPoint: this.delPointAddModel }]
|
||||
};
|
||||
return form;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@ -242,7 +205,7 @@ export default {
|
||||
// 删除对象
|
||||
deleteObj() {
|
||||
const selected = this.$store.getters['map/getDeviceByCode'](this.editModel.code);
|
||||
if (selected && selected._type.toUpperCase() === 'Line'.toUpperCase()) {
|
||||
if (selected && selected._type.toUpperCase() === 'Power'.toUpperCase()) {
|
||||
this.$confirm(this.$t('tip.confirmDeletion'), this.$t('tip.hint'), {
|
||||
confirmButtonText: this.$t('tip.confirm'),
|
||||
cancelButtonText: this.$t('tip.cancel'),
|
||||
|
||||
@ -13,34 +13,7 @@
|
||||
</el-tab-pane>
|
||||
<el-tab-pane class="view-control" :label="$t('map.newConstruction')" name="second" :lazy="lazy">
|
||||
<div class="view-control-content">
|
||||
<el-form ref="make" label-width="140px" :model="addModel" :rules="createRules" size="mini">
|
||||
<el-form-item label="关联站台:" prop="standCode">
|
||||
<el-select v-model="addModel.standCode" filterable>
|
||||
<el-option
|
||||
v-for="item in stationStandList"
|
||||
:key="item.code"
|
||||
:label="item.name + ' (' + item.code+ ')'"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button
|
||||
:type="field === 'standSelectStationCode' ? 'danger' : 'primary'"
|
||||
size="small"
|
||||
@click="hover('standSelectStationCode')"
|
||||
>{{ $t('map.activate') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="屏蔽门宽度:" prop="width">
|
||||
<el-input-number v-model="addModel.width" style="width: 140px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="屏蔽门高度:" prop="height">
|
||||
<el-input-number v-model="addModel.height" style="width: 140px" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('map.stationstandDirection')" prop="doorLocationType">
|
||||
<el-radio-group v-model="addModel.doorLocationType">
|
||||
<el-radio v-for="item in DoorLocationTypeList" :key="item.code" :label="item.code" border>{{ item.name }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<config-data ref="make" :form="createForm" :form-model="addModel" :rules="createRules" />
|
||||
</div>
|
||||
<div class="button_box">
|
||||
<el-button-group class="map-draft-group">
|
||||
@ -70,12 +43,14 @@
|
||||
import { mapGetters } from 'vuex';
|
||||
import { getUID } from '@/jmapNew/utils/Uid';
|
||||
import ConfigList from './config/list';
|
||||
import ConfigData from './config/data';
|
||||
import { deepAssign } from '@/utils/index';
|
||||
|
||||
export default {
|
||||
name: 'PsdDraft',
|
||||
components: {
|
||||
ConfigList
|
||||
ConfigList,
|
||||
ConfigData
|
||||
},
|
||||
props: {
|
||||
selected: {
|
||||
@ -146,6 +121,21 @@ export default {
|
||||
}
|
||||
};
|
||||
},
|
||||
createForm() {
|
||||
const form = {
|
||||
labelWidth: '140px',
|
||||
items: [
|
||||
{ prop: 'standCode', label: '关联站台', type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', options: this.stationStandList, hover: this.hover, buttonType: 'standSelectStationCode', buttonShowType: this.isButtonType},
|
||||
{ prop: 'width', label: '屏蔽门宽度:', type: 'number', min:1, placeholder: 'px'},
|
||||
{ prop: 'height', label: '屏蔽门高度:', type: 'number', min:1, placeholder: 'px'},
|
||||
{ prop: 'doorLocationType', label: this.$t('map.stationstandDirection'), type: 'radio', optionLabel: 'label', optionValue:'value', radioList: this.DoorLocationTypeList}
|
||||
]
|
||||
};
|
||||
return form;
|
||||
},
|
||||
isButtonType() {
|
||||
return this.field == 'standSelectStationCode';
|
||||
},
|
||||
rules() {
|
||||
const rules = {
|
||||
code: [
|
||||
@ -185,8 +175,13 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
this.$Dictionary.doorLocationType().then(list => {
|
||||
this.DoorLocationTypeList = list;
|
||||
this.DoorLocationTypeList = [];
|
||||
list.forEach(item => {
|
||||
const param = { value: item.code, label: item.name };
|
||||
this.DoorLocationTypeList.push(param);
|
||||
});
|
||||
});
|
||||
|
||||
},
|
||||
methods: {
|
||||
deviceChange(code) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user