|
|
@@ -1,12 +1,12 @@
|
|
|
<template>
|
|
|
<div class="app-container">
|
|
|
- <div class="scoped-deal-box">
|
|
|
+ <div :class="isDbShow ? 'scoped-deal-box' : 'scoped-deal-box t2'">
|
|
|
<div class="sdb-info">
|
|
|
<div class="p1">当前缩放级别:{{mapDiyObj.zoom}}<span class="more" @click="setShowChange">{{isMapSetShow ? '收起设置' : '展开设置'}}></span></div>
|
|
|
<div class="p2" v-show="isMapSetShow">
|
|
|
<base-form ref="ruleForm" :data="formData" :is-inline="false" label-width="80px">
|
|
|
<div slot="footer">
|
|
|
- <el-button class="xl-form-btn bgc2" @click="setHandle">保存设置</el-button>
|
|
|
+ <el-button class="xl-form-btn bgc2" @click="setHandle">设置</el-button>
|
|
|
<div class="scoped-select-center" @click="setCenterHandle">中心坐标<div class="s">{{centerStr}}</div></div>
|
|
|
</div>
|
|
|
</base-form>
|
|
|
@@ -101,6 +101,7 @@ export default {
|
|
|
data() {
|
|
|
const that = this
|
|
|
return {
|
|
|
+ isDbShow: true,
|
|
|
isMapSetShow: false,
|
|
|
formData: [],
|
|
|
isMteShow: false,
|
|
|
@@ -283,15 +284,18 @@ export default {
|
|
|
mouseTool.marker({
|
|
|
content: ' ',
|
|
|
})
|
|
|
- window.setTimeout(() => {
|
|
|
- mouseTool.close(true)
|
|
|
- }, 1000)
|
|
|
+ that.isDbShow = false
|
|
|
+ that.$msgs('请在地图上选择中心点')
|
|
|
AMap.event.addListener(mouseTool,'draw',function(e){
|
|
|
let cPath = e.obj.getPosition()
|
|
|
let mapDiyObj = {...that.mapDiyObj}
|
|
|
mapDiyObj.center = [cPath.lng, cPath.lat]
|
|
|
that.mapDiyObj = {...mapDiyObj}
|
|
|
- that.$msg('中心坐标选取成功~')
|
|
|
+ that.$msg('中心坐标选取成功~如需重新选中心点，请再次点击中心坐标位置')
|
|
|
+ that.isDbShow = true
|
|
|
+ window.setTimeout(() => {
|
|
|
+ mouseTool.close(true)
|
|
|
+ }, 100)
|
|
|
})
|
|
|
},
|
|
|
saveHandle () {
|
|
|
@@ -347,12 +351,14 @@ export default {
|
|
|
fillColor: obj.fillColor || '#DC3021', // 填充色
|
|
|
fillOpacity: obj.fillOpacity || 0.3, // 填充透明度
|
|
|
strokeColor: obj.strokeColor || '#DC3021', // 轮廓颜色
|
|
|
- strokeWeight: 1, // 轮廓宽度
|
|
|
- strokeOpacity: 0.6, // 轮廓透明度
|
|
|
+ strokeWeight: 2, // 轮廓宽度
|
|
|
+ strokeOpacity: 0.9, // 轮廓透明度
|
|
|
text: obj.text,
|
|
|
})
|
|
|
that.polygons = [...polygons]
|
|
|
mouseTool.close(true)
|
|
|
+ that.isDbShow = true
|
|
|
+ console.log(that.isDbShow)
|
|
|
})
|
|
|
},
|
|
|
mapIsEdit (index, str) {
|
|
|
@@ -389,10 +395,10 @@ export default {
|
|
|
},
|
|
|
closeMte (obj, bcStr) {
|
|
|
this.isMteShow = false
|
|
|
- this.mteObj = {}
|
|
|
if (obj) {
|
|
|
if (bcStr && bcStr === 'edit') {
|
|
|
const index = this.mteObj.index || 0
|
|
|
+ console.log(this.mteObj)
|
|
|
const str = this.mteStr === 'textAdd' ? 'markerData' : 'polygons'
|
|
|
let tempData = [...this[str]]
|
|
|
if (this.mteStr === 'textAdd') {
|
|
|
@@ -410,7 +416,10 @@ export default {
|
|
|
} else {
|
|
|
this[this.mteStr](obj)
|
|
|
}
|
|
|
+ this.isDbShow = false
|
|
|
+ this.$msgs('请在地图上操作')
|
|
|
}
|
|
|
+ this.mteObj = {}
|
|
|
},
|
|
|
textAdd (obj) {
|
|
|
const that = this
|
|
|
@@ -419,9 +428,6 @@ export default {
|
|
|
mouseTool.marker({
|
|
|
content: ' ',
|
|
|
})
|
|
|
- window.setTimeout(() => {
|
|
|
- mouseTool.close(true)
|
|
|
- }, 1000)
|
|
|
AMap.event.addListener(mouseTool,'draw',function(e){
|
|
|
let cPath = e.obj.getPosition()
|
|
|
let markerData = [...that.markerData]
|
|
|
@@ -435,6 +441,10 @@ export default {
|
|
|
color: obj.color,
|
|
|
})
|
|
|
that.markerData = [...markerData]
|
|
|
+ window.setTimeout(() => {
|
|
|
+ mouseTool.close(true)
|
|
|
+ that.isDbShow = true
|
|
|
+ }, 100)
|
|
|
})
|
|
|
},
|
|
|
}
|
|
|
@@ -452,7 +462,7 @@ export default {
|
|
|
}
|
|
|
.scoped-deal-box {
|
|
|
background: #f2f2f2;
|
|
|
- box-shadow: 0 0 5px #ccc;
|
|
|
+ box-shadow: 0 0 5px #666;
|
|
|
position: absolute;
|
|
|
z-index: 999;
|
|
|
left: 0;
|
|
|
@@ -461,6 +471,9 @@ export default {
|
|
|
width: 220px;
|
|
|
overflow-y: auto;
|
|
|
overflow-x: hidden;
|
|
|
+ &.t2 {
|
|
|
+ opacity: 0.5;
|
|
|
+ }
|
|
|
.sdb-info {
|
|
|
background: #fff;
|
|
|
margin-bottom: 10px;
|
