Browse Source

地图

devlop
mo-bai 4 years ago
parent
commit
7a8ffd86e5
3 changed files with 39 additions and 9 deletions
  1. 28
      components/bussiness-components/packingStationItem.vue
  2. 16
      components/qn-map/qn-map.nvue
  3. 4
      pages/client/index.nvue

28
components/bussiness-components/packingStationItem.vue

@ -4,11 +4,11 @@
<image class="image" :src="info.enterpriseLogo || 'https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif'"></image>
<view class="content">
<view class="title">
<text class="text">{{ info.enterpriseName }}</text>
<text class="text" style="width:410rpx;">{{ info.enterpriseName }}123123123</text>
<image class="icon" :src="info.whetherCooperation ? '/static/imgs/general/cooperation-icon.png' : '/static/imgs/general/no-cooperation-icon.png'"></image>
</view>
<view class="desc">
<text>{{ transformBusiness(info.business) }}</text>
<text class="text" style="width:520rpx;">{{ transformBusiness(info.business) }}</text>
</view>
<view v-if="info.whetherCooperation === 1" class="box-area">
<view class="box">
@ -55,12 +55,12 @@
<view class="other">
<view class="box">
<image class="icon" src="/static/imgs/client-list/navigation-icon.png"></image>
<text class="text">{{ info.detailedAddress || '未知' }}</text>
<text class="text" style="width:248rpx;">{{ info.detailedAddress || '未知' }}</text>
</view>
<view class="divide"></view>
<view class="box">
<image class="icon" src="/static/imgs/client-list/phone-icon.png"></image>
<text class="text">{{ info.legalPerson + ' ' + transformPhoneNum(info.contactNumber) }}</text>
<text class="text" style="width:248rpx;">{{ info.legalPerson + ' ' + transformPhoneNum(info.contactNumber) }}</text>
</view>
</view>
</view>
@ -129,6 +129,7 @@ export default {
width: 750rpx;
background-color: #fff;
.info {
width: 750rpx;
padding: 30rpx 32rpx 48rpx;
border-bottom: 2rpx solid #dddddd;
@ -145,11 +146,15 @@ export default {
.content {
flex-grow: 1;
.title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
flex-wrap: nowrap;
.text {
lines:1;
text-overflow: ellipsis;
font-size: 32rpx;
color: #000000;
font-weight: 600;
@ -164,8 +169,11 @@ export default {
}
.desc {
margin-top: 14rpx;
font-size: 26rpx;
color: #333333;
.text {
font-size: 26rpx;
color: #333333;
}
}
.box-area {
margin-top: 30rpx;
@ -220,10 +228,18 @@ export default {
margin-right: 10rpx;
}
.text {
font-size: 24rpx;
color: #555555;
lines:1;
text-overflow: ellipsis;
}
}
}
}
</style>
<style>
.test {
overflow: hidden;
}
</style>

16
components/qn-map/qn-map.nvue

@ -45,6 +45,10 @@ export default {
},
mounted() {
this.mapContext = uni.createMapContext('qnMap', this)
this.mapContext.onstatuschanged = function(e) {
console('change:',e)
}
console.log('mapContetxt:',this.mapContext.onstatuschanged)
},
watch: {
// 只监听items一层变化
@ -124,8 +128,10 @@ export default {
this.selectedId = e.detail.markerId
},
dragMap() {
console.log('drag begin')
this.mapContext.getCenterLocation({
success: (res) => {
console.log('dragMap success:',res)
// 抛出移动事件
this.$emit('dragMap', {
longitude: res.longitude,
@ -134,7 +140,10 @@ export default {
})
this.centerPoint.longitude = res.longitude
this.centerPoint.latitude = res.latitude
}
},
fail:(err) =>{
console.log('dragMap err:',err)
}
})
},
scaleMap() {
@ -152,12 +161,15 @@ export default {
})
},
regionchange(e) {
if (this.timer) {
clearTimeout(this.timer)
this.timer = null
}
console.log('e timer after:',e)
let eventName = e.causedBy || e.detail.causedBy
this.timer = setTimeout(() => {
switch (e.causedBy) {
switch (eventName) {
case 'drag':
this.dragMap()
break

4
pages/client/index.nvue

@ -133,7 +133,9 @@ export default {
type: 'wgs84',
success: (res) => {
console.log('location success', res)
const { lat, lon } = wgs84togcj02(res.latitude, res.longitude)
let result = wgs84togcj02(res.latitude, res.longitude)
console.log('result:',result)
const { lat, lon } = result
this.$refs.qnMap.moveTo({ latitude: lat, longitude: lon })
},
fail: (err) => {

Loading…
Cancel
Save