@zat-design/sisyphus-react 4.6.0-beta.1 → 4.6.0-beta.2
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/ProLayout/components/TabsManager/hooks/useTabsState.js +6 -5
- package/es/ProLayout/components/TabsManager/propTypes.d.ts +2 -2
- package/es/ProLayout/propTypes.d.ts +8 -2
- package/es/ProSelect/index.js +23 -8
- package/es/ProSelect/utils/index.d.ts +3 -2
- package/es/ProSelect/utils/index.js +19 -9
- package/es/ProTable/components/RenderTabs/index.js +6 -2
- package/package.json +1 -1
|
@@ -273,21 +273,22 @@ const useTabsState = (options) => {
|
|
|
273
273
|
(tabId) => {
|
|
274
274
|
setState((prevState) => {
|
|
275
275
|
var _a;
|
|
276
|
-
const
|
|
276
|
+
const targetTabId = tabId ?? prevState.activeKey;
|
|
277
|
+
const tabToRemove = prevState.tabsList.find((tab) => tab.id === targetTabId);
|
|
277
278
|
if (!tabToRemove || !tabToRemove.closable) {
|
|
278
279
|
return prevState;
|
|
279
280
|
}
|
|
280
|
-
const newTabs = prevState.tabsList.filter((tab) => tab.id !==
|
|
281
|
+
const newTabs = prevState.tabsList.filter((tab) => tab.id !== targetTabId);
|
|
281
282
|
let newActiveKey = prevState.activeKey;
|
|
282
283
|
let newActiveTabInfo = prevState.activeTabInfo;
|
|
283
284
|
let newActiveComponent = prevState.activeComponent;
|
|
284
|
-
if (prevState.activeKey ===
|
|
285
|
-
const currentIndex = prevState.tabsList.findIndex((tab) => tab.id ===
|
|
285
|
+
if (prevState.activeKey === targetTabId && newTabs.length > 0) {
|
|
286
|
+
const currentIndex = prevState.tabsList.findIndex((tab) => tab.id === targetTabId);
|
|
286
287
|
const newActiveIndex = Math.min(currentIndex, newTabs.length - 1);
|
|
287
288
|
newActiveTabInfo = newTabs[newActiveIndex];
|
|
288
289
|
newActiveKey = newActiveTabInfo.id;
|
|
289
290
|
newActiveComponent = ((_a = newActiveTabInfo.menuItem) == null ? void 0 : _a.code) || newActiveTabInfo.id;
|
|
290
|
-
} else if (prevState.activeKey ===
|
|
291
|
+
} else if (prevState.activeKey === targetTabId) {
|
|
291
292
|
newActiveKey = "";
|
|
292
293
|
newActiveTabInfo = void 0;
|
|
293
294
|
newActiveComponent = "";
|
|
@@ -67,8 +67,8 @@ export interface UseTabsStateReturn {
|
|
|
67
67
|
addTab: (menuItem: MenusType, options?: AddTabOptions) => void;
|
|
68
68
|
/** 检查是否可以添加标签页 */
|
|
69
69
|
canAddTab: (menuItem: MenusType, options?: AddTabOptions) => boolean;
|
|
70
|
-
/**
|
|
71
|
-
removeTab: (tabId
|
|
70
|
+
/** 移除指定标签页;不传 tabId 时移除当前激活标签页 */
|
|
71
|
+
removeTab: (tabId?: string) => void;
|
|
72
72
|
/** 更新指定 id 的标签页字段(替换语义;找不到时 no-op) */
|
|
73
73
|
updateTab: (tabId: string, updates: UpdateTabParams) => void;
|
|
74
74
|
/** 更新页签当前 URL,保持 tab.id 不变 */
|
|
@@ -464,9 +464,15 @@ export interface ProLayoutTabsInstance {
|
|
|
464
464
|
*/
|
|
465
465
|
addTab: (params: AddTabParams, options?: AddTabOptions) => void;
|
|
466
466
|
/**
|
|
467
|
-
* @description
|
|
467
|
+
* @description 删除指定标签页;不传 tabId 时删除当前激活标签页
|
|
468
|
+
* @param tabId 目标标签页 id,省略时使用当前激活标签页
|
|
469
|
+
* @example
|
|
470
|
+
* ```tsx
|
|
471
|
+
* layoutTabs.removeTab();
|
|
472
|
+
* layoutTabs.removeTab('tab-id');
|
|
473
|
+
* ```
|
|
468
474
|
*/
|
|
469
|
-
removeTab: (tabId
|
|
475
|
+
removeTab: (tabId?: string) => void;
|
|
470
476
|
/**
|
|
471
477
|
* @description 更新已存在标签页的展示信息(不会卸载/重挂渲染组件)
|
|
472
478
|
* @param tabId 目标标签页 id
|
package/es/ProSelect/index.js
CHANGED
|
@@ -14,6 +14,7 @@ import React, {
|
|
|
14
14
|
import isFunction from "lodash/isFunction";
|
|
15
15
|
import omit from "lodash/omit";
|
|
16
16
|
import isNumber from "lodash/isNumber";
|
|
17
|
+
import isString from "lodash/isString";
|
|
17
18
|
import { useProConfig } from "../ProConfigProvider";
|
|
18
19
|
import Container from "../ProForm/components/Container";
|
|
19
20
|
import AdaptiveTooltip from "./components/AdaptiveTooltip";
|
|
@@ -190,9 +191,25 @@ const ProSelect = (props, ref) => {
|
|
|
190
191
|
const option = findOption(v);
|
|
191
192
|
if (!option)
|
|
192
193
|
return "-";
|
|
193
|
-
|
|
194
|
+
const optionLabel = option[label];
|
|
195
|
+
if (!selectProps.showCodeName)
|
|
196
|
+
return optionLabel;
|
|
197
|
+
if (isString(optionLabel) || isNumber(optionLabel)) {
|
|
198
|
+
return `${option[code]}-${optionLabel}`;
|
|
199
|
+
}
|
|
200
|
+
return /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
201
|
+
option[code],
|
|
202
|
+
"-",
|
|
203
|
+
optionLabel
|
|
204
|
+
] });
|
|
194
205
|
});
|
|
195
|
-
|
|
206
|
+
if (labelList.every((item) => isString(item) || isNumber(item))) {
|
|
207
|
+
return labelList.join("、");
|
|
208
|
+
}
|
|
209
|
+
return labelList.map((item, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
210
|
+
index > 0 ? "、" : null,
|
|
211
|
+
item
|
|
212
|
+
] }, `${String(value2[index] ?? "empty")}-${index}`));
|
|
196
213
|
};
|
|
197
214
|
const defaultFilterOption = useCallback(defaultFilterOptionFn, []);
|
|
198
215
|
const mergedShowSearch = useMemo(() => {
|
|
@@ -282,13 +299,11 @@ const ProSelect = (props, ref) => {
|
|
|
282
299
|
};
|
|
283
300
|
const isReactElement = (element) => isValidElement(element);
|
|
284
301
|
const selectOptionRender = (option) => {
|
|
285
|
-
var _a2, _b2
|
|
302
|
+
var _a2, _b2;
|
|
286
303
|
const currentRecord = ((_a2 = option == null ? void 0 : option.data) == null ? void 0 : _a2.record) || (option == null ? void 0 : option.record);
|
|
287
|
-
const
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
}
|
|
291
|
-
return /* @__PURE__ */ jsx(TooltipOption, { title: String(text), children: OptionRender ? /* @__PURE__ */ jsx("span", { children: OptionRender(currentRecord) }) : /* @__PURE__ */ jsx("span", { children: String(text) }) });
|
|
304
|
+
const optionLabel = ((_b2 = option == null ? void 0 : option.data) == null ? void 0 : _b2.label) ?? (option == null ? void 0 : option.label) ?? "";
|
|
305
|
+
const content = currentRecord && OptionRender ? OptionRender(currentRecord) : optionLabel;
|
|
306
|
+
return /* @__PURE__ */ jsx(TooltipOption, { children: /* @__PURE__ */ jsx("span", { children: content }) });
|
|
292
307
|
};
|
|
293
308
|
const mode = selectProps.mode;
|
|
294
309
|
const handleChange = (value2, rawOption) => {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
1
2
|
import type { DataOptionType } from '../propsType';
|
|
2
3
|
/**
|
|
3
4
|
* 返回当前组件可以显示的数据源
|
|
@@ -27,7 +28,7 @@ export declare const getOptionText: ({ item, optionRender, showCodeName, code, l
|
|
|
27
28
|
showCodeName?: boolean;
|
|
28
29
|
code: string;
|
|
29
30
|
label: string;
|
|
30
|
-
}) =>
|
|
31
|
+
}) => ReactNode;
|
|
31
32
|
/** 构建单个 antd Select option 对象 */
|
|
32
33
|
export declare const buildOptionItem: (item: DataOptionType, index: number, config: {
|
|
33
34
|
optionRender?: (item: DataOptionType) => any;
|
|
@@ -36,7 +37,7 @@ export declare const buildOptionItem: (item: DataOptionType, index: number, conf
|
|
|
36
37
|
label: string;
|
|
37
38
|
}) => {
|
|
38
39
|
key: string;
|
|
39
|
-
label:
|
|
40
|
+
label: ReactNode;
|
|
40
41
|
value: any;
|
|
41
42
|
disabled: boolean;
|
|
42
43
|
title: string;
|
|
@@ -2,6 +2,7 @@ import difference from "lodash/difference";
|
|
|
2
2
|
import isNumber from "lodash/isNumber";
|
|
3
3
|
import isObject from "lodash/isObject";
|
|
4
4
|
import isString from "lodash/isString";
|
|
5
|
+
import { createElement, Fragment } from "react";
|
|
5
6
|
const findSelectNameValues = ({
|
|
6
7
|
list = [],
|
|
7
8
|
selectName,
|
|
@@ -130,22 +131,30 @@ const getOptionText = ({
|
|
|
130
131
|
code,
|
|
131
132
|
label
|
|
132
133
|
}) => {
|
|
134
|
+
const itemLabel = item[label];
|
|
133
135
|
if (optionRender) {
|
|
134
136
|
const rendered = optionRender(item);
|
|
135
|
-
return isString(rendered) ? rendered : String(
|
|
137
|
+
return isString(rendered) ? rendered : isObject(itemLabel) ? itemLabel : String(itemLabel ?? "");
|
|
136
138
|
}
|
|
137
|
-
|
|
138
|
-
|
|
139
|
+
if (!showCodeName) {
|
|
140
|
+
return isObject(itemLabel) ? itemLabel : String(itemLabel ?? "");
|
|
141
|
+
}
|
|
142
|
+
if (isString(itemLabel) || isNumber(itemLabel)) {
|
|
143
|
+
return `${item[code]}-${itemLabel}`;
|
|
144
|
+
}
|
|
145
|
+
return createElement(Fragment, null, item[code], "-", itemLabel);
|
|
139
146
|
};
|
|
140
147
|
const buildOptionItem = (item, index, config) => {
|
|
141
|
-
const
|
|
148
|
+
const optionLabel = getOptionText({ item, ...config });
|
|
149
|
+
const isTextLabel = isString(optionLabel) || isNumber(optionLabel);
|
|
150
|
+
const searchText = isTextLabel ? String(optionLabel) : isString(item[config.label]) || isNumber(item[config.label]) ? String(item[config.label]) : item[config.code] != null ? String(item[config.code]) : "";
|
|
142
151
|
return {
|
|
143
152
|
key: item[config.code] != null ? `${item[config.code]}-${index}` : `option-${index}`,
|
|
144
|
-
label:
|
|
153
|
+
label: optionLabel,
|
|
145
154
|
value: item[config.code] != null ? item[config.code] : void 0,
|
|
146
155
|
disabled: !!item.disabled,
|
|
147
|
-
title:
|
|
148
|
-
searchText
|
|
156
|
+
title: isTextLabel ? String(optionLabel) : void 0,
|
|
157
|
+
searchText,
|
|
149
158
|
record: item
|
|
150
159
|
};
|
|
151
160
|
};
|
|
@@ -156,9 +165,10 @@ const buildSelectOptions = (list, config) => {
|
|
|
156
165
|
return list.map((item, index) => {
|
|
157
166
|
const groupOptions = item.options;
|
|
158
167
|
if (Array.isArray(groupOptions)) {
|
|
168
|
+
const groupLabel = item[config.label];
|
|
159
169
|
return {
|
|
160
|
-
key: item[config.
|
|
161
|
-
label:
|
|
170
|
+
key: isString(groupLabel) || isNumber(groupLabel) ? String(groupLabel) : item[config.code] != null ? String(item[config.code]) : `group-${index}`,
|
|
171
|
+
label: groupLabel,
|
|
162
172
|
options: groupOptions.map(
|
|
163
173
|
(opt, optIndex) => buildOptionItem(opt, optIndex, config)
|
|
164
174
|
)
|
|
@@ -14,7 +14,8 @@ const RenderTabs = (props) => {
|
|
|
14
14
|
formTableProps,
|
|
15
15
|
transformParams
|
|
16
16
|
} = props;
|
|
17
|
-
const { form, onSearch } = formTableProps || {};
|
|
17
|
+
const { form, onSearch, loading } = formTableProps || {};
|
|
18
|
+
const requestLoading = Boolean(loading);
|
|
18
19
|
const [activeKey, setActiveKey] = useState(props.activeKey);
|
|
19
20
|
const [options] = useEnum(code || "__PRO_TABLE_NO_CODE__");
|
|
20
21
|
const fieldValue = Form.useWatch(name, form);
|
|
@@ -48,6 +49,8 @@ const RenderTabs = (props) => {
|
|
|
48
49
|
return null;
|
|
49
50
|
}
|
|
50
51
|
const handleChange = (key) => {
|
|
52
|
+
if (requestLoading)
|
|
53
|
+
return;
|
|
51
54
|
const fieldsValues = (form == null ? void 0 : form.getFieldsValue()) || {};
|
|
52
55
|
setActiveKey(key);
|
|
53
56
|
form.setFieldValue(name, key);
|
|
@@ -65,7 +68,7 @@ const RenderTabs = (props) => {
|
|
|
65
68
|
onChange: handleChange,
|
|
66
69
|
type: "card",
|
|
67
70
|
...tabsProps,
|
|
68
|
-
items: tabItems,
|
|
71
|
+
items: requestLoading ? tabItems.map((item) => ({ ...item, disabled: true })) : tabItems,
|
|
69
72
|
activeKey
|
|
70
73
|
}
|
|
71
74
|
);
|
|
@@ -76,6 +79,7 @@ const RenderTabs = (props) => {
|
|
|
76
79
|
className: "pro-table-segmented",
|
|
77
80
|
options: tabItems.map((item) => ({ label: item.label, value: item.key })),
|
|
78
81
|
...segmentedProps,
|
|
82
|
+
disabled: requestLoading || (segmentedProps == null ? void 0 : segmentedProps.disabled),
|
|
79
83
|
onChange: (value) => handleChange(value),
|
|
80
84
|
value: activeKey
|
|
81
85
|
}
|