Merge pull request #1128 from sunxiaobin89/main

修复 table 和 laydate 的一些问题以及新增一些功能

src/css/modules/laydate.css

@@ -55,7 +55,7 @@ html #layuicss-laydate{display: none; position: absolute; width: 1989px;}
 .layui-laydate-content{position: relative; padding: 10px; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none;}
 .layui-laydate-content table{border-collapse: collapse; border-spacing: 0;}
 .layui-laydate-content th,
-.layui-laydate-content td{width: 36px; height: 30px; padding: 5px; text-align: center;}
+.layui-laydate-content td{width: 36px; height: 30px; padding: 0; text-align: center;}
 .layui-laydate-content th{font-weight: 400;}
 .layui-laydate-content td{position: relative; cursor: pointer;}
 .laydate-day-mark{position: absolute; left: 0; top: 0; width: 100%; line-height: 30px; font-size: 12px; overflow: hidden;}
@@ -107,7 +107,7 @@ html #layuicss-laydate{display: none; position: absolute; width: 1989px;}
 .layui-laydate-content td{color: #666;}
 .layui-laydate-content td.laydate-selected{background-color: #B5FFF8;}
 .laydate-selected:hover{background-color: #00F7DE !important;}
-.layui-laydate-content td:hover,
+.layui-laydate-content td>div:hover,
 .layui-laydate-list li:hover{background-color: #eee; color: #333;}
 .laydate-time-list li ol{margin: 0; padding: 0; border: 1px solid #e2e2e2; border-left-width: 0;}
 .laydate-time-list li:first-child ol{border-left-width: 1px;}
@@ -124,6 +124,7 @@ html #layuicss-laydate{display: none; position: absolute; width: 1989px;}
 .layui-laydate .layui-this{background-color: #009688 !important; color: #fff !important;}
 .layui-laydate .laydate-disabled,
 .layui-laydate .laydate-disabled:hover{background:none !important; color: #d2d2d2 !important; cursor: not-allowed !important; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none;}
+.layui-laydate-content td>div{padding: 7px 0;height: 100%;}
 
 /* 墨绿/自定义背景色主题 */
 .laydate-theme-molv{border: none;}
@@ -153,4 +154,19 @@ html #layuicss-laydate{display: none; position: absolute; width: 1989px;}
 .laydate-theme-grid .laydate-month-list>li{margin: 0 -1px -1px 0;}
 .laydate-theme-grid .laydate-year-list>li{height: 43px; line-height: 43px;}
 .laydate-theme-grid .laydate-month-list>li{height: 71px; line-height: 71px;}
+.laydate-theme-grid .layui-laydate-content td>div{height: 29px;margin-top: -1px;}
 
+/* 圆圈高亮主题 */
+.laydate-theme-circle .layui-laydate-content td>div,
+.laydate-theme-circle .layui-laydate-content td.layui-this>div{width: 28px;height: 28px;line-height: 28px;border-radius: 14px;margin: 0 4px;padding: 0;}
+.layui-laydate.laydate-theme-circle .layui-laydate-content table td.layui-this{background-color: transparent !important;}
+.laydate-theme-grid.laydate-theme-circle .layui-laydate-content td>div{margin: 0 3.5px;}
+
+/* 全面板 */
+.laydate-theme-fullpanel .layui-laydate-main {width: 526px;}
+.laydate-theme-fullpanel .layui-laydate-list {width: 252px;left: 272px;}
+.laydate-theme-fullpanel .laydate-set-ym span {display: none;}
+.laydate-theme-fullpanel .laydate-time-show .layui-laydate-header .layui-icon,
+.laydate-theme-fullpanel .laydate-time-show .laydate-set-ym span[lay-type="year"],
+.laydate-theme-fullpanel .laydate-time-show .laydate-set-ym span[lay-type="month"] {display: inline-block !important;}
+.laydate-theme-fullpanel .laydate-btns-time{display: none;}

src/modules/carousel.js

@@ -195,6 +195,18 @@ layui.define('jquery', function(exports){
     });
   };
 
+  // 跳转到特定下标
+  Class.prototype.jump = function(index){
+    var that = this;
+    var options = that.config;
+
+    if(index > options.index){
+      that.slide('add', index - options.index);
+    } else if(index < options.index){
+      that.slide('sub', options.index - index);
+    }
+  }
+  
   //指示器
   Class.prototype.indicator = function(){
     var that = this
@@ -226,13 +238,7 @@ layui.define('jquery', function(exports){
     
     //事件
     tplInd.find('li').on(options.trigger === 'hover' ? 'mouseover' : options.trigger, function(){
-      var othis = $(this)
+      that.jump($(this).index());
-      ,index = othis.index();
-      if(index > options.index){
-        that.slide('add', index - options.index);
-      } else if(index < options.index){
-        that.slide('sub', options.index - index);
-      }
     });
   };
   

src/modules/laydate.js

@@ -62,7 +62,7 @@
     
     thisModule.that[id] = that; //记录当前实例对象
 
-    return {
+    return that.inst = {
       //提示框
       hint: function(content){
         that.hint.call(that, content);
@@ -85,8 +85,8 @@
     // 若 elem 非唯一，则拆分为多个实例
     var elem = lay(options.elem || that.config.elem);
     if(elem.length > 1){
-      layui.each(elem, function(){
+      lay.each(elem, function(){
-        laydate.render(lay.extend({}, that.config, {
+        laydate.render(lay.extend({}, that.config, lay.options(this),{
           elem: this
         }));
       });
@@ -207,6 +207,17 @@
     options.eventElem = lay(options.eventElem);
     
     if(!options.elem[0]) return;
+    var thatTemp = thisModule.that[options.elem.attr('lay-key')]
+    thatTemp && thatTemp.destroy && thatTemp.destroy(); // 销毁上一个实例以便重新渲染
+
+    layui.type(options.theme) !== 'array' && (options.theme = [options.theme]);
+    // 设置了全面版模式
+    if (options.fullPanel) {
+      if (options.type !== 'datetime' || options.range) {
+        // 目前只支持datetime的全面版
+        delete options.fullPanel;
+      }
+    }
 
     //日期范围分隔符
     that.rangeStr =  options.range ? (
@@ -279,10 +290,8 @@
     }
     
     //设置唯一KEY
-    if(!options.elem.attr('lay-key')){
     options.elem.attr('lay-key', that.index);
     options.eventElem.attr('lay-key', that.index);
-    }
 
     //记录重要日期
     options.mark = lay.extend({}, (options.calendar && options.lang === 'cn') ? {
@@ -364,7 +373,17 @@
         'layui-laydate'
         ,options.range ? ' layui-laydate-range' : ''
         ,isStatic ? (' '+ ELEM_STATIC) : ''
-        ,options.theme && options.theme !== 'default' && !/^#/.test(options.theme) ? (' laydate-theme-' + options.theme) : ''
+        ,options.fullPanel ? ' laydate-theme-fullpanel' : '' // 全面版
+        // ,options.theme && options.theme !== 'default' && !/^#/.test(options.theme) ? (' laydate-theme-' + options.theme) : ''
+        ,(function () {
+          var themeStr = '';
+          lay.each(options.theme, function (index, theme) {
+            if (theme !== 'default' && !/^#/.test(theme)) {
+              themeStr += ' laydate-theme-' + theme;
+            }
+          })
+          return themeStr;
+        })()
       ].join('')
     })
     
@@ -472,7 +491,7 @@
       if(options.type === 'datetime'){
         html.push('<span lay-type="datetime" class="'+ ELEM_TIME_BTN +'">'+ lang.timeTips +'</span>');
       }
-      if(!(!options.range && options.type === 'datetime')){
+      if(!(!options.range && options.type === 'datetime') || options.fullPanel){
         html.push('<span class="'+ ELEM_PREVIEW +'" title="'+ lang.preview +'"></span>')
       }
       
@@ -493,13 +512,20 @@
     options.showBottom && elem.appendChild(divFooter);
     
     //生成自定义主题
-    if(/^#/.test(options.theme)){
+    var style;
-      var style = lay.elem('style')
+    var styleText = [];
-      ,styleText = [
+    lay.each(options.theme, function (index, theme) {
+      if(/^#/.test(theme)){
+        style = style || lay.elem('style');
+        styleText.push([
           '#{{id}} .layui-laydate-header{background-color:{{theme}};}'
-        ,'#{{id}} .layui-this{background-color:{{theme}} !important;}'
+          ,'#{{id}} li.layui-this,#{{id}} td.layui-this>div{background-color:{{theme}} !important;}'
-      ].join('').replace(/{{id}}/g, that.elemID).replace(/{{theme}}/g, options.theme);
+          ,options.theme.indexOf('circle') !== -1 ? '' : '#{{id}} .layui-this{background-color:{{theme}} !important;}'
-      
+        ].join('').replace(/{{id}}/g, that.elemID).replace(/{{theme}}/g, theme));
+      }
+    });
+    if (style) {
+      styleText = styleText.join('');
       if('styleSheet' in style){
         style.setAttribute('type', 'text/css');
         style.styleSheet.cssText = styleText;
@@ -528,6 +554,7 @@
     
     Class.thisElemDate = that.elemID;
 
+    that.renderAdditional()
     typeof options.ready === 'function' && options.ready(lay.extend({}, options.dateTime, {
       month: options.dateTime.month + 1
     }));
@@ -828,7 +855,7 @@
         mark = title || YMD[2];
       }
     });
-    mark && td.html('<span class="laydate-day-mark">'+ mark +'</span>');
+    mark && td.find('div').html('<span class="laydate-day-mark">'+ mark +'</span>');
     
     return that;
   };
@@ -844,7 +871,7 @@
     lay.each(options.holidays, function(idx, item) {
       lay.each(item, function(i, dayStr) {
         if(dayStr === td.attr('lay-ymd')){
-          td.html('<span class="laydate-day-holidays"' + (
+          td.find('div').html('<span class="laydate-day-holidays"' + (
             type[idx] ? ('type="'+ type[idx] +'"') : ''
           ) + '>' + YMD[2] + '</span>');
         }
@@ -855,7 +882,7 @@
   };
   
   //无效日期范围的标记
-  Class.prototype.limit = function(elem, date, index, time){
+  Class.prototype.limit = function(elem, date, index, time, type){
     var that = this
     ,options = that.config, timestrap = {}
     ,dateTime = index > (time ? 0 : 41) ? that.endDate : options.dateTime
@@ -868,8 +895,8 @@
     }, function(key, item){
       timestrap[key] = that.newDate(lay.extend({
         year: item.year
-        ,month: item.month
+        ,month: type === 'year' ? 0 : item.month // 年份的时候只比较年
-        ,date: item.date
+        ,date: (type === 'year' || type === 'month') ? 1 : item.date // 年月只比较年月不与最大最小比日期
       }, function(){
         var hms = {};
         lay.each(time, function(i, keys){
@@ -938,7 +965,7 @@
       }
       YMD[1]++;
       YMD[2] = st + 1;
-      item.attr('lay-ymd', YMD.join('-')).html(YMD[2]);
+      item.attr('lay-ymd', YMD.join('-')).html('<div>' + YMD[2] + '</div>');
       that.mark(item, YMD).holidays(item, YMD).limit(item, {
         year: YMD[0]
         ,month: YMD[1] - 1
@@ -1053,7 +1080,7 @@
         }
         */
 
-        that.limit(lay(li), ymd, index);
+        that.limit(lay(li), ymd, index, null, type);
         yearNum++;
       });
 
@@ -1085,7 +1112,7 @@
         }
         */
 
-        that.limit(lay(li), ymd, index);
+        that.limit(lay(li), ymd, index, null, type);
       });
 
       lay(elemYM[isCN ? 0 : 1]).attr('lay-ym', listYM[0] + '-' + listYM[1])
@@ -1377,6 +1404,17 @@
     }, 300);
   };
 
+  // 附加的渲染处理，在ready和change的时候调用
+  Class.prototype.renderAdditional = function(){
+    var that = this;
+    var options = that.config;
+
+    // 处理全面板
+    if (options.fullPanel) {
+      that.list('time', 0);
+    }
+  };
+
   //执行 done/change 回调
   Class.prototype.done = function(param, type){
     var that = this
@@ -1394,6 +1432,7 @@
     that.preview();
     
     param = param || [that.parse(), start, end];
+    type === 'change' && that.renderAdditional();
     typeof options[type || 'done'] === 'function' && options[type || 'done'].apply(options, param);
     
     return that;
@@ -1670,24 +1709,31 @@
   //绑定的元素事件处理
   Class.prototype.events = function(){
     var that = this
-    ,options = that.config
+    var options = that.config
-
-    //绑定呼出控件事件
-    ,showEvent = function(elem, bind){
-      elem.on(options.trigger, function(){
-        //已经打开的面板避免重新渲染
-        if(laydate.thisId === options.id) return;
-        bind && (that.bindElem = this);
-        that.render();
-      });
-    };
 
     if(!options.elem[0] || options.elem[0].eventHandler) return;
 
-    showEvent(options.elem, 'bind');
+    var showEvent = function(){
-    showEvent(options.eventElem);
+      // 已经打开的面板避免重新渲染
-    
+      if(laydate.thisId === options.id) return;
+      that.bindElem = this;
+      that.render();
+    }
+    //绑定呼出控件事件
+    options.elem.on(options.trigger, showEvent);
     options.elem[0].eventHandler = true;
+    options.eventElem.on(options.trigger, showEvent);
+
+    that.destroy = function () {
+      that.remove();
+      options.elem.off(options.trigger, showEvent);
+      options.elem.removeAttr('lay-key');
+      options.elem[0].eventHandler = false;
+      options.eventElem.off(options.trigger, showEvent);
+      options.eventElem.removeAttr('lay-key');
+
+      delete thisModule.that[options.id];
+    }
   };
   
   //记录所有实例
@@ -1753,6 +1799,14 @@
     return thisModule.call(inst);
   };
 
+  // 获取
+  laydate.getInst = function (key) {
+    var that = thisModule.getThis(key);
+    if (that) {
+      return that.inst;
+    }
+  }
+
   //将指定对象转化为日期值
   laydate.parse = function(dateTime, format, one){
     dateTime = dateTime || {};
@@ -1803,6 +1857,13 @@
     return that.remove();
   };
 
+  // 销毁实例
+  laydate.destroy = function(id){
+    var that = thisModule.getThis(id || laydate.thisId);
+    if(!that) return;
+    return that.destroy();
+  };
+
   //加载方式
   isLayui ? (
     laydate.ready()

src/modules/table.js

@@ -787,7 +787,10 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
       // 给设定百分比的列分配列宽
       else if(/\d+%$/.test(item3.width)){
         that.getCssRule(item3.key, function(item){
-          item.style.width = Math.floor((parseFloat(item3.width) / 100) * cntrWidth) + 'px';
+          var width = Math.floor((parseFloat(item3.width) / 100) * cntrWidth);
+          width < minWidth && (width = minWidth);
+          width > maxWidth && (width = maxWidth);
+          item.style.width = width + 'px';
         });
       }