视频资源表格和地图选中联动

This commit is contained in:
于秀圆 2022-09-28 16:42:35 +08:00
parent f79b43d261
commit a4259cf2d9
5 changed files with 73 additions and 17 deletions

View File

@ -1657,14 +1657,16 @@ export function MapFun(mapObj) {
features,
url,
layerName,
createPopupFun
createPopupFun,
url2
) {
console.log(
'_addResourceOnMapWithoutSuperMapCluster===============>',
features,
url,
layerName,
createPopupFun
createPopupFun,
url2
)
// 0
// if (features.length < 1) {
@ -1685,14 +1687,19 @@ export function MapFun(mapObj) {
let layers = null
//
layers = createMarkerClusterLayer()
const icon = createDefaultFeatureStyle({
const icon1 = createDefaultFeatureStyle({
img: url,
iconSize: [36, 36],
iconSize: [33, 33],
})
const icon2 = createDefaultFeatureStyle({
img: url2,
iconSize: [33, 33],
})
features.map((feature) => {
var bounds = map.getBounds()
// console.log("",feature.latLng);
if ( feature.hasOwnProperty('latLng')) {
let icon = feature.active?icon2:icon1
const marker = L.marker(feature.latLng, { icon })
if (createPopupFun !== null) {
marker.uuid = feature.uuid || ''
@ -1728,6 +1735,8 @@ export function MapFun(mapObj) {
}
marker.on('click', e=>{
console.log('点位数据', e)
mybus.emit('pointMarkerClick', feature)
})
layers.addLayer(marker)
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@ -936,8 +936,26 @@
mapSearchParam.value.gpsX = param.gpsX
mapSearchParam.value.gpsY = param.gpsY
mapSearchParam.value.radius = param.radius
selectedRowKeys.value = [] //
selectedList.value = []
getCamera()
})
//
mybus.off('pointMarkerClick')
mybus.on('pointMarkerClick', (point) => {
console.log("pointMarkerClick->point", selectedList.value,point)
let check = false; //
if(selectedList.value&&selectedList.value.length>0){
selectedList.value.forEach(ele=>{
if(ele.channelCode == point.data.channelCode){
check = true;
}
})
}
let pointData = new Proxy(point.data, point);
onSelectChange(pointData,!check,'','','proxy');
})
})
const selectedList = ref([])
const selectedRowKeys = ref([])
@ -1739,9 +1757,10 @@
pagination.value.pageSize = 10
getCamera()
}
const videoClean = () => {
selectedList.value = []
selectedRowKeys.value = []
const videoClean = () => {
//
// selectedList.value = []
// selectedRowKeys.value = []
videoList.value = []
current.value = 1
}
@ -1926,8 +1945,9 @@
},
])
// const allClick = ref([])
const onSelectChange = (record, selected, selectedRows, nativeEvent) => {
const onSelectChange = (record, selected, selectedRows, nativeEvent,type) => {
console.log('hahhahah', record, selected, selectedRows, nativeEvent)
record = JSON.parse(JSON.stringify(record));
if (selected) {
if (selectedRowKeys.value.length == 1000) {
message.warning('最多只能添加1000个摄像头')
@ -1936,14 +1956,17 @@
selectedRowKeys.value.push(record.channelCode || record.channelId)
}
} else {
selectedList.value = selectedList.value.filter(
(item) => item.idtCameraChannel !== record.idtCameraChannel
)
selectedList.value.forEach((ele,index)=>{
if(ele.channelCode == record.channelCode){
selectedList.value.splice(index,1)
}
})
selectedRowKeys.value.splice(
selectedRowKeys.value.indexOf(record.channelCode || record.channelId),
1
)
}
mybus.emit('selectTablePoint',selectedList.value)
console.log('已选中======================>', selectedList.value)
}
const onSelectAll = (selected, selectedRows, changeRows) => {
@ -1955,9 +1978,14 @@
if (selectedRowKeys.value.length > 1000) {
message.warning('最多只能添加1000个摄像头')
changeRows.map((val) => {
selectedList.value = selectedList.value.filter(
(item) => item.idtCameraChannel !== val.idtCameraChannel
)
// selectedList.value = selectedList.value.filter(
// (item) => item.idtCameraChannel !== val.idtCameraChannel
// )
selectedList.value.forEach((ele,index)=>{
if(ele.channelCode == record.channelCode){
selectedList.value.splice(index,1)
}
})
selectedRowKeys.value.splice(
selectedRowKeys.value.indexOf(val.channelCode || val.channelId),
1
@ -1976,6 +2004,7 @@
})
}
console.log('heiheiheiehiehei', selected, selectedRows, changeRows)
mybus.emit('selectTablePoint',selectedList.value)
}
// tab

View File

@ -125,6 +125,7 @@
gpsY: '',
radius: '',
},
pointAllData:[],
}
},
components: {
@ -158,6 +159,20 @@
this.mapSearchParam.parentId = parentId
this.getCameraByParentId()
})
//
mybus.off('selectTablePoint')
mybus.on('selectTablePoint', (pointlist) => {
console.log("mounted -> pointlist", pointlist)
for(let i=0;i<this.pointAllData.length;i++){
this.pointAllData[i].active = false
for(let j=0;j<pointlist.length;j++){
if(this.pointAllData[i].channelCode == pointlist[j].channelCode){
this.pointAllData[i].active = true
}
}
}
this.addResourceTomap('videoMap', this.pointAllData);
})
},
methods: {
selectedAddress(item, index) {
@ -244,6 +259,7 @@
}
getCameraByCondition(paramsFather).then((res) => {
console.log('根据parent查询摄像头', res.data.data)
this.pointAllData = res.data.data
this.addResourceTomap('videoMap', res.data.data)
})
}
@ -357,12 +373,13 @@
dataEvent.push({
latLng: { lat: Number(item.gpsY), lng: Number(item.gpsX) },
data: item,
active: item.active,
type: 'videoSurveillance',
})
}
})
console.log('上图数据', dataEvent)
this.getMapPoint(dataEvent, 'videoSurveillance.png', type)
this.getMapPoint(dataEvent, 'icon_camare.png', type)
},
getMapPoint(data, img, type) {
// this.hiMapFun.clearAllLayers();
@ -372,7 +389,8 @@
features,
img,
type,
createCameraDetailsPop
createCameraDetailsPop,
'icon_camare_active.png'
)
},
@ -546,7 +564,7 @@
position: absolute;
bottom: 0.1rem;
right: 0.1rem;
z-index: 1001;
z-index: 988;
cursor: pointer;
}
.address-auto-complete-input {