初次提交
This commit is contained in:
lym
226
pages/qiandao/weapp_signin_demo.js
Normal file
226
pages/qiandao/weapp_signin_demo.js
Normal file
@@ -0,0 +1,226 @@
|
||||
/**
|
||||
* 微信小程序签到功能API调用示例
|
||||
*/
|
||||
|
||||
/**
|
||||
* 用户签到
|
||||
* @param {string} userId - 用户ID
|
||||
* @param {string} loginId - 登录ID
|
||||
* @returns {Promise} 返回签到结果
|
||||
*/
|
||||
function doWeappSignin(userId, loginId) {
|
||||
return new Promise((resolve, reject) => {
|
||||
wx.request({
|
||||
url: '/apiajax.ashx', // 根据实际部署路径调整
|
||||
method: 'POST',
|
||||
data: {
|
||||
action: 'weapp_signin',
|
||||
userId: userId,
|
||||
LoginId: loginId
|
||||
},
|
||||
header: {
|
||||
'content-type': 'application/x-www-form-urlencoded'
|
||||
},
|
||||
success: function(res) {
|
||||
if (res.data) {
|
||||
resolve(res.data);
|
||||
} else {
|
||||
reject({ msg: '网络错误或服务器无响应' });
|
||||
}
|
||||
},
|
||||
fail: function(err) {
|
||||
reject(err);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取用户签到信息
|
||||
* @param {string} userId - 用户ID
|
||||
* @param {string} loginId - 登录ID
|
||||
* @returns {Promise} 返回签到信息
|
||||
*/
|
||||
function getWeappSigninInfo(userId, loginId) {
|
||||
return new Promise((resolve, reject) => {
|
||||
wx.request({
|
||||
url: '/apiajax.ashx', // 根据实际部署路径调整
|
||||
method: 'GET',
|
||||
data: {
|
||||
action: 'weapp_getsignininfo',
|
||||
userId: userId,
|
||||
LoginId: loginId
|
||||
},
|
||||
header: {
|
||||
'content-type': 'application/x-www-form-urlencoded'
|
||||
},
|
||||
success: function(res) {
|
||||
if (res.data) {
|
||||
resolve(res.data);
|
||||
} else {
|
||||
reject({ msg: '网络错误或服务器无响应' });
|
||||
}
|
||||
},
|
||||
fail: function(err) {
|
||||
reject(err);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 微信小程序签到页面示例
|
||||
*/
|
||||
Page({
|
||||
data: {
|
||||
userInfo: null,
|
||||
continuousDays: 0, // 连续签到天数
|
||||
isTodaySigned: false, // 今天是否已签到
|
||||
lastSignInDate: '', // 最近签到日期
|
||||
weekSigned: [], // 本周签到情况
|
||||
rewardPoints: 0, // 本次签到获得积分
|
||||
totalPoints: 0 // 总积分
|
||||
},
|
||||
|
||||
onLoad: function(options) {
|
||||
// 页面加载时获取用户签到信息
|
||||
this.loadSigninInfo();
|
||||
},
|
||||
|
||||
/**
|
||||
* 加载签到信息
|
||||
*/
|
||||
loadSigninInfo: function() {
|
||||
const userId = wx.getStorageSync('userId');
|
||||
const loginId = wx.getStorageSync('LoginId');
|
||||
|
||||
if (!userId || !loginId) {
|
||||
wx.showToast({
|
||||
title: '请先登录',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
getWeappSigninInfo(userId, loginId)
|
||||
.then(res => {
|
||||
if (res.status === 1) {
|
||||
this.setData({
|
||||
continuousDays: parseInt(res.continuousDays),
|
||||
isTodaySigned: parseInt(res.isTodaySigned) === 1,
|
||||
lastSignInDate: res.lastSignInDate,
|
||||
weekSigned: res.weekSigned || []
|
||||
});
|
||||
} else {
|
||||
console.error('获取签到信息失败:', res.msg);
|
||||
wx.showToast({
|
||||
title: res.msg || '获取信息失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.error('请求失败:', err);
|
||||
wx.showToast({
|
||||
title: '网络错误',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 执行签到
|
||||
*/
|
||||
doSignin: function() {
|
||||
const userId = wx.getStorageSync('userId');
|
||||
const loginId = wx.getStorageSync('LoginId');
|
||||
|
||||
if (!userId || !loginId) {
|
||||
wx.showToast({
|
||||
title: '请先登录',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.data.isTodaySigned) {
|
||||
wx.showToast({
|
||||
title: '今天已签到',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
wx.showLoading({
|
||||
title: '正在签到...'
|
||||
});
|
||||
|
||||
doWeappSignin(userId, loginId)
|
||||
.then(res => {
|
||||
wx.hideLoading();
|
||||
|
||||
if (res.status === 1) {
|
||||
// 签到成功
|
||||
this.setData({
|
||||
isTodaySigned: true,
|
||||
continuousDays: parseInt(res.continuousDays),
|
||||
rewardPoints: parseInt(res.rewardPoints),
|
||||
totalPoints: parseInt(res.totalPoints)
|
||||
});
|
||||
|
||||
// 显示签到成功提示
|
||||
wx.showToast({
|
||||
title: `签到成功！获得${res.rewardPoints}积分`,
|
||||
icon: 'success'
|
||||
});
|
||||
|
||||
// 更新界面显示
|
||||
this.updateUIAfterSignin();
|
||||
|
||||
} else {
|
||||
wx.showToast({
|
||||
title: res.msg || '签到失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
wx.hideLoading();
|
||||
console.error('签到请求失败:', err);
|
||||
wx.showToast({
|
||||
title: '网络错误',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 签到后更新UI
|
||||
*/
|
||||
updateUIAfterSignin: function() {
|
||||
// 延迟重新加载信息，确保数据同步
|
||||
setTimeout(() => {
|
||||
this.loadSigninInfo();
|
||||
}, 1000);
|
||||
},
|
||||
|
||||
/**
|
||||
* 显示签到奖励规则
|
||||
*/
|
||||
showRule: function() {
|
||||
wx.showModal({
|
||||
title: '签到规则',
|
||||
content: '连续签到奖励规则：\n第1天: 5积分\n第2天: 10积分\n第3天: 15积分\n第4天: 20积分\n第5天: 25积分\n第6天: 30积分\n第7天: 50积分\n\n注意：中间断签将重新开始计算周期。',
|
||||
showCancel: false,
|
||||
confirmText: '我知道了'
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 下拉刷新
|
||||
*/
|
||||
onPullDownRefresh: function() {
|
||||
this.loadSigninInfo();
|
||||
wx.stopPullDownRefresh();
|
||||
}
|
||||
});
|
||||
81
pages/qiandao/weapp_signin_demo.wxml
Normal file
81
pages/qiandao/weapp_signin_demo.wxml
Normal file
@@ -0,0 +1,81 @@
|
||||
<!-- 微信小程序签到页面 -->
|
||||
<view class="container">
|
||||
<!-- 页面标题 -->
|
||||
<view class="page-title">
|
||||
<text>每日签到</text>
|
||||
</view>
|
||||
|
||||
<!-- 签到信息展示 -->
|
||||
<view class="signin-info">
|
||||
<view class="info-card">
|
||||
<view class="info-item">
|
||||
<text class="label">连续签到天数</text>
|
||||
<text class="value">{{continuousDays}}天</text>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<text class="label">总积分</text>
|
||||
<text class="value">{{totalPoints}}</text>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<text class="label">最后签到</text>
|
||||
<text class="value">{{lastSignInDate || '暂无'}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 签到按钮 -->
|
||||
<view class="signin-button-container">
|
||||
<button
|
||||
class="signin-button {{isTodaySigned ? 'signed' : 'unsigned'}}"
|
||||
bindtap="doSignin"
|
||||
disabled="{{isTodaySigned}}"
|
||||
>
|
||||
{{isTodaySigned ? '今日已签到' : '立即签到'}}
|
||||
</button>
|
||||
</view>
|
||||
|
||||
<!-- 本周签到日历 -->
|
||||
<view class="week-calendar">
|
||||
<view class="calendar-title">
|
||||
<text>本周签到</text>
|
||||
</view>
|
||||
<view class="calendar-grid">
|
||||
<block wx:for="{{['日', '一', '二', '三', '四', '五', '六']}}" wx:key="index">
|
||||
<view class="weekday">{{item}}</view>
|
||||
</block>
|
||||
<block wx:for="{{weekSigned}}" wx:key="day">
|
||||
<view class="calendar-day {{item.signed ? 'signed' : 'unsigned'}}">
|
||||
<text class="day-text">{{item.day}}</text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 签到奖励说明 -->
|
||||
<view class="reward-rules">
|
||||
<view class="rules-title" bindtap="showRule">
|
||||
<text>签到奖励规则</text>
|
||||
<text class="icon">></text>
|
||||
</view>
|
||||
<view class="rules-content">
|
||||
<view class="rule-item">第1天: 5积分</view>
|
||||
<view class="rule-item">第2天: 10积分</view>
|
||||
<view class="rule-item">第3天: 15积分</view>
|
||||
<view class="rule-item">第4天: 20积分</view>
|
||||
<view class="rule-item">第5天: 25积分</view>
|
||||
<view class="rule-item">第6天: 30积分</view>
|
||||
<view class="rule-item">第7天: 50积分(额外奖励)</view>
|
||||
<view class="rule-desc">连续7天签到后，重新开始计算周期。中间断签也会重置计数。</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 签到成功弹窗 -->
|
||||
<view class="signin-success-modal" wx:if="{{rewardPoints > 0}}">
|
||||
<view class="modal-content">
|
||||
<view class="modal-icon">✓</view>
|
||||
<view class="modal-title">签到成功</view>
|
||||
<view class="modal-reward">获得{{rewardPoints}}积分</view>
|
||||
<button class="modal-close" bindtap="closeSuccessModal">确定</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
242
pages/qiandao/weapp_signin_demo.wxss
Normal file
242
pages/qiandao/weapp_signin_demo.wxss
Normal file
@@ -0,0 +1,242 @@
|
||||
/* 微信小程序签到页面样式 */
|
||||
|
||||
.container {
|
||||
padding: 20rpx;
|
||||
background-color: #f5f5f5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
margin: 20rpx 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* 签到信息卡片 */
|
||||
.signin-info {
|
||||
background: white;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 30rpx;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.info-card {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.info-item {
|
||||
text-align: center;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.value {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* 签到按钮 */
|
||||
.signin-button-container {
|
||||
text-align: center;
|
||||
margin: 40rpx 0;
|
||||
}
|
||||
|
||||
.signin-button {
|
||||
width: 60%;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
border-radius: 40rpx;
|
||||
color: white;
|
||||
background: linear-gradient(to right, #ff6b6b, #ff8e53);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.signin-button.signed {
|
||||
background: #ccc;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.signin-button:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* 本周签到日历 */
|
||||
.week-calendar {
|
||||
background: white;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 30rpx;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.calendar-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.calendar-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(7, 1fr);
|
||||
gap: 10rpx;
|
||||
}
|
||||
|
||||
.weekday {
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
}
|
||||
|
||||
.calendar-day {
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.calendar-day.signed {
|
||||
background: #4CAF50;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.calendar-day.unsigned {
|
||||
background: #f0f0f0;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 奖励规则 */
|
||||
.reward-rules {
|
||||
background: white;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.rules-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20rpx;
|
||||
color: #333;
|
||||
padding-bottom: 20rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.rules-content {
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.rule-item {
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
margin: 10rpx 0;
|
||||
padding-left: 20rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.rule-item::before {
|
||||
content: '•';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
color: #ff6b6b;
|
||||
}
|
||||
|
||||
.rule-desc {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-top: 20rpx;
|
||||
padding: 15rpx;
|
||||
background: #f9f9f9;
|
||||
border-radius: 8rpx;
|
||||
border-left: 4rpx solid #ff6b6b;
|
||||
}
|
||||
|
||||
/* 成功弹窗 */
|
||||
.signin-success-modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background: white;
|
||||
border-radius: 20rpx;
|
||||
padding: 40rpx;
|
||||
text-align: center;
|
||||
width: 80%;
|
||||
max-width: 500rpx;
|
||||
}
|
||||
|
||||
.modal-icon {
|
||||
font-size: 80rpx;
|
||||
color: #4CAF50;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.modal-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.modal-reward {
|
||||
font-size: 28rpx;
|
||||
color: #ff6b6b;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.modal-close {
|
||||
background: #4CAF50;
|
||||
color: white;
|
||||
border-radius: 40rpx;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
}
|
||||
|
||||
/* 响应式适配 */
|
||||
@media screen and (max-width: 750rpx) {
|
||||
.container {
|
||||
padding: 10rpx;
|
||||
}
|
||||
|
||||
.info-card {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.info-item {
|
||||
margin: 15rpx 0;
|
||||
}
|
||||
}
|
||||
8
pages/qiandao/weapp_signin_page.json
Normal file
8
pages/qiandao/weapp_signin_page.json
Normal file
@@ -0,0 +1,8 @@
|
||||
{
|
||||
"navigationBarTitleText": "每日签到",
|
||||
"navigationBarBackgroundColor": "#ff6b6b",
|
||||
"navigationBarTextStyle": "white",
|
||||
"backgroundColor": "#f5f5f5",
|
||||
"enablePullDownRefresh": true,
|
||||
"backgroundTextStyle": "dark"
|
||||
}
|
||||
Reference in New Issue
Block a user