@vtx/components 4.0.0-beta.94 → 4.0.0-beta.95
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
-
var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth"];
|
|
2
|
+
var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth", "formProps"];
|
|
3
3
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
4
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
5
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
@@ -51,6 +51,8 @@ function VtxCombogrid(props, ref) {
|
|
|
51
51
|
_props$headFootHeight = props.headFootHeight,
|
|
52
52
|
headFootHeight = _props$headFootHeight === void 0 ? 95 : _props$headFootHeight,
|
|
53
53
|
popoverWidth = props.popoverWidth,
|
|
54
|
+
_props$formProps = props.formProps,
|
|
55
|
+
formProps = _props$formProps === void 0 ? {} : _props$formProps,
|
|
54
56
|
rest = _objectWithoutProperties(props, _excluded);
|
|
55
57
|
var prefixCls = getPrefixCls('', 'vtx-combogrid');
|
|
56
58
|
var _useStyle = useStyle(prefixCls, {
|
|
@@ -184,8 +186,9 @@ function VtxCombogrid(props, ref) {
|
|
|
184
186
|
return wrapSSR( /*#__PURE__*/_jsxs("div", {
|
|
185
187
|
className: "".concat(prefixCls, "-popover"),
|
|
186
188
|
ref: ref,
|
|
187
|
-
children: [formLen > 0 && /*#__PURE__*/_jsx(Form, {
|
|
188
|
-
form: form
|
|
189
|
+
children: [formLen > 0 && /*#__PURE__*/_jsx(Form, _objectSpread(_objectSpread({
|
|
190
|
+
form: form
|
|
191
|
+
}, formProps), {}, {
|
|
189
192
|
children: /*#__PURE__*/_jsxs(Row, {
|
|
190
193
|
gutter: 8,
|
|
191
194
|
children: [/*#__PURE__*/_jsxs(Col, {
|
|
@@ -223,7 +226,7 @@ function VtxCombogrid(props, ref) {
|
|
|
223
226
|
})]
|
|
224
227
|
})]
|
|
225
228
|
})
|
|
226
|
-
}), /*#__PURE__*/_jsx("div", {
|
|
229
|
+
})), /*#__PURE__*/_jsx("div", {
|
|
227
230
|
className: "".concat(prefixCls, "-main"),
|
|
228
231
|
children: /*#__PURE__*/_jsx(VtxDatagrid, _objectSpread(_objectSpread(_objectSpread({
|
|
229
232
|
toolbar: false
|
|
@@ -59,8 +59,7 @@ var genStyle = function genStyle(token) {
|
|
|
59
59
|
})), "".concat(antTabs, "-tab-active"), _defineProperty({
|
|
60
60
|
background: 'rgba(22,119,255,0.08)',
|
|
61
61
|
border: '1px solid rgba(22,119,255,0.1)',
|
|
62
|
-
color: colorPrimary
|
|
63
|
-
fontWeight: 500
|
|
62
|
+
color: colorPrimary
|
|
64
63
|
}, "".concat(antTabs, "-tab-btn"), {
|
|
65
64
|
color: colorPrimary
|
|
66
65
|
})), "".concat(antTabs, "-ink-bar"), {
|
|
@@ -28,6 +28,7 @@ import { useContext, useEffect, useMemo, useRef, useState } from 'react';
|
|
|
28
28
|
import VtxIcon from "../vtx-icon";
|
|
29
29
|
import { VtxProvider, useIntl } from "../vtx-provider";
|
|
30
30
|
import { useStyle } from "./style/index";
|
|
31
|
+
import { useMemoizedFn } from 'ahooks';
|
|
31
32
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
32
33
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
33
34
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
@@ -68,6 +69,19 @@ var VtxTreeSelect = function VtxTreeSelect(_ref) {
|
|
|
68
69
|
setPopOpen = _useState4[1];
|
|
69
70
|
var ref = useRef();
|
|
70
71
|
var size = useSize(ref);
|
|
72
|
+
var getDropdownWidth = useMemoizedFn(function (data) {
|
|
73
|
+
var level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
74
|
+
return data.reduce(function (maxWidth, item) {
|
|
75
|
+
var textWidth = Array.from(item[fieldNames.label]).reduce(function (width, char) {
|
|
76
|
+
return width + (char.charCodeAt(0) > 255 ? 14 : 8);
|
|
77
|
+
}, 0);
|
|
78
|
+
var currentWidth = level * 24 + textWidth + 64;
|
|
79
|
+
return Math.max(maxWidth, currentWidth, getDropdownWidth(item[fieldNames.children] || [], level + 1));
|
|
80
|
+
}, 0);
|
|
81
|
+
});
|
|
82
|
+
var dropdownWidth = useMemo(function () {
|
|
83
|
+
return Math.max(280, getDropdownWidth(treeData || []));
|
|
84
|
+
}, [treeData]);
|
|
71
85
|
var keyNodesMapping = useMemo(function () {
|
|
72
86
|
var keyNodesMapping = {};
|
|
73
87
|
// 建议:添加树数据有效性检查
|
|
@@ -201,8 +215,13 @@ var VtxTreeSelect = function VtxTreeSelect(_ref) {
|
|
|
201
215
|
},
|
|
202
216
|
styles: {
|
|
203
217
|
popup: {
|
|
204
|
-
|
|
205
|
-
|
|
218
|
+
root: {
|
|
219
|
+
maxHeight: 300,
|
|
220
|
+
overflow: 'auto'
|
|
221
|
+
},
|
|
222
|
+
itemTitle: {
|
|
223
|
+
wordBreak: 'break-all'
|
|
224
|
+
}
|
|
206
225
|
}
|
|
207
226
|
},
|
|
208
227
|
classNames: {
|
|
@@ -212,7 +231,8 @@ var VtxTreeSelect = function VtxTreeSelect(_ref) {
|
|
|
212
231
|
treeDefaultExpandAll: true,
|
|
213
232
|
fieldNames: fieldNames,
|
|
214
233
|
labelInValue: _labelInValue,
|
|
215
|
-
disabled: disabled
|
|
234
|
+
disabled: disabled,
|
|
235
|
+
popupMatchSelectWidth: dropdownWidth
|
|
216
236
|
}, props), {}, {
|
|
217
237
|
onChange: function onChange(value, label, extra) {
|
|
218
238
|
return onChangeTreeSelect(value, label, extra, selectedNodes);
|
|
@@ -14,7 +14,7 @@ var _vtxDatagrid = _interopRequireDefault(require("../vtx-datagrid"));
|
|
|
14
14
|
var _style = require("./style");
|
|
15
15
|
var _vtxProvider = require("../vtx-provider");
|
|
16
16
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
|
-
var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth"];
|
|
17
|
+
var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth", "formProps"];
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
19
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
20
20
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
@@ -59,6 +59,8 @@ function VtxCombogrid(props, ref) {
|
|
|
59
59
|
_props$headFootHeight = props.headFootHeight,
|
|
60
60
|
headFootHeight = _props$headFootHeight === void 0 ? 95 : _props$headFootHeight,
|
|
61
61
|
popoverWidth = props.popoverWidth,
|
|
62
|
+
_props$formProps = props.formProps,
|
|
63
|
+
formProps = _props$formProps === void 0 ? {} : _props$formProps,
|
|
62
64
|
rest = _objectWithoutProperties(props, _excluded);
|
|
63
65
|
var prefixCls = getPrefixCls('', 'vtx-combogrid');
|
|
64
66
|
var _useStyle = (0, _style.useStyle)(prefixCls, {
|
|
@@ -192,8 +194,9 @@ function VtxCombogrid(props, ref) {
|
|
|
192
194
|
return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
193
195
|
className: "".concat(prefixCls, "-popover"),
|
|
194
196
|
ref: ref,
|
|
195
|
-
children: [formLen > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form, {
|
|
196
|
-
form: form
|
|
197
|
+
children: [formLen > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form, _objectSpread(_objectSpread({
|
|
198
|
+
form: form
|
|
199
|
+
}, formProps), {}, {
|
|
197
200
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Row, {
|
|
198
201
|
gutter: 8,
|
|
199
202
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Col, {
|
|
@@ -231,7 +234,7 @@ function VtxCombogrid(props, ref) {
|
|
|
231
234
|
})]
|
|
232
235
|
})]
|
|
233
236
|
})
|
|
234
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
237
|
+
})), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
235
238
|
className: "".concat(prefixCls, "-main"),
|
|
236
239
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vtxDatagrid.default, _objectSpread(_objectSpread(_objectSpread({
|
|
237
240
|
toolbar: false
|
|
@@ -66,8 +66,7 @@ var genStyle = function genStyle(token) {
|
|
|
66
66
|
})), "".concat(antTabs, "-tab-active"), _defineProperty({
|
|
67
67
|
background: 'rgba(22,119,255,0.08)',
|
|
68
68
|
border: '1px solid rgba(22,119,255,0.1)',
|
|
69
|
-
color: colorPrimary
|
|
70
|
-
fontWeight: 500
|
|
69
|
+
color: colorPrimary
|
|
71
70
|
}, "".concat(antTabs, "-tab-btn"), {
|
|
72
71
|
color: colorPrimary
|
|
73
72
|
})), "".concat(antTabs, "-ink-bar"), {
|
|
@@ -73,6 +73,19 @@ var VtxTreeSelect = exports.VtxTreeSelect = function VtxTreeSelect(_ref) {
|
|
|
73
73
|
setPopOpen = _useState4[1];
|
|
74
74
|
var ref = (0, _react.useRef)();
|
|
75
75
|
var size = (0, _ahooks.useSize)(ref);
|
|
76
|
+
var getDropdownWidth = (0, _ahooks.useMemoizedFn)(function (data) {
|
|
77
|
+
var level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
78
|
+
return data.reduce(function (maxWidth, item) {
|
|
79
|
+
var textWidth = Array.from(item[fieldNames.label]).reduce(function (width, char) {
|
|
80
|
+
return width + (char.charCodeAt(0) > 255 ? 14 : 8);
|
|
81
|
+
}, 0);
|
|
82
|
+
var currentWidth = level * 24 + textWidth + 64;
|
|
83
|
+
return Math.max(maxWidth, currentWidth, getDropdownWidth(item[fieldNames.children] || [], level + 1));
|
|
84
|
+
}, 0);
|
|
85
|
+
});
|
|
86
|
+
var dropdownWidth = (0, _react.useMemo)(function () {
|
|
87
|
+
return Math.max(280, getDropdownWidth(treeData || []));
|
|
88
|
+
}, [treeData]);
|
|
76
89
|
var keyNodesMapping = (0, _react.useMemo)(function () {
|
|
77
90
|
var keyNodesMapping = {};
|
|
78
91
|
// 建议:添加树数据有效性检查
|
|
@@ -206,8 +219,13 @@ var VtxTreeSelect = exports.VtxTreeSelect = function VtxTreeSelect(_ref) {
|
|
|
206
219
|
},
|
|
207
220
|
styles: {
|
|
208
221
|
popup: {
|
|
209
|
-
|
|
210
|
-
|
|
222
|
+
root: {
|
|
223
|
+
maxHeight: 300,
|
|
224
|
+
overflow: 'auto'
|
|
225
|
+
},
|
|
226
|
+
itemTitle: {
|
|
227
|
+
wordBreak: 'break-all'
|
|
228
|
+
}
|
|
211
229
|
}
|
|
212
230
|
},
|
|
213
231
|
classNames: {
|
|
@@ -217,7 +235,8 @@ var VtxTreeSelect = exports.VtxTreeSelect = function VtxTreeSelect(_ref) {
|
|
|
217
235
|
treeDefaultExpandAll: true,
|
|
218
236
|
fieldNames: fieldNames,
|
|
219
237
|
labelInValue: _labelInValue,
|
|
220
|
-
disabled: disabled
|
|
238
|
+
disabled: disabled,
|
|
239
|
+
popupMatchSelectWidth: dropdownWidth
|
|
221
240
|
}, props), {}, {
|
|
222
241
|
onChange: function onChange(value, label, extra) {
|
|
223
242
|
return onChangeTreeSelect(value, label, extra, selectedNodes);
|