bkui-vue 2.0.1-beta.15.table.6 → 2.0.1-beta.15.table.8

package/lib/table/props.d.ts

@@ -229,6 +229,11 @@ export declare enum IColSortBehavior {
      */
     interdependent = "interdependent"
 }
+export type FixedBottomOption = {
+    position: 'absolute' | 'relative';
+    height: number;
+    loading?: boolean;
+};
 export declare const tableProps: {
     /**
      * 渲染列表
@@ -578,5 +583,11 @@ export declare const tableProps: {
     } & {
         default: boolean;
     };
+    /**
+     * 固定在底部的配置项
+     */
+    fixedBottom: import("vue-types").VueTypeDef<FixedBottomOption> & {
+        default: () => FixedBottomOption;
+    };
 };
 export {};

package/lib/table/table.css

@@ -1219,15 +1219,21 @@
   flex: 1;
   overflow: auto;
 }
-.bk-table.has-scroll-y .bk-table-head {
-  padding-right: 4px;
-}
 .bk-table .bk-table-body {
   position: relative;
   overflow: hidden;
 }
 .bk-table .bk-table-body .prepend-row {
-  transform: translateX(var(--prepend-left));
+  transform: translate3d(var(--translate-x), 0, 0);
+}
+.bk-table .bk-table-body .resize-column {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 1px;
+  background-color: #3785ff;
+  transform: translate3d(var(--drag-offset-x), var(--translate-y), 0);
 }
 .bk-table .bk-table-body-content.bk-stripe table tbody tr:nth-child(even) td {
   background-color: #fafbfd;
@@ -1235,18 +1241,6 @@
 .bk-table .bk-table-body-content.bk-stripe table tbody tr td {
   border-bottom: none;
 }
-.bk-table .bk-fixed-bottom-border {
-  position: sticky;
-  bottom: 0;
-  left: 0;
-  z-index: 1;
-  width: 100%;
-  border-top: 1px solid var(--table-border-color);
-  transform: translateX(var(--scroll-head-left));
-}
-.bk-table .bk-fixed-bottom-border._is-empty {
-  display: none;
-}
 .bk-table .bk-table-head,
 .bk-table .bk-table-body {
   background: var(--table-bg-color);
@@ -1433,7 +1427,7 @@
 }
 .bk-table .bk-table-head table thead th.column_fixed,
 .bk-table .bk-table-body table thead th.column_fixed {
-  transform: translateX(var(--scroll-left));
+  transform: translateX(var(--translate-x));
 }
 .bk-table .bk-table-head table tbody tr td,
 .bk-table .bk-table-body table tbody tr td {
@@ -1477,15 +1471,21 @@
 .bk-table .bk-table-head .col-resize-drag {
   position: absolute;
   top: 0;
-  right: 0;
+  left: 0;
   bottom: 0;
   z-index: 1;
   width: 6px;
   background-color: #3785ff;
-  transform: translateX(-50%);
+  transform: translate3d(var(--drag-offset-h-x), 0, 0);
+}
+.bk-table .bk-table-head .col-resize-drag:hover {
+  cursor: ew-resize !important;
+}
+.bk-table .bk-table-head .bk-table-fixed {
+  transform: translate3d(0, 0, 0);
 }
 .bk-table .bk-table-head thead {
-  transform: translateX(var(--scroll-head-left));
+  transform: translate3d(var(--translate-x-1), 0, 0);
 }
 .bk-table .bk-table-head .table-head-settings {
   position: absolute;
@@ -1569,12 +1569,13 @@
   bottom: 0;
   left: 0;
   pointer-events: none;
+  transform: translate3d(var(--translate-x), var(--translate-y), 0);
 }
-.bk-table .bk-table-fixed.shadow-left .column_fixed_left {
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
+.bk-table .bk-table-fixed .column_fixed_right {
+  box-shadow: var(--shadow-right);
 }
-.bk-table .bk-table-fixed.shadow-right .column_fixed_right {
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
+.bk-table .bk-table-fixed .column_fixed_left {
+  box-shadow: var(--shadow-left);
 }
 .bk-table .bk-table-fixed .column_fixed {
   position: absolute;

package/lib/table/table.d.ts

@@ -166,6 +166,9 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: boolean;
     };
+    fixedBottom: import("vue-types").VueTypeDef<import("./props").FixedBottomOption> & {
+        default: () => import("./props").FixedBottomOption;
+    };
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, (...args: any[]) => boolean>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     data: import("vue-types").VueTypeDef<any[]> & {
         default: () => any[];
@@ -334,6 +337,9 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: boolean;
     };
+    fixedBottom: import("vue-types").VueTypeDef<import("./props").FixedBottomOption> & {
+        default: () => import("./props").FixedBottomOption;
+    };
 }>>, {
     data: any[];
     thead: import("./props").Thead;
@@ -379,5 +385,6 @@ declare const _default: import("vue").DefineComponent<{
     isFlex: boolean;
     rowDraggable: any;
     shiftMultiChecked: boolean;
+    fixedBottom: import("./props").FixedBottomOption;
 }, {}>;
 export default _default;

package/lib/table/table.less

@@ -27,18 +27,22 @@
     }
   }
 
-  &.has-scroll-y {
-    .@{bk-prefix}-table-head {
-      padding-right: 4px;
-    }
-  }
-
   .@{bk-prefix}-table-body {
     position: relative;
     overflow: hidden;
 
     .prepend-row {
-      transform: translateX(var(--prepend-left));
+      transform: translate3d(var(--translate-x), 0, 0);
+    }
+
+    .resize-column {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      width: 1px;
+      background-color: #3785ff;
+      transform: translate3d(var(--drag-offset-x), var(--translate-y), 0);
     }
   }
 
@@ -62,20 +66,6 @@
     }
   }
 
-  .@{bk-prefix}-fixed-bottom-border {
-    position: sticky;
-    bottom: 0;
-    left: 0;
-    z-index: 1;
-    width: 100%;
-    border-top: 1px solid @table-border-color;
-    transform: translateX(var(--scroll-head-left));
-
-    &._is-empty {
-      display: none;
-    }
-  }
-
   .@{bk-prefix}-table-head,
   .@{bk-prefix}-table-body {
     background: @table-bg-color;
@@ -241,7 +231,7 @@
           }
 
           &.column_fixed {
-            transform: translateX(var(--scroll-left));
+            transform: translateX(var(--translate-x));
           }
         }
       }
@@ -303,16 +293,23 @@
     .col-resize-drag {
       position: absolute;
       top: 0;
-      right: 0;
+      left: 0;
       bottom: 0;
       z-index: 1;
       width: 6px;
       background-color: #3785ff;
-      transform: translateX(-50%);
+      transform: translate3d(var(--drag-offset-h-x), 0, 0);
+      &:hover {
+        cursor: ew-resize !important;
+      }
+    }
+
+    .@{bk-prefix}-table-fixed {
+      transform: translate3d(0, 0, 0);
     }
 
     thead {
-      transform: translateX(var(--scroll-head-left));
+      transform: translate3d(var(--translate-x-1), 0, 0);
     }
 
     .table-head-settings {
@@ -437,17 +434,14 @@
     bottom: 0;
     left: 0;
     pointer-events: none;
+    transform: translate3d(var(--translate-x), var(--translate-y), 0);
 
-    &.shadow-left {
-      .column_fixed_left {
-        box-shadow: 0 0 10px rgb(0 0 0 / 12%);
-      }
+    .column_fixed_right {
+      box-shadow: var(--shadow-right);
     }
 
-    &.shadow-right {
-      .column_fixed_right {
-        box-shadow: 0 0 10px rgb(0 0 0 / 12%);
-      }
+    .column_fixed_left {
+      box-shadow: var(--shadow-left);
     }
 
     .column_fixed {

package/lib/table/table.variable.css

@@ -1606,15 +1606,21 @@
   flex: 1;
   overflow: auto;
 }
-.bk-table.has-scroll-y .bk-table-head {
-  padding-right: 4px;
-}
 .bk-table .bk-table-body {
   position: relative;
   overflow: hidden;
 }
 .bk-table .bk-table-body .prepend-row {
-  transform: translateX(var(--prepend-left));
+  transform: translate3d(var(--translate-x), 0, 0);
+}
+.bk-table .bk-table-body .resize-column {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 1px;
+  background-color: #3785ff;
+  transform: translate3d(var(--drag-offset-x), var(--translate-y), 0);
 }
 .bk-table .bk-table-body-content.bk-stripe table tbody tr:nth-child(even) td {
   background-color: #fafbfd;
@@ -1622,18 +1628,6 @@
 .bk-table .bk-table-body-content.bk-stripe table tbody tr td {
   border-bottom: none;
 }
-.bk-table .bk-fixed-bottom-border {
-  position: sticky;
-  bottom: 0;
-  left: 0;
-  z-index: 1;
-  width: 100%;
-  border-top: 1px solid var(--table-border-color);
-  transform: translateX(var(--scroll-head-left));
-}
-.bk-table .bk-fixed-bottom-border._is-empty {
-  display: none;
-}
 .bk-table .bk-table-head,
 .bk-table .bk-table-body {
   background: var(--table-bg-color);
@@ -1820,7 +1814,7 @@
 }
 .bk-table .bk-table-head table thead th.column_fixed,
 .bk-table .bk-table-body table thead th.column_fixed {
-  transform: translateX(var(--scroll-left));
+  transform: translateX(var(--translate-x));
 }
 .bk-table .bk-table-head table tbody tr td,
 .bk-table .bk-table-body table tbody tr td {
@@ -1864,15 +1858,21 @@
 .bk-table .bk-table-head .col-resize-drag {
   position: absolute;
   top: 0;
-  right: 0;
+  left: 0;
   bottom: 0;
   z-index: 1;
   width: 6px;
   background-color: #3785ff;
-  transform: translateX(-50%);
+  transform: translate3d(var(--drag-offset-h-x), 0, 0);
+}
+.bk-table .bk-table-head .col-resize-drag:hover {
+  cursor: ew-resize !important;
+}
+.bk-table .bk-table-head .bk-table-fixed {
+  transform: translate3d(0, 0, 0);
 }
 .bk-table .bk-table-head thead {
-  transform: translateX(var(--scroll-head-left));
+  transform: translate3d(var(--translate-x-1), 0, 0);
 }
 .bk-table .bk-table-head .table-head-settings {
   position: absolute;
@@ -1956,12 +1956,13 @@
   bottom: 0;
   left: 0;
   pointer-events: none;
+  transform: translate3d(var(--translate-x), var(--translate-y), 0);
 }
-.bk-table .bk-table-fixed.shadow-left .column_fixed_left {
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
+.bk-table .bk-table-fixed .column_fixed_right {
+  box-shadow: var(--shadow-right);
 }
-.bk-table .bk-table-fixed.shadow-right .column_fixed_right {
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
+.bk-table .bk-table-fixed .column_fixed_left {
+  box-shadow: var(--shadow-left);
 }
 .bk-table .bk-table-fixed .column_fixed {
   position: absolute;

package/lib/table-column/index.js

@@ -616,7 +616,16 @@ var tableProps = {
   /**
    * 启用Scrollbar
    */
-  scrollbar: shared_namespaceObject.PropTypes.bool.def(true)
+  scrollbar: shared_namespaceObject.PropTypes.bool.def(true),
+  /**
+   * 固定在底部的配置项
+   */
+  fixedBottom: (0,external_vue_types_namespaceObject.toType)('FixedBottomOption', {
+    "default": {
+      position: 'relative',
+      height: LINE_HEIGHT
+    }
+  }).def(null)
 };
 ;// CONCATENATED MODULE: ../../packages/table/src/components/table-column.tsx
 

package/lib/virtual-render/index.d.ts

@@ -24,9 +24,7 @@ declare const BkVirtualRender: {
         } & {
             default: number;
         };
-        maxHeight: import("vue-types").VueTypeValidableDef<number> & {
-            default: number;
-        };
+        maxHeight: import("vue-types").VueTypeDef<string | number>;
         height: import("vue-types").VueTypeDef<string | number> & {
             default: string | number;
         };
@@ -167,9 +165,7 @@ declare const BkVirtualRender: {
         } & {
             default: number;
         };
-        maxHeight: import("vue-types").VueTypeValidableDef<number> & {
-            default: number;
-        };
+        maxHeight: import("vue-types").VueTypeDef<string | number>;
         height: import("vue-types").VueTypeDef<string | number> & {
             default: string | number;
         };
@@ -286,7 +282,6 @@ declare const BkVirtualRender: {
     }, {
         width: string | number;
         height: string | number;
-        maxHeight: number;
         contentClassName: string | {
             [key: string]: any;
         };
@@ -353,9 +348,7 @@ declare const BkVirtualRender: {
         } & {
             default: number;
         };
-        maxHeight: import("vue-types").VueTypeValidableDef<number> & {
-            default: number;
-        };
+        maxHeight: import("vue-types").VueTypeDef<string | number>;
         height: import("vue-types").VueTypeDef<string | number> & {
             default: string | number;
         };
@@ -474,7 +467,6 @@ declare const BkVirtualRender: {
     }>, {}, {}, {}, {
         width: string | number;
         height: string | number;
-        maxHeight: number;
         contentClassName: string | {
             [key: string]: any;
         };
@@ -533,9 +525,7 @@ declare const BkVirtualRender: {
     } & {
         default: number;
     };
-    maxHeight: import("vue-types").VueTypeValidableDef<number> & {
-        default: number;
-    };
+    maxHeight: import("vue-types").VueTypeDef<string | number>;
     height: import("vue-types").VueTypeDef<string | number> & {
         default: string | number;
     };
@@ -654,7 +644,6 @@ declare const BkVirtualRender: {
 }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, {
     width: string | number;
     height: string | number;
-    maxHeight: number;
     contentClassName: string | {
         [key: string]: any;
     };

package/lib/virtual-render/index.js

@@ -195,7 +195,7 @@ var virtualRenderProps = _objectSpread({
   /** 整体最小高度 */
   minHeight: shared_namespaceObject.PropTypes.number.def(30),
   /** 整体最大高度 */
-  maxHeight: shared_namespaceObject.PropTypes.number,
+  maxHeight: shared_namespaceObject.PropTypes.oneOfType([shared_namespaceObject.PropTypes.number, shared_namespaceObject.PropTypes.string]),
   /**
    * 整体高度
    * 可设置具体值，如果设置为 100%，则组件会自动计算外层DOM元素offsetHeight，用于计算可渲染行数

package/lib/virtual-render/props.d.ts

@@ -49,9 +49,7 @@ export declare const virtualRenderProps: {
         default: number;
     };
     /** 整体最大高度 */
-    maxHeight: import("vue-types").VueTypeValidableDef<number> & {
-        default: number;
-    };
+    maxHeight: import("vue-types").VueTypeDef<string | number>;
     /**
      * 整体高度
      * 可设置具体值，如果设置为 100%，则组件会自动计算外层DOM元素offsetHeight，用于计算可渲染行数

package/lib/virtual-render/virtual-render.d.ts

@@ -29,9 +29,7 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: number;
     };
-    maxHeight: import("vue-types").VueTypeValidableDef<number> & {
-        default: number;
-    };
+    maxHeight: import("vue-types").VueTypeDef<string | number>;
     height: import("vue-types").VueTypeDef<string | number> & {
         default: string | number;
     };
@@ -170,9 +168,7 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: number;
     };
-    maxHeight: import("vue-types").VueTypeValidableDef<number> & {
-        default: number;
-    };
+    maxHeight: import("vue-types").VueTypeDef<string | number>;
     height: import("vue-types").VueTypeDef<string | number> & {
         default: string | number;
     };
@@ -289,7 +285,6 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     width: string | number;
     height: string | number;
-    maxHeight: number;
     contentClassName: string | {
         [key: string]: any;
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bkui-vue",
-  "version": "2.0.1-beta.15.table.6",
+  "version": "2.0.1-beta.15.table.8",
   "workspaces": [
     "packages/**",
     "scripts/cli",
@@ -10,6 +10,7 @@
     "lib",
     "dist"
   ],
+  "packageManager": "yarn@1.22.10",
   "sideEffects": [
     "*.css",
     "*.less"