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.
 
 
 
 

418 lines
13 KiB

<template>
<view class="body">
<mescroll-uni ref="mescrollRef" @down="downCallback" @up="getData" :up="upOption" :down="downOption">
<!-- <view class="tab_con2 d_flex j_space_around a_center">
<view v-for="(item, index) in tabs" :key="index" v-text="item.title" class="tab_nav" :class="tabIndex == index ? 'on' : ''" @click="tabClick(index)"></view>
</view> -->
<view class="body_content">
<view class="activity_list" v-if="tabIndex == 0">
<view class="activity_nav" v-for="(item, index) in items" :key="index">
<navigator hover-class="none" :url="'/pages/activity/detail/index?id=' + item.scid" class="activity_nav_img">
<image class="img" :src="item.imgurl"></image>
<image v-if="item.isActivity == 1" class="activity_icon" src="/static/activity_icon1.png"></image>
<image v-else class="activity_icon" src="/static/activity_icon2.png"></image>
</navigator>
<view class="activity_nav_content">
<view class="activity_nav_title">
<navigator hover-class="none" :url="'/pages/activity/detail/index?id=' + item.scid" class="activity_nav_title_1 two_hidden" v-text="item.Title"></navigator>
<view class="collect" @click="collectClick(index)">
<image v-if="item.isCollect == 0" class="collect_img" src="/static/collect1.png"></image>
<image v-else class="collect_img" src="/static/collect2.png"></image>
</view>
</view>
<navigator hover-class="none" :url="'/pages/activity/detail/index?id=' + item.scid">
<view class="activity_nav_subtitle text_hidden" v-text="item.content2"></view>
<view class="activity_nav_time" v-text="item.stime + ' - ' + item.etime"></view>
<view class="activity_nav_label d_flex" v-if="item.biaoqian.length>0">
<view class="activity_nav_label_txt label2" v-for="(item2,index2) in item.biaoqian" :key="index2" v-text="item2" v-if="index2<3"></view>
</view>
</navigator>
</view>
</view>
</view>
<view class="changguan_list" v-else>
<view class="changguan_nav" v-for="(item, index) in items" :key="index">
<navigator hover-class="none" :url="'/pages/changguan/detail/index?id=' + item.scid" class="changguan_inner">
<view class="changguan_nav_img"><image class="img" :src="item.imgurl"></image></view>
<view class="changguan_nav_content">
<view class="changguan_nav_title font_bold text_hidden" v-text="item.Title"></view>
<view class="changguan_nav_subtitle text_hidden" v-text="item.subtitle"></view>
<view class="changguan_nav_label d_flex">
<view v-for="(item2,index2) in item.biaoqian" :key="index2" class="changguan_nav_label_txt" :class="[index2==0?'label1':'',index2==1?'label2':'',index2==2?'label3':'']" v-text="item2"></view>
</view>
</view>
</navigator>
<view class="collect" @click="collectClick(index)">
<image v-if="item.isCollect == 0" class="collect_img" src="/static/collect1.png"></image>
<image v-else class="collect_img" src="/static/collect2.png"></image>
</view>
</view>
</view>
</view>
</mescroll-uni>
</view>
</template>
<script>
import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins.js';
export default {
mixins: [MescrollMixin],
components: {},
data() {
return {
mescroll: null,
downOption: {
use: false, //是否启用下拉刷新
auto: false //是否自动加载
},
upOption: {
use: true, //是否启用上拉加载更多
auto: true //是否自动加载
},
tabIndex: 1,
/* tabs: [{title:'活动'},{title:'场馆'}], */
items:[]
};
},
onLoad(options) {
let that = this;
},
onReady() {},
onShow() {},
methods: {
tabClick(e) {
this.tabIndex = e;
this.mescroll.resetUpScroll();
},
collectClick(e) {
let index = e;
let that = this;
that.$doPost('Server.aspx', {
mod: 'addSC',
scid: that.items[index].scid,
type: that.tabIndex
})
.then(res => {
if (res.data.resultcode != 0) {
that.$util.showToast(res.data.msg);
return;
}
if (that.items[index].isCollect == 0) {
that.items[index].isCollect = 1;
} else {
that.items[index].isCollect = 0;
}
that.$util.showToast('操作成功');
})
.catch(err => {
console.log('request fail', err);
});
},
getData(mescroll) {
let that = this;
that.$doPost('Server.aspx', {
mod: 'getSClist',
page: mescroll.num,
pagesize: mescroll.size,
type:that.tabIndex
})
.then(res => {
if (res.data.resultcode != 0) {
that.$util.showToast(res.data.msg);
return;
}
let body = res.data.data;
body.filter(function(item, index) {
if(that.tabIndex==0){
item.imgurl = that.baseImgUrl + item.imgurl;
if(!item.biaoqian){
item.biaoqian = [];
}else{
item.biaoqian = item.biaoqian.split("|");
}
if(new Date() > that.$util.strDateFormat(item.etime)){
item.isActivity = 0;
}else{
item.isActivity = 1;
}
item.stime = that.$util.strDateFormat(item.stime,"yyyy.MM.dd");
item.etime = that.$util.strDateFormat(item.etime,"yyyy.MM.dd");
}else{
item.imgurl = that.baseImgUrl + item.imgurl;
if(!item.biaoqian){
item.biaoqian = [];
}else{
item.biaoqian = item.biaoqian.split("|");
}
}
item.isCollect = 1;
});
if (mescroll.num == 1) {
that.items = body;
} else {
that.items = that.items.concat(body);
}
mescroll.endSuccess(body.length);
})
.catch(err => {
that.$util.showToast('网络错误,稍后重试');
mescroll.endErr();
console.log('request fail', err);
});
},
downCallback(mescroll) {
setTimeout(function() {
mescroll.endSuccess(0);
}, 600);
}
},
onShareTimeline(res) {
return {
title: '活动列表',
imageUrl: '',
query: ''
};
},
onShareAppMessage(res) {
return {
title: '活动列表',
imageUrl: '',
path: ''
};
}
};
</script>
<style lang="scss">
page,
.body {
background: #fff;
}
.tab_con2 {
padding: 0 30upx;
position: fixed;
width: calc(100% - 60upx);
left: 0;
top: 0;
z-index: 1000;
background: #fff;
height: 70upx;
line-height: 70upx;
}
.tab_con2 .tab_nav {
color: #999;
font-size: 30upx;
position: relative;
}
.tab_con2 .tab_nav::after {
width: 40upx;
height: 4upx;
background: #fff;
border-radius: 10upx;
content: '';
position: absolute;
left: 50%;
margin-left: -20upx;
bottom: 0;
}
.tab_con2 .tab_nav.on::after {
background: #ffb155;
}
/*活动列表*/
.activity_list {
width: 100%;
overflow: hidden;
padding-top: 70upx;
}
.activity_nav {
border-radius: 20upx;
box-shadow: 0px 5upx 15upx 0px rgba(0, 0, 0, 0.15);
height: 224upx;
margin: 0 30upx 50upx 30upx;
position: relative;
z-index: 10;
}
.activity_nav:first-child {
margin-top: 50upx;
}
.activity_nav .activity_nav_img {
width: 302upx;
height: 100%;
border-top-left-radius: 20upx;
border-bottom-left-radius: 20upx;
float: left;
position: relative;
}
.activity_nav .activity_nav_img .img {
width: 100%;
height: 100%;
border-top-left-radius: 20upx;
border-bottom-left-radius: 20upx;
}
.activity_nav .activity_nav_img .activity_icon {
position: absolute;
width: 94upx;
height: 42upx;
left: 20upx;
top: -20upx;
z-index: 10;
}
.activity_nav .activity_nav_content {
width: calc(100% - 338upx);
margin-left: 20upx;
float: left;
padding-right: 16upx;
}
.activity_nav .activity_nav_title {
font-size: 30upx;
color: #3c3d3b;
margin-top: 10upx;
line-height: 40upx;
position: relative;
}
.activity_nav .activity_nav_title_1{
width: 80%;
}
.activity_nav .collect_img {
position: absolute;
width: 40upx;
height: 39upx;
z-index: 1003;
right: -16upx;
top: -5upx;
padding-top: 10upx;
padding-right: 16upx;
}
.activity_nav .activity_nav_subtitle {
color: #767676;
font-size: 24upx;
margin-top: 8upx;
margin-bottom: 8upx;
}
.activity_nav .activity_nav_time {
color: #767676;
font-size: 24upx;
}
.activity_nav .activity_nav_label {
margin-top: 8upx;
}
.activity_nav .activity_nav_label_txt {
padding: 0 10upx;
height: 34upx;
line-height: 34upx;
text-align: center;
font-size: 24upx;
color: #fff;
margin-right: 20upx;
}
.activity_nav .activity_nav_label_txt.label1 {
background: #f27491;
margin-right: 20upx;
}
.activity_nav .activity_nav_label_txt.label2 {
background: #eaa24e;
}
.activity_nav .activity_nav_label_txt:last-child{
margin-right: 0;
}
/*场馆列表*/
.changguan_list {
width: 100%;
overflow: hidden;
padding-top: 0;
}
.changguan_nav {
margin: 0 30upx 50upx 30upx;
position: relative;
z-index: 10;
}
.changguan_nav .changguan_inner {
width: 100%;
overflow: hidden;
border-radius: 20upx;
box-shadow: 0px 5upx 15upx 0px rgba(0, 0, 0, 0.15);
height: 183upx;
}
.changguan_nav .collect_img {
position: absolute;
width: 40upx;
height: 39upx;
z-index: 1003;
right: 0;
top: 0;
padding-top: 20upx;
padding-right: 24upx;
}
.changguan_nav .changguan_time {
font-size: 24upx;
color: #999;
padding-top: 30upx;
padding-bottom: 14upx;
border-bottom: 1upx solid #f4f2f2;
}
.changguan_nav .changguan_time .icon {
width: 29upx;
height: 30upx;
margin-right: 10upx;
}
.changguan_nav:first-child {
margin-top: 50upx;
}
.changguan_nav .changguan_nav_img {
width: 302upx;
height: 100%;
border-top-left-radius: 20upx;
border-bottom-left-radius: 20upx;
float: left;
position: relative;
}
.changguan_nav .changguan_nav_img .img {
width: 100%;
height: 100%;
border-top-left-radius: 20upx;
border-bottom-left-radius: 20upx;
}
.changguan_nav .changguan_nav_content {
width: calc(100% - 338upx);
margin-left: 20upx;
float: left;
padding-right: 16upx;
}
.changguan_nav .changguan_nav_title {
font-size: 30upx;
color: #3c3d3b;
margin-top: 18upx;
line-height: 40upx;
width: 82%;
}
.changguan_nav .changguan_nav_subtitle {
color: #767676;
font-size: 24upx;
margin-top: 18upx;
margin-bottom: 18upx;
}
.changguan_nav .changguan_nav_label {
}
.changguan_nav .changguan_nav_label_txt {
width: calc((100% - 40upx) / 3);
height: 34upx;
line-height: 34upx;
text-align: center;
font-size: 24upx;
color: #fff;
}
.changguan_nav .changguan_nav_label_txt.label1 {
background: #fdf6e5;
color: #f4bd67;
margin-right: 20upx;
}
.changguan_nav .changguan_nav_label_txt.label2 {
background: #f2fcfe;
color: #80a9f4;
margin-right: 20upx;
}
.changguan_nav .changguan_nav_label_txt.label3 {
background: #f3f5f8;
color: #9f9d9d;
}
</style>