微信小程序：连续签到7天签到积分获得功能设计

每周每天签到获得积分的案例
功能设计：计算每天签到得1分，显示得到的签到积分，连续签到3天[周一二三]即得+多3分，连续签到7天[周一二三四五六日]+多7分，没有连续即不显示多余的3分或7分的提示…

wxml结构：

<!--pages/signIn2/signIn2.wxml-->
<view class='sign-new'><view class='in'><view class='new-head'><view class='sig-tl'><view class='tln'>已连续签到<label class='n'>{{newSignNum}}</label>天</view><view class='tlf'>积分：<label class='f'>{{newSignIntegral}}</label></view></view><!-- 未签到 --><view wx:if='{{!newSignBtnState}}' class='sig-qiu sig-qiu-no' bindtap='bindSignFn'  ><label class='ti'>签到</label></view><!-- 已签到 --><view wx:else class='sig-qiu sig-qiu-yes'><label class='ti'>已签到</label></view></view><view class='new-week' ><view class='we-mod'><view class='mo-fen'><label class='f f3' wx:if='{{continuityDays3}}'>+3积分</label><label class='f f7' wx:if='{{continuityDays7}}'>+7积分</label></view><view class='mo-line'><block wx:for="{{isNewSignedArr}}"  wx:for-item="v" wx:key="k"><label class="q {{v.isSigned?'hover':''}}"></label></block></view><view class='mo-ri'><block wx:for="{{isNewSignedArr}}"  wx:for-item="v" wx:key="k"><label class="t">{{v.day}}</label></block></view></view></view></view>
</view>

有什么错误或优化的地方，可以提出来，大家一起学习研究…
ps：
[微信小程序：以7天为周期，连续签到7天功能效果]

源码会持续更新到公众号，需要可以关注一下哦…

想学习vue可移步到：vue相关的技术

想学习小程序可移步到：小程序相关的技术

微信小程序：连续签到7天签到积分获得功能设计相关推荐

基于微信小程序的大学选修课考勤签到系统设计
本课题是采用微信平台开发的大学选修课考勤签到系统.利用微信程序设计平台作为开发手段,通过利用微信自身的原生态语言WXSS.WXML结合JavaScript脚本语言设计应用程序.微信标记语言也就是WXM ...
【计算机毕业设计】基于微信小程序的高校课堂考勤签到系统
毕设帮助.源码交流.技术解答,见文末一.前言考勤签到是教学要求也是教学手段,使用信息化手段解决传统点名式考勤效率低.不精准等缺点是十分必要的.现在考勤手段多种多样,比如在纸质签到表签到.老师点名. ...
php根据地理位置签到,微信小程序获取地理位置实现定位签到功能
为了保证签到定位的精确性,要求开启GPS定位.小程序成功精确获取地理位置打卡签到,需要三步授权验证: 地理位置的系统开关(系统GPS开关是否打开) --系统级允许微信使用定位的开关 (微信是否有获取 ...
签到java小程序代码_微信小程序全栈项目：签到打卡小程序 + 后端实现
[实例简介] 签到打卡小程序 + 后端实现 : 后端是 springmvc + mybatis + mysql实现 [实例截图] [核心代码] Calendar `-- Calendar |-- Ca ...
微信小程序（看文档写实例六）微信小程序课堂宝APP实现签到逻辑
继上篇博文,这篇写下签到实现的逻辑. 一.实现逻辑发起签到 1.先上传当前自己的定位经纬度 2.学生查询老师的最后一次签到记录,如果发现签到记录signComplete为false说明有新的签到 3 ...
微信小程序（看文档写实例四）微信小程序课堂宝APP实现签到子页面布局及课程视频播放页面
一.签到子页面布局子页面主要是一个签到按钮,然后下方是签到记录列表. 1.签到按钮布局代码: <button class='sign-button' bindtap='sign'>签到 ...
微信小程序连续显示多个空格
因为在开发的时候,遇到了要连续显示多个空格的情况,回去翻阅文档,浪费了一定的时间,故作此记录. 使用text组件解码解决
简易微信小程序签到功能
一.效果图点击签到后二.数据库用一张数据表存用户签到的信息,每次用户签到都会往表中添加一条记录了用户id和签到日期的数据,如下图三.后端后端写两个接口,一个用于查询用户今日是否签到和签到记录 ...
微信小程序——签到系统（入门级）
本次主要是记述了使用微信小程序编写一个简单的签到系统,包含了签到界面.注册界面以及找回密码界面,在实现这些功能的基础之上,又使用了小程序官方提供的wx.getLocation模块实现了当前实时位置的获 ...
微信小程序分析送积分功能如何实现_微信小程序积分商城解决方案（一）
概念微信小程序积分商城的"积分商城"概念,是指的用户访问微信小程序经过授权用户信息或是验证注册的用户加入会员,基于微信APP环境使用微信支付等工具进行交易,推出的一种会员奖励计划 ...

微信小程序：连续签到7天签到积分获得功能设计

微信小程序：连续签到7天签到积分获得功能设计相关推荐

最新文章

热门文章