bk-magic-vue 2.4.13 → 2.4.14

package/lib/card.js

@@ -359,11 +359,57 @@
 	};
 	var SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;
 	var MOZ_HACK_REGEXP = /^moz([A-Z])/;
+	var trim$1 = function trim(string) {
+	  return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
+	};
 	var camelCase = function camelCase(name) {
 	  return name.replace(SPECIAL_CHARS_REGEXP, function (_, separator, letter, offset) {
 	    return offset ? letter.toUpperCase() : letter;
 	  }).replace(MOZ_HACK_REGEXP, 'Moz$1');
 	};
+	function hasClass(el, cls) {
+	  if (!el || !cls) return false;
+	  if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.');
+	  if (el.classList) {
+	    return el.classList.contains(cls);
+	  } else {
+	    return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
+	  }
+	}
+	function addClass(el, cls) {
+	  if (!el) return;
+	  var curClass = el.className;
+	  var classes = (cls || '').split(' ');
+	  for (var i = 0, j = classes.length; i < j; i++) {
+	    var clsName = classes[i];
+	    if (!clsName) continue;
+	    if (el.classList) {
+	      el.classList.add(clsName);
+	    } else if (!hasClass(el, clsName)) {
+	      curClass += ' ' + clsName;
+	    }
+	  }
+	  if (!el.classList) {
+	    el.className = curClass;
+	  }
+	}
+	function removeClass(el, cls) {
+	  if (!el || !cls) return;
+	  var classes = cls.split(' ');
+	  var curClass = ' ' + el.className + ' ';
+	  for (var i = 0, j = classes.length; i < j; i++) {
+	    var clsName = classes[i];
+	    if (!clsName) continue;
+	    if (el.classList) {
+	      el.classList.remove(clsName);
+	    } else if (hasClass(el, clsName)) {
+	      curClass = curClass.replace(' ' + clsName + ' ', ' ');
+	    }
+	  }
+	  if (!el.classList) {
+	    el.className = trim$1(curClass);
+	  }
+	}
 	var getStyle = Number(document.documentMode) < 9 ? function (element, styleName) {
 	  if (!element || !styleName) return null;
 	  styleName = camelCase(styleName);
@@ -1162,10 +1208,159 @@
 	  staticRenderFns: __vue_staticRenderFns__
 	}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
 
+	var transition = {
+	  beforeEnter: function beforeEnter(el) {
+	    addClass(el, 'collapse-transition');
+	    if (!el.dataset) {
+	      el.dataset = {};
+	    }
+	    el.dataset.oldPaddingTop = el.style.paddingTop;
+	    el.dataset.oldPaddingBottom = el.style.paddingBottom;
+	    el.style.height = '0';
+	    el.style.paddingTop = 0;
+	    el.style.paddingBottom = 0;
+	  },
+	  enter: function enter(el) {
+	    el.dataset.oldOverflow = el.style.overflow;
+	    if (el.scrollHeight !== 0) {
+	      el.style.height = el.scrollHeight + 'px';
+	      el.style.paddingTop = el.dataset.oldPaddingTop;
+	      el.style.paddingBottom = el.dataset.oldPaddingBottom;
+	    } else {
+	      el.style.height = '';
+	      el.style.paddingTop = el.dataset.oldPaddingTop;
+	      el.style.paddingBottom = el.dataset.oldPaddingBottom;
+	    }
+	    el.style.overflow = 'hidden';
+	  },
+	  afterEnter: function afterEnter(el) {
+	    removeClass(el, 'collapse-transition');
+	    el.style.height = '';
+	    el.style.overflow = el.dataset.oldOverflow;
+	  },
+	  beforeLeave: function beforeLeave(el) {
+	    if (!el.dataset) el.dataset = {};
+	    el.dataset.oldPaddingTop = el.style.paddingTop;
+	    el.dataset.oldPaddingBottom = el.style.paddingBottom;
+	    el.dataset.oldOverflow = el.style.overflow;
+	    el.style.height = el.scrollHeight + 'px';
+	    el.style.overflow = 'hidden';
+	  },
+	  leave: function leave(el) {
+	    if (el.scrollHeight !== 0) {
+	      addClass(el, 'collapse-transition');
+	      el.style.height = 0;
+	      el.style.paddingTop = 0;
+	      el.style.paddingBottom = 0;
+	    }
+	  },
+	  afterLeave: function afterLeave(el) {
+	    removeClass(el, 'collapse-transition');
+	    el.style.height = '';
+	    el.style.overflow = el.dataset.oldOverflow;
+	    el.style.paddingTop = el.dataset.oldPaddingTop;
+	    el.style.paddingBottom = el.dataset.oldPaddingBottom;
+	  }
+	};
+	var CollapseTransition = {
+	  name: 'CollapseTransition',
+	  functional: true,
+	  render: function render(h, _ref) {
+	    var children = _ref.children;
+	    var data = {
+	      on: transition
+	    };
+	    return h('transition', data, children);
+	  }
+	};
+
 	var script$1 = {
+	  name: 'bk-transition',
+	  components: {
+	    CollapseTransition: CollapseTransition
+	  },
+	  props: {
+	    name: {
+	      type: String,
+	      default: ''
+	    },
+	    durationTime: {
+	      type: String,
+	      default: '.3s'
+	    },
+	    durationType: {
+	      type: String,
+	      default: 'linear'
+	    }
+	  },
+	  computed: {
+	    transitionName: function transitionName() {
+	      return this.isCollapse ? '' : this.name;
+	    },
+	    isCollapse: function isCollapse() {
+	      return this.name === 'collapse';
+	    }
+	  },
+	  mounted: function mounted() {
+	    var slot = this.getSlot();
+	    slot.elm.style.transitionDuration = this.durationTime;
+	    slot.elm.style.transitionTimingFunction = this.durationType;
+	  },
+	  methods: {
+	    getSlot: function getSlot() {
+	      return this.$slots.default[0];
+	    }
+	  }
+	};
+
+	/* script */
+	var __vue_script__$1 = script$1;
+	/* template */
+
+	var __vue_render__$1 = function __vue_render__() {
+	  var _vm = this;
+
+	  var _h = _vm.$createElement;
+
+	  var _c = _vm._self._c || _h;
+
+	  return _c('transition', {
+	    staticClass: "bk-transition",
+	    attrs: {
+	      "name": _vm.transitionName
+	    }
+	  }, [_vm.name === 'collapse' ? _c('CollapseTransition', [_vm._t("default")], 2) : _vm._t("default")], 2);
+	};
+
+	var __vue_staticRenderFns__$1 = [];
+	/* style */
+
+	var __vue_inject_styles__$1 = undefined;
+	/* scoped */
+
+	var __vue_scope_id__$1 = undefined;
+	/* module identifier */
+
+	var __vue_module_identifier__$1 = undefined;
+	/* functional template */
+
+	var __vue_is_functional_template__$1 = false;
+	/* style inject */
+
+	/* style inject SSR */
+
+	/* style inject shadow dom */
+
+	var __vue_component__$1 = /*#__PURE__*/normalizeComponent_1({
+	  render: __vue_render__$1,
+	  staticRenderFns: __vue_staticRenderFns__$1
+	}, __vue_inject_styles__$1, __vue_script__$1, __vue_scope_id__$1, __vue_is_functional_template__$1, __vue_module_identifier__$1, false, undefined, undefined, undefined);
+
+	var script$2 = {
 	  name: 'bk-card',
 	  components: {
-	    bkInput: __vue_component__
+	    bkInput: __vue_component__,
+	    bkTransition: __vue_component__$1
 	  },
 	  props: {
 	    title: {
@@ -1263,10 +1458,10 @@
 	};
 
 	/* script */
-	var __vue_script__$1 = script$1;
+	var __vue_script__$2 = script$2;
 	/* template */
 
-	var __vue_render__$1 = function __vue_render__() {
+	var __vue_render__$2 = function __vue_render__() {
 	  var _vm = this;
 
 	  var _h = _vm.$createElement;
@@ -1316,36 +1511,40 @@
 	      },
 	      expression: "renderTitle"
 	    }
-	  })])], 2) : _vm._e(), _vm.collapseActive ? [_c('div', {
+	  })])], 2) : _vm._e(), _vm.collapseActive ? [_c('bk-transition', {
+	    attrs: {
+	      "name": "collapse"
+	    }
+	  }, [_c('div', {
 	    staticClass: "bk-card-body"
-	  }, [_vm._t("default")], 2), _vm.showFoot ? _c('div', {
+	  }, [_vm._t("default")], 2)]), _vm.showFoot ? _c('div', {
 	    staticClass: "bk-card-foot"
 	  }, [_vm._t("footer")], 2) : _vm._e()] : _vm._e()], 2);
 	};
 
-	var __vue_staticRenderFns__$1 = [];
+	var __vue_staticRenderFns__$2 = [];
 	/* style */
 
-	var __vue_inject_styles__$1 = undefined;
+	var __vue_inject_styles__$2 = undefined;
 	/* scoped */
 
-	var __vue_scope_id__$1 = undefined;
+	var __vue_scope_id__$2 = undefined;
 	/* module identifier */
 
-	var __vue_module_identifier__$1 = undefined;
+	var __vue_module_identifier__$2 = undefined;
 	/* functional template */
 
-	var __vue_is_functional_template__$1 = false;
+	var __vue_is_functional_template__$2 = false;
 	/* style inject */
 
 	/* style inject SSR */
 
 	/* style inject shadow dom */
 
-	var __vue_component__$1 = /*#__PURE__*/normalizeComponent_1({
-	  render: __vue_render__$1,
-	  staticRenderFns: __vue_staticRenderFns__$1
-	}, __vue_inject_styles__$1, __vue_script__$1, __vue_scope_id__$1, __vue_is_functional_template__$1, __vue_module_identifier__$1, false, undefined, undefined, undefined);
+	var __vue_component__$2 = /*#__PURE__*/normalizeComponent_1({
+	  render: __vue_render__$2,
+	  staticRenderFns: __vue_staticRenderFns__$2
+	}, __vue_inject_styles__$2, __vue_script__$2, __vue_scope_id__$2, __vue_is_functional_template__$2, __vue_module_identifier__$2, false, undefined, undefined, undefined);
 
 	var _toObject = function (it) {
 	  return Object(_defined(it));
@@ -1481,9 +1680,9 @@
 	  };
 	}
 
-	setInstaller(__vue_component__$1);
+	setInstaller(__vue_component__$2);
 
-	exports.default = __vue_component__$1;
+	exports.default = __vue_component__$2;
 
 	Object.defineProperty(exports, '__esModule', { value: true });
 

package/lib/date-picker.js

@@ -4688,13 +4688,16 @@
       bindWheelEvent: function bindWheelEvent() {
         var _this5 = this;
         var bindFunction = function bindFunction(type) {
-          _this5.$refs[type].addEventListener('wheel', debounce$1(_this5.handleWheel, 32, type), {
+          var el = _this5.$refs[type];
+          el && el.addEventListener('wheel', debounce$1(_this5.handleWheel, 32, type), {
             passive: true
           });
         };
-        bindFunction('hours');
-        bindFunction('minutes');
-        bindFunction('seconds');
+        this.$nextTick(function () {
+          bindFunction('hours');
+          bindFunction('minutes');
+          bindFunction('seconds');
+        });
       },
       typeItemHeight: function typeItemHeight(type) {
         return this.$refs[type].querySelector('li').offsetHeight;
@@ -4970,7 +4973,7 @@
     components: {
       TimeSpinner: __vue_component__$6
     },
-    mixins: [timeMixins, panelMixins],
+    mixins: [timeMixins, panelMixins, locale.mixin],
     props: {
       disabledDate: {
         type: Function,
@@ -5080,6 +5083,16 @@
         if (emit) {
           this.$emit('pick', newDate, true, 'time');
         }
+      },
+      setTimeToNow: function setTimeToNow() {
+        var hours = new Date().getHours();
+        var minutes = new Date().getMinutes();
+        var seconds = new Date().getSeconds();
+        var newDate = new Date(this.date);
+        newDate.setHours(hours);
+        newDate.setMinutes(minutes);
+        newDate.setSeconds(seconds);
+        this.$emit('pick', newDate, true, 'time');
       }
     }
   };
@@ -5109,7 +5122,15 @@
       }
     }, [_vm.showDate ? _c('div', {
       staticClass: "bk-time-picker-header"
-    }, [_vm._v(_vm._s(_vm.visibleDate))]) : _vm._e(), _c('div', {
+    }, [_vm._v("\n      " + _vm._s(_vm.visibleDate) + "\n      "), _c('a', {
+      staticClass: "now-time",
+      attrs: {
+        "href": "javascript: void(0);"
+      },
+      on: {
+        "click": _vm.setTimeToNow
+      }
+    }, [_vm._v(_vm._s(_vm.t('bk.datePicker.now')))])]) : _vm._e(), _c('div', {
       staticClass: "bk-picker-panel-content"
     }, [_c('time-spinner', {
       ref: "timeSpinner",
@@ -5128,7 +5149,16 @@
         "change": _vm.handleChange,
         "pick-click": _vm.handlePickClick
       }
-    })], 1)])]);
+    })], 1), !_vm.showDate ? _c('div', {
+      staticClass: "bk-time-picker-now"
+    }, [_c('a', {
+      attrs: {
+        "href": "javascript: void(0);"
+      },
+      on: {
+        "click": _vm.setTimeToNow
+      }
+    }, [_vm._v(_vm._s(_vm.t('bk.datePicker.now')))])]) : _vm._e()])]);
   };
 
   var __vue_staticRenderFns__$7 = [];

package/lib/directives/tooltips.js

@@ -2967,6 +2967,7 @@
     trigger: 'mouseenter focus',
     theme: 'dark',
     interactive: true,
+    boundary: 'window',
     content: '',
     allowHtml: false,
     extCls: ''

package/lib/form-item.js

@@ -4359,6 +4359,7 @@
     trigger: 'mouseenter focus',
     theme: 'dark',
     interactive: true,
+    boundary: 'window',
     content: '',
     allowHtml: false,
     extCls: ''

package/lib/locale/lang/en-US.js

@@ -24,7 +24,8 @@
         hour: 'Hour',
         min: 'Minute',
         sec: 'Second',
-        toNow: 'Now'
+        toNow: 'Now',
+        now: 'Now'
       },
       dialog: {
         ok: 'OK',

package/lib/locale/lang/zh-CN.js

@@ -24,7 +24,8 @@
         hour: '时',
         min: '分',
         sec: '秒',
-        toNow: '至今'
+        toNow: '至今',
+        now: '此刻'
       },
       dialog: {
         ok: '确定',

package/lib/popconfirm.js

@@ -3520,10 +3520,6 @@
     },
     mixins: [locale.mixin],
     props: {
-      tirgger: {
-        type: String,
-        default: 'mouseenter focus'
-      },
       title: {
         type: String
       },

package/lib/slider.js

@@ -3907,6 +3907,7 @@
     trigger: 'mouseenter focus',
     theme: 'dark',
     interactive: true,
+    boundary: 'window',
     content: '',
     allowHtml: false,
     extCls: ''

package/lib/table.js

@@ -13429,6 +13429,18 @@
 	      type: Boolean,
 	      default: true
 	    },
+	    customHeaderColor: {
+	      type: String,
+	      default: ''
+	    },
+	    customHeaderColorHover: {
+	      type: String,
+	      default: ''
+	    },
+	    darkHeader: {
+	      type: Boolean,
+	      default: false
+	    },
 	    rowAutoHeight: {
 	      type: Boolean,
 	      default: false
@@ -13741,6 +13753,7 @@
 	  },
 	  mounted: function mounted() {
 	    var _this3 = this;
+	    this.setHeaderStyle();
 	    this.bindEvents();
 	    this.store.updateColumns();
 	    this.doLayout();
@@ -13764,6 +13777,13 @@
 	    if (this.resizeListener) removeResizeListener(this.$el, this.resizeListener);
 	  },
 	  methods: {
+	    setHeaderStyle: function setHeaderStyle() {
+	      var _this4 = this;
+	      this.$nextTick(function () {
+	        _this4.$refs.bkTable.style.setProperty('--customHeaderColor', _this4.customHeaderColor);
+	        _this4.$refs.bkTable.style.setProperty('--customHeaderColorHover', _this4.customHeaderColorHover);
+	      });
+	    },
 	    setCurrentRow: function setCurrentRow(row) {
 	      this.store.commit('setCurrentRow', row);
 	    },
@@ -13836,7 +13856,7 @@
 	      var refs = this.$refs;
 	      var self = this;
 	      this.bodyWrapper.addEventListener('scroll', function () {
-	        var _this4 = this;
+	        var _this5 = this;
 	        if (headerWrapper) {
 	          headerWrapper.scrollLeft = this.scrollLeft;
 	          values$1(tableHeader.filterPanels).forEach(function (filterPanel) {
@@ -13859,7 +13879,7 @@
 	        if (this.scrollThrottle) return;
 	        this.scrollThrottle = true;
 	        setTimeout(function () {
-	          _this4.scrollThrottle = false;
+	          _this5.scrollThrottle = false;
 	          if (bodyWrapper.scrollHeight - bodyWrapper.offsetHeight - bodyWrapper.scrollTop < 40) {
 	            self.$emit('scroll-end');
 	          }
@@ -13921,12 +13941,16 @@
 	  var _c = _vm._self._c || _h;
 
 	  return _c('div', {
+	    ref: "bkTable",
 	    staticClass: "bk-table",
 	    class: [{
 	      'bk-table-fit': _vm.fit,
 	      'bk-table-striped': _vm.stripe,
 	      'bk-table-border': _vm.tableBorder || _vm.isGroup,
 	      'bk-table-outer-border': _vm.outerBorder,
+	      'bk-table-dark-header': _vm.darkHeader,
+	      'bk-table-custom-header': _vm.customHeaderColor,
+	      'bk-table-custom-header-hover': _vm.customHeaderColorHover,
 	      'bk-table-linear': !(_vm.tableBorder || _vm.outerBorder || _vm.isGroup),
 	      'bk-table-row-border': _vm.tableRowBorder,
 	      'bk-table-col-border': _vm.tableColBorder,

package/lib/tag-input.js

@@ -5271,6 +5271,7 @@
     trigger: 'mouseenter focus',
     theme: 'dark',
     interactive: true,
+    boundary: 'window',
     content: '',
     allowHtml: false,
     extCls: ''

package/lib/time-picker.js

@@ -3874,13 +3874,16 @@
       bindWheelEvent: function bindWheelEvent() {
         var _this5 = this;
         var bindFunction = function bindFunction(type) {
-          _this5.$refs[type].addEventListener('wheel', debounce$1(_this5.handleWheel, 32, type), {
+          var el = _this5.$refs[type];
+          el && el.addEventListener('wheel', debounce$1(_this5.handleWheel, 32, type), {
             passive: true
           });
         };
-        bindFunction('hours');
-        bindFunction('minutes');
-        bindFunction('seconds');
+        this.$nextTick(function () {
+          bindFunction('hours');
+          bindFunction('minutes');
+          bindFunction('seconds');
+        });
       },
       typeItemHeight: function typeItemHeight(type) {
         return this.$refs[type].querySelector('li').offsetHeight;
@@ -4156,7 +4159,7 @@
     components: {
       TimeSpinner: __vue_component__$2
     },
-    mixins: [timeMixins, panelMixins],
+    mixins: [timeMixins, panelMixins, locale.mixin],
     props: {
       disabledDate: {
         type: Function,
@@ -4266,6 +4269,16 @@
         if (emit) {
           this.$emit('pick', newDate, true, 'time');
         }
+      },
+      setTimeToNow: function setTimeToNow() {
+        var hours = new Date().getHours();
+        var minutes = new Date().getMinutes();
+        var seconds = new Date().getSeconds();
+        var newDate = new Date(this.date);
+        newDate.setHours(hours);
+        newDate.setMinutes(minutes);
+        newDate.setSeconds(seconds);
+        this.$emit('pick', newDate, true, 'time');
       }
     }
   };
@@ -4295,7 +4308,15 @@
       }
     }, [_vm.showDate ? _c('div', {
       staticClass: "bk-time-picker-header"
-    }, [_vm._v(_vm._s(_vm.visibleDate))]) : _vm._e(), _c('div', {
+    }, [_vm._v("\n      " + _vm._s(_vm.visibleDate) + "\n      "), _c('a', {
+      staticClass: "now-time",
+      attrs: {
+        "href": "javascript: void(0);"
+      },
+      on: {
+        "click": _vm.setTimeToNow
+      }
+    }, [_vm._v(_vm._s(_vm.t('bk.datePicker.now')))])]) : _vm._e(), _c('div', {
       staticClass: "bk-picker-panel-content"
     }, [_c('time-spinner', {
       ref: "timeSpinner",
@@ -4314,7 +4335,16 @@
         "change": _vm.handleChange,
         "pick-click": _vm.handlePickClick
       }
-    })], 1)])]);
+    })], 1), !_vm.showDate ? _c('div', {
+      staticClass: "bk-time-picker-now"
+    }, [_c('a', {
+      attrs: {
+        "href": "javascript: void(0);"
+      },
+      on: {
+        "click": _vm.setTimeToNow
+      }
+    }, [_vm._v(_vm._s(_vm.t('bk.datePicker.now')))])]) : _vm._e()])]);
   };
 
   var __vue_staticRenderFns__$3 = [];