带过滤器的DHTMLX Sceduler自定义年度视图

时间:2017-06-20 10:45:41

标签: javascript dhtmlx dhtmlx-scheduler

我已将4个自定义标签(标签)添加到调度程序中,如下所示:

<div class="dhx_cal_tab a-tab" name="A_tab" style="right:50px;"></div>
<div class="dhx_cal_tab b-tab" name="B_tab" style="right:50px;"></div>
<div class="dhx_cal_tab c-tab" name="C_tab" style="right:50px;"></div>
<div class="dhx_cal_tab d-tab" name="D_tab" style="right:50px;"></div>

并且像这样迷上了他们:

 scheduler.locale.labels.A_tab = "A"
 scheduler.locale.labels.B_tab = "B"
 scheduler.locale.labels.C_tab = "C"
 scheduler.locale.labels.D_tab = "D"

它们在标题中显示如下:

schedule layou

我想要做的是能够点击这些按钮中的每一个,这将显示仅包含属性的事件的年视图,比如A,B,C或D的type - 取决于在年视图中选择了哪个视图。

以下是我的第一次尝试:

scheduler.attachEvent("onTemplatesReady",function(){
            scheduler.date.A_start = scheduler.date.B_start = scheduler.date.C_start = scheduler.date.D_start  = function(e){return e.setMonth(0),this.month_start(e)};
      scheduler.date.get_A_end = scheduler.date.add_B = scheduler.date.add_C = scheduler.date.add_D = function(date,inc){
        return scheduler.date.add(date,inc*1,"year");
      }
            scheduler.date.add_A = scheduler.date.add_B = scheduler.date.add_C = scheduler.date.add_D = function(start_date){
          return scheduler.date.add(start_date,1,"year");
      }
      scheduler.templates.A_date = scheduler.templates.B_date = scheduler.templates.C_date = scheduler.templates.D_date = scheduler.templates.year_date;
      scheduler.templates.A_scale_date = scheduler.templates.B_scale_date = scheduler.templates.C_scale_date = scheduler.templates.D_scale_date = scheduler.templates.year_scale_date;

            scheduler.filter_year = function(id, event) {
                // display event only if its type is set to the mode of the
                if (event.type=== scheduler.getState().mode) {
                    return true;
                }
                // default, do not display event
                return false;
            };
        });

但是,当我点击其中一个标签时,我会收到以下信息:custom view

这里有3个问题:

  1. 该视图看起来是月视图的克隆,而不是年视图
  2. 过滤器显然不起作用,因为所有事件都被显示(我只想要B类型的事件(与Tab相同的颜色)
  3. A标签显示与其他视图不同的视图:
  4. A tab showing different view

    我忘记了吗?感谢任何帮助以获得此视图!

    另外我知道我可以在调度程序之外移动过滤器的控件我真的想保留调度程序中的选项卡,因为整体外观最好而不是单独选择。

1 个答案:

答案 0 :(得分:2)

年视图没有构造函数方法,因此每个调度程序只能有一个年视图。 它也不能通过日期函数实现,它们只定义每日视图https://docs.dhtmlx.com/scheduler/custom_views.html#stepbystepexample

你可以做的是

  • 向标题添加标签,就像您已经做过的那样
  • 更改标签行为 - 您可以将filter_year设置为&#34; year&#34;而不是切换到自定义视图。模式,应该做你需要的 - 你将在年视图中过滤任务。

这是一个有效的演示: http://snippet.dhtmlx.com/aa08a8249