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.
296 lines
8.9 KiB
296 lines
8.9 KiB
7 months ago
|
<template>
|
||
|
<view class="body">
|
||
|
<mescroll-uni class="mescroll-uni" ref="mescrollRef" @down="downCallback" @up="getData" @init="mescrollInit" :up="upOption" :down="downOption">
|
||
|
<view class="list">
|
||
|
<view class="fd2_box" v-for="(item, index) in items" :key="index">
|
||
|
<view class="fd2_inner d_flex j_between">
|
||
|
<view class="left d_flex j_center"><image class="checked" src="/static/checked2.png" mode="widthFix"></image></view>
|
||
|
<view class="right">
|
||
|
|
||
|
<view class="fd2_title" v-text="item.title"></view>
|
||
|
<view class="fd2_subtitle d_flex a_center">
|
||
|
<view class="icon_con"><image class="icon icon1" src="/static/news_icon1.png"></image></view>
|
||
|
<view class="txt txt1">活动名称:{{ item.Title }}</view>
|
||
|
</view>
|
||
|
<view class="fd2_subtitle">
|
||
|
<view class="icon_con"><image class="icon icon2" src="/static/news_icon2.png"></image></view>
|
||
|
<view class="txt" v-text="item.stime + ' - ' + item.etime"></view>
|
||
|
</view>
|
||
|
<view class="fd2_subtitle">
|
||
|
<view class="icon_con"><image class="icon icon3" src="/static/news_icon3.png"></image></view>
|
||
|
<view class="txt">负责人:{{ item.LinkUrl }}</view>
|
||
|
</view>
|
||
|
<view class="fd2_subtitle">
|
||
|
<view class="icon_con"><image class="icon icon4" src="/static/news_icon4.png"></image></view>
|
||
|
<view class="txt">活动地址:{{ item.MContent }}</view>
|
||
|
</view>
|
||
|
<view class="fd2_subtitle">
|
||
|
<view class="icon_con"><image class="icon icon5" src="/static/news_icon5.png"></image></view>
|
||
|
<view class="txt">活动介绍:{{ item.Content }}</view>
|
||
|
</view>
|
||
|
<view class="fd2_subtitle" v-if="item.isqd==1" style="color:#f33030">
|
||
|
<view class="icon_con">
|
||
|
<image class="icon icon6" src="/static/news_icon6.png"></image>
|
||
|
</view>
|
||
|
<view class="txt">已签到,签到时间:{{ item.qdtime }}</view>
|
||
|
</view>
|
||
|
<navigator open-type="switchTab" hover-class="none" url="/pages/tab/my/index" class="fd2_subtitle" style="color:#ffb155" v-else>
|
||
|
<view class="icon_con">
|
||
|
<image class="icon icon6" src="/static/news_icon7.png"></image>
|
||
|
</view>
|
||
|
<view class="txt">暂未签到,快去签到吧</view>
|
||
|
</navigator>
|
||
|
<!-- <view class="sign_in" v-if="item.isqd==0" @click="showClick(index)">签到</view> -->
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<!-- <view class="alert_con" v-if="isAlert">
|
||
|
<view class="alert_content">
|
||
|
<image class="qr_img" :src="qrImg"></image>
|
||
|
</view>
|
||
|
<image @click="closeClick" class="close_icon" src="/static/close_icon.png"></image>
|
||
|
</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 //是否自动加载
|
||
|
},
|
||
|
items: [],
|
||
|
id: '',
|
||
|
isAlert:false,
|
||
|
itemIndex:0,
|
||
|
qrImg:""
|
||
|
};
|
||
|
},
|
||
|
onLoad(options) {
|
||
|
this.id = options.id;
|
||
|
this.getQr();
|
||
|
},
|
||
|
onReady() {},
|
||
|
onShow() {},
|
||
|
computed: {},
|
||
|
methods: {
|
||
|
showClick(index){
|
||
|
this.itemIndex = index;
|
||
|
this.isAlert = true;
|
||
|
},
|
||
|
closeClick(){
|
||
|
this.isAlert = false;
|
||
|
},
|
||
|
getQr(){
|
||
|
let that = this;
|
||
|
that.$doPost('Server.aspx', {
|
||
|
mod: 'getQR'
|
||
|
})
|
||
|
.then(res => {
|
||
|
if (res.data.resultcode != 0) {
|
||
|
that.$util.showToast(res.data.msg);
|
||
|
return;
|
||
|
}
|
||
|
let body = res.data.data;
|
||
|
that.qrImg = body;
|
||
|
})
|
||
|
.catch(err => {
|
||
|
console.log('request fail', err);
|
||
|
});
|
||
|
},
|
||
|
getData(mescroll) {
|
||
|
let that = this;
|
||
|
that.$doPost('Server.aspx', {
|
||
|
mod: 'getHDhistory',
|
||
|
page: mescroll.num,
|
||
|
pagesize: mescroll.size,
|
||
|
hdid:that.id
|
||
|
})
|
||
|
.then(res => {
|
||
|
if (res.data.resultcode != 0) {
|
||
|
that.$util.showToast(res.data.msg);
|
||
|
return;
|
||
|
}
|
||
|
let body = res.data.data;
|
||
|
body.filter(function(item, index) {
|
||
|
item.stime = that.$util.strDateFormat(item.stime,"yyyy.MM.dd hh:mm");
|
||
|
item.etime = that.$util.strDateFormat(item.etime,"yyyy.MM.dd hh:mm");
|
||
|
if(item.qdtime){
|
||
|
item.qdtime = that.$util.strDateFormat(item.qdtime,"yyyy-MM-dd hh:mm");
|
||
|
}
|
||
|
});
|
||
|
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);
|
||
|
});
|
||
|
},
|
||
|
mescrollInit(mescroll) {
|
||
|
this.mescroll = mescroll;
|
||
|
},
|
||
|
downCallback(mescroll) {
|
||
|
this.isAlert = false;
|
||
|
this.mescroll.resetUpScroll();
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss">
|
||
|
page,
|
||
|
.body {
|
||
|
background: #ffffff;
|
||
|
}
|
||
|
.fd2_box {
|
||
|
margin: 0 30upx;
|
||
|
border-bottom: 1upx solid #e6e3e3;
|
||
|
}
|
||
|
.fd2_box:last-child {
|
||
|
border-bottom: none;
|
||
|
}
|
||
|
.checked {
|
||
|
width: 24upx;
|
||
|
height: 24upx;
|
||
|
}
|
||
|
.fd2_box .fd2_inner {
|
||
|
padding-bottom: 30upx;
|
||
|
padding-top: 30upx;
|
||
|
position: relative;
|
||
|
}
|
||
|
.fd2_box .fd2_inner::after {
|
||
|
background: #ffb155;
|
||
|
width: 6upx;
|
||
|
height: calc(100% - 106upx);
|
||
|
position: absolute;
|
||
|
left: 23upx;
|
||
|
top: 74upx;
|
||
|
z-index: 10;
|
||
|
content: '';
|
||
|
border-radius: 10upx;
|
||
|
}
|
||
|
.fd2_inner .left {
|
||
|
width: 50upx;
|
||
|
}
|
||
|
.fd2_inner .fd2_title {
|
||
|
color: #313131;
|
||
|
font-size: 28upx;
|
||
|
line-height: 32upx;
|
||
|
width: 85%;
|
||
|
}
|
||
|
.fd2_inner .fd2_subtitle {
|
||
|
color: #95979d;
|
||
|
font-size: 24upx;
|
||
|
line-height: 32upx;
|
||
|
padding-top: 14upx;
|
||
|
overflow: hidden;
|
||
|
}
|
||
|
.fd2_inner .right {
|
||
|
width: calc(100% - 50upx);
|
||
|
position: relative;
|
||
|
}
|
||
|
.fd2_inner .fd2_subtitle .txt{
|
||
|
width: calc(100% - 40upx);
|
||
|
float: left;
|
||
|
}
|
||
|
.fd2_inner .fd2_subtitle .txt1{
|
||
|
width: 80%;
|
||
|
}
|
||
|
.fd2_inner .fd2_subtitle .icon_con{
|
||
|
width: 40upx;
|
||
|
float: left;
|
||
|
}
|
||
|
.fd2_inner .sign_in{
|
||
|
position: absolute;
|
||
|
width: 112upx;
|
||
|
height: 62upx;
|
||
|
border:1upx solid #ffb155;
|
||
|
border-radius:10upx;
|
||
|
color:#ffb155;
|
||
|
text-align: center;
|
||
|
line-height: 62upx;
|
||
|
box-sizing: border-box;
|
||
|
right: 0;
|
||
|
top: 0;
|
||
|
z-index: 10;
|
||
|
}
|
||
|
.icon1 {
|
||
|
width: 27upx;
|
||
|
height: 27upx;
|
||
|
}
|
||
|
.icon2 {
|
||
|
width: 25upx;
|
||
|
height: 26upx;
|
||
|
margin-top: 5upx;
|
||
|
}
|
||
|
.icon3 {
|
||
|
width: 24upx;
|
||
|
height: 26upx;
|
||
|
margin-top: 4upx;
|
||
|
}
|
||
|
.icon4 {
|
||
|
width: 22upx;
|
||
|
height: 29upx;
|
||
|
}
|
||
|
.icon5 {
|
||
|
width: 24upx;
|
||
|
height: 26upx;
|
||
|
margin-top: 4upx;
|
||
|
}
|
||
|
.icon6 {
|
||
|
width: 28upx;
|
||
|
height: 27upx;
|
||
|
margin-top: 4upx;
|
||
|
}
|
||
|
.alert_con{
|
||
|
position: fixed;
|
||
|
left: 0;
|
||
|
top: 0;
|
||
|
z-index: 1002;
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
background: rgba(0,0,0,0.8);
|
||
|
}
|
||
|
.alert_con .alert_content{
|
||
|
position: absolute;
|
||
|
left: 50%;
|
||
|
top: 50%;
|
||
|
transform: translate(-50%,-50%);
|
||
|
}
|
||
|
.alert_con .alert_content .qr_img{
|
||
|
width: 320upx;
|
||
|
height: 320upx;
|
||
|
border:10upx solid #fff;
|
||
|
box-sizing: border-box;
|
||
|
}
|
||
|
.alert_con .close_icon{
|
||
|
width: 26upx;
|
||
|
height: 27upx;
|
||
|
padding:20upx;
|
||
|
border-radius: 50%;
|
||
|
background: rgba(255,255,255,1);
|
||
|
position: absolute;
|
||
|
right: 50upx;
|
||
|
top: 50upx;
|
||
|
z-index: 1003;
|
||
|
}
|
||
|
</style>
|