@zat-design/sisyphus-react 3.13.18-beta.3 → 3.13.18-beta.5
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/es/ProForm/components/combination/ProModalSelect/hooks/useRequestList.js +1 -3
- package/es/ProForm/components/combination/ProModalSelect/index.js +38 -23
- package/es/ProForm/components/combination/ProModalSelect/propsType.d.ts +5 -1
- package/es/ProForm/components/combination/ProModalSelect/style/index.less +2 -2
- package/es/ProLayout/components/Layout/Menu/FoldMenu/index.js +57 -8
- package/es/ProLayout/components/Layout/Menu/OpenMenu/index.js +23 -3
- package/es/ProLayout/components/Layout/Menu/SideMenu/index.js +3 -1
- package/es/ProLayout/components/Layout/Menu/index.js +4 -1
- package/es/ProLayout/index.js +3 -1
- package/es/ProLayout/propTypes.d.ts +9 -0
- package/es/ProLayout/utils/index.d.ts +7 -0
- package/es/ProLayout/utils/index.js +31 -1
- package/lib/ProForm/components/combination/ProModalSelect/hooks/useRequestList.js +1 -3
- package/lib/ProForm/components/combination/ProModalSelect/index.js +39 -24
- package/lib/ProForm/components/combination/ProModalSelect/propsType.d.ts +5 -1
- package/lib/ProForm/components/combination/ProModalSelect/style/index.less +2 -2
- package/lib/ProLayout/components/Layout/Menu/FoldMenu/index.js +56 -7
- package/lib/ProLayout/components/Layout/Menu/OpenMenu/index.js +22 -2
- package/lib/ProLayout/components/Layout/Menu/SideMenu/index.js +3 -1
- package/lib/ProLayout/components/Layout/Menu/index.js +4 -1
- package/lib/ProLayout/index.js +3 -1
- package/lib/ProLayout/propTypes.d.ts +9 -0
- package/lib/ProLayout/utils/index.d.ts +7 -0
- package/lib/ProLayout/utils/index.js +30 -1
- package/package.json +1 -1
@@ -98,9 +98,7 @@ export function useRequestList(service, options, useRequestOptions) {
|
|
98
98
|
}, [onChange, searchValues]);
|
99
99
|
// 重置查询条件
|
100
100
|
var onReset = useCallback(function () {
|
101
|
-
onSearch({
|
102
|
-
d: Date.now()
|
103
|
-
});
|
101
|
+
onSearch({});
|
104
102
|
}, [onSearch]);
|
105
103
|
var dataSource = useMemo(function () {
|
106
104
|
if (data) {
|
@@ -19,11 +19,13 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
19
19
|
import "antd/es/form/style";
|
20
20
|
import _Form from "antd/es/form";
|
21
21
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
22
|
+
import _isObject from "lodash/isObject";
|
22
23
|
import _isFunction from "lodash/isFunction";
|
23
24
|
import _isEqual from "lodash/isEqual";
|
25
|
+
import _isBoolean from "lodash/isBoolean";
|
24
26
|
import _isArray from "lodash/isArray";
|
25
27
|
import _debounce from "lodash/debounce";
|
26
|
-
var _excluded = ["value", "onChange", "disabled", "labelInValue", "fieldNames", "readOnly", "addonAfter", "configOption", "title", "onFormat", "showCodeName", "optionRender", "customRender", "style", "className", "beforeOpen", "afterOpen", "isTooltip", "searchForm", "searchKey", "defaultOne", "otherProps"],
|
28
|
+
var _excluded = ["value", "onChange", "disabled", "labelInValue", "fieldNames", "readOnly", "mode", "addonAfter", "configOption", "title", "onFormat", "showCodeName", "optionRender", "customRender", "style", "className", "beforeOpen", "afterOpen", "isTooltip", "tooltip", "searchForm", "searchKey", "defaultOne", "otherProps"],
|
27
29
|
_excluded2 = ["onOk"],
|
28
30
|
_excluded3 = ["rowKey", "columns", "rowSelection"];
|
29
31
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
@@ -48,6 +50,8 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
48
50
|
fieldNames = props.fieldNames,
|
49
51
|
_props$readOnly = props.readOnly,
|
50
52
|
readOnly = _props$readOnly === void 0 ? true : _props$readOnly,
|
53
|
+
_props$mode = props.mode,
|
54
|
+
mode = _props$mode === void 0 ? 'select' : _props$mode,
|
51
55
|
addonAfter = props.addonAfter,
|
52
56
|
configOption = props.configOption,
|
53
57
|
title = props.title,
|
@@ -60,11 +64,19 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
60
64
|
beforeOpen = props.beforeOpen,
|
61
65
|
afterOpen = props.afterOpen,
|
62
66
|
isTooltip = props.isTooltip,
|
67
|
+
tooltip = props.tooltip,
|
63
68
|
searchForm = props.searchForm,
|
64
69
|
searchKey = props.searchKey,
|
65
70
|
defaultOne = props.defaultOne,
|
66
71
|
otherProps = props.otherProps,
|
67
72
|
restProps = _objectWithoutProperties(props, _excluded);
|
73
|
+
var _tooltip = tooltip !== null && tooltip !== void 0 ? tooltip : isTooltip;
|
74
|
+
var nextMode = useMemo(function () {
|
75
|
+
if (_isBoolean(readOnly) && readOnly === false) {
|
76
|
+
return 'input';
|
77
|
+
}
|
78
|
+
return mode;
|
79
|
+
}, [mode, readOnly]);
|
68
80
|
var contentForm = _Form.useFormInstance();
|
69
81
|
if (!configOption || Object.prototype.toString.call(configOption) !== '[object Object]') {
|
70
82
|
throw new Error('error: 请检查枚举选择弹框的配置项【configOption】');
|
@@ -171,8 +183,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
171
183
|
transformParams: transformParams,
|
172
184
|
transformResponse: transformResponse
|
173
185
|
}, _objectSpread({
|
174
|
-
|
175
|
-
ready: (initParams || defaultOne) && !readOnly || visible
|
186
|
+
ready: (initParams || defaultOne) && nextMode === 'input' || visible
|
176
187
|
}, useRequest === null || useRequest === void 0 ? void 0 : useRequest.options)),
|
177
188
|
data = _useRequestList2.data,
|
178
189
|
loading = _useRequestList2.loading,
|
@@ -203,7 +214,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
203
214
|
if (typeof data === 'string' || typeof data === 'number') {
|
204
215
|
return data;
|
205
216
|
}
|
206
|
-
if (
|
217
|
+
if (_isObject(data)) {
|
207
218
|
return handleFormat(_objectSpread(_objectSpread({}, data), {}, {
|
208
219
|
value: data[valueKey],
|
209
220
|
label: data[labelKey]
|
@@ -240,7 +251,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
240
251
|
* @returns {any}
|
241
252
|
*/
|
242
253
|
var getRowKey = function getRowKey(record) {
|
243
|
-
if (
|
254
|
+
if (_isFunction(rowKey)) {
|
244
255
|
return rowKey(record);
|
245
256
|
}
|
246
257
|
return record[rowKey];
|
@@ -262,7 +273,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
262
273
|
var handleChangeValue = function handleChangeValue(e) {
|
263
274
|
onChange(e.target.value);
|
264
275
|
preValue.current = e.target.value;
|
265
|
-
if (
|
276
|
+
if (nextMode === 'input') {
|
266
277
|
setState({
|
267
278
|
_value: e.target.value
|
268
279
|
});
|
@@ -520,7 +531,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
520
531
|
selectedRows: list,
|
521
532
|
selectedRowKeys: nextSelectRowKeys
|
522
533
|
});
|
523
|
-
} else if (
|
534
|
+
} else if (nextMode === 'input') {
|
524
535
|
// 当传入initParams且文本框非只读时,不调用接口获取初始化数据
|
525
536
|
setState({
|
526
537
|
_value: value,
|
@@ -608,13 +619,13 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
608
619
|
selectedRows: (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRows) || [],
|
609
620
|
_value: undefined
|
610
621
|
});
|
611
|
-
} else if (
|
622
|
+
} else if (_isArray(value)) {
|
612
623
|
setState({
|
613
624
|
selectedRowKeys: (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys) || value,
|
614
625
|
selectedRows: (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRows) || value,
|
615
626
|
_value: value
|
616
627
|
});
|
617
|
-
} else if (
|
628
|
+
} else if (_isObject(value)) {
|
618
629
|
var initialValue = _defineProperty(_defineProperty({}, valueKey, value[valueKey]), labelKey, value[labelKey]);
|
619
630
|
setState({
|
620
631
|
selectedRowKeys: [value],
|
@@ -637,7 +648,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
637
648
|
nextState.selectedRowKeys = [];
|
638
649
|
nextState.selectedRows = [];
|
639
650
|
}
|
640
|
-
if (
|
651
|
+
if (_isObject(value)) {
|
641
652
|
nextState.selectedRowKeys = [getRowKey(value)];
|
642
653
|
nextState.selectedRows = [value];
|
643
654
|
}
|
@@ -663,12 +674,12 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
663
674
|
hideTooltipIfOpen(fieldRef.current, visible);
|
664
675
|
}, [visible]);
|
665
676
|
useEffect(function () {
|
666
|
-
if (value && !visible && isInit &&
|
677
|
+
if (value && !visible && isInit && nextMode === 'input') {
|
667
678
|
getInitValues();
|
668
679
|
}
|
669
680
|
}, [JSON.stringify(value), visible, isInit]);
|
670
681
|
useDebounceEffect(function () {
|
671
|
-
if (value && !visible &&
|
682
|
+
if (value && !visible && nextMode === 'select' && (!_isEqual(value, preValue.current) || (options === null || options === void 0 ? void 0 : options.length) === 0)) {
|
672
683
|
var _options$some;
|
673
684
|
preValue.current = value;
|
674
685
|
var _data3 = labelInValue ? value[valueKey] : value;
|
@@ -735,7 +746,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
735
746
|
});
|
736
747
|
}
|
737
748
|
}
|
738
|
-
if (
|
749
|
+
if (nextMode === 'input') {
|
739
750
|
if (labelInValue && _value && !_isEqual(value, _value)) {
|
740
751
|
setState({
|
741
752
|
_value: value,
|
@@ -758,7 +769,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
758
769
|
width: '100%'
|
759
770
|
},
|
760
771
|
block: true,
|
761
|
-
children: [
|
772
|
+
children: [nextMode === 'select' ? _jsx(ProSelect, _objectSpread({
|
762
773
|
value: value,
|
763
774
|
onChange: handleSelectValue,
|
764
775
|
disabled: disabled,
|
@@ -799,17 +810,19 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
799
810
|
});
|
800
811
|
}
|
801
812
|
useDeepCompareEffect(function () {
|
802
|
-
|
803
|
-
|
813
|
+
var dom = document.getElementById(uuid);
|
814
|
+
if (_tooltip && value && dom) {
|
804
815
|
dom.addEventListener('mouseover', function (e) {
|
805
|
-
|
816
|
+
var _e$target, _e$target$className, _e$target$className$i;
|
817
|
+
if (value && (e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : (_e$target$className = _e$target.className) === null || _e$target$className === void 0 ? void 0 : (_e$target$className$i = _e$target$className.includes) === null || _e$target$className$i === void 0 ? void 0 : _e$target$className$i.call(_e$target$className, 'select'))) {
|
806
818
|
setState({
|
807
819
|
open: true
|
808
820
|
});
|
809
821
|
}
|
810
822
|
});
|
811
823
|
dom.addEventListener('mouseout', function (e) {
|
812
|
-
|
824
|
+
var _e$target2, _e$target2$className, _e$target2$className$;
|
825
|
+
if (e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : (_e$target2$className = _e$target2.className) === null || _e$target2$className === void 0 ? void 0 : (_e$target2$className$ = _e$target2$className.includes) === null || _e$target2$className$ === void 0 ? void 0 : _e$target2$className$.call(_e$target2$className, 'select')) {
|
813
826
|
setState({
|
814
827
|
open: false
|
815
828
|
});
|
@@ -817,14 +830,16 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
817
830
|
});
|
818
831
|
return function () {
|
819
832
|
dom.removeEventListener('mouseover', function (e) {
|
820
|
-
|
833
|
+
var _e$target3, _e$target3$className, _e$target3$className$;
|
834
|
+
if (value && (e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : (_e$target3$className = _e$target3.className) === null || _e$target3$className === void 0 ? void 0 : (_e$target3$className$ = _e$target3$className.includes) === null || _e$target3$className$ === void 0 ? void 0 : _e$target3$className$.call(_e$target3$className, 'select'))) {
|
821
835
|
setState({
|
822
836
|
open: true
|
823
837
|
});
|
824
838
|
}
|
825
839
|
});
|
826
840
|
dom.removeEventListener('mouseout', function (e) {
|
827
|
-
|
841
|
+
var _e$target4, _e$target4$className, _e$target4$className$;
|
842
|
+
if (e === null || e === void 0 ? void 0 : (_e$target4 = e.target) === null || _e$target4 === void 0 ? void 0 : (_e$target4$className = _e$target4.className) === null || _e$target4$className === void 0 ? void 0 : (_e$target4$className$ = _e$target4$className.includes) === null || _e$target4$className$ === void 0 ? void 0 : _e$target4$className$.call(_e$target4$className, 'select')) {
|
828
843
|
setState({
|
829
844
|
open: false
|
830
845
|
});
|
@@ -832,7 +847,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
832
847
|
});
|
833
848
|
};
|
834
849
|
}
|
835
|
-
}, [value,
|
850
|
+
}, [value, _tooltip, document.getElementById(uuid)]);
|
836
851
|
useDeepCompareEffect(function () {
|
837
852
|
setState({
|
838
853
|
options: (tableProps === null || tableProps === void 0 ? void 0 : tableProps.dataSource) || []
|
@@ -870,14 +885,14 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
870
885
|
className: _className,
|
871
886
|
style: style,
|
872
887
|
ref: fieldRef,
|
873
|
-
children:
|
888
|
+
children: _tooltip && viewText ? _jsx(_Tooltip, {
|
874
889
|
placement: "topLeft",
|
875
890
|
open: open,
|
876
891
|
title: viewText,
|
877
892
|
children: initRender
|
878
893
|
}) : initRender
|
879
894
|
}), _jsxs(ProDrawerForm, _objectSpread(_objectSpread({
|
880
|
-
|
895
|
+
mode: "Modal",
|
881
896
|
title: title,
|
882
897
|
onOk: handleFinish,
|
883
898
|
// @ts-ignore
|
@@ -80,14 +80,18 @@ interface ProModalPropsType {
|
|
80
80
|
beforeOpen?: any;
|
81
81
|
/** 打开弹框后的回调函数 */
|
82
82
|
afterOpen?: any;
|
83
|
-
/** 是否启用tooltip提示 */
|
83
|
+
/** 废弃 是否启用tooltip提示 */
|
84
84
|
isTooltip?: boolean;
|
85
|
+
/** 是否启用tooltip提示 */
|
86
|
+
tooltip?: boolean;
|
85
87
|
/** 是否以"值-名称"形式展示 */
|
86
88
|
showCodeName?: boolean;
|
87
89
|
/** 查询表单实例,用于获取查询表单数据 */
|
88
90
|
searchForm?: FormInstance;
|
89
91
|
/** 模糊查询的字段名 */
|
90
92
|
searchKey?: string;
|
93
|
+
/** 展示形式 */
|
94
|
+
mode?: 'input' | 'select';
|
91
95
|
}
|
92
96
|
/** 模态框选择器属性类型(结合Select和Input属性) */
|
93
97
|
export declare type ProModalSelectPropsType = SelectProps & InputProps & ProModalPropsType;
|
@@ -53,7 +53,7 @@
|
|
53
53
|
}
|
54
54
|
}
|
55
55
|
|
56
|
-
// 新加适用于
|
56
|
+
// 新加适用于 _readOnly false
|
57
57
|
.@{ant-prefix}-input-affix-wrapper {
|
58
58
|
border-top-right-radius: 0;
|
59
59
|
border-bottom-right-radius: 0;
|
@@ -100,7 +100,7 @@
|
|
100
100
|
}
|
101
101
|
|
102
102
|
.@{ant-prefix}-input-affix-wrapper-status-error{
|
103
|
-
|
103
|
+
|
104
104
|
}
|
105
105
|
|
106
106
|
|
@@ -10,10 +10,11 @@ import { Link } from 'react-router-dom';
|
|
10
10
|
import { Icon } from '../../index';
|
11
11
|
import SideMenu from '../SideMenu';
|
12
12
|
import { LayoutContext } from '../../../../index';
|
13
|
-
import { getUrlParams, getPathNameKey } from '../../../../utils';
|
13
|
+
import { getUrlParams, getPathNameKey, findMenuItemByKey } from '../../../../utils';
|
14
14
|
var FoldMenu = function FoldMenu(props) {
|
15
15
|
var style = props.style,
|
16
|
-
dataSource = props.dataSource
|
16
|
+
dataSource = props.dataSource,
|
17
|
+
onMenuClick = props.onMenuClick;
|
17
18
|
var menus = dataSource.menus,
|
18
19
|
iconfontUrl = dataSource.iconfontUrl,
|
19
20
|
notice = dataSource.notice,
|
@@ -82,7 +83,8 @@ var FoldMenu = function FoldMenu(props) {
|
|
82
83
|
content: _jsx(SideMenu, {
|
83
84
|
dataSource: _objectSpread(_objectSpread({}, dataSource), {}, {
|
84
85
|
menus: item
|
85
|
-
})
|
86
|
+
}),
|
87
|
+
onMenuClick: onMenuClick
|
86
88
|
}),
|
87
89
|
color: "#fff",
|
88
90
|
overlayClassName: noticeCls,
|
@@ -91,12 +93,42 @@ var FoldMenu = function FoldMenu(props) {
|
|
91
93
|
height: "calc(100vh - ".concat(headerHeight + (notice ? 32 : 0), "px)")
|
92
94
|
},
|
93
95
|
placement: "rightTop",
|
94
|
-
children:
|
96
|
+
children: _jsx("span", {
|
97
|
+
onClick: function onClick() {
|
98
|
+
// 查找完整的菜单项数据
|
99
|
+
var menuItem = findMenuItemByKey(menus, String(id));
|
100
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
101
|
+
return String(id);
|
102
|
+
}) : [String(id)];
|
103
|
+
// 调用用户传入的onMenuClick回调
|
104
|
+
if (onMenuClick) {
|
105
|
+
onMenuClick({
|
106
|
+
item: menuItem,
|
107
|
+
key: String(id),
|
108
|
+
keyPath: menuKeyPath
|
109
|
+
});
|
110
|
+
}
|
111
|
+
},
|
112
|
+
children: LiNode
|
113
|
+
})
|
95
114
|
}, "".concat(id, "-").concat(name)) : !collapsed ? _jsx(_Tooltip, {
|
96
115
|
placement: "right",
|
97
116
|
title: name,
|
98
117
|
children: _jsx("span", {
|
99
118
|
onClick: function onClick() {
|
119
|
+
// 查找完整的菜单项数据
|
120
|
+
var menuItem = findMenuItemByKey(menus, String(id));
|
121
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
122
|
+
return String(id);
|
123
|
+
}) : [String(id)];
|
124
|
+
// 调用用户传入的onMenuClick回调
|
125
|
+
if (onMenuClick) {
|
126
|
+
onMenuClick({
|
127
|
+
item: menuItem,
|
128
|
+
key: String(id),
|
129
|
+
keyPath: menuKeyPath
|
130
|
+
});
|
131
|
+
}
|
100
132
|
onSelected({
|
101
133
|
selectedPath: toPath
|
102
134
|
});
|
@@ -106,10 +138,27 @@ var FoldMenu = function FoldMenu(props) {
|
|
106
138
|
children: LiNode
|
107
139
|
}, toPath)
|
108
140
|
})
|
109
|
-
}, toPath) : _jsx(
|
110
|
-
|
111
|
-
|
112
|
-
|
141
|
+
}, toPath) : _jsx("span", {
|
142
|
+
onClick: function onClick() {
|
143
|
+
// 查找完整的菜单项数据
|
144
|
+
var menuItem = findMenuItemByKey(menus, String(id));
|
145
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
146
|
+
return String(id);
|
147
|
+
}) : [String(id)];
|
148
|
+
// 调用用户传入的onMenuClick回调
|
149
|
+
if (onMenuClick) {
|
150
|
+
onMenuClick({
|
151
|
+
item: menuItem,
|
152
|
+
key: String(id),
|
153
|
+
keyPath: menuKeyPath
|
154
|
+
});
|
155
|
+
}
|
156
|
+
},
|
157
|
+
children: _jsx(Link, {
|
158
|
+
to: toPath,
|
159
|
+
children: LiNode
|
160
|
+
}, toPath)
|
161
|
+
});
|
113
162
|
})
|
114
163
|
})
|
115
164
|
});
|
@@ -10,7 +10,7 @@ import { CaretDownOutlined } from '@ant-design/icons';
|
|
10
10
|
import classnames from 'classnames';
|
11
11
|
import { Link } from 'react-router-dom';
|
12
12
|
import { LayoutContext } from '../../../../index';
|
13
|
-
import { getIdsByPathName } from '../../../../utils';
|
13
|
+
import { getIdsByPathName, findMenuItemByKey } from '../../../../utils';
|
14
14
|
import { Icon } from '../../index';
|
15
15
|
var OpenMenu = function OpenMenu(props) {
|
16
16
|
var _getIdsByPathName;
|
@@ -18,7 +18,8 @@ var OpenMenu = function OpenMenu(props) {
|
|
18
18
|
dataSource = props.dataSource,
|
19
19
|
style = props.style,
|
20
20
|
_props$theme = props.theme,
|
21
|
-
theme = _props$theme === void 0 ? 'dark' : _props$theme
|
21
|
+
theme = _props$theme === void 0 ? 'dark' : _props$theme,
|
22
|
+
onMenuClick = props.onMenuClick;
|
22
23
|
var _ref = dataSource || {},
|
23
24
|
menus = _ref.menus,
|
24
25
|
sideMenu = _ref.sideMenu;
|
@@ -142,7 +143,26 @@ var OpenMenu = function OpenMenu(props) {
|
|
142
143
|
onClick: function onClick(_ref2) {
|
143
144
|
var _item$props, _item$props2;
|
144
145
|
var item = _ref2.item,
|
145
|
-
keyPath = _ref2.keyPath
|
146
|
+
keyPath = _ref2.keyPath,
|
147
|
+
key = _ref2.key,
|
148
|
+
domEvent = _ref2.domEvent;
|
149
|
+
// console.log('item', item);
|
150
|
+
// console.log('keyPath', keyPath);
|
151
|
+
// console.log('key', key);
|
152
|
+
// console.log('domEvent', domEvent);
|
153
|
+
// 查找完整的菜单项数据
|
154
|
+
var menuItem = findMenuItemByKey(menus, key);
|
155
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
156
|
+
return String(id);
|
157
|
+
}) : keyPath;
|
158
|
+
// 调用用户传入的onMenuClick回调
|
159
|
+
if (onMenuClick) {
|
160
|
+
onMenuClick({
|
161
|
+
item: menuItem,
|
162
|
+
key: key,
|
163
|
+
keyPath: menuKeyPath
|
164
|
+
});
|
165
|
+
}
|
146
166
|
setState({
|
147
167
|
selectedKeys: keyPath,
|
148
168
|
router: item === null || item === void 0 ? void 0 : (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.router
|
@@ -4,7 +4,8 @@ import classnames from 'classnames';
|
|
4
4
|
import { useSize } from 'ahooks';
|
5
5
|
import OpenMenu from '../OpenMenu';
|
6
6
|
var SideMenu = function SideMenu(props) {
|
7
|
-
var dataSource = props.dataSource
|
7
|
+
var dataSource = props.dataSource,
|
8
|
+
onMenuClick = props.onMenuClick;
|
8
9
|
var ref = useRef(null);
|
9
10
|
var size = useSize(ref);
|
10
11
|
var menus = dataSource.menus,
|
@@ -24,6 +25,7 @@ var SideMenu = function SideMenu(props) {
|
|
24
25
|
children: _jsx(OpenMenu, {
|
25
26
|
className: "pro-layout-sider-menu-list",
|
26
27
|
theme: "light",
|
28
|
+
onMenuClick: onMenuClick,
|
27
29
|
dataSource: {
|
28
30
|
menus: (menus === null || menus === void 0 ? void 0 : menus.children) || [],
|
29
31
|
iconfontUrl: iconfontUrl,
|
@@ -13,7 +13,8 @@ var Menu = function Menu(props) {
|
|
13
13
|
pure = _ref.pure,
|
14
14
|
theme = _ref.theme,
|
15
15
|
sideMenuFooterRender = _ref.sideMenuFooterRender,
|
16
|
-
sideMenuHeaderRender = _ref.sideMenuHeaderRender
|
16
|
+
sideMenuHeaderRender = _ref.sideMenuHeaderRender,
|
17
|
+
onMenuClick = _ref.onMenuClick;
|
17
18
|
var menus = [];
|
18
19
|
var menuCls = classnames({
|
19
20
|
'pro-layout-menu': true,
|
@@ -39,6 +40,7 @@ var Menu = function Menu(props) {
|
|
39
40
|
height: headerHeight + (notice ? 32 : 0) + 48
|
40
41
|
},
|
41
42
|
theme: theme,
|
43
|
+
onMenuClick: onMenuClick,
|
42
44
|
style: {
|
43
45
|
display: collapsed ? 'block' : 'none'
|
44
46
|
}
|
@@ -51,6 +53,7 @@ var Menu = function Menu(props) {
|
|
51
53
|
collapsed: collapsed,
|
52
54
|
headerHeight: headerHeight
|
53
55
|
},
|
56
|
+
onMenuClick: onMenuClick,
|
54
57
|
style: {
|
55
58
|
display: collapsed ? 'none' : 'block',
|
56
59
|
height: "calc(100vh - ".concat(headerHeight + (notice ? 32 : 0) + 48 || 0, "px)")
|
package/es/ProLayout/index.js
CHANGED
@@ -30,7 +30,8 @@ var ProLayout = function ProLayout(props) {
|
|
30
30
|
pathPrefix = _props$pathPrefix === void 0 ? '' : _props$pathPrefix,
|
31
31
|
theme = props.theme,
|
32
32
|
target = props.target,
|
33
|
-
onCollapsedChange = props.onCollapsedChange
|
33
|
+
onCollapsedChange = props.onCollapsedChange,
|
34
|
+
onMenuClick = props.onMenuClick;
|
34
35
|
var _useSetState = useSetState({
|
35
36
|
notice: headerNotice || noticeIn,
|
36
37
|
menus: [],
|
@@ -95,6 +96,7 @@ var ProLayout = function ProLayout(props) {
|
|
95
96
|
} : menus,
|
96
97
|
notice: notice,
|
97
98
|
collapsed: collapsed,
|
99
|
+
onMenuClick: onMenuClick,
|
98
100
|
onToggle: function onToggle() {
|
99
101
|
toggle();
|
100
102
|
onCollapsedChange && onCollapsedChange(!collapsed);
|
@@ -180,6 +180,15 @@ export interface ProLayoutType {
|
|
180
180
|
* @default -
|
181
181
|
*/
|
182
182
|
onCollapsedChange?: (collapsed: boolean) => void;
|
183
|
+
/**
|
184
|
+
* @description 菜单点击回调事件,返回命中的菜单项数据和完整路径
|
185
|
+
* @default -
|
186
|
+
*/
|
187
|
+
onMenuClick?: (params: {
|
188
|
+
item: MenusType | null;
|
189
|
+
key: string;
|
190
|
+
keyPath: string[];
|
191
|
+
}) => void;
|
183
192
|
/**
|
184
193
|
* @description 规定在何处打开被链接文档
|
185
194
|
* @default "_self"
|
@@ -34,3 +34,10 @@ export declare const getPathNameKey: ({ menus, pathName, }: {
|
|
34
34
|
menus: any[];
|
35
35
|
pathName: string;
|
36
36
|
}) => any;
|
37
|
+
/**
|
38
|
+
* 根据key查找完整的菜单项数据
|
39
|
+
* @param menus 菜单数据数组
|
40
|
+
* @param key 要查找的菜单项key
|
41
|
+
* @returns 找到的菜单项数据或null
|
42
|
+
*/
|
43
|
+
export declare const findMenuItemByKey: (menus: any[], key: string) => any;
|
@@ -1,3 +1,4 @@
|
|
1
|
+
import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
|
1
2
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
2
3
|
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
3
4
|
import _isPlainObject from "lodash/isPlainObject";
|
@@ -159,4 +160,33 @@ export var getPathNameKey = function getPathNameKey(_ref) {
|
|
159
160
|
};
|
160
161
|
_menuDeep3(menus);
|
161
162
|
return result;
|
162
|
-
};
|
163
|
+
};
|
164
|
+
/**
|
165
|
+
* 根据key查找完整的菜单项数据
|
166
|
+
* @param menus 菜单数据数组
|
167
|
+
* @param key 要查找的菜单项key
|
168
|
+
* @returns 找到的菜单项数据或null
|
169
|
+
*/
|
170
|
+
var _findMenuItemByKey = function findMenuItemByKey(menus, key) {
|
171
|
+
// eslint-disable-next-line no-restricted-syntax
|
172
|
+
var _iterator = _createForOfIteratorHelper(menus),
|
173
|
+
_step;
|
174
|
+
try {
|
175
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
176
|
+
var item = _step.value;
|
177
|
+
if (String(item.id) === key) {
|
178
|
+
return item;
|
179
|
+
}
|
180
|
+
if (Array.isArray(item.children) && item.children.length) {
|
181
|
+
var found = _findMenuItemByKey(item.children, key);
|
182
|
+
if (found) return found;
|
183
|
+
}
|
184
|
+
}
|
185
|
+
} catch (err) {
|
186
|
+
_iterator.e(err);
|
187
|
+
} finally {
|
188
|
+
_iterator.f();
|
189
|
+
}
|
190
|
+
return null;
|
191
|
+
};
|
192
|
+
export { _findMenuItemByKey as findMenuItemByKey };
|
@@ -107,9 +107,7 @@ function useRequestList(service, options, useRequestOptions) {
|
|
107
107
|
}, [onChange, searchValues]);
|
108
108
|
// 重置查询条件
|
109
109
|
var onReset = (0, _react.useCallback)(function () {
|
110
|
-
onSearch({
|
111
|
-
d: Date.now()
|
112
|
-
});
|
110
|
+
onSearch({});
|
113
111
|
}, [onSearch]);
|
114
112
|
var dataSource = (0, _react.useMemo)(function () {
|
115
113
|
if (data) {
|
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
7
7
|
});
|
8
8
|
exports.default = void 0;
|
9
9
|
require("antd/es/tooltip/style");
|
10
|
-
var
|
10
|
+
var _tooltip2 = _interopRequireDefault(require("antd/es/tooltip"));
|
11
11
|
require("antd/es/button/style");
|
12
12
|
var _button = _interopRequireDefault(require("antd/es/button"));
|
13
13
|
require("antd/es/input/style");
|
@@ -27,8 +27,10 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
27
27
|
require("antd/es/form/style");
|
28
28
|
var _form = _interopRequireDefault(require("antd/es/form"));
|
29
29
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
30
|
+
var _isObject2 = _interopRequireDefault(require("lodash/isObject"));
|
30
31
|
var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
|
31
32
|
var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
|
33
|
+
var _isBoolean2 = _interopRequireDefault(require("lodash/isBoolean"));
|
32
34
|
var _isArray2 = _interopRequireDefault(require("lodash/isArray"));
|
33
35
|
var _debounce2 = _interopRequireDefault(require("lodash/debounce"));
|
34
36
|
var _jsxRuntime = require("react/jsx-runtime");
|
@@ -43,7 +45,7 @@ var _view = _interopRequireDefault(require("../../../../assets/view.svg"));
|
|
43
45
|
var _useRequestList3 = _interopRequireDefault(require("./hooks/useRequestList"));
|
44
46
|
var _locale = _interopRequireDefault(require("../../../../locale"));
|
45
47
|
var _utils = require("./utils");
|
46
|
-
var _excluded = ["value", "onChange", "disabled", "labelInValue", "fieldNames", "readOnly", "addonAfter", "configOption", "title", "onFormat", "showCodeName", "optionRender", "customRender", "style", "className", "beforeOpen", "afterOpen", "isTooltip", "searchForm", "searchKey", "defaultOne", "otherProps"],
|
48
|
+
var _excluded = ["value", "onChange", "disabled", "labelInValue", "fieldNames", "readOnly", "mode", "addonAfter", "configOption", "title", "onFormat", "showCodeName", "optionRender", "customRender", "style", "className", "beforeOpen", "afterOpen", "isTooltip", "tooltip", "searchForm", "searchKey", "defaultOne", "otherProps"],
|
47
49
|
_excluded2 = ["onOk"],
|
48
50
|
_excluded3 = ["rowKey", "columns", "rowSelection"];
|
49
51
|
var ProModalSelect = function ProModalSelect(props, ref) {
|
@@ -56,6 +58,8 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
56
58
|
fieldNames = props.fieldNames,
|
57
59
|
_props$readOnly = props.readOnly,
|
58
60
|
readOnly = _props$readOnly === void 0 ? true : _props$readOnly,
|
61
|
+
_props$mode = props.mode,
|
62
|
+
mode = _props$mode === void 0 ? 'select' : _props$mode,
|
59
63
|
addonAfter = props.addonAfter,
|
60
64
|
configOption = props.configOption,
|
61
65
|
title = props.title,
|
@@ -68,11 +72,19 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
68
72
|
beforeOpen = props.beforeOpen,
|
69
73
|
afterOpen = props.afterOpen,
|
70
74
|
isTooltip = props.isTooltip,
|
75
|
+
tooltip = props.tooltip,
|
71
76
|
searchForm = props.searchForm,
|
72
77
|
searchKey = props.searchKey,
|
73
78
|
defaultOne = props.defaultOne,
|
74
79
|
otherProps = props.otherProps,
|
75
80
|
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
81
|
+
var _tooltip = tooltip !== null && tooltip !== void 0 ? tooltip : isTooltip;
|
82
|
+
var nextMode = (0, _react.useMemo)(function () {
|
83
|
+
if ((0, _isBoolean2.default)(readOnly) && readOnly === false) {
|
84
|
+
return 'input';
|
85
|
+
}
|
86
|
+
return mode;
|
87
|
+
}, [mode, readOnly]);
|
76
88
|
var contentForm = _form.default.useFormInstance();
|
77
89
|
if (!configOption || Object.prototype.toString.call(configOption) !== '[object Object]') {
|
78
90
|
throw new Error('error: 请检查枚举选择弹框的配置项【configOption】');
|
@@ -179,8 +191,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
179
191
|
transformParams: transformParams,
|
180
192
|
transformResponse: transformResponse
|
181
193
|
}, (0, _objectSpread5.default)({
|
182
|
-
|
183
|
-
ready: (initParams || defaultOne) && !readOnly || visible
|
194
|
+
ready: (initParams || defaultOne) && nextMode === 'input' || visible
|
184
195
|
}, useRequest === null || useRequest === void 0 ? void 0 : useRequest.options)),
|
185
196
|
data = _useRequestList2.data,
|
186
197
|
loading = _useRequestList2.loading,
|
@@ -211,7 +222,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
211
222
|
if (typeof data === 'string' || typeof data === 'number') {
|
212
223
|
return data;
|
213
224
|
}
|
214
|
-
if (
|
225
|
+
if ((0, _isObject2.default)(data)) {
|
215
226
|
return handleFormat((0, _objectSpread5.default)((0, _objectSpread5.default)({}, data), {}, {
|
216
227
|
value: data[valueKey],
|
217
228
|
label: data[labelKey]
|
@@ -248,7 +259,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
248
259
|
* @returns {any}
|
249
260
|
*/
|
250
261
|
var getRowKey = function getRowKey(record) {
|
251
|
-
if (
|
262
|
+
if ((0, _isFunction2.default)(rowKey)) {
|
252
263
|
return rowKey(record);
|
253
264
|
}
|
254
265
|
return record[rowKey];
|
@@ -270,7 +281,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
270
281
|
var handleChangeValue = function handleChangeValue(e) {
|
271
282
|
onChange(e.target.value);
|
272
283
|
preValue.current = e.target.value;
|
273
|
-
if (
|
284
|
+
if (nextMode === 'input') {
|
274
285
|
setState({
|
275
286
|
_value: e.target.value
|
276
287
|
});
|
@@ -528,7 +539,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
528
539
|
selectedRows: list,
|
529
540
|
selectedRowKeys: nextSelectRowKeys
|
530
541
|
});
|
531
|
-
} else if (
|
542
|
+
} else if (nextMode === 'input') {
|
532
543
|
// 当传入initParams且文本框非只读时,不调用接口获取初始化数据
|
533
544
|
setState({
|
534
545
|
_value: value,
|
@@ -616,13 +627,13 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
616
627
|
selectedRows: (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRows) || [],
|
617
628
|
_value: undefined
|
618
629
|
});
|
619
|
-
} else if (
|
630
|
+
} else if ((0, _isArray2.default)(value)) {
|
620
631
|
setState({
|
621
632
|
selectedRowKeys: (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys) || value,
|
622
633
|
selectedRows: (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRows) || value,
|
623
634
|
_value: value
|
624
635
|
});
|
625
|
-
} else if (
|
636
|
+
} else if ((0, _isObject2.default)(value)) {
|
626
637
|
var initialValue = (0, _defineProperty2.default)((0, _defineProperty2.default)({}, valueKey, value[valueKey]), labelKey, value[labelKey]);
|
627
638
|
setState({
|
628
639
|
selectedRowKeys: [value],
|
@@ -645,7 +656,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
645
656
|
nextState.selectedRowKeys = [];
|
646
657
|
nextState.selectedRows = [];
|
647
658
|
}
|
648
|
-
if (
|
659
|
+
if ((0, _isObject2.default)(value)) {
|
649
660
|
nextState.selectedRowKeys = [getRowKey(value)];
|
650
661
|
nextState.selectedRows = [value];
|
651
662
|
}
|
@@ -671,12 +682,12 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
671
682
|
(0, _utils.hideTooltipIfOpen)(fieldRef.current, visible);
|
672
683
|
}, [visible]);
|
673
684
|
(0, _react.useEffect)(function () {
|
674
|
-
if (value && !visible && isInit &&
|
685
|
+
if (value && !visible && isInit && nextMode === 'input') {
|
675
686
|
getInitValues();
|
676
687
|
}
|
677
688
|
}, [JSON.stringify(value), visible, isInit]);
|
678
689
|
(0, _ahooks.useDebounceEffect)(function () {
|
679
|
-
if (value && !visible &&
|
690
|
+
if (value && !visible && nextMode === 'select' && (!(0, _isEqual2.default)(value, preValue.current) || (options === null || options === void 0 ? void 0 : options.length) === 0)) {
|
680
691
|
var _options$some;
|
681
692
|
preValue.current = value;
|
682
693
|
var _data3 = labelInValue ? value[valueKey] : value;
|
@@ -743,7 +754,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
743
754
|
});
|
744
755
|
}
|
745
756
|
}
|
746
|
-
if (
|
757
|
+
if (nextMode === 'input') {
|
747
758
|
if (labelInValue && _value && !(0, _isEqual2.default)(value, _value)) {
|
748
759
|
setState({
|
749
760
|
_value: value,
|
@@ -766,7 +777,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
766
777
|
width: '100%'
|
767
778
|
},
|
768
779
|
block: true,
|
769
|
-
children: [
|
780
|
+
children: [nextMode === 'select' ? (0, _jsxRuntime.jsx)(_index.ProSelect, (0, _objectSpread5.default)({
|
770
781
|
value: value,
|
771
782
|
onChange: handleSelectValue,
|
772
783
|
disabled: disabled,
|
@@ -807,17 +818,19 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
807
818
|
});
|
808
819
|
}
|
809
820
|
(0, _ahooks.useDeepCompareEffect)(function () {
|
810
|
-
|
811
|
-
|
821
|
+
var dom = document.getElementById(uuid);
|
822
|
+
if (_tooltip && value && dom) {
|
812
823
|
dom.addEventListener('mouseover', function (e) {
|
813
|
-
|
824
|
+
var _e$target, _e$target$className, _e$target$className$i;
|
825
|
+
if (value && (e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : (_e$target$className = _e$target.className) === null || _e$target$className === void 0 ? void 0 : (_e$target$className$i = _e$target$className.includes) === null || _e$target$className$i === void 0 ? void 0 : _e$target$className$i.call(_e$target$className, 'select'))) {
|
814
826
|
setState({
|
815
827
|
open: true
|
816
828
|
});
|
817
829
|
}
|
818
830
|
});
|
819
831
|
dom.addEventListener('mouseout', function (e) {
|
820
|
-
|
832
|
+
var _e$target2, _e$target2$className, _e$target2$className$;
|
833
|
+
if (e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : (_e$target2$className = _e$target2.className) === null || _e$target2$className === void 0 ? void 0 : (_e$target2$className$ = _e$target2$className.includes) === null || _e$target2$className$ === void 0 ? void 0 : _e$target2$className$.call(_e$target2$className, 'select')) {
|
821
834
|
setState({
|
822
835
|
open: false
|
823
836
|
});
|
@@ -825,14 +838,16 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
825
838
|
});
|
826
839
|
return function () {
|
827
840
|
dom.removeEventListener('mouseover', function (e) {
|
828
|
-
|
841
|
+
var _e$target3, _e$target3$className, _e$target3$className$;
|
842
|
+
if (value && (e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : (_e$target3$className = _e$target3.className) === null || _e$target3$className === void 0 ? void 0 : (_e$target3$className$ = _e$target3$className.includes) === null || _e$target3$className$ === void 0 ? void 0 : _e$target3$className$.call(_e$target3$className, 'select'))) {
|
829
843
|
setState({
|
830
844
|
open: true
|
831
845
|
});
|
832
846
|
}
|
833
847
|
});
|
834
848
|
dom.removeEventListener('mouseout', function (e) {
|
835
|
-
|
849
|
+
var _e$target4, _e$target4$className, _e$target4$className$;
|
850
|
+
if (e === null || e === void 0 ? void 0 : (_e$target4 = e.target) === null || _e$target4 === void 0 ? void 0 : (_e$target4$className = _e$target4.className) === null || _e$target4$className === void 0 ? void 0 : (_e$target4$className$ = _e$target4$className.includes) === null || _e$target4$className$ === void 0 ? void 0 : _e$target4$className$.call(_e$target4$className, 'select')) {
|
836
851
|
setState({
|
837
852
|
open: false
|
838
853
|
});
|
@@ -840,7 +855,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
840
855
|
});
|
841
856
|
};
|
842
857
|
}
|
843
|
-
}, [value,
|
858
|
+
}, [value, _tooltip, document.getElementById(uuid)]);
|
844
859
|
(0, _ahooks.useDeepCompareEffect)(function () {
|
845
860
|
setState({
|
846
861
|
options: (tableProps === null || tableProps === void 0 ? void 0 : tableProps.dataSource) || []
|
@@ -878,14 +893,14 @@ var ProModalSelect = function ProModalSelect(props, ref) {
|
|
878
893
|
className: _className,
|
879
894
|
style: style,
|
880
895
|
ref: fieldRef,
|
881
|
-
children:
|
896
|
+
children: _tooltip && viewText ? (0, _jsxRuntime.jsx)(_tooltip2.default, {
|
882
897
|
placement: "topLeft",
|
883
898
|
open: open,
|
884
899
|
title: viewText,
|
885
900
|
children: initRender
|
886
901
|
}) : initRender
|
887
902
|
}), (0, _jsxRuntime.jsxs)(_index.ProDrawerForm, (0, _objectSpread5.default)((0, _objectSpread5.default)({
|
888
|
-
|
903
|
+
mode: "Modal",
|
889
904
|
title: title,
|
890
905
|
onOk: handleFinish,
|
891
906
|
// @ts-ignore
|
@@ -80,14 +80,18 @@ interface ProModalPropsType {
|
|
80
80
|
beforeOpen?: any;
|
81
81
|
/** 打开弹框后的回调函数 */
|
82
82
|
afterOpen?: any;
|
83
|
-
/** 是否启用tooltip提示 */
|
83
|
+
/** 废弃 是否启用tooltip提示 */
|
84
84
|
isTooltip?: boolean;
|
85
|
+
/** 是否启用tooltip提示 */
|
86
|
+
tooltip?: boolean;
|
85
87
|
/** 是否以"值-名称"形式展示 */
|
86
88
|
showCodeName?: boolean;
|
87
89
|
/** 查询表单实例,用于获取查询表单数据 */
|
88
90
|
searchForm?: FormInstance;
|
89
91
|
/** 模糊查询的字段名 */
|
90
92
|
searchKey?: string;
|
93
|
+
/** 展示形式 */
|
94
|
+
mode?: 'input' | 'select';
|
91
95
|
}
|
92
96
|
/** 模态框选择器属性类型(结合Select和Input属性) */
|
93
97
|
export declare type ProModalSelectPropsType = SelectProps & InputProps & ProModalPropsType;
|
@@ -53,7 +53,7 @@
|
|
53
53
|
}
|
54
54
|
}
|
55
55
|
|
56
|
-
// 新加适用于
|
56
|
+
// 新加适用于 _readOnly false
|
57
57
|
.@{ant-prefix}-input-affix-wrapper {
|
58
58
|
border-top-right-radius: 0;
|
59
59
|
border-bottom-right-radius: 0;
|
@@ -100,7 +100,7 @@
|
|
100
100
|
}
|
101
101
|
|
102
102
|
.@{ant-prefix}-input-affix-wrapper-status-error{
|
103
|
-
|
103
|
+
|
104
104
|
}
|
105
105
|
|
106
106
|
|
@@ -20,7 +20,8 @@ var _index2 = require("../../../../index");
|
|
20
20
|
var _utils = require("../../../../utils");
|
21
21
|
var FoldMenu = function FoldMenu(props) {
|
22
22
|
var style = props.style,
|
23
|
-
dataSource = props.dataSource
|
23
|
+
dataSource = props.dataSource,
|
24
|
+
onMenuClick = props.onMenuClick;
|
24
25
|
var menus = dataSource.menus,
|
25
26
|
iconfontUrl = dataSource.iconfontUrl,
|
26
27
|
notice = dataSource.notice,
|
@@ -89,7 +90,8 @@ var FoldMenu = function FoldMenu(props) {
|
|
89
90
|
content: (0, _jsxRuntime.jsx)(_SideMenu.default, {
|
90
91
|
dataSource: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, dataSource), {}, {
|
91
92
|
menus: item
|
92
|
-
})
|
93
|
+
}),
|
94
|
+
onMenuClick: onMenuClick
|
93
95
|
}),
|
94
96
|
color: "#fff",
|
95
97
|
overlayClassName: noticeCls,
|
@@ -98,12 +100,42 @@ var FoldMenu = function FoldMenu(props) {
|
|
98
100
|
height: "calc(100vh - ".concat(headerHeight + (notice ? 32 : 0), "px)")
|
99
101
|
},
|
100
102
|
placement: "rightTop",
|
101
|
-
children:
|
103
|
+
children: (0, _jsxRuntime.jsx)("span", {
|
104
|
+
onClick: function onClick() {
|
105
|
+
// 查找完整的菜单项数据
|
106
|
+
var menuItem = (0, _utils.findMenuItemByKey)(menus, String(id));
|
107
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
108
|
+
return String(id);
|
109
|
+
}) : [String(id)];
|
110
|
+
// 调用用户传入的onMenuClick回调
|
111
|
+
if (onMenuClick) {
|
112
|
+
onMenuClick({
|
113
|
+
item: menuItem,
|
114
|
+
key: String(id),
|
115
|
+
keyPath: menuKeyPath
|
116
|
+
});
|
117
|
+
}
|
118
|
+
},
|
119
|
+
children: LiNode
|
120
|
+
})
|
102
121
|
}, "".concat(id, "-").concat(name)) : !collapsed ? (0, _jsxRuntime.jsx)(_tooltip.default, {
|
103
122
|
placement: "right",
|
104
123
|
title: name,
|
105
124
|
children: (0, _jsxRuntime.jsx)("span", {
|
106
125
|
onClick: function onClick() {
|
126
|
+
// 查找完整的菜单项数据
|
127
|
+
var menuItem = (0, _utils.findMenuItemByKey)(menus, String(id));
|
128
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
129
|
+
return String(id);
|
130
|
+
}) : [String(id)];
|
131
|
+
// 调用用户传入的onMenuClick回调
|
132
|
+
if (onMenuClick) {
|
133
|
+
onMenuClick({
|
134
|
+
item: menuItem,
|
135
|
+
key: String(id),
|
136
|
+
keyPath: menuKeyPath
|
137
|
+
});
|
138
|
+
}
|
107
139
|
onSelected({
|
108
140
|
selectedPath: toPath
|
109
141
|
});
|
@@ -113,10 +145,27 @@ var FoldMenu = function FoldMenu(props) {
|
|
113
145
|
children: LiNode
|
114
146
|
}, toPath)
|
115
147
|
})
|
116
|
-
}, toPath) : (0, _jsxRuntime.jsx)(
|
117
|
-
|
118
|
-
|
119
|
-
|
148
|
+
}, toPath) : (0, _jsxRuntime.jsx)("span", {
|
149
|
+
onClick: function onClick() {
|
150
|
+
// 查找完整的菜单项数据
|
151
|
+
var menuItem = (0, _utils.findMenuItemByKey)(menus, String(id));
|
152
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
153
|
+
return String(id);
|
154
|
+
}) : [String(id)];
|
155
|
+
// 调用用户传入的onMenuClick回调
|
156
|
+
if (onMenuClick) {
|
157
|
+
onMenuClick({
|
158
|
+
item: menuItem,
|
159
|
+
key: String(id),
|
160
|
+
keyPath: menuKeyPath
|
161
|
+
});
|
162
|
+
}
|
163
|
+
},
|
164
|
+
children: (0, _jsxRuntime.jsx)(_reactRouterDom.Link, {
|
165
|
+
to: toPath,
|
166
|
+
children: LiNode
|
167
|
+
}, toPath)
|
168
|
+
});
|
120
169
|
})
|
121
170
|
})
|
122
171
|
});
|
@@ -25,7 +25,8 @@ var OpenMenu = function OpenMenu(props) {
|
|
25
25
|
dataSource = props.dataSource,
|
26
26
|
style = props.style,
|
27
27
|
_props$theme = props.theme,
|
28
|
-
theme = _props$theme === void 0 ? 'dark' : _props$theme
|
28
|
+
theme = _props$theme === void 0 ? 'dark' : _props$theme,
|
29
|
+
onMenuClick = props.onMenuClick;
|
29
30
|
var _ref = dataSource || {},
|
30
31
|
menus = _ref.menus,
|
31
32
|
sideMenu = _ref.sideMenu;
|
@@ -149,7 +150,26 @@ var OpenMenu = function OpenMenu(props) {
|
|
149
150
|
onClick: function onClick(_ref2) {
|
150
151
|
var _item$props, _item$props2;
|
151
152
|
var item = _ref2.item,
|
152
|
-
keyPath = _ref2.keyPath
|
153
|
+
keyPath = _ref2.keyPath,
|
154
|
+
key = _ref2.key,
|
155
|
+
domEvent = _ref2.domEvent;
|
156
|
+
// console.log('item', item);
|
157
|
+
// console.log('keyPath', keyPath);
|
158
|
+
// console.log('key', key);
|
159
|
+
// console.log('domEvent', domEvent);
|
160
|
+
// 查找完整的菜单项数据
|
161
|
+
var menuItem = (0, _utils.findMenuItemByKey)(menus, key);
|
162
|
+
var menuKeyPath = (menuItem === null || menuItem === void 0 ? void 0 : menuItem.keyIdPath) ? menuItem.keyIdPath.map(function (id) {
|
163
|
+
return String(id);
|
164
|
+
}) : keyPath;
|
165
|
+
// 调用用户传入的onMenuClick回调
|
166
|
+
if (onMenuClick) {
|
167
|
+
onMenuClick({
|
168
|
+
item: menuItem,
|
169
|
+
key: key,
|
170
|
+
keyPath: menuKeyPath
|
171
|
+
});
|
172
|
+
}
|
153
173
|
setState({
|
154
174
|
selectedKeys: keyPath,
|
155
175
|
router: item === null || item === void 0 ? void 0 : (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.router
|
@@ -11,7 +11,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
11
|
var _ahooks = require("ahooks");
|
12
12
|
var _OpenMenu = _interopRequireDefault(require("../OpenMenu"));
|
13
13
|
var SideMenu = function SideMenu(props) {
|
14
|
-
var dataSource = props.dataSource
|
14
|
+
var dataSource = props.dataSource,
|
15
|
+
onMenuClick = props.onMenuClick;
|
15
16
|
var ref = (0, _react.useRef)(null);
|
16
17
|
var size = (0, _ahooks.useSize)(ref);
|
17
18
|
var menus = dataSource.menus,
|
@@ -31,6 +32,7 @@ var SideMenu = function SideMenu(props) {
|
|
31
32
|
children: (0, _jsxRuntime.jsx)(_OpenMenu.default, {
|
32
33
|
className: "pro-layout-sider-menu-list",
|
33
34
|
theme: "light",
|
35
|
+
onMenuClick: onMenuClick,
|
34
36
|
dataSource: {
|
35
37
|
menus: (menus === null || menus === void 0 ? void 0 : menus.children) || [],
|
36
38
|
iconfontUrl: iconfontUrl,
|
@@ -21,7 +21,8 @@ var Menu = function Menu(props) {
|
|
21
21
|
pure = _ref.pure,
|
22
22
|
theme = _ref.theme,
|
23
23
|
sideMenuFooterRender = _ref.sideMenuFooterRender,
|
24
|
-
sideMenuHeaderRender = _ref.sideMenuHeaderRender
|
24
|
+
sideMenuHeaderRender = _ref.sideMenuHeaderRender,
|
25
|
+
onMenuClick = _ref.onMenuClick;
|
25
26
|
var menus = [];
|
26
27
|
var menuCls = (0, _classnames.default)({
|
27
28
|
'pro-layout-menu': true,
|
@@ -47,6 +48,7 @@ var Menu = function Menu(props) {
|
|
47
48
|
height: headerHeight + (notice ? 32 : 0) + 48
|
48
49
|
},
|
49
50
|
theme: theme,
|
51
|
+
onMenuClick: onMenuClick,
|
50
52
|
style: {
|
51
53
|
display: collapsed ? 'block' : 'none'
|
52
54
|
}
|
@@ -59,6 +61,7 @@ var Menu = function Menu(props) {
|
|
59
61
|
collapsed: collapsed,
|
60
62
|
headerHeight: headerHeight
|
61
63
|
},
|
64
|
+
onMenuClick: onMenuClick,
|
62
65
|
style: {
|
63
66
|
display: collapsed ? 'none' : 'block',
|
64
67
|
height: "calc(100vh - ".concat(headerHeight + (notice ? 32 : 0) + 48 || 0, "px)")
|
package/lib/ProLayout/index.js
CHANGED
@@ -37,7 +37,8 @@ var ProLayout = function ProLayout(props) {
|
|
37
37
|
pathPrefix = _props$pathPrefix === void 0 ? '' : _props$pathPrefix,
|
38
38
|
theme = props.theme,
|
39
39
|
target = props.target,
|
40
|
-
onCollapsedChange = props.onCollapsedChange
|
40
|
+
onCollapsedChange = props.onCollapsedChange,
|
41
|
+
onMenuClick = props.onMenuClick;
|
41
42
|
var _useSetState = (0, _ahooks.useSetState)({
|
42
43
|
notice: headerNotice || noticeIn,
|
43
44
|
menus: [],
|
@@ -102,6 +103,7 @@ var ProLayout = function ProLayout(props) {
|
|
102
103
|
} : menus,
|
103
104
|
notice: notice,
|
104
105
|
collapsed: collapsed,
|
106
|
+
onMenuClick: onMenuClick,
|
105
107
|
onToggle: function onToggle() {
|
106
108
|
toggle();
|
107
109
|
onCollapsedChange && onCollapsedChange(!collapsed);
|
@@ -180,6 +180,15 @@ export interface ProLayoutType {
|
|
180
180
|
* @default -
|
181
181
|
*/
|
182
182
|
onCollapsedChange?: (collapsed: boolean) => void;
|
183
|
+
/**
|
184
|
+
* @description 菜单点击回调事件,返回命中的菜单项数据和完整路径
|
185
|
+
* @default -
|
186
|
+
*/
|
187
|
+
onMenuClick?: (params: {
|
188
|
+
item: MenusType | null;
|
189
|
+
key: string;
|
190
|
+
keyPath: string[];
|
191
|
+
}) => void;
|
183
192
|
/**
|
184
193
|
* @description 规定在何处打开被链接文档
|
185
194
|
* @default "_self"
|
@@ -34,3 +34,10 @@ export declare const getPathNameKey: ({ menus, pathName, }: {
|
|
34
34
|
menus: any[];
|
35
35
|
pathName: string;
|
36
36
|
}) => any;
|
37
|
+
/**
|
38
|
+
* 根据key查找完整的菜单项数据
|
39
|
+
* @param menus 菜单数据数组
|
40
|
+
* @param key 要查找的菜单项key
|
41
|
+
* @returns 找到的菜单项数据或null
|
42
|
+
*/
|
43
|
+
export declare const findMenuItemByKey: (menus: any[], key: string) => any;
|
@@ -4,9 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
5
5
|
value: true
|
6
6
|
});
|
7
|
-
exports.getPathNameKey = exports.getIdsByPathName = void 0;
|
7
|
+
exports.getPathNameKey = exports.getIdsByPathName = exports.findMenuItemByKey = void 0;
|
8
8
|
exports.getUrlParams = getUrlParams;
|
9
9
|
exports.transformMenus = exports.transformMenu = void 0;
|
10
|
+
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
|
10
11
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
11
12
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
12
13
|
var _isPlainObject2 = _interopRequireDefault(require("lodash/isPlainObject"));
|
@@ -168,4 +169,32 @@ var getPathNameKey = exports.getPathNameKey = function getPathNameKey(_ref) {
|
|
168
169
|
};
|
169
170
|
_menuDeep3(menus);
|
170
171
|
return result;
|
172
|
+
};
|
173
|
+
/**
|
174
|
+
* 根据key查找完整的菜单项数据
|
175
|
+
* @param menus 菜单数据数组
|
176
|
+
* @param key 要查找的菜单项key
|
177
|
+
* @returns 找到的菜单项数据或null
|
178
|
+
*/
|
179
|
+
var _findMenuItemByKey = exports.findMenuItemByKey = function findMenuItemByKey(menus, key) {
|
180
|
+
// eslint-disable-next-line no-restricted-syntax
|
181
|
+
var _iterator = (0, _createForOfIteratorHelper2.default)(menus),
|
182
|
+
_step;
|
183
|
+
try {
|
184
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
185
|
+
var item = _step.value;
|
186
|
+
if (String(item.id) === key) {
|
187
|
+
return item;
|
188
|
+
}
|
189
|
+
if (Array.isArray(item.children) && item.children.length) {
|
190
|
+
var found = _findMenuItemByKey(item.children, key);
|
191
|
+
if (found) return found;
|
192
|
+
}
|
193
|
+
}
|
194
|
+
} catch (err) {
|
195
|
+
_iterator.e(err);
|
196
|
+
} finally {
|
197
|
+
_iterator.f();
|
198
|
+
}
|
199
|
+
return null;
|
171
200
|
};
|