//添加滚动事件
studentGrid.on('scroll',function(){
var sT = $(this)[0].scrollTop,
sH = $(this)[0].scrollHeight,
h =$(this).height();
//滚动到底部了 加载下一页
if((sT+h)>=sH){
pageCurGroupMember(pageCache,curScrollPage+1);
}
})
数组filter方法对数组元素进行过滤
2018年03月19日 10:12:46
阅读数：448
Array.prototype.filter
对数组中元素进行过滤
/**
* @method reduce
* @param {number} item 当前迭代的数组元素
* @param {number} index 当前迭代的数组元素下下标
* @param {array} array 原数组
*/
let arr = [1,2,6,3,4,5];
let res = arr.filter(function(item,index,array){
//元素值，元素的索引，原数组。
return (item>3);
});
console.log(res);//[6, 4, 5]
filter 方法可以将数组中不符合的元素去掉，返回一个新数组。
(function(){
var hrefSrc = "function/modals/oneOnNGroupStudentModal.html",
curGroupId = Util.getModalParameter(hrefSrc, 'groupId'),
blCampusId = Util.getModalParameter(hrefSrc, 'blCampusId'),
modal = $('#oneOnNGroupStudentModal'),
studentGrid = modal.find('#studentGrid'),
chosenStudent = modal.find('#chosenStudent'),
groupName = modal.find('#groupName'),
title = modal.find('#title'),
frm = modal.find('#frm'),
noChosenStudentTips = modal.find('#noChosenStudentTips').clone(),
groupInfoForm = modal.find('#groupInfoForm'),
studyManagerPost = modal.find('#studyManagerPost'),
saveGroupBlCampusId = modal.find('#blCampusId'),//保存小组的校区
searchBtn = modal.find('#searchBtn');
var curChooseListData = [],//已选学员列表
modGroupName = true,//默认选完学员小组名也变
userId = Index.currentLoginUser.userId,
students = Util.getModalParameter(hrefSrc, "data"),
pageCache = {},
curScrollPage = 0;
initEvent();
initData();
//刷新已选学员列表
function refreshChosenList() {
chosenStudent.html(template('template-chosenStudent', { items: curChooseListData }));
if (curChooseListData.length === 0) {
chosenStudent.html(noChosenStudentTips);
}
if (modGroupName) {
groupName.val(curChooseListData.map(function (item) {
return item.name
}).join('、').substring(0,20));
}
Util.datepicker(chosenStudent.find('.firstCourseDateInput'),{buttonPaneClass:'noCloseBtn'}); //统一初始化时间选择框
pageSetUp(chosenStudent);
}
//modal列表数据分页处理
function pageCurGroupMember(pageCache,page){
var showData = [];
pageCache = pageCache || [];
page = page || 1;
curScrollPage = page ;
showData = pageCache.filter(function(item,i){
return (i>=(page-1)*20 && i<page*20)
});
var noItemTips = '<div id="noMemberItems" class="normal-gray">暂无数据，请重新查询！</div>';
if(pageCache.length === 0 && page===1){
studentGrid.html($(noItemTips));
return;
}
var dom = showData.length>0 ? $(template('template-studentGrid',{ items:showData})):'';
page===1? studentGrid.html(dom):studentGrid.append(dom);
if(showData.length === 0) return;
dom.filter('.item').each(function (i) {
$(this).data('data', showData[i]);
})
//修改的时候选中已改数据
$(curChooseListData).each(function (i, item) {
studentGrid.find('div.item[data-id="' + item.id + '"] i.check-ico').addClass('fa-check-circle').removeClass('fa-circle-thin');
})
pageSetUp(studentGrid);
}
function initEvent() {
//查询学员
searchBtn.click(function () {
var params = Util.tranFormVarToJson(frm);
params.blCampusId = blCampusId;//查询带上参数
$.get(Api.listStudentsForChoose, params, function (res) {
pageCache = res.rows;
pageCurGroupMember(pageCache);
})
})
//左侧列表选中/取消
studentGrid.on('click', 'div.item', function () {
var item = $(this),
ico = item.find('i.check-ico'),
id = item.attr('data-id'),
data = item.data('data');
if (!data.firstCourseDate) {
data.firstCourseDate = DateUtil.getCurrentDate();
}
//选中
if (ico.hasClass('fa-circle-thin')) {
ico.addClass('fa-check-circle').removeClass('fa-circle-thin');
curChooseListData.push(data);
refreshChosenList();
} else {
chosenStudent.find('div.item[data-id="' + id + '"] i').click();
}
})
//添加滚动事件
studentGrid.on('scroll',function(){
var sT = $(this)[0].scrollTop,
sH = $(this)[0].scrollHeight,
h =$(this).height();
//滚动到底部了 加载下一页
if((sT+h)>=sH){
pageCurGroupMember(pageCache,curScrollPage+1);
}
})
//右侧列表删除
chosenStudent.on('click', 'i', function () {
if ($(this).hasClass('disabled')) return;
var item = $(this).parents('.item:eq(0)'),
id = item.attr('data-id');
//处理数据
$(curChooseListData).each(function (i, item) {
if (item.id == id) {
curChooseListData.splice(i, 1);
}
});
refreshChosenList();
studentGrid.find('div.item[data-id="' + id + '"] i.check-ico').removeClass('fa-check-circle').addClass('fa-circle-thin');
})
//小组名接受输入后，modGroupName关闭
groupName.one('input', function () {
modGroupName = false;
})
//保存
modal.on('click', '.submit', function () {
//alert(blCampusId);
var params = {};
if (curGroupId) {
params.id = curGroupId;
} else {
params = Util.tranFormVarToJson(groupInfoForm);
if (!params) return;
}
//过滤之前学员
var tmpArr = curChooseListData.filter(function (item) {
return !item.oriFlag;
});
//拼学员id
params.studentIds = tmpArr.map(function (item) {
return item.id;
}).join(',');
if (!params.studentIds) {
Util.showAlert('请选择学员',true);
return false;
}
// 首课日期
var firstCourseDateArray = [];
$.each(chosenStudent.find('.firstCourseDateInput'), function () {
var that = $(this),
studentId = that.attr('data-studentId'),
firstCourseDate = that.val();
firstCourseDateArray.push({
studentId: studentId,
firstCourseDate: firstCourseDate
});
});
params.firstCourseDate = JSON.stringify(firstCourseDateArray);
params.blCampusId=blCampusId;
$.post(Api.quickSaveOneOnNGroup, params, function (res) {
if (res.resultCode === 0) {
Util.showAlert('保存成功');
Util.closeModal(hrefSrc);
}
})
})
}
function initData() {
studyManagerPost.attr('data-value', userId);
//初始化学管师
InitUtil.initCampusStudy(modal.find('#studyManagerEl').add(studyManagerPost));
//修改和新增不同
if (curGroupId) {
//小组信息
$.get(Api.findOneOnNGroupById, { id: curGroupId }, function (res) {
Util.fillElmentValueByTag(res.data, 'data-from', null, groupInfoForm);
groupInfoForm.find('select,input').prop('disabled',true).change();
modGroupName = false;
});
//组员信息
$.get(Api.listStudentsInGroup, { groupId: curGroupId }, function (res) {
curChooseListData = res.data;
//旧数据不能删
$(curChooseListData).each(function (i, item) {
item.oriFlag = true;
if (!item.firstCourseDate) item.firstCourseDate = '-';
})
searchBtn.click();
refreshChosenList();
});
title.text('添加组员');
} else {
saveGroupBlCampusId.val(blCampusId).change();
searchBtn.click();
}
// 默认选中 从一对N学员列表跳转到新建小组的学员
if (students) {
curChooseListData = students.slice() ;
$(curChooseListData).each(function (i, item) {
if (!item.firstCourseDate) item.firstCourseDate = DateUtil.getCurrentDate();
});
refreshChosenList();
}
}
})();