4.（人脸签到篇）疫情下的在线办公签到系统-基础篇

文章目录

• 设计人脸签到页面
• 一、实现签到自拍功能
• 二、缓存系统常量数据
• • 1.读取常量数据
• 三、封装检测当天是否可以签到（持久层）
• 三、封装检测当天是否可以签到（业务层）
• 四、封装检测当天是否可以签到（Web层）
• 五、实现Shiro认证功能
• 六、实现Shiro授权功能

---

设计人脸签到页面

创建checkin.vue页面

<camera device-position="front" flash="off" class="camera" @error="error" v-if="showCamera"></camera>
<image mode="widthFix" class="image" :src="photoPath" v-if="showImage"></image>
<view class="operate-container">
<button type="primary" class="btn" @tap="clickBtn" :disabled="!canCheckin">{{ btnText
}}</button>
 <button type="warn" class="btn" @tap="afresh" :disabled="!canCheckin">重拍</button>
</view>
<view class="notice-container">
<text class="notice">注意事项</text>
 <text class="desc">拍照签到的时候，必须要拍摄自己的正面照片，侧面照片会导致无法识别。另外，
拍照的时候不要戴墨镜或者帽子，避免影响拍照签到的准确度。</text>
</view>

<script>
export default{
  data(){
   return {
    canCheckin:true,
    photopPath:'',
    btnText:'拍照',
    showCamera:true,
    showImage:false
    };
},
method:{}
};
</script>

一、实现签到自拍功能

我们设计签到页面的时候，在 标签下面放置了 标签，用户拍完照之后， 标签隐藏起来，然后 标签显示拍照的图片，如果用户对照片满意，就可以点击签到按钮提交照片执行签到。

clickBtn:function(){
 let that = this;
 if(that.btnText == "拍照"){
  let ctx=wx.createCameraContext();
  ctx.takePhoto({
     quality:'high',
     success:function(resp){
     that.photoPath = resp.tempImgaePath;
     that.showCamera = false;
     that.showIamge = true;
     that.btnText = '签到';
}
})
else{
//这里是点击签到按钮
}
}
afresh:function(){
 this.showCamera = true;
 this.showImage = false;
 this.btnText = '拍照'
}
}

二、缓存系统常量数据

在sys_config数据表中保存了Emos系统的常量配置信息，这些常量信息和考勤信息息息相关，需要编写java代码，在springboot启动的时候就去数据库读取这些常量信息，缓存为java对象，全局都可以使用

1.读取常量数据

<select id="selectAllParam" resultType="SysConfig">
  SELECT param
     _key,param_value FROM sys_config WHERE status=1;
<select>

 @Data
 @Component
 public class SystemConstants {
 public String attendanceStartTime;
 public String attendanceTime;
 public String attendanceEndTime;
 public String closingStartTime;
 public String closingTime;
 public String closingEndTime; }

@SpringBootApplication
@ServletComponentScan
@Slf4j
public class EmosWxApiApplication{
  @Autowired
  private SysConfigDao sysConfigDao;
  @AutoWired
  private SystemConstants constants;
public static void main(String[] args) {
SpringApplication.run(EmosWxApiApplication.class, args);
 }
 @PostConstruct
 public void init(){
    List<SysConfig> list = SysConfigDao.searchAllParam();
    list.forEach(one->{
    String key = one.getParamKey();
    key = StrUtil.toCameCase(key);
    String value = one.getParamaValue();
    try{
      Field field = constants.getclass().getDeclaredField(key);
      field.set(constants,value);
}catch (Exception e){
   log.error("执行异常"，e);
}
})
}
}

三、封装检测当天是否可以签到（持久层）

查询特殊休息日

<select id="searchTodayIsHolidays" resultType="Integer">
  SELECT id FROM tb_holidays WHERE date=CURRENT_DATE LIMIT=1
</selcet>

查询特殊工作日

<select id="searchTodayIsWorkday" resultType="Integer">
SELECT id FROM tb_workday WHERE date=CURRENT_DATE LIMIT 
 </select>

查询当天是否已经签到

<select id="haveCheckin" parameter="HashMap" resultType="Integer">
  SELECT id FROM tb_checkin
  WHERE user_id=#{userId} AND date=CURRENT_DATE
  AND create_time BETWEEN #{start} AND #{end}
  LIMIT 1
</select>

三、封装检测当天是否可以签到（业务层）

public String validCanCheckIn(int userId,String date){
   boolean bool_1 = holidaysDao.searchTodayIsHolidays() !=null ? true : false;
   boolean bool_2 = workdaysDao.searchTodayIsWorkday()!=null ? true : false;
   String type = "工作日";
   if(DateUtil.date().isWeekend()){
   type = "节假日";
}
   if(bool_1){
   type = "节假日";
}
 if(bool_2){
   type = "工作日";
}
 if(type.equals("节假日")){
  return "节假日不需要考勤";
}else{
   DateTime now = DateUtil.date();
   String start = DateUtil.today()+""+systemConstants.attendanceStartTime;
   String end =DateUtil.today()+""+systemConstants.attendanceEndTime;
   DateTime attendanceStart = DateUtil.parse(start);
   DateTime attendanceEnd   = DateUtil.parse(end);
   if(now.isBefore(attendanceStart)){
    return "没有到上班考勤时间";
}else if(now.isAfter(attendanceEnd)){
    return "超过了上班考勤结束时间";
 }else{
   HashMap map =new HashMap();
   map.put("userId",userId);
   map.put("date",date);
   map.put("start",start);
   map.pur("end",end);
   boolean bool = checkinDao.haveCheckin(map) != null ? true:false;
   return bool?"今日已经考勤,不用重复考勤":"可以考勤";
}
}
}

四、封装检测当天是否可以签到（Web层）

@ReuqestMapping("/checkin")
@RestController
@Api("签到模块Web接口")
@Slf4j
public class CheckinController{
   @Autowired
   private JwtUtil jwtUtil;
   @Autowired
   private CheckinService checkinService;
   @GetMapping("/validCanCheckin")
   public R validCanCheckin(@RequestHeader("token") String token){
   int userId = jwtUtil.getUserId(token);
   String result = checkinService.validCanCheckIn(userId,DateUtil.today);
   return R.ok(result);
}
}

五、实现Shiro认证功能

现在Controller中的validCanCheckIn()方法，并不是Shiro放行请求的方法，所以发送给该方法的请求会被拦截下来，先由OAuth2Filter检查请求头的Token是否合法，再由doGetAuthenticationInfo() 方法来颁发认证对象。请求被赋予了认证对象，那么请求才会被发送到Web方法来执行。

protected AuthenticationInfo doGetAuthenticationInfo(AuthenticationToken token) throws
AuthenticationException {
   String accessToken = (String) token.getPrincipal();
   int userId = jwtUtil.getUserId(accessToken);
   TbUser user = userService.searchById(userId);
   if(user == null){
   throw new LockedAccountException("账号已被锁定，请联系管理员");
   SimpleAuthenticationInfo info = new SimpleAuthenticationInfo(user,accessToken,getName());
   return  info;
}
}

六、实现Shiro授权功能

 protected AuthorizationInfo doGetAuthorizationInfo(PrincipalCollection principalCollection) {
        //权限管理
        TbUser user = (TbUser) principalCollection.getPrimaryPrincipal();
        Integer id = user.getId();
        Set<String> permsSet = userService.searchUserPermissions(id);
        SimpleAuthorizationInfo info=new SimpleAuthorizationInfo();
        info.setStringPermissions(permsSet);
        return info;
    }