<template>
|
<view class="store-list-body" :class="Visible ? 'store-list_open' : 'store-list_close'">
|
<view class="popup-bg" @click="closePopup"></view>
|
<view class="main">
|
<!-- 搜索框 -->
|
<view class="index-search-box d-b-c" id="searchBox">
|
<view class="index-search t-c flex-1">
|
<span class="icon iconfont icon-sousuo"></span>
|
<input type="text" v-model="keyWord" class="flex-1 ml10 f30 gray3" value="" placeholder-class="f24 gray6"
|
placeholder="请输入商家门店名称" confirm-type="search" @confirm="storeSearch()"/>
|
</view>
|
<!--<button class="btn ml10" @click="search()" type="default">搜索</button>-->
|
</view>
|
<view class="store-list bg-white">
|
<scroll-view scroll-y="true" class="scroll-Y" style="height:500px;" lower-threshold="50">
|
<view class="address p30 d-s-c border-b-e" v-for="(item,index) in storeList" :key="index">
|
<view class="info flex-1" @click="onSelectedStore(item)">
|
<view class="user f34">
|
<text>{{item.store_name}}</text>
|
</view>
|
<!-- 选中状态 -->
|
<view v-if="item.store_id == selectedId" class="shop-item__right">
|
<text class="iconfont icon-iconfontduihaocopy"></text>
|
</view>
|
</view>
|
</view>
|
</scroll-view>
|
<!-- 无数据提供的页面 -->
|
<view v-if="!isLoading && !storeList.length">
|
<view class="yoshop-notcont">
|
<text class="iconfont icon-wushuju"></text>
|
<text class="cont">亲，暂无可选择的门店哦</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
|
<script>
|
export default {
|
data() {
|
return {
|
/*数据*/
|
listData: [],
|
isLoading: true, // 是否正在加载中
|
storeList: [], // 门店列表,
|
selectedId: -1,
|
Visible:false,
|
url: '',
|
/*没有更多*/
|
no_more: false,
|
/*当前页面*/
|
page: 1,
|
search: '',
|
list_rows: 100,
|
last_page: 0,
|
keyWord: '',
|
}
|
},
|
props: ['showStore'],
|
watch:{
|
showStore(val){
|
this.Visible=val;
|
if(val){
|
//#ifdef H5
|
if(this.isWeixin()){
|
this.url = window.location.href;
|
}
|
//#endif
|
/*获取地址列表*/
|
|
}
|
}
|
},
|
mounted() {
|
this.getData();
|
},
|
methods: {
|
/*获取数据*/
|
getData() {
|
let self = this;
|
self.isLoading = true;
|
self._get('store.store/storelist', {
|
search: self.search,
|
page: self.page || 1,
|
list_rows: self.list_rows,
|
sortType: ''
|
}, function(res) {
|
self.isLoading = false;
|
self.storeList = self.storeList.concat(res.data.list.data);
|
self.last_page = res.data.list.last_page;
|
if (res.data.list.last_page <= 1) {
|
self.no_more = true;
|
}
|
});
|
},
|
/* 选择门店 */
|
onSelectedStore(e) {
|
let self = this;
|
self.selectedId = e;
|
// 设置上级页面的门店id
|
self.$fire.fire('selectStoreId',e);
|
this.$emit('close',e);
|
},
|
closePopup(e) {
|
this.$emit('close', e);
|
},
|
/*搜索*/
|
storeSearch(str) {
|
let self = this;
|
let search = null;
|
if(str != null){
|
search = str;
|
}else{
|
if(typeof self.keyWord != "undefined" && self.keyWord != null && self.keyWord != ''){
|
search = self.keyWord;
|
}else{
|
return;
|
}
|
}
|
self.search = search;
|
self.page = 1;
|
self.storeList = [];
|
self.getData();
|
},
|
}
|
}
|
</script>
|
|
<style>
|
.store-list {
|
padding-bottom: 90rpx;
|
}
|
|
.foot-btns {
|
padding: 0;
|
}
|
|
.foot-btns .btn-red {
|
width: 100%;
|
height: 90rpx;
|
line-height: 90rpx;
|
border-radius: 0;
|
}
|
|
.popup-bg {
|
position: fixed;
|
top: 0;
|
right: 0;
|
bottom: 0;
|
left: 0;
|
background: rgba(0, 0, 0, 0.6);
|
z-index: 99;
|
}
|
.store-list-body .main {
|
position: fixed;
|
width: 100%;
|
left: 0;
|
top: 0;
|
min-height: 800rpx;
|
max-height: 1400rpx;
|
background-color: #fff;
|
transform: translate3d(0, 980rpx, 0);
|
transition: transform 0.2s cubic-bezier(0, 0, 0.25, 1);
|
padding-bottom: env(safe-area-inset-bottom);
|
z-index: 99;
|
}
|
|
.store-list_open .main {
|
transform: translate3d(0, 0, 0);
|
}
|
|
.store-list_close .popup-bg {
|
display: none;
|
}
|
.store-list_close .main {
|
display: none;
|
}
|
</style>
|
