bkui-vue 0.0.3-beta.2-1 → 0.0.3-beta.2-2

package/lib/table/index.js

@@ -111,7 +111,7 @@ function defineProperty_defineProperty(obj, key, value) {
 ;// CONCATENATED MODULE: external "vue"
 var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
-const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["isVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isVNode, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["toRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRef, ["toRefs"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRefs, ["unref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.unref, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch });
+const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["isVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isVNode, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["resolveComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.resolveComponent, ["toRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRef, ["toRefs"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRefs, ["unref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.unref, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch });
 ;// CONCATENATED MODULE: ../../packages/table/src/const.ts
 
 /*
@@ -4043,10 +4043,12 @@ var useClass = function useClass(props, targetColumns, root, TableSchema, pageDa
   });
   var config = resolveHeadConfig(props);
   var headStyle = (0,external_vue_namespaceObject.computed)(function () {
+    var _props$thead$color, _props$thead;
     return {
       '--row-height': "".concat(resolvePropVal(config, 'height', ['thead']), "px"),
       '--scroll-head-left': "-".concat(TableSchema.formatData.layout.translateX, "px"),
-      '--scroll-left': "".concat(TableSchema.formatData.layout.translateX, "px")
+      '--scroll-left': "".concat(TableSchema.formatData.layout.translateX, "px"),
+      '--background-color': DEF_COLOR[(_props$thead$color = (_props$thead = props.thead) === null || _props$thead === void 0 ? void 0 : _props$thead.color) !== null && _props$thead$color !== void 0 ? _props$thead$color : IHeadColor.DEF1]
     };
   });
   var contentClass = defineProperty_defineProperty({}, resolveClassName('table-body'), true);
@@ -5098,6 +5100,7 @@ function head_filter_isSlot(s) {
       var _filter$value$checked, _filter$value;
       return (_filter$value$checked = (_filter$value = filter.value) === null || _filter$value === void 0 ? void 0 : _filter$value.checked) !== null && _filter$value$checked !== void 0 ? _filter$value$checked : [];
     });
+    var searchValue = (0,external_vue_namespaceObject.ref)('');
     var state = (0,external_vue_namespaceObject.reactive)({
       isOpen: false,
       checked: checked.value
@@ -5128,21 +5131,28 @@ function head_filter_isSlot(s) {
       isOpen && setTimeout(function () {
         refVirtualRender.value.reset();
       });
+      if (!isOpen) {
+        searchValue.value = '';
+      }
     };
     var theme = "light ".concat(resolveClassName('table-head-filter'));
     var localData = (0,external_vue_namespaceObject.computed)(function () {
       var _filter$value$list = filter.value.list,
         list = _filter$value$list === void 0 ? [] : _filter$value$list;
-      return list;
+      var filterList = list.filter(function (l) {
+        return getRegExp(searchValue.value).test(l.value);
+      });
+      console.log(' filterList: ', filterList);
+      return filterList;
     });
-    var getRegExp = function getRegExp(searchValue) {
+    var getRegExp = function getRegExp(val) {
       var flags = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'ig';
-      return new RegExp("".concat(searchValue).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), flags);
+      return new RegExp("".concat(val).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), flags);
     };
     var defaultFilterFn = function defaultFilterFn(checked, row) {
       var match = filter.value.match;
       var matchText = getRowText(row, resolvePropVal(column, 'field', [column, row]));
-      if (match === 'full') {
+      if (match !== 'fuzzy') {
         return checked.includes(matchText);
       }
       return checked.some(function (str) {
@@ -5306,7 +5316,14 @@ function head_filter_isSlot(s) {
         content: function content() {
           return (0,external_vue_namespaceObject.createVNode)("div", {
             "class": headFilterContentClass
-          }, [(0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject.BkCheckboxGroup, {
+          }, [(0,external_vue_namespaceObject.createVNode)("div", {
+            "style": "padding: 4px 10px;"
+          }, [(0,external_vue_namespaceObject.createVNode)((0,external_vue_namespaceObject.resolveComponent)("bk-input"), {
+            "modelValue": searchValue.value,
+            "onUpdate:modelValue": function onUpdateModelValue($event) {
+              return searchValue.value = $event;
+            }
+          }, null)]), (0,external_vue_namespaceObject.createVNode)(external_checkbox_namespaceObject.BkCheckboxGroup, {
             "class": "content-list"
           }, {
             "default": function _default() {
@@ -6445,7 +6462,6 @@ function table_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { va
       hasFooter = _useClass.hasFooter,
       footerStyle = _useClass.footerStyle,
       tableBodyClass = _useClass.tableBodyClass,
-      fixedBottomBorder = _useClass.fixedBottomBorder,
       resizeColumnClass = _useClass.resizeColumnClass,
       tableBodyContentClass = _useClass.tableBodyContentClass,
       loadingRowClass = _useClass.loadingRowClass,
@@ -6625,9 +6641,8 @@ function table_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { va
           return renderTableBodySchema(scope.data);
         },
         afterSection: function afterSection() {
-          return [(0,external_vue_namespaceObject.createVNode)("div", {
-            "class": fixedBottomBorder.value
-          }, null), (0,external_vue_namespaceObject.createVNode)("div", {
+          return [// <div class={fixedBottomBorder.value}></div>,
+          (0,external_vue_namespaceObject.createVNode)("div", {
             "class": resizeColumnClass,
             "style": resizeColumnStyle.value
           }, null)];

package/lib/table/table.css

@@ -1015,6 +1015,7 @@
   position: relative;
   overflow: auto;
   scrollbar-gutter: stable;
+  border-bottom: 1px solid #dcdee5;
 }
 .bk-table .bk-table-body::-webkit-scrollbar {
   width: 5px;
@@ -1301,6 +1302,7 @@
   z-index: 2;
   scrollbar-gutter: stable;
   overflow: hidden;
+  background-color: var(--background-color);
 }
 .bk-table .bk-table-head .col-resize-drag {
   position: absolute;
@@ -1326,10 +1328,8 @@
   font-size: 14px;
   cursor: pointer;
   background: #fafbfd;
-  border-bottom: 1px solid #dcdee5;
   border-left: 1px solid #dcdee5;
   border-radius: 0 2px 0 0;
-  transform: translateX(var(--scroll-left));
   justify-content: center;
   align-items: center;
 }
@@ -1347,8 +1347,10 @@
 .bk-table .bk-table-footer.is-hidden {
   display: none;
 }
-.bk-table.bordered-row td,
-.bk-table.bordered-row th {
+.bk-table.bordered-row .bk-table-head {
+  border-bottom: 1px solid #dcdee5;
+}
+.bk-table.bordered-row td {
   border-bottom: 1px solid #dcdee5;
 }
 .bk-table.bordered-row tr:last-child td {
@@ -1380,10 +1382,14 @@
 .bk-table.bordered-col td:last-child {
   border-right: none;
 }
+.bk-table th,
+.bk-table td {
+  border-right: 1px solid transparent;
+}
 .bk-table.bordered-none th,
 .bk-table.bordered-none td {
   border-top: none;
-  border-right: none;
+  border-right: 1px solid transparent;
   border-bottom: none;
   border-left: none;
 }

package/lib/table/table.less

@@ -36,6 +36,7 @@
     position: relative;
     overflow: auto;
     scrollbar-gutter: stable;
+    border-bottom: 1px solid @table-border-color;
 
     &::-webkit-scrollbar {
       width: 5px;
@@ -335,6 +336,7 @@
     z-index: 2;
     scrollbar-gutter: stable;
     overflow: hidden;
+    background-color: var(--background-color);
 
     .col-resize-drag {
       position: absolute;
@@ -364,10 +366,10 @@
 
       background: @table-head-bg-color;
       //border-right: 1px solid @table-border-color;
-      border-bottom: 1px solid @table-border-color;
+      // border-bottom: 1px solid @table-border-color;
       border-left: 1px solid @table-border-color;
       border-radius: 0 2px 0 0;
-      transform: translateX(var(--scroll-left));
+      // transform: translateX(var(--scroll-left));
       justify-content: center;
       align-items: center;
 
@@ -391,8 +393,11 @@
   }
 
   &.bordered-row {
-    td,
-    th {
+    .@{bk-prefix}-table-head {
+      border-bottom: 1px solid @table-border-color;
+    }
+
+    td {
       border-bottom: 1px solid @table-border-color;
     }
 
@@ -445,11 +450,15 @@
 
   }
 
+  th, td {
+    border-right: 1px solid transparent;
+  }
+
   &.bordered-none {
     th,
     td {
       border-top: none;
-      border-right: none;
+      border-right: 1px solid transparent;
       border-bottom: none;
       border-left: none;
     }

package/lib/table/table.variable.css

@@ -1141,6 +1141,7 @@
   position: relative;
   overflow: auto;
   scrollbar-gutter: stable;
+  border-bottom: 1px solid #dcdee5;
 }
 .bk-table .bk-table-body::-webkit-scrollbar {
   width: 5px;
@@ -1427,6 +1428,7 @@
   z-index: 2;
   scrollbar-gutter: stable;
   overflow: hidden;
+  background-color: var(--background-color);
 }
 .bk-table .bk-table-head .col-resize-drag {
   position: absolute;
@@ -1452,10 +1454,8 @@
   font-size: 14px;
   cursor: pointer;
   background: #fafbfd;
-  border-bottom: 1px solid #dcdee5;
   border-left: 1px solid #dcdee5;
   border-radius: 0 2px 0 0;
-  transform: translateX(var(--scroll-left));
   justify-content: center;
   align-items: center;
 }
@@ -1473,8 +1473,10 @@
 .bk-table .bk-table-footer.is-hidden {
   display: none;
 }
-.bk-table.bordered-row td,
-.bk-table.bordered-row th {
+.bk-table.bordered-row .bk-table-head {
+  border-bottom: 1px solid #dcdee5;
+}
+.bk-table.bordered-row td {
   border-bottom: 1px solid #dcdee5;
 }
 .bk-table.bordered-row tr:last-child td {
@@ -1506,10 +1508,14 @@
 .bk-table.bordered-col td:last-child {
   border-right: none;
 }
+.bk-table th,
+.bk-table td {
+  border-right: 1px solid transparent;
+}
 .bk-table.bordered-none th,
 .bk-table.bordered-none td {
   border-top: none;
-  border-right: none;
+  border-right: 1px solid transparent;
   border-bottom: none;
   border-left: none;
 }

package/lib/table/use-common.d.ts

@@ -32,6 +32,7 @@ export declare const useClass: (props: TablePropTypes, targetColumns: ITableColu
         '--row-height': string;
         '--scroll-head-left': string;
         '--scroll-left': string;
+        '--background-color': any;
     }>;
     fixHeight: import("vue").Ref<number>;
     maxFixHeight: import("vue").Ref<number>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bkui-vue",
-  "version": "0.0.3-beta.2-1",
+  "version": "0.0.3-beta.2-2",
   "workspaces": {
     "packages": [
       "packages/!(**.bak)*",