@qn-pandora/pandora-component 5.1.2 → 5.1.4

package/lib/components/Table/ColumnSetting/style.less

@@ -1,50 +1,50 @@
-@import '../../../style/theme.less';
-
-.@{sdk-prefix}-table-column-setting-popover {
-  padding: 10px;
-  width: 100%;
-  .@{sdk-prefix}-table-column-setting-header {
-    border-bottom: 1px solid @border-color-base;
-    display: flex;
-    padding-bottom: 10px;
-    .@{sdk-prefix}-table-column-setting-all-check {
-      line-height: 32px;
-    }
-    .@{sdk-prefix}-table-column-setting-search-input {
-      width: 200px;
-    }
-  }
-  max-height: 300px;
-  overflow-y: auto;
-}
-
-.@{sdk-prefix}-table-column-setting-icon {
-  color: @font-color-7;
-}
-
-.@{sdk-prefix}-table-column-setting-content {
-  display: flex;
-  flex-wrap: wrap;
-}
-
-.@{sdk-prefix}-table-column-setting-content > div {
-  box-sizing: border-box;
-  position: relative;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  .@{sdk-prefix}-table-column-setting-checkbox-container {
-    margin: 4px 0;
-    display: flex;
-    .@{sdk-prefix}-table-column-setting-dragholder {
-      cursor: move;
-    }
-    .@{sdk-prefix}-table-column-setting-checkbox {
-      width: 100%;
-      min-width: 120px;
-      overflow: hidden;
-    }
-    .@{sdk-prefix}-table-column-setting-checkbox > span:nth-child(2) {
-      overflow: hidden;
-    }
-  }
-}
+@import '../../../style/theme.less';
+
+.@{sdk-prefix}-table-column-setting-popover {
+  padding: 10px;
+  width: 100%;
+  .@{sdk-prefix}-table-column-setting-header {
+    border-bottom: 1px solid @border-color-base;
+    display: flex;
+    padding-bottom: 10px;
+    .@{sdk-prefix}-table-column-setting-all-check {
+      line-height: 32px;
+    }
+    .@{sdk-prefix}-table-column-setting-search-input {
+      width: 200px;
+    }
+  }
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.@{sdk-prefix}-table-column-setting-icon {
+  color: @font-color-7;
+}
+
+.@{sdk-prefix}-table-column-setting-content {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.@{sdk-prefix}-table-column-setting-content > div {
+  box-sizing: border-box;
+  position: relative;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  .@{sdk-prefix}-table-column-setting-checkbox-container {
+    margin: 4px 0;
+    display: flex;
+    .@{sdk-prefix}-table-column-setting-dragholder {
+      cursor: move;
+    }
+    .@{sdk-prefix}-table-column-setting-checkbox {
+      width: 100%;
+      min-width: 120px;
+      overflow: hidden;
+    }
+    .@{sdk-prefix}-table-column-setting-checkbox > span:nth-child(2) {
+      overflow: hidden;
+    }
+  }
+}

package/lib/components/Table/ColumnTag/style.less

@@ -1,40 +1,40 @@
-@import '../../../style/theme.less';
-.@{sdk-prefix}-table-columnTag-groupTag {
-  padding: 4px;
-  height: 24px;
-  background: @theme-color-010;
-  margin-right: 4px;
-  color: @primary-color;
-  white-space: nowrap;
-  font-size: 12px;
-  margin-top: 4px;
-}
-
-.@{sdk-prefix}-table-columnTag-moreTagsIcon {
-  margin-left: 4px;
-  vertical-align: middle;
-  width: 14px;
-  height: 13px;
-  line-height: 6px;
-  border: 1px solid @icon-color;
-  padding: 0 1px;
-  text-align: center;
-  border-radius: 48%;
-  display: inline-block;
-  font-size: 12px;
-  font-weight: 400;
-  color: @icon-color;
-  cursor: pointer;
-
-  &:hover {
-    color: @theme-color;
-    border-color: @theme-color;
-  }
-}
-
-.@{sdk-prefix}-table-columnTag-tagPopoverContainer {
-  padding: 6px 10px 10px 10px;
-  display: flex;
-  flex-wrap: wrap;
-  width: 400px;
-}
+@import '../../../style/theme.less';
+.@{sdk-prefix}-table-columnTag-groupTag {
+  padding: 4px;
+  height: 24px;
+  background: @theme-color-010;
+  margin-right: 4px;
+  color: @primary-color;
+  white-space: nowrap;
+  font-size: 12px;
+  margin-top: 4px;
+}
+
+.@{sdk-prefix}-table-columnTag-moreTagsIcon {
+  margin-left: 4px;
+  vertical-align: middle;
+  width: 14px;
+  height: 13px;
+  line-height: 6px;
+  border: 1px solid @icon-color;
+  padding: 0 1px;
+  text-align: center;
+  border-radius: 48%;
+  display: inline-block;
+  font-size: 12px;
+  font-weight: 400;
+  color: @icon-color;
+  cursor: pointer;
+
+  &:hover {
+    color: @theme-color;
+    border-color: @theme-color;
+  }
+}
+
+.@{sdk-prefix}-table-columnTag-tagPopoverContainer {
+  padding: 6px 10px 10px 10px;
+  display: flex;
+  flex-wrap: wrap;
+  width: 400px;
+}

package/lib/components/Table/ResizableTitle/index.js

@@ -75,7 +75,14 @@ var ResizableTitle = function (props) {
             setWidth(contentRef.current.offsetWidth);
         }
     }, [width]);
+    // 阻止事件冒泡的处理函数
+    var handleDragStart = function (e) {
+        e.stopPropagation();
+        e.preventDefault();
+    };
     var handleResize = function (event, params) {
+        event.preventDefault();
+        event.stopPropagation();
         setWidth(params.size.width);
         onResize(event, params);
     };
@@ -83,10 +90,13 @@ var ResizableTitle = function (props) {
     if (!onResize || isLastColumn) {
         return (react_1.default.createElement("th", __assign({}, restProps, { className: classnames_1.default(className, style_1.SDK_PREFIX + "-table-resizable-th") })));
     }
-    return (react_1.default.createElement(react_resizable_1.Resizable, { axis: "x", width: width, className: style_1.SDK_PREFIX + "-table-resizable-Resizable", height: 0, onResize: handleResize, minConstraints: [40, 0], draggableOpts: { enableUserSelectHack: false }, handle: react_1.default.createElement("span", { className: style_1.SDK_PREFIX + "-table-resizable-handle", onClick: function (e) {
+    return (react_1.default.createElement(react_resizable_1.Resizable, { axis: "x", width: width, className: style_1.SDK_PREFIX + "-table-resizable-Resizable", height: 0, onResize: handleResize, minConstraints: [60, 0], draggableOpts: {
+            enableUserSelectHack: false,
+            onMouseDown: handleDragStart
+        }, maxConstraints: [500, 100], handle: react_1.default.createElement("div", { className: style_1.SDK_PREFIX + "-table-resizable-handle", onClick: function (e) {
                 e.preventDefault();
                 e.stopPropagation();
-            } },
+            }, onMouseDown: handleDragStart },
             react_1.default.createElement(pandora_component_icons_1.Resizable, null)) },
         react_1.default.createElement("th", __assign({}, restProps, { className: classnames_1.default(className, style_1.SDK_PREFIX + "-table-resizable-th"), ref: contentRef }))));
 };

package/lib/components/Table/ResizableTitle/style.css

@@ -3,9 +3,10 @@
 }
 .pandora-sdk-table-resizable-th .pandora-sdk-table-resizable-handle {
   position: absolute;
+  padding: 13px 0;
   cursor: col-resize;
   right: 1px;
-  height: 40%;
+  height: 45px;
   top: 50%;
   -webkit-transform: translateY(-50%);
           transform: translateY(-50%);

package/lib/components/Table/ResizableTitle/style.less

@@ -1,25 +1,26 @@
-@import '../../../style/theme.less';
-
-.@{sdk-prefix}-table-resizable-th {
-  width: 100%;
-  .@{sdk-prefix}-table-resizable-handle {
-    position: absolute;
-    cursor: col-resize;
-    right: 1px;
-    height: 40%;
-    top: 50%;
-    transform: translateY(-50%);
-    width: 8px;
-    opacity: 0;
-    transition: opacity 0.2s ease-in-out;
-  }
-  &:hover {
-    .@{sdk-prefix}-table-resizable-handle {
-      opacity: 0.3;
-    }
-  }
-
-  &::before {
-    display: none;
-  }
-}
+@import '../../../style/theme.less';
+
+.@{sdk-prefix}-table-resizable-th {
+  width: 100%;
+  .@{sdk-prefix}-table-resizable-handle {
+    position: absolute;
+    padding: 13px 0;
+    cursor: col-resize;
+    right: 1px;
+    height: 45px;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 8px;
+    opacity: 0;
+    transition: opacity 0.2s ease-in-out;
+  }
+  &:hover {
+    .@{sdk-prefix}-table-resizable-handle {
+      opacity: 0.3;
+    }
+  }
+
+  &::before {
+    display: none;
+  }
+}

package/lib/components/Table/index.js

@@ -289,10 +289,10 @@ var Table = /** @class */ (function (_super) {
         this.updateSettingFields(columns, settingFields, hiddenColumns);
     };
     Table.prototype.updateSettingFields = function (columns, settingFields, hiddenColumns) {
-        var _a = util_1.getSortAndHiddenKeys(columns, settingFields, hiddenColumns), sortableColumns = _a.sortableColumns, resultHiddenColumns = _a.hiddenColumns;
+        var _a = util_1.getSortAndHiddenKeys(columns, settingFields, hiddenColumns), sortableColumns = _a.sortableColumns, resultHiddenColumns = _a.hiddenColumns, resultSettingFields = _a.settingFields;
         this.setSortKeys(sortableColumns.map(function (t) { return t.field; }));
         this.setHiddenColumn(resultHiddenColumns);
-        this.setSettingFields(sortableColumns);
+        this.setSettingFields(resultSettingFields);
     };
     // 隐藏key
     Table.prototype.handleHideColumnsChange = function (keys) {