微信小程序-微笑小程序打卡

  • l7_130748
    了解作者
  • 552.6KB
    文件大小
  • zip
    文件格式
  • 0
    收藏次数
  • VIP专享
    资源类型
  • 0
    下载次数
  • 2022-05-09 04:51
    上传日期
打卡签到小程序 用微信小程序实现的一个简单的打卡签到的小程序 拒绝授权-unAuth 这是一个比较孤立的页面,只有一个入口,也就是用户在登录页面拒绝授权后才会跳转至此页面。 登录页面-login 该页面是程序的初始页面,小程序有几个入口,该页面就可以从这些入口进入,主要分为两类: 某公司生成的带有参数的,用于打卡的二维码 其他(包括搜索、发现 -> 小程序、推广时不带参数的小程序二维码) 该页面程序逻辑包括: if(登录) { switch(用户类型) { case: '某公司的管理员': 跳转至 管理界面 case: '某公司的员工': { if(打卡二维码进入)扫码签到 else 个人考勤 } case: '以上都不是': 跳转至选择页面 } } handleLoginBtn() { //获取token //设置localStorage,包括:access_token, 能判断出用户类型的字段 //跳转至选择页面 } get 员工列表 asd
微信小程序-微笑小程序打卡.zip
  • clockInOut-master
  • images
  • tarbar
  • bussiness.png
    1.8KB
  • home.png
    3.5KB
  • business-HL.png
    2.2KB
  • check.png
    1.8KB
  • homeHL.png
    3.5KB
  • check-HL.png
    1.9KB
  • icons
  • more.png
    862B
  • code.png
    1.9KB
  • sent.png
    17.9KB
  • background.png
    138.1KB
  • noquick.png
    35.9KB
  • location.png
    3.2KB
  • error.png
    93KB
  • time.png
    2.1KB
  • signOk.png
    29.7KB
  • nosign.png
    11.7KB
  • go.png
    1KB
  • signoff.png
    30.8KB
  • down.png
    792B
  • .DS_Store
    6KB
  • staff.png
    38.7KB
  • wechat.png
    51.2KB
  • company.png
    20.6KB
  • .DS_Store
    10KB
  • utils
  • api.js
    2.7KB
  • util.js
    3.6KB
  • pages
  • confirm
  • confirm.wxss
    608B
  • confirm.wxml
    493B
  • confirm.js
    1.8KB
  • confirm.json
    2B
  • address
  • address.wxml
    328B
  • address.json
    2B
  • address.wxss
    562B
  • address.js
    1.1KB
  • signMemo
  • signMemo.wxml
    1KB
  • signMemo.json
    2B
  • signMemo.wxss
    2.5KB
  • signMemo.js
    3.4KB
  • boss
  • boss.js
    4.3KB
  • boss.json
    2B
  • boss.wxml
    2KB
  • boss.wxss
    1.2KB
  • list
  • list.json
    2B
  • list.wxss
    579B
  • list.js
    1011B
  • list.wxml
    397B
  • workers
  • workers.wxss
    1.4KB
  • workers.js
    2.3KB
  • workers.wxml
    1.5KB
  • workers.json
    2B
  • login
  • login.wxss
    740B
  • login.js
    2.5KB
  • login.json
    2B
  • login.wxml
    492B
  • scan
  • scan.wxss
    1.4KB
  • scan.json
    2B
  • scan.wxml
    846B
  • scan.js
    3.8KB
  • attendance
  • attendance.json
    2B
  • attendance.wxml
    1.3KB
  • attendance.js
    2.1KB
  • attendance.wxss
    1KB
  • self
  • self.wxss
    1.1KB
  • self.js
    2.3KB
  • self.json
    2B
  • self.wxml
    828B
  • feedback
  • feedback.json
    2B
  • feedback.wxml
    131B
  • feedback.js
    547B
  • feedback.wxss
    195B
  • success
  • success.json
    2B
  • success.wxss
    1.2KB
  • success.wxml
    874B
  • success.js
    996B
  • select
  • select.wxss
    750B
  • select.json
    2B
  • select.wxml
    505B
  • select.js
    1.5KB
  • fail
  • fail.wxss
    1.2KB
  • fail.json
    2B
内容介绍
# 打卡签到小程序 用微信小程序实现的一个简单的打卡签到的小程序 ## 拒绝授权-unAuth 这是一个比较孤立的页面,只有一个入口,也就是用户在登录页面拒绝授权后才会跳转至此页面。 ## 登录页面-login 该页面是程序的初始页面,小程序有几个入口,该页面就可以从这些入口进入,主要分为两类: 1. 某公司生成的带有参数的,用于打卡的二维码 2. 其他(包括搜索、发现 -> 小程序、推广时不带参数的小程序二维码) 该页面程序逻辑包括: ``` if(登录) { switch(用户类型) { case: '某公司的管理员': 跳转至 管理界面 case: '某公司的员工': { if(打卡二维码进入)扫码签到 else 个人考勤 } case: '以上都不是': 跳转至选择页面 } } handleLoginBtn() { //获取token //设置localStorage,包括:access_token, 能判断出用户类型的字段 //跳转至选择页面 } ``` get 员工列表 asdfa /token ``` GET token type: 'admin','staff','user', ``` ## 选择页面-select 选择页面有三个入口,一是登录页面过来,二是员工退出团队后而来,三是管理员解散团队而来。 这三种情况可以算作一种情况,用户都是已登录过的普通用户! - handleCreateBtn() - handleJoinBtn() ## 创建团队-create ``` POST 创建团队 ``` 弹出提示创建成功,跳转至 管理页面 ## 加入团队/公司列表-list ``` GET 所有公司列表 ``` 给 确认加入 页面传入 公司id ## 确认加入-confirm 从之前的页面获取 公司id ``` GET 单个公司信息 ``` ``` POST 加入某个公司 ``` ## 审核页面-audit 该页面属于 纯静态页面 ----------------- ## 员工列表信息-workers ``` 获取员工列表 ``` ## 单个员工信息-worker ``` 获取单个员工 修改单个员工的真实姓名,即备注信息 ``` ## boss ``` 修改团队的信息,包括上下班时间,地理位置 还能生成二维码 ``` -------------------------- ## 扫码页面-scan 调用wx.scanCode(),只能获取信息, - unAuth: 拒绝授权 - login: 登录页面 - select: 选择页面 - create: 创建团队/公司 - list: 公司列表 - confirm: 确认加入 - audit:审核页面 - workers:员工列表信息,tarbar左部页面 - worker: 查看单个员工考勤信息 - boss: 管理者,tarbar右部页面 - - scan-扫码页面 - clock-打卡页面 - success 打卡成功 - fail 打卡失败 - self-查看个人考勤信息 问题: ? 1. 判断用户类型 2. 打卡二维码的参数 3. 怎么打卡 4. 生成打卡二维码的API 推广时的二维码: ``` { "path": "pages/login/login?", "width": 430 } ``` 打卡时的二维码 ``` { "path": "pages/login/login?add=''" } ``` 生产二维码码 httpx... post { compantId location } 返回二维码的图片 打卡的时候 (获取二维码的信息。(公司的companyId + location) + 打卡的信息,位置,时间啊,token 打卡成功 打卡失败 ## bug修复,界面与逻辑的优化 1. 在scan.js增加定时器,增加打卡逻辑判断,当点击一次后将禁用10秒 2. 在self.js更改增加获取今天日期并显示 3. util.js 增加方法 obtainIndate 4. scan界面样式.seconds和其二级父元素 5. login界面样式.button 6. 在login.js将按钮登陆增加用户类型判断,由于现阶段无扫码进入, | | 默认登陆过(非按钮登陆)增加一个虚拟 encrypt | 则判定为扫了公司二维码 |_________________________________________|__ | 登陆按钮点击则判断用户类型 员工不会跳转去公司列表 | 并且不会有虚拟 encrypt 所以会跳往打卡详情 _____________________________________________ 7. 修改了scan.js 8. 修改了success 9. 修改了fail 10. 修改了applylist的无申请人员显示界面 11. 增加了日期选择右边箭头 12. self 修改了暂无打卡纪录显示界面 13. 稍微调整了以下workers界面,只要能获得打卡时间等数据就可以设置为可能异常就黄色,其他的就灰色 14. 修改了app.json 的底部tebar 15. util.js增加了一个定时器 | | 通过 util.disable(1000,10, (backData) => { | if (backData == false) { | console.log('禁用解除') | this.setData({ | btnDis: false | }) | } | }) | 如上方式调用 |_________________________________________|__ | 第一个参数为计时的间隔,一般设置1000(1秒) | 第二个参数是计时的长度,10为10秒的意思 _____________________________________________ 16. select : 增加点击延时,防止重复跳转 17. login : 增加延时,防止重复登陆和跳转 18. audit : 增加一个返回企业列表的按钮 (待议事项) 19. select : 修改图片 20. login : 修改标题内容 ---- 增加图片 icons: signOk.png signoff.png nosign.png noquick.png
评论
    相关推荐
    • 微信小程序
      xqxsxasxaxasxaxasxasxsx
    • 【橙子分享版】DTcms微信小程序
      【橙子分享版】DTcms微信小程序,含程序源码和小程序源码
    • 微信小程序 线上约,线下玩
      前端后端进行交互,约人线下玩,分享,显示无障碍。经过一番研究写出
    • 微信小程序解析xml的js
      该包中含有的js,主要用于小程序解析xml,在本人关于支付的一篇博客中可以看到其使用痕迹。--------------------------
    • 微信小程序生成二维码demo.zip
      微信小程序生成二维码demo
    • 微信小程序公众号SaaS管理系统源代码
      微信小程序公众号SaaS管理系统是一款完全开源的微信第三方管理系统,为中小企业提供最佳的小程序集中管理解决方案。可实现小程序的快速免审核注册(免300元审核费),可批量发布小程序模板,同步升级版本等功能。...
    • 微信小程序-电商平台
      微信小程序-电商平台,微信小程序-电商平台,微信小程序-电商平台,微信小程序-电商平台,
    • 垃圾分类微信小程序
      垃圾分类小程序 小程序实现介绍: 小程序中有用到百度ai的...小程序中有用到云开发,具体介绍请参考微信小程序官方文档,初始化云开发后, 替换app.js中env的值。 wx.cloud.init({ env: '替换成自己的云开发环境id',
    • 微信小程序
      首先从项目框架的选型上,主要有3种选择,微信小程序的原生开发,wepy 框架开发,labrador框架开发,原生开发是使用小程序的自己的一套开发标准,参考web 的原生开发,wepy 是 vue 风格的小程序开发框架,labrador ...
    • SIM800C_MQTT.rar
      使用SIM800C模块,使用MQTT协议,连接中国移动onenet平台,能实现数据的订阅、发布、存储等