|
|
@@ -8,7 +8,7 @@
|
|
|
<view class="head-search align-items-center">
|
|
|
<!-- <uni-icons class="s-icon" type="search" size="19"></uni-icons> -->
|
|
|
<image class="wh-32" src="@/static/img/index/ss.png" mode=""></image>
|
|
|
- <input class="input" v-model="search" type="text" placeholder="搜一搜带你玩周边">
|
|
|
+ <input class="input" v-model="fromData.search" type="text" placeholder="搜一搜带你玩周边">
|
|
|
<view class="head-search-buttom text-align-center fs-28 fw-500 fc-f" @click="searchFun()">搜索
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -18,7 +18,8 @@
|
|
|
<view class="text-align-center nav-item" v-for="(item,i) in navList" :key="i"
|
|
|
@click="selectType(item.id)">
|
|
|
<image class="nav-img" :src="item.img" mode="scaleToFill"></image>
|
|
|
- <view class="fs-24 w-96" :class="navId == item.id?'fw-600 fc-41ABF5':'fw-400'">{{item.name}}
|
|
|
+ <view class="fs-24 w-96"
|
|
|
+ :class="fromData.category_id == item.id?'fw-600 fc-41ABF5':'fw-400'">{{item.name}}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -28,25 +29,43 @@
|
|
|
<view class="mr-20 sift-item align-items-center flex-justify-center"
|
|
|
:class="[{'bgc-F5F5F6':siftType},{'bgc-f':!siftType},{'siftClass':siftClassID === 1 && pop_type}]"
|
|
|
@click="siftClick(1)">
|
|
|
- <view class="" :class="[{'fc-41ABF5':siftClassID === 1 && pop_type}]">
|
|
|
+ <view class=""
|
|
|
+ :class="[{'fc-41ABF5':(siftClassID === 1 && pop_type) || fromData.distance != 0}]">
|
|
|
{{siftDistance}}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="mr-12 sift-item align-items-center flex-justify-center"
|
|
|
:class="[{'bgc-F5F5F6':siftType},{'bgc-f':!siftType},{'siftClass':siftClassID === 2 && pop_type}]"
|
|
|
@click="siftClick(2)">
|
|
|
- <view class="" :class="[{'fc-41ABF5':siftClassID === 2 && pop_type}]">
|
|
|
+ <view class=""
|
|
|
+ :class="[{'fc-41ABF5':(siftClassID === 2 && pop_type) || fromData.orderBy != 0}]">
|
|
|
{{siftSort}}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="pop-content" :style="[{'top': pop_top + 'px'}]"
|
|
|
:class="pop_type?'pop-box-true':'pop-box-false'" @click="gbPopType">
|
|
|
<view class="pop-select-box" @click.stop="noPopType">
|
|
|
- <view class="">
|
|
|
- 1111111111111111111000000000000000000000000000000000000000000000000000000000
|
|
|
- </view>
|
|
|
- <view class="" v-for="(item,index) in 2">
|
|
|
- 电风扇电风扇
|
|
|
+ <view class="select-box p-24 box-border-box">
|
|
|
+ <view class="distance-box" v-show="siftClassID === 1">
|
|
|
+ <view class="mb-16 fs-30 fc-3 fw-500">
|
|
|
+ 我的附近
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center flex-wrap-wrap">
|
|
|
+ <view class="distance-label text-align-center mb-12"
|
|
|
+ v-for="(item,index) in distance_label" :key="item.id"
|
|
|
+ :class="fromData.distance===item.id?'siftClass':'bgc-F5F5F6'"
|
|
|
+ @click="distanceClick(item)">
|
|
|
+ {{item.name}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="sort-box" v-show="siftClassID === 2">
|
|
|
+ <view class="sort-select-box text-align-left" v-for="(item,index) in sort_label"
|
|
|
+ :key="item.id" @click="sortSelectClick(item)"
|
|
|
+ :class="fromData.orderBy===item.id?'fc-41ABF5':''">
|
|
|
+ {{item.name}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -54,8 +73,7 @@
|
|
|
<view v-show="pop_type" :style="[{'top': pop_top + 'px'}]" class="pop-mask" @click="gbPopType"
|
|
|
@touchmove.stop.prevent="stopScroll"></view>
|
|
|
<view class="p-12-24 box-border-box">
|
|
|
- <view class="h-200" v-for="(item,index) in 10">
|
|
|
- </view>
|
|
|
+ <shopListVue ref="shopListRef"></shopListVue>
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
@@ -67,17 +85,26 @@
|
|
|
groupList
|
|
|
} from '@/api/groupOrder.js';
|
|
|
import tools from "@/service/tools";
|
|
|
- import EnBlank from "@/components/en-utils/en-blank/en-blank";
|
|
|
+ import shopListVue from './group-mod/shop-list.vue';
|
|
|
import {
|
|
|
getGroup
|
|
|
} from "@/api/category.js"
|
|
|
export default {
|
|
|
components: {
|
|
|
- EnBlank
|
|
|
+ shopListVue
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- navId: 0,
|
|
|
+ fromData: {
|
|
|
+ operate_id: '',
|
|
|
+ lat: '',
|
|
|
+ lon: '',
|
|
|
+ search: '',
|
|
|
+ category_id: 0,
|
|
|
+ distance: 0,
|
|
|
+ orderBy: 0,
|
|
|
+ page: 1
|
|
|
+ },
|
|
|
navList: [{
|
|
|
name: "全部",
|
|
|
id: 0,
|
|
|
@@ -91,23 +118,41 @@
|
|
|
pop_type: false,
|
|
|
navListHeight: '', //头部模块高度
|
|
|
siftDistance: '附近', //距离筛选
|
|
|
- siftSort: '距离优先', //排序筛选
|
|
|
- page: 1,
|
|
|
- total: 0,
|
|
|
- list: [],
|
|
|
- search: ''
|
|
|
- }
|
|
|
- },
|
|
|
- onReachBottom() {
|
|
|
- if (this.list.length < this.total) {
|
|
|
- this.page += 1;
|
|
|
- this.getList();
|
|
|
+ siftSort: '默认排序', //排序筛选
|
|
|
+ distance_label: [{
|
|
|
+ name: '附近',
|
|
|
+ id: 0
|
|
|
+ }, {
|
|
|
+ name: '500m',
|
|
|
+ id: 0.5
|
|
|
+ }, {
|
|
|
+ name: '1km',
|
|
|
+ id: 1
|
|
|
+ }, {
|
|
|
+ name: '3km',
|
|
|
+ id: 3
|
|
|
+ }, {
|
|
|
+ name: '5km',
|
|
|
+ id: 5
|
|
|
+ }, {
|
|
|
+ name: '10km',
|
|
|
+ id: 10
|
|
|
+ }],
|
|
|
+ sort_label: [{
|
|
|
+ name: '默认排序',
|
|
|
+ id: 0
|
|
|
+ }, {
|
|
|
+ name: '距离优先',
|
|
|
+ id: 1
|
|
|
+ }, {
|
|
|
+ name: '销量优先',
|
|
|
+ id: 2
|
|
|
+ }]
|
|
|
}
|
|
|
},
|
|
|
onShow() {
|
|
|
this.getGroup()
|
|
|
- this.page = 1;
|
|
|
- this.list = [];
|
|
|
+ this.fromData.page = 1;
|
|
|
this.getList();
|
|
|
},
|
|
|
onLoad() {},
|
|
|
@@ -115,6 +160,38 @@
|
|
|
this.getHeight()
|
|
|
},
|
|
|
methods: {
|
|
|
+ distanceClick(item) {
|
|
|
+ // 距离筛选
|
|
|
+ if (this.fromData.distance === item.id) {
|
|
|
+ this.gbPopType()
|
|
|
+ } else {
|
|
|
+ this.fromData.distance = item.id
|
|
|
+ this.siftDistance = item.name
|
|
|
+ this.fromData.page = 1;
|
|
|
+ this.getList()
|
|
|
+ this.gbPopType()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ sortSelectClick(item) {
|
|
|
+ // 排序筛选
|
|
|
+ if (this.fromData.orderBy === item.id) {
|
|
|
+ this.gbPopType()
|
|
|
+ } else {
|
|
|
+ this.fromData.orderBy = item.id
|
|
|
+ this.siftSort = item.name
|
|
|
+ this.fromData.page = 1;
|
|
|
+ this.getList()
|
|
|
+ this.gbPopType()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selectType(num) {
|
|
|
+ if (this.fromData.category_id === num) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.fromData.category_id = num
|
|
|
+ this.fromData.page = 1;
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
noPopType() {},
|
|
|
stopScroll(event) {
|
|
|
// 阻止默认的滑动行为
|
|
|
@@ -127,10 +204,14 @@
|
|
|
this.scroll_top = this.navListHeight
|
|
|
});
|
|
|
}
|
|
|
- setTimeout(() => {
|
|
|
- this.siftClassID = num
|
|
|
- this.pop_type = true
|
|
|
- }, 200)
|
|
|
+ if (this.pop_type && this.siftClassID === num) {
|
|
|
+ this.pop_type = false
|
|
|
+ } else {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.siftClassID = num
|
|
|
+ this.pop_type = true
|
|
|
+ }, 200)
|
|
|
+ }
|
|
|
},
|
|
|
gbPopType() {
|
|
|
this.pop_type = !this.pop_type
|
|
|
@@ -187,7 +268,8 @@
|
|
|
})
|
|
|
},
|
|
|
scrolltolower(e) {
|
|
|
- console.log(e);
|
|
|
+ ++this.fromData.page
|
|
|
+ this.getList()
|
|
|
},
|
|
|
getGroup() {
|
|
|
let operate_id = uni.getStorageSync('operate_id');
|
|
|
@@ -206,28 +288,47 @@
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- getList() {
|
|
|
- let school_id = uni.getStorageSync('school_id');
|
|
|
- groupList({
|
|
|
- school_id: school_id,
|
|
|
- page: this.page
|
|
|
- }).then((res) => {
|
|
|
- if (res.code === 1) {
|
|
|
- this.list = [...this.list, ...res.data.items];
|
|
|
- this.total = res.data.total;
|
|
|
- }
|
|
|
- })
|
|
|
+ searchFun() {
|
|
|
+ if (this.fromData.search) {
|
|
|
+ this.fromData.page = 1;
|
|
|
+ this.getList()
|
|
|
+ } else {
|
|
|
+ tools.error("请输入搜索内容")
|
|
|
+ }
|
|
|
},
|
|
|
- todet(item) {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages-buy/group-det?id=' + item.id
|
|
|
- })
|
|
|
+ getList() {
|
|
|
+ this.fromData.operate_id = uni.getStorageSync('operate_id');
|
|
|
+ this.fromData.lon = uni.getStorageSync('lon');
|
|
|
+ this.fromData.lat = uni.getStorageSync('lat');
|
|
|
+ console.log(this.fromData);
|
|
|
+ this.$refs.shopListRef.groupShop(this.fromData)
|
|
|
}
|
|
|
},
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
+ .select-box {}
|
|
|
+
|
|
|
+ .distance-box {}
|
|
|
+
|
|
|
+ .sort-box {}
|
|
|
+
|
|
|
+ .distance-label {
|
|
|
+ width: 32%;
|
|
|
+ height: 60rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ margin-right: 1%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .sort-select-box {
|
|
|
+ width: 100%;
|
|
|
+ height: 40rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ padding: 15rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
.pop-box-true {
|
|
|
// display: block;
|
|
|
// transition: all .3s inherit;
|
