跳转到主要内容

addMarkedTimespan

Description​

标记日期，并且在某些设置下，可以阻止这些日期（允许对限制的边界应用自定义样式）

addMarkedTimespan: (config: any) => number

Parameters​

  • config - (required) object - 定义要标记或阻止的时间段的配置对象

Returns​

  • id - (number) - 添加的时间段的ID

Example​

//标记日期
scheduler.addMarkedTimespan({  
    days:  5,               // 标记每个星期五
    zones: "fullday",       // 标记全天
    css:   "gray_section"   // 应用的CSS类
});
scheduler.updateView();

//标记并阻止日期
scheduler.addMarkedTimespan({  
    days:  5,
    zones: "fullday",
    css:   "gray_section",
    type:  "dhx_time_block" //这是一个固定值
});
scheduler.updateView();

Details​

此方法自版本3.5起可用。

注释

该方法需要启用limit插件。

注释

请注意，调用此方法后，标记（阻止）不会立即生效。您需要调用 updateView 来应用更改。


配置对象属性​

配置对象可以包含以下属性:

属性

描述

start_date 定义限制开始时间的Date对象
//阻止从2012年5月3日开始创建事件，直到'end_date' 
start_date:new Date(2012,4,3)
end_date 定义限制结束时间的Date对象
//阻止从'start_date'直到2012年9月3日创建事件
end_date:new Date(2012,8,3)
days 要限制的天数
days:[0, 2, 6] //限制星期日、星期二和星期六
days:"fullweek" //限制整周
days:new Date(2012,6,1) //阻止2012年7月1日
zones 要限制的时间段（以分钟为单位）
//两个限制区间：04:00-08:00 和 12:00-15:00
zones:[4*60,8*60,12*60,15*60] 
zones:"fullday" //限制全天
css 应用的CSS类名
css:"gray" //绘制一个应用了'gray' CSS类的DIV
html 在标记范围内显示的HTML内容
//在标记范围上绘制一个带有此文本的DIV  
html:"<b>Blocked</b>"
type 指定时间段类型。设置为 'dhx_time_block' 则应用阻止。其他值仅标记时间段，不阻止。
type: "dhx_time_block" //时间段将被标记并阻止
invert_zones 指示是否应反转 'zones' 中设置的时间段（默认为false）
//结果是两个限制区间：00:00-08:00 和 17:00-24:00
zones: [8*60, 17*60], invert_zones: true 
//结果是两个限制区间：00:00-08:00 和 17:00-24:00
zones: [0, 8*60, 17*60, 24*60], invert_zones: false
sections 限制阻止仅针对特定视图中的特定条目。
日期仅在指定视图中被阻止。
//仅阻止Unit视图中id=5的条目日期，
//以及Timeline视图中id为2和3的条目日期
sections: { unit: 5, timeline: [2,3]}

配置属性的可接受组合​

注释

请注意，days 和 zones 必须一起使用，start_date 和 end_date 也必须成对使用来定义阻止区间。这些配对不能以其他方式混合。 例如，不能将 zones 与 start_date 组合，也不能同时使用 days 和 start_date 及 end_date。

因此，有两种有效的属性组合:

属性组合

示例

  • days
  • zones
  • invert_zones
  • css
  • html
  • type
  • sections
var config ={
    days:  1, 
    zones: [9*60, 15*60], 
    css: "cssClassName", 
    sections: {
         unit: 5
    }
}

  • start_date
  • end_date
  • css
  • html
  • type
  • sections
var config ={
    start_date: new Date(2013,7,13),
    end_date:   new Date(2013,7,14),
    css: "cssClassName",
    sections: {
         unit: 5
    }
}

markTimespan() 和 addMarkedTimespan() 的比较​

addMarkedTimespan

markTimespan

需要调用 updateView 来渲染时间段的DIV

自动绘制时间段的DIV

时间段会永久存在

应用内部任何更新后，时间段会立即隐藏

返回配置时间段的ID

返回一个DIV元素或DIV数组

Need help?
Got a question about the documentation? Reach out to our technical support team for help and guidance. For custom component solutions, visit the Services page.
Need more help?Contact Support