彭刘杨大屏

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 = '' var urlType = ''
if (context.data[0].communityName == context.data[0].buildingNumber) { //宅基地 if (context.data[0].communityName == context.data[0].buildingNumber) { //宅基地
urlType = 1 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"> <div class="mark-contaienr">
<span>${context.data[0].areaName}</span>&nbsp;&nbsp; <span>${context.data[0].areaName}</span>&nbsp;&nbsp;
<span>${context.data[0].communityName}</span> <span>${context.data[0].communityName}</span>
</div> </div>
<div class="arrow" style="${buildId === this.chooseBuildId ? 'border-top-color: #2266FF' : 'border-top-color:#FF701A'}"></div>
</div>` </div>`
} else { } else {
urlType = 0 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"> <div class="mark-contaienr">
<span>${context.data[0].communityName}</span>&nbsp;&nbsp; <span>${context.data[0].communityName}</span>&nbsp;&nbsp;
<span>${context.data[0].buildingNumber}栋</span> <span>${context.data[0].buildingNumber}栋</span>
</div> </div>
<div class="arrow" style="${buildId === this.chooseBuildId ? 'border-top-color: #2266FF' : ''}"></div>
</div>` </div>`
} }
@@ -283,12 +281,9 @@ export default {
this.getBuildInfo(e.target.id, e.target.urlType) this.getBuildInfo(e.target.id, e.target.urlType)
context.marker.setContent(el); context.marker.setContent(el);
document.querySelectorAll('.mark').forEach(el => { document.querySelectorAll('.mark').forEach(el => {
el.style['background-color'] = '#0F8F64' el.classList.remove('mark-active')
el.querySelector('.arrow').style['border-top-color'] = '#0F8F64'
}) })
document.querySelector(`#buildId-${e.target.id}`).style['background-color'] = '#2266FF' document.querySelector(`#buildId-${e.target.id}`).classList.add('mark-active')
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)
}) })
}, },
@@ -625,9 +620,17 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background-color: #0F8F64;
box-sizing: border-box; box-sizing: border-box;
padding: 0 12px; 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 { .mark-contaienr {
color: white; color: white;