@teamix/pro 1.2.23 → 1.2.28
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/dist/212.js +129 -129
- package/dist/pro.css +1 -1
- package/dist/pro.js +18109 -15665
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/dist/pro.min.js.LICENSE.txt +2 -0
- package/es/actions/dialog.js +4 -3
- package/es/actions/index.d.ts +12 -9
- package/es/actions/index.js +56 -15
- package/es/actions/index.scss +12 -1
- package/es/form/Filter/AdvancedFilter.js +1 -1
- package/es/form/Filter/Layout.d.ts +5 -0
- package/es/form/Filter/Layout.js +82 -0
- package/es/form/Filter/SimpleFilter.js +30 -6
- package/es/form/Filter/index2.d.ts +2 -1
- package/es/form/Filter/index2.js +97 -116
- package/es/form/Filter/index2.scss +16 -45
- package/es/form/Filter/layout.scss +36 -0
- package/es/form/Filter/useSpecialProps.d.ts +6 -0
- package/es/form/Filter/useSpecialProps.js +37 -0
- package/es/form/ProForm/customComponent.d.ts +3 -0
- package/es/form/ProForm/customComponent.js +20 -0
- package/es/form/ProForm/index.scss +5 -6
- package/es/form/ProForm/useFormDisplayValues.js +14 -24
- package/es/form/SchemaForm/adapterType.js +1 -0
- package/es/form/SchemaForm/index.js +8 -6
- package/es/form/SchemaForm/initializeDataSource.d.ts +1 -1
- package/es/form/SchemaForm/initializeDataSource.js +2 -2
- package/es/form/SchemaForm/initializeRequest.d.ts +1 -1
- package/es/form/SchemaForm/initializeRequest.js +2 -2
- package/es/form/SchemaForm/initializeRules.d.ts +1 -1
- package/es/form/SchemaForm/initializeRules.js +3 -3
- package/es/form/fieldTypeMap.js +2 -1
- package/es/form/index.d.ts +4 -2
- package/es/form/index.js +4 -2
- package/es/form/typing.d.ts +25 -1
- package/es/form/utils.d.ts +2 -2
- package/es/form/utils.js +2 -2
- package/es/index.d.ts +5 -2
- package/es/index.js +6 -3
- package/es/info/index.scss +1 -1
- package/es/nocode/pages/renderer.js +1 -1
- package/es/step/ProStepItem/components/HozStepItem/index.d.ts +5 -0
- package/es/step/ProStepItem/components/HozStepItem/index.js +235 -0
- package/es/step/ProStepItem/components/HozStepItem/index.scss +279 -0
- package/es/step/ProStepItem/components/VerStepItem/index.d.ts +5 -0
- package/es/step/ProStepItem/components/VerStepItem/index.js +295 -0
- package/es/step/ProStepItem/components/VerStepItem/index.scss +287 -0
- package/es/step/ProStepItem/index.d.ts +4 -0
- package/es/step/ProStepItem/index.js +57 -0
- package/es/step/index.d.ts +9 -0
- package/es/step/index.js +101 -0
- package/es/step/typing.d.ts +96 -0
- package/es/step/typing.js +1 -0
- package/es/table/components/Filter/index.js +2 -17
- package/es/table/components/Layout/index.js +63 -167
- package/es/table/components/Layout/index.scss +4 -3
- package/es/table/components/Pagination/index.js +2 -2
- package/es/table/components/Pagination/index.scss +5 -0
- package/es/table/components/ToolBar/FullScreenIcon.js +4 -9
- package/es/table/components/ToolBar/Fullscreen.js +21 -11
- package/es/table/index.js +82 -104
- package/es/table/index.scss +5 -5
- package/es/table/typing.d.ts +16 -10
- package/es/table/utils/columnRender.js +21 -3
- package/es/table/utils/index.d.ts +7 -0
- package/es/table/utils/index.js +36 -0
- package/es/utils/index.d.ts +1 -0
- package/es/utils/index.js +1 -0
- package/lib/actions/dialog.js +4 -3
- package/lib/actions/index.d.ts +12 -9
- package/lib/actions/index.js +56 -15
- package/lib/actions/index.scss +12 -1
- package/lib/form/Filter/AdvancedFilter.js +1 -1
- package/lib/form/Filter/Layout.d.ts +5 -0
- package/lib/form/Filter/Layout.js +102 -0
- package/lib/form/Filter/SimpleFilter.js +29 -4
- package/lib/form/Filter/index2.d.ts +2 -1
- package/lib/form/Filter/index2.js +101 -114
- package/lib/form/Filter/index2.scss +16 -45
- package/lib/form/Filter/layout.scss +36 -0
- package/lib/form/Filter/useSpecialProps.d.ts +6 -0
- package/lib/form/Filter/useSpecialProps.js +46 -0
- package/lib/form/ProForm/customComponent.d.ts +3 -0
- package/lib/form/ProForm/customComponent.js +28 -0
- package/lib/form/ProForm/index.scss +5 -6
- package/lib/form/ProForm/useFormDisplayValues.js +17 -24
- package/lib/form/SchemaForm/adapterType.js +1 -0
- package/lib/form/SchemaForm/index.js +8 -6
- package/lib/form/SchemaForm/initializeDataSource.d.ts +1 -1
- package/lib/form/SchemaForm/initializeDataSource.js +2 -2
- package/lib/form/SchemaForm/initializeRequest.d.ts +1 -1
- package/lib/form/SchemaForm/initializeRequest.js +2 -2
- package/lib/form/SchemaForm/initializeRules.d.ts +1 -1
- package/lib/form/SchemaForm/initializeRules.js +3 -3
- package/lib/form/fieldTypeMap.js +2 -1
- package/lib/form/index.d.ts +4 -2
- package/lib/form/index.js +19 -1
- package/lib/form/typing.d.ts +25 -1
- package/lib/form/utils.d.ts +2 -2
- package/lib/form/utils.js +2 -2
- package/lib/index.d.ts +5 -2
- package/lib/index.js +35 -3
- package/lib/info/index.scss +1 -1
- package/lib/nocode/pages/renderer.js +1 -1
- package/lib/step/ProStepItem/components/HozStepItem/index.d.ts +5 -0
- package/lib/step/ProStepItem/components/HozStepItem/index.js +258 -0
- package/lib/step/ProStepItem/components/HozStepItem/index.scss +279 -0
- package/lib/step/ProStepItem/components/VerStepItem/index.d.ts +5 -0
- package/lib/step/ProStepItem/components/VerStepItem/index.js +315 -0
- package/lib/step/ProStepItem/components/VerStepItem/index.scss +287 -0
- package/lib/step/ProStepItem/index.d.ts +4 -0
- package/lib/step/ProStepItem/index.js +69 -0
- package/lib/step/index.d.ts +9 -0
- package/lib/step/index.js +124 -0
- package/lib/step/typing.d.ts +96 -0
- package/lib/step/typing.js +5 -0
- package/lib/table/components/Filter/index.js +2 -17
- package/lib/table/components/Layout/index.js +61 -167
- package/lib/table/components/Layout/index.scss +4 -3
- package/lib/table/components/Pagination/index.js +2 -2
- package/lib/table/components/Pagination/index.scss +5 -0
- package/lib/table/components/ToolBar/FullScreenIcon.js +4 -9
- package/lib/table/components/ToolBar/Fullscreen.js +22 -11
- package/lib/table/index.js +78 -101
- package/lib/table/index.scss +5 -5
- package/lib/table/typing.d.ts +16 -10
- package/lib/table/utils/columnRender.js +21 -3
- package/lib/table/utils/index.d.ts +7 -0
- package/lib/table/utils/index.js +38 -0
- package/lib/utils/index.d.ts +1 -0
- package/lib/utils/index.js +13 -0
- package/package.json +4 -4
@@ -1,6 +1,6 @@
|
|
1
1
|
import type { ProFormRequestConfig } from '../typing';
|
2
2
|
interface IInitializeDataSource {
|
3
|
-
(requestConfig?: ProFormRequestConfig | any,
|
3
|
+
(requestConfig?: ProFormRequestConfig | any, suffix?: string): {
|
4
4
|
dataSource?: any[];
|
5
5
|
reactions: any[];
|
6
6
|
scope: {
|
@@ -2,10 +2,10 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
2
2
|
|
3
3
|
import { isPlainObj } from '@teamix/utils';
|
4
4
|
|
5
|
-
var initializeDataSource = function initializeDataSource(dataSource,
|
5
|
+
var initializeDataSource = function initializeDataSource(dataSource, suffix) {
|
6
6
|
if (isPlainObj(dataSource)) {
|
7
7
|
var requestConfig = dataSource;
|
8
|
-
var requestConfigName = "$requestConfig_".concat(
|
8
|
+
var requestConfigName = "$requestConfig_".concat(suffix);
|
9
9
|
return {
|
10
10
|
reactions: ["{{$dataSource($request,".concat(requestConfigName, ",context)}}")],
|
11
11
|
scope: _defineProperty({}, requestConfigName, requestConfig)
|
@@ -1,8 +1,8 @@
|
|
1
1
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
2
2
|
|
3
|
-
var initializeRequest = function initializeRequest(requestConfig,
|
3
|
+
var initializeRequest = function initializeRequest(requestConfig, suffix) {
|
4
4
|
if (requestConfig) {
|
5
|
-
var requestConfigName = "$requestConfig_".concat(
|
5
|
+
var requestConfigName = "$requestConfig_".concat(suffix);
|
6
6
|
return {
|
7
7
|
reactions: ["{{$common($request,".concat(requestConfigName, ",context)}}")],
|
8
8
|
scope: _defineProperty({}, requestConfigName, requestConfig)
|
@@ -18,13 +18,13 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
18
18
|
|
19
19
|
import { isArr, isPlainObj } from '@teamix/utils';
|
20
20
|
|
21
|
-
var initializeRules = function initializeRules(rules,
|
21
|
+
var initializeRules = function initializeRules(rules, suffix) {
|
22
22
|
var initializeValidator = function initializeValidator(rule) {
|
23
|
-
var
|
23
|
+
var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
24
24
|
|
25
25
|
if (isPlainObj(rule === null || rule === void 0 ? void 0 : rule.validator)) {
|
26
26
|
var requestConfig = rule.validator;
|
27
|
-
var requestConfigName = "$requestConfig_".concat(
|
27
|
+
var requestConfigName = "$requestConfig_".concat(suffix).concat(index);
|
28
28
|
return {
|
29
29
|
rules: _objectSpread(_objectSpread({}, rule), {}, {
|
30
30
|
validator: "{{$validator($request,".concat(requestConfigName, ",context)}}")
|
package/es/form/fieldTypeMap.js
CHANGED
package/es/form/index.d.ts
CHANGED
@@ -97,7 +97,8 @@ declare const formilyReact: {
|
|
97
97
|
useFieldSchema: () => originalFormilyReact.Schema<any, any, any, any, any, any, any, any, any>;
|
98
98
|
useFormEffects: (effects?: ((form: import("@formily/core").Form<any>) => void) | undefined) => void;
|
99
99
|
};
|
100
|
-
|
100
|
+
import { customComponent } from './ProForm/customComponent';
|
101
|
+
export { formilyReact, customComponent };
|
101
102
|
/**
|
102
103
|
* 导出常用formily内容
|
103
104
|
*/
|
@@ -110,7 +111,8 @@ export { createForm, FormConsumer, FormDialog, FormDrawer, FormStep, FormTab, Fo
|
|
110
111
|
*/
|
111
112
|
import { AdvancedFilter, SimpleFilter } from './Filter';
|
112
113
|
import { QueryFilter } from './Filter/index2';
|
113
|
-
|
114
|
+
import { QueryFilterLayout } from './Filter/Layout';
|
115
|
+
export { AdvancedFilter, SimpleFilter, QueryFilter, QueryFilterLayout };
|
114
116
|
/**
|
115
117
|
* 导出 ProForm 组件,支持快速搭建表单
|
116
118
|
*/
|
package/es/form/index.js
CHANGED
@@ -27,7 +27,8 @@ var formilyReact = _objectSpread(_objectSpread({}, originalFormilyReact), {}, {
|
|
27
27
|
useFormDisplayValues: useFormDisplayValues
|
28
28
|
});
|
29
29
|
|
30
|
-
|
30
|
+
import { customComponent } from './ProForm/customComponent';
|
31
|
+
export { formilyReact, customComponent };
|
31
32
|
/**
|
32
33
|
* 导出常用formily内容
|
33
34
|
*/
|
@@ -42,7 +43,8 @@ export { createForm, FormConsumer, FormDialog, FormDrawer, FormStep, FormTab, Fo
|
|
42
43
|
|
43
44
|
import { AdvancedFilter, SimpleFilter } from './Filter';
|
44
45
|
import { QueryFilter } from './Filter/index2';
|
45
|
-
|
46
|
+
import { QueryFilterLayout } from './Filter/Layout';
|
47
|
+
export { AdvancedFilter, SimpleFilter, QueryFilter, QueryFilterLayout };
|
46
48
|
/**
|
47
49
|
* 导出 ProForm 组件,支持快速搭建表单
|
48
50
|
*/
|
package/es/form/typing.d.ts
CHANGED
@@ -10,7 +10,7 @@ declare type FieldDisplayTypes = 'none' | 'hidden' | 'visible';
|
|
10
10
|
export interface ProFormInitializeItem {
|
11
11
|
(item: ProFormSchemaItem, props?: any): ProFormSchemaItem;
|
12
12
|
}
|
13
|
-
declare type IBaseComponent = 'Input' | 'Password' | 'TextArea' | 'NumberPicker' | 'Percent' | 'Money' | 'Select' | 'MultipleSelect' | 'TreeSelect' | 'Cascader' | 'MultipleCascader' | 'ArbitraryCascader' | 'Radio' | 'Checkbox' | 'Switch' | 'DatePicker' | 'TimePicker' | 'DateTimePicker' | 'WeekPicker' | 'MonthPicker' | 'YearPicker' | 'QuarterPicker' | 'DateRangePicker' | 'TimeRangePicker' | 'DateTimeRangePicker' | 'WeekRangePicker' | 'MonthRangePicker' | 'YearRangePicker' | 'QuarterRangePicker' | 'Transfer' | 'Upload' | 'ColorPicker' | 'ColorRadio' | 'IconPicker' | 'JsonInput' | 'TagPicker' | 'MultipleTagPicker' | 'Range' | 'Search';
|
13
|
+
declare type IBaseComponent = 'Input' | 'Password' | 'TextArea' | 'NumberPicker' | 'Percent' | 'Money' | 'Select' | 'MultipleSelect' | 'TreeSelect' | 'Cascader' | 'MultipleCascader' | 'ArbitraryCascader' | 'Radio' | 'Checkbox' | 'Switch' | 'DatePicker' | 'TimePicker' | 'DateTimePicker' | 'WeekPicker' | 'MonthPicker' | 'YearPicker' | 'QuarterPicker' | 'DateRangePicker' | 'TimeRangePicker' | 'DateTimeRangePicker' | 'WeekRangePicker' | 'MonthRangePicker' | 'YearRangePicker' | 'QuarterRangePicker' | 'Transfer' | 'Upload' | 'ColorPicker' | 'ColorRadio' | 'IconPicker' | 'JsonInput' | 'TagPicker' | 'MultipleTagPicker' | 'Range' | 'Search' | 'SelectGroup';
|
14
14
|
declare type IButtonComponent = 'Submit' | 'Reset';
|
15
15
|
declare type IComboComponent = 'ArrayCards' | 'ArrayCards.Addition' | 'ArrayCards.Remove' | 'ArrayCards.MoveUp' | 'ArrayCards.MoveDown' | 'ArrayCards.Index' | 'ArrayCollapse' | 'ArrayCollapse.CollapsePanel' | 'ArrayCollapse.Addition' | 'ArrayCollapse.Remove' | 'ArrayCollapse.MoveUp' | 'ArrayCollapse.MoveDown' | 'ArrayCollapse.Index' | 'ArrayTable' | 'ArrayTable.Column' | 'ArrayTable.SortHandle' | 'ArrayTable.Addition' | 'ArrayTable.Remove' | 'ArrayTable.MoveDown' | 'ArrayTable.MoveUp' | 'ArrayTable.Index' | 'ArrayItems' | 'ArrayItems.Item' | 'ArrayItems.SortHandle' | 'ArrayItems.Addition' | 'ArrayItems.Remove' | 'ArrayItems.MoveDown' | 'ArrayItems.MoveUp' | 'ArrayItems.Index' | 'Editable' | 'Editable.Popover' | 'Editable.Dialog' | 'Editable.Drawer';
|
16
16
|
declare type ILayoutComponent = 'FormFlex' | 'FormGrid' | 'FormGroup' | 'FormGroup.GroupPanel' | 'Search' | 'Search.SearchPanel' | 'FormTab' | 'FormTab.TabPane' | 'FormStep' | 'FormStep.StepPane' | 'FormCollapse' | 'FormCollapse.CollapsePanel' | 'FormButtonGroup' | 'FormDialog' | 'FormDrawer' | 'FormDialog.Footer' | 'FormDrawer.Footer';
|
@@ -70,20 +70,44 @@ export interface FilterProps extends ProFormProps {
|
|
70
70
|
onReset?: (payload?: any) => void;
|
71
71
|
onResetClick?: () => void;
|
72
72
|
}
|
73
|
+
export interface QueryFilterLayoutProps {
|
74
|
+
prefixCls?: string;
|
75
|
+
className?: string;
|
76
|
+
addonBefore?: ReactNode;
|
77
|
+
addonAfter?: ReactNode;
|
78
|
+
inlineContent?: ReactNode;
|
79
|
+
panelContent?: ReactNode;
|
80
|
+
count?: number;
|
81
|
+
expand?: boolean;
|
82
|
+
onExpand?: (expand: boolean) => void;
|
83
|
+
}
|
73
84
|
export interface QueryFilterProps extends ProFormProps {
|
74
85
|
/**
|
75
86
|
* @deprecated triggerType已弃用
|
76
87
|
*/
|
77
88
|
triggerType?: 'keydown' | 'change' | 'submit';
|
89
|
+
/** 表单展示形式 */
|
78
90
|
mode?: 'inline' | 'panel';
|
91
|
+
/** 面板是否默认展开,仅在 mode='panel' 时生效 */
|
79
92
|
expand?: boolean;
|
93
|
+
/** 顶部筛选区前缀 */
|
80
94
|
addonBefore?: ReactNode;
|
95
|
+
/** 顶部筛选区后缀 */
|
81
96
|
addonAfter?: ReactNode;
|
97
|
+
/** 顶部筛选区默认筛选项 */
|
82
98
|
defaultFilterValue?: string;
|
99
|
+
/** 透出内部表单实例 */
|
83
100
|
formRef?: React.MutableRefObject<any>;
|
101
|
+
/** onChange事件的防抖时间 */
|
102
|
+
filterDebounce?: number;
|
103
|
+
/** 表单初始化(含异步默认值)后回调函数 */
|
84
104
|
onInit?: (values: any) => boolean;
|
105
|
+
/** 表单筛选回调函数 */
|
85
106
|
onFilter?: (values: any) => void;
|
107
|
+
/** 表单重置回调函数 */
|
86
108
|
onReset?: (payload?: any) => void;
|
109
|
+
/** 高级筛选按钮切换 */
|
110
|
+
onExpand?: (expand: boolean) => void;
|
87
111
|
}
|
88
112
|
/**
|
89
113
|
* 兼容性导出
|
package/es/form/utils.d.ts
CHANGED
@@ -17,11 +17,11 @@ declare const mapMode: (props: any, field: any) => any;
|
|
17
17
|
/**
|
18
18
|
* 创建字段名称
|
19
19
|
* @param prefix 字段名称前缀,接收字段component名称,默认为FieldName
|
20
|
-
* @param
|
20
|
+
* @param suffix 字段后缀,唯一标识
|
21
21
|
* @returns 字段唯一名称
|
22
22
|
*/
|
23
23
|
interface IGetFieldName {
|
24
|
-
(prefix: string,
|
24
|
+
(prefix: string, suffix?: string): string;
|
25
25
|
}
|
26
26
|
declare const getFieldName: IGetFieldName;
|
27
27
|
/**
|
package/es/form/utils.js
CHANGED
@@ -115,8 +115,8 @@ var mapMode = function mapMode(props, field) {
|
|
115
115
|
|
116
116
|
var getFieldName = function getFieldName() {
|
117
117
|
var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'FieldName';
|
118
|
-
var
|
119
|
-
return "".concat(prefix, "-").concat(
|
118
|
+
var suffix = arguments.length > 1 ? arguments[1] : undefined;
|
119
|
+
return "".concat(prefix, "-").concat(suffix);
|
120
120
|
};
|
121
121
|
/**
|
122
122
|
* 将ProForm的key映射为formily的key,然后筛除掉无效的key/value
|
package/es/index.d.ts
CHANGED
@@ -9,6 +9,7 @@ import ProPageHeader from './page-header';
|
|
9
9
|
import ProTable from './table';
|
10
10
|
import ProSkeleton from './skeleton';
|
11
11
|
import utils from './utils';
|
12
|
+
import { ProStep } from './step';
|
12
13
|
import * as nocode from './nocode';
|
13
14
|
import * as templates from './templates';
|
14
15
|
export * from './actions';
|
@@ -21,5 +22,7 @@ export * from './page-container';
|
|
21
22
|
export * from './page-header';
|
22
23
|
export * from './skeleton';
|
23
24
|
export * from './table';
|
24
|
-
|
25
|
-
export
|
25
|
+
export * from './utils';
|
26
|
+
export * from './step';
|
27
|
+
declare const version = "1.2.28";
|
28
|
+
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProStep, hooks, nocode, templates, utils, };
|
package/es/index.js
CHANGED
@@ -11,6 +11,7 @@ import ProTable from './table';
|
|
11
11
|
import ProSkeleton from './skeleton';
|
12
12
|
import utils from './utils'; // import ProSidebar from './sidebar'
|
13
13
|
|
14
|
+
import { ProStep } from './step';
|
14
15
|
import * as nocode from './nocode';
|
15
16
|
import * as templates from './templates';
|
16
17
|
import TeamixIcon from '@teamix/icon'; // 设置图标源
|
@@ -25,9 +26,11 @@ export * from './nocode';
|
|
25
26
|
export * from './page-container';
|
26
27
|
export * from './page-header';
|
27
28
|
export * from './skeleton';
|
28
|
-
export * from './table';
|
29
|
+
export * from './table';
|
30
|
+
export * from './utils'; // export * from './sidebar';
|
29
31
|
|
30
|
-
|
32
|
+
export * from './step';
|
33
|
+
var version = '1.2.28';
|
31
34
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, // ProLayout,
|
32
35
|
ProPageContainer, ProPageHeader, ProSkeleton, ProTable, // ProSidebar,
|
33
|
-
hooks, nocode, templates, utils };
|
36
|
+
ProStep, hooks, nocode, templates, utils };
|
package/es/info/index.scss
CHANGED
@@ -12,7 +12,7 @@ function _defineProperties(target, props) { for (var i = 0; i < props.length; i+
|
|
12
12
|
|
13
13
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
14
14
|
|
15
|
-
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); }
|
15
|
+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
16
16
|
|
17
17
|
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
18
18
|
|
@@ -0,0 +1,235 @@
|
|
1
|
+
var _excluded = ["_size", "_index", "_shape", "_current", "status", "icon", "title", "content", "percent", "disabled", "dotRender", "onClick"];
|
2
|
+
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
4
|
+
|
5
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
6
|
+
|
7
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
8
|
+
|
9
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
10
|
+
|
11
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
12
|
+
|
13
|
+
import React, { memo, useCallback, useMemo } from 'react';
|
14
|
+
import { Icon, Step } from '@alicloudfe/components';
|
15
|
+
import classnames from 'classnames';
|
16
|
+
import TeamixIcon from '@teamix/icon';
|
17
|
+
import { baseClass } from '@teamix/utils';
|
18
|
+
import './index.scss';
|
19
|
+
var StepItem = Step.Item;
|
20
|
+
var cls = baseClass('teamix-pro-step');
|
21
|
+
|
22
|
+
var HozStepItem = function HozStepItem(props) {
|
23
|
+
var _size = props._size,
|
24
|
+
_index = props._index,
|
25
|
+
_shape = props._shape,
|
26
|
+
_current = props._current,
|
27
|
+
status = props.status,
|
28
|
+
icon = props.icon,
|
29
|
+
title = props.title,
|
30
|
+
content = props.content,
|
31
|
+
percent = props.percent,
|
32
|
+
disabled = props.disabled,
|
33
|
+
dotRender = props.dotRender,
|
34
|
+
onClick = props.onClick,
|
35
|
+
others = _objectWithoutProperties(props, _excluded);
|
36
|
+
/** 对枚举类型进行处理 */
|
37
|
+
|
38
|
+
|
39
|
+
var formatShape = function formatShape() {
|
40
|
+
if (['dot', 'icon', 'arrow', 'number'].includes(_shape)) return _shape;
|
41
|
+
return 'dot';
|
42
|
+
};
|
43
|
+
|
44
|
+
var formatStatus = function formatStatus() {
|
45
|
+
if (['success', 'fail', 'process', 'warning', 'wait'].includes(status)) return status;
|
46
|
+
return 'wait';
|
47
|
+
};
|
48
|
+
|
49
|
+
var formatSize = function formatSize() {
|
50
|
+
if (['normal', 'small'].includes(_size)) return _size;
|
51
|
+
return 'normal';
|
52
|
+
};
|
53
|
+
/** 计算当前节点的状态 */
|
54
|
+
|
55
|
+
|
56
|
+
var getStatus = useMemo(function () {
|
57
|
+
// 默认 status 取传递进来的 status 参数
|
58
|
+
var process = formatStatus() === 'process' && !disabled;
|
59
|
+
var success = formatStatus() === 'success' && !disabled;
|
60
|
+
var error = formatStatus() === 'fail' && !disabled;
|
61
|
+
var warning = formatStatus() === 'warning' && !disabled;
|
62
|
+
var wait = formatStatus() === 'wait' && !disabled; // 如果传递了 current 参数,则重新计算当前节点的状态
|
63
|
+
|
64
|
+
if (_current) {
|
65
|
+
process = _index === _current && !disabled;
|
66
|
+
wait = _index > _current && wait;
|
67
|
+
success = _index < _current && !error && !warning;
|
68
|
+
}
|
69
|
+
|
70
|
+
return {
|
71
|
+
process: process,
|
72
|
+
success: success,
|
73
|
+
error: error,
|
74
|
+
warning: warning,
|
75
|
+
wait: wait
|
76
|
+
};
|
77
|
+
}, [_index, _current, status]); // 获取一些常量
|
78
|
+
|
79
|
+
var process = getStatus.process,
|
80
|
+
success = getStatus.success,
|
81
|
+
error = getStatus.error,
|
82
|
+
warning = getStatus.warning,
|
83
|
+
wait = getStatus.wait;
|
84
|
+
var dot = formatShape() === 'dot';
|
85
|
+
var arrow = formatShape() === 'arrow';
|
86
|
+
var circle_icon = formatShape() === 'icon';
|
87
|
+
var circle_number = formatShape() === 'number';
|
88
|
+
var normal_size = formatSize() === 'normal';
|
89
|
+
var small_size = formatSize() === 'small';
|
90
|
+
/** 重新渲染 node 节点 */
|
91
|
+
|
92
|
+
var renderNode = useCallback(function () {
|
93
|
+
// 渲染dot 节点
|
94
|
+
var renderDot = function renderDot() {
|
95
|
+
return !icon ? /*#__PURE__*/React.createElement("div", {
|
96
|
+
className: classnames(cls({
|
97
|
+
'hoz-step-item-render-wrapper-dot-normal': normal_size,
|
98
|
+
'hoz-step-item-render-wrapper-dot-small': small_size,
|
99
|
+
'hoz-step-item-render-wrapper-dot-disabled': disabled,
|
100
|
+
'hoz-step-item-render-wrapper-dot-process': process,
|
101
|
+
'hoz-step-item-render-wrapper-dot-success': success,
|
102
|
+
'hoz-step-item-render-wrapper-dot-error': error,
|
103
|
+
'hoz-step-item-render-wrapper-dot-warning': warning,
|
104
|
+
'hoz-step-item-render-wrapper-dot-wait': wait
|
105
|
+
}))
|
106
|
+
}) : /*#__PURE__*/React.createElement("div", {
|
107
|
+
className: classnames(cls({
|
108
|
+
'hoz-step-item-render-wrapper-icon-disabled': disabled,
|
109
|
+
'hoz-step-item-render-wrapper-icon-process': process,
|
110
|
+
'hoz-step-item-render-wrapper-icon-success': success,
|
111
|
+
'hoz-step-item-render-wrapper-icon-error': error,
|
112
|
+
'hoz-step-item-render-wrapper-icon-warning': warning,
|
113
|
+
'hoz-step-item-render-wrapper-icon-wait': wait
|
114
|
+
}))
|
115
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
116
|
+
type: icon,
|
117
|
+
size: "small"
|
118
|
+
}));
|
119
|
+
}; // 渲染 circle 节点
|
120
|
+
|
121
|
+
|
122
|
+
var renderCircle = function renderCircle() {
|
123
|
+
if (dotRender) return /*#__PURE__*/React.createElement("div", {
|
124
|
+
className: classnames(cls('hoz-step-item-render-wrapper'))
|
125
|
+
}, dotRender());
|
126
|
+
|
127
|
+
var renderIconOrNumber = function renderIconOrNumber() {
|
128
|
+
if (percent) return /*#__PURE__*/React.createElement("div", {
|
129
|
+
className: classnames(cls('ver-step-item-render-wrapper-circle-percent'))
|
130
|
+
}, percent, "%");
|
131
|
+
if (icon) return /*#__PURE__*/React.createElement(Icon, {
|
132
|
+
type: icon,
|
133
|
+
size: "medium"
|
134
|
+
});
|
135
|
+
if (success) return /*#__PURE__*/React.createElement(TeamixIcon, {
|
136
|
+
type: "check-line",
|
137
|
+
size: "small"
|
138
|
+
});
|
139
|
+
if (error) return /*#__PURE__*/React.createElement(TeamixIcon, {
|
140
|
+
type: "close-line",
|
141
|
+
size: "small"
|
142
|
+
});
|
143
|
+
if (warning) return /*#__PURE__*/React.createElement(TeamixIcon, {
|
144
|
+
type: "exclamation-line",
|
145
|
+
size: "small"
|
146
|
+
});
|
147
|
+
if (process && circle_icon) return /*#__PURE__*/React.createElement(TeamixIcon, {
|
148
|
+
type: "loading-line",
|
149
|
+
size: "small"
|
150
|
+
});
|
151
|
+
if (wait && circle_icon) return /*#__PURE__*/React.createElement(TeamixIcon, {
|
152
|
+
type: "more-line",
|
153
|
+
size: "small"
|
154
|
+
});
|
155
|
+
return _index + 1;
|
156
|
+
};
|
157
|
+
|
158
|
+
return /*#__PURE__*/React.createElement("div", {
|
159
|
+
className: classnames(cls({
|
160
|
+
'hoz-step-item-render-wrapper-circle': true,
|
161
|
+
'hoz-step-item-render-wrapper-circle-disabled': disabled,
|
162
|
+
'hoz-step-item-render-wrapper-circle-process': process,
|
163
|
+
'hoz-step-item-render-wrapper-circle-success': success,
|
164
|
+
'hoz-step-item-render-wrapper-circle-error': error,
|
165
|
+
'hoz-step-item-render-wrapper-circle-warning': warning,
|
166
|
+
'hoz-step-item-render-wrapper-circle-wait': wait,
|
167
|
+
'hoz-step-item-render-wrapper-percent-color': percent
|
168
|
+
}))
|
169
|
+
}, renderIconOrNumber());
|
170
|
+
};
|
171
|
+
|
172
|
+
var renderStateNode = function renderStateNode() {
|
173
|
+
if (circle_icon || circle_number) {
|
174
|
+
return renderCircle();
|
175
|
+
}
|
176
|
+
|
177
|
+
return renderDot();
|
178
|
+
};
|
179
|
+
|
180
|
+
return /*#__PURE__*/React.createElement("div", {
|
181
|
+
className: classnames(cls('hoz-step-item'))
|
182
|
+
}, /*#__PURE__*/React.createElement("div", {
|
183
|
+
className: classnames(cls({
|
184
|
+
'hoz-step-item-render-wrapper': true,
|
185
|
+
'hoz-step-item-render-wrapper-disabled': disabled,
|
186
|
+
'hoz-step-item-render-wrapper-tail-process': process,
|
187
|
+
'hoz-step-item-render-wrapper-tail-success': success,
|
188
|
+
'hoz-step-item-render-wrapper-tail-error': error,
|
189
|
+
'hoz-step-item-render-wrapper-tail-warning': warning,
|
190
|
+
'hoz-step-item-render-wrapper-tail-wait': wait
|
191
|
+
}))
|
192
|
+
}, renderStateNode()));
|
193
|
+
}, [_index, _shape, _size, disabled, icon, percent, status, dotRender]); // 轴连接线添加color
|
194
|
+
|
195
|
+
var renderColor = useMemo(function () {
|
196
|
+
if (_current) {
|
197
|
+
if (_current > _index) return true;
|
198
|
+
}
|
199
|
+
|
200
|
+
return false;
|
201
|
+
}, [_index, _current]); // 重新渲染 title
|
202
|
+
|
203
|
+
var renderTitle = useCallback(function () {
|
204
|
+
return /*#__PURE__*/React.createElement("div", {
|
205
|
+
className: classnames(cls({
|
206
|
+
'hoz-step-item-render-title-normal': normal_size && dot,
|
207
|
+
'hoz-step-item-render-title-small': small_size && dot
|
208
|
+
}))
|
209
|
+
}, title);
|
210
|
+
}, [_size, title]);
|
211
|
+
return /*#__PURE__*/React.createElement(StepItem, _objectSpread(_objectSpread({
|
212
|
+
className: classnames(cls({
|
213
|
+
'hoz-step-item-render-tail-process': process && renderColor,
|
214
|
+
'hoz-step-item-render-tail-success': success && renderColor,
|
215
|
+
'hoz-step-item-render-tail-error': error && renderColor,
|
216
|
+
'hoz-step-item-render-tail-warning': warning && renderColor,
|
217
|
+
'hoz-step-item-render-tail-wait': wait || !renderColor && !disabled,
|
218
|
+
'hoz-step-item-render-arrow-process': arrow && process,
|
219
|
+
'hoz-step-item-render-arrow-success': arrow && success,
|
220
|
+
'hoz-step-item-render-arrow-error': arrow && error,
|
221
|
+
'hoz-step-item-render-arrow-warning': arrow && warning,
|
222
|
+
'hoz-step-item-render-arrow-wait': arrow && wait
|
223
|
+
}))
|
224
|
+
}, others), {}, {
|
225
|
+
status: 'wait',
|
226
|
+
icon: icon,
|
227
|
+
title: renderTitle(),
|
228
|
+
content: content,
|
229
|
+
disabled: disabled,
|
230
|
+
itemRender: renderNode,
|
231
|
+
onClick: onClick
|
232
|
+
}));
|
233
|
+
};
|
234
|
+
|
235
|
+
export default /*#__PURE__*/memo(HozStepItem);
|