From 70e16a5d80a996fccfc4eecf540711366f9d12ac Mon Sep 17 00:00:00 2001 From: yuzongping <835949940@qq.com> Date: Tue, 17 Jun 2025 14:13:45 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B5=84=E4=BA=A7=E5=9B=BE=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/property/main-gis/icon/zc_icon.png | Bin 3866 -> 0 bytes .../property/main-gis/icon/组 4665@2x(1).png | Bin 0 -> 485 bytes .../property/main-gis/icon/组 4665@2x(2).png | Bin 0 -> 495 bytes .../property/main-gis/icon/组 4665@2x(3).png | Bin 0 -> 466 bytes .../property/main-gis/icon/组 4665@2x.png | Bin 0 -> 505 bytes src/views/property/main-gis/index.html | 2 +- src/views/property/main-gis/index.js | 43 +++---- src/views/property/main-gis/index.scss | 3 - src/views/resources/main-gis/index.html | 4 +- src/views/resources/main-gis/index.js | 121 +++++++++--------- 10 files changed, 83 insertions(+), 90 deletions(-) delete mode 100644 src/views/property/main-gis/icon/zc_icon.png create mode 100644 src/views/property/main-gis/icon/组 4665@2x(1).png create mode 100644 src/views/property/main-gis/icon/组 4665@2x(2).png create mode 100644 src/views/property/main-gis/icon/组 4665@2x(3).png create mode 100644 src/views/property/main-gis/icon/组 4665@2x.png diff --git a/src/views/property/main-gis/icon/zc_icon.png b/src/views/property/main-gis/icon/zc_icon.png deleted file mode 100644 index ebc48c957561f180aaef08f10e8f7b0bf4320692..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 3866 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 diff --git a/src/views/property/main-gis/icon/组 4665@2x(1).png b/src/views/property/main-gis/icon/组 4665@2x(1).png new file mode 100644 index 0000000000000000000000000000000000000000..49f3cd872322c4167cfc832ba3f77ef84d81de6c GIT binary patch literal 485 zcmVPx$pGibPR5(wKlD}&dVGxF&cX#h@F9wSXm$Og^0e>~Av=gzhu?UEjRXV}KRM%+Z zAzB4NY%DAUMQr>7EJTrz#=<5=h*2a&jcZ7e3%9pxayPOId)aJ`km+XLdFGp$Z$!b? zjA}XNlHfcbV7Xsm{)Fh{QxjoeK}ZwnE>J7fYlA%=_jxGMPqY+l8P4sPx0tRMJIMQn zec1N7c3Q+K7(~orY90pdY4*HP<(7VhoGM8_4BVrEV2({Gh-hM(%R{ctam;&waOv!} z*tNw%O?#%G%Y9I5PZ71s5}wYap`NX?8BYK^IoKA4fMx1_Cw(omji`>XnH!TY`rGB6 zp-1^%M!hGDc(Z9J>b;`9GgEB!bu!~5rf=ETWEmyr3c}-G|NViTIj&tuzvEBHQ%QG@ zwpDxCs4|m+D@Nsb%x6qfhryD4bvs-f8>2lqxt}2?OX3q~au_W5ZL-S^pYMZ{%M#bS zOgQikbawx#vFgaKj{B@+@qI_01hPx$sYygZR5(wKQol z0%BuhVIc@2f`34&LvTUqI?Klf5_yz1*(-fnmB+GO5~J#MntXbq_xe)OWbP?%Cg4#aMh#FnXuY9cY> z>(&YdZ|<{IfowFq{EN#2a7x;I12BH)0RTtJ=*iQ8fuMJC`IGRWmo$u!8X|9!+hegyD1OP1fA9G?cRdz_9fgXtG3TcKHp;91-d;PW}!&$Z{(vQgeL lSMiUTRfJvloUNN6{{hPx$j7da6R5(wKlQBqDaTLaX-@E!Ak3d3b5E32^R*N|(J}tt<1_wc$n%vrIa>=EK z)FgtqI5Y%Cv^0xD^bmP3P;hY&ONj`Ihz12yEB)kMy_fs0DW2_rzwdX>`Jex}A{AAf zKZ3gf+%gE*xB^SJ(QeXO6XK}iG2|yeb1L5s)>JP%6FRDCAy~qh`}i$lINd?=Z1a8_ z4GyA%5Uk=!IXHz_Petq%UE4u+6sp=k{(@Zs`gwT!DtB1 zPx$vq?ljR5(wKl08UUQ547j|NCB}8M;Kr6w=hBbaAriAYzAtbSQ{Z7v0=KDM+yf zl4pqyejubnhYp2;bSa3NQ$@rM9R%HcMx{%^3L<_)#dq&1zG!?e5%Fy2<9F`=oO6j9 zi_5!c)O*+o#bLggopp(+h5FsBRh}HBv1TpO@7C^^b<|?2#Dy8v* zkltDaAz$#**!!dTYuSPLHGp%!Z2%TVNL1plmO@3%kj?isp;KAR?mB~sS_y88xtt=E& zwX9uF-~ivpCs(^ff$mn#y?+;gknTzhoD2U{f5piJyH1g&?%gliO@mpFP@mDf_v$5jKCAV}T{ z6MxNx?kY7Fwr;-MRb}GTNknY30P<-VmOq|lUT(9nc^wZe
-
+

{{item.name}}

diff --git a/src/views/property/main-gis/index.js b/src/views/property/main-gis/index.js index e6079e9..15fc0a4 100644 --- a/src/views/property/main-gis/index.js +++ b/src/views/property/main-gis/index.js @@ -8,6 +8,13 @@ import { getResourceListByDeptId, listResource } from "@/api/asset/resource.js"; import { attachmentList } from "@/api/common/uploadAttachment.js"; let gis = null; import Legend from '@/components/legend/index.vue'; + +const iconMap = { + '1': require('./icon/组 4665@2x.png'), // 自用 + '2': require('./icon/组 4665@2x(1).png'), // 闲置 + '3': require('./icon/组 4665@2x(2).png'), // 出租或出借 + '4': require('./icon/组 4665@2x(3).png') // 其他 +} export default { components: { Legend @@ -16,31 +23,19 @@ export default { return { LegendData: [ { - iconStyle: { - background: 'rgba(38,252,128,0.45)', - border: '2px solid #26FC80' - }, + icon: require('./icon/组 4665@2x.png'), name: '自用' }, { - iconStyle: { - background: 'rgba(232,246,0,0.45)', - border: '2px solid #E8F600' - }, + icon: require('./icon/组 4665@2x(1).png'), name: '闲置' }, { - iconStyle: { - background: 'rgba(16,252,252,0.45)', - border: '2px solid #10FCFC' - }, + icon: require('./icon/组 4665@2x(2).png'), name: '出租' }, { - iconStyle: { - background: 'rgba(198,0,255,0.45)', - border: '2px solid #C600FF' - }, + icon: require('./icon/组 4665@2x(3).png'), name: '其他' } ], @@ -53,7 +48,6 @@ export default { checkStrictly: true, }, yellowIcon: require('./icon/yellow.png'), - zcIcon: require('./icon/zc_icon.png'), mapGeoServerUrl: "", villageBorderLayerName: "", headerTitle: '', @@ -321,7 +315,7 @@ export default { this.addDeptLayer(deptList, 'yellow.png'); gis.getMapContainer().getView().animate({ // 只设置需要的属性即可 - center: ol.proj.fromLonLat([dept.lng, dept.lat]), // 中心点 + center: fromLonLat([dept.lng, dept.lat]), // 中心点 duration: 500, // 缩放持续时间，默认不需要设置 }); }, @@ -344,7 +338,10 @@ export default { let features = []; permanentList.forEach(item => { if (item.theGeom != null && item.theGeom !== '') { - let fs = gis.getFeature2(item, this.zcIcon) + // console.log(222, useType, item); + const { useType } = item + let icon = iconMap[useType + ''] + let fs = gis.getFeature2(item, icon) features.push(fs); } }); @@ -370,8 +367,6 @@ export default { let fs = gis.getFeature(item, this.yellowIcon) features.push(fs); }); - - gis.getVectorLayerByFs(features) gis.mapSetFit(features) }, @@ -531,8 +526,6 @@ export default { this.addDeptLayer(deptList); // // 获取资产列表 this.getPermanentList(deptId); - // // 获取资源列表 - this.getResourceList(deptId); var that = this; //点击查询详细信息 @@ -543,7 +536,6 @@ export default { ); if (feature) { var ifConsole = feature.values_.level; - console.log(ifConsole); if (ifConsole == "permanent") { that.listDialogHidden('detail'); that.openPermanentDialog(feature.values_.detail); @@ -571,10 +563,7 @@ export default { let fs = gis.getFeature3(item) features.push(fs); } - }); - - gis.getVectorLayerByFs(features) gis.mapSetFit(features) }, diff --git a/src/views/property/main-gis/index.scss b/src/views/property/main-gis/index.scss index d8e9c7d..7b84e3d 100644 --- a/src/views/property/main-gis/index.scss +++ b/src/views/property/main-gis/index.scss @@ -24,9 +24,6 @@ align-items: center; .icon { - width: 16px; - height: 16px; - border-radius: 50%; margin-right: 10px; } } diff --git a/src/views/resources/main-gis/index.html b/src/views/resources/main-gis/index.html index 4daf291..b876b7b 100644 --- a/src/views/resources/main-gis/index.html +++ b/src/views/resources/main-gis/index.html @@ -9,7 +9,7 @@
- + diff --git a/src/views/resources/main-gis/index.js b/src/views/resources/main-gis/index.js index b89498b..cedbe57 100644 --- a/src/views/resources/main-gis/index.js +++ b/src/views/resources/main-gis/index.js @@ -4,7 +4,7 @@ import { fromLonLat } from 'ol/proj' import { getUserGeo, getUserGeoList } from "@/api/dataScreen/stockCooperative/index.js"; - +import { getInfo } from "@/api/login"; import { getResourceListByDeptId, listResource } from "@/api/asset/resource.js"; import Legend from '@/components/legend/index.vue'; let gis = null; @@ -51,72 +51,78 @@ export default { created () { }, mounted () { - this.initMap(); + getInfo().then(res => { + this.initMap(res.user.loginDeptId); + // 加载地图 + }) + }, methods: { // 加载地图 - initMap () { + initMap (deptId) { gis = new GisUtils('map2') gis.addTianDiTuLayer() gis.addAnnotationLayer() const initZoom = 11; + // // 获取资源列表 + this.getResourceList(deptId); //初始加载当前用户级别的geojson数据 - getUserGeo().then((res) => { - if (res.code == 200) { - // 存在geojson数据，加载边界图层，定位到当前位置 - if (res.data.geoJson != null && res.data.geoJson != "") { - // 解析geojson数据,添加轮廓图层 - require(["@/assets/maps/" + res.data.geoJson], (data) => { + // getUserGeo().then((res) => { + // if (res.code == 200) { + // // 存在geojson数据，加载边界图层，定位到当前位置 + // if (res.data.geoJson != null && res.data.geoJson != "") { + // // 解析geojson数据,添加轮廓图层 + // require(["@/assets/maps/" + res.data.geoJson], (data) => { - this.map.addLayer(boundaryLayer); + // this.map.addLayer(boundaryLayer); - //定位查询位置 - const maxXMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.maxX; - const maxYMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.maxY; - const minXMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.minX; - const minYMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.minY; - //获取边界区域的中心位置 - const center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); - this.map.getView().animate({ - // 只设置需要的属性即可 - center: center, // 中心点 - zoom: initZoom, // 缩放级别 - rotation: undefined, // 缩放完成view视图旋转弧度 - duration: 1000, // 缩放持续时间，默认不需要设置 - }); - }); - } else { // 不存在geojson数据，直接定位到当前位置 - gis.getMapContainer().getView().animate({ - // 只设置需要的属性即可 - center: fromLonLat([res.data.lng, res.data.lat]), // 中心点 - zoom: initZoom, // 缩放级别 - rotation: undefined, // 缩放完成view视图旋转弧度 - duration: 1000, // 缩放持续时间，默认不需要设置 - }); - } - //村级组级只定位坐标点 deptLevel： 1 组级、2 村级、3 乡镇级、4 区县级 - if (res.data.deptLevel === '3' || res.data.deptLevel === '4') { - let locationIcon; - if (res.data.deptLevel === '3') { - locationIcon = "red.png"; - } else if (res.data.deptLevel === '4') { - locationIcon = "yellow.png"; - } - //获取用户级别的下级区域 - setTimeout(() => { - getUserGeoList(res.data.deptId).then((res) => { - if (res.code == 200) { - this.addDeptLayer(res.data, require(`./icon/${locationIcon}`)) - } - }); - }, 500); - } else { - let lowestOrder = []; - lowestOrder.push(res.data); - this.addDeptLayer(lowestOrder, require('./icon/green.png')); - } - } - }); + // //定位查询位置 + // const maxXMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.maxX; + // const maxYMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.maxY; + // const minXMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.minX; + // const minYMap = boundaryLayer.values_.source.featuresRtree_.rbush_.data.minY; + // //获取边界区域的中心位置 + // const center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); + // this.map.getView().animate({ + // // 只设置需要的属性即可 + // center: center, // 中心点 + // zoom: initZoom, // 缩放级别 + // rotation: undefined, // 缩放完成view视图旋转弧度 + // duration: 1000, // 缩放持续时间，默认不需要设置 + // }); + // }); + // } else { // 不存在geojson数据，直接定位到当前位置 + // gis.getMapContainer().getView().animate({ + // // 只设置需要的属性即可 + // center: fromLonLat([res.data.lng, res.data.lat]), // 中心点 + // zoom: initZoom, // 缩放级别 + // rotation: undefined, // 缩放完成view视图旋转弧度 + // duration: 1000, // 缩放持续时间，默认不需要设置 + // }); + // } + // //村级组级只定位坐标点 deptLevel： 1 组级、2 村级、3 乡镇级、4 区县级 + // if (res.data.deptLevel === '3' || res.data.deptLevel === '4') { + // let locationIcon; + // if (res.data.deptLevel === '3') { + // locationIcon = "red.png"; + // } else if (res.data.deptLevel === '4') { + // locationIcon = "yellow.png"; + // } + // //获取用户级别的下级区域 + // setTimeout(() => { + // getUserGeoList(res.data.deptId).then((res) => { + // if (res.code == 200) { + // this.addDeptLayer(res.data, require(`./icon/${locationIcon}`)) + // } + // }); + // }, 500); + // } else { + // let lowestOrder = []; + // lowestOrder.push(res.data); + // this.addDeptLayer(lowestOrder, require('./icon/green.png')); + // } + // } + // }); gis.getMapContainer().on("click", (evt) => { let feature = gis.getMapContainer().forEachFeatureAtPixel( @@ -169,6 +175,7 @@ export default { // 获取资源列表 getResourceList (deptId) { getResourceListByDeptId(deptId).then(response => { + console.log(22222, response); if (response.data && response.data.length > 0) { this.addResourceLayer(response.data); }