weixin_30883311

最近做的排班表，整个表格全JS动态生成，用了很多Jquery的库，4个主要页面

month.html

var down=false; //判断鼠标是否处于down状态
var y=0;//对象top坐标
var t=0;//时间坐标
var h=0;//对象的height 高度
var w=0;//方向0向下1向下
var m=0;//移动的值

var current_obj, is_current_obj=false; //选择的对象
var current_date; //选择的时间
var resize_obj, resize_down=false; //改动大小的对象
var state_obj=false;
 
var timer;  //定时器


var old_employee_type="";
var old_employee_name="";
var old_employee_gh="";
var is_edit = false;
var edit_div_id = "";
var showDialog_day ="";
var getPageType=" ";
// alert(getPageType);




function setScrollTop(op){
    
    if(!down) return 
    var grid=_c(document,"div","wc-scrollable-grid");
    if(op=="up"){
        grid.scrollTop-=10;
    }else if(op=="down"){
        grid.scrollTop+=10;
        //alert('ddddddddd');
    }
    //_("tool").innerHTML=grid.scrollBottom;
    timer=setTimeout("setScrollTop('"+op+"')",100)    
}

//删除未创建完成的对象
function del_current_obj(){
    if(_(current_date+''+y+'_event_div')){
        _(current_date+''+y+'_event_div').parentNode.removeChild(_(current_date+''+y+'_event_div'));
    }
}

function resize_downEvent(day,event){    
    resize_down=true;
    resize_obj=getEventObj(event).parentNode;
}

//窗体上鼠标点击释放触发事件
window.οnmοuseup=function(){
    down=false;
    if(!state_obj)
    del_current_obj();
}


var wc_scrollable_grid=false;
var grid_tr=false;
//窗体大小改变触发事件
window.οnresize=function(){
    
    if(!wc_scrollable_grid)
        wc_scrollable_grid=_c(document,"div",'wc-scrollable-grid');
    if(!grid_tr)
        grid_tr=_c(document,"tr","grid-tr");
    
    if(_("tab_input").value=="month"){
        //alert($(".Grid").width()*0.1429);
        //alert($(".CalendarWeekend").width());
        $(".easyui-panel").each(function(){
            $(this).panel('resize',{
                width: $(".Grid").width()*0.1429,
                height: 0
            });
          });

        for(var i=0 ;i )
        {
            grid_tr[i].style.height=(getWinHeight()-95)/5+'px';
        }
    }else if(_("tab_input").value=="week"){
        wc_scrollable_grid.style.height=(getWinHeight()-95)+'px';
    }else if(_("tab_input").value=="day"){
        wc_scrollable_grid.style.height=(getWinHeight()-69)+'px';
    }
}

function showModalDialog(day, beginTime, endTime) {
    //////////////////////////////////////////////////
//        getPageType = GetParameter('type');
//        //  alert(getPageType);

    createBlackBg();
    this.dialog = _create('div');
    
    this.dialog.className='dialog bs br10';
    this.header = _create('div');
    
    this.closeimg=_create('div');
    this.bar=_create('div');
    
    var lang=new Language(_('hidden_language').value);
    
    this.dialog.style.top=(getWinHeight()/2-120)+'px';
    this.dialog.style.left=(getWinWidth()/2-200)+'px';
    this.closeimg.className='close';
    this.closeimg.innerHTML="";
    this.bar.className='bar';
    this.bar.innerHTML=lang.event;
    this.form=_create('form');
    this.time=_create('div');
    this.title=_create('div');
    this.content=_create('div');
    this.btu=_create('div');
    var date=new Date(day);
    
    showDialog_day = date.format('yyyyMMdd');
    
    
    this.time.innerHTML=lang.date+' '+date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate()+" ("
                        + lang.weekArray[date.getDay()] + "),  " + Time_hm[beginTime] + " – " + Time_hm[endTime];

    
    //this.title.innerHTML = "" + lang.title + ":
 
";

    this.title.innerHTML = get_employee_type_html();
    this.content.innerHTML = "" + lang.content + ":
" + get_datelist_html() + "
";
    
    this.btu.innerHTML=""+""+" " + lang.edit_detail + "";
    
    this.dialog.appendChild(this.bar);
    this.dialog.appendChild(this.closeimg);
    this.form.appendChild(this.time);
    this.form.appendChild(this.title);
    this.form.appendChild(this.content);
    this.form.appendChild(this.btu);
    this.dialog.appendChild(this.form);

    _('append').appendChild(this.dialog);

    //初始化表格中的数据
    $("#state").combobox({
        onChange: function () {
            var ttt = $("#state").combobox('getValue');
           // var obj = [{ code: '1', name: 'xxxx', price: 12, check:1}];
            $('#dg').datagrid('load', {s_key:ttt, website:'http://www.xxxx.cn/con.html'});
            //$('#dg').datagrid('selectRow', 0); //设定itemid为0的选中
           
        },
    });


    $('#dg').datagrid({
        //url: 'datagrid_data.json',
        url: '../ScheduleWebService.asmx/GetProductInfo',
        queryParams:{s_key:$("#state").combobox('getValue'),  website:'http://www.xxxx.cn/con.html' },
        rownumbers: false,
        singleSelect: true,
        selectOnCheck: true,
        checkOnSelect: true,
        columns: [[
            { field: 'check', title: 'check', checkbox: true, width: 50 },
            { field: 'StaffNo', title: '工号',  width: 100 },
            { field: 'StaffName', title: '姓名', width: 100 },
            { field: 'Staffxb', title: '性别', width: 60 },
            { field: 'Staffdrzw', title: '担任职位', width: 80, align: 'right' }
        ]],
        editor:
        {
            type: 'checkbox',
            options: {
                on: 1,
                off: 0
            }
        },
        onLoadSuccess: function () {//加载完毕后获取所有的checkbox遍历
            var date = $('#dg').datagrid('getRows');
            var flag = false;
   
            for (var i = 0; i < date.length; i++) {
               // alert(date[i].name);//这里可以查看每一个值，通过这个，可以进行盘点，设定默认选择项
                if (date[i].StaffNo == old_employee_gh) {
                    $('#dg').datagrid('selectRow', i);
                    flag = true;
                    break;
                }
            }
            if (!flag)
                $('#dg').datagrid('selectRow', 0);
        }
    });

}


function saveModalDialog(){
    var selected = $('#dg').datagrid('getSelected'); //这个可以获取到当前选择的结果
    
  //如果选择，则进行判断，是删除，还是修改==
    if (selected) {
        var type = $("#state").combobox('getValue');
        var name = selected.StaffName;
        //动态计算可用的宽度，如果不够则减少title信息
        var div_title = $('.CalendarWeekend.day_pc #event_list').width()>=140?(type+":"+name):name;
        var div_id = showDialog_day +'_'+selected.StaffNo;//DIV的ID为日期_数据库唯一编号来定 
        var gh = selected.StaffNo;
        //判定，如果是新增，则直接走新增div，如果现在的div_id不等于修改前的id，则删除掉修改之前的ID，然后隐藏DIV，增加新的div，
        //如果现在的div_id在页面中存在，且状态为显示，则提示该人员已经新增，否则，显示DIV，在数据库中增加该对象
         
        //如果选择了人员，则div_id存在
        if(document.getElementById(div_id))
        {
            if (document.getElementById(div_id).parentNode.style.display == 'none')
            {
               $('#'+div_id).panel('open');
               $('#'+div_id).panel('setTitle',div_title);
                //增加新增的节点信息,div_id
                
                AddSchedule(div_id);
                if(edit_div_id != "" && edit_div_id != div_id)//说明是修改,且ID不同
                {
                    
                    $('#'+edit_div_id).panel('close');
                    //删除掉原有的数据 edit_div_id
                    
                    //DelSchedule(edit_div_id);//此处不用删除了，因为close函数会自动调用delete_employee方案
                   
                }
                closeModalDialog();
                return;
            }
            else
            {
                alert("该人员已经添加，请重新选择！");
                return ;
            }
        } 
        else //该DIV 不存在且，是编辑状态
        {
                
               if(edit_div_id != "" )//说明是修改
                {
                    
                    $('#'+edit_div_id).panel('close');
                    //删除掉原有的数据 edit_div_id
                    //DelSchedule(edit_div_id);//此处不用删除了，因为close函数会自动调用delete_employee方案
                 
                }
        }

      
        AddSchedule(div_id);
          
         //增加新增的节点信息  div_id
        if (edit_div_id == "")
        {    //alert($('.CalendarWeekend.day_pc #event_list').val());
            $('.CalendarWeekend.day_pc #event_list').append("
");
         }
         else
         { 
            $("#"+ edit_div_id).parent().parent().append("
");
           
         }
          $('#'+div_id).panel(
            {   
                title: div_title,
                content: type,
                width: $(".CalendarWeekend.day_pc #event_list").width(),
                height:0,
                padding:0,
               
                closable:true,
                onBeforeClose: function () {
                    return delete_employee(name, type, div_id);
                },
                tools:[{ 
                iconCls:'icon-edit', 
                handler:function(){ 
               //  alert('1');
                        edit_employee(name,type, div_id);
                    }
                }]  
            }); 
        
        
        

    }
    //如果没有选择
    else {
        alert("没有选择人员");
    }
    
   closeModalDialog();
}

  
 //function AddSchedule()为保存函数，在选取成功后，将所选人员gh，和新生产div_id 传到后端，用于保存数据  
function AddSchedule(div_id) {
    var date = div_id.split('_')[0];
    var gh = div_id.split('_')[1];
 
    try {
        $.ajax({
            type: "POST",
            url: "../ScheduleWebService.asmx/AddSchedule",
            data: "{'date':'" + date + "','gh':'" + gh + "'}",
            contentType: "application/json; charset=utf-8;",
            success: CallSucceed,
            dataType: "json",
             async: false,     //强制同步
            failure: CallFailed
        });
    }
    catch (e) {
        $.messager.alert('提示', 'failed to call web service. Error:' + e, 'error');
    }


}

function CallSucceed(response) {
    alert(response.d);
}

function CallFailed(error) {
    $.messager.alert('提示', 'error: ' + error, 'error');
}

//删除数据
function DelSchedule(div_id)
{
    
    var date = div_id.split('_')[0];
    var gh = div_id.split('_')[1];
    var xm= xm;
    try {
        $.ajax({
            type: "POST",
            url: "../ScheduleWebService.asmx/DelSchedule",
            data: "{'date':'" + date + "','gh':'" + gh + "'}",
            contentType: "application/json; charset=utf-8;",
            success: CallSucceed,
            async: false,     //强制同步
            dataType: "json",
            failure: CallFailed
        });
    }
    catch (e) {
        $.messager.alert('提示', 'failed to call web service. Error:' + e, 'error');
    }

}

//关闭选择页面
function closeModalDialog(){
    _('append').innerHTML = '';
    old_employee_name = "";
    old_employee_type = "";
    edit_div_id= "";
    is_edit = false;
}

function createBlackBg() {
    
    this.bg=_create('div');
    this.bg.className = 'blackBg';

    _('append').appendChild(this.bg);
    
}

function get_datelist_html() {
    var out_str = "";
    out_str += "    ;
    out_str += "        \n";
    out_str += "        \n";
    out_str += "    
\n";
    return out_str;
}


//编辑修改人员信息
function edit_employee(name, type, div_id) {
  //  alert(name);
    old_employee_name = name;
    old_employee_type = type;
    old_employee_gh= div_id.split('_')[1];

    is_edit = true;
    edit_div_id=div_id;
    var date = new Date(div_id.substring(0,4),div_id.substring(4,6)-1,div_id.substring(6,8));
    //alert(date.toString());
    showModalDialog(date.format('MM/dd/yyyy'), 18, 34);
   
}

//删除人员信息
function delete_employee(dept, name, div_id) {
    
    if (edit_div_id == "" && !confirm("确认要删除么？")) {
        return false;
    }
    DelSchedule(div_id);
    return true;
}

//动态分析不同部门显示各自部门的类型，没有定义部门的获取全面人员
function get_employee_type_html() {
   var getPageType= GetParameter('type');
     //alert(getPageType);
  if (getPageType!="")
       {
             var visiabletype =Array(getPageType);
        }
        else
        {
             var visiabletype = new Array('行政部','护理科','后勤事务科','院领导','生活服务科');
        }
      
    var EmployeeType=visiabletype;
     

//自动适应生成人员选择的列表信息
    var lang = new Language(_('hidden_language').value);
    var out_str = "" + lang.title + ":