修改
This commit is contained in:
辉
parent
1f643a011f
commit
41458f1ed6
@ -3,7 +3,9 @@
|
||||
<view class="top_search">
|
||||
<u-search @change="searchChange" v-model="searchValue" shape="round" @clear="clear" :clearabled="true"
|
||||
:showAction="false" placeholder="请输入城市名"></u-search>
|
||||
<view style="width: 90%;margin: 0 auto; background: #fff;height: 200px; position: absolute;top: 40px;padding: 40rpx;box-shadow: 0pc 0px 10px #ccc;" v-show="isShowFont">
|
||||
<view
|
||||
style="width: 90%;margin: 0 auto; background: #fff;height: 200px; position: absolute;top: 40px;padding: 40rpx;box-shadow: 0pc 0px 10px #ccc;"
|
||||
v-show="isShowFont">
|
||||
<view @click="fontClick">{{ showFont }}</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -27,29 +29,16 @@
|
||||
<view class="city_item" @click="getAddressCon('2')">
|
||||
<text>东营市</text>
|
||||
</view>
|
||||
<!-- <view class="city_item" @click="getAddressCon('3')">
|
||||
<view class="city_item" @click="getAddressCon('3')">
|
||||
<text>济南市</text>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- city List -->
|
||||
<!-- <view class="city_list">
|
||||
<view v-for="(item,index) in cityList" :key="index">
|
||||
<view class="province_txt">
|
||||
<view style="width: 90%;margin: 0 auto;"> {{ item.sheng }}</view>
|
||||
</view>
|
||||
<view class="city_txt" v-for="(city,cityIndex) in cityList[index].city" :key="cityIndex">
|
||||
<view style="width: 90%;margin: 0 auto;">{{city.name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import QQMapWX from '@/utils/qqMap/qqmap-wx-jssdk.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@ -60,60 +49,21 @@
|
||||
// 接收缓存地址 赋值
|
||||
address: '',
|
||||
searchValue: '',
|
||||
cityList: [{
|
||||
sheng: '山东省',
|
||||
city: [{
|
||||
id: 1,
|
||||
name: "德州市"
|
||||
}, {
|
||||
id: 2,
|
||||
name: "济南市"
|
||||
}, {
|
||||
id: 3,
|
||||
name: "东营市"
|
||||
}, {
|
||||
id: 4,
|
||||
name: "青岛市"
|
||||
}]
|
||||
},
|
||||
{
|
||||
sheng: '河北省',
|
||||
city: [{
|
||||
id: 1,
|
||||
name: "邢台市"
|
||||
}, {
|
||||
id: 2,
|
||||
name: "沧州市"
|
||||
}, {
|
||||
id: 3,
|
||||
name: "唐山市"
|
||||
}, {
|
||||
id: 4,
|
||||
name: "石家庄市"
|
||||
}]
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.address = uni.getStorageSync('location')
|
||||
// console.log('onLoad',this.address);
|
||||
this.qqmapsdk = new QQMapWX({
|
||||
// 在腾讯平台自己申请的秘钥
|
||||
key: 'Q4DBZ-UIMC2-B63UX-CUZ6A-S3UT7-TBF3V'
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
searchChange(value) {
|
||||
// console.log(value);
|
||||
if (value == '德' || value == '德州' || value == '东' || value == '东营' || value == '济' || value == '济南') {
|
||||
if (value == '德' || value == '德州' || value == '东' || value == '东营' || value == '济' || value == '济南' ||
|
||||
value == '东营市' || value == '德州市' || value == '济南市') {
|
||||
this.isShowFont = true
|
||||
// this.showFont = '德州市'
|
||||
if (value == '德' || value == '德州') {
|
||||
if (value == '德' || value == '德州' || value == '德州市') {
|
||||
this.showFont = '德州市'
|
||||
} else if (value == '东' || value == '东营') {
|
||||
} else if (value == '东' || value == '东营' || value == '东营市') {
|
||||
this.showFont = '东营市'
|
||||
} else if (value == '济' || value == '济南') {
|
||||
} else if (value == '济' || value == '济南' || value == '济南市') {
|
||||
this.showFont = '济南市'
|
||||
}
|
||||
} else {
|
||||
@ -135,6 +85,10 @@
|
||||
uni.setStorageSync('location', '东营市')
|
||||
uni.setStorageSync("region", 2)
|
||||
this.address = '东营市'
|
||||
} else if (value == '3') {
|
||||
uni.setStorageSync('location', '济南市')
|
||||
uni.setStorageSync("region", 3)
|
||||
this.address = '济南市'
|
||||
}
|
||||
},
|
||||
clear() {
|
||||
@ -152,39 +106,22 @@
|
||||
type: 'wgs84',
|
||||
//成功
|
||||
success: (res) => {
|
||||
// console.log(res);
|
||||
// 赋值经纬度
|
||||
let newlatitude = res.latitude
|
||||
let newlongitude = res.longitude
|
||||
// 逆地址解析 转市
|
||||
vm.qqmapsdk.reverseGeocoder({
|
||||
location: {
|
||||
latitude: newlatitude,
|
||||
longitude: newlongitude
|
||||
let location = res.latitude + ',' + res.longitude
|
||||
//调用逆解析接口
|
||||
uni.request({
|
||||
url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=location', //腾讯官方逆解析接口，可直接复制
|
||||
data: {
|
||||
location: location,
|
||||
'key': "Q4DBZ-UIMC2-B63UX-CUZ6A-S3UT7-TBF3V", //自己申请的Key
|
||||
},
|
||||
//成功
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
//赋值给变量 存入缓存
|
||||
let address = res.result.ad_info.city
|
||||
uni.setStorage({
|
||||
key: 'location',
|
||||
data: address,
|
||||
method: "GET",
|
||||
success(res) {
|
||||
// console.log(res);
|
||||
// 获取缓存 赋值结构绑定的值
|
||||
uni.getStorage({
|
||||
key: 'location',
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
vm.address = res.data
|
||||
uni.setStorageSync('location', res.data.result.address_component.city)
|
||||
},
|
||||
})
|
||||
},
|
||||
fail(err) {
|
||||
console.log(err);
|
||||
}
|
||||
})
|
||||
fail: res => {
|
||||
console.log(res.errMsg, '解析失败返回的错误信息');
|
||||
}
|
||||
})
|
||||
},
|
||||
@ -203,6 +140,8 @@
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.location {
|
||||
margin-top: 20rpx;
|
||||
|
||||
.top_search {
|
||||
position: relative;
|
||||
width: 90%;
|
||||
@ -230,8 +169,6 @@
|
||||
font-size: 20rpx !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.atAddress {
|
||||
@ -282,7 +219,6 @@
|
||||
line-height: 70rpx;
|
||||
font-size: 24rpx;
|
||||
|
||||
// border: 1px solid rgb(23, 20, 22);
|
||||
text {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user