|
|
@@ -2,69 +2,72 @@
|
|
|
<view class="common_page adffc" :style="{'height':h+'px', 'padding-top':mt+'px'}">
|
|
|
<cus-header title="全部活动" bgColor="transparent"></cus-header>
|
|
|
<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/19/54b75bc8-d926-449b-95a5-1126f700b481.png" class="top_bg_img" mode="widthFix"></image>
|
|
|
- <div class="top-search" @tap="toSearch">
|
|
|
- <cus-search></cus-search>
|
|
|
- </div>
|
|
|
- <div class="type adfacjb">
|
|
|
- <div class="type-list">
|
|
|
+ <view class="top-search" @click="toSearch">
|
|
|
+ <cus-search ref="searchRef"></cus-search>
|
|
|
+ </view>
|
|
|
+ <view class="type adfacjb">
|
|
|
+ <view class="type-list">
|
|
|
<scroll-view class="scroll-view_H" scroll-x="true" scroll-with-animation="true" :scroll-left="scrollLeft">
|
|
|
- <view class="scroll-view-item_H" :id="'svih_'+index" v-for="(item,index) in typeList" :key="index" @tap="changeType(item,index)">
|
|
|
+ <view class="scroll-view-item_H" :id="'svih_'+index" v-for="(item,index) in typeList" :key="index" @click="changeType(item,index)">
|
|
|
<view class="cl_item" :class="{'active':typeIndex===index}">
|
|
|
<text>{{item.name}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
- </div>
|
|
|
- <div class="type-all" :class="{'active':typeIndex===''}" @tap="handleAll">全部</div>
|
|
|
- </div>
|
|
|
- <div class="filter adfac" id="filter">
|
|
|
- <div class="filter-pre adfac" @tap="showTime">
|
|
|
+ </view>
|
|
|
+ <view class="type-all" :class="{'active':typeIndex===''}" @click="handleAll">全部</view>
|
|
|
+ </view>
|
|
|
+ <view class="filter adfac" id="filter">
|
|
|
+ <view class="filter-pre adfac" @click="showTime">
|
|
|
<text>{{time}}</text>
|
|
|
<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/19/1813f2d7-42e9-4c5d-9d05-924e30568f9e.png"></image>
|
|
|
- </div>
|
|
|
- <div class="filter-pre adfac" @tap="placeShow=true;timeShow=false;allShow=false">
|
|
|
+ </view>
|
|
|
+ <view class="filter-pre adfac" @click="timeShow=false;allShow=false;placeShow=!placeShow">
|
|
|
<text>{{place}}</text>
|
|
|
<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/19/1813f2d7-42e9-4c5d-9d05-924e30568f9e.png"></image>
|
|
|
- </div>
|
|
|
- <!-- <div class="filter-pre adfac">
|
|
|
+ </view>
|
|
|
+ <!-- <view class="filter-pre adfac">
|
|
|
<text>{{status}}</text>
|
|
|
<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/19/1813f2d7-42e9-4c5d-9d05-924e30568f9e.png"></image>
|
|
|
- </div> -->
|
|
|
- </div>
|
|
|
- <div class="list" id="list">
|
|
|
- <up-list @scrolltolower="scrolltolower" style="height: 100%;">
|
|
|
- <up-list-item v-for="(item, index) in list" :key="index">
|
|
|
- <NonprofitActivety></NonprofitActivety>
|
|
|
- </up-list-item>
|
|
|
- </up-list>
|
|
|
- </div>
|
|
|
- <div class="window" :style="{'top':top+'px','height':'calc(100vh - '+top+'px)'}" v-if="timeShow">
|
|
|
- <div class="window-time">
|
|
|
- <div class="top adfac">
|
|
|
- <div class="top-pre" :class="{'active':wtIndex===0}" @tap="changeWindowTime(0,'全部时间')">全部时间</div>
|
|
|
- <div class="top-pre" :class="{'active':wtIndex===1}" @tap="changeWindowTime(1,'一周内')">一周内</div>
|
|
|
- <div class="top-pre" :class="{'active':wtIndex===2}" @tap="changeWindowTime(2,'一月内')">一月内</div>
|
|
|
- <div class="top-pre" :class="{'active':wtIndex===3}" @tap="changeWindowTime(3,'本周末')">本周末</div>
|
|
|
- </div>
|
|
|
- <div class="middle">
|
|
|
+ </view> -->
|
|
|
+ </view>
|
|
|
+ <view class="list" id="list" :class="{'adffcacjc':list.length===0}">
|
|
|
+ <template v-if="list.length">
|
|
|
+ <up-list @scrolltolower="scrolltolower" style="height: 100%;">
|
|
|
+ <up-list-item v-for="(item, index) in list" :key="item.id">
|
|
|
+ <NonprofitActivety :item="item"></NonprofitActivety>
|
|
|
+ </up-list-item>
|
|
|
+ </up-list>
|
|
|
+ </template>
|
|
|
+ <page-empty text="暂无活动" v-else></page-empty>
|
|
|
+ </view>
|
|
|
+ <view class="window" :style="{'top':top+'px','height':'calc(100vh - '+top+'px)'}" v-if="timeShow">
|
|
|
+ <view class="window-time">
|
|
|
+ <view class="top adfac">
|
|
|
+ <view class="top-pre" :class="{'active':wtIndex===0}" @click="changeWindowTime(0,'全部时间')">全部时间</view>
|
|
|
+ <view class="top-pre" :class="{'active':wtIndex===1}" @click="changeWindowTime(1,'一周内')">一周内</view>
|
|
|
+ <view class="top-pre" :class="{'active':wtIndex===2}" @click="changeWindowTime(2,'一月内')">一月内</view>
|
|
|
+ <view class="top-pre" :class="{'active':wtIndex===3}" @click="changeWindowTime(3,'本周末')">本周末</view>
|
|
|
+ </view>
|
|
|
+ <view class="middle">
|
|
|
<ActivityCalendar ref="acRef"></ActivityCalendar>
|
|
|
- </div>
|
|
|
- <div class="bottom adfacjb">
|
|
|
- <div class="reset" @tap="changeWindowTime(0,'全部时间')">重置</div>
|
|
|
- <div class="confirm" @tap="timeConfirm">确定</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="window" :style="{'top':top+'px','height':'calc(100vh - '+top+'px)'}" v-if="placeShow">
|
|
|
- <div class="window-place">
|
|
|
+ </view>
|
|
|
+ <view class="bottom adfacjb">
|
|
|
+ <view class="reset" @click="changeWindowTime(0,'全部时间')">重置</view>
|
|
|
+ <view class="confirm" @click="timeConfirm">确定</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="window" :style="{'top':top+'px','height':'calc(100vh - '+top+'px)'}" v-if="placeShow">
|
|
|
+ <view class="window-place">
|
|
|
<ActivityArea @confirm="areaConfirm"></ActivityArea>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="window" :style="{'top':topAll+'px','height':'calc(100vh - '+topAll+'px)'}" v-if="allShow">
|
|
|
- <div class="window-all">
|
|
|
- <div class="pre" v-for="(t,i) in typeList2" :key="i" @tap="changeType2(t.name,i)">{{t.name}}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="window" :style="{'top':topAll+'px','height':'calc(100vh - '+topAll+'px)'}" v-if="allShow">
|
|
|
+ <view class="window-all">
|
|
|
+ <view class="pre" v-for="(t,i) in typeList2" :key="i" @click="changeType2(t,t.name,i)">{{t.name}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -74,25 +77,27 @@
|
|
|
import NonprofitActivety from '@/components/pages/nonprofitActivety/index.vue'
|
|
|
import ActivityCalendar from '@/components/pages/activityCalendar/index.vue'
|
|
|
import ActivityArea from '@/components/pages/activityArea/index.vue'
|
|
|
- import { ref, onMounted, nextTick } from 'vue'
|
|
|
+ import PageEmpty from '@/components/pageEmpty/index.vue'
|
|
|
+ import { ref, onMounted, nextTick, getCurrentInstance } from 'vue'
|
|
|
+ const { proxy } = getCurrentInstance()
|
|
|
|
|
|
const typeIndex = ref('')
|
|
|
- const typeList = ref([
|
|
|
- {id:1,name:'儿童关爱'},
|
|
|
- {id:2,name:'老人关爱'},
|
|
|
- {id:3,name:'社区发展'},
|
|
|
- {id:4,name:'社会服务'},
|
|
|
- {id:5,name:'健康行动'},
|
|
|
- {id:6,name:'减肥运动'}
|
|
|
- ])
|
|
|
+ const typeList = ref([])
|
|
|
const typeList2 = ref([])
|
|
|
const scrollLeft = ref(0)
|
|
|
const time = ref('全部时间')
|
|
|
const timeText = ref('全部时间')
|
|
|
const place = ref('全部地区')
|
|
|
const status = ref('活动状态')
|
|
|
- const queryParams = ref({})
|
|
|
- const list = ref([1,1,1,1])
|
|
|
+ const queryParams = ref({
|
|
|
+ page:1,
|
|
|
+ limit:10,
|
|
|
+ activityName:'',
|
|
|
+ categoryId:'',
|
|
|
+ districtId:''
|
|
|
+ })
|
|
|
+ const isOver = ref(false)
|
|
|
+ const list = ref([])
|
|
|
const top = ref(0)
|
|
|
const topAll = ref(0)
|
|
|
const timeShow = ref(false)
|
|
|
@@ -106,13 +111,23 @@
|
|
|
url:'/pagesHome/searchActivity',
|
|
|
events:{
|
|
|
confirmSearch: data => {
|
|
|
- console.log(data,'data');
|
|
|
+ initList();
|
|
|
+ proxy.$refs.searchRef.keyword = data;
|
|
|
+ queryParams.value.activityName = data;
|
|
|
+ getActivityList()
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+ const initList = () => {
|
|
|
+ queryParams.value.page = 1;
|
|
|
+ list.value = [];
|
|
|
+ isOver.value = false;
|
|
|
+ }
|
|
|
const changeType = (item,index) => {
|
|
|
+ initList();
|
|
|
+ queryParams.value.categoryId = item.id;
|
|
|
+
|
|
|
typeIndex.value = index;
|
|
|
if(typeList.value.length>4){
|
|
|
if(index<3) scrollLeft.value = 0
|
|
|
@@ -121,9 +136,13 @@
|
|
|
}
|
|
|
}
|
|
|
allShow.value = false;
|
|
|
+ getActivityList()
|
|
|
}
|
|
|
- const changeType2 = (item,index) => {
|
|
|
- if(item==='全部'){
|
|
|
+ const changeType2 = (item,name,index) => {
|
|
|
+ initList();
|
|
|
+ queryParams.value.categoryId = item.id;
|
|
|
+
|
|
|
+ if(name==='全部'){
|
|
|
typeIndex.value = '';
|
|
|
scrollLeft.value = 0;
|
|
|
}else{
|
|
|
@@ -137,6 +156,7 @@
|
|
|
}
|
|
|
}
|
|
|
allShow.value = false;
|
|
|
+ getActivityList()
|
|
|
}
|
|
|
|
|
|
const handleAll = () => {
|
|
|
@@ -144,8 +164,6 @@
|
|
|
// scrollLeft.value = 0;
|
|
|
timeShow.value = false;
|
|
|
placeShow.value = false;
|
|
|
-
|
|
|
- typeList2.value = [{id:'',name:'全部'}].concat(typeList.value);
|
|
|
allShow.value = true;
|
|
|
}
|
|
|
|
|
|
@@ -156,7 +174,9 @@
|
|
|
}
|
|
|
|
|
|
const showTime = () => {
|
|
|
- timeShow.value = true;
|
|
|
+ placeShow.value = false;
|
|
|
+ allShow.value = false;
|
|
|
+ timeShow.value = !timeShow.value;
|
|
|
setTimeout(()=>{
|
|
|
acRef.value.setStartEndDay(wtIndex.value);
|
|
|
},100)
|
|
|
@@ -167,12 +187,16 @@
|
|
|
}
|
|
|
|
|
|
const areaConfirm = (data) => {
|
|
|
+ initList()
|
|
|
place.value = data.city+'-'+data.area;
|
|
|
+ queryParams.value.districtId = data.areaId;
|
|
|
placeShow.value = false;
|
|
|
+ getActivityList()
|
|
|
}
|
|
|
|
|
|
const scrolltolower = () => {
|
|
|
- console.log(1);
|
|
|
+ if(isOver.value) return
|
|
|
+ getActivityList()
|
|
|
}
|
|
|
|
|
|
const getTop = () => {
|
|
|
@@ -188,7 +212,27 @@
|
|
|
}
|
|
|
}).exec()
|
|
|
}
|
|
|
+
|
|
|
+ const getTypeList = () => {
|
|
|
+ proxy.$api.get('/core/activity/category/list').then(({data:res})=>{
|
|
|
+ if(res.code!==0) return proxy.$showToast(res.msg)
|
|
|
+ typeList.value = [...res.data.map(d=>({id:d.id,name:d.categoryName}))];
|
|
|
+ typeList2.value = [{id:'',name:'全部'},...res.data.map(d=>({id:d.id,name:d.categoryName}))];
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ const getActivityList = () => {
|
|
|
+ proxy.$api.get('/core/activity/page',queryParams.value).then(({data:res})=>{
|
|
|
+ if(res.code!==0) return proxy.$showToast(res.msg)
|
|
|
+ list.value = [...list.value,...res.data.list];
|
|
|
+ queryParams.value.page++;
|
|
|
+ if(list.value>=res.data.total) isOver.value = true
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
onMounted(()=>{
|
|
|
+ getTypeList()
|
|
|
+ getActivityList()
|
|
|
nextTick(()=>{
|
|
|
getTop();
|
|
|
})
|