|
|
|
|
@ -36,10 +36,10 @@ |
|
|
|
|
<uni-popup ref="popup" background-color="#fff" @change="popupChange"> |
|
|
|
|
<view class="popup-title">图层叠加</view> |
|
|
|
|
<view class="popup-content uni-flex uni-row" style="align-items: center;justify-content: center;"> |
|
|
|
|
<view class="uni-flex uni-row" style="justify-content: space-around;flex:1;"> |
|
|
|
|
<layer-checkbox v-for="item in layerItems" :icon="item.icon" :label="item.text" |
|
|
|
|
:value="item.value" @change="checkLayer" |
|
|
|
|
:checked="currentLayers.indexOf(item.value)>-1"></layer-checkbox> |
|
|
|
|
<view class="uni-flex uni-row" style="flex:1;flex-wrap: wrap;"> |
|
|
|
|
<layer-checkbox v-for="(item,i) in layerItems" :icon="item.icon" :label="item.text" :value="i" |
|
|
|
|
@change="checkLayer" :checked="currentLayers.indexOf(i)>-1" |
|
|
|
|
:iconStyle="item.iconStyle"></layer-checkbox> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</uni-popup> |
|
|
|
|
@ -116,31 +116,7 @@ |
|
|
|
|
}, |
|
|
|
|
currentLayers: [], |
|
|
|
|
currentLayer: null, |
|
|
|
|
layerItems: [{ |
|
|
|
|
text: '生态修复工程', |
|
|
|
|
value: 'stxfgc', |
|
|
|
|
icon: 'stxfgc', |
|
|
|
|
zIndex: 99, |
|
|
|
|
detailUrl: '/stxh/appDetails' |
|
|
|
|
}, { |
|
|
|
|
text: '征占用', |
|
|
|
|
value: 'cdzzy_view', |
|
|
|
|
icon: 'zzy', |
|
|
|
|
zIndex: 88, |
|
|
|
|
detailUrl: '/cdzhy/appDetails' |
|
|
|
|
}, { |
|
|
|
|
text: '非法占用', |
|
|
|
|
value: 'ffzy_layer', |
|
|
|
|
icon: 'ffzy', |
|
|
|
|
zIndex: 77, |
|
|
|
|
detailUrl: '/cdzhy/appFfzyDetails' |
|
|
|
|
}, { |
|
|
|
|
text: '草地', |
|
|
|
|
value: 't_grassland_result', |
|
|
|
|
icon: 'cd', |
|
|
|
|
zIndex: 66, |
|
|
|
|
detailUrl: '/cdzy/appDetails' |
|
|
|
|
}], |
|
|
|
|
layerItems: [], |
|
|
|
|
detailItems: [], |
|
|
|
|
detailGroups: [], |
|
|
|
|
currentGroupTab: null, |
|
|
|
|
@ -158,9 +134,10 @@ |
|
|
|
|
if (newVal) { |
|
|
|
|
this.mapData = { |
|
|
|
|
layerOpts: newVal?.map(val => { |
|
|
|
|
const item = this.layerItems.find(l => l.value === val); |
|
|
|
|
const item = this.layerItems[val]; |
|
|
|
|
return { |
|
|
|
|
layerName: val, |
|
|
|
|
layerName: item.value, |
|
|
|
|
layerIndex: val, |
|
|
|
|
...item |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
@ -196,10 +173,11 @@ |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
this.compassHandler = res => { |
|
|
|
|
console.log(res) |
|
|
|
|
this.compassNum = res.direction; |
|
|
|
|
} |
|
|
|
|
uni.onCompassChange(this.compassHandler); |
|
|
|
|
|
|
|
|
|
this.loadLayerItems(); |
|
|
|
|
}, |
|
|
|
|
onShow() { |
|
|
|
|
uni.startCompass() |
|
|
|
|
@ -208,7 +186,34 @@ |
|
|
|
|
uni.stopCompass(); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
loadLayerItems() { |
|
|
|
|
uni.request({ |
|
|
|
|
url: `${helper.mgServerUrl}/app/config/layer`, |
|
|
|
|
header: { |
|
|
|
|
Authorization: `Bearer ${this.token}` |
|
|
|
|
}, |
|
|
|
|
success: (resp) => { |
|
|
|
|
console.log(resp) |
|
|
|
|
if (resp.data.data) { |
|
|
|
|
const item = resp.data.data; |
|
|
|
|
this.layerItems = item?.layerItems.map(layerItem => { |
|
|
|
|
return { |
|
|
|
|
text: layerItem.title, |
|
|
|
|
value: layerItem.layerName, |
|
|
|
|
icon: layerItem.icon, |
|
|
|
|
zIndex: 99, |
|
|
|
|
detailUrl: layerItem.detailUrl, |
|
|
|
|
geoserverUrl: layerItem.geoserverUrl || item.geoserverUrl, |
|
|
|
|
layerWorkspace: layerItem.layerWorkspace || item.layerWorkspace, |
|
|
|
|
...layerItem |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
checkLayer(value) { |
|
|
|
|
console.log('check', value) |
|
|
|
|
const index = this.currentLayers.findIndex(l => l === value); |
|
|
|
|
if (index > -1) { |
|
|
|
|
this.currentLayers.splice(index, 1); |
|
|
|
|
@ -251,8 +256,9 @@ |
|
|
|
|
}, |
|
|
|
|
showFfzy(id) { |
|
|
|
|
console.log(id) |
|
|
|
|
if (!this.currentLayers.find(l => l === 'ffzy_layer')) { |
|
|
|
|
this.currentLayers.push('ffzy_layer') |
|
|
|
|
const ffzyLayerIndex = this.layerItems.findIndex(item => item.value === 'ffzy_layer') |
|
|
|
|
if (!this.currentLayers.find(l => l === ffzyLayerIndex)) { |
|
|
|
|
this.currentLayers.push(ffzyLayerIndex) |
|
|
|
|
} |
|
|
|
|
uni.request({ |
|
|
|
|
url: `${helper.serverUrl}/ffzy/ffzy/${id}`, |
|
|
|
|
@ -356,9 +362,9 @@ |
|
|
|
|
|
|
|
|
|
// } |
|
|
|
|
const apis = []; |
|
|
|
|
this.layerItems.forEach(item => { |
|
|
|
|
const layerStr = this.currentLayers.find(l => l === item.value); |
|
|
|
|
if (layerStr) { |
|
|
|
|
this.layerItems.forEach((item, i) => { |
|
|
|
|
const layerIndex = this.currentLayers.findIndex(l => l === i); |
|
|
|
|
if (layerIndex > -1) { |
|
|
|
|
apis.push(item.detailUrl); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
@ -483,20 +489,21 @@ |
|
|
|
|
}) || [] |
|
|
|
|
const layers = newValue.layerOpts.map(opt => { |
|
|
|
|
let layer = businessLayers.find(l => { |
|
|
|
|
return l.get('businessName') === opt.layerName; |
|
|
|
|
return l.get('businessIndex') === opt.layerIndex; |
|
|
|
|
}) |
|
|
|
|
if (!layer) { |
|
|
|
|
layer = new Image({ |
|
|
|
|
businessId: 'business-layer', |
|
|
|
|
businessName: opt.layerName, |
|
|
|
|
businessIndex: opt.layerIndex, |
|
|
|
|
source: new ImageWMS({ |
|
|
|
|
ratio: 1, |
|
|
|
|
url: `${helper.geoserverUrl}/geoserver/yzt/wms`, |
|
|
|
|
url: `${opt.geoserverUrl}/geoserver/yzt/wms`, |
|
|
|
|
params: { |
|
|
|
|
'FORMAT': 'image/png', |
|
|
|
|
'VERSION': '1.1.1', |
|
|
|
|
"STYLES": '', |
|
|
|
|
"LAYERS": `yzt:${opt.layerName}`, |
|
|
|
|
"STYLES": opt.layerStyle || '', |
|
|
|
|
"LAYERS": `${opt.layerWorkspace}:${opt.layerName}`, |
|
|
|
|
"exceptions": 'application/vnd.ogc.se_inimage', |
|
|
|
|
} |
|
|
|
|
}), |
|
|
|
|
@ -511,8 +518,8 @@ |
|
|
|
|
}) |
|
|
|
|
vectorLayer.getSource().clear(); |
|
|
|
|
businessLayers.forEach(layer => { |
|
|
|
|
const index = newValue.layerOpts.findIndex(opt => opt.layerName === layer.get( |
|
|
|
|
'businessName')); |
|
|
|
|
const index = newValue.layerOpts.findIndex(opt => opt.layerIndex === layer.get( |
|
|
|
|
'businessIndex')); |
|
|
|
|
if (index === -1) { |
|
|
|
|
layer.setVisible(false); |
|
|
|
|
} |
|
|
|
|
|