fullcalendar在java/web的应用

来源：互联网发布：数据采集费发票编辑：程序博客网时间：2024/05/02 02:22

fullcalendar做了一个日程管理总结一下用法怕忘了

1.需要将fullcalendar插件导入项目

2.页面引入css和js文件

皮肤css

3.js控制fullcalendar插件

$(document).ready(function() {//系统时间var nowdate = new Date();var nowd = nowdate.getDate();var nowm = nowdate.getMonth();var nowy = nowdate.getFullYear();var updateCrmCalendarDate="<s:url action='updateClaendarDate' includeParams='none'/>";var dialogCrm="<s:url action='saveOrUpdatemanager' includeParams='none'/>";var  pro= "<s:url action='listCalendars' includeParams='none'/>";$('#calendar').fullCalendar({theme: true,//使用主题aspectRatio: 1.35,//每个日期的长宽比header: {left: 'prev,next today',center: 'title',right: 'month,basicWeek,basicDay'//控制显示样式},monthNames:['一月','二月', '三月', '四月', '五月', '六月', '七月','八月', '九月', '十月', '十一月', '十二月'],dayNamesShort:['星期日', '星期一', '星期二', '星期三','星期四', '星期五', '星期六'],dayNames:['星期日', '星期一', '星期二', '星期三','星期四', '星期五', '星期六'], buttonText:{ prev: '昨天', next:'明天', prevYear: '去年', nextYear: '明年', today:'今天', month:'月', week:'周', day:'日' }, //显示文字中文设置editable:true,//可以拖拽disableResizing:true,//不可以改变大小//事件拖动处理            eventDrop: function(calEvent, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view) {                    var fstart  = $.fullCalendar.formatDate(calEvent.start, "yyyy-MM-dd HH:mm:ss");                    var fend  = $.fullCalendar.formatDate(calEvent.end, "yyyy-MM-dd HH:mm:ss");                    var fullDate = $.fullCalendar.formatDate(calEvent.start, "yyyy-MM-dd");                    $.getJSON(updateCrmCalendarDate+"?date="+fstart+"&crmSchedule.id="+calEvent.id+"&nowDate="+(new Date()).valueOf(),{},function(data){  var events = [];if(data != "{}"){var termMap = eval("("+data+")");        $.each(termMap,function(key,value) {         toast(value);         if(value=='操作成功'){ refetchEvents: $("#calendar").fullCalendar("refetchEvents");                  }else{         revertFunc();//操作失败可以复原         }        });}})            },             //月视图中，点击某一天的处理            dayClick: function(date, allDay, jsEvent, view) {                            var d = date.getDate();                var m = date.getMonth();                var y = date.getFullYear();                //完整日期                var fullDate = y + '-' + doHandleMonthPrj(m+1) + '-' + doHandleDayPrj(d);                if(nowy>y){                toast("日期超限");                return false;                }else if(nowy>=y&&nowm>m){                toast("日期超限");                return false;                } else if(nowm>=m&&nowd>d){                toast("日期超限");                return false;                }               viewCrmDetail1(fullDate);//添加窗体            },             //事件点击处理            eventClick: function(calEvent, jsEvent, view) {                var date = calEvent.start;                var d = date.getDate();                var m = date.getMonth();                var y = date.getFullYear();                //完整日期                var fullDate = y + '-' + doHandleMonthPrj(m+1) + '-' + doHandleDayPrj(d);                /* if(nowy>y){                toast("日期超限");                return false;                }else if(nowy>=y&&nowm>m){                toast("日期超限");                return false;                } else if(nowm>=m&&nowd>d){                toast("日期超限");                return false;                }*/              viewCrmDetail(fullDate,calEvent.id);                          },            //当鼠标悬停在一个事件上触发此操作            eventMouseover:function( event, jsEvent, view ) {            //获得选中信息            var title="日程主题: "+event.title;            var customername="对应客户："+event.customername;            var start=event.start;            var y=start.getFullYear();            var m=start.getMonth();            var d=start.getDate();            var h=start.getHours();            var f=start.getMinutes();            start="开始时间: "+y+"-"+(m+1)+"-"+d+" "+h+":"+f;            var contents="日程明细："+event.content;            var smsAlertMobile=event.smsAlertMobile;            var smsAlertStrategy=event.smsAlertStrategy;            var str="";            if(smsAlertStrategy==1){            str+="到时间提醒              手机:"+smsAlertMobile;            }            if(smsAlertStrategy==2){            str+="提前10分钟             手机:"+smsAlertMobile;            }            if(smsAlertStrategy==3){            str+="提前半小时             手机:"+smsAlertMobile;            }            if(smsAlertStrategy==3){            str+="提前一小时             手机:"+smsAlertMobile;            }            //显示            showTip(title,customername,start,contents,str);                         },//当鼠标从一个事件上移开触发此操作             eventMouseout:function( event, jsEvent, view ) {             //关闭弹出层         closeTip();              },         //绑定时间源，也就是为你的日历动态填充数据events: function(start, end, callback) {·//异步获取数据        $.getJSON(pro+"?date="+(new Date()).valueOf(),//date参数 防止ajax数据缓存{"start":Math.round(start.getTime() / 1000),"end":Math.round(end.getTime() / 1000)},function(data){  var events = [];if(data != "{}"){var termMap = eval("("+data+")");        $.each(termMap,function(key,value) {         events.push(value);        });}//将获取的数据添加到callback(events);});    },loading: function(bool) {//正在处理数据提示if (bool) $('#loading').show();else $('#loading').hide();}});});

页面只需要一个div即可

<div id='calendar'></div>

页面效果

插件下载地址