@@ -126,6 +126,15 @@ export function getPermanent(id) { | |||||
method: 'get' | method: 'get' | ||||
}) | }) | ||||
} | } | ||||
// 清除固定资产图层 | |||||
export function clearPermanentGeom(id) { | |||||
return request({ | |||||
url: '/asset/permanent/clear/' + id, | |||||
method: 'get' | |||||
}); | |||||
} | |||||
// 修改固定资产 | // 修改固定资产 | ||||
export function updatePermanent(data) { | export function updatePermanent(data) { | ||||
return request({ | return request({ | ||||
@@ -1036,6 +1045,13 @@ export function getResource(id) { | |||||
}) | }) | ||||
} | } | ||||
export function clearResourceGeom(id) { | |||||
return request({ | |||||
url: '/asset/resource/clear/' + id, | |||||
method: 'get' | |||||
}); | |||||
} | |||||
// 资源新增 | // 资源新增 | ||||
export function addResource(data) { | export function addResource(data) { | ||||
return request({ | return request({ | ||||
@@ -1,7 +1,7 @@ | |||||
<template> | <template> | ||||
<div> | <div> | ||||
<!-- <p class="fuTitle">地块位置绘制</p>--> | <!-- <p class="fuTitle">地块位置绘制</p>--> | ||||
<div id="full-screen-acceptance" style="width: 100%;height:73vh;"> | |||||
<div id="full-screen-acceptance" style="width: 100%;height:71vh;"> | |||||
<div :id=this.uuidMap style="width: 100%;height: 100%"></div> | <div :id=this.uuidMap style="width: 100%;height: 100%"></div> | ||||
<div id='land-btn-wrap'> | <div id='land-btn-wrap'> | ||||
<!--<el-button :id=this.drawingPolygonMap style="background-color:#D0EEFF;color:#1E88C7" @click="" type="primary">画图</el-button>--> | <!--<el-button :id=this.drawingPolygonMap style="background-color:#D0EEFF;color:#1E88C7" @click="" type="primary">画图</el-button>--> | ||||
@@ -11,6 +11,7 @@ | |||||
<input :id="this.drawingResetMap" type="button" class="ant-btn ant-btn-red" value="重置图层"/> | <input :id="this.drawingResetMap" type="button" class="ant-btn ant-btn-red" value="重置图层"/> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div style="font-size: 13px; padding-top: 5px;">备注信息:绿色地块表示该地块,蓝色表示本账套已标记的其他地块</div> | |||||
<div id="info" style="display: none"></div> | <div id="info" style="display: none"></div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -18,6 +19,7 @@ | |||||
<script> | <script> | ||||
import {getQueryLand} from "@/api/homesteadSurvey/zjdzd"; | import {getQueryLand} from "@/api/homesteadSurvey/zjdzd"; | ||||
import $ from "jquery"; | import $ from "jquery"; | ||||
import { getConfigKey } from "@/api/system/config"; | |||||
export default { | export default { | ||||
components: { | components: { | ||||
@@ -29,15 +31,30 @@ export default { | |||||
uuidMap: this.guidProduct(), | uuidMap: this.guidProduct(), | ||||
drawingPolygonMap: this.guidProduct(), | drawingPolygonMap: this.guidProduct(), | ||||
drawingResetMap: this.guidProduct(), | drawingResetMap: this.guidProduct(), | ||||
mapGeoServerUrl: "", // geoserver地址 | |||||
villageBorderLayerName: "", // 乡镇边界图层名称 | |||||
}; | }; | ||||
}, | }, | ||||
props: ['theGeom','message'], | |||||
// created() { | |||||
// // setTimeout(() => { | |||||
// // this.drawingPaceCountryLine(); | |||||
// // }, 100); | |||||
// }, | |||||
props: ['theGeom','message', 'resourceId', 'resourceList'], | |||||
created() { | |||||
// 获取geoserver的地址 | |||||
this.getGeoServerUrl(); | |||||
// 获取村边界的图层名称 | |||||
this.getVillageBorderLayerName(); | |||||
}, | |||||
methods: { | methods: { | ||||
// 获取geoserver的地址 | |||||
getGeoServerUrl() { | |||||
getConfigKey("system.geoServer.url").then(response => { | |||||
this.mapGeoServerUrl = response.msg; | |||||
}); | |||||
}, | |||||
// 获取村边界的图层名称 | |||||
getVillageBorderLayerName() { | |||||
getConfigKey("geoserver.layer.villageBorder").then(response => { | |||||
this.villageBorderLayerName = response.msg; | |||||
}); | |||||
}, | |||||
//地图加载 | //地图加载 | ||||
formSubmit(){ | formSubmit(){ | ||||
//父组件监听的名字必须是formSubmit | //父组件监听的名字必须是formSubmit | ||||
@@ -107,6 +124,51 @@ export default { | |||||
maxZoom: 18.3, //地图放大限制 | maxZoom: 18.3, //地图放大限制 | ||||
}), | }), | ||||
}); | }); | ||||
// 添加村边界 | |||||
let mapBorder = new ol.layer.Image({ | |||||
source: new ol.source.ImageWMS({ | |||||
url: this.mapGeoServerUrl + '/wms', | |||||
params: { | |||||
LAYERS: this.villageBorderLayerName, | |||||
cql_filter: "dept_id = '" + this.$store.state.user.loginDeptId + "'", | |||||
SRID: 3857, | |||||
}, | |||||
}), | |||||
name: 'villageBorderLayer' | |||||
}); | |||||
map.addLayer(mapBorder); | |||||
// 添加已经存在的资源图层 | |||||
let vectorSource = new ol.source.Vector(); | |||||
for (let resource of this.resourceList) { | |||||
if (resource.theGeom && resource.id !== this.resourceId) { | |||||
let feature = new ol.Feature({ | |||||
geometry: new ol.geom.MultiPolygon(JSON.parse(resource.theGeom).coordinates), | |||||
// permanentName: permanent.name | |||||
}); | |||||
vectorSource.addFeature(feature); | |||||
} | |||||
} | |||||
let resourceLayer = new ol.layer.Vector({ | |||||
source: vectorSource, | |||||
style: (feature, resolution) => { | |||||
return new ol.style.Style({ | |||||
fill: new ol.style.Fill({ | |||||
//矢量图层填充颜色,以及透明度 | |||||
color: "rgba(0, 218, 255, 0.3)", | |||||
}), | |||||
stroke: new ol.style.Stroke({ | |||||
//边界样式 | |||||
color: "#00DAFF", | |||||
width: 3, | |||||
}), | |||||
}) | |||||
} | |||||
}); | |||||
map.addLayer(resourceLayer); | |||||
//图层查询定位开始 ---------start | //图层查询定位开始 ---------start | ||||
if(this.message.substring(0,1) =="{"){ | if(this.message.substring(0,1) =="{"){ | ||||
// var theGeomMap =this.message.replace("Point", "MultiPolygon"); | // var theGeomMap =this.message.replace("Point", "MultiPolygon"); | ||||
@@ -290,6 +352,50 @@ export default { | |||||
maxZoom: 18, //地图放大限制 | maxZoom: 18, //地图放大限制 | ||||
}), | }), | ||||
}); | }); | ||||
// 添加村边界 | |||||
let mapBorder = new ol.layer.Image({ | |||||
source: new ol.source.ImageWMS({ | |||||
url: this.mapGeoServerUrl + '/wms', | |||||
params: { | |||||
LAYERS: this.villageBorderLayerName, | |||||
cql_filter: "dept_id = '" + this.$store.state.user.loginDeptId + "'", | |||||
SRID: 3857, | |||||
}, | |||||
}), | |||||
name: 'villageBorderLayer' | |||||
}); | |||||
map.addLayer(mapBorder); | |||||
// 添加已经存在的资源图层 | |||||
let vectorSource = new ol.source.Vector(); | |||||
for (let resource of this.resourceList) { | |||||
if (resource.theGeom && resource.id !== this.resourceId) { | |||||
let feature = new ol.Feature({ | |||||
geometry: new ol.geom.MultiPolygon(JSON.parse(resource.theGeom).coordinates), | |||||
// permanentName: permanent.name | |||||
}); | |||||
vectorSource.addFeature(feature); | |||||
} | |||||
} | |||||
let resourceLayer = new ol.layer.Vector({ | |||||
source: vectorSource, | |||||
style: (feature, resolution) => { | |||||
return new ol.style.Style({ | |||||
fill: new ol.style.Fill({ | |||||
//矢量图层填充颜色,以及透明度 | |||||
color: "rgba(0, 218, 255, 0.3)", | |||||
}), | |||||
stroke: new ol.style.Stroke({ | |||||
//边界样式 | |||||
color: "#00DAFF", | |||||
width: 3, | |||||
}), | |||||
}) | |||||
} | |||||
}); | |||||
map.addLayer(resourceLayer); | |||||
} | } | ||||
} | } | ||||
}); | }); | ||||
@@ -1,6 +1,6 @@ | |||||
<template> | <template> | ||||
<div> | <div> | ||||
<div id="full-screen-acceptance" style="width: 100%;height:73vh;"> | |||||
<div id="full-screen-acceptance" style="width: 100%;height:71vh;"> | |||||
<div :id=this.uuidMap style="width: 100%;height: 100%"></div> | <div :id=this.uuidMap style="width: 100%;height: 100%"></div> | ||||
<div id='land-btn-wrap' v-show="showBtn"> | <div id='land-btn-wrap' v-show="showBtn"> | ||||
<input :id="this.drawPolygonMap" class="ant-btn ant-btn-red" type="button" value="标记"/> | <input :id="this.drawPolygonMap" class="ant-btn ant-btn-red" type="button" value="标记"/> | ||||
@@ -8,14 +8,16 @@ | |||||
<input :id="this.drawResetMap" type="button" class="ant-btn ant-btn-red" value="重置标记"/> | <input :id="this.drawResetMap" type="button" class="ant-btn ant-btn-red" value="重置标记"/> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div style="font-size: 13px; padding-top: 5px;">备注信息:黄色标记表示该资产,蓝色标记是本账套已标记的其他资产</div> | |||||
<div id="info" style="display: none"></div> | <div id="info" style="display: none"></div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import $ from "jquery"; | import $ from "jquery"; | ||||
import {entityGet, treeselect} from "@/api/agriculturalTrusteeship"; | |||||
import Cookies from "js-cookie"; | import Cookies from "js-cookie"; | ||||
import {getQueryLand} from "@/api/homesteadSurvey/zjdzd"; | |||||
import { getConfigKey } from "@/api/system/config"; | |||||
export default { | export default { | ||||
data() { | data() { | ||||
@@ -25,10 +27,30 @@ | |||||
uuidMap: this.guidProduct(), | uuidMap: this.guidProduct(), | ||||
drawPolygonMap: this.guidProduct(), | drawPolygonMap: this.guidProduct(), | ||||
drawResetMap: this.guidProduct(), | drawResetMap: this.guidProduct(), | ||||
mapGeoServerUrl: "", // geoserver地址 | |||||
villageBorderLayerName: "", // 乡镇边界图层名称 | |||||
}; | }; | ||||
}, | }, | ||||
props: ['theGeom','message','showBtn'], | |||||
props: ['theGeom','message','showBtn', 'permanentId', 'permanents'], | |||||
created() { | |||||
// 获取geoserver的地址 | |||||
this.getGeoServerUrl(); | |||||
// 获取村边界的图层名称 | |||||
this.getVillageBorderLayerName(); | |||||
}, | |||||
methods: { | methods: { | ||||
// 获取geoserver的地址 | |||||
getGeoServerUrl() { | |||||
getConfigKey("system.geoServer.url").then(response => { | |||||
this.mapGeoServerUrl = response.msg; | |||||
}); | |||||
}, | |||||
// 获取村边界的图层名称 | |||||
getVillageBorderLayerName() { | |||||
getConfigKey("geoserver.layer.villageBorder").then(response => { | |||||
this.villageBorderLayerName = response.msg; | |||||
}); | |||||
}, | |||||
//地图加载 | //地图加载 | ||||
formSubmit(){ | formSubmit(){ | ||||
//父组件监听的名字必须是formSubmit | //父组件监听的名字必须是formSubmit | ||||
@@ -130,58 +152,104 @@ | |||||
maxZoom: 18.3, //地图放大限制 | 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, | |||||
}), | |||||
}), | |||||
}); | |||||
// 添加村边界 | |||||
let mapBorder = new ol.layer.Image({ | |||||
source: new ol.source.ImageWMS({ | |||||
url: this.mapGeoServerUrl + '/wms', | |||||
params: { | |||||
LAYERS: this.villageBorderLayerName, | |||||
cql_filter: "dept_id = '" + this.$store.state.user.loginDeptId + "'", | |||||
SRID: 3857, | |||||
}, | |||||
}), | |||||
name: 'villageBorderLayer' | |||||
}); | |||||
map.addLayer(mapBorder); | |||||
// 添加已经存在的坐标点图层 | |||||
let permanentSource = new ol.source.Vector(); | |||||
for (let permanent of this.permanents) { | |||||
if (permanent.theGeom && permanent.id !== this.permanentId) { | |||||
let feature = new ol.Feature({ | |||||
geometry: new ol.geom.Point(JSON.parse(permanent.theGeom).coordinates), | |||||
// permanentName: permanent.name | |||||
}); | |||||
permanentSource.addFeature(feature); | |||||
} | |||||
} | } | ||||
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, | |||||
/* let permanentLayer = new ol.layer.Vector({ | |||||
source: clusterSource, | |||||
style: (feature, resolution) => { | |||||
let count = feature.get("features").length; | |||||
if (count > 1) { | |||||
// 聚合点样式 | |||||
return this.clusterStyle(count.toString()); | |||||
} else if (count === 1) { | |||||
return this.iconStyle(); | |||||
} | |||||
} | |||||
}); */ | |||||
let permanentLayer = new ol.layer.Vector({ | |||||
source: permanentSource, | |||||
style: (feature, resolution) => { | |||||
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/location/blue.png"), | |||||
}), | }), | ||||
text: new ol.style.Text({ | |||||
textAlign: "center", //位置 | |||||
textBaseline: "middle", //基准线 | |||||
font: "normal 12px 微软雅黑", //文字样式 | |||||
// text: feature.get("permanentName"), //文本内容 | |||||
fill: new ol.style.Fill({ | |||||
//文本填充样式(即文字颜色) | |||||
color: "#ff0000", | |||||
}), | |||||
}) | |||||
}) | |||||
} | |||||
}); | |||||
map.addLayer(permanentLayer); | |||||
//图层查询定位开始 ---------start | |||||
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, | |||||
}), | |||||
}), | |||||
}); | |||||
map.addLayer(hc_land); | map.addLayer(hc_land); | ||||
var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX; | var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX; | ||||
var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY; | var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY; | ||||
var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX; | var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX; | ||||
@@ -299,16 +367,16 @@ | |||||
}); | }); | ||||
//获取坐标是否存在 | //获取坐标是否存在 | ||||
var Zb; | var Zb; | ||||
var latitude; | |||||
var longitude; | |||||
//开始定位当前位置 | //开始定位当前位置 | ||||
navigator.geolocation.getCurrentPosition(function(position) { | |||||
latitude = position.coords.latitude;// 获取纬度 | |||||
longitude = position.coords.longitude;// 获取经度 | |||||
}); | |||||
treeselect().then(res=>{ | |||||
getQueryLand().then(res => { | |||||
if (res.code == 200) { | if (res.code == 200) { | ||||
Zb = [res.data[0].lng,res.data[0].lat] | |||||
let lat = res.data.lat; | |||||
let lng = res.data.lng; | |||||
if(lat && lng){ | |||||
Zb = [lng,lat]; | |||||
}else { | |||||
Zb =[115.452752, 31.789033]; | |||||
} | |||||
//加载地图 | //加载地图 | ||||
map = new ol.Map({ | map = new ol.Map({ | ||||
controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮 | controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮 | ||||
@@ -324,6 +392,78 @@ | |||||
maxZoom: 18, //地图放大限制 | maxZoom: 18, //地图放大限制 | ||||
}), | }), | ||||
}); | }); | ||||
// 添加村边界 | |||||
let mapBorder = new ol.layer.Image({ | |||||
source: new ol.source.ImageWMS({ | |||||
url: this.mapGeoServerUrl + '/wms', | |||||
params: { | |||||
LAYERS: this.villageBorderLayerName, | |||||
cql_filter: "dept_id = '" + this.$store.state.user.loginDeptId + "'", | |||||
SRID: 3857, | |||||
}, | |||||
}), | |||||
name: 'villageBorderLayer' | |||||
}); | |||||
map.addLayer(mapBorder); | |||||
// 添加已经存在的坐标点图层 | |||||
let permanentSource = new ol.source.Vector(); | |||||
for (let permanent of this.permanents) { | |||||
if (permanent.theGeom && permanent.id !== this.permanentId) { | |||||
let feature = new ol.Feature({ | |||||
geometry: new ol.geom.Point(JSON.parse(permanent.theGeom).coordinates), | |||||
// permanentName: permanent.name | |||||
}); | |||||
permanentSource.addFeature(feature); | |||||
} | |||||
} | |||||
/* let permanentLayer = new ol.layer.Vector({ | |||||
source: clusterSource, | |||||
style: (feature, resolution) => { | |||||
let count = feature.get("features").length; | |||||
if (count > 1) { | |||||
// 聚合点样式 | |||||
return this.clusterStyle(count.toString()); | |||||
} else if (count === 1) { | |||||
return this.iconStyle(); | |||||
} | |||||
} | |||||
}); */ | |||||
let permanentLayer = new ol.layer.Vector({ | |||||
source: permanentSource, | |||||
style: (feature, resolution) => { | |||||
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/location/blue.png"), | |||||
}), | |||||
text: new ol.style.Text({ | |||||
textAlign: "center", //位置 | |||||
textBaseline: "middle", //基准线 | |||||
font: "normal 12px 微软雅黑", //文字样式 | |||||
// text: feature.get("permanentName"), //文本内容 | |||||
fill: new ol.style.Fill({ | |||||
//文本填充样式(即文字颜色) | |||||
color: "#ff0000", | |||||
}), | |||||
}) | |||||
}) | |||||
} | |||||
}); | |||||
map.addLayer(permanentLayer); | |||||
} | } | ||||
}) | }) | ||||
@@ -482,6 +482,7 @@ | |||||
openAttachmentList | openAttachmentList | ||||
} from "@/api/sunVillage_info/fixedAssets"; | } from "@/api/sunVillage_info/fixedAssets"; | ||||
import {getQueryLand} from "@/api/sunVillage_info/homestead/application"; | import {getQueryLand} from "@/api/sunVillage_info/homestead/application"; | ||||
import { getConfigKey } from "@/api/system/config"; | |||||
export default { | export default { | ||||
components: { | components: { | ||||
getPermanentList, | getPermanentList, | ||||
@@ -504,10 +505,17 @@ | |||||
mapHaDataValue:false, | mapHaDataValue:false, | ||||
mapHasDateStatus: 0, //0资源资产 1固定资产 | mapHasDateStatus: 0, //0资源资产 1固定资产 | ||||
dialogVisible:false, | dialogVisible:false, | ||||
dialogImageUrl:'' | |||||
dialogImageUrl:'', | |||||
mapGeoServerUrl: "", // geoserver地址 | |||||
villageBorderLayerName: "", // 乡镇边界图层名称 | |||||
}; | }; | ||||
}, | }, | ||||
created() { | |||||
// 获取geoserver的地址 | |||||
this.getGeoServerUrl(); | |||||
// 获取村边界的图层名称 | |||||
this.getVillageBorderLayerName(); | |||||
}, | |||||
mounted() { | mounted() { | ||||
let mapTheGeomAll =this.$cookies.get("bookId"); | let mapTheGeomAll =this.$cookies.get("bookId"); | ||||
console.info(mapTheGeomAll); | console.info(mapTheGeomAll); | ||||
@@ -526,6 +534,18 @@ | |||||
}); | }); | ||||
}, | }, | ||||
methods: { | methods: { | ||||
// 获取geoserver的地址 | |||||
getGeoServerUrl() { | |||||
getConfigKey("system.geoServer.url").then(response => { | |||||
this.mapGeoServerUrl = response.msg; | |||||
}); | |||||
}, | |||||
// 获取村边界的图层名称 | |||||
getVillageBorderLayerName() { | |||||
getConfigKey("geoserver.layer.villageBorder").then(response => { | |||||
this.villageBorderLayerName = response.msg; | |||||
}); | |||||
}, | |||||
openImage(url){ | openImage(url){ | ||||
this.dialogImageUrl = url; | this.dialogImageUrl = url; | ||||
this.dialogVisible = true; | this.dialogVisible = true; | ||||
@@ -613,6 +633,21 @@ | |||||
maxZoom: 18.3, //地图放大限制 | maxZoom: 18.3, //地图放大限制 | ||||
}), | }), | ||||
}); | }); | ||||
// 添加村边界 | |||||
let mapBorder = new ol.layer.Image({ | |||||
source: new ol.source.ImageWMS({ | |||||
url: this.mapGeoServerUrl + '/wms', | |||||
params: { | |||||
LAYERS: this.villageBorderLayerName, | |||||
cql_filter: "dept_id = '" + this.$cookies.get("deptId") + "'", | |||||
SRID: 3857, | |||||
}, | |||||
}), | |||||
name: 'villageBorderLayer' | |||||
}); | |||||
map.addLayer(mapBorder); | |||||
//判断当前账套是否有数据 | //判断当前账套是否有数据 | ||||
var mapTalkAbout = true; | var mapTalkAbout = true; | ||||
//图层查询资源性资产定位开始 ---------start | //图层查询资源性资产定位开始 ---------start | ||||
@@ -45,7 +45,7 @@ | |||||
<div @click="handleDelete(item,index)" style="background-color: #ee0a24;height: 100%">删除</div> | <div @click="handleDelete(item,index)" style="background-color: #ee0a24;height: 100%">删除</div> | ||||
<router-link :to="{name:'sunVillageInfoFixedAssetsEdit',query:{id:item.id}}" style="background-color: #07c160">修改</router-link> | <router-link :to="{name:'sunVillageInfoFixedAssetsEdit',query:{id:item.id}}" style="background-color: #07c160">修改</router-link> | ||||
<div @click="openLoader(item.id,0)" style="background-color: rgba(98,173,102,0.2);color: #62AD66;">附件</div> | <div @click="openLoader(item.id,0)" style="background-color: rgba(98,173,102,0.2);color: #62AD66;">附件</div> | ||||
<div @click="openMap(item.theGeom,index)" style="background-color: #62AD66;color: #ffffff;">地图</div> | |||||
<div @click="openMap(item.id, item.theGeom,index)" style="background-color: #62AD66;color: #ffffff;">地图</div> | |||||
</template> | </template> | ||||
</van-swipe-cell> | </van-swipe-cell> | ||||
@@ -61,9 +61,10 @@ | |||||
<van-popup v-model="showMap" lock-scroll position="top" :style="{ height: '80%' }" > | <van-popup v-model="showMap" lock-scroll position="top" :style="{ height: '80%' }" > | ||||
<div style="padding: 0;text-align: center"> | <div style="padding: 0;text-align: center"> | ||||
<MapGisTag ref="clickLoading" :showBtn="true" :message="theGeom" v-on:formSubmit="MapTag"></MapGisTag> | |||||
<MapGisTag ref="clickLoading" :showBtn="true" :message="theGeom" v-on:formSubmit="MapTag" :permanentId="permanentId" :permanents="permanents"></MapGisTag> | |||||
<div style="margin-top: 1.5vh"> | <div style="margin-top: 1.5vh"> | ||||
<van-button type="info" size="small" @click="saveGeom">保存</van-button> | <van-button type="info" size="small" @click="saveGeom">保存</van-button> | ||||
<van-button type="danger" size="small" @click="clearLayer">清除图层</van-button> | |||||
<van-button plain type="info" size="small" @click="showMap = false">取消</van-button> | <van-button plain type="info" size="small" @click="showMap = false">取消</van-button> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -78,7 +79,9 @@ | |||||
attachmentList, | attachmentList, | ||||
systemAttachment, | systemAttachment, | ||||
delPermanent, | delPermanent, | ||||
updatePermanent | |||||
updatePermanent, | |||||
getPermanent, | |||||
clearPermanentGeom, | |||||
} from "@/api/sunVillage_info/fixedAssets"; | } from "@/api/sunVillage_info/fixedAssets"; | ||||
import request from '@/utils/request' | import request from '@/utils/request' | ||||
import MapGisTag from "@/components/Map/MapGisTagDTGCopy"; | import MapGisTag from "@/components/Map/MapGisTagDTGCopy"; | ||||
@@ -90,7 +93,6 @@ | |||||
data() { | data() { | ||||
return { | return { | ||||
applicationList:[], | applicationList:[], | ||||
applicationListSecond:[], | |||||
assetStatusOptions:[], | assetStatusOptions:[], | ||||
auditStatus:[], | auditStatus:[], | ||||
loading: false, | loading: false, | ||||
@@ -112,7 +114,9 @@ | |||||
showBtn:true, | showBtn:true, | ||||
showMap:false, | showMap:false, | ||||
theGeom:'', | theGeom:'', | ||||
listMap:0 | |||||
listMap:0, | |||||
permanentId: null, // 固定资产ID | |||||
permanents: [], // 固定资产列表,存储本账套下所有的固定资产信息 | |||||
}; | }; | ||||
}, | }, | ||||
created() { | created() { | ||||
@@ -127,16 +131,20 @@ | |||||
}); | }); | ||||
}, | }, | ||||
methods: { | methods: { | ||||
openMap(theGeom,index){ | |||||
this.showMap = true; | |||||
this.theGeom = theGeom; | |||||
this.listMap = index; | |||||
this.mapClickLoading(); | |||||
openMap(id, theGeom,index){ | |||||
permanentList().then(response => { | |||||
this.showMap = true; | |||||
this.permanentId = id; | |||||
this.theGeom = theGeom; | |||||
this.listMap = index; | |||||
this.permanents = response.rows; | |||||
this.mapClickLoading(); | |||||
}); | |||||
}, | }, | ||||
//获取自己返回值 | //获取自己返回值 | ||||
/** 查找地图中定位点 */ | /** 查找地图中定位点 */ | ||||
MapTag: function (data) { | MapTag: function (data) { | ||||
this.applicationList[this.listMap].theGeom = data; | |||||
// this.applicationList[this.listMap].theGeom = data; | |||||
this.theGeom = data; | this.theGeom = data; | ||||
}, | }, | ||||
//每个查看修改,新增 方法下引用下面方法 | //每个查看修改,新增 方法下引用下面方法 | ||||
@@ -146,21 +154,35 @@ | |||||
}, 500); | }, 500); | ||||
}, | }, | ||||
saveGeom(){ | saveGeom(){ | ||||
console.log(this.theGeom) | |||||
var that = this; | var that = this; | ||||
this.applicationList[this.listMap].theGeom = this.theGeom; | |||||
updatePermanent(this.applicationList[this.listMap]).then((response) => { | |||||
updatePermanent({id: this.permanentId, theGeom: this.theGeom}).then((response) => { | |||||
if (response.code == 200){ | if (response.code == 200){ | ||||
this.$notify({ type: 'success', message: '修改成功' }); | this.$notify({ type: 'success', message: '修改成功' }); | ||||
setTimeout(function(){ | setTimeout(function(){ | ||||
that.showMap = false; | that.showMap = false; | ||||
that.queryParams.pageNum += 1 ; | |||||
that.applicationList = []; | |||||
that.getList(); | |||||
getPermanent(that.permanentId).then(response => { | |||||
that.applicationList[that.listMap].theGeom = response.data.theGeom; | |||||
}); | |||||
},500) | },500) | ||||
} | } | ||||
}); | }); | ||||
}, | }, | ||||
clearLayer() { | |||||
this.$dialog.confirm({ | |||||
message: '是否清除图层?', | |||||
}).then(() => { | |||||
// on confirm | |||||
clearPermanentGeom(this.permanentId).then(res => { | |||||
if (res.code === 200) { | |||||
this.$notify({ type: 'success', message: '清除成功' }); | |||||
this.showMap = false; | |||||
this.applicationList[this.listMap].theGeom = null; | |||||
} | |||||
}); | |||||
}).catch(() => { | |||||
// on cancel | |||||
}); | |||||
}, | |||||
getList(){ | getList(){ | ||||
setTimeout(() => { | setTimeout(() => { | ||||
permanentList(this.queryParams).then(response => { | permanentList(this.queryParams).then(response => { | ||||
@@ -171,7 +193,6 @@ | |||||
response.rows[i].useType = this.selectDictLabel(this.useTypeOptions, response.rows[i].useType); | response.rows[i].useType = this.selectDictLabel(this.useTypeOptions, response.rows[i].useType); | ||||
// response.rows[i].originalValue = Number(response.rows[i].originalValue ).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, ($0, $1) => { return $1 + ","; }).replace(/\.$/, "") | // response.rows[i].originalValue = Number(response.rows[i].originalValue ).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, ($0, $1) => { return $1 + ","; }).replace(/\.$/, "") | ||||
this.applicationList.push(response.rows[i]); | this.applicationList.push(response.rows[i]); | ||||
this.applicationListSecond.push(response.rows[i]); | |||||
} | } | ||||
if(this.applicationList.length >= response.total){ | if(this.applicationList.length >= response.total){ | ||||
this.finished = true; | this.finished = true; | ||||
@@ -255,6 +276,7 @@ | |||||
getSearchList(){ | getSearchList(){ | ||||
this.applicationList = []; | this.applicationList = []; | ||||
this.queryParams.pageNum = 1; | this.queryParams.pageNum = 1; | ||||
this.finished = false; | |||||
this.getList(); | this.getList(); | ||||
}, | }, | ||||
deleteFile1(file){ | deleteFile1(file){ | ||||
@@ -51,10 +51,8 @@ | |||||
<script> | <script> | ||||
import { getList} from "@/api/sunVillage_info/sysCbf"; | import { getList} from "@/api/sunVillage_info/sysCbf"; | ||||
import request from '@/utils/request' | import request from '@/utils/request' | ||||
import MapGisLine from "@/components/Map/MapGisLine"; | |||||
export default { | export default { | ||||
name: "certificateList", | name: "certificateList", | ||||
components: { MapGisLine,}, | |||||
data() { | data() { | ||||
return { | return { | ||||
loading: false, | loading: false, | ||||
@@ -52,10 +52,8 @@ | |||||
<script> | <script> | ||||
import { getList} from "@/api/sunVillage_info/sysCbf"; | import { getList} from "@/api/sunVillage_info/sysCbf"; | ||||
import request from '@/utils/request' | import request from '@/utils/request' | ||||
import MapGisLine from "@/components/Map/MapGisLine"; | |||||
export default { | export default { | ||||
name: "certificateList", | name: "certificateList", | ||||
components: { MapGisLine,}, | |||||
data() { | data() { | ||||
return { | return { | ||||
loading: false, | loading: false, | ||||
@@ -37,7 +37,7 @@ | |||||
<div @click="handleDelete(item,index)" style="background-color: #ee0a24;height: 100%">删除</div> | <div @click="handleDelete(item,index)" style="background-color: #ee0a24;height: 100%">删除</div> | ||||
<router-link :to="{name:'sunVillageInfoListResourceEdit',query:{id:item.id}}" style="background-color: #07c160">修改</router-link> | <router-link :to="{name:'sunVillageInfoListResourceEdit',query:{id:item.id}}" style="background-color: #07c160">修改</router-link> | ||||
<div @click="openLoader(item.id,0)" style="background-color: rgb(98,173,102,0.2);color: #62AD66;">附件</div> | <div @click="openLoader(item.id,0)" style="background-color: rgb(98,173,102,0.2);color: #62AD66;">附件</div> | ||||
<div @click="openMap(item.theGeom,index)" style="background-color: #62AD66;color: #ffffff;">地图</div> | |||||
<div @click="openMap(item.id, item.theGeom,index)" style="background-color: #62AD66;color: #ffffff;">地图</div> | |||||
</template> | </template> | ||||
</van-swipe-cell> | </van-swipe-cell> | ||||
@@ -49,9 +49,11 @@ | |||||
<van-popup v-model="showMap" lock-scroll position="top" :style="{ height: '80%' }" > | <van-popup v-model="showMap" lock-scroll position="top" :style="{ height: '80%' }" > | ||||
<div style="padding: 0;text-align: center"> | <div style="padding: 0;text-align: center"> | ||||
<MapGisLine ref="clickLoading" :message="theGeom" v-on:formSubmit="MapTag"></MapGisLine> | |||||
<MapGisLine ref="clickLoading" :message="theGeom" v-on:formSubmit="MapTag" :resourceId="resourceId" :resourceList="resourceList"></MapGisLine> | |||||
<!-- <div>地图信息:绿色地块表示该地块,蓝色表示本账套已标记的其他地块</div>--> | |||||
<div style="margin-top: 1.5vh"> | <div style="margin-top: 1.5vh"> | ||||
<van-button type="info" size="small" @click="saveGeom">保存</van-button> | <van-button type="info" size="small" @click="saveGeom">保存</van-button> | ||||
<van-button type="danger" size="small" @click="clearLayer">清除图层</van-button> | |||||
<van-button plain type="info" size="small" @click="showMap = false">取消</van-button> | <van-button plain type="info" size="small" @click="showMap = false">取消</van-button> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -72,7 +74,9 @@ | |||||
attachmentList, | attachmentList, | ||||
systemAttachment, | systemAttachment, | ||||
delResource, | delResource, | ||||
updateResource | |||||
updateResource, | |||||
getResource, | |||||
clearResourceGeom | |||||
} from "@/api/sunVillage_info/fixedAssets"; | } from "@/api/sunVillage_info/fixedAssets"; | ||||
import request from '@/utils/request' | import request from '@/utils/request' | ||||
import MapGisLine from "@/components/Map/MapGisLine"; | import MapGisLine from "@/components/Map/MapGisLine"; | ||||
@@ -105,6 +109,9 @@ | |||||
projectId:'', | projectId:'', | ||||
projectIndex:'', | projectIndex:'', | ||||
showBtn:true, | showBtn:true, | ||||
listMap: 0, | |||||
resourceId: null, // 资源ID,记录当前资源的ID | |||||
resourceList: [] // 资源列表,存储本账套下所有的资源信息 | |||||
}; | }; | ||||
}, | }, | ||||
created() { | created() { | ||||
@@ -121,30 +128,49 @@ | |||||
methods: { | methods: { | ||||
saveGeom(){ | saveGeom(){ | ||||
var that = this; | var that = this; | ||||
this.applicationList[this.listMap].theGeom = this.theGeom; | |||||
updateResource(this.applicationList[this.listMap]).then((response) => { | |||||
updateResource({id: this.resourceId, theGeom: this.theGeom}).then((response) => { | |||||
if (response.code == 200){ | if (response.code == 200){ | ||||
this.$notify({ type: 'success', message: '修改成功' }); | this.$notify({ type: 'success', message: '修改成功' }); | ||||
setTimeout(function(){ | setTimeout(function(){ | ||||
that.showMap = false; | that.showMap = false; | ||||
that.queryParams.pageNum += 1 ; | |||||
that.applicationList = []; | |||||
that.getList(); | |||||
getResource(that.resourceId).then(response => { | |||||
that.applicationList[that.listMap].theGeom = response.data.theGeom; | |||||
}); | |||||
},500) | },500) | ||||
} | } | ||||
}); | }); | ||||
}, | }, | ||||
openMap(theGeom,index){ | |||||
this.showMap = true; | |||||
this.theGeom = theGeom; | |||||
this.listMap = index; | |||||
this.mapClickLoading(); | |||||
clearLayer() { | |||||
this.$dialog.confirm({ | |||||
message: '是否清除图层?', | |||||
}).then(() => { | |||||
// on confirm | |||||
clearResourceGeom(this.resourceId).then(res => { | |||||
if (res.code === 200) { | |||||
this.$notify({ type: 'success', message: '清除成功' }); | |||||
this.showMap = false; | |||||
this.applicationList[this.listMap].theGeom = null; | |||||
} | |||||
}); | |||||
}).catch(() => { | |||||
// on cancel | |||||
}); | |||||
}, | |||||
openMap(id, theGeom,index){ | |||||
listResource().then(response => { | |||||
this.showMap = true; | |||||
this.resourceId = id; | |||||
this.theGeom = theGeom; | |||||
this.listMap = index; | |||||
this.resourceList = response.rows; | |||||
this.mapClickLoading(); | |||||
}); | |||||
}, | }, | ||||
//每个查看修改,新增 方法下引用下面方法 | //每个查看修改,新增 方法下引用下面方法 | ||||
mapClickLoading(){ | mapClickLoading(){ | ||||
setTimeout(() => { | setTimeout(() => { | ||||
this.$refs.clickLoading.drawingPaceCountryLine(); | this.$refs.clickLoading.drawingPaceCountryLine(); | ||||
}, 500); | |||||
}, 1000); | |||||
}, | }, | ||||
/** 查找地图中定位点 */ | /** 查找地图中定位点 */ | ||||
MapTag: function (data) { | MapTag: function (data) { | ||||
@@ -159,9 +185,12 @@ | |||||
}); | }); | ||||
}, | }, | ||||
getList(){ | getList(){ | ||||
this.loading = true; | |||||
listResource(this.queryParams).then(response => { | listResource(this.queryParams).then(response => { | ||||
this.listLength = response.total; | this.listLength = response.total; | ||||
this.applicationList = response.rows; | |||||
response.rows.forEach(item => { | |||||
this.applicationList.push(item); | |||||
}); | |||||
if(this.applicationList.length >= response.total){ | if(this.applicationList.length >= response.total){ | ||||
this.finished = true; | this.finished = true; | ||||
return; | return; | ||||
@@ -235,6 +264,7 @@ | |||||
getSearchList(){ | getSearchList(){ | ||||
this.applicationList = []; | this.applicationList = []; | ||||
this.queryParams.pageNum = 1; | this.queryParams.pageNum = 1; | ||||
this.finished = false; | |||||
this.getList(); | this.getList(); | ||||
}, | }, | ||||
deleteFile1(file){ | deleteFile1(file){ | ||||