小程序云开发点击签到弹出签到弹窗
时间: 2023-10-27 18:07:25 浏览: 41
要实现这个功能,你可以按照以下步骤进行:
1. 在小程序云开发中创建一个名为sign_in的集合,用于存储用户的签到记录。
2. 在点击签到按钮时,调用云函数,将签到记录保存到sign_in集合中。在云函数中,可以使用以下代码:
```javascript
const db = cloud.database();
const sign_in = db.collection('sign_in');
exports.main = async (event, context) => {
const { OPENID } = cloud.getWXContext();
// 查询今天是否已签到
const today = new Date().toLocaleDateString();
const res = await sign_in.where({
openid: OPENID,
date: today
}).get();
if (res.data.length > 0) {
return {
code: -1,
message: '今天已经签到过了'
};
}
// 保存签到记录
const result = await sign_in.add({
data: {
openid: OPENID,
date: today
}
});
if (result._id) {
return {
code: 0,
message: '签到成功'
};
} else {
return {
code: -1,
message: '签到失败'
};
}
};
```
3. 在云函数中,根据签到结果返回相应的错误提示或成功提示,例如:
```javascript
if (result._id) {
wx.showToast({
title: '签到成功',
icon: 'success'
});
} else {
wx.showToast({
title: '签到失败',
icon: 'none'
});
}
```
4. 如果用户今天已经签到过了,弹出签到失败的提示框。如果签到成功,弹出签到成功的提示框。可以使用以下代码实现:
```javascript
wx.cloud.callFunction({
name: 'sign_in',
success: res => {
if (res.result.code === 0) {
wx.showToast({
title: '签到成功',
icon: 'success'
});
} else {
wx.showToast({
title: res.result.message,
icon: 'none'
});
}
},
fail: err => {
console.error(err);
wx.showToast({
title: '签到失败',
icon: 'none'
});
}
});
```
5. 在签到成功的提示框中,可以显示用户已连续签到的天数。可以通过查询sign_in集合来统计用户连续签到的天数,例如:
```javascript
const db = wx.cloud.database();
const sign_in = db.collection('sign_in');
sign_in.where({
openid: OPENID
}).orderBy('date', 'desc').limit(7).get().then(res => {
const dates = res.data.map(item => item.date);
let consecutiveDays = 1;
for (let i = 0; i < dates.length - 1; i++) {
const diff = new Date(dates[i]) - new Date(dates[i + 1]);
if (diff === 86400000) {
consecutiveDays++;
} else {
break;
}
}
wx.showModal({
title: '签到成功',
content: `已连续签到${consecutiveDays}天`,
showCancel: false,
confirmText: '知道了'
});
});
```
这样,当用户签到成功时,会弹出一个提示框,显示用户已连续签到的天数。