<template>
|
<view>
|
<u-navbar title="门店列表" safeAreaInsetTop fixed placeholder>
|
<view class="coreshop-navbar-left-slot" slot="left">
|
<u-icon name="arrow-left" size="19" @click="goNavigateBack"></u-icon>
|
<u-line direction="column" :hairline="false" length="16" margin="0 8px"></u-line>
|
<u-icon name="home" size="22" @click="goHome"></u-icon>
|
</view>
|
<view slot="right">
|
</view>
|
</u-navbar>
|
<view class="content">
|
<view class="coreshop-padding-15 coreshop-bg-white coreshop-solid-bottom">
|
<u-search placeholder="请输入门店名" v-model="key" :show-action="true" action-text="搜索" :animation="false" @clear="clear" @search="storeSearch" @custom="storeSearch"></u-search>
|
</view>
|
<view v-if="storeList.length>0">
|
<view class="coreshop-list menu-avatar" v-for="(item, key) in storeList" :key="key" @click="selectStore(item.id, item.storeName, item.mobile, item.address)">
|
<view class="coreshop-list-item coreshop-padding-top-10 coreshop-padding-bottom-10">
|
<view class="coreshop-avatar lg radius" :style="[{backgroundImage:'url('+ item.logoImage +')'}]" />
|
<view class="content">
|
<view class="coreshop-text-grey">{{item.storeName|| ''}}</view>
|
<view class="coreshop-text-gray coreshop-font-sm">
|
<view class="u-line-1">
|
电话:{{item.mobile|| ''}}
|
</view>
|
</view>
|
<view class="coreshop-text-gray coreshop-font-sm">
|
<view class="u-line-2">
|
地址:{{item.address|| ''}}
|
</view>
|
</view>
|
</view>
|
<view class="action">
|
<view class="coreshop-text-grey coreshop-font-xs coreshop-margin-bottom-10">{{item.distanceStr|| ''}}</view>
|
<u-button type="success" size="mini">选择</u-button>
|
</view>
|
</view>
|
</view>
|
</view>
|
<!-- 无数据时默认显示 -->
|
<view class="coreshop-emptybox" v-else>
|
<u-empty :icon="$globalConstVars.apiFilesUrl+'/static/images/empty/history.png'" icon-size="150" text="暂无门店列表" mode="list"></u-empty>
|
</view>
|
</view>
|
|
<!-- 登录提示 -->
|
<coreshop-login-modal></coreshop-login-modal>
|
</view>
|
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
storeList: [],
|
key: '',
|
longitude: '',
|
latitude: '',
|
page: 1,
|
limit: 30,
|
}
|
},
|
onLoad() {
|
this.getStoreList();
|
},
|
methods: {
|
//门店搜索
|
storeSearch() {
|
console.log('storeSearch');
|
this.page = 1;
|
this.limit = 30;
|
this.storeList = [];
|
this.getStoreList();
|
},
|
clear() {
|
console.log('clear');
|
this.page = 1;
|
this.limit = 30;
|
this.storeList = [];
|
this.getStoreList();
|
},
|
//获取门店列表
|
getStoreList() {
|
let _this = this;
|
// #ifdef MP-WEIXIN
|
wx.getFuzzyLocation({
|
type: 'wgs84',
|
success(res) {
|
_this.latitude = res.latitude
|
_this.longitude = res.longitude
|
console.log('当前位置的经度1:' + res);
|
},
|
fail: function () {
|
_this.$u.toast("获取您的经纬度坐标失败")
|
},
|
complete: function (res) {
|
if (!_this.longitude || !_this.latitude) {
|
_this.longitude = '0';
|
_this.latitude = '0';
|
}
|
let data = {
|
'key': _this.key,
|
'longitude': _this.longitude,
|
'latitude': _this.latitude,
|
'page': _this.page,
|
'limit': _this.limit,
|
}
|
_this.$u.api.storeList(data).then(e => {
|
if (e.status) {
|
console.log(e);
|
_this.storeList = [..._this.storeList, ...e.data]
|
} else {
|
_this.$u.toast("门店数据获取失败。");
|
}
|
});
|
}
|
})
|
// #endif
|
// #ifndef MP-WEIXIN
|
uni.getLocation({
|
type: 'wgs84',
|
success: function (res) {
|
_this.longitude = res.longitude;
|
_this.latitude = res.latitude;
|
},
|
fail: function () {
|
_this.$u.toast("获取您的经纬度坐标失败")
|
},
|
complete: function (res) {
|
if (!_this.longitude || !_this.latitude) {
|
_this.longitude = '0';
|
_this.latitude = '0';
|
}
|
let data = {
|
'key': _this.key,
|
'longitude': _this.longitude,
|
'latitude': _this.latitude,
|
'page': _this.page,
|
'limit': _this.limit,
|
}
|
_this.$u.api.storeList(data).then(e => {
|
if (e.status) {
|
console.log(e);
|
_this.storeList = [..._this.storeList, ...e.data]
|
} else {
|
_this.$u.toast("门店数据获取失败。");
|
}
|
});
|
}
|
});
|
// #endif
|
},
|
//门店选择
|
selectStore(id, name, mobile, address) {
|
let pages = getCurrentPages()
|
let pre = pages[pages.length - 2]
|
let store = {};
|
store['id'] = id;
|
store['name'] = name;
|
store['mobile'] = mobile;
|
store['address'] = address;
|
|
// #ifdef MP-ALIPAY || MP-TOUTIAO
|
this.$db.set('userStore', store, true);
|
// #endif
|
|
// #ifdef MP-WEIXIN
|
pre.$vm.store = store
|
// #endif
|
|
// #ifdef APP-PLUS || APP-PLUS-NVUE
|
pre.$vm.store = store
|
// #endif
|
|
uni.navigateBack({
|
delta: 1
|
});
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
@import "storeList.scss";
|
</style>
|