1. 程式人生 > >微信小程式(看文件寫例項五)微信小程式課堂寶APP實現獲取簽到列表

微信小程式(看文件寫例項五)微信小程式課堂寶APP實現獲取簽到列表

根據上篇博文,這篇主要實現獲取簽到列表邏輯。

獲得簽到列表主要有以下步驟:

(1)查詢老師的ID

(2)查詢老師的簽到記錄

(3)如果當前使用者是老師,直接顯示所有記錄,因為簽到記錄都是老師發起的,肯定每次都簽到

(4)如果當前使用者是學生,以老師的簽到列表作為長度,然後以item遍歷老師的簽到列表,如果item在學生的簽到列表中,說明學生本次是完成簽到的,否則沒有完成簽到

(5)如果到最後一個item,沒有在學生的簽到列表,提示學生使用者當前有新的簽到

具體程式碼如下:

 

// 獲得當前使用者的簽到記錄

getSignRecord:function(){

if(app.globalData.currentUser == null)return;

 

wx.showToast({

title: '更新簽到記錄',

icon: 'loading',

duration: 10000

});

// 1、查詢老師的ID

var queryTeacher = Bmob.Query('_User');

queryTeacher.equalTo("userType", '==', 1);

queryTeacher.find().then(resTeacher=>{

var teacher = resTeacher[0];

// 2、查詢老師的簽到記錄

var queryTeacherSignRecord = Bmob.Query('sign_record');

queryTeacherSignRecord.order("-numberNo");

var teacherPointer = Bmob.Pointer('_User')

var teacherPointId = teacherPointer.set(teacher.objectId);

queryTeacherSignRecord.equalTo("userId", '==', teacherPointId);

queryTeacherSignRecord.find().then(resTeacherSignRecord => {

// 老師無簽到記錄,學生肯定也沒有簽到記錄

if (resTeacherSignRecord.length==0){

wx.hideToast();

return;

}

// 簽到記錄

var signRecord = [];

// 如果是老師使用者,直接顯示

if (app.globalData.currentUser.userType==1){

for (var i = 0; i < resTeacherSignRecord.length; i++) {

signRecord[i] = {

date: resTeacherSignRecord[i].createdAt.split(' ')[0],

numberNo: resTeacherSignRecord[i].numberNo,

signFlag: true

}

}

wx.hideToast();

//把記錄儲存並渲染介面

that.setData({ mSignRecord: signRecord });

}

// 如果是學生使用者

else{

// 3、查詢學生簽到記錄

var queryStudentSignRecord = Bmob.Query('sign_record');

queryStudentSignRecord.order("-numberNo");

var pointer = Bmob.Pointer('_User');

var poiID = pointer.set(app.globalData.currentUser.objectId);

queryStudentSignRecord.equalTo("userId", '==', poiID);

queryStudentSignRecord.find().then(resStudentSignRecord => {

console.log(resStudentSignRecord);

// 學生的簽到記錄和老師的一樣,說明學生每次都完成簽到

if (resStudentSignRecord.length == resTeacherSignRecord.length) {

for (var i = 0; i < resStudentSignRecord.length; i++) {

signRecord[i] = {

date: resTeacherSignRecord[i].createdAt.split(' ')[0],

numberNo: resTeacherSignRecord[i].numberNo,

signFlag: true

}

}

}

// 學生少簽到則以老師簽到為準

else {

for (var i = 0; i < resTeacherSignRecord.length; i++) {

var flag = false;

// 老師的簽到在學生的簽到表中,說明學生簽到了

if (that.isNumberNoInStudentSignRecord(resTeacherSignRecord[i].numberNo, resStudentSignRecord) == true){

flag = true;

}

// 提示有最新簽到

if (i == resTeacherSignRecord.length - 1){

that.setData({ signFlag: flag, signNumber: i + 1});

}

signRecord[i] = {

date: resTeacherSignRecord[i].createdAt.split(' ')[0],

numberNo: resTeacherSignRecord[i].numberNo,

signFlag: flag

}

}

}

wx.hideToast();

//把記錄儲存並渲染介面

that.setData({ mSignRecord: signRecord });

// 不再重新整理

that.data.selectedScrollItemsLoadingComplete[0] = true;

that.setData({selectedScrollItemsLoadingComplete: that.data.selectedScrollItemsLoadingComplete });

}).catch(err => { });

}

}).catch(err=>{});

}).catch(err=>{});

},

data資料自己加下,注意這個在呼叫時有個坑,因為是在onLoad()中要載入,而載入時需要獲得app.globalData.currentUser,所以要等到app.globalData.currentUser不為null時才能執行方法,因為Bmob.User.current()是非同步獲得的,所以可能沒有獲取到就執行方法時是得不到資料的,因此要確保app.globalData.currentUser獲得以後才執行上述方法,解決辦法是定時請求,直到app.globalData.currentUser不為空時結束銷燬定時器。

onLoad()中具體程式碼如下:

// 設定定時器為0.5秒,直到獲得到使用者資訊才執行簽到列表邏輯

var getCurrentUserResult = setInterval(function () {

if (app.globalData.currentUser == null) {

var current = Bmob.User.current();

if (current != null) {

app.setGlobalData({ currentUser: current });

}

}

else {

// 清除定時器

clearInterval(getCurrentUserResult);

wx.hideToast();

// 載入簽到列表

that.getSignRecord();

}

}, 500);

最終效果如下(以學生端為例):

伺服器

客戶端

可以看到能正確獲得簽到表的資料,當然現在的資料是直接在後臺加上的,下篇更新實現簽到邏輯。