diff --git a/docs/laydate/detail/options.md b/docs/laydate/detail/options.md
index 1b9e4aba..a8905729 100644
--- a/docs/laydate/detail/options.md
+++ b/docs/laydate/detail/options.md
@@ -599,6 +599,8 @@ theme: ['#16baaa', '#16b777']
+- object 类型
+
```
mark: {
'0-10-14': '生日', //每年每月的某一天
@@ -609,6 +611,27 @@ mark: {
前缀 `0-` 即代表每年,`0-0-` 即代表每年每月。
+- function 类型 2.9.9+
+
+```
+mark: function (ymd, render) {
+ var y = ymd[0];
+ var m = ymd[1];
+ var d = ymd[2];
+
+ // 字符串
+ if (m === 6 && d === 1) return render('儿童节');
+
+ // 对象
+ render ({
+ '0-10-14': '生日',
+ '0-0-15': '中旬',
+ '2024-03-20': 'v2',
+ '2024-03-31': '月底',
+ });
+}
+```
+
效果详见: [#示例](#demo-mark)
@@ -625,9 +648,11 @@ mark: {
-用于标注节假日及补班日。值是一个二维数组,如:
+用于标注节假日及补班日。
+- 若为 array 类型,值是一个二维数组,如:
+
```
holidays: [
// 2023 年的节假日
@@ -637,6 +662,27 @@ holidays: [
]
```
+- 若为 function 类型 2.9.9+
+
+```
+holidays: function (ymd, render) {
+ var y = ymd[0];
+ var m = ymd[1];
+ var d = ymd[2];
+
+ // 字符串
+ if (y === 2023 && m === 6) {
+ render('holidays'); // 'holidays'/'workdays'
+ // 数组
+ } else if (y === 2024) {
+ render([
+ ['2024-03-01', '2024-03-02', '2024-03-03'],
+ ['2024-03-6', '2024-03-25'],
+ ]);
+ }
+}
+```
+
相关日期值可详细参考国家每年公布的法定节假日安排
效果详见: [#示例](#demo-mark)
diff --git a/src/css/modules/laydate.css b/src/css/modules/laydate.css
index b6884b44..6bae4eb3 100644
--- a/src/css/modules/laydate.css
+++ b/src/css/modules/laydate.css
@@ -61,7 +61,7 @@ html #layuicss-laydate{display: none; position: absolute; width: 1989px;}
.laydate-day-mark::after{position: absolute; content:''; right: 2px; top: 2px; width: 5px; height: 5px; border-radius: 50%;}
.laydate-day-holidays:before{position: absolute; left: 0; top: 0; font-size: 12px; transform: scale(.7);}
.laydate-day-holidays:before{content:'\4F11'; color: #FF5722;}
-.laydate-day-holidays[type="work"]:before{content:'\73ED'; color: inherit;}
+.laydate-day-holidays[type="workdays"]:before{content:'\73ED'; color: inherit;}
.layui-laydate .layui-this .laydate-day-holidays:before{color: #fff;}
/* 底部结构 */
diff --git a/src/modules/laydate.js b/src/modules/laydate.js
index 6751240f..28b440e5 100644
--- a/src/modules/laydate.js
+++ b/src/modules/laydate.js
@@ -234,6 +234,20 @@
return text[options.lang] || text['cn'];
};
+ Class.prototype.markerOfChineseFestivals = {
+ '0-1-1': '元旦',
+ '0-2-14': '情人' ,
+ '0-3-8': '妇女',
+ '0-3-12': '植树',
+ '0-4-1': '愚人',
+ '0-5-1': '劳动',
+ '0-5-4': '青年',
+ '0-6-1': '儿童',
+ '0-9-10': '教师',
+ '0-10-1': '国庆',
+ '0-12-25': '圣诞'
+ }
+
// 重载实例
Class.prototype.reload = function(options){
var that = this;
@@ -358,20 +372,6 @@
options.eventElem.attr('lay-key', that.index);
options.elem.attr(MOD_ID, options.id); // 渲染过的标记
- //记录重要日期
- options.mark = lay.extend({}, (options.calendar && options.lang === 'cn') ? {
- '0-1-1': '元旦'
- ,'0-2-14': '情人'
- ,'0-3-8': '妇女'
- ,'0-3-12': '植树'
- ,'0-4-1': '愚人'
- ,'0-5-1': '劳动'
- ,'0-5-4': '青年'
- ,'0-6-1': '儿童'
- ,'0-9-10': '教师'
- ,'0-10-1': '国庆'
- ,'0-12-25': '圣诞'
- } : {}, options.mark);
//获取限制内日期
lay.each(['min', 'max'], function(i, item){
@@ -1049,30 +1049,66 @@
return that;
};
- // 公历重要日期与自定义备注
+ /**
+ * 渲染备注
+ * @param {JQuery} tdElem td 元素
+ * @param {[number, number, number]} YMD 年月日
+ * @param {object | string} markers 备注信息
+ */
+ Class.prototype.markRender = function(tdElem, YMD, markers){
+ var markText;
+
+ if(typeof markers === 'object'){
+ lay.each(markers || {}, function(key, title){
+ var keys = key.split('-');
+ if((keys[0] == YMD[0] || keys[0] == 0) //每年的每月
+ && (keys[1] == YMD[1] || keys[1] == 0) //每月的每日
+ && keys[2] == YMD[2]){ //特定日
+ markText = title || YMD[2];
+ }
+ });
+ }else if(typeof markers === 'string'){
+ markText = markers || YMD[2];
+ }
+
+ markText && tdElem.find('div').html(''+ markText +'');
+ }
+
+ /**
+ * 公历重要日期与自定义备注
+ * @param {JQuery} td
+ * @param {[number, number, number]} YMD
+ * @returns Class
+ */
Class.prototype.mark = function(td, YMD){
- var that = this
- ,mark, options = that.config;
- lay.each(options.mark, function(key, title){
- var keys = key.split('-');
- if((keys[0] == YMD[0] || keys[0] == 0) //每年的每月
- && (keys[1] == YMD[1] || keys[1] == 0) //每月的每日
- && keys[2] == YMD[2]){ //特定日
- mark = title || YMD[2];
- }
- });
- mark && td.find('div').html(''+ mark +'');
+ var that = this;
+ var options = that.config;
+
+ var render = function(markers){
+ that.markRender(td, YMD, markers);
+ }
+
+ if(options.calendar && options.lang === 'cn'){
+ render(that.markerOfChineseFestivals);
+ }
+
+ if(typeof options.mark === 'function'){
+ options.mark(YMD, render);
+ }else if(typeof options.mark === 'object'){
+ render(options.mark);
+ }
return that;
};
- // 标注法定节假日或补假上班
- Class.prototype.holidays = function(td, YMD) {
- var that = this;
- var options = that.config;
- var type = ['', 'work'];
-
- if(layui.type(options.holidays) !== 'array') return that;
+ /**
+ * 渲染法定节假日或补假上班标记
+ * @param {JQuery} tdElem td 元素
+ * @param {[number, number, number]} YMD 年月日
+ * @param {[Array, Array] | string} markers 标记信息
+ */
+ Class.prototype.holidaysRender = function(tdElem, YMD, markers){
+ var type = ['holidays', 'workdays'];
var isEquals = function(ymdStr1, ymdStr2){
var ymd1 = ymdStr1.split('-');
@@ -1088,15 +1124,51 @@
return ymd1.join('-') === ymd2.join('-');
}
- lay.each(options.holidays, function(idx, item) {
- lay.each(item, function(i, dayStr) {
- if(isEquals(dayStr, td.attr('lay-ymd'))){
- td.find('div').html('' + YMD[2] + '');
- }
+ var insertHtml = function(el, type, text){
+ el.find('div').html([
+ '',
+ text,
+ ''
+ ].join(''));
+ }
+
+ if(layui.type(markers) === 'array'){
+ lay.each(markers, function(idx, item) {
+ lay.each(item, function(i, dayStr) {
+ if(isEquals(dayStr, tdElem.attr('lay-ymd'))){
+ insertHtml(tdElem, type[idx], YMD[2])
+ }
+ });
});
- });
+ }else if(typeof markers === 'string'){
+ if(type.indexOf(markers) !== -1){
+ insertHtml(tdElem, markers, YMD[2])
+ }
+ }
+ }
+
+ /**
+ * 标注法定节假日或补假上班
+ * @param {JQuery} td
+ * @param {[number, number, number]} YMD
+ * @returns Class
+ */
+ Class.prototype.holidays = function(td, YMD) {
+ var that = this;
+ var options = that.config;
+
+ var render = function(markers){
+ that.holidaysRender(td, YMD, markers);
+ }
+
+ if(typeof options.holidays === 'function'){
+ options.holidays(YMD, render);
+ }else if(layui.type(options.holidays) === 'array'){
+ render(options.holidays);
+ }
return that;
};
|