涉及到知识点：

1.bootstrap table动态表头

每个月的天数不一样，所以要根据服务端的json数据，动态改变表头。

https://blog.csdn.net/abubu123/article/details/78060321

2.golang动态结构体字段/用map

因为golang无法构建动态的结构体字段多少，所以才用map[int]string

比如某个用户某月1日已经签到：map[1]="1"，2日没签到则为map[1]=""

3.golang求出每月天数

 //当月天数const base_format = "2006-01-02"year := c.Input().Get("year")month := c.Input().Get("month")if len(month) == 1 {month = "0" + month}SelectMonth1, err := time.Parse(base_format, year+"-"+month+"-01")//每月的第一天if err != nil {beego.Error(err)}SelectMonth2 := SelectMonth1.AddDate(0, 1, -1)//每月的最后一天，其实就是这个月加上1个月然后减1天，很巧妙//建立一个动态月日数组days := SelectMonth2.Sub(SelectMonth1) / 24   //这个月天数，其实应该是下个月第一天减这个月第一天。减出来的其实是duration类型，而且是小时单位，必须除以24，单位还是小时dayss := days.Hours()//小时转为float64daysss := strconv.FormatFloat(dayss, 'f', -1, 64) //float64转stringdayssss, err := strconv.Atoi(daysss)              //string转int// beego.Info(reflect.TypeOf(dayss)) //float64beego.Info(dayssss)

4.给map赋值

定义一个map数组，一个map，记得给map[0]=username，第一列作为用户名的处理

s := []map[int]interface{}{}
var checkmap = make(map[int]interface{}, dayssss+2)
//给checkmap 赋值
//排序
//然后追加给数组
s = append(s, checkmap2)
//转成json
b, err := json.Marshal(s)

5.map排序

不写了。

6.前端bootstrap table处理第一列用户名

在前面第1点基础上加个判断

       var columnsArray = [];columnsArray.push({field: "state", checkbox: true});for (var i = 0; i < (Object.keys(json[0])).length; i++) {//Object.keys(obj) 获取key名称var property = (Object.keys(json[0]))[i];//id   usernameif (property==0) {columnsArray.push({"title": "name","field": property,"align" : 'center',"valign" : 'middle',switchable: true,});}else{columnsArray.push({"title": property,"field": property,"align" : 'center',"valign" : 'middle',switchable: true,});}}

就是这么个样子了：name列应该用用户名表示。

对应小程序打卡记录：用户9

我的git上有源码，engineercms和对应的小程序端。欢迎star。

beego golang bootstrap-table做月度考勤（打卡、签到）统计表相关推荐

计算机毕业设计-基于微信小程序高校学生课堂扫码考勤签到系统-校园考勤打卡签到小程序
注意:该项目只展示部分功能,如需了解,评论区咨询即可. 本文目录 1.开发环境 2.系统的设计背景 3 各角色功能模块 3.1 用户 3.2 管理员 4 系统页面展示 4.1 学生端功能模块展示 4. ...
基于华为云人脸服务接口设计的人脸考勤打卡签到系统
1. 项目介绍近几年,生物特征识别技术获得快速发展.人脸作为一种生物特征,具有很强的自身稳定性和个体差异性,是进行身份验证的最理想依据,主要方法包括步态识别.虹膜识别.皮肤芯片.脸像识别.多模态(即 ...
Bootstrap Table固定列及IE11兼容性问题解决
最近项目的前端用的是bootstrap,用Bootstrap Table做的表格显示.有一部分表格比较特殊,需要实现固定前面几列,后面的拖动.给的原型是用的superTable实现的,整合进项目用Bo ...
ABP+AdminLTE+Bootstrap Table权限管理系统第二节--在ABP的基础做数据库脚本处理
返回总目录:ABP+AdminLTE+Bootstrap Table权限管理系统一期第一点,上一篇文章中我们讲到codefirst中一些问题包括如图,codefirst在每次执行命令的时候会生成新的 ...
bootstraptable 汇总_JS组件系列——表格组件神器：bootstrap table
前言:前面介绍了两篇关于bootstrap table的基础用法,这章我们继续来看看它比较常用的一些功能,来个终结篇吧,毛爷爷告诉我们做事要有始有终~~bootstrap table这东西要想所有功能 ...
bootstrap Table API和一些简单使用方法
官网: http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/ 后端分页问题:后端返回"rows"."& ...
[转]bootstrap table 动态列数
原文地址:https://my.oschina.net/u/2356355/blog/1595563 据说bootstrap table非常好用,从入门教程中了解到它的以下主要功能: 由于固定表头意味 ...
bootstrap table使用参考
https://www.cnblogs.com/landeanfen/p/5821192.html 转载阅读目录一.x-editable组件介绍二.bootstrapTable行内编辑初始方案 ...
JS组件系列——表格组件神器：bootstrap table
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
JS组件系列——Bootstrap Table 表格行拖拽（二：多行拖拽）
原文:JS组件系列--Bootstrap Table 表格行拖拽(二:多行拖拽) 前言:前天刚写了篇JS组件系列--Bootstrap Table 表格行拖拽,今天接到新的需要,需要在之前表格行拖拽的 ...

beego golang bootstrap-table做月度考勤（打卡、签到）统计表