优化：站点支持定位及导航
This commit is contained in:
parent
eb5e0983e2
commit
91856622a9
|
|
@ -17,7 +17,7 @@ export function pointUserInfo(data) {
|
|||
}
|
||||
// 提货处理 - 获取提货点信息
|
||||
export function pointList(data) {
|
||||
return request.get("exchange/pointList",data);
|
||||
return request.get("exchange/pointList", data, {noAuth: true});
|
||||
}
|
||||
// 提货处理 - 提货处理
|
||||
export function confirmExchange(data) {
|
||||
|
|
|
|||
|
|
@ -551,8 +551,15 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "兑换管理"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "online_payment/site/list",
|
||||
"style": {
|
||||
"navigationBarTitleText": "兑换站列表"
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
|
|
|
|||
|
|
@ -0,0 +1,184 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<view class='content-box'>
|
||||
<view v-if="Object.values(list).length > 0" class="content-list">
|
||||
<view class="site-box" v-for="(item,index) in list" :key="index">
|
||||
<view class="left">
|
||||
<view class="title">
|
||||
<view class="title-text">{{item.title}}</view>
|
||||
<view v-if="item.distance > 0" class="distance">{{item.distance_text}}</view>
|
||||
</view>
|
||||
<view class="address">{{item.address}}</view>
|
||||
</view>
|
||||
<view class="right" @click="navigationAddress(item)">导航</view>
|
||||
</view>
|
||||
</view>
|
||||
<emptyPage v-else title="暂无信息～"></emptyPage>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { pointList } from '@/api/exchange.js';
|
||||
import {mapGetters} from "vuex";
|
||||
import emptyPage from '@/components/emptyPage.vue';
|
||||
|
||||
const app = getApp();
|
||||
export default {
|
||||
components: {
|
||||
emptyPage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 定位信息
|
||||
lng: null,
|
||||
lat: null,
|
||||
// 列表信息相关
|
||||
list: [],
|
||||
page: 1,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
// ...mapGetters(['isLogin', 'userInfo', 'viewColor'])
|
||||
...mapGetters(['viewColor'])
|
||||
},
|
||||
onLoad(options) {
|
||||
this.getLocation();
|
||||
},
|
||||
onReachBottom: function () {
|
||||
this.getPointList();
|
||||
},
|
||||
methods: {
|
||||
// 用户定位
|
||||
getLocation() {
|
||||
let _this = this;
|
||||
uni.getLocation({
|
||||
type: 'gcj02', // 返回国测局经纬度坐标系统的结果
|
||||
success(res) {
|
||||
_this.lng = res.longitude || null;
|
||||
_this.lat = res.latitude || null;
|
||||
_this.getPointList();
|
||||
},
|
||||
fail(err) {
|
||||
console.error('获取地理位置失败', err)
|
||||
_this.getPointList();
|
||||
}
|
||||
})
|
||||
},
|
||||
// 站点列表
|
||||
getPointList() {
|
||||
let _this = this;
|
||||
let params = {
|
||||
page: _this.page,
|
||||
lng: _this.lng,
|
||||
lat: _this.lat
|
||||
};
|
||||
pointList(params).then(res => {
|
||||
let list = res.data || {};
|
||||
if (Object.values(list).length > 0) {
|
||||
_this.list = _this.$util.SplitArray(list, _this.list);
|
||||
_this.$set(_this, 'list', _this.list);
|
||||
_this.page++;
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log('错误', err)
|
||||
this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
},
|
||||
// 导航
|
||||
navigationAddress(item){
|
||||
uni.openLocation({
|
||||
longitude: Number(item.lng),
|
||||
latitude: Number(item.lat),
|
||||
// name: '南京站',
|
||||
// address: '江苏省南京市玄武区龙蟠路',
|
||||
success: function (res) {
|
||||
console.log('打开系统位置地图成功')
|
||||
},
|
||||
fail: function (error) {
|
||||
console.log(error)
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.content-box{
|
||||
min-height: 100vh;
|
||||
width: 100%;
|
||||
background: #f6f6f6;
|
||||
|
||||
.content-list{
|
||||
width: 100%;
|
||||
.site-box{
|
||||
width: 100%;
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx;
|
||||
border-bottom: 2rpx solid #CCCCCC;
|
||||
.left{
|
||||
width: calc(100% - 120rpx);
|
||||
|
||||
.title{
|
||||
width: 100%;
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
.title-text{
|
||||
max-width: calc(100% - 130rpx);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.distance{
|
||||
font-size: 24rpx;
|
||||
background-color: #e6a23c;
|
||||
color: #fff;
|
||||
font-weight: initial;
|
||||
height: 35rpx;
|
||||
line-height: 35rpx;
|
||||
border-radius: 50rpx;
|
||||
margin-left: 20rpx;
|
||||
width: 110rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.address{
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
font-size: 26rpx;
|
||||
color: #a0a1a7;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.right{
|
||||
color: #fff;
|
||||
background-color: #409eff;
|
||||
border-color: #409eff;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 0 15rpx;
|
||||
border-radius: 50rpx;
|
||||
width: 100rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.site-box:last-child{
|
||||
border-bottom: 0!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -47,7 +47,7 @@ function atob(input) {
|
|||
const sum = (a << 18) | (b << 12) | (c << 6) | d;
|
||||
output += String.fromCharCode((sum >> 16) & 0xFF, (sum >> 8) & 0xFF, sum & 0xFF);
|
||||
}
|
||||
|
||||
|
||||
return output;
|
||||
}
|
||||
/**
|
||||
|
|
|
|||
Loading…
Reference in New Issue