<%@ page language="C#" autoeventwireup="true" inherits="user_Booking_BookingRoomSelect, ALL" enableEventValidation="false" %>


<%@ Register Src="~/user/MyHeader.ascx" TagPrefix="uc2" TagName="MyHeader" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>预订会议</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="/control/plugin/bootstrap3/css/bootstrap.min.css" rel="stylesheet" />
    <script src="/control/js/jquery.js"></script>
    <script src="/control/plugin/bootstrap3/js/bootstrap.min.js"></script>
    <link href="/user/css/style.css?v=2" rel="stylesheet" />

    <link href="/control/plugin/fullcalendar/fullcalendar.css" rel="stylesheet" />
    <script src="/control/plugin/fullcalendar/lib/moment.min.js"></script>
    <script src='/control/plugin/fullcalendar/fullcalendar.js'></script>
    <script src="/control/plugin/fullcalendar/locale/zh-cn.js"></script>
    <style>
        #room .list-group-item {
            font-size: 18px;
        }
    </style>
</head>
<body>
    <uc2:MyHeader runat="server" ID="MyHeader1" />
    <div class=" container-fluid">

        <div class="row">
            <div class="col-lg-12 ">
                <ul class="nav nav-tabs" role="tablist">
                    <li role="presentation"><a href="BookingTimeSelect.aspx">按时间预订会议室</a></li>
                    <li role="presentation" class="active"><a href="BookingRoomSelect.aspx">按会议室预订时间</a></li>
                </ul>
            </div>
        </div>

        <div class="panel ">
            <div class="panel-body">
                <div class="row">
                    <div class="col-lg-3 col-md-3">
                        <div id="room" class="list-group">
                            <asp:Repeater ID="rptRoom" runat="server">
                                <ItemTemplate>
                                    <a href="BookingRoomSelect.aspx?room=<%#Eval("r_id") %>" id="<%#Eval("r_id") %>" class="list-group-item"><%#Eval("r_name") %></a>
                                </ItemTemplate>
                            </asp:Repeater>
                        </div>

                    </div>
                    <div class="col-lg-9 col-md-9">



                        <script type="text/javascript">
                            $(function () {
                                var DefaultRoom = '<%=DefaultRoom %>';

                                $("#" + DefaultRoom).addClass("active");

                                $('#calendar').fullCalendar({
                                    header: {
                                        left: 'prev,next today',
                                        center: 'title',
                                        right: 'month,agendaWeek,agendaDay'
                                    },
                                    defaultView: 'agendaWeek',
                                    defaultDate: '<%=DefaultDate.ToString("yyyy-MM-dd")%>',
                                    minTime: '06:00:00',
                                    defaultTimedEventDuration: '01:00:00',
                                    selectable: true,
                                    selectHelper: true,
                                    selectOverlap: false,
                                    height: 760,
                                    select: function (start, end) {
                                        var dStart = new Date(start);
                                        var dEnd = new Date(end);
                                        var date = start.format().substring(0, 10);
                                        var duration = (dEnd.getTime() - dStart.getTime()) / 60000;
                                        if (duration > 720) {
                                            duration = 60;
                                        }
                                        var dts = dStart.getFullYear() + "-" + (dStart.getMonth() + 1) + "-" + dStart.getDate() + " " + dStart.getHours() + ":" + dStart.getMinutes();
                                        location.href = "Booking.aspx?start=" + dts + "&room=" + DefaultRoom + "&duration=" + duration;
                                        // 弹框选择会议类型
                                    },
                                    eventClick: function (calEvent, jsEvent, view) {
                                        location.href = "/user/Meeting/MeetingDetails.aspx?id=" + calEvent.id;
                                    },
                                    viewRender: function (view, element) {
                                        document.cookie = "lbview=" + view.name + "; path=/";
                                    },
                                    dayClick: function (date, jsEvent, view, resourceObj) {
                                        console.log('Date: ' + date.format());
                                    },
                                    businessHours: {
                                        start: '<%=startTime %>',
                                        end: '<%=endTime %>',
                                        dow: [1, 2, 3, 4, 5, 6, 0]
                                    },
                                    timezone: 'local',
                                    editable: false,
                                    eventLimit: true, // allow "more" link when too many events
                                    events: {
                                        url: '/user/UseAjax.ashx',
                                        type: 'POST',
                                        data: {
                                            rid: DefaultRoom,
                                            tv: true
                                        }
                                    }
                                });
                            });

                            function getDateString(date) {
                                var month = date.getMonth() + 1;
                                if (month < 10) {
                                    month = "0" + month;
                                }
                                var day = date.getDate();
                                if (day < 10) {
                                    day = "0" + day;
                                }
                                var hours = date.getHours();
                                if (hours < 10) {
                                    hours = "0" + hours;
                                }
                                var Minutes = date.getMinutes();
                                if (Minutes < 10) {
                                    Minutes = "0" + Minutes;
                                }
                                return date.getFullYear() + "/" + month + "/" + day + " " + hours + ":" + Minutes;
                            }

                        </script>
                        <div class="form-group">
                            <div id="calendar"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</body>
</html>
