彭刘杨大屏

This commit is contained in:
yanran200730
2022-09-29 17:53:30 +08:00
parent a8347e622d
commit 843a5b83c5

View File

@@ -254,21 +254,19 @@ export default {
var urlType = ''
if (context.data[0].communityName == context.data[0].buildingNumber) { //宅基地
urlType = 1
el = `<div class="mark" id="buildId-${buildId}" style="${buildId === this.chooseBuildId ? 'background-color:#2266FF' : 'background-color:#FF701A'}">
el = `<div id="buildId-${buildId}" class="mark ${buildId === this.chooseBuildId ? 'mark-active' : ''}">
<div class="mark-contaienr">
<span>${context.data[0].areaName}</span>&nbsp;&nbsp;
<span>${context.data[0].communityName}</span>
</div>
<div class="arrow" style="${buildId === this.chooseBuildId ? 'border-top-color: #2266FF' : 'border-top-color:#FF701A'}"></div>
</div>`
} else {
urlType = 0
el = `<div class="mark" id="buildId-${buildId}" style="${buildId === this.chooseBuildId ? 'background-color:#2266FF' : ''}">
el = `<div id="buildId-${buildId}" class="mark ${buildId === this.chooseBuildId ? 'mark-active' : ''}">
<div class="mark-contaienr">
<span>${context.data[0].communityName}</span>&nbsp;&nbsp;
<span>${context.data[0].buildingNumber}栋</span>
</div>
<div class="arrow" style="${buildId === this.chooseBuildId ? 'border-top-color: #2266FF' : ''}"></div>
</div>`
}
@@ -283,12 +281,9 @@ export default {
this.getBuildInfo(e.target.id, e.target.urlType)
context.marker.setContent(el);
document.querySelectorAll('.mark').forEach(el => {
el.style['background-color'] = '#0F8F64'
el.querySelector('.arrow').style['border-top-color'] = '#0F8F64'
el.classList.remove('mark-active')
})
document.querySelector(`#buildId-${e.target.id}`).style['background-color'] = '#2266FF'
document.querySelector(`#buildId-${e.target.id}`).querySelector('.arrow').style['border-top-color'] = '#2266FF'
// this.map.setZoomAndCenter(this.map.getZoom() + 2 + 0.00001, e.target.lnglat, false, 300)
document.querySelector(`#buildId-${e.target.id}`).classList.add('mark-active')
})
},
@@ -625,9 +620,17 @@ export default {
display: flex;
align-items: center;
justify-content: center;
background-color: #0F8F64;
box-sizing: border-box;
padding: 0 12px;
background: rgba(0,39,100,0.50);
border: 1px solid #36A5FF;
border-radius: 30px;
&.mark-active {
background: #004AC0;
border: 1px solid transparent;
box-shadow: inset 0 0 8px 2px #33BBFF;
}
.mark-contaienr {
color: white;