From 12ddd0c56375d9360a917a313b97de2613749bab Mon Sep 17 00:00:00 2001
From: hbao <ao@dubbo,vip>
Date: Fri, 18 Feb 2022 18:46:37 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=9C=B0=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/homesteadSurvey/town.js             |  54 +++
 src/api/homesteadSurvey/village.js          |  54 +++
 src/api/homesteadSurvey/zjdzd.js            |   8 +
 src/assets/images/housesteadSurvey/mark.png | Bin 0 -> 1769 bytes
 src/components/Map/MapGisDrawing.vue        | 380 +++++++++++++++++
 src/components/Map/MapGisLine.vue           | 381 +++++++++++++++++
 src/components/Map/MapGisTag.vue            | 437 ++++++++++++++++++++
 src/views/homestead/index.vue               |  20 +-
 src/views/homesteadSurvey/add.vue           |  39 +-
 9 files changed, 1357 insertions(+), 16 deletions(-)
 create mode 100644 src/api/homesteadSurvey/town.js
 create mode 100644 src/api/homesteadSurvey/village.js
 create mode 100644 src/assets/images/housesteadSurvey/mark.png
 create mode 100644 src/components/Map/MapGisDrawing.vue
 create mode 100644 src/components/Map/MapGisLine.vue
 create mode 100644 src/components/Map/MapGisTag.vue

diff --git a/src/api/homesteadSurvey/town.js b/src/api/homesteadSurvey/town.js
new file mode 100644
index 00000000..691ab268
--- /dev/null
+++ b/src/api/homesteadSurvey/town.js
@@ -0,0 +1,54 @@
+import request from '@/utils/request'
+
+// 查询镇边界列表
+export function listTown(query) {
+  return request({
+    url: '/houseSurvey/town/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出镇边界
+export function exportTown(query) {
+  return request({
+    url: '/houseSurvey/town/export',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询镇边界详细
+export function getTown(fid) {
+  return request({
+    url: '/houseSurvey/town/get/' + fid,
+    method: 'get'
+  })
+}
+
+// 新增镇边界
+export function addTown(data) {
+  return request({
+    url: '/houseSurvey/town/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改镇边界
+export function updateTown(data) {
+  return request({
+    url: '/houseSurvey/town/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除镇边界
+export function delTown(fid) {
+  return request({
+    url: '/houseSurvey/town/remove/' + fid,
+    method: 'get'
+  })
+}
+
diff --git a/src/api/homesteadSurvey/village.js b/src/api/homesteadSurvey/village.js
new file mode 100644
index 00000000..681ad814
--- /dev/null
+++ b/src/api/homesteadSurvey/village.js
@@ -0,0 +1,54 @@
+import request from '@/utils/request'
+
+// 查询村边界列表
+export function listVillage(query) {
+  return request({
+    url: '/houseSurvey/village/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出村边界
+export function exportVillage(query) {
+  return request({
+    url: '/houseSurvey/village/export',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询村边界详细
+export function getVillage(fid) {
+  return request({
+    url: '/houseSurvey/village/get/' + fid,
+    method: 'get'
+  })
+}
+
+// 新增村边界
+export function addVillage(data) {
+  return request({
+    url: '/houseSurvey/village/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改村边界
+export function updateVillage(data) {
+  return request({
+    url: '/houseSurvey/village/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除村边界
+export function delVillage(fid) {
+  return request({
+    url: '/houseSurvey/village/remove/' + fid,
+    method: 'get'
+  })
+}
+
diff --git a/src/api/homesteadSurvey/zjdzd.js b/src/api/homesteadSurvey/zjdzd.js
index 5f4259a9..26ef0607 100644
--- a/src/api/homesteadSurvey/zjdzd.js
+++ b/src/api/homesteadSurvey/zjdzd.js
@@ -69,3 +69,11 @@ export function uploadFile(data) {
     data: data
   })
 }
+
+//查询当前登录账号坐标
+export function getQueryLand() {
+  return request({
+    url: '/system/dept/get/current',
+    method: 'get'
+  })
+}
diff --git a/src/assets/images/housesteadSurvey/mark.png b/src/assets/images/housesteadSurvey/mark.png
new file mode 100644
index 0000000000000000000000000000000000000000..f5f29b0c15f4da567b805c837574805e26fef6d1
GIT binary patch
literal 1769
zcmaJ?X;2eq7~TP-a#{sJppY1}P>vix0*QohEMO|(22qQWV}StK4as5x208*QSca=g
ztuQExCm=9VWt1ZY+R9;7<j?}5U=_5MLjey^yP-h)qjYC>zhj=~d7t<F-f#9$puex4
zwy8D%0DA20U@$fsU@va1CiY$P?OZ)Jn4sPfXb2LG%D55;@DLz82+tOAW1wJ&D@ac4
zfLsAU-BK7Dfktrr7<@!T<f<@4xk!w$0l<|d7jyaX5Q^tPF+!M0m~2oI@InETu#?Im
zbHrXytZ;jZ1PV#<59O!C^XUQt%MI@;XJ7&%2<77Cq6ApVkTVI3x(sZt+9nb3ix4!P
zN%-4T1Sb&hg-9Sgl}NMaQ=DAz&U7M$=0tX++2I|?6gr9QLZUd@lPL@`jX`zBFFgb-
znnV!I2nKzYVqq&LAr?i&3=&BulM!W(L_`upqR{D>h6BmL!5%}{OOs)gE4PQGmdgqt
zB;`wlVpNF0c$FfTha{m)0_ODZ6hz_`Sy;MMCahp2Iaf@g5Xq{PmVq43|3gKh6|@u$
zhW_#UpTg46WHCevhNMW6gpVCuw52MPnBgUXxF{kCMUaH$Dh9?PC?btT#CQkH65e{J
z5EdXZ>1T@s4u`>pr6?EXLu`;qz$A!5p@2cAyEsxEs6JjkAcaEl_Vl26P`qf)E@Yac
z6UEcTVVMge{3H<sqsv^u3YSJ+m8<Fnkr;~%LK5MANZ=zuMEJ#=8N$`QfUD{)aRsY-
zp?a^%C1GYrs+0ZKNiT0<?W3Bm^ewhn>3j&r+FgS6wG;XER_wZb!3I4-<pVdu1G0<4
z3|V7C^H26Y(H+3~nf8*6uO0Sm=V)|SoXOc=tu~*L4VDkOcbIN6PKS4o!$uxp_b(jK
z<Kx1@K<%LNH6a<3^q0}Y^Aq&z58f#(k>*#qE~BkFM`g;%<MRz;ueN>Je0{<{KW;6v
zb^TKV;^tI#yR&1*hC(gn^VTdy;kw{5_B~N+0{?x-=!5CnTfwJr<Fq_D<dk{T-OW6f
z^ezigPcY2+DJCH(&tR-FDm1L+rRH8uhH?1JCRU~Sz@eSCCZA5u>hHEy)YvK-HMFSi
z$+bu4suiI9f@kZahrYe-Q5PG|pPhENp+BYmtPPmeRDNHai}N@>{y=w5?Qo)NLe~qM
znR^8fbv1_z@6(K<WA$(C5BfTZNW8rvw`f9NfBTNR<a)k;?{0VBLSFEKw$fi@QGT+x
zq=Q5rBt}f~@0iQo!X^oJTN*c}`sqhY5>k!1&IM^(s}S4prg{!=;>Qb#&v7Pzp8~L%
zPOHweXPHfBWgA`Xsu(@<ksSaw+PFIQjFoM$?tcvQ=ot(2JAY-i?Rb;Z{rq59rEjLr
zd{bkQW^A*`g`A?<35j-Y`j&B9AkxeR8s!!n4~()7P|B>1Wtr61cDXx_g+3XvF@P0?
z@is#Z??X;oy)lF5E|tzZ;fJdXYg+5_r__|LLesOgX%$uJpNENScU=+6yJ3YWGMQh_
z9<=I!3TKM%sf}BuoWNZ(dAy}g#@w9PmK~J+bY13x)M}VqP>^<rr!2N4K}TBX;*@+v
zhG^qKozhYBr`C^6s9*JgO$T*9=vKC^I~``Wmx&xzZ2NHenZ{tRY22QotoP+3Nh!NN
zSOZtKGBYe(m2sxY`LA|NDecY*-&t97{RyQut#3JUvy)SLuK5$FR4=~nvUkZ$N@HYt
z-_Mpo@HdA0p5>MI{Lrrme7&b8jc3$$KCQ~a&H82arP4q4w!6)i+^Gn+n!oB{dbOhG
z;z_W}df+xmou+d=^?r7EP2cc(QGRa+Z=odMH+#3z1D(v8??(Fkw~YkU^>+%byqa!L
ztv%M`<C!=7sG?WPfZ=I5+hP7jE7Ccx<xY2~(@klOCf_bkVlZUXPv`9$I+rQ-uW?E{
rqaQH3=dG-aH~H>GK5mdjlxb`Nc1fat56XFqQ~i9{-u_^<XH@!MsVuv&

literal 0
HcmV?d00001

diff --git a/src/components/Map/MapGisDrawing.vue b/src/components/Map/MapGisDrawing.vue
new file mode 100644
index 00000000..b34d017b
--- /dev/null
+++ b/src/components/Map/MapGisDrawing.vue
@@ -0,0 +1,380 @@
+<template>
+  <div>
+    <p class="fuTitle">地块位置绘制</p>
+    <div id="full-screen-acceptance" style="width: 100%;height:45vh;">
+        <div :id=this.uuidMap style="width: 100%;height: 100%"></div>
+        <div id='land-btn-wrap'>
+            <!--<el-button :id=this.drawingPolygonMap style="background-color:#D0EEFF;color:#1E88C7" @click="" type="primary">画图</el-button>-->
+            <!--<input id="drawRemove" type="button" class="ant-btn ant-btn-red" value="取消"/>&nbsp;&nbsp;-->
+            <!--<el-button :id=this.drawingPolygonMap style="background-color:#D0EEFF;color:#1E88C7" type="primary">重置图层</el-button>-->
+            <input :id="this.drawingPolygonMap" class="ant-btn ant-btn-red" type="button" value="画图"/>&nbsp;&nbsp;
+            <input :id="this.drawingResetMap" type="button" class="ant-btn ant-btn-red" value="重置图层"/>
+        </div>
+      </div>
+    <div id="info" style="display: none"></div>
+  </div>
+</template>
+
+<script>
+  import {getQueryLand} from "@/api/homesteadSurvey/zjdzd";
+import $ from "jquery";
+
+export default {
+  components: {
+    getQueryLand,
+  },
+  data() {
+    return {
+      closeMoule: null,
+      uuidMap: this.guidProduct(),
+      drawingPolygonMap: this.guidProduct(),
+      drawingResetMap: this.guidProduct(),
+    };
+  },
+  props: ['theGeom','message'],
+  // created() {
+  //   // setTimeout(() => {
+  //   //   this.drawingPaceCountryDarw();
+  //   // }, 100);
+  // },
+  methods: {
+    //地图加载
+    formSubmit(){
+       //父组件监听的名字必须是formSubmit
+      // 子组件调用父组件的方法并传参
+      if(this.closeMoule =="" || this.closeMoule == null){
+        this.$emit('formSubmit', null);
+      }else{
+        this.$emit('formSubmit', JSON.stringify(this.closeMoule));
+      }
+    },
+    guidProduct(){
+      return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = Math.random() * 16 | 0,
+          v = c == 'x' ? r : (r & 0x3 | 0x8);
+        return v.toString(16);
+      });
+    },
+    //地图查看
+    drawingPaceCountryDarw() {
+      //加载地图编辑
+      var that = this;
+      var map;
+      //var hc_land;
+      var draw; // global so we can remove it later
+      var vector_drawing;
+      if (that.message != null && that.message != ""
+        && that.message != undefined) {
+        document.getElementById(that.uuidMap).innerHTML = '';
+        var hc_land;
+        var hc_landFuther;
+        var draw; // global so we can remove it later
+        var vector_drawing;
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //加载地图
+        map = new ol.Map({
+          controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+          layers: [aerial, yingxzi],
+          projection: projection,
+          target: that.uuidMap,
+          view: new ol.View({
+            //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+            zoom: 15,
+            minZoom: 5, //地图缩小限制
+            maxZoom: 18.3, //地图放大限制
+          }),
+        });
+        //图层查询定位开始 ---------start
+        if(this.message.substring(0,1) =="{"){
+          // var theGeomMap =this.message.replace("Point", "MultiPolygon");
+          // var pointLeft = theGeomMap.replace("[", "[[[[");
+          // var pointRight = pointLeft.replace("]", "]]]]");
+          hc_land = new ol.layer.Vector({
+            title: "add Layer",
+            source: new ol.source.Vector({
+              projection: projection,
+              features: new ol.format.GeoJSON().readFeatures("{\n" +
+                "    \"type\": \"Feature\",\n" +
+                "    \"geometry\":" + this.message + "}"),
+            }),
+            style: new ol.style.Style({
+              fill: new ol.style.Fill({
+                //矢量图层填充颜色，以及透明度
+                color: "rgba(204, 255, 204,0.3)",
+              }),
+              stroke: new ol.style.Stroke({
+                //边界样式
+                color: "#47c68f",
+                width: 3,
+              }),
+            }),
+          });
+          map.addLayer(hc_land);
+          var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
+          var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
+          var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
+          var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
+          //定位查询位置
+          var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
+          map.getView().animate({
+            // 只设置需要的属性即可
+            center: center, // 中心点
+            zoom: 17.9, // 缩放级别
+            rotation: undefined, // 缩放完成view视图旋转弧度
+            duration: 1000, // 缩放持续时间，默认不需要设置
+          });
+        }
+        // if(this.message.substring(0,1) =="["){
+        //   var zbNew = JSON.stringify({"type": "MultiPolygon", "coordinates": [[[this.message.replaceAll("\"","")]]]});
+        //   var leftJoin = zbNew.replace("\"[","[");
+        //   var rightJoin = leftJoin.replace("\"]","]");
+        //   hc_landFuther = new ol.layer.Vector({
+        //     title: "add Layer",
+        //     source: new ol.source.Vector({
+        //       projection: projection,
+        //       features: new ol.format.GeoJSON().readFeatures("{\n" +
+        //         "    \"type\": \"Feature\",\n" +
+        //         "    \"geometry\":" + rightJoin + "}"),
+        //     }),
+        //     style: new ol.style.Style({
+        //       fill: new ol.style.Fill({
+        //         //矢量图层填充颜色，以及透明度
+        //         color: "rgba(204, 255, 204,0.3)",
+        //       }),
+        //       stroke: new ol.style.Stroke({
+        //         //边界样式
+        //         color: "#47c68f",
+        //         width: 3,
+        //       }),
+        //     }),
+        //   });
+        //   map.addLayer(hc_landFuther);
+        //   var maxXMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.maxX;
+        //   var maxYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.maxY;
+        //   var minXMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minX;
+        //   var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
+        //   //定位查询位置
+        //   var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
+        //   map.getView().animate({
+        //     // 只设置需要的属性即可
+        //     center: center, // 中心点
+        //     zoom: 17.9, // 缩放级别
+        //     rotation: undefined, // 缩放完成view视图旋转弧度
+        //     duration: 1000, // 缩放持续时间，默认不需要设置
+        //   });
+        // }
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#"+this.drawingPolygonMap).click(function () {
+          map.removeLayer(hc_land);
+          //map.removeLayer(hc_landFuther);
+          map.removeLayer(vector_drawing);
+          //that.closeMoule = null;
+          map.removeInteraction(draw);
+          //var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: new ol.source.Vector(),
+          });
+          map.addLayer(vector_drawing);
+
+          function addInteraction() {
+            draw = new ol.interaction.Draw({
+              source: vector_drawing.getSource(),
+              type: "Polygon"
+            });
+            draw.on('drawend', function (evt) {
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.closeMoule = coordinate;
+              that.formSubmit();
+            });
+            map.addInteraction(draw);
+          }
+
+          addInteraction();
+        });
+        //清除画图鼠标点击事件
+        // $("#drawRemove").click(function () {
+        //   //map.addLayer(hc_land);
+        //   map.removeInteraction(draw);
+        //   //map.removeLayer(vector_drawing);
+        // });
+        //还原之前图层
+        $("#"+this.drawingResetMap).click(function () {
+          if(that.closeMoule !=null) {
+            map.removeLayer(vector_drawing);
+            //map.removeLayer(hc_landFuther);
+            map.removeInteraction(draw);
+            map.addLayer(hc_land);
+            //map.addLayer(hc_landFuther);
+           // that.closeMoule = null;
+            that.formSubmit();
+          }
+        });
+      } else{
+        //this.closeMoule = null;
+        document.getElementById(that.uuidMap).innerHTML = '';
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //获取坐标是否存在
+        var Zb;
+        getQueryLand().then((response) => {
+          if (response.code == 200) {
+            let InsertCode = response.data;
+            if (InsertCode != null) {
+              var lat = InsertCode.lat;
+              var lng = InsertCode.lng;
+              if(lat !=null && lng !=null && lat !="" && lng !=""){
+                Zb = [lng,lat];
+              }else {
+                Zb =[115.452752, 31.789033];
+              }
+              //加载地图
+              map = new ol.Map({
+                controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+                layers: [aerial, yingxzi],
+                projection: projection,
+                logo: 'false',
+                target: that.uuidMap,
+                view: new ol.View({
+                  center: ol.proj.fromLonLat(Zb),
+                  //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+                  zoom: 16.9,
+                  minZoom: 5, //地图缩小限制
+                  maxZoom: 18, //地图放大限制
+                }),
+              });
+            }
+          }
+        });
+
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#"+this.drawingPolygonMap).click(function () {
+          //that.closeMoule = null;
+          map.removeInteraction(draw);
+          //var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: new ol.source.Vector(),
+          });
+          map.addLayer(vector_drawing);
+
+          function addInteraction() {
+            draw = new ol.interaction.Draw({
+              source: vector_drawing.getSource(),
+              type: "Polygon"
+            });
+            draw.on('drawend', function (evt) {
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.closeMoule = coordinate;
+              that.formSubmit();
+            });
+            map.addInteraction(draw);
+          }
+
+          addInteraction();
+
+        });
+        //清除画图鼠标点击事件
+        // $("#drawRemove").click(function () {
+        //   //map.addLayer(hc_land);
+        //   map.removeInteraction(draw);
+        //   //map.removeLayer(vector_drawing);
+        // });
+        //还原之前图层
+        $("#"+this.drawingResetMap).click(function () {
+          map.removeInteraction(draw);
+          map.removeLayer(vector_drawing);
+          //that.closeMoule = null;
+          that.formSubmit();
+        });
+      }
+    },
+  },
+  watch: {},
+};
+</script>
+
+<style scoped>
+#that.message {
+  width: 100%;
+  height: 100%;
+}
+.fuTitle {
+  border-top: 1px solid #e9e9e9;
+  text-align: center;
+  padding: 10px 0px 0px 0px;
+  font-size: 36px;
+  color: #999;
+}
+.ant-btn-red {
+  position: relative;
+  display: inline-block;
+  background: #D0EEFF;
+  border: 1px solid #99D3F5;
+  border-radius: 4px;
+  padding: 4px 12px;
+  overflow: hidden;
+  color: #1E88C7;
+  text-decoration: none;
+  text-indent: 0;
+  line-height: 20px;
+
+}
+#land-btn-wrap{
+  position: relative;
+  width: 25%;
+  left: 75%;
+  bottom: 100%;
+  z-index: 2000;
+  padding-top: 5%;
+}
+</style>
diff --git a/src/components/Map/MapGisLine.vue b/src/components/Map/MapGisLine.vue
new file mode 100644
index 00000000..ed8ca783
--- /dev/null
+++ b/src/components/Map/MapGisLine.vue
@@ -0,0 +1,381 @@
+<template>
+  <div>
+    <p class="fuTitle">地块位置绘制</p>
+    <div id="full-screen-acceptance" style="width: 100%;height:45vh;">
+        <div :id=this.uuidMap style="width: 100%;height: 100%"></div>
+        <div id='land-btn-wrap'>
+          <el-row>
+            <!--<el-button :id=this.drawingPolygonMap style="background-color:#D0EEFF;color:#1E88C7" @click="" type="primary">画图</el-button>-->
+            <!--<input id="drawRemove" type="button" class="ant-btn ant-btn-red" value="取消"/>&nbsp;&nbsp;-->
+            <!--<el-button :id=this.drawingPolygonMap style="background-color:#D0EEFF;color:#1E88C7" type="primary">重置图层</el-button>-->
+            <input :id="this.drawingPolygonMap" class="ant-btn ant-btn-red" type="button" value="画图"/>&nbsp;&nbsp;
+            <input :id="this.drawingResetMap" type="button" class="ant-btn ant-btn-red" value="重置图层"/>
+          </el-row>
+        </div>
+      </div>
+    <div id="info" style="display: none"></div>
+  </div>
+</template>
+
+<script>
+  import {getQueryLand} from "@/api/homesteadSurvey/zjdzd";
+import $ from "jquery";
+
+export default {
+  components: {
+    getQueryLand,
+  },
+  data() {
+    return {
+      closeMoule: null,
+      uuidMap: this.guidProduct(),
+      drawingPolygonMap: this.guidProduct(),
+      drawingResetMap: this.guidProduct(),
+    };
+  },
+  props: ['theGeom','message'],
+  // created() {
+  //   // setTimeout(() => {
+  //   //   this.drawingPaceCountryLine();
+  //   // }, 100);
+  // },
+  methods: {
+    //地图加载
+    formSubmit(){
+       //父组件监听的名字必须是formSubmit
+      // 子组件调用父组件的方法并传参
+      if(this.closeMoule =="" || this.closeMoule == null){
+        this.$emit('formSubmit', null);
+      }else{
+        this.$emit('formSubmit', JSON.stringify(this.closeMoule));
+      }
+    },
+    guidProduct(){
+      return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = Math.random() * 16 | 0,
+          v = c == 'x' ? r : (r & 0x3 | 0x8);
+        return v.toString(16);
+      });
+    },
+    //地图查看
+    drawingPaceCountryLine() {
+      //加载地图编辑
+      var that = this;
+      var map;
+      //var hc_land;
+      var draw; // global so we can remove it later
+      var vector_drawing;
+      if (that.message != null && that.message != ""
+        && that.message != undefined) {
+        document.getElementById(that.uuidMap).innerHTML = '';
+        var hc_land;
+        var hc_landFuther;
+        var draw; // global so we can remove it later
+        var vector_drawing;
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //加载地图
+        map = new ol.Map({
+          controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+          layers: [aerial, yingxzi],
+          projection: projection,
+          target: that.uuidMap,
+          view: new ol.View({
+            //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+            zoom: 15,
+            minZoom: 5, //地图缩小限制
+            maxZoom: 18.3, //地图放大限制
+          }),
+        });
+        //图层查询定位开始 ---------start
+        if(this.message.substring(0,1) =="{"){
+          // var theGeomMap =this.message.replace("Point", "MultiPolygon");
+          // var pointLeft = theGeomMap.replace("[", "[[[[");
+          // var pointRight = pointLeft.replace("]", "]]]]");
+          hc_land = new ol.layer.Vector({
+            title: "add Layer",
+            source: new ol.source.Vector({
+              projection: projection,
+              features: new ol.format.GeoJSON().readFeatures("{\n" +
+                "    \"type\": \"Feature\",\n" +
+                "    \"geometry\":" + this.message + "}"),
+            }),
+            style: new ol.style.Style({
+              fill: new ol.style.Fill({
+                //矢量图层填充颜色，以及透明度
+                color: "rgba(204, 255, 204,0.3)",
+              }),
+              stroke: new ol.style.Stroke({
+                //边界样式
+                color: "#47c68f",
+                width: 3,
+              }),
+            }),
+          });
+          map.addLayer(hc_land);
+          var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
+          var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
+          var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
+          var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
+          //定位查询位置
+          var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
+          map.getView().animate({
+            // 只设置需要的属性即可
+            center: center, // 中心点
+            zoom: 17.9, // 缩放级别
+            rotation: undefined, // 缩放完成view视图旋转弧度
+            duration: 1000, // 缩放持续时间，默认不需要设置
+          });
+        }
+        // if(this.message.substring(0,1) =="["){
+        //   var zbNew = JSON.stringify({"type": "MultiPolygon", "coordinates": [[[this.message.replaceAll("\"","")]]]});
+        //   var leftJoin = zbNew.replace("\"[","[");
+        //   var rightJoin = leftJoin.replace("\"]","]");
+        //   hc_landFuther = new ol.layer.Vector({
+        //     title: "add Layer",
+        //     source: new ol.source.Vector({
+        //       projection: projection,
+        //       features: new ol.format.GeoJSON().readFeatures("{\n" +
+        //         "    \"type\": \"Feature\",\n" +
+        //         "    \"geometry\":" + rightJoin + "}"),
+        //     }),
+        //     style: new ol.style.Style({
+        //       fill: new ol.style.Fill({
+        //         //矢量图层填充颜色，以及透明度
+        //         color: "rgba(204, 255, 204,0.3)",
+        //       }),
+        //       stroke: new ol.style.Stroke({
+        //         //边界样式
+        //         color: "#47c68f",
+        //         width: 3,
+        //       }),
+        //     }),
+        //   });
+        //   map.addLayer(hc_landFuther);
+        //   var maxXMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.maxX;
+        //   var maxYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.maxY;
+        //   var minXMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minX;
+        //   var minYMap = hc_landFuther.values_.source.featuresRtree_.rbush_.data.minY;
+        //   //定位查询位置
+        //   var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
+        //   map.getView().animate({
+        //     // 只设置需要的属性即可
+        //     center: center, // 中心点
+        //     zoom: 17.9, // 缩放级别
+        //     rotation: undefined, // 缩放完成view视图旋转弧度
+        //     duration: 1000, // 缩放持续时间，默认不需要设置
+        //   });
+        // }
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#"+this.drawingPolygonMap).click(function () {
+          map.removeLayer(hc_land);
+          //map.removeLayer(hc_landFuther);
+          map.removeLayer(vector_drawing);
+          //that.closeMoule = null;
+          map.removeInteraction(draw);
+          //var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: new ol.source.Vector(),
+          });
+          map.addLayer(vector_drawing);
+
+          function addInteraction() {
+            draw = new ol.interaction.Draw({
+              source: vector_drawing.getSource(),
+              type: "Polygon"
+            });
+            draw.on('drawend', function (evt) {
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.closeMoule = coordinate;
+              that.formSubmit();
+            });
+            map.addInteraction(draw);
+          }
+
+          addInteraction();
+        });
+        //清除画图鼠标点击事件
+        // $("#drawRemove").click(function () {
+        //   //map.addLayer(hc_land);
+        //   map.removeInteraction(draw);
+        //   //map.removeLayer(vector_drawing);
+        // });
+        //还原之前图层
+        $("#"+this.drawingResetMap).click(function () {
+          if(that.closeMoule !=null) {
+            map.removeLayer(vector_drawing);
+            //map.removeLayer(hc_landFuther);
+            map.removeInteraction(draw);
+            map.addLayer(hc_land);
+            //map.addLayer(hc_landFuther);
+           // that.closeMoule = null;
+            that.formSubmit();
+          }
+        });
+      } else{
+        //this.closeMoule = null;
+        document.getElementById(that.uuidMap).innerHTML = '';
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //获取坐标是否存在
+        var Zb;
+        getQueryLand().then((response) => {
+          if (response.code == 200) {
+            let InsertCode = response.data;
+            if (InsertCode != null) {
+              var lat = InsertCode.lat;
+              var lng = InsertCode.lng;
+              if(lat !=null && lng !=null && lat !="" && lng !=""){
+                Zb = [lng,lat];
+              }else {
+                Zb =[115.452752, 31.789033];
+              }
+              //加载地图
+              map = new ol.Map({
+                controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+                layers: [aerial, yingxzi],
+                projection: projection,
+                logo: 'false',
+                target: that.uuidMap,
+                view: new ol.View({
+                  center: ol.proj.fromLonLat(Zb),
+                  //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+                  zoom: 16.9,
+                  minZoom: 5, //地图缩小限制
+                  maxZoom: 18, //地图放大限制
+                }),
+              });
+            }
+          }
+        });
+
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#"+this.drawingPolygonMap).click(function () {
+          //that.closeMoule = null;
+          map.removeInteraction(draw);
+          //var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: new ol.source.Vector(),
+          });
+          map.addLayer(vector_drawing);
+
+          function addInteraction() {
+            draw = new ol.interaction.Draw({
+              source: vector_drawing.getSource(),
+              type: "Polygon"
+            });
+            draw.on('drawend', function (evt) {
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.closeMoule = coordinate;
+              that.formSubmit();
+            });
+            map.addInteraction(draw);
+          }
+
+          addInteraction();
+
+        });
+        //清除画图鼠标点击事件
+        // $("#drawRemove").click(function () {
+        //   //map.addLayer(hc_land);
+        //   map.removeInteraction(draw);
+        //   //map.removeLayer(vector_drawing);
+        // });
+        //还原之前图层
+        $("#"+this.drawingResetMap).click(function () {
+          map.removeInteraction(draw);
+          map.removeLayer(vector_drawing);
+          //that.closeMoule = null;
+          that.formSubmit();
+        });
+      }
+    },
+  },
+  watch: {},
+};
+</script>
+
+<style scoped>
+#that.message {
+  width: 100%;
+  height: 100%;
+}
+.fuTitle {
+  border-top: 1px solid #e9e9e9;
+  text-align: center;
+  padding: 10px 0px 0px 0px;
+  font-size: 18px;
+  color: #999;
+}
+.ant-btn-red {
+  position: relative;
+  display: inline-block;
+  background: #D0EEFF;
+  border: 1px solid #99D3F5;
+  border-radius: 4px;
+  padding: 4px 12px;
+  overflow: hidden;
+  color: #1E88C7;
+  text-decoration: none;
+  text-indent: 0;
+  line-height: 20px;
+}
+#land-btn-wrap{
+  position: relative;
+  width: 25%;
+  left: 75%;
+  bottom: 100%;
+  z-index: 2000;
+  padding-top: 5%;
+}
+</style>
diff --git a/src/components/Map/MapGisTag.vue b/src/components/Map/MapGisTag.vue
new file mode 100644
index 00000000..e459f178
--- /dev/null
+++ b/src/components/Map/MapGisTag.vue
@@ -0,0 +1,437 @@
+<template>
+  <div>
+    <p class="fuTitle">地块位置绘制</p>
+    <div id="full-screen-acceptance" style="width: 100%;height:45vh;">
+        <div :id=this.uuidMap style="width: 100%;height: 100%"></div>
+        <div id='land-btn-wrap'>
+          <el-row>
+            <input :id="this.drawPolygonMap" class="ant-btn ant-btn-red" type="button" value="标记"/>&nbsp;&nbsp;
+            <!--<input id="drawRemove" type="button" class="ant-btn ant-btn-red" value="取消"/>&nbsp;&nbsp;-->
+            <input :id="this.drawResetMap" type="button" class="ant-btn ant-btn-red" value="重置标记"/>
+          </el-row>
+        </div>
+      </div>
+    <div id="info" style="display: none"></div>
+  </div>
+</template>
+
+<script>
+  import {getQueryLand} from "@/api/homesteadSurvey/zjdzd";
+import $ from "jquery";
+
+export default {
+  components: {
+    getQueryLand,
+  },
+  data() {
+    return {
+      closeMoule: null,
+      reduction: null,
+      uuidMap: this.guidProduct(),
+      drawPolygonMap: this.guidProduct(),
+      drawResetMap: this.guidProduct(),
+    };
+  },
+  props: ['theGeom','message'],
+  methods: {
+    //地图加载
+    formSubmit(){
+       //父组件监听的名字必须是formSubmit
+      // 子组件调用父组件的方法并传参
+      if(this.closeMoule =="" || this.closeMoule == null){
+        this.$emit('formSubmit', null);
+      }else{
+        this.$emit('formSubmit', JSON.stringify(this.closeMoule));
+      }
+    },
+    guidProduct(){
+      return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = Math.random() * 16 | 0,
+          v = c == 'x' ? r : (r & 0x3 | 0x8);
+        return v.toString(16);
+      });
+    },
+    //地图查看
+    pointPaceCountryDarw() {
+      //加载地图编辑
+      var that = this;
+      var map;
+      //var hc_land;
+      var draw; // global so we can remove it later
+      var vector_drawing;
+      //矢量标注样式设置函数，设置image为图标ol.style.Icon
+      function createLabelStyle() {
+        return new ol.style.Style({
+          image: new ol.style.Icon({
+            //设置图标偏移
+            anchor: [0.5, 1],
+            //标注样式的起点位置
+            anchorOrigin: "top-right",
+            //X方向单位：分数
+            anchorXUnits: "fraction",
+            //Y方向单位：像素
+            anchorYUnits: "pixels",
+            //偏移起点位置的方向
+            offsetOrigin: "top-right",
+            //透明度
+            opacity: 0.9,
+            //图片路径
+            src: require("../../assets/images/housesteadSurvey/mark.png"),
+          }),
+          text: new ol.style.Text({
+            textAlign: "center", //位置
+            textBaseline: "middle", //基准线
+            font: "normal 12px 微软雅黑", //文字样式
+            //text: "标注点", //文本内容
+            fill: new ol.style.Fill({
+              //文本填充样式（即文字颜色)
+              color: "#ff0000",
+            }),
+          }),
+          zIndex: 9999,
+        });
+      }
+      if (that.message != null && that.message != ""
+        && that.message != undefined) {
+        this.closeMoule = null;
+        document.getElementById(that.uuidMap).innerHTML = '';
+        var hc_land;
+        var draw; // global so we can remove it later
+        var vector_drawing;
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //加载地图
+        map = new ol.Map({
+          controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+          layers: [aerial, yingxzi],
+          projection: projection,
+          target: that.uuidMap,
+          view: new ol.View({
+            //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+            zoom: 15.9,
+            minZoom: 5, //地图缩小限制
+            maxZoom: 18.3, //地图放大限制
+          }),
+        });
+        //图层查询定位开始 ---------start
+        if(this.message.substring(0,1) =="{"){
+          var theGeomMap =this.message.replace("Point", "MultiPolygon");
+          var pointLeft = theGeomMap.replace("[", "[[[[");
+          var pointRight = pointLeft.replace("]", "]]]]");
+          hc_land = new ol.layer.Vector({
+            title: "add Layer",
+            source: new ol.source.Vector({
+              projection: projection,
+              features: new ol.format.GeoJSON().readFeatures("{\n" +
+                "    \"type\": \"Feature\",\n" +
+                "    \"geometry\":" + pointRight + "}"),
+            }),
+            style: new ol.style.Style({
+              fill: new ol.style.Fill({
+                //矢量图层填充颜色，以及透明度
+                color: "rgba(204, 255, 204,0.3)",
+              }),
+              stroke: new ol.style.Stroke({
+                //边界样式
+                color: "#47c68f",
+                width: 3,
+              }),
+            }),
+          });
+        }
+        if(this.message.substring(0,1) =="["){
+          var zbNew = JSON.stringify({"type": "MultiPolygon", "coordinates": [[[this.message.replaceAll("\"","")]]]});
+          var leftJoin = zbNew.replace("\"[","[");
+          var rightJoin = leftJoin.replace("\"]","]");
+          hc_land = new ol.layer.Vector({
+            title: "add Layer",
+            source: new ol.source.Vector({
+              projection: projection,
+              features: new ol.format.GeoJSON().readFeatures("{\n" +
+                "    \"type\": \"Feature\",\n" +
+                "    \"geometry\":" + rightJoin + "}"),
+            }),
+            style: new ol.style.Style({
+              fill: new ol.style.Fill({
+                //矢量图层填充颜色，以及透明度
+                color: "rgba(204, 255, 204,0.3)",
+              }),
+              stroke: new ol.style.Stroke({
+                //边界样式
+                color: "#47c68f",
+                width: 3,
+              }),
+            }),
+          });
+        }
+        map.addLayer(hc_land);
+        var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
+        var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
+        var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
+        var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
+        //定位查询位置
+        var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
+        var newcenterFeature = new ol.Feature({
+          geometry: new ol.geom.Point(center), //几何信息
+          name: "标注点",
+        });
+        var sourceMapLook = new ol.source.Vector({wrapX: false});
+        vector_drawing = new ol.layer.Vector({
+          source: sourceMapLook,
+        });
+        map.addLayer(vector_drawing);
+        newcenterFeature.setStyle(createLabelStyle()); //设置要素样式
+        sourceMapLook.addFeature(newcenterFeature);
+        map.getView().animate({
+          // 只设置需要的属性即可
+          center: center, // 中心点
+          zoom: 15.9, // 缩放级别
+          rotation: undefined, // 缩放完成view视图旋转弧度
+          duration: 1000, // 缩放持续时间，默认不需要设置
+        });
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#"+this.drawPolygonMap).click(function () {
+          map.removeLayer(hc_land);
+          map.removeLayer(vector_drawing);
+          that.closeMoule = null;
+          var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: source,
+          });
+          map.addLayer(vector_drawing);
+
+          function addInteraction() {
+            draw = new ol.interaction.Draw({
+              source: vector_drawing.getSource(),
+              type: "Point",
+            });
+            draw.on('drawend', function (evt) {
+              map.removeInteraction(draw);
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              var newFeature = new ol.Feature({
+                geometry: new ol.geom.Point(coordinate), //几何信息
+                //name: "标注点",
+              });
+              newFeature.setStyle(createLabelStyle()); //设置要素样式
+              source.addFeature(newFeature);
+              that.closeMoule = coordinate;
+              that.reduction = coordinate;
+              that.formSubmit();
+            });
+            map.addInteraction(draw);
+          }
+          addInteraction();
+        });
+        //清除画图鼠标点击事件
+        // $("#drawRemove").click(function () {
+        //   //map.addLayer(hc_land);
+        //   map.removeInteraction(draw);
+        //   //map.removeLayer(vector_drawing);
+        // });
+        //还原之前图层
+        $("#" + this.drawResetMap).click(function () {
+          if(that.reduction !=null) {
+            map.removeInteraction(draw);
+            map.removeLayer(vector_drawing);
+            map.addLayer(hc_land);
+            newcenterFeature = new ol.Feature({
+              geometry: new ol.geom.Point(center), //几何信息
+              //name: "标注点",
+            });
+            sourceMapLook = new ol.source.Vector({wrapX: false});
+            vector_drawing = new ol.layer.Vector({
+              source: sourceMapLook,
+            });
+            map.addLayer(vector_drawing);
+            newcenterFeature.setStyle(createLabelStyle()); //设置要素样式
+            sourceMapLook.addFeature(newcenterFeature);
+            that.closeMoule = null;
+            that.formSubmit();
+          }
+        });
+      } else{
+        this.closeMoule = null;
+        document.getElementById(that.uuidMap).innerHTML = '';
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //获取坐标是否存在
+        var Zb;
+        var latitude;
+        var longitude;
+        //开始定位当前位置
+        navigator.geolocation.getCurrentPosition(function(position) {
+          latitude = position.coords.latitude;// 获取纬度
+          longitude = position.coords.longitude;// 获取经度
+        });
+        getQueryLand().then((response) => {
+          if (response.code == 200) {
+            let InsertCode = response.data;
+            if (InsertCode != null) {
+              var lat = InsertCode.lat;
+              var lng = InsertCode.lng;
+              if(latitude !=null && longitude !=null && latitude !="" && longitude !=""){
+                Zb = [longitude,latitude];
+              }else if(lat !=null && lng !=null && lat !="" && lng !=""){
+                Zb = [lng,lat];
+              }else {
+                Zb =[115.452752, 31.789033];
+              }
+              //加载地图
+              map = new ol.Map({
+                controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+                layers: [aerial, yingxzi],
+                projection: projection,
+                logo: 'false',
+                target: that.uuidMap,
+                view: new ol.View({
+                  center: ol.proj.fromLonLat(Zb),
+                  //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+                  zoom: 15.9,
+                  minZoom: 5, //地图缩小限制
+                  maxZoom: 18, //地图放大限制
+                }),
+              });
+            }
+          }
+        });
+
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#"+this.drawPolygonMap).click(function () {
+          //map.removeLayer(hc_land);
+          map.removeLayer(vector_drawing);
+          that.closeMoule = null;
+          map.removeInteraction(draw);
+          var sourceMap = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: sourceMap,
+          });
+          map.addLayer(vector_drawing);
+
+          function addInteraction() {
+            draw = new ol.interaction.Draw({
+              source: vector_drawing.getSource(),
+              type: "Point",
+            });
+            draw.on('drawend', function (evt) {
+              map.removeInteraction(draw);
+              $("#drawRemove").trigger('click');
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              var newFeature = new ol.Feature({
+                geometry: new ol.geom.Point(coordinate), //几何信息
+                //name: "标注点",
+              });
+              newFeature.setStyle(createLabelStyle()); //设置要素样式
+              sourceMap.addFeature(newFeature);
+              that.closeMoule = coordinate;
+              that.formSubmit();
+            });
+            map.addInteraction(draw);
+          }
+          addInteraction();
+
+        });
+        //清除画图鼠标点击事件
+        // $("#drawRemove").click(function () {
+        //   //map.addLayer(hc_land);
+        //   map.removeInteraction(draw);
+        //   //map.removeLayer(vector_drawing);
+        // });
+        //还原之前图层
+        $("#" + this.drawResetMap).click(function () {
+          map.removeInteraction(draw);
+          map.removeLayer(vector_drawing);
+          //map.addLayer(hc_land);
+          that.closeMoule = null;
+          that.formSubmit();
+        });
+      }
+    },
+  },
+  watch: {},
+};
+</script>
+
+<style scoped>
+#peaceCountryMap {
+  width: 100%;
+  height: 100%;
+}
+.fuTitle {
+  border-top: 1px solid #e9e9e9;
+  text-align: center;
+  padding: 10px 0px 0px 0px;
+  font-size: 18px;
+  color: #999;
+}
+.ant-btn-red {
+  position: relative;
+  display: inline-block;
+  background: #D0EEFF;
+  border: 1px solid #99D3F5;
+  border-radius: 4px;
+  padding: 4px 12px;
+  overflow: hidden;
+  color: #1E88C7;
+  text-decoration: none;
+  text-indent: 0;
+  line-height: 20px;
+}
+#land-btn-wrap{
+  position: relative;
+  width: 25%;
+  left: 75%;
+  bottom: 100%;
+  z-index: 2000;
+  padding-top: 5%;
+}
+</style>
diff --git a/src/views/homestead/index.vue b/src/views/homestead/index.vue
index 02c76af2..1e03744b 100644
--- a/src/views/homestead/index.vue
+++ b/src/views/homestead/index.vue
@@ -2173,7 +2173,7 @@ export default {
 
       var wmsSource = new ol.source.TileWMS({
         //url: 'http://192.168.31.150:8888/geoserver/mywork_mysql/wms',
-        url: "http://116.255.135.38:8080/geoserver/nsgk_hc/wms",
+        url: "http://116.255.223.226:8080/geoserver/nsgk_hc/wms",
         //url: 'http://localhost:8888/geoserver/mywork_mysql/wms',
         params: {
           LAYERS: "nsgk_hc:nsgk_hc_all",
@@ -2202,7 +2202,7 @@ export default {
           title: "add Layer",
           source: new ol.source.Vector({
             projection: projection,
-            // url: "http://116.255.135.38:8081/nsgk_test/profile/geojson/huancui.json", //GeoJSON的文件路径，用户可以根据需求而改变
+            // url: "http://116.255.223.226:8081/nsgk_test/profile/geojson/huancui.json", //GeoJSON的文件路径，用户可以根据需求而改变
             // format: new ol.format.GeoJSON(),
             features: new ol.format.GeoJSON().readFeatures(data),
           }),
@@ -2244,7 +2244,7 @@ export default {
       //   title: "add Layer",
       //   source: new ol.source.Vector({
       //     projection: projection,
-      //     url: "http://116.255.135.38:8081/nsgk_test/profile/geojson/huancui.json", //GeoJSON的文件路径，用户可以根据需求而改变
+      //     url: "http://116.255.223.226:8081/nsgk_test/profile/geojson/huancui.json", //GeoJSON的文件路径，用户可以根据需求而改变
       //     format: new ol.format.GeoJSON(),
       //   }),
       //   style: new ol.style.Style({
@@ -2264,7 +2264,7 @@ export default {
       //   title: "add huancui_zhen",
       //   source: new ol.source.Vector({
       //     projection: projection,
-      //     url: "http://116.255.135.38:8081/nsgk_test/profile/geojson/huancui_zhen.json", //GeoJSON的文件路径，用户可以根据需求而改变
+      //     url: "http://116.255.223.226:8081/nsgk_test/profile/geojson/huancui_zhen.json", //GeoJSON的文件路径，用户可以根据需求而改变
       //     format: new ol.format.GeoJSON(),
       //   }),
       //   style: new ol.style.Style({
@@ -2700,7 +2700,7 @@ export default {
           nongZt[i] = new ol.layer.Tile({
             source: new ol.source.TileWMS({
               //url: 'http://192.168.31.150:8888/geoserver/mywork_mysql/wms',
-              url: "http://116.255.135.38:8080/geoserver/nsgk_hc/wms",
+              url: "http://116.255.223.226:8080/geoserver/nsgk_hc/wms",
               //url: 'http://localhost:8888/geoserver/mywork_mysql/wms',
               //url: 'http://localhost:8888/geoserver/new_shp/wms',
               params: {
@@ -2727,7 +2727,7 @@ export default {
             outputFormat: "application/json",
             //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名，后者是对应值
           };
-          let url_dw = "http://116.255.135.38:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
+          let url_dw = "http://116.255.223.226:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
           url_dw = url_dw + "?";
           for (let key in param_dw) {
             url_dw = url_dw + key + "=" + param_dw[key] + "&";
@@ -2859,7 +2859,7 @@ export default {
             delete_map[i] = new ol.layer.Tile({
               source: new ol.source.TileWMS({
                 //url: 'http://192.168.31.150:8888/geoserver/mywork_mysql/wms',
-                url: "http://116.255.135.38:8080/geoserver/nsgk_hc/wms",
+                url: "http://116.255.223.226:8080/geoserver/nsgk_hc/wms",
                 //url: 'http://localhost:8888/geoserver/mywork_mysql/wms',
                 //url: 'http://localhost:8888/geoserver/new_shp/wms',
                 params: {
@@ -2887,7 +2887,7 @@ export default {
               outputFormat: "application/json",
               //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名，后者是对应值
             };
-            let url_dw = "http://116.255.135.38:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
+            let url_dw = "http://116.255.223.226:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
             url_dw = url_dw + "?";
             for (let key in param_dw) {
               url_dw = url_dw + key + "=" + param_dw[key] + "&";
@@ -3121,7 +3121,7 @@ export default {
           outputFormat: "application/json",
           //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名，后者是对应值
         };
-        let url_dw = "http://116.255.135.38:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
+        let url_dw = "http://116.255.223.226:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
         url_dw = url_dw + "?";
         for (let key in param_dw) {
           url_dw = url_dw + key + "=" + param_dw[key] + "&";
@@ -3288,7 +3288,7 @@ export default {
           outputFormat: "application/json",
           //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名，后者是对应值
         };
-        let url_dw = "http://116.255.135.38:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
+        let url_dw = "http://116.255.223.226:8080/geoserver/nsgk_hc/wfs"; //wfsurl;
         url_dw = url_dw + "?";
         for (let key in param_dw) {
           url_dw = url_dw + key + "=" + param_dw[key] + "&";
diff --git a/src/views/homesteadSurvey/add.vue b/src/views/homesteadSurvey/add.vue
index e5081118..7aa7a986 100644
--- a/src/views/homesteadSurvey/add.vue
+++ b/src/views/homesteadSurvey/add.vue
@@ -339,6 +339,7 @@
             label="备注"
             placeholder="备注"
           />
+          <MapGisDrawing ref="drewingClickLoading" :message="form.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
           <div style="margin: 16px;">
             <van-button round block color="#7AC943" native-type="submit">保存</van-button>
           </div>
@@ -697,6 +698,7 @@
             placeholder="备注"
             :rules="[{ required: true, message: '' }]"
           />
+          <MapGisDrawing ref="drewingClickLoading" :message="form.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
           <div style="margin: 16px;">
             <van-button round block color="#7AC943" native-type="submit">保存</van-button>
           </div>
@@ -817,6 +819,7 @@
             placeholder="备注"
             :rules="[{ required: true, message: '' }]"
           />
+          <MapGisDrawing ref="drewingClickLoading" :message="form.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
           <div style="margin: 16px;">
             <van-button round block color="#7AC943" native-type="submit">保存</van-button>
           </div>
@@ -930,6 +933,7 @@
             placeholder="备注"
             :rules="[{ required: true, message: '' }]"
           />
+          <MapGisDrawing ref="drewingClickLoading" :message="form.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
           <div style="margin: 16px;">
             <van-button round block color="#7AC943" native-type="submit">保存</van-button>
           </div>
@@ -1176,6 +1180,7 @@
           <div style="text-align:center;overflow:auto;">
             <van-button plain round color="#7AC943" size="mini" style="margin:0 auto;">查看户主信息</van-button>
           </div>
+          <MapGisDrawing ref="drewingClickLoading" :message="form.theGeom" v-on:formSubmit="MapTag"></MapGisDrawing>
           <div style="margin: 16px;">
             <van-button round block color="#7AC943" native-type="submit">保存</van-button>
           </div>
@@ -1198,7 +1203,7 @@
             <p style="flex:1;text-align:right;">个人</p>
           </div>
           <div style="text-align:center;overflow:auto;">
-            <van-button plain round color="#7AC943" size="mini" style="margin:0 auto;" @click="showzrz=true">查看自然幢信息</van-button>
+            <van-button plain round color="#7AC943" size="mini" style="margin:0 auto;" @click="showPopupzrz">查看自然幢信息</van-button>
           </div>
         </div>
         <template #right>
@@ -1258,7 +1263,7 @@
             <p style="flex:1;text-align:right;">个人</p>
           </div>
           <div style="text-align:center;overflow:auto;">
-            <van-button plain round color="#7AC943" size="mini" @click="showfsss=true" style="margin:0 auto;">查看附属设施信息</van-button>
+            <van-button plain round color="#7AC943" size="mini" @click="showPopupfsss" style="margin:0 auto;">查看附属设施信息</van-button>
           </div>
         </div>
         <template #right>
@@ -1280,9 +1285,17 @@
 
 <script>
   import {listShyqr} from "@/api/homesteadSurvey/shyqr";
-  import {listZjdzd,getZjdzd,updateZjdzd,addZjdzd,uploadFile} from "@/api/homesteadSurvey/zjdzd";
-    export default {
+  import {listZjdzd,getZjdzd,updateZjdzd,addZjdzd,uploadFile,getQueryLand} from "@/api/homesteadSurvey/zjdzd";
+  import MapGisDrawing from "@/components/Map/MapGisDrawing";
+  import {listZrz,getZrzZjdDmList} from "@/api/homesteadSurvey/zrz";
+  import {listFsss,getFsssZjdDmList} from "@/api/homesteadSurvey/fsss";
+  import { listTown, getTown } from "@/api/homesteadSurvey/town";
+  import { listVillage} from "@/api/homesteadSurvey/village";
+
+
+  export default {
       name: "homesteadAdd",
+      components: { MapGisDrawing,},
       data() {
         return {
           active:1,
@@ -1345,7 +1358,7 @@
         this.getZjd()
       },
       mounted(){
-
+        this.mapClickLoading();
       },
       methods: {
         // 图片上传前
@@ -1503,15 +1516,18 @@
         },
         showPopupzrz() {
           this.showzrz = true;
+          this.mapClickLoading();
         },
         showPopupfw() {
           this.showfw = true;
         },
         showPopupfsss() {
           this.showfsss = true;
+          this.mapClickLoading();
         },
         showPopup3() {
           this.show3 = true;
+          this.mapClickLoading();
         },
         onSubmit(values) {
           console.log('submit', values);
@@ -1529,7 +1545,18 @@
           }else{
             this.active=1
           }
-        }
+        },
+        //地图加载js------start
+        mapClickLoading(){
+          setTimeout(() => {
+            this.$refs.drewingClickLoading.drawingPaceCountryDarw();
+          }, 500);
+        },
+        /** 查找地图中定位点 */
+        MapTag: function (data) {
+          this.form.theGeom = data;
+        },
+        //地图加载js------end
       }
     }
 </script>