地图绘制代码调整

This commit is contained in:
joylink_cuiweidong 2020-12-14 16:53:43 +08:00
parent ef8cedb389
commit 89b635e24a
4 changed files with 79 additions and 99 deletions

View File

@ -154,17 +154,17 @@ export default {
}
}
.physical-view {
line-height: 25px;
height: 118px;
padding-left: 12px;
// .physical-view {
// line-height: 25px;
// height: 118px;
// padding-left: 12px;
.el-checkbox {
width: 70px;
margin: 0;
margin-right: 30px;
}
}
// .el-checkbox {
// width: 70px;
// margin: 0;
// margin-right: 30px;
// }
// }
/deep/ {
.map_card .el-tabs__header .el-tabs__item.is-active {
border-bottom-color: #f5f7fa;

View File

@ -699,17 +699,17 @@ export default {
}
}
.physical-view {
line-height: 25px;
height: 60px;
padding-left: 12px;
// .physical-view {
// line-height: 25px;
// height: 60px;
// padding-left: 12px;
.el-checkbox {
width: 70px;
margin: 0;
margin-right: 12px;
}
}
// .el-checkbox {
// width: 70px;
// margin: 0;
// margin-right: 12px;
// }
// }
.uploadDemo {
position: relative;

View File

@ -14,8 +14,8 @@
<el-tab-pane class="view-control" :label="$t('map.newConstruction')" name="second" :lazy="lazy">
<create-operate
ref="createForm"
:create-form="createForm"
:add-model="addModel"
:create-form="form"
:create-rules="rules"
@create="create"
/>
@ -81,9 +81,9 @@ export default {
labelWidth: '120px',
items: {
draw: {
name: this.$t('map.drawData'),
name: this.activeName == 'first' ? this.$t('map.drawData') : '',
item: [
{ prop: 'code', label: '箭头编码', type: 'select', optionLabel: 'code', optionValue: 'code', options: this.arrowList, deviceChange: this.deviceChange },
{ prop: 'code', label: '箭头编码', type: 'select', optionLabel: 'code', optionValue: 'code', options: this.arrowList, deviceChange: this.deviceChange, isHidden:this.activeName == 'second' },
{ prop: 'position', label: '坐标:', type: 'coordinate', width: '120px', children: [
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '25px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '25px' }
@ -99,29 +99,6 @@ export default {
}
};
return form;
},
createForm() {
const form = {
labelWidth: '120px',
items:{
all:{
name:'',
item: [
{ prop: 'position', label: '坐标:', type: 'coordinate', width: '120px', children: [
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '25px' },
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '25px' }
] },
{ prop: 'length', label: '长度:', type: 'number', min:1, placeholder: 'px'},
{ prop: 'lineWidth', label: this.$t('map.lineWidth'), type: 'number', min: 1, placeholder: 'px' },
{ prop: 'triangleLength', label: '三角长度:', type: 'number', min: 1, placeholder: 'px'},
{ prop: 'triangleHeight', label: '三角高度:', type: 'number', min: 1, placeholder: 'px'},
{ prop: 'color', label: '颜色', type: 'color' },
{ prop: 'showConditions', label: this.$t('map.showConditions'), type: 'radio', optionLabel: 'label', optionValue:'value', radioList: this.showConditionsList}
]
}
}
};
return form;
}
},
methods: {
@ -130,7 +107,8 @@ export default {
this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
},
deviceSelect(selected) {
this.$refs.form && this.$refs.form.resetFields();
// this.$refs.dataform && this.$refs.dataform.resetFields();
// this.editModel = getModel('Arrow');
this.$refs.createForm && this.$refs.createForm.resetFields();
if (selected && selected._type.toUpperCase() === 'Arrow'.toUpperCase()) {
this.activeName = 'first';
@ -139,6 +117,7 @@ export default {
},
clear() {
this.addModel = getModel('Arrow');
this.$refs.createForm && this.$refs.createForm.resetFields();
},
clearDeviceSelect() {
this.$emit('deviceSelect', '');

View File

@ -1,44 +1,42 @@
<template>
<transition name="el-zoom-in-center">
<div class="map-control">
<div class="border-card">
<div class="map-operate">
<div style="float: left;width: 280px;overflow: hidden;height: 17px;text-overflow: ellipsis;white-space: nowrap;">
<span>{{ $t('map.mapName') }}</span>
<el-tooltip class="item" effect="dark" :content="mapInfo.name" placement="top">
<b>{{ mapInfo.name }}</b>
</el-tooltip>
</div>
<el-button v-if="isSave" type="text" style="float: right; padding: 3px 0" :disabled="$attrs.mapSaveing" @click="saveMapEvent">{{ $t('map.save') }}</el-button>
<el-dropdown class="operate-button" trigger="click">
<span class="el-dropdown-link">数据操作</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item><span style="display:block;" :disabled="$attrs.mapSaveing" @click="verifyMapEvent">{{ $t('map.dataVerification') }}</span></el-dropdown-item>
<el-dropdown-item><span style="display:block;" :disabled="$attrs.mapSaveing" @click="generateCIEvent">生成联锁</span></el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-button type="text" class="operate-button" @click="dataRelation">{{ $t('map.advanced') }}</el-button>
<el-button type="text" class="operate-button" @click="showMap">绘图显隐</el-button>
<div class="map-operate">
<div class="draftMapName">
<span>{{ $t('map.mapName') }}</span>
<el-tooltip class="item" effect="dark" :content="mapInfo.name" placement="top">
<b>{{ mapInfo.name }}</b>
</el-tooltip>
</div>
<el-tabs v-show="projectType" v-model="enabledTab" class="mapEdit" type="card">
<el-tab-pane v-for="(each,index) in tabList" :key="index" :label="each.label" class="tab_pane_box" :name="each.name" :lazy="lazy">
<component
:is="each.menus"
:ref="each.name"
:selected="selected"
v-bind="$attrs"
v-on="$listeners"
@deviceSelect="deviceSelect"
/>
</el-tab-pane>
</el-tabs>
<template v-show="!projectType">
<split-screen
ref="splitScreen"
:selected="selected"
/>
</template>
<el-button type="text" class="operate-button" @click="showMap">绘图显隐</el-button>
<el-button type="text" class="operate-button" @click="dataRelation">{{ $t('map.advanced') }}</el-button>
<el-dropdown class="operate-button" trigger="click">
<span class="el-dropdown-link">数据操作</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item><span :disabled="$attrs.mapSaveing" @click="verifyMapEvent">{{ $t('map.dataVerification') }}</span></el-dropdown-item>
<el-dropdown-item><span :disabled="$attrs.mapSaveing" @click="generateCIEvent">生成联锁</span></el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-button v-if="isSave" type="text" style="padding: 3px 0" :disabled="$attrs.mapSaveing" @click="saveMapEvent">{{ $t('map.save') }}</el-button>
</div>
<el-tabs v-show="projectType" v-model="enabledTab" class="mapEdit" type="card">
<el-tab-pane v-for="(each,index) in tabList" :key="index" :label="each.label" class="tab_pane_box" :name="each.name" :lazy="lazy">
<component
:is="each.menus"
:ref="each.name"
:selected="selected"
v-bind="$attrs"
v-on="$listeners"
@deviceSelect="deviceSelect"
/>
</el-tab-pane>
</el-tabs>
<template v-show="!projectType">
<split-screen
ref="splitScreen"
:selected="selected"
/>
</template>
</div>
</transition>
</template>
@ -211,7 +209,13 @@ export default {
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.draftMapName{
width:280px;
overflow:hidden;
height:17px;
text-overflow:ellipsis;
white-space:nowrap;
}
.el-dropdown-link {
cursor: pointer;
color: #409EFF;
@ -222,32 +226,29 @@ export default {
.map-control {
width: 100%;
height: 100%;
.border-card{
height: 100%;
}
}
.operate-button{
float: right;
padding: 3px 0;
margin-right: 5px;
}
.physical-view {
line-height: 25px;
height: 118px;
padding-left: 12px;
// .physical-view {
// line-height: 25px;
// height: 118px;
// padding-left: 12px;
.el-checkbox {
width: 70px;
margin: 0;
margin-right: 30px;
}
}
// .el-checkbox {
// width: 70px;
// margin: 0;
// margin-right: 30px;
// }
// }
.map-operate{
height: 47px;
padding: 15px
padding: 15px;
display:flex;
}
.mapEdit{
height: calc(100% - 47px);