Advanced grouping and empty line

5 posts, 0 answers
  1. Gonzalo
    Gonzalo avatar
    3 posts
    Member since:
    Sep 2015

    Posted 06 Dec 2016 Link to this post

    Hi!

    I'm using a scheduler in cshtml:

    @(Html.Kendo().Scheduler<ITSV6.Areas.CoreApp.Models.SchedulerModel>()
                .Name("scheduler")
                .Date(new DateTime(2013, 6, 13))
                .StartTime(new DateTime(2013, 6, 13, 7, 00, 00))
                .MajorTick(60)
                .Views(views =>
                {
                    views.TimelineView(timeline => timeline.EventHeight(50));
                    views.TimelineWeekView(timeline => timeline.EventHeight(50));
                    views.TimelineWorkWeekView(timeline => timeline.EventHeight(50));
                    views.TimelineMonthView(timeline =>
                    {
                        timeline.StartTime(new DateTime(2013, 6, 13, 00, 00, 00));
                        timeline.EndTime(new DateTime(2013, 6, 13, 00, 00, 00));
                        timeline.MajorTick(1440);
                        timeline.EventHeight(50);
                    });
                })
                .Timezone("Etc/UTC")
                .Group(group => group.Resources("SchedulerName", "Employees").Orientation(SchedulerGroupOrientation.Vertical))
                .Resources(resource =>
                {
                    resource.Add(m => m.Type)
                        .Title("Type")
                        .Name("Type")
                        .DataTextField("Text")
                        .DataValueField("Value")
                        .DataColorField("Color")
                        .BindTo(new[] {
                        new { Text = "Pay Code", Value = 1},
                        new { Text = "Day Off", Value = 2},
                        new { Text = "Shift", Value = 2}
                        });
                    resource.Add(m => m.SchedulerName)
                        .Title("Scheduler Group")
                        .Name("SchedulerName")
                        .DataTextField("sg_name")
                        .DataValueField("sg_group")
                        .DataColorField("Color")
                        .DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action("getScheduleGroups", "Scheduler");
                            });
                        });
     
                    resource.Add(m => m.Employees)
                        .Title("Employees")
                        .Name("Employees")
                        .Multiple(true)
                        .DataTextField("FullNM")
                        .DataValueField("emp_id")
                        .DataColorField("Color")
                        .DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action("GetEmployees", "Scheduler");
                            });
                        });
                })
        .DataSource(d => d
                .Model(m =>
                {
                    m.Id(f => f.SchedulerId);
                    m.Field(f => f.Title).DefaultValue("No title");
                    m.RecurrenceId(f => f.RecurrenceId);
                    m.Field(f => f.Title).DefaultValue("No title");
                })
                    //.Read("Read", "Scheduler")
                    .Create("Create", "Scheduler")
                    .Destroy("Destroy", "Scheduler")
                    .Update("Update", "Scheduler")
        )

     

    The "Employee" and the "RuleName" are associated by a field called "schedulerId".

    I need to group "Employees" with a "SchedulerName" only if the Employee is associated to the SchedulerName just like the attached image.

    Also, I need to add an empty line as "Empty Template" for add a new "Schedule Rule" like the first line in the attached image.

     

    Its posible to do that with the scheduler?

     

    Thanks a lot!

    Best regards!

  2. Gonzalo
    Gonzalo avatar
    3 posts
    Member since:
    Sep 2015

    Posted 07 Dec 2016 in reply to Gonzalo Link to this post

    Sorry the image wasn't attach.

    I'm attaching it now.

    Regards.

  3. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    466 posts

    Posted 08 Dec 2016 Link to this post

    Hello Gonzalo,

    I am not sure if I fully understand your requirements. As far as I can see from your implementation, you are grouping the Appointments (Events) by SchedulerName and by Employees resources. However, only some of the Employees are associated with a given SchedulerName. Therefore you would like to display for each Scheduler only those Employees that are available for it. If this is your requirement, I am afraid that the Scheduler does not offer out-of-the-box the possibility to configure that restriction.

    Also, I am not quite sure, which is the line, that you need to add to the Scheduler. Generally, you will be able to achieve such customization, by manually adding the required HTML to your Scheduler, by handling the DataBound event.

    Regards,
    Veselin Tsvetanov
    Telerik by Progress
    Telerik UI for ASP.NET MVC is ready for Visual Studio 2017 RC! Learn more.
  4. Gonzalo
    Gonzalo avatar
    3 posts
    Member since:
    Sep 2015

    Posted 12 Dec 2016 Link to this post

    Hi Vaselin,

    I tryed to extend the TimeLineMonth view to acomplish my requiriment and I did this:

    <script>
     
        kendo.ui.TimelineMonthView = kendo.ui.TimelineMonthView.extend({
     
            _createColumnsLayout: function (resources, inner) {
                return customCreateLayoutConfiguration("columns", resources, inner, null);
            },
     
            _createRowsLayout: function (resources, inner) {
                return customCreateLayoutConfiguration("rows", resources, inner, null);
            },
     
        });
     
        function customCreateLayoutConfiguration(name, resources, inner, groupText) {
            var resource = resources[0];
            var resource2 = resources[1];
            if (resource) {
                var configuration = [];
     
                var data = resource.dataSource.view();
                var data2 = resource2.dataSource.view();
     
                for (var dataIndex = 0; dataIndex < data.length; dataIndex++) {
                    var defaultText = kendo.htmlEncode(kendo.getter(resource.dataTextField)(data[dataIndex]));
                    console.log("room: " + defaultText);
                    var obj1 = {
                        text: defaultText,
                        className: "k-slot-cell"
                    };
                    var rows = [];
     
                    for (var dataIndex2 = 0 ; dataIndex2 < data2.length ; dataIndex2++) {
                        var defaultText2 = kendo.htmlEncode(kendo.getter(resource2.dataTextField)(data2[dataIndex2]));
                        console.log("Group: " + defaultText + " Emp: " + defaultText2);
                        var remove = defaultText == "L-S 8:00am-5:00pm" && defaultText2 == "Figueroa Colon, Madeline  ";
                        if (!remove) {
                            var obj2 = {
                                text: defaultText2,
                                className: "k-slot-cell"
                            };
     
                            /*if (remove) {
                                obj2 = {
                                    text: defaultText2,
                                    className: "hide"
                                };
                                console.log("invalid employee: " + defaultText2);
                            }*/
     
                            rows.push(obj2);
                        }
     
                    }
                    obj1[name] = rows;
                    configuration.push(obj1);
                }
                return configuration;
            }
            return inner;
        }
     
    <script>

     

    Basically, I'm not put the "Employee" row on the "Schedule Group" object if it matching the rule on the code.

    But the result is not the expected, check attached img.

    Is a way to fix this?

    Regards and thank you!

    Gonzalo.

     

  5. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    466 posts

    Posted 13 Dec 2016 Link to this post

    Hello Gonzalo,

    Creating a Scheduler that renders individual Resources per appointment would involve considerable advanced customization of the widget. Therefore, I need to confirm that explaining how the source code works in the context of this scenario is in the scope of our Professional Services team, so I am not able to comment on that as part of our standard support service.  Let me know if you are interested in cooperating with our colleagues on this task and I will arrange someone to contact you directly.

    Regards,
    Veselin Tsvetanov
    Telerik by Progress
    Telerik UI for ASP.NET MVC is ready for Visual Studio 2017 RC! Learn more.
Back to Top