工作日志5-2_transport:{read}-CSDN博客

本文链接：https://blog.csdn.net/WangLu_lulu/article/details/45440119

工作日志5-2

今天主要是根据kendo研究两个页面rcgl.jsp和ldgl.jsp：

rcgl.jsp作为日程管理的首页，首先由下拉列表来选择查看的页面，点击某个时间段可以新建日程。

            $("#people :checkbox").change(function(e) {
                var checked = $.map($("#people :checked"), function(checkbox) {
                    return parseInt($(checkbox).val());
                });

var scheduler = $("#scheduler").data("kendoScheduler");

                scheduler.dataSource.filter({
                    operator: function(task) {
                        return $.inArray(task.ownerId, checked) >= 0;
                    }
                });
            });
        });
        </script>
<style>

.k-nav-current > .k-link span + span {
    max-width: 200px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: top;
}

</style>

</body>

领导日程查看界面的难点在于以timeline形式显示领导的日程，可以在同一时刻查看多位领导的日程，具体细节还得根据具体需求进行修改。

ldrc.jsp

<body>
<div id="example" class="k-content">
    <div id="scheduler"></div>
</div>
<script>
    $(function () {
        $("#scheduler").kendoScheduler({
            date: new Date("2015/4/13"),
            startTime: new Date("2015/4/13 07:00 AM"),
            eventHeight: 50,
            majorTick: 60,
            views: [
                "timeline",
                "timelineWeek",
                "timelineWorkWeek",
                {
                    type: "timelineMonth",
                    startTime: new Date("2013/6/13 00:00 AM"),
                    majorTick: 1440
                }
            ],
            timezone: "Etc/UTC",
            dataSource: {
                batch: true,
                transport: {
                    read: {
                        url: "http://demos.telerik.com/kendo-ui/service/meetings",
                        dataType: "jsonp"
                    },
                    update: {
                        url: "http://demos.telerik.com/kendo-ui/service/meetings/update",
                        dataType: "jsonp"
                    },
     create: {
                        url: "http://demos.telerik.com/kendo-ui/service/meetings/create",
                        dataType: "jsonp"
                    },
                    destroy: {
                        url: "http://demos.telerik.com/kendo-ui/service/meetings/destroy",
                        dataType: "jsonp"
                    },
                    parameterMap: function (options, operation) {
                        if (operation !== "read" && options.models) {
                            return { models: kendo.stringify(options.models) };
                        }
                    }
                },
                schema: {
                    model: {
                        id: "meetingID",
                        fields: {
                            meetingID: { from: "MeetingID", type: "number" },
                            title: { from: "Title", defaultValue: "No title", validation: { required: true } },
                            start: { type: "date", from: "Start" },
                            end: { type: "date", from: "End" },
                            startTimezone: { from: "StartTimezone" },
                            endTimezone: { from: "EndTimezone" },
                            description: { from: "Description" },
                            recurrenceId: { from: "RecurrenceID" },
                            recurrenceRule: { from: "RecurrenceRule" },
                            recurrenceException: { from: "RecurrenceException" },
                            roomId: { from: "RoomID", nullable: true },
                            attendees: { from: "Attendees", nullable: true },
                            isAllDay: { type: "boolean", from: "IsAllDay" }
                        }
                    }
                }
            },
            group: {
                resources: ["Rooms", "Attendees"],
                orientation: "vertical"
            },
            resources: [
                {
                    field: "roomId",
                    name: "Rooms",
                    dataSource: [
                        { text: "Meeting Room 101", value: 1, color: "#6eb3fa" },
                        { text: "Meeting Room 201", value: 2, color: "#f58a8a" }
                    ],
                    title: "Room"
                },
                {
                    field: "attendees",
                    name: "Attendees",
                    dataSource: [
                        { text: "Alex", value: 1, color: "#f8a398" },
                        { text: "Bob", value: 2, color: "#51a0ed" },
                        { text: "Charlie", value: 3, color: "#56ca85" }
                    ],
                    multiple: true,
                    title: "Attendees"
                }
            ]
        });
    });
</script>

</body>