一。手动生成二维码的.js代码一。手动生成二维码的.js代码一。手动生成二维码的.js代码这里要引入一个官方文档wxapp.qrcode.min.jswxapp.qrcode.min.js
let drawQrcode = require('../utils/wxapp.qrcode.min.js');//引入wxapp.qrcode.min.js文件
createQRcode(canvasWidth, canvasHeight, canvasId, url) {

// 调用qrcode.js里的方法，传入对应参数

drawQrcode({

width: canvasWidth,

height: canvasHeight,

canvasId: canvasId,

text: url

})

console.log(drawQrcode.width)
},
setCanvasSize() {

let size = {};

// getSystemInfoSync 微信小程序提供getSystemInfoSync获取设备的信息

let res = wx.getSystemInfoSync();

// console.log(res);

// 获取比例

let scale = 686 / 750;

let width = res.windowWidth * scale;

let height = width;

size.w = width;

size.h = height;

return size;
},
formsubmit(e) {

let url = e.detail.value.url || this.data.placeholder;

// let url = e.detail.value.url ? e.detail.value.url : this.data.placeholder;

wx.showToast({

title: '生成中',

icon: 'loading',

duration: 2000

})

let that_ = this;


let timer = setTimeout(() => {

let size = that_.setCanvasSize();

//调用createQRcode方法

that_.createQRcode(size.w, size.h, 'mycanvars', url);

wx.hideToast();

clearTimeout(timer);

}, 2000)},


/**

* 生命周期函数--监听页面加载

*/
onLoad: function (options) {

//setCanvasSize 拿到画布区域的尺寸（微信小程序不支持dom的操作，所以单独定义方法去获取）

let size = this.setCanvasSize();

// console.log(size);

let url = this.data.placeholder;

//调用createQRcode方法

this.createQRcode(size.w, size.h, 'mycanvars', url);
},
let drawQrcode = require('../utils/wxapp.qrcode.min.js');//引入wxapp.qrcode.min.js文件
createQRcode(canvasWidth, canvasHeight, canvasId, url) {

// 调用qrcode.js里的方法，传入对应参数

drawQrcode({

width: canvasWidth,

height: canvasHeight,

canvasId: canvasId,

text: url

})

console.log(drawQrcode.width)
},
setCanvasSize() {

let size = {};

// getSystemInfoSync 微信小程序提供getSystemInfoSync获取设备的信息

let res = wx.getSystemInfoSync();

// console.log(res);

// 获取比例

let scale = 686 / 750;

let width = res.windowWidth * scale;

let height = width;

size.w = width;

size.h = height;

return size;
},
formsubmit(e) {

let url = e.detail.value.url || this.data.placeholder;

// let url = e.detail.value.url ? e.detail.value.url : this.data.placeholder;

wx.showToast({

title: '生成中',

icon: 'loading',

duration: 2000

})

let that_ = this;


let timer = setTimeout(() => {

let size = that_.setCanvasSize();

//调用createQRcode方法

that_.createQRcode(size.w, size.h, 'mycanvars', url);

wx.hideToast();

clearTimeout(timer);

}, 2000)},


/**

* 生命周期函数--监听页面加载

*/
onLoad: function (options) {

//setCanvasSize 拿到画布区域的尺寸（微信小程序不支持dom的操作，所以单独定义方法去获取）

let size = this.setCanvasSize();

// console.log(size);

let url = this.data.placeholder;

//调用createQRcode方法

this.createQRcode(size.w, size.h, 'mycanvars', url);
},二。准备工作，导入数据库表，和unit.js。获取时间二。准备工作，导入数据库表，和unit.js。获取时间二。准备工作，导入数据库表，和unit.js。获取时间
const DB = wx.cloud.database().collection("cows")
const TB = wx.cloud.database().collection("log")
let i = 0
let id=''
var util = require('../utils/util.js');
const DB = wx.cloud.database().collection("cows")
const TB = wx.cloud.database().collection("log")
let i = 0
let id=''
var util = require('../utils/util.js');三。写入签到签退按钮的.js代码三。写入签到签退按钮的.js代码三。写入签到签退按钮的.js代码
now(){



var that = this;

console.log(that.data.nows)

if (i == 0 && that.data.now =='签到'){

i=1;

var time1 = util.formatTime(new Date())

DB.add({

data: {

statctime:time1,

endtime: ''

},

success(res) {

id=res._id

console.log("签到成功", res._id)

},

fail(res) {

console.log("签到失败", res)

}

})

that.setData({

statc: time1,

now: '已签到',

color: 'rgb(199, 194, 194)'

})

wx.showToast({

title: '签到成功'

})

var timeout= setTimeout(function(){

wx.switchTab({

url: '/pages/arrary/first/ones/ones',

})

},1000)



}

else{

wx.showToast({

title: '已签到，请勿重复签到',

icon: 'none'

})

}
},
nows(){

var that = this;

if (i == 1 || that.data.now == '已签到' && that.data.nows == '签退'){

i=2;

var time2 = util.formatTime(new Date())

DB.doc(id).update({

data: {

endtime: time2

},

success(res) {

console.log("签退成功", res)

},

fail(res) {

console.log("签退失败", res)

}

})

that.setData({

ends: time2,

nows: '已签退',

colors: 'rgb(199, 194, 194)'

})

wx.showToast({

title: '签退成功'

})

}

else

{

if(i==2){

wx.showToast({

title: '已签退，请勿重复签退',

icon: 'none'

})

}

else{

wx.showToast({

title: '请先签到，签到之后方可签退！',

icon: 'none'

})

}

}
},
now(){



var that = this;

console.log(that.data.nows)

if (i == 0 && that.data.now =='签到'){

i=1;

var time1 = util.formatTime(new Date())

DB.add({

data: {

statctime:time1,

endtime: ''

},

success(res) {

id=res._id

console.log("签到成功", res._id)

},

fail(res) {

console.log("签到失败", res)

}

})

that.setData({

statc: time1,

now: '已签到',

color: 'rgb(199, 194, 194)'

})

wx.showToast({

title: '签到成功'

})

var timeout= setTimeout(function(){

wx.switchTab({

url: '/pages/arrary/first/ones/ones',

})

},1000)



}

else{

wx.showToast({

title: '已签到，请勿重复签到',

icon: 'none'

})

}
},
nows(){

var that = this;

if (i == 1 || that.data.now == '已签到' && that.data.nows == '签退'){

i=2;

var time2 = util.formatTime(new Date())

DB.doc(id).update({

data: {

endtime: time2

},

success(res) {

console.log("签退成功", res)

},

fail(res) {

console.log("签退失败", res)

}

})

that.setData({

ends: time2,

nows: '已签退',

colors: 'rgb(199, 194, 194)'

})

wx.showToast({

title: '签退成功'

})

}

else

{

if(i==2){

wx.showToast({

title: '已签退，请勿重复签退',

icon: 'none'

})

}

else{

wx.showToast({

title: '请先签到，签到之后方可签退！',

icon: 'none'

})

}

}
},第四。页面监听签退后会跳出签退页面。重新进入需要监听。
var that = this

wx.cloud.callFunction({

name: "getopenid",

success(res) {

var openid = res.result.openid

DB.get({

success(e) {

console.log(e)

var lenths = e.data.length;

console.log(lenths);

var time1 = util.formatTime(new Date())

for (var i = 0; i < lenths; i++) {

if (e.data[i]._openid == openid && e.data[i].statctime.substring(0, 10) == time1.substring(0, 10)) {

var st = e.data[i].statctime

var en = e.data[i].endtime

that.setData({

statc: st,

now: '已签到',

color: 'rgb(199, 194, 194)',

})

}

}

},

fail(e) {

console.log("查询失败", e)

}

})

console.log("获取成功", res.result.openid)


},

fail(res) {

console.log("获取成功", res)

}

})
var that = this

wx.cloud.callFunction({

name: "getopenid",

success(res) {

var openid = res.result.openid

DB.get({

success(e) {

console.log(e)

var lenths = e.data.length;

console.log(lenths);

var time1 = util.formatTime(new Date())

for (var i = 0; i < lenths; i++) {

if (e.data[i]._openid == openid && e.data[i].statctime.substring(0, 10) == time1.substring(0, 10)) {

var st = e.data[i].statctime

var en = e.data[i].endtime

that.setData({

statc: st,

now: '已签到',

color: 'rgb(199, 194, 194)',

})

}

}

},

fail(e) {

console.log("查询失败", e)

}

})

console.log("获取成功", res.result.openid)


},

fail(res) {

console.log("获取成功", res)

}

})到这，一个简单的签到页面就完成了。如有不对的地方，小菜鸟期盼大神的指导。
希望对你们有用处。总结总结总结以上所述是小编给大家介绍的微信小程序实现二维码签到考勤系统，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！