This commit is contained in:
yanran200730
2022-03-21 15:04:43 +08:00
parent d8e4916bbc
commit 19e3b730db
3 changed files with 151 additions and 139 deletions

View File

@@ -55,7 +55,6 @@ export default {
plugins: ['AMap.PlaceSearch', 'AMap.Marker', 'AMap.Geolocation'], plugins: ['AMap.PlaceSearch', 'AMap.Marker', 'AMap.Geolocation'],
}).then(AMap => { }).then(AMap => {
this.AMap = AMap this.AMap = AMap
console.log(this.latlng)
this.map = new AMap.Map('amap', { this.map = new AMap.Map('amap', {
zoom: 14, zoom: 14,
center: this.latlng ? [this.latlng.lng, this.latlng.lat] : '' center: this.latlng ? [this.latlng.lng, this.latlng.lat] : ''

View File

@@ -25,13 +25,14 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</ai-dialog> </ai-dialog>
<locate-dialog v-model="locate" :ins="instance" @confirm="v=>handleLocate(selected,v)"/> <locate-dialog v-model="locate" :ins="instance" :latlng="latlng" @confirm="v=>handleLocate(selected,v)"/>
<ai-area custom-clicker :input-clicker="false" v-model="selected.areaId" :instance="instance" ref="BindArea" <ai-area custom-clicker :input-clicker="false" v-model="selected.areaId" :hideLevel="disabledLevel" :instance="instance" ref="BindArea"
@change="handleSubmit(selected)"/> @change="handleSubmit(selected)"/>
</section> </section>
</template> </template>
<script> <script>
import { mapState } from 'vuex'
import DeviceSlider from "../components/deviceSlider"; import DeviceSlider from "../components/deviceSlider";
import LocateDialog from "../components/locateDialog"; import LocateDialog from "../components/locateDialog";
@@ -56,7 +57,9 @@ export default {
let per = this.splitOps.find(e => e.value == this.splitScreen)?.per || "100%" let per = this.splitOps.find(e => e.value == this.splitScreen)?.per || "100%"
return {width: per, height: per} return {width: per, height: per}
}, },
...mapState(['user'])
}, },
data() { data() {
return { return {
slider: true, slider: true,
@@ -65,12 +68,22 @@ export default {
monitors: [], monitors: [],
dialog: false, dialog: false,
locate: false, locate: false,
selected: {}, selected: {
areaId: ''
},
latlng: null,
disabledLevel: 0,
rules: { rules: {
name: [{required: true, message: "请填写 设备名称"}] name: [{required: true, message: "请填写 设备名称"}]
} }
} }
}, },
created () {
this.selected.areaId = this.user.info.areaId
this.disabledLevel = this.user.info.areaList.length
},
methods: { methods: {
handleFullscreen() { handleFullscreen() {
this.fullscreen = !this.fullscreen this.fullscreen = !this.fullscreen
@@ -119,7 +132,6 @@ export default {
<el-dropdown class="menuBtn" onCommand={e => this.handleSliderOption(e, data)}> <el-dropdown class="menuBtn" onCommand={e => this.handleSliderOption(e, data)}>
<i class="iconfont iconMore"/> <i class="iconfont iconMore"/>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="changeStatus">设为公开</el-dropdown-item>
<el-dropdown-item command="edit">修改名称</el-dropdown-item> <el-dropdown-item command="edit">修改名称</el-dropdown-item>
<el-dropdown-item command="area">行政地区</el-dropdown-item> <el-dropdown-item command="area">行政地区</el-dropdown-item>
<el-dropdown-item command="locate">地图标绘</el-dropdown-item> <el-dropdown-item command="locate">地图标绘</el-dropdown-item>
@@ -144,16 +156,11 @@ export default {
} else if (command == "area") {//绑定areaId } else if (command == "area") {//绑定areaId
this.$refs.BindArea?.chooseArea() this.$refs.BindArea?.chooseArea()
} else if (command == "locate") {//地图标绘 } else if (command == "locate") {//地图标绘
this.latlng = data.lat && data.lng ? {
lat: data.lat,
lng: data.lng
} : ''
this.locate = true this.locate = true
} else {
this.$confirm('确定设为公开?').then(() => {
console.log(data)
// this.instance.post(`/app/appeveryvillagecode/delete?ids=${this.selected.id}`).then(res => {
// if (res.code == 0) {
// this.getList()
// }
// })
})
} }
}, },
handleSubmit(row) { handleSubmit(row) {

View File

@@ -30,9 +30,7 @@ export default {
prop: "visible", prop: "visible",
event: "visible", event: "visible",
}, },
props: { props: ['latlng', 'visible'],
visible: Boolean
},
data() { data() {
return { return {
dialog: false, dialog: false,
@@ -57,13 +55,21 @@ export default {
plugins: ['AMap.PlaceSearch', 'AMap.Marker', 'AMap.Geolocation'], plugins: ['AMap.PlaceSearch', 'AMap.Marker', 'AMap.Geolocation'],
}).then(AMap => { }).then(AMap => {
this.AMap = AMap this.AMap = AMap
console.log(this.latlng)
this.map = new AMap.Map('amap', { this.map = new AMap.Map('amap', {
zoom: 14, zoom: 14,
center: this.latlng ? [this.latlng.lng, this.latlng.lat] : ''
}).on('click', res => { }).on('click', res => {
this.map.clearMap() this.map.clearMap()
this.selected = {location: res.lnglat} this.selected = {location: res.lnglat}
this.poi?.searchNearBy('', res.lnglat, 100) this.poi?.searchNearBy('', res.lnglat, 100)
}); });
if (this.latlng) {
let marker = new AMap.Marker({
position: [this.latlng.lng, this.latlng.lat]
})
this.map.add(marker)
}
this.poi = new AMap.PlaceSearch().on('complete', ({poiList}) => { this.poi = new AMap.PlaceSearch().on('complete', ({poiList}) => {
this.map.clearMap() this.map.clearMap()
if (poiList?.length > 0) { if (poiList?.length > 0) {