Task 资源定位

src/components/Map/MapGisLine.vue

@@ -7,6 +7,7 @@
             <!--<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="locationMap" type="button" class="ant-btn ant-btn-red" value="定位"/>&nbsp;&nbsp;
             <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>
@@ -31,6 +32,7 @@ export default {
       uuidMap: this.guidProduct(),
       drawingPolygonMap: this.guidProduct(),
       drawingResetMap: this.guidProduct(),
+      locationMap: this.guidProduct(),
       mapGeoServerUrl: "",            // geoserver地址
       villageBorderLayerName: "",     // 乡镇边界图层名称
     };
@@ -72,6 +74,56 @@ export default {
         return v.toString(16);
       });
     },
+    getCurrentLocation(callback) {
+      // 1. 首先尝试Android宿主端
+      if(window._Native_object) // Android层注入全局对象
+      {
+        console.log('使用Native获取定位');
+        let coord = window._Native_object.GetLocation(null);
+        console.log('Native坐标: ' + coord);
+        if(coord)
+        {
+          let arr = coord.split(',');
+          let res = {
+            code: 200,
+            data: {
+              lng: arr[0],
+              lat: arr[1],
+            },
+          };
+          callback(res);
+          return;
+        }
+      }
+
+      // 2. 再尝试浏览器
+      if (navigator.geolocation) {
+        console.log('使用浏览器获取定位');
+        navigator.geolocation.getCurrentPosition(
+          (position) => {
+            const { latitude, longitude } = position.coords;
+            let res = {
+              code: 200,
+              data: {
+                lng: longitude,
+                lat: latitude,
+              },
+            };
+            callback(res);
+          },
+          (error) => {
+            console.log('定位失败: ' + error.message);
+            getQueryLand().then(callback);
+          },
+          { enableHighAccuracy: true, timeout: 10000 }
+        );
+        return;
+      }
+
+      // 最后使用地区坐标
+      console.log('使用地区坐标定位');
+      getQueryLand().then(callback);
+    },
     //地图查看
     drawingPaceCountryLine() {
       //加载地图编辑
@@ -297,6 +349,26 @@ export default {
             that.formSubmit();
           }
         });
+        $("#" + this.locationMap).click(function () {
+          that.getCurrentLocation(res => {
+            if (res.code == 200) {
+              let lat = res.data.lat;
+              let lng = res.data.lng;
+              if(lat && lng){
+                Zb = [lng,lat];
+              }else {
+                Zb =[115.452752, 31.789033];
+              }
+              map.getView().animate({
+                // 只设置需要的属性即可
+                center: ol.proj.fromLonLat(Zb), // 中心点
+                zoom: 18, // 缩放级别
+                rotation: undefined, // 缩放完成view视图旋转弧度
+                duration: 1000, // 缩放持续时间，默认不需要设置
+              });
+            }
+          });
+        });
       } else{
         //this.closeMoule = null;
         document.getElementById(that.uuidMap).innerHTML = '';
@@ -326,7 +398,7 @@ export default {
         });
         //获取坐标是否存在
         var Zb;
-        getQueryLand().then((response) => {
+        this.getCurrentLocation((response) => {
           if (response.code == 200) {
             let InsertCode = response.data;
             if (InsertCode != null) {
@@ -442,6 +514,26 @@ export default {
           //that.closeMoule = null;
           that.formSubmit();
         });
+        $("#" + this.locationMap).click(function () {
+          that.getCurrentLocation(res => {
+            if (res.code == 200) {
+              let lat = res.data.lat;
+              let lng = res.data.lng;
+              if(lat && lng){
+                Zb = [lng,lat];
+              }else {
+                Zb =[115.452752, 31.789033];
+              }
+              map.getView().animate({
+                // 只设置需要的属性即可
+                center: ol.proj.fromLonLat(Zb), // 中心点
+                zoom: 18, // 缩放级别
+                rotation: undefined, // 缩放完成view视图旋转弧度
+                duration: 1000, // 缩放持续时间，默认不需要设置
+              });
+            }
+          });
+        });
       }
     },
   },

src/components/Map/MapGisTagDTGCopy.vue

@@ -402,7 +402,7 @@
                 map.getView().animate({
                   // 只设置需要的属性即可
                   center: ol.proj.fromLonLat(Zb), // 中心点
-                  zoom: 15.9, // 缩放级别
+                  zoom: 18, // 缩放级别
                   rotation: undefined, // 缩放完成view视图旋转弧度
                   duration: 1000, // 缩放持续时间，默认不需要设置
                 });
@@ -604,7 +604,7 @@
                 map.getView().animate({
                   // 只设置需要的属性即可
                   center: ol.proj.fromLonLat(Zb), // 中心点
-                  zoom: 15.9, // 缩放级别
+                  zoom: 18, // 缩放级别
                   rotation: undefined, // 缩放完成view视图旋转弧度
                   duration: 1000, // 缩放持续时间，默认不需要设置
                 });

src/views/sunVillage_info/resource.vue

@@ -15,7 +15,7 @@
               </template>
             </selector>
           </div>
-          <div class="total">共{{listLength}}个资产</div>
+          <div class="total">共{{listLength}}个资源</div>
        </div>
        <div class="list_main">
          <van-list