75 lines
1.4 KiB
Vue
75 lines
1.4 KiB
Vue
<template>
|
|
<div class="main">
|
|
<div class="mapBox" v-if="showMap">
|
|
<map
|
|
id="myMap"
|
|
:longitude="seatInfo.longitude"
|
|
:latitude="seatInfo.latitude"
|
|
:markers="markers"
|
|
class="map"
|
|
show-location
|
|
></map>
|
|
|
|
<div class="searchBox">
|
|
<div class="searchTop">
|
|
<image class="searchIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
seatInfo: {
|
|
longitude: 0,
|
|
latitude: 0,
|
|
},
|
|
showMap: false,
|
|
};
|
|
},
|
|
onLoad() {
|
|
this.mapCtx = uni.createMapContext("myMap");
|
|
|
|
let seatInfo = uni.getStorageSync("seatInfo");
|
|
if (seatInfo) {
|
|
this.seatInfo = JSON.parse(seatInfo);
|
|
this.showMap = true;
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.main {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
.mapBox {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
position: relative;
|
|
.map {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 1;
|
|
}
|
|
.searchBox {
|
|
width: calc(100vw - 64rpx);
|
|
box-sizing: border-box;
|
|
padding: 16rpx 24rpx;
|
|
background: #fff;
|
|
box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(19, 15, 5, 0.1);
|
|
border-radius: 8rpx;
|
|
position: absolute;
|
|
top: 32rpx;
|
|
left: 32rpx;
|
|
z-index: 2;
|
|
}
|
|
}
|
|
}
|
|
</style> |