From c2a697c7399dcfb3ebae5333f05f91f488d2cb41 Mon Sep 17 00:00:00 2001
From: Surpriseplus <845948745@qq.com>
Date: 星期二, 21 三月 2023 09:15:00 +0800
Subject: [PATCH] 项目管理修改，底图切换修改
---
src/components/ProjectOl.vue | 99 ++++++++++++++++++++++++++++++++++++++++++-------
1 files changed, 84 insertions(+), 15 deletions(-)
diff --git a/src/components/ProjectOl.vue b/src/components/ProjectOl.vue
index fe09cc0..73a955f 100644
--- a/src/components/ProjectOl.vue
+++ b/src/components/ProjectOl.vue
@@ -1,16 +1,44 @@
<template>
- <div id="mapView" class="projectBox">
+ <div
+ id="mapView"
+ class="projectBox"
+ >
<div class="Tools box_divm">
- <el-button
- type="success"
- icon="el-icon-plus"
- @click="drowPoint"
- ></el-button>
- <el-button
- type="danger"
- icon="el-icon-delete"
- @click="clearDrawPoint"
- ></el-button>
+ <el-form
+ :inline="true"
+ :model="formInline"
+ class="demo-form-inline"
+ >
+ <el-form-item :label="$t('dataManage.projectObj.longitude')">
+ {{formInline.lon}}
+ </el-form-item>
+ <el-form-item :label="$t('dataManage.projectObj.latitude')">
+ {{formInline.lat}}
+ </el-form-item>
+ <el-form-item :label="$t('dataManage.projectObj.country')">
+ {{formInline.country}}
+ </el-form-item>
+ <el-form-item :label="$t('dataManage.projectObj.province')">
+ {{formInline.province}}
+ </el-form-item>
+ <el-form-item :label="$t('dataManage.projectObj.county')">
+ {{formInline.location}}
+ </el-form-item>
+
+ <el-form-item>
+ <el-button
+ type="success"
+ icon="el-icon-plus"
+ @click="drowPoint"
+ ></el-button>
+ <el-button
+ type="danger"
+ icon="el-icon-delete"
+ @click="clearDrawPoint"
+ ></el-button>
+ </el-form-item>
+ </el-form>
+
</div>
</div>
</template>
@@ -27,12 +55,20 @@
import Feature from 'ol/Feature';
import { Circle as CircleStyle, Style, Fill, Stroke } from 'ol/style';
import { Point } from 'ol/geom';
+import { project_selectLocation } from '../api/api.js'
export default {
data() {
return {
mapol: null,
drawLayer: null,
draw: null,
+ formInline: {
+ lon: '',
+ lat: '',
+ location: '',
+ province: '',
+ country: ''
+ }
};
},
methods: {
@@ -60,7 +96,7 @@
.replace('POINT(', '')
.replace(')', '');
var a1 = value.split(' ');
- console.log(a1);
+ this.showLoacation(a1)
var a2 = transform(
[parseFloat(a1[0]), parseFloat(a1[1])],
'EPSG:4326',
@@ -90,6 +126,13 @@
this.mapol.removeLayer(this.drawLayer);
this.drawLayer = null;
this.$store.state.projeOl = null;
+ this.formInline = {
+ lon: '',
+ lat: '',
+ location: '',
+ province: '',
+ country: ''
+ }
}
},
@@ -114,12 +157,35 @@
let geom = feature.getGeometry();
var extent = geom.flatCoordinates;
var a1 = transform([extent[0], extent[1]], 'EPSG:3857', 'EPSG:4326');
-
+ this.showLoacation(a1)
this.$store.state.projeOl =
'POINT(' + a1[0].toFixed(6) + ' ' + a1[1].toFixed(6) + ')';
this.mapol.removeInteraction(this.draw);
});
},
+ async showLoacation(res) {
+ this.formInline.lon = res[0].toFixed(6);
+ this.formInline.lat = res[1].toFixed(6);
+ const data = await project_selectLocation({
+ x: res[0],
+ y: res[1],
+ });
+ if (data.code == 200) {
+ for (var i in data.result) {
+ var key = data.result[i].key;
+ var val = data.result[i].value;
+ if (key == "鍥�") {
+ this.formInline.country = val;
+ } else if (key == "鐪�") {
+ this.formInline.province = val;
+ } else if (key == "甯�") {
+ this.formInline.location = val;
+ }
+ }
+ }
+ }
+
+
},
mounted() {
this.initOlMap();
@@ -127,17 +193,20 @@
};
</script>
-<style>
+<style lang="less" scoped>
.projectBox {
width: 100%;
height: 100%;
overflow: hidden;
margin: 0;
padding: 0;
+ /deep/.el-form-item {
+ margin-bottom: 0px;
+ }
}
.Tools {
position: absolute;
-
+
opacity: 0.9;
z-index: 40;
padding: 10px;
--
Gitblit v1.9.3