bk-magic-vue 2.4.8-beta.7 → 2.4.9-beta.1

package/dist/bk-magic-vue.css

@@ -13498,6 +13498,10 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
             -webkit-animation-direction:normal;
                     animation-direction:normal;
         }
+.bk-spin .bk-spin-rotation.bk-spin-rotation-default .rotate{
+                -webkit-animation-name:fadeDefault;
+                        animation-name:fadeDefault;
+            }
 .bk-spin .bk-spin-rotation.bk-spin-rotation-primary .rotate{
                 -webkit-animation-name:fadePrimary;
                         animation-name:fadePrimary;
@@ -13518,6 +13522,9 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
                 -webkit-animation-name:fadeInfo;
                         animation-name:fadeInfo;
             }
+.bk-spin .bk-spin-rotation.bk-spin-rotation-default-wait .rotate{
+                background-color:#c4c6cc;
+            }
 .bk-spin .bk-spin-rotation.bk-spin-rotation-primary-wait .rotate{
                 background-color:#3c96ff;
             }
@@ -13642,19 +13649,22 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
         }
 .bk-spin .bk-spin-icon-wait{
         -webkit-animation:none;
-                animation:none
+                animation:none;
+    }
+.bk-spin .bk-spin-icon-default{
+        color:#c4c6cc;
     }
 .bk-spin .bk-spin-icon-primary{
-        color:#3c96ff
+        color:#3c96ff;
     }
 .bk-spin .bk-spin-icon-success{
-        color:#2dcb56
+        color:#2dcb56;
     }
 .bk-spin .bk-spin-icon-warning{
-        color:#ffb848
+        color:#ffb848;
     }
 .bk-spin .bk-spin-icon-danger{
-        color:#ff5656
+        color:#ff5656;
     }
 .bk-spin .bk-spin-icon-info{
     	color:#979ba5;
@@ -13706,6 +13716,24 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
             -ms-flex-align:center;
                 align-items:center;
     }
+@-webkit-keyframes fadeDefault{
+    0%{
+        background-color:#c4c6cc;
+    }
+
+    100%{
+        background-color:none;
+    }
+}
+@keyframes fadeDefault{
+    0%{
+        background-color:#c4c6cc;
+    }
+
+    100%{
+        background-color:none;
+    }
+}
 @keyframes fadePrimary{
     0%{
         background-color:#3c96ff;

package/dist/bk-magic-vue.js

@@ -2041,7 +2041,7 @@
         type: String,
         default: 'primary',
         validator: function validator(value) {
-          if (!['primary', 'warning', 'success', 'danger', 'info'].includes(value)) {
+          if (!['default', 'primary', 'warning', 'success', 'danger', 'info'].includes(value)) {
             console.error("theme property is not valid: '".concat(value, "'"));
             return false;
           }
@@ -12206,7 +12206,8 @@
         "disabled-date": _vm.disabledDate,
         "range-state": _vm.rangeState,
         "value": _vm.preSelecting.left ? [_vm.dates[0]] : _vm.dates,
-        "focused-date": _vm.focusedDate
+        "focused-date": _vm.focusedDate,
+        "cell-class": _vm.cellClass
       },
       on: {
         "change-range": _vm.handleChangeRange,
@@ -29433,8 +29434,8 @@
     instance.type = opts.type || '';
     instance.showFooter = opts.showFooter !== false;
     instance.closeIcon = opts.closeIcon !== false;
-    instance.maskClose = opts.maskClose;
-    instance.escClose = opts.escClose;
+    instance.maskClose = opts.maskClose === undefined ? true : opts.maskClose;
+    instance.escClose = opts.escClose === undefined ? true : opts.escClose;
     instance.theme = opts.theme || 'primary';
     instance.icon = opts.icon;
     instance.extCls = opts.extCls;
@@ -48325,6 +48326,21 @@
 
   setInstaller(__vue_component__$1e);
 
+  var getElementSize = function getElementSize(node) {
+    if (node === undefined) {
+      return {
+        height: 0,
+        width: 0
+      };
+    }
+    var computedStyle = getComputedStyle(node);
+    var width = node.clientWidth - _parseFloat$2(computedStyle.paddingTop) - _parseFloat$2(computedStyle.paddingBottom);
+    var height = node.clientHeight - _parseFloat$2(computedStyle.paddingLeft) - _parseFloat$2(computedStyle.paddingRight);
+    return {
+      height: height,
+      width: width
+    };
+  };
   var script$1e = {
     name: 'bk-swiper',
     props: {
@@ -48363,7 +48379,6 @@
     },
     data: function data() {
       return {
-        swiperMainWith: 0,
         currentIndex: 1,
         isStartMove: false,
         isTransition: false,
@@ -48371,7 +48386,9 @@
         mouseDistance: 0,
         loopId: '',
         isClick: false,
-        realWidth: 0
+        realWidth: 0,
+        realHeight: 0,
+        resizeObserver: {}
       };
     },
     computed: {
@@ -48383,6 +48400,9 @@
         var last = this.sourceList.slice(-1);
         return [].concat(_toConsumableArray(last), _toConsumableArray(this.sourceList), [first]);
       },
+      swiperMainWith: function swiperMainWith() {
+        return this.realWidth * this.dataList.length;
+      },
       imageTransfer: function imageTransfer() {
         var indexMove = this.realWidth * this.currentIndex;
         var imageMove = indexMove - this.mouseDistance;
@@ -48397,38 +48417,11 @@
         },
         immediate: true
       },
-      height: function height(val) {
-        var ele = this.$refs.swiper || {
-          style: {
-            width: 0,
-            height: 0
-          },
-          offsetWidth: 0
-        };
-        if (+val > 0) ele.style.height = val + 'px';
-      },
-      width: function width(val) {
-        var ele = this.$refs.swiper || {
-          style: {
-            width: 0,
-            height: 0
-          },
-          offsetWidth: 0
-        };
-        this.realWidth = +val > 0 ? +val : ele.offsetWidth;
-        ele.style.width = this.realWidth + 'px';
-      },
-      list: function list() {
-        var _this = this;
-        this.$nextTick(function () {
-          _this.calcSize();
-        });
+      height: function height() {
+        this.calcSize();
       },
-      pics: function pics() {
-        var _this2 = this;
-        this.$nextTick(function () {
-          _this2.calcSize();
-        });
+      width: function width() {
+        this.calcSize();
       }
     },
     mounted: function mounted() {
@@ -48439,27 +48432,37 @@
     },
     methods: {
       calcSize: function calcSize() {
-        var ele = this.$refs.swiper || {
-          style: {
-            width: 0,
-            height: 0
-          },
-          offsetWidth: 0
-        };
-        if (+this.height > 0) ele.style.height = this.height + 'px';
-        this.realWidth = +this.width > 0 ? +this.width : ele.offsetWidth;
-        ele.style.width = this.realWidth + 'px';
-        this.swiperMainWith = this.realWidth * this.dataList.length;
+        var swiperParentSize = getElementSize(this.$refs.swiper && this.$refs.swiper.parentElement);
+        this.realWidth = +this.width > 0 ? this.width : swiperParentSize.width || 600;
+        this.realHeight = +this.height > 0 ? this.height : swiperParentSize.height || 300;
       },
       initStatus: function initStatus() {
         this.calcSize();
         this.startLoop();
+        this.watchParentSizeChange();
         document.addEventListener('visibilitychange', this.visChange);
       },
       destoryStatus: function destoryStatus() {
         this.endLoop();
+        this.endWatchParentSizeChange();
         document.removeEventListener('visibilitychange', this.visChange);
       },
+      watchParentSizeChange: function watchParentSizeChange() {
+        var _this = this;
+        var parentEle = this.$refs.swiper && this.$refs.swiper.parentElement;
+        if (!parentEle || !window.ResizeObserver) {
+          return;
+        }
+        this.resizeObserver = new ResizeObserver(function () {
+          _this.calcSize();
+        });
+        this.resizeObserver.observe(parentEle);
+      },
+      endWatchParentSizeChange: function endWatchParentSizeChange() {
+        if (this.resizeObserver && this.resizeObserver.disconnect) {
+          this.resizeObserver.disconnect();
+        }
+      },
       goToLink: function goToLink(link) {
         if (this.isClick && link) window.open(link, '_blank');
       },
@@ -48518,13 +48521,13 @@
         }
       },
       startLoop: function startLoop() {
-        var _this3 = this;
+        var _this2 = this;
         if (!this.isLoop) return;
         this.endLoop();
         this.loopId = window.setTimeout(function () {
-          _this3.isTransition = true;
-          _this3.changeCurrentIndex(_this3.currentIndex + 1);
-          _this3.startLoop();
+          _this2.isTransition = true;
+          _this2.changeCurrentIndex(_this2.currentIndex + 1);
+          _this2.startLoop();
         }, this.loopTime);
       },
       endLoop: function endLoop() {
@@ -48546,8 +48549,11 @@
 
     return _vm.sourceList.length ? _c('section', {
       ref: "swiper",
-      staticClass: "bk-swiper-home",
-      class: _vm.extCls
+      class: ['bk-swiper-home', _vm.extCls],
+      style: {
+        width: _vm.realWidth + "px",
+        height: _vm.realHeight + "px"
+      }
     }, [_c('hgroup', {
       class: [{
         'bk-transition': _vm.isTransition