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.
310 lines
13 KiB
310 lines
13 KiB
<template>
|
|
<div class="pages">
|
|
<div class="blueBg"></div>
|
|
<div class="content">
|
|
<div class="flex flex-end">
|
|
<div class="flex flex-center2 white" @click="$router.push('/selectAgency')">
|
|
<img src="@/assets/images/icons/home.png" class="img_17 m-right10" alt="">
|
|
<span>{{ this.$store.state.app.userInfo.agencyName || '--' }}</span>
|
|
</div>
|
|
<div class="flex flex-center2">
|
|
<van-search v-model="searchKey" placeholder="请输入搜索关键词" shape="round" background="#3974f6"
|
|
style="width: 170px;"
|
|
@search="$router.push({ path: '/search', query: { searchKey: searchKey } })" />
|
|
<img src="@/assets/images/icons/mine.png"
|
|
@click="$router.push({ path: '/mine', query: { searchKey: searchKey } })" class="img_20 "
|
|
alt="">
|
|
</div>
|
|
</div>
|
|
<div class="swipe">
|
|
<van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
|
|
<van-swipe-item v-for="item in activityList">
|
|
<img :src="item.coverPic" alt=""
|
|
style="width: 100%;height: 150px; margin: 0 auto;border-radius: 15px;">
|
|
</van-swipe-item>
|
|
</van-swipe>
|
|
</div>
|
|
<div class="card flex flex-end flex-center2 m-top15 notice">
|
|
<img src="@/assets/images/icons/notice.png" class="img_17" alt="">
|
|
<div class="van-ellipsis flex-1">
|
|
<van-notice-bar color="#555555" background="#ffffff" text="在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。" />
|
|
|
|
</div>
|
|
<span class="gray notice_time">05-06</span>
|
|
<span class="gray">更多</span>
|
|
</div>
|
|
<div class="card m-top10">
|
|
<div class="flex white">
|
|
<div class="appeal m-right10 flex flex-y" @click="handelClickJump('event')">
|
|
<div>我有诉求</div>
|
|
<div class="font-size13 m-top5" style="color: #d8e6fe;"> 居民点单 社区接单</div>
|
|
</div>
|
|
<div class="verify">
|
|
<div>信息核实</div>
|
|
<div class="font-size13 m-top5" style="color: #d8e6fe;">登记信息 窗口办理</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-centr2 flex-mean m-top18">
|
|
<div class="flex-y flex flex-center1 flex-center2 nav font-size13 " v-for="(item, index) in tabList"
|
|
@click="handelClickJump(item.path)" :key="index">
|
|
<img :src="item.imgSrc" alt="">
|
|
<span>{{ item.title }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card m-top10">
|
|
<div class="title">
|
|
<span>社区活动</span>
|
|
<span @click="$router.push('/activity')">更多</span>
|
|
</div>
|
|
<div class="activity_content flex" v-for="(item, index) in activityList" :key="index">
|
|
<img :src="item.coverPic" alt="" class="mr10" 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">
|
|
<div>
|
|
<span>报名人数：</span> <span class="font-size18 orange">{{ item.participants }}</span>/<span
|
|
class="font-size14">{{ item.participants }}人</span>
|
|
</div>
|
|
<van-button type="info" size="small" round @click="handelClickJump(`activityDetail`,item)"
|
|
:disabled="item.online !== 1">报名</van-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card m-top10">
|
|
<div class="title">
|
|
<span>居民议事</span>
|
|
<span @click="$router.push('/discussion')">更多</span>
|
|
</div>
|
|
<div class="activity_content flex" v-for="(item, index) in eventList">
|
|
<div class="flex flex-y flex1 flex-end" style="overflow: hidden;">
|
|
<span class="van-multi-ellipsis--l2">
|
|
{{ item.eventContent }}
|
|
</span>
|
|
<div class="flex flex-end flex-center gray m-top10 font-size13">
|
|
<div class="flex flex-center"><img src="@/assets/images/icons/resi.png" class="img_16 m-right7" alt="">
|
|
<span>参与 {{ item.total }}</span></div>
|
|
<div class="flex flex-center" @click="handelClicsupport1(item.eventId)">
|
|
<img src="@/assets/images/icons/support.png" alt="" class="img_16 m-right7">
|
|
<span>支持 {{ item.supportNum }}</span></div>
|
|
<div class="flex flex-center" @click="handelClicopposeNum(item.eventId)" ><img src="@/assets/images/icons/oppose.png" alt=""
|
|
class="img_16 m-right7"><span>反对 {{ item.opposeNum }}</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card m-top10">
|
|
<div class="title">
|
|
<span>社区讯息</span>
|
|
<span @click="$router.push('/communityPublicity')">更多</span>
|
|
</div>
|
|
<div class="activity_content flex">
|
|
<van-tabs v-model="tagActive" style="width: 100%;" @change="handelChangeTags">
|
|
<van-tab v-for="item in tagList" :key="item.id" :title="item.tagName">
|
|
<div class="flex flex-y flex1 flex-end" v-if="PublicityList.length !== 0">
|
|
<div class="activity_content flex flex-y" v-for="(item, index) in PublicityList" :key="index">
|
|
<div class="flex flex1 ">
|
|
<span class="van-multi-ellipsis--l2 flex1" style="line-height: 28px;" >
|
|
{{ item.title }}
|
|
</span>
|
|
<img v-if="item.coverPic" :src="item.coverPic" style="width: 100px;height: 60px;" alt="">
|
|
</div>
|
|
<div class="flex flex-end flex-center gray m-top10 font-size13">
|
|
<div class="flex">
|
|
<div class="flex flex-center m-right26" v-if="item.tagId && tagList">{{filterTagId(item.tagId)}}</div>
|
|
<div class="flex flex-center"><img src="@/assets/images/icons/support.png"
|
|
alt="" class="img_16 m-right7"><span>{{ item.likes }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex1 text-align-right">{{item.releaseTime}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-else class="no-data">
|
|
暂无数据~
|
|
</div>
|
|
</van-tab>
|
|
</van-tabs>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<register-dialog v-if="showRegister" @close="showRegister = false"></register-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import registerDialog from '@/components/registerDialog';
|
|
import { communityActivity, icEventOldDiscuss, advertisingTag, communityPublicity,handelClicsupport } from '@/api/home';
|
|
export default {
|
|
data() {
|
|
return {
|
|
searchKey: null,//搜索栏
|
|
tabList: [
|
|
{
|
|
imgSrc: require('@/assets/images/nav/1.png'),
|
|
title: '社区讯息',
|
|
path: 'communityPublicity'
|
|
},
|
|
{
|
|
imgSrc: require('@/assets/images/nav/2.png'),
|
|
title: '社区活动',
|
|
path: 'activity'
|
|
},
|
|
{
|
|
imgSrc: require('@/assets/images/nav/3.png'),
|
|
title: '居民议事',
|
|
path: 'discussion'
|
|
},
|
|
{
|
|
imgSrc: require('@/assets/images/nav/4.png'),
|
|
title: '满意度测评',
|
|
path: 'notice'
|
|
},
|
|
{
|
|
imgSrc: require('@/assets/images/nav/5.png'),
|
|
title: '可享服务',
|
|
path: 'Enjoyableservices'
|
|
}
|
|
],
|
|
activityList: [],
|
|
eventList: [],
|
|
showRegister: false,
|
|
tagList: [],
|
|
tagActive: 'new',
|
|
tagId: null,
|
|
PublicityList:[]
|
|
};
|
|
},
|
|
created() {
|
|
console.log(this.$store.state.app);
|
|
this.agencyId = this.$store.state.app.agencyId;
|
|
this.userId = this.$store.state.app.userInfo.id;
|
|
this.communityActivity()//获取轮播图与活动列表
|
|
this.icEventOldDiscuss()//获取居民议事列表
|
|
this.advertisingTag()//获取社区讯息菜单
|
|
this.communityPublicity()//获取讯息列表
|
|
},
|
|
methods: {
|
|
async handelClicopposeNum(data){
|
|
let parm = {
|
|
eventId:data,
|
|
agencyId: this.agencyId,
|
|
userId: this.userId,
|
|
opinionFlag:1
|
|
}
|
|
console.log(parm);
|
|
let res = await handelClicsupport(parm)
|
|
|
|
this.icEventOldDiscuss()
|
|
|
|
},
|
|
async handelClicsupport1(data){
|
|
let parm = {
|
|
eventId:data,
|
|
agencyId: this.agencyId,
|
|
userId: this.userId,
|
|
opinionFlag:0
|
|
}
|
|
console.log(parm);
|
|
let res = await handelClicsupport(parm)
|
|
this.icEventOldDiscuss()
|
|
|
|
},
|
|
async communityActivity() {
|
|
let parm = {
|
|
pageSize: 10,
|
|
pageNo: 1,
|
|
agencyId: this.agencyId,
|
|
activityName: "",
|
|
status: "",
|
|
typeId: "",
|
|
startTime: "",
|
|
endTime: "",
|
|
address: "",
|
|
assistingParty: ""
|
|
}
|
|
let res = await communityActivity(parm)
|
|
if (res) {
|
|
this.activityList = res.list.slice(0, 2);
|
|
}
|
|
},
|
|
async icEventOldDiscuss() {
|
|
let parm = {
|
|
pageSize: 10,
|
|
pageNo: 1,
|
|
agencyId: null,
|
|
icEventId: null
|
|
}
|
|
let res = await icEventOldDiscuss(parm)
|
|
if (res) {
|
|
this.eventList = res.list.slice(0, 2)
|
|
}
|
|
},
|
|
async advertisingTag() {
|
|
let parm = {
|
|
pageSize: 10,
|
|
pageNo: 1,
|
|
status: 0,
|
|
tagName: null
|
|
}
|
|
let res = await advertisingTag(parm)
|
|
if (res) {
|
|
this.tagList = res.list;
|
|
this.tagList.unshift({ tagName: '最新', id: 'new' })
|
|
}
|
|
},
|
|
async communityPublicity() {
|
|
let parm = {
|
|
pageSize: 10,
|
|
pageNo: 1,
|
|
title: '',
|
|
tagId: this.tagId,
|
|
startTime: '',
|
|
endTime: '',
|
|
agencyId: this.agencyId
|
|
}
|
|
let res = await communityPublicity(parm)
|
|
if (res) {
|
|
this.PublicityList = res.list.slice(0, 2)
|
|
}
|
|
},
|
|
handelChangeTags(val,title){
|
|
if(val !== 0){
|
|
this.tagId = this.tagList[val].id;
|
|
}else{
|
|
this.tagId = '';
|
|
}
|
|
this.communityPublicity()
|
|
},
|
|
filterTagId(tagId){
|
|
return this.tagList.filter(item=>item.id === tagId)[0].tagName || '--';
|
|
},
|
|
handelClickJump(path,item) {
|
|
if (path === 'event' || path === 'service' || path === 'activity') {
|
|
if (this.$store.state.app.userInfo.mobile) {
|
|
this.$router.push({ path: `/${path}` });
|
|
} else {
|
|
this.showRegister = true;
|
|
}
|
|
} else {
|
|
this.$router.push({ path: `/${path}`,query:item })
|
|
}
|
|
},
|
|
|
|
},
|
|
components: { registerDialog },
|
|
computed: {},
|
|
watch: {},
|
|
}
|
|
</script>
|
|
|
|
<style lang='less' scoped>
|
|
@import './index';
|
|
|
|
:deep(.van-field__control) {
|
|
font-size: 13px;
|
|
}
|
|
</style>
|
|
|