[最新更新]

This commit is contained in:
2024-03-04 15:13:17 +08:00
parent 51a04d53ce
commit ee98f5921d
42 changed files with 1853 additions and 74 deletions

View File

@@ -0,0 +1,76 @@
/*
* 手太欠
* 愿这世界都如故事里一样 美好而动人~
*/
Page({
/**
* 页面的初始数据
*/
data: {
popupShow : false,
code : '',
vouchers : [],
layIndex : 0
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
this.setData({
code: options.scene
})
this.codesInfo();
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {},
/**
* 核销列表
*/
codesInfo() {
wx.$api.empower.codes({
code: this.data.code
}).then(res => {
this.setData({
vouchers: res.data
})
}).catch(err => {})
},
/**
* 报名信息弹出关闭
*/
usersHide() {
this.setData({
popupShow: false
})
},
// 显示确认弹出层
onShowLay(e){
let index = e.currentTarget.dataset.index
this.setData({
layIndex : index,
popupShow: true
})
},
// 签到
onSign(e){
let id = e.currentTarget.dataset.id
wx.$api.empower.sign({
item_id: id
}).then(res => {
this.setData({
popupShow: false
})
this.codesInfo();
}).catch(err => { })
}
})

View File

@@ -0,0 +1,3 @@
{
"usingComponents": {}
}

View File

@@ -0,0 +1,72 @@
<view class="content">
<!-- 核销凭证列表 -->
<block wx:if="{{vouchers.length > 0}}">
<view class="vouchers" wx:for="{{vouchers}}" wx:key="vouchers">
<image class="vouchers-icon" src="/static/icons/sign.png" mode="widthFix" wx:if="{{!item.can_sign}}"></image>
<view class="vouchers-info">
<view class="vouchers-info-item title">{{item.empower.title}}(第{{item.semester.no}}期)</view>
<view class="vouchers-info-item">报名人:{{item.name}}</view>
<view class="vouchers-info-item">有效期:{{item.semester.end}}</view>
</view>
<view class="vouchers-btns">
<view class="vouchers-btn" bindtap="onShowLay" data-index="{{index}}">{{item.can_sign ? '立即使用': '查看凭证'}}</view>
</view>
</view>
</block>
<view class="pack-center pages-hint" wx:else>
<image src="/static/imgs/text_null.png"></image>
<view>暂无数据</view>
</view>
<!-- 核销弹出层 -->
<view class="lay-back {{popupShow ? 'active' : ''}}"></view>
<view class="lay-info {{popupShow ? 'active' : ''}}">
<block wx:if="{{vouchers.length > 0}}">
<view class="lay-title">报名信息<image class="lay-title-icon" bindtap="usersHide" src="/static/icons/close.png"></image></view>
<view class="lay-content">
<view class="lay-item">
<label>报名课程</label>
<view class="lay-item-val">{{vouchers[layIndex].empower.title}}</view>
</view>
<view class="lay-item">
<label>学期名称</label>
<view class="lay-item-val">{{vouchers[layIndex].empower.subtitle}}</view>
</view>
<view class="lay-item">
<label>报名姓名</label>
<view class="lay-item-val">{{vouchers[layIndex].name}}</view>
</view>
<view class="lay-item">
<label>报名电话</label>
<view class="lay-item-val">{{vouchers[layIndex].mobile}}</view>
</view>
<view class="lay-item">
<label>开始时间</label>
<view class="lay-item-val">{{vouchers[layIndex].semester.start}}</view>
</view>
<view class="lay-item">
<label>结束时间</label>
<view class="lay-item-val">{{vouchers[layIndex].semester.end}}</view>
</view>
<view class="lay-item">
<label>课程地点</label>
<view class="lay-item-val">{{vouchers[layIndex].semester.address}}</view>
</view>
</view>
<view class="lay-border"></view>
<view class="lay-content">
<view class="lay-item">
<label>签到状态</label>
<view class="lay-item-val bold">{{vouchers[layIndex].can_sign ? '未签到': '已签到'}}</view>
</view>
<view class="lay-item" wx:if="{{!vouchers[layIndex].can_sign}}">
<label>签到时间</label>
<view class="lay-item-val">{{vouchers[layIndex].sign_at}}</view>
</view>
</view>
<view class="lay-btns">
<button class="lay-btn" disabled="{{!vouchers[layIndex].can_sign}}" bindtap="onSign" data-id="{{vouchers[layIndex].item_id}}">{{vouchers[layIndex].can_sign ? '签到': '已签到'}}</button>
</view>
</block>
</view>
</view>

View File

@@ -0,0 +1,194 @@
page {
background-color: #f7f7f7;
padding: 30rpx;
box-sizing: border-box;
}
/* 票券 */
.vouchers {
background: white;
border-radius: 20rpx;
margin-bottom: 30rpx;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
position: relative;
}
.vouchers-icon {
position: absolute;
width: 100rpx;
height: 100rpx;
z-index: 1;
top: 15%;
left: 53%;
opacity: .5;
}
.vouchers-info {
position: relative;
padding: 20rpx 30rpx;
font-size: 28rpx;
border-right: dashed 2rpx #ddd;
width: calc(100% - 200rpx);
box-sizing: border-box;
}
.vouchers-info::after,
.vouchers-info::before {
content: " ";
height: 22rpx;
width: 22rpx;
background: #f7f7f7;
position: absolute;
right: -11rpx;
border-radius: 50%;
}
.vouchers-info::after {
top: -11rpx;
}
.vouchers-info::before {
bottom: -11rpx;
}
.vouchers-info-item {
line-height: 40rpx;
font-size: 26rpx;
color: gray;
}
.vouchers-info-item.bold {
font-weight: bold;
}
.vouchers-info-item.title {
font-size: 30rpx;
margin-bottom: 10rpx;
font-weight: bold;
color: #333;
}
.vouchers-btns {
width: 200rpx;
text-align: center;
}
.vouchers-btn {
background: #da2b56;
color: white;
line-height: 60rpx;
border-radius: 30rpx;
width: 150rpx;
font-size: 26rpx;
display: inline-block;
}
/* 核销凭证弹出层 */
.lay-back {
top: 0;
left: 0;
position: fixed;
width: 100vw;
height: 100vh;
z-index: 998;
background-color: rgba(0, 0, 0, .5);
display: none;
}
.lay-back.active {
display: block;
}
.lay-info {
width: 100vw;
box-sizing: border-box;
padding-bottom: 50rpx;
position: fixed;
left: 0;
bottom: 0;
z-index: 999;
background-color: #ffffff;
display: none;
transition: .2s;
height: 65vh;
overflow-y: scroll;
}
.lay-info.active {
display: block;
}
.lay-title {
font-size: 40rpx;
font-weight: bold;
text-align: center;
color: #333;
line-height: 60rpx;
padding: 50rpx;
position: relative;
}
.lay-title-icon {
position: absolute;
right: 30rpx;
top: 44rpx;
width: 40rpx;
height: 40rpx;
}
.lay-content {
padding: 0 40rpx;
}
.lay-item {
display: flex;
justify-content: space-between;
font-size: 30rpx;
padding: 10rpx 0;
line-height: 40rpx;
}
.lay-item label {
color: gray;
width: 160rpx;
}
.lay-item-val {
width: calc(100% - 160rpx);
}
.lay-item-val.bold {
color: #da2b56;
font-weight: bold;
}
.lay-border {
border-bottom: dashed 2rpx #ddd;
margin: 40rpx 0;
}
.lay-btns {
padding: 40rpx;
}
button.lay-btn {
width: 100%;
margin: 0;
background: #da2b56;
color: white;
height: 90rpx;
line-height: 90rpx;
padding: 0;
border-radius: 45rpx;
}
button.lay-btn ::after {
display: none;
}
button.lay-btn [disabled] {
opacity: .7;
}