bk-magic-vue 2.4.1-beta.2 → 2.4.3

package/dist/bk-magic-vue.css

@@ -15035,6 +15035,13 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
             -ms-flex-direction:column;
                 flex-direction:column;
     }
+.bk-image-viewer-mask{
+        position:absolute;
+        top:0;
+        right:0;
+        bottom:0;
+        left:0;
+    }
 .bk-image-viewer-header{
         position:absolute;
         top:0;
@@ -15051,9 +15058,7 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
         -webkit-box-align:center;
             -ms-flex-align:center;
                 align-items:center;
-        padding:0 13px 0 25px;
-        background:rgba(0, 0, 0, .7);
-        color:#63656e;
+        color:#c4c6cc;
     }
 .bk-image-viewer-header > div{
             -webkit-box-flex:1;
@@ -15062,6 +15067,8 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
             overflow:hidden;
             white-space:nowrap;
             text-overflow:ellipsis;
+            font-size:14px;
+            padding:0 25px;
         }
 .bk-image-viewer-header .quit-box{
             display:-webkit-box;
@@ -15074,8 +15081,6 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
                 -ms-flex-pack:end;
                     justify-content:flex-end;
             height:100%;
-        }
-.bk-image-viewer-header .quit-tips{
             color:#979ba5;
         }
 .bk-image-viewer-btn{
@@ -15094,18 +15099,23 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
         opacity:.8;
         -webkit-box-sizing:border-box;
                 box-sizing:border-box;
-        color:#fff;
+        background-color:rgba(0, 0, 0, .3);
+        color:#DCDEE5;
         -webkit-user-select:none;
            -moz-user-select:none;
             -ms-user-select:none;
                 user-select:none
     }
+.bk-image-viewer-btn:hover{
+            background-color:rgba(0, 0, 0, .4);
+            color:#63656e;
+        }
 .bk-image-viewer-close{
-        width:40px;
-        height:40px;
-        line-height:38px;
+        width:80px;
+        height:80px;
+        line-height:80px;
         text-align:center;
-        font-size:32px;
+        font-size:50px;
         color:#fff;
         cursor:pointer;
     }
@@ -15145,14 +15155,17 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
         padding:0 23px;
         background-color:rgba(0,0,0,0.4);
         border-color:#fff;
-        border-radius:22px;
+        border-radius:22px
     }
+.bk-image-viewer-actions:hover{
+            background:rgba(0,0,0,.5);
+        }
 .bk-image-viewer-actions-inner{
             width:100%;
             height:100%;
             text-align:justify;
             font-size:23px;
-            color:#fff;
+            color:#c4c6cc;
             display:-webkit-box;
             display:-ms-flexbox;
             display:flex;
@@ -15161,17 +15174,21 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
                     align-items:center;
             -ms-flex-pack:distribute;
                 justify-content:space-around;
-            cursor:pointer;
+
         }
+.bk-image-viewer-actions-inner .bk-icon{
+                cursor:pointer
+            }
+.bk-image-viewer-actions-inner .bk-icon:hover{
+                    color:#fff;
+                }
 .bk-image-viewer-next, .bk-image-viewer-prev{
         top:50%;
         width:80px;
         height:80px;
         font-size:40px;
-        color:#fff;
-        background-color:rgba(0,0,0,0.4);
-        border-color:#fff;
         cursor:pointer;
+    //background:rgb(76,76,76);
     }
 .bk-image-viewer-prev{
         -webkit-transform:translateY(-50%);
@@ -15732,7 +15749,7 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
         background-color:#dcdee5;
       }
 .bk-affix{
-    position:fixed
+  position:fixed
 }
 .bk-back-to-top{
     position:fixed;

package/dist/bk-magic-vue.js

@@ -10,17 +10,11 @@
   function _typeof(obj) {
     "@babel/helpers - typeof";
 
-    if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-      _typeof = function (obj) {
-        return typeof obj;
-      };
-    } else {
-      _typeof = function (obj) {
-        return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-      };
-    }
-
-    return _typeof(obj);
+    return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+      return typeof obj;
+    } : function (obj) {
+      return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+    }, _typeof(obj);
   }
 
   function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
@@ -78,6 +72,9 @@
   function _createClass(Constructor, protoProps, staticProps) {
     if (protoProps) _defineProperties(Constructor.prototype, protoProps);
     if (staticProps) _defineProperties(Constructor, staticProps);
+    Object.defineProperty(Constructor, "prototype", {
+      writable: false
+    });
     return Constructor;
   }
 
@@ -738,7 +735,7 @@
     },
     computed: {
       positionStyle: function positionStyle() {
-        return "right: ".concat(this.right, "px;\n                    bottom: ").concat(this.bottom, "px;\n                    z-index: ").concat(this.zIndex);
+        return "right: ".concat(this.right, "px; bottom: ").concat(this.bottom, "px; z-index: ").concat(this.zIndex);
       }
     },
     watch: {
@@ -2744,6 +2741,14 @@
   var script$8 = {
     name: 'bk-checkbox',
     mixins: [emitter],
+    inject: {
+      handleRemoveItem: {
+        default: null
+      },
+      handleAddItem: {
+        default: null
+      }
+    },
     props: {
       value: {
         type: [String, Number, Boolean],
@@ -2823,9 +2828,16 @@
       }
     },
     created: function created() {
-      this.dispatch('bk-checkbox-group', 'checkbox-item-add', this);
+      if (this.handleAddItem && typeof this.handleAddItem === 'function') {
+        this.handleAddItem(this);
+      }
       this.init();
     },
+    destroyed: function destroyed() {
+      if (this.handleRemoveItem && typeof this.handleRemoveItem === 'function') {
+        this.handleRemoveItem(this);
+      }
+    },
     methods: {
       getValue: function getValue() {
         if (this.selected) {
@@ -2995,6 +3007,12 @@
 
   var script$9 = {
     name: 'bk-checkbox-group',
+    provide: function provide() {
+      return {
+        handleAddItem: this.handleAddItem,
+        handleRemoveItem: this.handleRemoveItem
+      };
+    },
     props: {
       value: {
         type: Array,
@@ -3021,16 +3039,17 @@
         this.localValue = _toConsumableArray(_value);
       }
     },
-    created: function created() {
-      var _this = this;
-      this.$on('checkbox-item-add', function (item) {
-        if (item) {
-          _this.checkboxItems.push(item);
-        }
-        return false;
-      });
-    },
     methods: {
+      handleAddItem: function handleAddItem(item) {
+        if (!item || this.checkboxItems.includes(item)) return;
+        this.checkboxItems.push(item);
+      },
+      handleRemoveItem: function handleRemoveItem(item) {
+        var index = this.checkboxItems.indexOf(item);
+        if (index > -1) {
+          this.checkboxItems.splice(index, 1);
+        }
+      },
       handleChange: function handleChange(checked, value) {
         var oldValue = _toConsumableArray(this.localValue);
         var localValue = [];
@@ -8343,7 +8362,7 @@
     }, [_c('path', {
       attrs: {
         "fill": "#c4c6cc",
-        "d": "M512,128c51.9,0,102.2,10.1,149.5,30.2c45.7,19.3,86.8,47,122.1,82.3s63,76.4,82.3,122.1\n                              c20,47.3,30.2,97.6,30.2,149.5S886,614.3,865.9,661.6c-19.3,45.7-47,86.8-82.3,122.1s-76.4,63-122.1,82.3\n                              c-47.3,20-97.6,30.2-149.5,30.2S409.8,886.1,362.5,866c-45.7-19.3-86.8-47-122.1-82.3s-63-76.4-82.3-122.1\n                              c-20-47.3-30.2-97.6-30.2-149.5s10.1-102.2,30.2-149.5c19.3-45.7,47-86.8,82.3-122.1s76.4-63,122.1-82.3\n                              C409.8,138.1,460.1,128,512,128 M512,64C264.6,64,64,264.6,64,512s200.6,448,448,448s448-200.6,448-448S759.4,64,512,64L512,64z"
+        "d": "M512,128c51.9,0,102.2,10.1,149.5,30.2c45.7,19.3,86.8,47,122.1,82.3s63,76.4,82.3,122.1\n              c20,47.3,30.2,97.6,30.2,149.5S886,614.3,865.9,661.6c-19.3,45.7-47,86.8-82.3,122.1s-76.4,63-122.1,82.3\n              c-47.3,20-97.6,30.2-149.5,30.2S409.8,886.1,362.5,866c-45.7-19.3-86.8-47-122.1-82.3s-63-76.4-82.3-122.1\n              c-20-47.3-30.2-97.6-30.2-149.5s10.1-102.2,30.2-149.5c19.3-45.7,47-86.8,82.3-122.1s76.4-63,122.1-82.3\n              C409.8,138.1,460.1,128,512,128 M512,64C264.6,64,64,264.6,64,512s200.6,448,448,448s448-200.6,448-448S759.4,64,512,64L512,64z"
       }
     }), _c('polygon', {
       attrs: {
@@ -8364,7 +8383,7 @@
     }, [_c('path', {
       attrs: {
         "fill": "#c4c6cc",
-        "d": "M896,128h-96v64h64v112H160V192h64v-64h-96c-17.7,0-32,14.3-32,32v736c0,17.7,14.3,32,32,32h768\n                              c17.7,0,32-14.3,32-32V160C928,142.3,913.7,128,896,128z M160,864V368h704v496H160z"
+        "d": "M896,128h-96v64h64v112H160V192h64v-64h-96c-17.7,0-32,14.3-32,32v736c0,17.7,14.3,32,32,32h768\n              c17.7,0,32-14.3,32-32V160C928,142.3,913.7,128,896,128z M160,864V368h704v496H160z"
       }
     }), _c('rect', {
       attrs: {
@@ -8906,6 +8925,16 @@
       message: {
         copy: 'copy',
         copied: 'copied'
+      },
+      image: {
+        zoomIn: 'zoom in',
+        zoomOut: 'zoom out',
+        rotateLeft: 'anticlockwise',
+        rotateRight: 'clockwise rotation',
+        fullScreen: 'full screen',
+        original: 'original size',
+        prev: 'prev',
+        next: 'next'
       }
     }
   };
@@ -9051,6 +9080,14 @@
       message: {
         copy: '复制',
         copied: '已复制'
+      },
+      image: {
+        zoomIn: '放大',
+        zoomOut: '缩小',
+        rotateLeft: '向左旋转',
+        rotateRight: '向右旋转',
+        fullScreen: '适应屏幕',
+        original: '快速回到 1：1'
       }
     }
   };
@@ -10222,7 +10259,7 @@
     var createDom = function createDom(el, css) {
       var dom = document.createElement('div');
       var width = _parseFloat$2(css['width']) ? Math.ceil(_parseFloat$2(css['width'])) + 'px' : css['width'];
-      dom.style.cssText = "\n        width: ".concat(width, ";\n        line-height: ").concat(css['line-height'], ";\n        font-size: ").concat(css['font-size'], ";\n        word-break: ").concat(css['word-break'], ";\n        padding: ").concat(css['padding'], ";\n    ");
+      dom.style.cssText = "\n      width: ".concat(width, ";\n      line-height: ").concat(css['line-height'], ";\n      font-size: ").concat(css['font-size'], ";\n      word-break: ").concat(css['word-break'], ";\n      padding: ").concat(css['padding'], ";\n    ");
       dom.textContent = el.textContent;
       return dom;
     };
@@ -30037,6 +30074,9 @@
           return;
         }
         return typeof this.zIndex === 'number' && !isNan$1(this.zIndex);
+      },
+      renderZIndex: function renderZIndex() {
+        return this.zIndex;
       }
     },
     watch: {
@@ -30056,7 +30096,7 @@
       },
       isShow: function isShow(newVal) {
         if (newVal && !this.hasZIndexOption) {
-          this.zIndex = zIndexManager.nextZIndex();
+          this.renderZIndex = zIndexManager.nextZIndex();
         }
       },
       isLoading: {
@@ -30131,7 +30171,7 @@
       }],
       staticClass: "bk-loading-wrapper",
       style: {
-        zIndex: _vm.zIndex,
+        renderZIndex: _vm.renderZIndex,
         backgroundColor: _vm.bgColor
       }
     }, [_c('div', {
@@ -30183,7 +30223,7 @@
       class: _vm.extCls,
       style: {
         position: _vm.type,
-        zIndex: _vm.zIndex,
+        renderZIndex: _vm.renderZIndex,
         backgroundColor: _vm.bgColor
       }
     }, [_c('div', {
@@ -33515,6 +33555,12 @@
     },
     mixins: [locale.mixin],
     props: {
+      popoverOptions: {
+        type: Object,
+        default: function _default() {
+          return {};
+        }
+      },
       type: {
         type: String,
         default: 'default',
@@ -33741,6 +33787,7 @@
       },
       attrs: {
         "placeholder": "页数",
+        "popover-options": _vm.popoverOptions,
         "clearable": false,
         "size": _vm.small ? 'small' : ''
       },
@@ -37338,7 +37385,7 @@
                 case 21:
                   _context2.prev = 21;
                   _context2.t0 = _context2["catch"](14);
-                  console.log('Previous tab toggle canceled');
+                  console.warn('Previous tab toggle canceled');
                 case 24:
                   _context2.prev = 24;
                   _this3.clearToggleStatus();
@@ -39336,11 +39383,9 @@
           if (lastColumn) {
             if (!this.scrollX && flattenColumns.length) {
               var deltaWidth = bodyWidth - bodyMinWidth;
-              console.log('from print table last column < ', lastColumn);
               lastColumn.realWidth = lastColumn.realWidth + deltaWidth;
               this.bodyWidth = bodyWidth;
             } else {
-              console.log('from print table last column > ', lastColumn);
               if (lastColumn) {
                 var lastRealWidth = typeof lastColumn.width !== 'number' ? lastColumn.minWidth : lastColumn.width;
                 var preLastColumnBodyMinWidth = bodyMinWidth - lastColumn.realWidth;
@@ -41420,6 +41465,12 @@
             isLoading: false
           };
         }
+      },
+      popoverOptions: {
+        type: Object,
+        default: function _default() {
+          return {};
+        }
       }
     },
     data: function data() {
@@ -42085,7 +42136,8 @@
         "align": "right",
         "show-total-count": _vm.showPaginationInfo,
         "show-selection-count": _vm.showSelectionCount,
-        "selection-count": _vm.store.states.selection.length
+        "selection-count": _vm.store.states.selection.length,
+        "popover-options": _vm.popoverOptions
       },
       on: {
         "change": _vm.handlePageChange,
@@ -52414,7 +52466,9 @@
       class: {
         'bk-margin-left': _vm.multiple
       }
-    }, [_vm._v("\n          " + _vm._s(_vm.item.name) + "\n          "), _vm._t("prepend", null, {
+    }, [_vm._t("option", null, {
+      node: _vm.item
+    }), _vm._t("prepend", null, {
       node: _vm.item
     })], 2)])])], 2), _vm.isRemote ? [_vm.item.isLoading ? _c('i', {
       staticClass: "bk-icon left-icon icon-loading bk-button-icon-loading bk-cascade-right"
@@ -52763,6 +52817,14 @@
           }
         },
         scopedSlots: _vm._u([{
+          key: "option",
+          fn: function fn(ref) {
+            var node = ref.node;
+            return [_vm._t("option", null, {
+              node: node
+            })];
+          }
+        }, {
           key: "prepend",
           fn: function fn(ref) {
             var node = ref.node;
@@ -52794,6 +52856,14 @@
         "updateSelectedList": _vm.updateSelectedList
       },
       scopedSlots: _vm._u([{
+        key: "option",
+        fn: function fn(ref) {
+          var node = ref.node;
+          return [_vm._t("option", null, {
+            node: node
+          })];
+        }
+      }, {
         key: "prepend",
         fn: function fn(ref) {
           var node = ref.node;
@@ -53687,6 +53757,14 @@
         "updateSelectedList": _vm.updateSelectedList
       },
       scopedSlots: _vm._u([{
+        key: "option",
+        fn: function fn(ref) {
+          var node = ref.node;
+          return [_vm._t("option", [_vm._v(_vm._s(node.name))], {
+            node: node
+          })];
+        }
+      }, {
         key: "prepend",
         fn: function fn(ref) {
           var node = ref.node;
@@ -53955,6 +54033,10 @@
       initialIndex: {
         type: Number,
         default: 0
+      },
+      maskClose: {
+        type: Boolean,
+        default: true
       }
     },
     data: function data() {
@@ -54195,7 +54277,14 @@
       attrs: {
         "tabindex": "-1"
       }
-    }, [_vm.isShowTitle && _vm.urlList.length ? _c('div', {
+    }, [_c('div', {
+      staticClass: "bk-image-viewer-mask",
+      on: {
+        "click": function click($event) {
+          _vm.maskClose && _vm.hide();
+        }
+      }
+    }), _vm.isShowTitle && _vm.urlList.length ? _c('div', {
       staticClass: "bk-image-viewer-header"
     }, [_c('div', [_vm._v(_vm._s(_vm.currentName))]), _c('div', {
       staticClass: "tc"
@@ -54235,6 +54324,15 @@
     }, [_c('div', {
       staticClass: "bk-image-viewer-actions-inner"
     }, [_c('i', {
+      directives: [{
+        name: "bk-tooltips",
+        rawName: "v-bk-tooltips.top",
+        value: _vm.t('bk.image.zoomOut'),
+        expression: "t('bk.image.zoomOut')",
+        modifiers: {
+          "top": true
+        }
+      }],
       staticClass: "bk-icon icon-narrow-line",
       on: {
         "click": function click($event) {
@@ -54242,6 +54340,15 @@
         }
       }
     }), _c('i', {
+      directives: [{
+        name: "bk-tooltips",
+        rawName: "v-bk-tooltips.top",
+        value: _vm.t('bk.image.zoomIn'),
+        expression: "t('bk.image.zoomIn')",
+        modifiers: {
+          "top": true
+        }
+      }],
       staticClass: "bk-icon icon-enlarge-line",
       on: {
         "click": function click($event) {
@@ -54249,6 +54356,15 @@
         }
       }
     }), _c('i', {
+      directives: [{
+        name: "bk-tooltips",
+        rawName: "v-bk-tooltips.top",
+        value: _vm.t('bk.image.original'),
+        expression: "t('bk.image.original')",
+        modifiers: {
+          "top": true
+        }
+      }],
       staticClass: "bk-icon icon-normalized",
       on: {
         "click": function click($event) {
@@ -54256,6 +54372,15 @@
         }
       }
     }), _c('i', {
+      directives: [{
+        name: "bk-tooltips",
+        rawName: "v-bk-tooltips.top",
+        value: _vm.t('bk.image.rotateLeft'),
+        expression: "t('bk.image.rotateLeft')",
+        modifiers: {
+          "top": true
+        }
+      }],
       staticClass: "bk-icon icon-left-turn-line",
       on: {
         "click": function click($event) {
@@ -54263,13 +54388,31 @@
         }
       }
     }), _c('i', {
+      directives: [{
+        name: "bk-tooltips",
+        rawName: "v-bk-tooltips.top",
+        value: _vm.t('bk.image.rotateRight'),
+        expression: "t('bk.image.rotateRight')",
+        modifiers: {
+          "top": true
+        }
+      }],
       staticClass: "bk-icon icon-right-turn-line",
       on: {
         "click": function click($event) {
-          _vm.handleActions('clocelise');
+          _vm.handleActions('clockwise');
         }
       }
     }), _c('i', {
+      directives: [{
+        name: "bk-tooltips",
+        rawName: "v-bk-tooltips.top",
+        value: _vm.t('bk.image.fullScreen'),
+        expression: "t('bk.image.fullScreen')",
+        modifiers: {
+          "top": true
+        }
+      }],
       staticClass: "bk-icon icon-unfull-screen",
       on: {
         "click": function click($event) {
@@ -54353,7 +54496,6 @@
       bkImageViewer: __vue_component__$1w
     },
     mixins: [locale.mixin],
-    inheritAttrs: false,
     props: {
       src: String,
       fallback: String,
@@ -54378,6 +54520,10 @@
       zIndex: {
         type: Number,
         default: 2000
+      },
+      maskClose: {
+        type: Boolean,
+        default: true
       }
     },
     data: function data() {
@@ -54587,7 +54733,8 @@
         "is-show-title": _vm.isShowPreviewTitle,
         "initial-index": _vm.imageIndex,
         "url-list": _vm.previewSrcList,
-        "on-close": _vm.closeViewer
+        "on-close": _vm.closeViewer,
+        "mask-close": _vm.maskClose
       }
     }) : _vm._e()] : _vm._e()], 2);
   };