819527061@qq.com
2024-07-03 01c82e2ed527bae42fe53452073522d74980bf16
pages/driver-page/driver-index/bill-of-lading-details/BaseMapDetail/index.vue
@@ -4,13 +4,32 @@
               :latitude="latitude"
               :longitude="longitude"
               :markers="markers"></map>
        <!--弹窗 -->
        <u-popup
        overlayOpacity="0"
        :overlayStyle="{
            'display':'none',
        }"
        round="10"
        :show="show" mode="bottom"  @close="close" @open="open">
        <view class="contont">
           <h4>{{ markers[0].callout.content  }}</h4>
         <view class="title"><img :src="daohangIcon" alt="" style="width: 60rpx;height: 60rpx;">唐山市丰南区黄各庄镇宣庄二街</view>
         <view class="footerText">
         {{ markers[0].callout.text   }}
         </view>
        </view>
   </u-popup>
    </div>
</template>
<script>
import daohangIcon  from '@/static/image/无人值守/司机端首页/daohang.jpg'
export default {
    data() {
         return {
                show:false,
            daohangIcon,
            latitude: 38.04606544104117,
            longitude: 114.48735479816793,
            customerId: '',
@@ -36,7 +55,8 @@
                     borderRadius: 12, //边框圆角
                     borderWidth: '10',
                     bgColor: '#08b078', //背景颜色
                     display: 'ALWAYS' //常显
                     display: 'ALWAYS' ,//常显,
                     text:'',
                  }
               },
               {
@@ -73,10 +93,52 @@
            toLocation: {}
         };
      },
        onLoad(params){
           if(params){
            this.markers[0].latitude  = Number(params.latitude) ;
            this.markers[0].longitude = Number( params.longitude);
            this.longitude = Number( params.longitude);
            this.latitude = Number(params.latitude);
            this.markers[0].callout.content = params.name;
         this.markers[0].callout.text = params.brief;
            console.log( this.markers)
            this.show = true;
           }
        }
}
</script>
<style lang="scss">
<style lang="scss" scoped>
.u-transition{
    display: none!important;
}
.contont{
    height: 300rpx;
   width: 92%;
   h4{
      color: #212121;
      font-size: 30rpx;
      font-weight: bold;
      margin-left: 20rpx;
      margin-top: 20rpx;
   }
   .title{
      font-size: 24rpx;
      display: flex;
      margin-left: 15rpx;
      align-items: center;
      margin-top: 15rpx;
      color:#676767 ;
   }
   .footerText{
      margin-left: 35rpx;
      color: #676767;
      font-size: 24rpx;
   }
}
</style>