Simple WeChat applet sign-in function

One

After clicking Sign In

Second, the database

With a data sheet to store the user's check-in information, each time the user sign in will add a record of the user ID and check-in date data, such as

Third, back end

Back-end write two interface, one to query the user today check-in and attendance record total, one for adding user sign-in information to the database. The Python flask framework is used here.

(1) Check the user registration information interface:

@app. Route ('/get_sign/<user_id>')defget_sign (user_id):Try: Data=get_sign_info (user_id)exceptException as E:returnJsonify ({'Status'70A'Exception': Str (e)}) returnJsonify ({'Status': 1,'Data':d ATA})defGet_sign_info (USER_ID): Conn= Sqlite3.connect ('Test.sqlite') Cursor=conn.cursor () cursor.execute ('Select date from sign where user_id=?', (user_id,)) All_date=set ([x[0] forXinchCursor.fetchall ()]) Now_date=date.today (). Strftime ('%y-%m-%d')//String The dateifNow_dateinchall_date:signed=TrueElse: Signed=False Total=Len (all_date) conn.close ()return{' Total': Total,'signed': Signed}

After all check-in dates are checked, use set to remove duplicates, then determine if the day's date is in it, and if not, signed=false indicates that no sign-in today. The total number of registrations is the length of all_date

A datetime library was used to obtain the date information. From datetime import Date

(2) Add user sign-in information interface:

@app. Route ('/sign/<user_id>')defSign (user_id):Try: Update_sign (user_id)exceptException as E:returnJsonify ({'Status'70A'Exception': Str (e)}) returnJsonify ({'Status': 1})defupdate_sign (user_id): Now_date=date.today (). Strftime ('%y-%m-%d') Conn= Sqlite3.connect ('Test.sqlite') Cursor=conn.cursor () cursor.execute ('INSERT into sign (user_id,date) VALUES (?,?)', \ (user_id,now_date)) Conn.commit () conn.close ()

Four, small program front-end

Wxml file

    <Viewclass= "Sign"wx:if= "{{IsLogin = = true}}">      <Imageclass= "image"src='.. /.. /dist/images/sign.png '></Image>      <Viewclass= "Sign_info">        <Viewwx:if= "{{signed==false}}"Bindtap= ' sign '>Click here to sign in</View>        <Viewwx:if= "{{signed==true}}">Sign in today</View>        <View>Sign in {{total_sign}} days</View>      </View>    </View>

WXSS file

. Image {  float:left;   width: 140rpx;   height: 140rpx;   margin-right: 7%;   margin-left:20%;} . Sign {  margin-top: 10%;} . Sign_info {  width: 100%;   color: #666;   font-size: 43rpx;}

JS file

Get_sign:function(){   varthat = This; varUserID = Wx.getstoragesync ("userid"); Wx.request ({URL:'/HTTP Server public network ip:80/get_sign/' +UserId, Method:"GET", Success:function(res) {if(Res.data.status = = 1) {that.setdata ({total_sign:res.data.data.total, signed:res.data.data.signed, })            }        Else{Console.log ("Status Error:" +res.data.Exception) }}, sign:function(){    varthat = This; varUserID = Wx.getstoragesync ("userid"); Wx.request ({URL:'/HTTP Server public network ip:80/sign/' +UserId, Method:"GET", Success:function(res) {if(Res.data.status = = 1) {that.setdata ({total_sign:that.data.total_sign+1, Signed:true,          }) Wx.showtoast ({title:Success, Icon:' Success ', Duration:2000          })        }        Else{Console.log ("Status Error:" +res.data.Exception) }},

After the user logs in, the Get_sign function is immediately triggered, and the user check-in information from the database is saved to page data, and the page shows whether the user is signed in and the total number of sign-ins today.

When the user clicks Check-in, the check-in information is saved and data is updated. Use Showtoast Pop-up window to prompt sign-in success.