青鸟教育系统-教室管理js页面

var grid = $("#grid-main"); // Grid
var gridCode = "clazzroom-main"; // Grid Code
var state = 0;
var Main = function(){
return {
init : function(){
// 主页面 -教室是否占用下拉框
$("#read_select_clazzroom").select2();
// 主页面 -教室是否占用下拉框-默认查看未占用教室
$("#read_select_clazzroom").select2('val','0');
// 主页面 -教室是否占用下拉框-变动事件
$("#read_select_clazzroom").on("change", function(e) {
state = e.val;
grid.jqGrid().trigger('reloadGrid');
})
// 申请页面-教室选择下拉框
loadRequestClazzroom();
// 申请页面-选择教室下拉框-变动事件
$("#request_select_clazzroom").on("change", function(e) {
$.asyn({
url : base + "/base/clazzroom-findClazzroomById.do?id=" + e.val,
success : function(result) {
$("#request_person").html(result.perNumber);
$("#request_description").html(result.description);
}
});
})
// 定义所有在校班级数组
var clas = new Array();
// 从数据库取到所有在校班级
$.asyn({
url : base + "/base/clazzroom-findAllClazz.do",
success : function(result) {
$.each(result, function(index, r) {
clas.push({
id : r.id,
text : r.code
});
});
}
});
// 申请页面-选择班级下拉框
$("#request_clazz").select2({
allowClear : true,
data : clas,
placeholder : "选择班级"
});
// 主页面-编辑弹出框-占用班级下拉框
$("#change_clazz").select2({
allowClear : true,
data : clas,
placeholder : "占用班级"
});
// 主页面-表格-初始化
grid.initJqGrid({
gridCode : gridCode,
postData : {
state : function(){
return state;
}
},
gridComplete : function() {
var ids = grid.jqGrid('getDataIDs');
for ( var i = 0; i < ids.length; i++) {
var id = ids[i];
var rowData = grid.jqGrid("getRowData",id);
var stateDialog = rowData.state == 1?'是':'否';
var idDialog = "<i class='fa fa-edit' title='编辑' οnclick='changeTr(\""+rowData.id+"\");' style='cursor: pointer;'></i>";
grid.jqGrid('setRowData', ids[i], {
state : stateDialog,
id:idDialog
});
}
}
});
// 主页面-表格高度设置 
grid.setGridHeight($(window).height() - 370); 

}
};
}();
// 加载申请页面-教室下拉框
var loadRequestClazzroom = function() {
// 定义未被选用的教室数组
var codes = new Array();
// 从数据库取到所有未被占用的教室
$.asyn({
url : base + "/base/clazzroom-findClazzroom.do",
success : function(result) {
$.each(result, function(index, r) {
codes.push({
id : r.id,
text : r.code
});
});
}
});
// 申请页面-选择教室编号下拉框
$("#request_select_clazzroom").select2({
allowClear : true,
data : codes,
placeholder : "选择教室"
});
}
// 新增教室弹出框
var add = function() {
$("#stack1").dialog({
dialogClass : 'ui-dialog-grey',
modal : true,
closeOnEscape : false,
close : function() {
// 清空文本框信息
$("#add_clazzroom input").each(function() {
$(this).val("");
});
// 清空验证的提示信息
$("#check_add_number").text("");
$("#check_add_address").text("");
$("#check_add_code").text("");
}
});
}
//保存新增教室按钮
var sureAdd = function() {
// 表单验证通过可以保存数据
if(checkAddForm()){
// 用户确认是否可以增加数据
bootbox.confirm("<h2> &nbsp;确定要新增数据么？</h2>", function(result) {
if (result) {
// 数据传入后台
$.ajax({
url : base + '/base/clazzroom-add.do', 
data : $("#add_clazzroom").serialize(), 
type : 'post', 
dataType : 'text', 
success : function(rs) {
$("#read_select_clazzroom").select2('val','0');
state = 0;
//重新加载表格
grid.jqGrid().trigger('reloadGrid');
// 重新加载申请页面下拉框
loadRequestClazzroom();
}
});
// 关闭新增教室弹出框
$("#stack1").dialog("close");
}
});
}
}
// 取消新增教室按钮
var closeAdd = function() {
$("#stack1").dialog("close");
}
// 删除教室按钮
var deleteTr = function() {
var flag = false;
// 判断是否有记录被选中
$("#grid-main tbody input[type='checkbox']").each(function() {
if($(this).prop("checked")){
flag = true;
return;
}
});
if(flag){
// 询问用户是否删除数据
bootbox.confirm("<h2 style='color: red;'> &nbsp;确定要删除？</h2>", function(result) {
if (result) {
// 页面删除表格行
$("#grid-main tbody input[type='checkbox']").each(function() {
if($(this).prop("checked")){
$(this).closest("tr").remove();
}
});
// 数据库删除
var ids = $("#grid-main").jqGrid('getGridParam','selarrrow');
for (var i = 0; i < ids.length; i++) 
$.asyn({
url : base + "/base/clazzroom-deleteClazzroomById.do?id="+ids[i],
success : function(result) {}
});
// 重新加载申请页面下拉框
loadRequestClazzroom();
}
});
}else {
// 未选中给用户提示信息
bootbox.alert("<h2> &nbsp;请先选中一行数据</h2>");
}

}
// 编辑教室信息按钮
var changeTr = function(id) {
// 编辑教室弹出框
$("#stack2").dialog({
dialogClass : 'ui-dialog-grey',
modal : true,
closeOnEscape : false,
close : function() {
// 清空文本框信息
$("#change_clazzroom input[type='text']").each(function() {
$(this).val("");
});
// 清空多选框
$("#change_clazz").val('');
// 清空日期框信息
$("#change_clazzroom input[type='date']").each(function() {
$(this).val("");
});
// 清空错误提示信息
removeError();
}
});
// 从数据库查询出数据
$.asyn({
url : base + "/base/clazzroom-findClazzroomById.do?id=" + id,
success : function(result) {
$("#change_name").val(result.code);
$("#change_kind").val(result.perNumber);
$("#change_address").val(result.address);
$("#change_explains").val(result.description);
// 是否占用
var state = result.state;
$("input[type='radio']").get(state).click();
// 占用班级
var clazzId = result.clazzId;
if(clazzId != null)
$("#change_clazz").select2('val',clazzId+'');
if(result.expBeginDate != null)
$("#change_begin").val(result.expBeginDate.substring(0,10));
if(result.expEndDate != null)
$("#change_end").val(result.expEndDate.substring(0,10));
$("#change_id").val(id);
}
});
}
// 保存编辑教室结果按钮
var sureServe = function() {
// 验证规则是否通过
if($("#change_clazzroom").valid()){
// 询问用户是否确认编辑数据
if (confirm("确定要编辑数据么?")) {
// 编辑教室未被占用 清空日期 班级等信息
if($("input[type='radio']:first").prop("checked")){
$("#change_clazz").val('');
$("#change_begin").val('');
$("#change_end").val('');
}
// 编辑数据传入数据库
$.ajax({
url : base + '/base/clazzroom-updateClazzroomById.do', 
data : $("#change_clazzroom").serialize(), 
type : 'post', 
dataType : 'text', 
success : function(rs) {
// 重新加载表格
grid.jqGrid().trigger('reloadGrid');
// 重新加载申请页面下拉框
loadRequestClazzroom();
// 关闭编辑教室弹出框
$("#stack2").dialog("close");
}
});
}
}
}
// 取消教室编辑按钮
var closeChange = function() {
$("#stack2").dialog("close");
}
// 申请教室确认按钮 
var requestClazzroom = function() {
// 表单申请验证是否通过
if ($("#request_form").valid()) {
$.ajax({
url : base + '/base/clazzroom-requestClazzroomById.do', 
data : $("#request_form").serialize(), 
type : 'post', 
dataType : 'text', 
success : function(rs) {
// 没有选择教室弹出提示信息
if(rs == 'false'){
bootbox.alert("<h2> &nbsp;请先选择教室</h2>");
return;
}
// 重新加载表格
grid.jqGrid().trigger('reloadGrid');
// 重新加载申请页面下拉框
loadRequestClazzroom();
// 表单数据清空
$("#request_form input").each(function() {
$(this).val("");
});
// 提示信息清空
$("#request_person").html('');
$("#request_description").html('');
// 弹出成功对话框
bootbox.alert("<h2> &nbsp;操作成功</h2>");
}
});
}
}
// 验证新增教室表单数据
var checkAddForm = function() {
// 地址栏未填写 则获取焦点
if(!checkAddAddress())
$("#add_address").focus();
// 容纳人数未填写 则获取焦点
if(!checkAddNumber())
$("#add_number").focus();
// 教室编号填写错误 则获取焦点
if(!checkAddCode()){
$("#add_code").focus();
return false;
}
// 验证通过 允许提交数据
return checkAddCode() & checkAddNumber() & checkAddAddress();
}
// 验证新增教室-教室编号
var checkAddCode = function() {
// 验证教室编码是否为空
if($("#add_code").val() == null || $("#add_code").val().trim() == ''){
$("#check_add_code").text(" *教室编号不能为空").css('color','red');
return false;
}
// 验证教室编码是否重复
var hasCode = true;
$.ajax({
url : base + '/base/clazzroom-checkClazzroomCode.do', 
data : {
code : $("#add_code").val()
}, 
async:false,
type : 'post', 
dataType : 'text', 
success : function(rs) {
hasCode = rs;
}
});
if(hasCode == 'false'){
$("#check_add_code").text(" *该教室编号已存在").css('color','red');
return false;
}
// 验证通过
$("#check_add_code").text(" *填写正确").css('color','green');
return true;
}
// 验证新增教室-容纳人数
var checkAddNumber = function() {
// 验证容纳人数是否为空
if ($("#add_number").val() == null || $("#add_number").val().trim() == '') {
$("#check_add_number").text(" *容纳人数不能为空").css('color','red');
return false;
}
// 验证通过
$("#check_add_number").text(" *填写正确").css('color','green');
return true;
}
// 验证新增教室-地址
var checkAddAddress = function() {
// 验证地址是否为空
if ($("#add_address").val() == null || $("#add_address").val().trim() == '') {
$("#check_add_address").text(" *地址不能为空").css('color','red');
return false;
}
// 验证通过
$("#check_add_address").text(" *填写正确").css('color','green');
return true;
}
// 验证编辑教室表单数据
$("#change_clazzroom").validate({
ignore : "",
rules : {
"code" : {
required : true,
remote : {
async : false,
url : ctx + "/base/clazzroom-checkClazzroomCode.do?random=" + Math.random(),
type : "post",
dataType : "json",
data : {
code : function() {
return $("#change_name").val();
},
id : function() {
return $("#change_id").val();
}
}
}
},
"perNumber" : {
required : true
},
"address" : {
required : true
}
},
messages : {
"code" : {
required : "教室编码不能为空",
remote : "教室编码已存在"
},
"perNumber" : {
required : "容纳人数不能为空"
},
"address" : {
required : "地址不能为空"
}
},
highlight : function(element) {
$(element).closest('.form-group').addClass('has-error');
},
success : function(label) {
label.closest('.form-group').removeClass('has-error');
label.remove();
}
});
// 编辑错误信息移除
function removeError() {
$('.form-group').removeClass('has-error');
$('.error').remove();
}
//编辑教室的开始和结束时间比较
$.validator.addMethod("compareDateChange",function(value,element){
    var assigntime = $("#change_begin").val();
    var deadlinetime = $("#change_end").val();
    if(assigntime>deadlinetime){
        return false;
    }else{
        return true;
    }
},"<font color='#E47068'>结束日期必须大于开始日期</font>");
//开始使用日期不能为空
$("#change_begin").rules('add',{
rules:{
required : true
},
messages:{
required : "日期不能为空"
}
});
//结束使用日期不能为空
$("#change_end").rules('add',{
rules:{
required : true,
compareDateChange : "expBeginDate"
},
messages:{
required : "日期不能为空"
}
});
//班级选择不能为空
$("#change_clazz").rules('add',{
rules:{
required : true
},
messages:{
required : "请选择班级"
}
});
// 验证编辑教室  选择不被占用 删除验证规则
$("input[type='radio']").get(0).addEventListener('click',function(){
// 隐藏选择教室下拉框 日期选择框
$("#change_clazz_div").hide();
$("#change_begin_div").hide();
$("#change_end_div").hide();
// 移除日期验证规则
$("#change_begin").rules('remove');
$("#change_end").rules('remove');
$("#change_clazz").rules('remove');
// 移除错误提示
removeError();
});
//验证编辑教室   选择被占用 增加验证规则
$("input[type='radio']").get(1).addEventListener('click',function(){
// 显示选择教室下拉框 日期选择框
$("#change_clazz_div").show();
$("#change_begin_div").show();
$("#change_end_div").show();
/**
* 删除日期验证规则
* 不删除直接增加验证规则会报错  
*/
$("#change_begin").rules('remove');
$("#change_end").rules('remove');
$("#change_clazz").rules('remove');
// 增加日期和班级验证
$("#change_begin").rules('add','required');
$("#change_end").rules('add','required');
$("#change_end").rules('add','compareDateChange');
$("#change_clazz").rules('add','required');
});
// 验证申请教室表单信息
$("#request_form").validate({
rules:{
"expBeginDate":{
required : true
},
"expEndDate":{
required : true,
compareDate : "expBeginDate"
},
"clazzId":{
required : true
}
},
messages:{
"expBeginDate":{
required : "预计开始使用日期不能为空"
},
"expEndDate":{
required : "预计结束使用日期不能为空"
},
"clazzId":{
required : "请选择申请的班级"
}
},
highlight : function(element) {
$(element).closest('.form-group').addClass('has-error');
},
success : function(label) {
label.closest('.form-group').removeClass('has-error');
label.remove();
}
});
// 申请教室的开始和结束时间比较
$.validator.addMethod("compareDate",function(value,element){
    var assigntime = $("#request_begin_time").val();
    var deadlinetime = $("#request_end_time").val();
    if(assigntime>deadlinetime){
        return false;
    }else{
        return true;
    }
},"<font color='#E47068'>结束日期必须大于开始日期</font>");
// 文档点击事件
document.onclick = function() {
// 编辑框是否是当前窗口 
if($("#change_name").get(0) == document.activeElement){
// 获取键盘输入
document.οnkeydοwn=function(event){
   var e = event || window.event || arguments.callee.caller.arguments[0];
   if(e && e.keyCode==27){ // 按 Esc 
    // Esc键 编辑新增
    closeChange();
     }
    if(e && e.keyCode==13){ // enter 键
    // enter键 保存编辑教室
    sureServe();
   }
};
}
// 申请教室页面是否是当前窗口
if($("#request_clazzroom_tab").get(0) == document.activeElement){
// 获取键盘输入
document.οnkeydοwn=function(event){
   var e = event || window.event || arguments.callee.caller.arguments[0];
    if(e && e.keyCode==13){ // enter 键
    // enter键 确认申请教室
    requestClazzroom();
   }
};
}
// 新增教室弹出框是否是当前窗体
if($("#add_code").get(0) == document.activeElement){
// 获取键盘输入
document.οnkeydοwn=function(event){
   var e = event || window.event || arguments.callee.caller.arguments[0];
   if(e && e.keyCode==27){ // 按 Esc 
    // Esc键 取消新增
    closeAdd();
     }
    if(e && e.keyCode==13){ // enter 键
    // enter键 保存新增教室
    sureAdd();
   }
};
}
}
// 鼠标按下事件
document.onmousedown = function() {
var isMove = false;
// 0.1s 触发一次鼠标按下事件
var stop = setInterval(function() {
isMove = true;
if(isMove){
var stp1 = $("#stack1").offset().top;
var stp2 = $("#stack2").offset().top;
// 弹出框拖动高度超过限制，隐藏头部菜单栏
if (( stp1 <= 85 & stp1 != 0) ||(stp2 <= 85 & stp2 != 0)) {
$("#header").hide();
} else {
$("#header").show();
}
}
}, 100);
// 鼠标弹起事件
document.onmouseup = function() {
clearInterval(stop);
isMove = false;
}
}