bk-magic-vue 2.5.9-beta.21 → 2.5.9-beta.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bk-magic-vue.css +5 -0
- package/dist/bk-magic-vue.js +137 -27
- package/dist/bk-magic-vue.min.css +1 -1
- package/dist/bk-magic-vue.min.css.gz +0 -0
- package/dist/bk-magic-vue.min.css.map +1 -1
- package/dist/bk-magic-vue.min.js +1 -1
- package/dist/bk-magic-vue.min.js.gz +0 -0
- package/dist/bk-magic-vue.min.js.map +1 -1
- package/lib/big-tree.js +10 -2
- package/lib/table-column.js +25 -20
- package/lib/table.js +102 -5
- package/lib/ui/big-tree.css +6 -0
- package/lib/ui/big-tree.min.css +1 -1
- package/lib/ui/big-tree.min.css.map +1 -1
- package/lib/ui/bk-magic-vue.css +5 -0
- package/lib/ui/bk-magic-vue.min.css +1 -1
- package/lib/ui/bk-magic-vue.min.css.gz +0 -0
- package/lib/ui/bk-magic-vue.min.css.map +1 -1
- package/package.json +1 -1
package/lib/big-tree.js
CHANGED
|
@@ -1866,6 +1866,10 @@
|
|
|
1866
1866
|
return {};
|
|
1867
1867
|
}
|
|
1868
1868
|
},
|
|
1869
|
+
fixedWidth: {
|
|
1870
|
+
type: Boolean,
|
|
1871
|
+
default: false
|
|
1872
|
+
},
|
|
1869
1873
|
lazyMethod: Function,
|
|
1870
1874
|
lazyDisabled: [Boolean, Function],
|
|
1871
1875
|
selectable: Boolean,
|
|
@@ -2567,6 +2571,10 @@
|
|
|
2567
2571
|
style: {
|
|
2568
2572
|
height: _vm.treeHeight
|
|
2569
2573
|
}
|
|
2574
|
+
}, [_c('div', {
|
|
2575
|
+
class: ['tree-wrapper', {
|
|
2576
|
+
'fixed-width': _vm.fixedWidth
|
|
2577
|
+
}]
|
|
2570
2578
|
}, [_vm.height ? _c('bk-virtual-scroll', {
|
|
2571
2579
|
ref: "virtualScroll",
|
|
2572
2580
|
attrs: {
|
|
@@ -2603,8 +2611,8 @@
|
|
|
2603
2611
|
}), (_vm.$slots.empty || _vm.useDefaultEmpty) && _vm.isSearchEmpty ? _c('div', {
|
|
2604
2612
|
staticClass: "bk-big-tree-empty"
|
|
2605
2613
|
}, [_vm._t("empty", function () {
|
|
2606
|
-
return [_vm._v("\n
|
|
2607
|
-
})], 2) : _vm._e()], 2);
|
|
2614
|
+
return [_vm._v("\n " + _vm._s(_vm.t('bk.bigTree.emptyText')) + "\n ")];
|
|
2615
|
+
})], 2) : _vm._e()], 2)]);
|
|
2608
2616
|
};
|
|
2609
2617
|
var __vue_staticRenderFns__$2 = [];
|
|
2610
2618
|
|
package/lib/table-column.js
CHANGED
|
@@ -1656,44 +1656,49 @@
|
|
|
1656
1656
|
store = _ref2.store,
|
|
1657
1657
|
$index = _ref2.$index;
|
|
1658
1658
|
var disabled = column.selectable ? !column.selectable.call(null, row, $index) : false;
|
|
1659
|
+
var beforeChange = function beforeChange() {
|
|
1660
|
+
if (store.table.shiftMulti.isShift()) {
|
|
1661
|
+
return !store.isSelected(row);
|
|
1662
|
+
}
|
|
1663
|
+
return column.beforeSelectChange(store.isSelected(row), {
|
|
1664
|
+
row: row,
|
|
1665
|
+
column: column,
|
|
1666
|
+
store: store,
|
|
1667
|
+
$index: $index
|
|
1668
|
+
});
|
|
1669
|
+
};
|
|
1659
1670
|
return h("bk-checkbox", {
|
|
1660
1671
|
"attrs": {
|
|
1661
1672
|
"checked": store.isSelected(row),
|
|
1662
1673
|
"disabled": disabled,
|
|
1663
|
-
"before-change":
|
|
1664
|
-
return column.beforeSelectChange(store.isSelected(row), {
|
|
1665
|
-
row: row,
|
|
1666
|
-
column: column,
|
|
1667
|
-
store: store,
|
|
1668
|
-
$index: $index
|
|
1669
|
-
});
|
|
1670
|
-
}
|
|
1674
|
+
"before-change": beforeChange
|
|
1671
1675
|
},
|
|
1672
1676
|
"nativeOn": {
|
|
1673
1677
|
"click": function () {
|
|
1674
1678
|
var _click2 = _asyncToGenerator( _regeneratorRuntime().mark(function _callee2(event) {
|
|
1675
|
-
var result;
|
|
1679
|
+
var isShift, result;
|
|
1676
1680
|
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
1677
1681
|
while (1) switch (_context2.prev = _context2.next) {
|
|
1678
1682
|
case 0:
|
|
1679
1683
|
event.stopPropagation();
|
|
1684
|
+
event.preventDefault();
|
|
1685
|
+
event.stopImmediatePropagation();
|
|
1680
1686
|
if (!disabled) {
|
|
1681
|
-
_context2.next =
|
|
1687
|
+
_context2.next = 5;
|
|
1682
1688
|
break;
|
|
1683
1689
|
}
|
|
1684
1690
|
return _context2.abrupt("return");
|
|
1685
|
-
case 3:
|
|
1686
|
-
_context2.next = 5;
|
|
1687
|
-
return column.beforeSelectChange(store.isSelected(row), {
|
|
1688
|
-
row: row,
|
|
1689
|
-
column: column,
|
|
1690
|
-
store: store,
|
|
1691
|
-
$index: $index
|
|
1692
|
-
});
|
|
1693
1691
|
case 5:
|
|
1692
|
+
isShift = store.table.shiftMulti.isShift();
|
|
1693
|
+
if (isShift) {
|
|
1694
|
+
store.table.$el.style.setProperty('user-select', 'none');
|
|
1695
|
+
}
|
|
1696
|
+
_context2.next = 9;
|
|
1697
|
+
return beforeChange();
|
|
1698
|
+
case 9:
|
|
1694
1699
|
result = _context2.sent;
|
|
1695
|
-
result !== false && store.commit('rowSelectedChanged', row);
|
|
1696
|
-
case
|
|
1700
|
+
result !== false && store.commit('rowSelectedChanged', row, $index);
|
|
1701
|
+
case 11:
|
|
1697
1702
|
case "end":
|
|
1698
1703
|
return _context2.stop();
|
|
1699
1704
|
}
|
package/lib/table.js
CHANGED
|
@@ -3173,9 +3173,23 @@
|
|
|
3173
3173
|
this.table.$emit('current-change', row, oldCurrentRow);
|
|
3174
3174
|
}
|
|
3175
3175
|
},
|
|
3176
|
-
rowSelectedChanged: function rowSelectedChanged(states, row) {
|
|
3176
|
+
rowSelectedChanged: function rowSelectedChanged(states, row, index) {
|
|
3177
|
+
var _this5 = this;
|
|
3177
3178
|
var changed = _toggleRowSelection(states, row);
|
|
3178
3179
|
var selection = states.selection;
|
|
3180
|
+
if (this.table.shiftMulti.setStore(row, index)) {
|
|
3181
|
+
var _this$table$shiftMult = this.table.shiftMulti.getStore(),
|
|
3182
|
+
start = _this$table$shiftMult.start,
|
|
3183
|
+
end = _this$table$shiftMult.end;
|
|
3184
|
+
(this.table.data.slice(start.index, end.index + 1) || []).forEach(function (child) {
|
|
3185
|
+
if (!states.selection.includes(child)) {
|
|
3186
|
+
states.selection.push(child);
|
|
3187
|
+
}
|
|
3188
|
+
});
|
|
3189
|
+
setTimeout(function () {
|
|
3190
|
+
_this5.table.$el.style.setProperty('user-select', 'inherit');
|
|
3191
|
+
});
|
|
3192
|
+
}
|
|
3179
3193
|
if (changed) {
|
|
3180
3194
|
var table = this.table;
|
|
3181
3195
|
table.$emit('selection-change', selection ? selection.slice() : []);
|
|
@@ -3245,13 +3259,13 @@
|
|
|
3245
3259
|
}, {
|
|
3246
3260
|
key: "isAllSelectionDisabled",
|
|
3247
3261
|
get: function get() {
|
|
3248
|
-
var
|
|
3262
|
+
var _this6 = this;
|
|
3249
3263
|
if (!this.states.selectable) {
|
|
3250
3264
|
return false;
|
|
3251
3265
|
}
|
|
3252
3266
|
var isEmpty = this.states.data && this.states.data.length === 0;
|
|
3253
3267
|
var isDisabled = this.states.data.every(function (row, index) {
|
|
3254
|
-
return !
|
|
3268
|
+
return !_this6.states.selectable(row, index);
|
|
3255
3269
|
});
|
|
3256
3270
|
return isEmpty || isDisabled;
|
|
3257
3271
|
}
|
|
@@ -3739,7 +3753,7 @@
|
|
|
3739
3753
|
var rows = this.table.$refs.tableBody.$refs.row || [];
|
|
3740
3754
|
var rowsHeight = rows.reduce(function (accumulator, row) {
|
|
3741
3755
|
var key = row.getAttribute('data-table-row');
|
|
3742
|
-
accumulator[key] = row.
|
|
3756
|
+
accumulator[key] = row.getBoundingClientRect().height;
|
|
3743
3757
|
return accumulator;
|
|
3744
3758
|
}, {});
|
|
3745
3759
|
if (isShallowEqual(rowsHeight, this.rowsHeight)) return;
|
|
@@ -13456,6 +13470,81 @@
|
|
|
13456
13470
|
|
|
13457
13471
|
setInstaller(__vue_component__$h);
|
|
13458
13472
|
|
|
13473
|
+
var shiftMultiSelect = (function (props) {
|
|
13474
|
+
var isShiftKeyDown = false;
|
|
13475
|
+
var store = {
|
|
13476
|
+
start: null,
|
|
13477
|
+
end: null
|
|
13478
|
+
};
|
|
13479
|
+
var handleKeyDown = function handleKeyDown(e) {
|
|
13480
|
+
if (e.key === 'Shift') {
|
|
13481
|
+
isShiftKeyDown = true;
|
|
13482
|
+
}
|
|
13483
|
+
};
|
|
13484
|
+
var handleKeyUp = function handleKeyUp(e) {
|
|
13485
|
+
if (e.key === 'Shift') {
|
|
13486
|
+
isShiftKeyDown = false;
|
|
13487
|
+
clearStore();
|
|
13488
|
+
}
|
|
13489
|
+
};
|
|
13490
|
+
var setStore = function setStore(row, index) {
|
|
13491
|
+
if (!isShiftKeyDown) {
|
|
13492
|
+
return false;
|
|
13493
|
+
}
|
|
13494
|
+
if (store.start === null && store.end === null) {
|
|
13495
|
+
store.start = {
|
|
13496
|
+
index: index,
|
|
13497
|
+
row: row
|
|
13498
|
+
};
|
|
13499
|
+
return false;
|
|
13500
|
+
}
|
|
13501
|
+
store.end = {
|
|
13502
|
+
index: index,
|
|
13503
|
+
row: row
|
|
13504
|
+
};
|
|
13505
|
+
return true;
|
|
13506
|
+
};
|
|
13507
|
+
var clearStore = function clearStore() {
|
|
13508
|
+
store.start = null;
|
|
13509
|
+
store.end = null;
|
|
13510
|
+
};
|
|
13511
|
+
var init = function init() {
|
|
13512
|
+
if (props.shiftMultiChecked) {
|
|
13513
|
+
window.addEventListener('keydown', handleKeyDown);
|
|
13514
|
+
window.addEventListener('keyup', handleKeyUp);
|
|
13515
|
+
}
|
|
13516
|
+
};
|
|
13517
|
+
var getStore = function getStore() {
|
|
13518
|
+
var start = store.start,
|
|
13519
|
+
end = store.end;
|
|
13520
|
+
var startRow = start.index < end.index ? start : end;
|
|
13521
|
+
var endRow = start.index < end.index ? end : start;
|
|
13522
|
+
return {
|
|
13523
|
+
start: startRow,
|
|
13524
|
+
end: endRow
|
|
13525
|
+
};
|
|
13526
|
+
};
|
|
13527
|
+
var onUnmounted = function onUnmounted() {
|
|
13528
|
+
if (props.shiftMultiChecked) {
|
|
13529
|
+
window.removeEventListener('keydown', handleKeyDown);
|
|
13530
|
+
window.removeEventListener('keyup', handleKeyUp);
|
|
13531
|
+
clearStore();
|
|
13532
|
+
}
|
|
13533
|
+
};
|
|
13534
|
+
var isShift = function isShift() {
|
|
13535
|
+
return isShiftKeyDown;
|
|
13536
|
+
};
|
|
13537
|
+
return {
|
|
13538
|
+
isShiftKeyDown: isShiftKeyDown,
|
|
13539
|
+
isShift: isShift,
|
|
13540
|
+
onUnmounted: onUnmounted,
|
|
13541
|
+
setStore: setStore,
|
|
13542
|
+
getStore: getStore,
|
|
13543
|
+
clearStore: clearStore,
|
|
13544
|
+
init: init
|
|
13545
|
+
};
|
|
13546
|
+
});
|
|
13547
|
+
|
|
13459
13548
|
var tableIdSeed = 1;
|
|
13460
13549
|
var script$g = {
|
|
13461
13550
|
name: 'bk-table',
|
|
@@ -13604,6 +13693,10 @@
|
|
|
13604
13693
|
default: function _default() {
|
|
13605
13694
|
return {};
|
|
13606
13695
|
}
|
|
13696
|
+
},
|
|
13697
|
+
shiftMultiChecked: {
|
|
13698
|
+
type: Boolean,
|
|
13699
|
+
default: false
|
|
13607
13700
|
}
|
|
13608
13701
|
},
|
|
13609
13702
|
data: function data() {
|
|
@@ -13619,6 +13712,7 @@
|
|
|
13619
13712
|
showHeader: this.showHeader
|
|
13620
13713
|
});
|
|
13621
13714
|
this.pagination.showTotalCount = !!this.showPaginationInfo;
|
|
13715
|
+
var shiftMulti = shiftMultiSelect(this);
|
|
13622
13716
|
return {
|
|
13623
13717
|
layout: layout,
|
|
13624
13718
|
store: store,
|
|
@@ -13631,7 +13725,8 @@
|
|
|
13631
13725
|
},
|
|
13632
13726
|
isGroup: false,
|
|
13633
13727
|
scrollPosition: 'left',
|
|
13634
|
-
scrollThrottle: false
|
|
13728
|
+
scrollThrottle: false,
|
|
13729
|
+
shiftMulti: shiftMulti
|
|
13635
13730
|
};
|
|
13636
13731
|
},
|
|
13637
13732
|
computed: {
|
|
@@ -13812,6 +13907,7 @@
|
|
|
13812
13907
|
this.debouncedUpdateLayout = debounce(50, function () {
|
|
13813
13908
|
return _this2.doLayout();
|
|
13814
13909
|
});
|
|
13910
|
+
this.shiftMulti.init();
|
|
13815
13911
|
},
|
|
13816
13912
|
mounted: function mounted() {
|
|
13817
13913
|
var _this3 = this;
|
|
@@ -13836,6 +13932,7 @@
|
|
|
13836
13932
|
},
|
|
13837
13933
|
beforeDestroy: function beforeDestroy() {
|
|
13838
13934
|
this.$destroyed = true;
|
|
13935
|
+
this.shiftMulti.onUnmounted();
|
|
13839
13936
|
if (this.resizeListener) removeResizeListener(this.$el, this.resizeListener);
|
|
13840
13937
|
},
|
|
13841
13938
|
methods: {
|
package/lib/ui/big-tree.css
CHANGED
package/lib/ui/big-tree.min.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.bk-big-tree{overflow:auto}.bk-big-tree::-webkit-scrollbar{width:6px;height:6px}.bk-big-tree::-webkit-scrollbar-thumb{min-height:24px;border-radius:3px;background-color:#dcdee5}.bk-big-tree.with-virtual-scroll .bk-big-tree-empty{position:absolute;top:0;left:0;width:100%;height:100%}.bk-big-tree .bk-big-tree-empty{text-align:center;font-size:14px;color:#63656e}.bk-big-tree--small .bk-big-tree-node .node-content{font-size:12px}.bk-big-tree-node{position:relative;height:32px;padding-left:calc(var(--level)*var(--padding));line-height:32px;font-size:0;cursor:pointer}.bk-big-tree-node.has-link-line{padding-left:0;margin-left:calc(var(--level)*var(--padding))}.bk-big-tree-node.has-link-line:not(.is-root):before{content:"";position:absolute;width:calc(var(--padding) - 8px);height:0;border-bottom:1px dashed #c3cdd7;left:calc(10px - var(--padding));top:15px;z-index:1;pointer-events:none}.bk-big-tree-node.has-link-line:after{position:absolute;top:24px;left:10px;width:0;height:calc(var(--line)*1px - 8px);border-left:1px dashed #c3cdd7;content:"";pointer-events:none;z-index:1}.bk-big-tree-node.has-link-line.is-leaf{padding-left:8px;margin-left:calc(var(--level)*var(--padding) + 16px)}.bk-big-tree-node.has-link-line.is-leaf:before{width:calc(var(--padding) + 6px);left:calc(-6px - var(--padding))}.bk-big-tree-node:hover{background-color:#f1f7ff}.bk-big-tree-node.is-selected{background-color:#e1ecff}.bk-big-tree-node.is-selected .node-icon{color:#fff;background-color:#3a84ff}.bk-big-tree-node.is-selected .node-content{color:#3a84ff}.bk-big-tree-node.is-leaf{padding-left:calc(var(--level)*var(--padding) + 22px)}.bk-big-tree-node.is-disabled{cursor:not-allowed}.bk-big-tree-node .node-options{height:100%}.bk-big-tree-node .node-options .node-loading{display:inline-block;vertical-align:middle;width:20px;height:20px;margin:0 2px 0 0;background-image:url(images/spinner.svg);background-size:100% 100%}.bk-big-tree-node .node-options .node-folder-icon{display:inline-block;vertical-align:middle;position:relative;width:20px;height:20px;margin:0 2px 0 0;line-height:20px;text-align:center;font-size:12px;color:#979ba5;z-index:2}.bk-big-tree-node .node-options .node-folder-icon:hover{color:#63656e}.bk-big-tree-node .node-options .node-checkbox{display:inline-block;vertical-align:middle;position:relative;width:16px;height:16px;margin:0 8px 0 0;border:1px solid #979ba5;border-radius:2px}.bk-big-tree-node .node-options .node-checkbox.is-checked{border-color:#3a84ff;background-color:#3a84ff;background-clip:border-box}.bk-big-tree-node .node-options .node-checkbox.is-checked:after{content:"";position:absolute;top:1px;left:4px;width:4px;height:8px;border:2px solid #fff;border-left:0;border-top:0;-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate(45deg) scaleY(1);transform:rotate(45deg) scaleY(1)}.bk-big-tree-node .node-options .node-checkbox.is-checked.is-disabled{background-color:#dcdee5}.bk-big-tree-node .node-options .node-checkbox.is-disabled{border-color:#dcdee5;cursor:not-allowed}.bk-big-tree-node .node-options .node-checkbox.is-indeterminate{border-width:7px 4px;border-color:#3a84ff;background-color:#fff;background-clip:content-box}.bk-big-tree-node .node-options .node-checkbox.is-indeterminate:after{visibility:hidden}.bk-big-tree-node .node-options .node-icon{display:inline-block;vertical-align:middle;margin:0 8px 0 0;font-size:18px}.bk-big-tree-node .node-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
|
|
1
|
+
.bk-big-tree{overflow:auto}.bk-big-tree::-webkit-scrollbar{width:6px;height:6px}.bk-big-tree::-webkit-scrollbar-thumb{min-height:24px;border-radius:3px;background-color:#dcdee5}.bk-big-tree.with-virtual-scroll .bk-big-tree-empty{position:absolute;top:0;left:0;width:100%;height:100%}.bk-big-tree .fixed-width{width:-webkit-max-content;width:-moz-max-content;width:max-content}.bk-big-tree .bk-big-tree-empty{text-align:center;font-size:14px;color:#63656e}.bk-big-tree--small .bk-big-tree-node .node-content{font-size:12px}.bk-big-tree-node{position:relative;height:32px;padding-left:calc(var(--level)*var(--padding));line-height:32px;font-size:0;cursor:pointer}.bk-big-tree-node.has-link-line{padding-left:0;margin-left:calc(var(--level)*var(--padding))}.bk-big-tree-node.has-link-line:not(.is-root):before{content:"";position:absolute;width:calc(var(--padding) - 8px);height:0;border-bottom:1px dashed #c3cdd7;left:calc(10px - var(--padding));top:15px;z-index:1;pointer-events:none}.bk-big-tree-node.has-link-line:after{position:absolute;top:24px;left:10px;width:0;height:calc(var(--line)*1px - 8px);border-left:1px dashed #c3cdd7;content:"";pointer-events:none;z-index:1}.bk-big-tree-node.has-link-line.is-leaf{padding-left:8px;margin-left:calc(var(--level)*var(--padding) + 16px)}.bk-big-tree-node.has-link-line.is-leaf:before{width:calc(var(--padding) + 6px);left:calc(-6px - var(--padding))}.bk-big-tree-node:hover{background-color:#f1f7ff}.bk-big-tree-node.is-selected{background-color:#e1ecff}.bk-big-tree-node.is-selected .node-icon{color:#fff;background-color:#3a84ff}.bk-big-tree-node.is-selected .node-content{color:#3a84ff}.bk-big-tree-node.is-leaf{padding-left:calc(var(--level)*var(--padding) + 22px)}.bk-big-tree-node.is-disabled{cursor:not-allowed}.bk-big-tree-node .node-options{height:100%}.bk-big-tree-node .node-options .node-loading{display:inline-block;vertical-align:middle;width:20px;height:20px;margin:0 2px 0 0;background-image:url(images/spinner.svg);background-size:100% 100%}.bk-big-tree-node .node-options .node-folder-icon{display:inline-block;vertical-align:middle;position:relative;width:20px;height:20px;margin:0 2px 0 0;line-height:20px;text-align:center;font-size:12px;color:#979ba5;z-index:2}.bk-big-tree-node .node-options .node-folder-icon:hover{color:#63656e}.bk-big-tree-node .node-options .node-checkbox{display:inline-block;vertical-align:middle;position:relative;width:16px;height:16px;margin:0 8px 0 0;border:1px solid #979ba5;border-radius:2px}.bk-big-tree-node .node-options .node-checkbox.is-checked{border-color:#3a84ff;background-color:#3a84ff;background-clip:border-box}.bk-big-tree-node .node-options .node-checkbox.is-checked:after{content:"";position:absolute;top:1px;left:4px;width:4px;height:8px;border:2px solid #fff;border-left:0;border-top:0;-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate(45deg) scaleY(1);transform:rotate(45deg) scaleY(1)}.bk-big-tree-node .node-options .node-checkbox.is-checked.is-disabled{background-color:#dcdee5}.bk-big-tree-node .node-options .node-checkbox.is-disabled{border-color:#dcdee5;cursor:not-allowed}.bk-big-tree-node .node-options .node-checkbox.is-indeterminate{border-width:7px 4px;border-color:#3a84ff;background-color:#fff;background-clip:content-box}.bk-big-tree-node .node-options .node-checkbox.is-indeterminate:after{visibility:hidden}.bk-big-tree-node .node-options .node-icon{display:inline-block;vertical-align:middle;margin:0 8px 0 0;font-size:18px}.bk-big-tree-node .node-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
|
|
2
2
|
/*# sourceMappingURL=big-tree.min.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["big-tree.css","mixins/scroller.css"],"names":[],"mappings":"AAUA,aACI,
|
|
1
|
+
{"version":3,"sources":["big-tree.css","mixins/scroller.css"],"names":[],"mappings":"AAUA,aACI,aAwBJ,CCzBI,gCACI,SAAU,CACV,UACJ,CACA,sCACI,eAAgB,CAChB,iBAAkB,CAClB,wBACJ,CDJI,oDACI,iBAAkB,CAClB,KAAM,CACN,MAAO,CACP,UAAW,CACX,WACJ,CAEJ,0BACI,yBAAkB,CAAlB,sBAAkB,CAAlB,iBACJ,CACA,gCACI,iBAAkB,CAClB,cAAe,CACf,aACJ,CAEI,oDACI,cACJ,CAYR,kBACI,iBAAkB,CAClB,WAAY,CACZ,8CAAiD,CACjD,gBAAiB,CACjB,WAAY,CACZ,cAqIJ,CAnII,gCACI,cAAe,CACf,6CA+BJ,CA9BI,qDACI,UAAW,CACX,iBAAkB,CAClB,gCAAiC,CACjC,QAAS,CACT,gCAAiC,CACjC,gCAA8C,CAC9C,QAAS,CACT,SAAU,CACV,mBACJ,CACA,sCACI,iBAAkB,CAClB,QAAS,CACT,SAA6B,CAC7B,OAAQ,CACR,kCAAqC,CACrC,8BAA+B,CAC/B,UAAW,CACX,mBAAoB,CACpB,SACJ,CACA,wCACI,gBAAiB,CACjB,oDAKJ,CAJI,+CACI,gCAAqD,CACrD,gCACJ,CAGR,wBACI,wBACJ,CACA,8BACI,wBAQJ,CAPI,yCACI,UAAW,CACX,wBACJ,CACA,4CACI,aACJ,CAEJ,0BACI,qDACJ,CACA,8BACI,kBACJ,CACA,gCACI,WAwEJ,CAvEI,8CArGJ,oBAAqB,CACrB,qBAAsB,CAsGd,UAAoB,CACpB,WAAsB,CACtB,gBAAiC,CACjC,wCAA6C,CAC7C,yBACJ,CACA,kDA7GJ,oBAAqB,CACrB,qBAAsB,CA8Gd,iBAAkB,CAClB,UAAoB,CACpB,WAAsB,CACtB,gBAAiC,CACjC,gBAA2B,CAC3B,iBAAkB,CAClB,cAAe,CACf,aAAc,CACd,SAIJ,CAHI,wDACI,aACJ,CAEJ,+CA5HJ,oBAAqB,CACrB,qBAAsB,CA6Hd,iBAAkB,CAClB,UAAW,CACX,WAAY,CACZ,gBAAkC,CAClC,wBAAyB,CACzB,iBAmCJ,CAlCI,0DACI,oBAAqB,CACrB,wBAAyB,CACzB,0BAiBJ,CAhBI,gEACI,UAAW,CACX,iBAAkB,CAClB,OAAQ,CACR,QAAS,CACT,SAAU,CACV,UAAW,CACX,qBAAsB,CACtB,aAAc,CACd,YAAa,CACb,+BAAwB,CAAxB,uBAAwB,CACxB,yCAAkC,CAAlC,iCACJ,CACA,sEACI,wBACJ,CAEJ,2DACI,oBAAqB,CACrB,kBACJ,CACA,gEACI,oBAAqB,CACrB,oBAAqB,CACrB,qBAAsB,CACtB,2BAIJ,CAHI,sEACI,iBACJ,CAGR,2CAvKJ,oBAAqB,CACrB,qBAAsB,CAwKd,gBAAkC,CAClC,cACJ,CAEJ,gCAlLA,eAAgB,CAChB,sBAAuB,CACvB,kBAAmB,CAkLf,cACJ","file":"big-tree.min.css","sourcesContent":["@import './mixins/scroller.css';\n@define-mixin ellipsis {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n@define-mixin inlineBlock $align: middle {\n display: inline-block;\n vertical-align: $align;\n}\n.bk-big-tree {\n overflow: auto;\n @mixin scroller;\n &.with-virtual-scroll {\n .bk-big-tree-empty {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n }\n .fixed-width {\n width: max-content;\n }\n .bk-big-tree-empty {\n text-align: center;\n font-size: 14px;\n color: #63656e;\n }\n &--small {\n .bk-big-tree-node .node-content {\n font-size: 12px;\n }\n }\n}\n\n/* 树伸缩触发器 icon */\n$triggerWidth: 20px; \n$triggerHeight: 20px; \n$triggerMarginRight: 2px;\n\n/* 节点 icon/checkbox */\n$nodeIconMarginRight: 8px;\n\n.bk-big-tree-node {\n position: relative;\n height: 32px;\n padding-left: calc(var(--level) * var(--padding));\n line-height: 32px;\n font-size: 0;\n cursor: pointer;\n\n &.has-link-line {\n padding-left: 0;\n margin-left: calc(var(--level) * var(--padding));\n &:not(.is-root):before {\n content: \"\";\n position: absolute;\n width: calc(var(--padding) - 8px);\n height: 0;\n border-bottom: 1px dashed #c3cdd7;\n left: calc(($triggerWidth/2) - var(--padding));\n top: 15px;\n z-index: 1;\n pointer-events: none;\n }\n &:after {\n position: absolute;\n top: 24px;\n left: calc($triggerWidth / 2);\n width: 0;\n height: calc(var(--line) * 1px - 8px);\n border-left: 1px dashed #c3cdd7;\n content: \"\";\n pointer-events: none;\n z-index: 1;\n }\n &.is-leaf {\n padding-left: 8px;\n margin-left: calc(var(--level) * var(--padding) + ($triggerWidth - 4px));\n &:before {\n width: calc(var(--padding) + ($triggerWidth/2 - 4px));\n left: calc(0px - var(--padding) - ($triggerWidth/2 - 4px));\n }\n }\n }\n &:hover {\n background-color: #f1f7ff;\n }\n &.is-selected {\n background-color: #e1ecff;\n .node-icon {\n color: #fff;\n background-color: #3a84ff;\n }\n .node-content {\n color: #3a84ff;\n }\n }\n &.is-leaf {\n padding-left: calc(var(--level) * var(--padding) + $triggerWidth + $triggerMarginRight);\n }\n &.is-disabled {\n cursor: not-allowed;\n }\n .node-options {\n height: 100%;\n .node-loading {\n @mixin inlineBlock;\n width: $triggerWidth;\n height: $triggerHeight;\n margin: 0 $triggerMarginRight 0 0;\n background-image: url(\"./images/spinner.svg\");\n background-size: 100% 100%;\n }\n .node-folder-icon {\n @mixin inlineBlock;\n position: relative;\n width: $triggerWidth;\n height: $triggerHeight;\n margin: 0 $triggerMarginRight 0 0;\n line-height: $triggerHeight;\n text-align: center;\n font-size: 12px;\n color: #979ba5;\n z-index: 2;\n &:hover {\n color: #63656e;\n }\n }\n .node-checkbox {\n @mixin inlineBlock;\n position: relative;\n width: 16px;\n height: 16px;\n margin: 0 $nodeIconMarginRight 0 0;\n border: 1px solid #979ba5;\n border-radius: 2px;\n &.is-checked {\n border-color: #3a84ff;\n background-color: #3a84ff;\n background-clip: border-box;\n &:after {\n content: \"\";\n position: absolute;\n top: 1px;\n left: 4px;\n width: 4px;\n height: 8px;\n border: 2px solid #fff;\n border-left: 0;\n border-top: 0;\n transform-origin: center;\n transform: rotate(45deg) scaleY(1);\n }\n &.is-disabled {\n background-color: #dcdee5;\n }\n }\n &.is-disabled {\n border-color: #dcdee5;\n cursor: not-allowed;\n }\n &.is-indeterminate {\n border-width: 7px 4px;\n border-color: #3a84ff;\n background-color: #fff;\n background-clip: content-box;\n &:after {\n visibility: hidden;\n }\n }\n }\n .node-icon {\n @mixin inlineBlock;\n margin: 0 $nodeIconMarginRight 0 0;\n font-size: 18px;\n }\n }\n .node-content {\n @mixin ellipsis;\n font-size: 14px;\n }\n}\n","/**\n * @file scroller mixin\n *\n * usage:\n * @mixin scroller;\n * @mixin scroller red;\n * @mixin scroller green, 2px;\n */\n\n@define-mixin scroller $backgroundColor: #dcdee5, $width: 6px {\n &::-webkit-scrollbar {\n width: 6px;\n height: 6px;\n }\n &::-webkit-scrollbar-thumb {\n min-height: 24px;\n border-radius: 3px;\n background-color: $backgroundColor;\n }\n}\n"]}
|
package/lib/ui/bk-magic-vue.css
CHANGED
|
@@ -14307,6 +14307,11 @@ th.bk-table-column-selection .cell, th.bk-table-column-expand .cell, td.bk-table
|
|
|
14307
14307
|
width:100%;
|
|
14308
14308
|
height:100%;
|
|
14309
14309
|
}
|
|
14310
|
+
.bk-big-tree .fixed-width{
|
|
14311
|
+
width:-webkit-max-content;
|
|
14312
|
+
width:-moz-max-content;
|
|
14313
|
+
width:max-content;
|
|
14314
|
+
}
|
|
14310
14315
|
.bk-big-tree .bk-big-tree-empty{
|
|
14311
14316
|
text-align:center;
|
|
14312
14317
|
font-size:14px;
|