如题
- 发布:2018-10-19 10:58
- 更新:2018-10-23 12:47
- 阅读:1660
轩哥哥 (作者) - 前端工程师
<template>
<view class="contentbox">
<view class="searchbar">
<view class="index-left" @click="navtotabcity">
<text>{{nowcity}}</text>
<image src="../../static/images/home_switch.png" mode=""></image>
</view>
<view class="index-center">
<view class="section index-center-box">
<input @input="KeyInput" placeholder="请输入想要去的地点" type="text" :value="searchtext" />
<image :src="searchurl" mode="" @tap="navtosearch"></image>
</view>
</view>
<view class="index-right" @click="navtoaroundsite">
<image src="../../static/images/home_list.png" mode=""></image>
</view>
</view>
<view class="page-section page-section-gap map">
<map :latitude="latitude" :longitude="longitude" :markers="covers" :scale="scale" @markertap="makertap" @tap="maptap">
</map>
</view>
<view class="index-bottom" v-if="conditionA">
<view class="index-bottom-header">
{{name}}
</view>
<view class="index-bottom-center">
<view class="index-bottom-left">
<text class="free">空闲:</text>
<text class="freenum">{{num}}</text>
</view>
<view class="index-bottom-right">
<image :src="distanceurl" mode=""></image>
<text>{{distance}}km</text>
</view>
</view>
<view class="index-bottom-footer">
<view class="index-bottom-left" @click="navtoend">
<image :src="navurl" mode=""></image>
<text>导航</text>
</view>
<view class="index-bottom-right" @click="navtodetail">
<image :src="detailurl" mode=""></image>
<text>详情</text>
</view>
</view>
</view>
</view>
</template>
<script>
var util = require('../../common/util.js');
export default {
data() {
return {
searchurl: "https://ws1.sinaimg.cn/large/005Pzapdly1ft3dvnmrr1j301c01cgld.jpg",
distanceurl: "https://ws1.sinaimg.cn/large/005Pzapdly1ftclmii7ltj301k01k741.jpg",
navurl: "https://ws1.sinaimg.cn/large/005Pzapdly1ftclmkioxjj301k01k741.jpg",
detailurl: "https://ws1.sinaimg.cn/large/005Pzapdly1ftclm660a8j301k01kmwx.jpg",
nowcity: "城市",
title: 'map',
latitude: 0,
longitude: 0,
latitudeA: 0,
longitudeA: 0,
scale: 13,
covers: [],
num: "",
address: "",
distance: "",
conditionA: false,
name: "",
searchtext: ""
}
},
onLoad() {
var that = this
uni.setStorageSync('reload', true)
uni.setStorageSync('loginstate', true)
uni.getLocation({
type: 'gcj02',
success: function(res) {
let slat = (res.latitude).toFixed(6)
let slng = (res.longitude).toFixed(6)
that.latitude = slat
that.longitude = slng
let url = "/station/select"
let data = {
slat: slat,
slng: slng
}
let obj = function(arr, i, iconpath, markersarr) {
let obj = {
iconPath: iconpath,
id: i,
num: arr[i].num,
latitude: arr[i].slat,
longitude: arr[i].slng,
distance: arr[i].distance,
statenum: 0,
width: 25,
height: 35,
saddress: arr[i].saddress,
sname: arr[i].sname
}
markersarr[i] = obj
};
let dosuccess = function(res) {
console.log(res)
let arr = res.data.info.listItems
let city = res.data.info.local.cityName
that.nowcity = city
let markaddress = []
for (let i = 0; i < arr.length; i++) {
let obj = {
"name": arr[i].saddress
}
markaddress[i] = obj
}
uni.setStorageSync("markaddress", markaddress);
let markersarr = []
for (var i = 0; i < arr.length; i++) {
if (arr[i].num !== 0) {
let iconpath = "../../static/images/free.png";
obj(arr, i, iconpath, markersarr)
} else {
let iconpath = "../../static/images/full.png";
obj(arr, i, iconpath, markersarr)
}
}
that.covers = markersarr
uni.setStorageSync('markersarr', markersarr);
};
uni.setStorageSync('latitude', slat);
uni.setStorageSync('longitude', slng);
util.nav(url, "GET", data, dosuccess)
}
})
},
onShow() {
var that = this
that.searchtext = ""
uni.setStorageSync("searchtext", "")
let city = uni.getStorageSync('nowcity')
console.log(city)
if (city) {
let flag = uni.getStorageSync('reload')
if (flag) {
uni.setStorageSync('reload', false)
uni.switchTab({
url: 'index',
})
}
let slatA = uni.getStorageSync('latitudeA');
let slngA = uni.getStorageSync('longitudeA');
that.nowcity = city
that.latitude = slatA
that.longitude = slngA
}
let Sn = uni.getStorageSync('loginphone')
let url = '/charge/selectSnList'
let data = {
phone: Sn,
}
let dosuccess = function(res) {
if (res.data.info.length >= 1) {
let SnA = res.data.info[0].transactionSn
console.log(SnA)
uni.setStorageSync("transactionSn", SnA)
let status = res.data.info[0].status
// if (status == 0) {
// uni.navigateTo({
// url: "../charge/charge"
// })
// } else if (status == 1) {
// uni.navigateTo({
// url: "../charge/charge"
// })
// } else if (status == 2) {
// uni.showToast({
// title: '充电停止',
// duration: 2000
// });
// }
}
}
util.nav(url, "GET", data, dosuccess)
},
methods: {
KeyInput: function(e) {
uni.setStorageSync("searchtext", e.detail.value)
},
maptap: function() {
var that = this
let mark = that.covers
if (that.conditionA === true) {
that.conditionA = false;
}
for (var index in mark) {
if (mark[index].statenum % 2 === 1) {
mark[index].statenum++;
}
}
},
navtosearch: function() {
let text = uni.getStorageSync("searchtext")
if (text == "") {
uni.showToast({
icon: "none",
title: "请输入搜索内容"
})
} else {
uni.navigateTo({
url: 'searchsite/searchsite'
});
}
},
makertap: function(e) {
var that = this
let mark = that.covers
let statenum = mark[e.mp.markerId].statenum
if (statenum % 2 === 0) {
mark[e.mp.markerId].statenum++;
that.conditionA = true;
that.num = mark[e.mp.markerId].num;
that.address = mark[e.mp.markerId].saddress;
that.distance = mark[e.mp.markerId].distance;
that.name = mark[e.mp.markerId].sname;
that.latitudeA = mark[e.mp.markerId].latitude;
that.longitudeA = mark[e.mp.markerId].longitude;
uni.setStorageSync('navname', mark[e.mp.markerId].sname);
uni.setStorageSync('latitudeA', mark[e.mp.markerId].latitude);
uni.setStorageSync('longitudeA', mark[e.mp.markerId].longitude);
that.distance = mark[e.mp.markerId].distance;
that.name = mark[e.mp.markerId].sname;
} else {
mark[e.mp.markerId].statenum++;
for (var index in mark) {
if (mark[index].statenum % 2 === 1) {
mark[index].statenum++;
}
}
that.conditionA = false;
}
},
navtoend: function() {
//#ifdef MP-WEIXIN
uni.openLocation({
latitude: this.latitudeA,
longitude: this.longitudeA,
name: this.name,
address: this.address,
scale: 16,
success: function() {
console.log('success');
}
});
//#endif
//#ifdef APP-PLUS
uni.navigateTo({
url: 'nav/nav'
});
//#endif
},
navtotabcity: function() {
uni.navigateTo({
url: 'tabcity/tabcity'
});
},
navtoaroundsite: function() {
uni.navigateTo({
url: 'aroundsite/aroundsite'
});
},
navtodetail: function() {
let name = this.name
let address = this.address
let distance = this.distance
let num = this.num
let latitudeA = this.latitudeA
let longitudeA = this.longitudeA
let str = 'detail/detail?name=' + name + '&address=' + address + '&num=' + num + '&distance=' + distance +
'&slng=' + longitudeA + "&slat=" + latitudeA
uni.navigateTo({
url: str
});
},
},
}
</script>
我写的有什么问题么
轩哥哥 (作者)
我们升级以后标记点点击事件失效,定位接口失效
2018-10-22 10:12
轩哥哥 (作者)
现在问题主要出现在app中
2018-10-22 10:13
轩哥哥 (作者)
二维码跟支付接口 暂时正常了
2018-10-22 10:15
轩哥哥 (作者)
uniapp的标记点点击事件没有反应,getlocation获取经纬度接口无返回
2018-10-22 10:17
DCloud_UNI_CHB
回复 轩哥哥:具体代码怎么写的?如果打包成了App,需要配置高德地图的KEY相关参数
2018-10-22 12:31
轩哥哥 (作者)
回复 DCloud_UNI_CHB:代码贴上了你看看有没有问题
2018-10-22 16:22
轩哥哥 (作者)
还有一个问题就是二维码上 有地图存在是不是层级有问题
2018-10-22 19:19