增加地图当前位置的图标,优化切换页面时图片拉伸问题,优化地图标记和气泡点击事件方法

youmengting-dev
游梦婷 1 year ago
parent 126ed23251
commit edfaee6bc5
  1. 82
      pages/tabBar/category/category.vue
  2. 10
      pages/tabBar/user/user.vue
  3. 4
      physical-merchants/classify/goodsDetail/goodsDetail.vue
  4. BIN
      static/img/location.png
  5. BIN
      static/img/user/user1.png
  6. BIN
      static/img/user/user14.png
  7. BIN
      static/img/user/user2.png
  8. BIN
      static/img/user/user3.png
  9. BIN
      static/img/user/user4.png
  10. BIN
      static/img/user/user6.png

@ -1,8 +1,8 @@
<template>
<view class="map-container">
<!-- #ifdef H5 -->
<map style="width: 100%; height: 10vh;" :style="{height:mapheight}" :latitude="latitude" :longitude="longitude"
:markers="marker" :scale="scale" @markertap="markertap" @callouttap='callouttap'>
<map id="myMap" style="width: 100%; height: 10vh;" :style="{height:mapheight}" :latitude="latitude"
:longitude="longitude" :markers="marker" :scale="scale" @markertap="markertap" @callouttap='callouttap'>
<cover-view class="cover-view-loca" :style='{bottom:coverbottom}' @click="onControltap">
<cover-image class="cover-image" src="../../../static/img/dispos.png"></cover-image>
</cover-view>
@ -107,8 +107,8 @@
<!-- #endif -->
<!-- #ifdef MP -->
<map style="width: 100%; height: 10vh;" :style="{height:mapheight}" :latitude="latitude" :longitude="longitude"
:markers="marker" :scale="scale" @markertap="markertap" @callouttap='callouttap'>
<map id="myMap" style="width: 100%; height: 10vh;" :style="{height:mapheight}" :latitude="latitude"
:longitude="longitude" :markers="marker" :scale="scale" @markertap="markertap" @callouttap='callouttap'>
<cover-view class="cover-view-loca" :style='{bottom:coverbottom}' @click="onControltap">
<cover-image class="cover-image" src="../../../static/img/dispos.png"></cover-image>
</cover-view>
@ -123,10 +123,10 @@
<view class="width100 mart15 backcorfff cover-viewchage alijus fotct" style="border-radius: 22px;">
<!-- :class="[selectFirst == 1? 'onchange' : '']" -->
<view class="font14 width30w fotct onchange text1" @click="changeChilerType()">{{selectFirstName}}
<image mode="widthFix" class="margle" style="width: 8px;" :src="imagewxUrl+imgadres2"></image>
<image mode="aspectFit" class="margle" style="width: 8px;height:8px;" :src="imagewxUrl+imgadres2"></image>
</view>
<view class="font14 width30w onchange" @click="changeChilerdistance()">{{distanceName}}
<image mode="widthFix" class="margle" style="width: 8px;" :src="imagewxUrl+imgadres2"></image>
<image mode="aspectFit" class="margle" style="width: 8px;height:8px;" :src="imagewxUrl+imgadres2"></image>
</view>
<view class="font14 width30w">
<!-- 全部
@ -222,13 +222,14 @@
return {
latitude: '', //
longitude: '', //
mapContext: null,
scale: 13, //
bottomData: false,
imagewxUrl: app.globalData.imageWxImg,
imgadres2: 'xiala.png',
imgadres3: 'noorder.png',
imgadres4: 'dh.png',
marker: '', //
marker: [], //
typeid: 99999999, //
isSelected: 1, //
selectFirst: '99999999', //
@ -282,11 +283,17 @@
typeplat: 1 //
}
},
onLoad() {},
onLoad() {
this.onControltap();
},
onReady() {
this.mapContext = uni.createMapContext('myMap');
console.log(this.mapContext)
},
onShow() {
// this.latitude = app.globalData.latitude;
// this.longitude = app.globalData.longitude;
this.onControltap();
/* this.onControltap(); */
},
computed: {
mapheight() {
@ -359,10 +366,24 @@
getMapStore(datas).then(res => {
uni.hideLoading();
if (res.return_code == '000000') {
this.marker = res.return_data
this.marker = res.return_data;
// console.log(this.marker,"marker")
} else {
this.marker = [];
}
this.marker.push({
id: 0,
latitude: this.latitude,
longitude: this.longitude,
iconPath: '/static/img/location.png',
rotate: 1,
alpha: 1,
width: 40,
height: 40
})
})
},
//
@ -379,27 +400,26 @@
this.selectChilerdistance = 2;
this.getMapStore();
},
//
//,
markertap(e) {
// #ifdef H5
// console.log(e,"");
let markerId = e.detail.markerId;
if(markerId == 0) return; /* 点击当前自己定位的标记点*/
for (var i = 0; i < this.marker.length; i++) {
if (markerId == this.marker[i].id) {
this.seeloaction(this.marker[i]);
}
}
// #endif
},
//
//,
callouttap(e) {
// #ifdef MP
let markerId = e.markerId;
// console.log(e, "")
let markerId = e.detail.markerId;
for (var i = 0; i < this.marker.length; i++) {
if (markerId == this.marker[i].id) {
this.seeloaction(this.marker[i]);
}
}
// #endif
},
postionIng() {
@ -523,6 +543,18 @@
// console.log(res, '')
this.longitude = res.longitude;
this.latitude = res.latitude;
if(this.mapContext){
this.mapContext.moveToLocation({
latitude: this.latitude,
longitude: this.longitude,
success(res){
// console.log(res,"")
}
})
}
console.log(this.longitude, this.latitude, "this.longitude,this.latitude")
this.getIndustry();
},
fail() {
@ -585,18 +617,26 @@
this.isSelected = item;
},
seeloaction(item) {
// #ifdef H5
console.log(item,"item");
uni.openLocation({
latitude: parseFloat(item.latitude), //
longitude: parseFloat(item.longitude), //
name: item.callout.content,
address: item.callout.address
})
/*
window.location.href =
`http://apis.map.qq.com/uri/v1/marker?marker=coord:(${item.latitude},${item.longitude})&addr:${item.address}`;
// #endif
// #ifdef MP
uni.openLocation({
latitude: Number(item.latitude), //
longitude: Number(item.longitude), //
name: item.store_name,
address: item.address
})
// #endif
*/
},
}
}

@ -50,7 +50,7 @@
<view class="title width94">
<view class="width70 fontwig6">订单</view>
<view class="width30 alijusend font14 fcor999" @click="toOrderList(-1)">全部订单<image class="icon15"
mode="widthFix" src="../../../static/img/jt.png">
mode="aspectFit" style="width: 15px;height: 15px;" src="../../../static/img/jt.png">
</image>
</view>
</view>
@ -65,7 +65,7 @@
v-if="row.text == '已完成' && whetherCheckNum " :text="whetherCheckNum" type="error" size="normal">
</uni-badge>
<view class="img">
<image :src="row.icon" class="icon40" mode="widthFix"></image>
<image :src="row.icon" class="icon40" style="width: 40px;height: 40px;" mode="aspectFit"></image>
</view>
<view class="text mart10">{{row.text}}</view>
</view>
@ -111,13 +111,13 @@
<view class="order">
<view class="title width94">
<view class="width70 fontwig6 alijusstart">我的资产
<image mode="widthFix" class="icon30" v-if="assetsstu == 2" @click="updatestu(2)"
<image mode="aspectFit" style="width: 20px;height: 20px;" class="icon20 margle" v-show="assetsstu == 2" @click="updatestu(2)"
src="../../../static/img/user/user6.png"></image>
<image mode="widthFix" class="icon20 margle" v-if="assetsstu == 1" @click="updatestu(1)"
<image mode="aspectFit" style="width: 20px;height: 20px;" class="icon20 margle" v-show="assetsstu == 1" @click="updatestu(1)"
src="../../../static/img/user/user14.png"></image>
</view>
<view class="width30 alijusend font14 fcor999" @click="jumppage(4)">进入卡包<image class="icon15"
mode="widthFix" src="../../../static/img/jt.png">
mode="aspectFit" style="width: 15px;height: 15px;" src="../../../static/img/jt.png">
</image>
</view>
</view>

@ -412,7 +412,7 @@
} else if (item.type == 3) {
/* 分享给好友 */
// #ifdef H5
console.log("点击了分享好友")
// console.log("")
this.rightTopSrc="../../static/img/rightTop.png"
setTimeout(()=>{
@ -463,7 +463,7 @@
}
if (e.index == 1) {
console.log("点击分享")
// console.log("")
this.$refs.share.toggleMask();
return

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 795 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 904 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.2 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.7 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

Loading…
Cancel
Save