城阳居民端公众号前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

102 lines
3.4 KiB

<template>
<div class='container'>
<van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="communityActivity" class="card"
:offset="50">
<div class="activity_content flex" v-for="(item, index) in activityList" :key="index"@click="handelClickJump('activityDetail',item)">
<img :src="item.coverPic" alt="" class="mr10 img_round" style="width: 75px;height: 95px;">
<div class="flex flex-y flex1 flex-end" style="overflow: hidden;">
<div class="van-ellipsis">{{ item.activityName }}</div>
<div class="address font-size14 van-ellipsis gray">地点:{{ item.address }}</div>
<div class="time gray font-size14">时间:{{ item.startTime }}</div>
<div class="flex flex-end" v-if="item.online === 1">
<div>
<span>报名人数:</span> <span class="font-size18 orange">{{ item.currentParticipants }}</span>/<span
class="font-size14">{{ item.participants }}人</span>
</div>
<van-button type="info" size="small" round @click="handelClickJump('activityDetail',item)"
:disabled="new Date(item.cutOffTime.replace(/-/g, '/')).getTime()<Date.now() || item.currentParticipants >= item.participants">报名</van-button>
</div>
</div>
</div>
</van-list>
</div>
</template>
<script>
import { communityActivity } from '@/api/home';
export default {
data() {
return {
activityList: [],
pageSize: 5,
pageNo: 1,
agencyId: null,
finished: false,
loading: true,
showRegister: false,
};
},
created() {
this.agencyId = this.$store.state.app.agencyId;
this.communityActivity();
},
methods: {
async communityActivity() {
let parm = {
pageSize: this.pageSize,
pageNo: this.pageNo++,
agencyId: this.agencyId,
activityName: "",
status: "",
typeId: "",
startTime: "",
endTime: "",
address: "",
assistingParty: "",
}
let res = await communityActivity(parm)
if (res) {
this.loading = false;
if (res.list.length < this.pageSize) {
this.finished = true;
}
this.activityList = this.activityList.concat(res.list);
}
},
handelClickJump(path,item) {
if(path === 'activityDetail'){
if (this.$store.state.app.userInfo.mobile) {
this.$router.push({ path: `/${path}`,query:{id:item.id} });
} else {
this.showRegister = true;
}
}
}
},
components: {},
computed: {},
watch: {},
}
</script>
<style lang='less' scoped>
.activity_content {
padding-bottom: 15px;
box-sizing: border-box;
width: 100%;
border-bottom: 1px solid #EAEAEA;
margin-top: 14px;
min-height: 110px;
.img {
width: 231px;
height: 33px;
}
&:last-child {
border-bottom: none;
}
}
</style>