<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp"%>
<html>
<head>
	<title>工作日历管理</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <link href='${ctxStatic}/fullcalendar1/fullcalendar.css' rel='stylesheet' />
    <link href='${ctxStatic}/fullcalendar1/fullcalendar.print.css' rel='stylesheet' media='print' />
    <link rel="stylesheet" type="text/css" href="${ctxStatic}/fullcalendar/css/fancybox.css">
    <style>
        .daylist{
            line-height: 25px;
        }
    </style>
    <script src='${ctxStatic}/fullcalendar1/js/jquery.min.js'></script>
    <script src='${ctxStatic}/fullcalendar1/js/jquery-ui.custom.min.js'></script>
    <script src='${ctxStatic}/fullcalendar1/fullcalendar.js'></script>
    <script src='${ctxStatic}/fullcalendar/js/jquery.fancybox-1.3.1.pack.js'></script>
    <script type="text/javascript">
        /** 当天信息初始化 **/
        $(function(){
            var dayDate = new Date();
            var d = $.fullCalendar.formatDate(dayDate,"dddd");
            var m = $.fullCalendar.formatDate(dayDate,"yyyy年MM月dd日");
            var lunarDate = lunar(dayDate);
            $(".alm_date").html(m + "&nbsp;" + d);
            $(".today_date").html(dayDate.getDate())
            $("#alm_cnD").html("农历"+ lunarDate.lMonth + "月" + lunarDate.lDate);
            $("#alm_cnY").html(lunarDate.gzYear+"年&nbsp;"+lunarDate.gzMonth+"月&nbsp;"+lunarDate.gzDate+"日");
            $("#alm_cnA").html("【"+lunarDate.animal+"年】");
            var fes = lunarDate.festival();
            if(fes.length>0){
                $(".alm_lunar_date").html($.trim(lunarDate.festival()[0].desc));
                $(".alm_lunar_date").show();
            }else{
                $(".alm_lunar_date").hide();
            }

        });
        /** calendar配置 **/
        $(document).ready(
            function() {
                var date = new Date();
                var d = date.getDate();
                var m = date.getMonth();
                var y = date.getFullYear();
                $("#calendar").fullCalendar(
                    {
                        header : {
                            left : 'prevYear,nextYear',
                            center : 'title',
                            right : 'prev,next today'
                        },
                        buttonText: {
                            prev: "<span class='fc-text-arrow'>&lsaquo;上个月</span>",
                            next: "<span class='fc-text-arrow'>下个月&rsaquo;</span>",
                            prevYear: "<span class='fc-text-arrow'>&laquo;上一年</span>",
                            nextYear: "<span class='fc-text-arrow'>下一年&raquo;</span>"
                        },
                        editable : false,
                        events: function(start,end,callback) {
                            var fcsYear = $("#fcs_date_year").val();
                            var fcsMonth = parseInt($("#fcs_date_month").val())+1;
                            if(fcsMonth<10){
                                fcsMonth = "0"+fcsMonth;
                            }
                            var date = fcsYear+"-"+fcsMonth+"-01";
                            // console.log(date);
                            $.ajax({
                                url: '${ctx}/workcalendar/workCalendar/list',
                                dataType: 'json',
                                type:'post',
                                data: {
                                    'startDate': date
                                },
                                success: function(json) { // 获取当前月的数据
                                    var events = [];
                                    if (json.success) {
                                        $.each(json.body.list,function(i,c) {
                                            var backCo;
                                            if(c.title.indexOf("我的工作") != -1){
                                                backCo = 'pink';
                                            }else if(c.title.indexOf("我的管理") != -1){
                                                backCo = 'skyblue';
                                            }
                                            events.push({
                                                title: c.title+"("+c.count+")",
                                                start: c.start, // will be parsed
                                                end: c.end,
                                                backgroundColor : backCo
                                            });
                                        });
                                    }
                                    callback(events);
                                }
                            });
                        },
                        dayClick : function(dayDate, allDay, jsEvent, view) { //点击单元格事件
                            var d = $.fullCalendar.formatDate(dayDate,"dddd");
                            var m = $.fullCalendar.formatDate(dayDate,"yyyy年MM月dd日");
                            var lunarDate = lunar(dayDate);
                            $(".alm_date").html(m + "&nbsp;" + d);
                            $(".today_date").html(dayDate.getDate())
                            $("#alm_cnD").html("农历"+ lunarDate.lMonth + "月" + lunarDate.lDate);
                            $("#alm_cnY").html(lunarDate.gzYear+"年&nbsp;"+lunarDate.gzMonth+"月&nbsp;"+lunarDate.gzDate+"日");
                            $("#alm_cnA").html("【"+lunarDate.animal+"年】");
                            var fes = lunarDate.festival();
                            if(fes.length>0){
                                $(".alm_lunar_date").html($.trim(lunarDate.festival()[0].desc));
                                $(".alm_lunar_date").show();
                            }else{
                                $(".alm_lunar_date").hide();
                            }
                            // 当天则显示“当天”标识
                            var now = new Date();
                            if (now.getDate() == dayDate.getDate() && now.getMonth() == dayDate.getMonth() && now.getFullYear() == dayDate.getFullYear()){
                                $(".today_icon").show();
                            }else{
                                $(".today_icon").hide();
                            }
                            now.setMilliseconds(0);
                            now.setSeconds(0);
                            now.setMinutes(0);
                            now.setHours(0);
                            if(dayDate>=now){
                            openDialog("新增工作日历","${ctx}/workcalendar/workCalendar/form","95%","95%","");
                            }
                        },
                        loading : function(bool) {
                            if (bool)
                                $("#msgTopTipWrapper").show();
                            else
                                $("#msgTopTipWrapper").fadeOut();
                        },
                        eventClick: function(calEvent, jsEvent, view) {
                            var formatDate = $.fullCalendar.formatDate(calEvent.start,('yyyy-MM-dd'));
                            if(calEvent.title.indexOf("主题") != -1){
                                $.fancybox({
                                    'type':'ajax',
                                    'href':'${ctx}/workcalendar/workCalendar/dayList?startDate='+formatDate+'&tmp='+ new Date().getTime(),
                                    // 'autoDimensions':true,
                                    'scrolling':'no',
                                });
                                return;
                            }

                            var time=calEvent.start;
                            var year = time.getFullYear();
                            var month =(time.getMonth() + 1).toString();
                            var day = (time.getDate()).toString();
                            if (month.length == 1) {
                                month = "0" + month;
                            }
                            if (day.length == 1) {
                                day = "0" + day;
                            }
                            var dateTime = year + "-" + month + "-" + day;
                            if(calEvent.title.indexOf("我的工作")!=-1){
                                openDialogView("查看我的工作","${ctx}/work/report/workReport/reportlist?start=" + dateTime + "&flat=1","95%","95%","");
                            }else{
                                openDialogView("查看我的管理","${ctx}/work/report/workReport/reportlist?start=" + dateTime ,"95%","95%","");
                            }
                        }
                    });
            });

        /** 绑定事件到日期下拉框 **/
        $(function(){
            $("#fc-dateSelect").delegate("select","change",function(){
                var fcsYear = $("#fcs_date_year").val();
                var fcsMonth = $("#fcs_date_month").val();
                $("#calendar").fullCalendar('gotoDate', fcsYear, fcsMonth);
            });
        });
        //打开对话框(查看)
        function openDialogView(title,url,width,height,target){
            if(navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)){//如果是移动端，就使用自适应大小弹窗
                width='auto';
                height='auto';
            }else{//如果是PC端，根据用户设置的width和height显示。
            }
            top.layer.open({
                type: 2,
                skin: 'one-btn',
                area: [width, height],
                title: title,
                maxmin: true, //开启最大化最小化按钮
                content: url ,
                btn: ['关闭'],
                cancel: function(index){
                }
            });
        }
        function openDialog(title,url,width,height,target) {

            if (navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)) {//如果是移动端，就使用自适应大小弹窗
                width = 'auto';
                height = 'auto';
            } else {//如果是PC端，根据用户设置的width和height显示。

            }

            top.layer.open({
                type: 2,
                area: [width, height],
                title: title,
                maxmin: true, //开启最大化最小化按钮
                content: url,
                skin: 'three-btns',
                btn: ['提交', '关闭'],
                yes: function (index, layero) {
                    var body = top.layer.getChildFrame('body', index);
                    var iframeWin = layero.find('iframe')[0]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                    var inputForm = body.find('#inputForm');
                    var top_iframe;
                    if (target) {
                        top_iframe = target;//如果指定了iframe，则在改frame中跳转
                    } else {
                        top_iframe = top.getActiveTab().attr("name");//获取当前active的tab的iframe
                    }
                    inputForm.attr("target", top_iframe);//表单提交成功后，从服务器返回的url在当前tab中展示

                    if (iframeWin.contentWindow.doSubmit()) {
                        // top.layer.close(index);//关闭对话框。
                        setTimeout(function () {
                            top.layer.close(index)
                        }, 100);//延时0.1秒，对应360 7.1版本bug
                    }

                },
                btn2: function (index) {
                }
            });
        }
        $(function() {
            // var treve = $('.fc-content').children().children().eq(1).children().eq(1).children();
            // var newArr = [];
            // for(var i=0;i<treve.length;i++){
            //     newArr.push(treve[i]);
            //     // console.log($(newArr[i]).children().children().children().children());
            // }
            console.log($('html').css({'overflow-y':'none','overflow-x':'none'}))
            $('#fancybox-outer').height(400).css({'overflow-y':'none'});

        });

    </script>
    <style>

        body {
            margin-top: 40px;
            text-align: center;
            font-size: 14px;
            font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
        }

        .calendarWrapper {
            width: 1190px;
            margin: 0 auto 15px;
        }

        #calendar {
            width: 885px;
            background: #fff;
            padding: 15px 10px;
        }

        .calendarWrapper .rightSidePanel {
            width: 240px;
            padding: 0px 15px;
        }
        .dib{display: inline-block;}
        .fr{float: right;}

    </style>
</head>
<body>
<sys:message content="${message}"/>
<div id="msgTopTipWrapper" style="display:none">
    <div id="msgTopTip">
        <span><i class="iconTip"></i>正在载入日历数据...</span>
    </div>
</div>
<div class="calendarWrapper">
    <div class="rightSidePanel mb50 fr">
        <div id="div_day_detail" class="h_calendar_alm">
            <div class="alm_date"></div>
            <div class="alm_content nofestival">
                <div class="today_icon"></div>
                <div class="today_date"></div>
                <p id="alm_cnD"></p>
                <p id="alm_cnY"></p>
                <p id="alm_cnA"></p>
                <div class="alm_lunar_date"></div>
            </div>
        </div>
    </div>
    <div id="calendar" class="dib"></div>
</div>
</body>
</html>
