微信小程序簽到功能設(shè)計與實現(xiàn)

后端寫兩個接口，一個用于查詢用戶今日是否簽到和簽到記錄總數(shù)，一個用于添加用戶簽到信息到數(shù)據(jù)庫。這里用的是python的flask框架。

　?。?）查詢用戶簽到信息接口：

1. @app.route('/get_sign/')
2. def get_sign(user_id):
3. try:
4. data=get_sign_info(user_id)
5. except Exception as e:
6. return jsonify({'status':0,'Exception':str(e)})
7. return jsonify({'status':1,'data':data})
8.  
9. def get_sign_info(user_id):
10. conn = sqlite3.connect('test.sqlite')
11. cursor = conn.cursor()
12. cursor.execute('select date from sign where user_id=?',(user_id,))
13. all_date=set([x[0] for x in cursor.fetchall()])
14. now_date=date.today().strftime('%Y-%m-%d')//將日期字符串化
15. if now_date in all_date:
16. signed=True
17. else:
18. signed=False
19. total=len(all_date)
20. conn.close()
21. return {'total':total,'signed':signed}

　　查詢到所有簽到日期后用set去除重復(fù)項，然后判斷一下當天的日期是否在其中，如果不在其中，signed=False表示今日未簽到。簽到總數(shù)就是all_date的長度

　　使用了datetime庫來獲取日期信息。from datetime import date

（2）添加用戶簽到信息接口：

1. @app.route('/sign/')
2. def sign(user_id):
3. try:
4. update_sign(user_id)
5. except Exception as e:
6. return jsonify({'status':0,'Exception':str(e)})
7. return jsonify({'status':1})
8.  
9. def update_sign(user_id):
10. now_date=date.today().strftime('%Y-%m-%d')
11. conn = sqlite3.connect('test.sqlite')
12. cursor = conn.cursor()
13. cursor.execute('insert into sign (user_id,date) values(?,?)',\
14. (user_id,now_date))
15. conn.commit()
16. conn.close()

小程序前端

wxml文件

1. 點擊此處簽到
2. 今日已簽到
3. 已簽到{{total_sign}}天

wxss文件

1. .image{
2. float:left;
3. width: 140rpx;
4. height: 140rpx;
5. margin-right: 7%;
6. margin-left:20%;
7. }
8. .sign{
9. margin-top: 10%;
10. }
11.  
12. .sign_info{
13. width: 100%;
14. color: #666;
15. font-size: 43rpx;
16. }

js文件

1. get_sign: function(){
2. var that = this;
3. var userId = wx.getStorageSync("userId");
4. wx.request({
5. url: 'https://服務(wù)器公網(wǎng)ip:80/get_sign/'+userId,
6. method: "GET",
7. success: function (res) {
8. if (res.data.status == 1) {
9. that.setData({
10. total_sign: res.data.data.total,
11. signed: res.data.data.signed,
12. })
13. }
14. else{
15. console.log("status error: " + res.data.Exception)
16. }
17. },
18. })
19. },
20.  
21. sign:function(){
22. var that = this;
23. var userId = wx.getStorageSync("userId");
24. wx.request({
25. url: 'https://服務(wù)器公網(wǎng)ip:80/sign/' + userId,
26. method: "GET",
27. success: function (res) {
28. if (res.data.status == 1) {
29. that.setData({
30. total_sign: that.data.total_sign+1,
31. signed: true,
32. })
33. wx.showToast({
34. title: '成功',
35. icon: 'success',
36. duration: 2000
37. })
38. }
39. else {
40. console.log("status error: " + res.data.Exception)
41. }
42. },
43. })
44. },

　　用戶登錄后，會立即觸發(fā)get_sign函數(shù)，從數(shù)據(jù)庫獲取用戶簽到信息存到page的data中，頁面也會顯示用戶今日是否簽到和簽到總數(shù)。

　　用戶點擊簽到后，會保存簽到信息，并更新data。用showToast彈窗提示簽到成功。