@teamix/pro 1.2.7 → 1.2.11
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/pro.css +1 -1
- package/dist/pro.js +756 -368
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/es/actions/base.d.ts +16 -6
- package/es/actions/base.js +66 -12
- package/es/actions/confirm.d.ts +1 -1
- package/es/actions/danger-confirm.d.ts +1 -1
- package/es/actions/dialog-component.d.ts +1 -1
- package/es/actions/dialog-form.d.ts +1 -1
- package/es/actions/dialog-form.js +4 -4
- package/es/actions/dialog-info.d.ts +1 -1
- package/es/actions/dialog-table.d.ts +1 -1
- package/es/actions/dialog.d.ts +6 -2
- package/es/actions/dialog.js +19 -24
- package/es/actions/drawer-form.d.ts +1 -1
- package/es/actions/drawer-info.d.ts +1 -1
- package/es/actions/drawer-table.d.ts +1 -1
- package/es/actions/drawer.d.ts +1 -1
- package/es/actions/error.d.ts +1 -1
- package/es/actions/index.js +25 -21
- package/es/actions/index.scss +14 -7
- package/es/actions/link.d.ts +2 -2
- package/es/actions/link.js +2 -2
- package/es/actions/notice.d.ts +1 -1
- package/es/actions/request.d.ts +1 -1
- package/es/actions/request.js +2 -2
- package/es/card/index.d.ts +21 -3
- package/es/card/index.js +29 -12
- package/es/card/index.scss +71 -2
- package/es/card/selectable.d.ts +13 -0
- package/es/card/selectable.js +45 -0
- package/es/card/tab.d.ts +6 -0
- package/es/card/tab.js +27 -0
- package/es/form/Filter/index.js +5 -5
- package/es/form/ProForm/index.js +3 -23
- package/es/form/ProForm/index.scss +9 -0
- package/es/form/SchemaForm/index.js +7 -6
- package/es/index.d.ts +1 -1
- package/es/index.js +7 -4
- package/es/info/components/tableInfo/index.js +10 -6
- package/es/nocode/configurators/Card.js +31 -8
- package/es/page-header/index.d.ts +20 -11
- package/es/page-header/index.js +23 -47
- package/es/page-header/index.scss +0 -11
- package/es/sidebar/components/sidebar-container/index.d.ts +5 -0
- package/es/sidebar/components/sidebar-container/index.js +77 -0
- package/es/sidebar/components/sidebar-container/index.scss +18 -0
- package/es/sidebar/components/tree/index.d.ts +4 -0
- package/es/sidebar/components/tree/index.js +162 -0
- package/es/sidebar/index.d.ts +5 -0
- package/es/sidebar/index.js +70 -0
- package/es/sidebar/index.scss +3 -0
- package/es/sidebar/typing.d.ts +64 -0
- package/es/sidebar/typing.js +1 -0
- package/es/table/components/Filter/index.js +3 -3
- package/es/table/index.js +12 -3
- package/es/table/index.scss +1 -0
- package/es/table/typing.d.ts +2 -0
- package/es/utils/components/tags/index.d.ts +11 -0
- package/es/utils/components/tags/index.js +50 -0
- package/es/utils/components/tags/index.scss +12 -0
- package/lib/actions/base.d.ts +16 -6
- package/lib/actions/base.js +67 -12
- package/lib/actions/confirm.d.ts +1 -1
- package/lib/actions/danger-confirm.d.ts +1 -1
- package/lib/actions/dialog-component.d.ts +1 -1
- package/lib/actions/dialog-form.d.ts +1 -1
- package/lib/actions/dialog-form.js +3 -3
- package/lib/actions/dialog-info.d.ts +1 -1
- package/lib/actions/dialog-table.d.ts +1 -1
- package/lib/actions/dialog.d.ts +6 -2
- package/lib/actions/dialog.js +18 -23
- package/lib/actions/drawer-form.d.ts +1 -1
- package/lib/actions/drawer-info.d.ts +1 -1
- package/lib/actions/drawer-table.d.ts +1 -1
- package/lib/actions/drawer.d.ts +1 -1
- package/lib/actions/error.d.ts +1 -1
- package/lib/actions/index.js +25 -21
- package/lib/actions/index.scss +14 -7
- package/lib/actions/link.d.ts +2 -2
- package/lib/actions/link.js +2 -2
- package/lib/actions/notice.d.ts +1 -1
- package/lib/actions/request.d.ts +1 -1
- package/lib/actions/request.js +2 -2
- package/lib/card/index.d.ts +21 -3
- package/lib/card/index.js +35 -14
- package/lib/card/index.scss +71 -2
- package/lib/card/selectable.d.ts +13 -0
- package/lib/card/selectable.js +60 -0
- package/lib/card/tab.d.ts +6 -0
- package/lib/card/tab.js +39 -0
- package/lib/form/Filter/index.js +5 -6
- package/lib/form/ProForm/index.js +3 -23
- package/lib/form/ProForm/index.scss +9 -0
- package/lib/form/SchemaForm/index.js +7 -6
- package/lib/index.d.ts +1 -1
- package/lib/index.js +3 -1
- package/lib/info/components/tableInfo/index.js +10 -6
- package/lib/nocode/configurators/Card.js +31 -8
- package/lib/page-header/index.d.ts +20 -11
- package/lib/page-header/index.js +22 -45
- package/lib/page-header/index.scss +0 -11
- package/lib/sidebar/components/sidebar-container/index.d.ts +5 -0
- package/lib/sidebar/components/sidebar-container/index.js +93 -0
- package/lib/sidebar/components/sidebar-container/index.scss +18 -0
- package/lib/sidebar/components/tree/index.d.ts +4 -0
- package/lib/sidebar/components/tree/index.js +179 -0
- package/lib/sidebar/index.d.ts +5 -0
- package/lib/sidebar/index.js +91 -0
- package/lib/sidebar/index.scss +3 -0
- package/lib/sidebar/typing.d.ts +64 -0
- package/lib/sidebar/typing.js +5 -0
- package/lib/table/components/Filter/index.js +2 -2
- package/lib/table/index.js +12 -3
- package/lib/table/index.scss +1 -0
- package/lib/table/typing.d.ts +2 -0
- package/lib/utils/components/tags/index.d.ts +11 -0
- package/lib/utils/components/tags/index.js +66 -0
- package/lib/utils/components/tags/index.scss +12 -0
- package/package.json +1 -1
package/es/card/index.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
var _excluded = ["context"],
|
2
|
-
_excluded2 = ["children", "title", "subTitle", "tooltip", "tooltipIcon", "description", "extra", "actions", "style", "className", "image", "divider", "bordered", "compacted", "centered", "loading", "backgroundColor", "contentClassName", "contentStyle", "direction", "wrap", "spacing", "split", "collapsible", "defaultCollapsed", "collapsed", "onCollapse", "context"];
|
2
|
+
_excluded2 = ["children", "title", "subTitle", "tooltip", "tooltipIcon", "tags", "description", "extra", "actions", "style", "className", "image", "hoveredShadow", "divider", "bordered", "compacted", "centered", "loading", "empty", "borderColor", "backgroundColor", "contentClassName", "contentStyle", "direction", "wrap", "spacing", "split", "collapsible", "defaultCollapsed", "collapsed", "onCollapse", "context"];
|
3
3
|
|
4
4
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
5
5
|
|
@@ -25,13 +25,17 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
25
25
|
|
26
26
|
import React from 'react';
|
27
27
|
import classnames from 'classnames';
|
28
|
+
import Result from '@teamix/result';
|
28
29
|
import { Card as BasicCard, Balloon } from '@alicloudfe/components';
|
29
30
|
import TeamixIcon from '@teamix/icon';
|
30
|
-
import { baseClass } from '@teamix/utils';
|
31
|
+
import { baseClass, getMessage } from '@teamix/utils';
|
32
|
+
import { renderTags } from '../utils/components/tags';
|
31
33
|
import { ProSkeletonRaw } from '../skeleton';
|
32
34
|
import { ProActionGroup } from '../actions';
|
33
35
|
import { formatSpacing, getColClassAndStyle } from './utils';
|
34
36
|
import ProCardDivider from './divider';
|
37
|
+
import ProCardSelectable from './selectable';
|
38
|
+
import ProCardTab from './tab';
|
35
39
|
import './index.scss';
|
36
40
|
export * from './card-container';
|
37
41
|
var cls = baseClass('teamix-pro-card');
|
@@ -66,24 +70,28 @@ var getFlexDirectionClassName = function getFlexDirectionClassName(direction, sp
|
|
66
70
|
};
|
67
71
|
|
68
72
|
export var ProCard = function ProCard(props) {
|
69
|
-
var _classnames;
|
73
|
+
var _classnames, _classnames2;
|
70
74
|
|
71
75
|
var children = props.children,
|
72
76
|
title = props.title,
|
73
77
|
subTitle = props.subTitle,
|
74
78
|
tooltip = props.tooltip,
|
75
79
|
tooltipIcon = props.tooltipIcon,
|
80
|
+
tags = props.tags,
|
76
81
|
description = props.description,
|
77
82
|
extra = props.extra,
|
78
83
|
actions = props.actions,
|
79
84
|
style = props.style,
|
80
85
|
className = props.className,
|
81
86
|
image = props.image,
|
87
|
+
hoveredShadow = props.hoveredShadow,
|
82
88
|
divider = props.divider,
|
83
89
|
bordered = props.bordered,
|
84
90
|
compacted = props.compacted,
|
85
91
|
centered = props.centered,
|
86
92
|
loading = props.loading,
|
93
|
+
empty = props.empty,
|
94
|
+
borderColor = props.borderColor,
|
87
95
|
backgroundColor = props.backgroundColor,
|
88
96
|
contentClassName = props.contentClassName,
|
89
97
|
contentStyle = props.contentStyle,
|
@@ -161,7 +169,6 @@ export var ProCard = function ProCard(props) {
|
|
161
169
|
}
|
162
170
|
|
163
171
|
if (element === null || element === void 0 ? void 0 : (_element$type2 = element.type) === null || _element$type2 === void 0 ? void 0 : _element$type2.isProCardDivider) {
|
164
|
-
console.log('isProCardDivider');
|
165
172
|
return /*#__PURE__*/React.cloneElement(element, {
|
166
173
|
style: dividerStyle
|
167
174
|
});
|
@@ -169,13 +176,12 @@ export var ProCard = function ProCard(props) {
|
|
169
176
|
|
170
177
|
return element;
|
171
178
|
});
|
172
|
-
var cardClassName = classnames(cls(), className, backgroundColor, {
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
var cardContentClassName = classnames(cls('content'), contentClassName, getFlexDirectionClassName(direction, split), (_classnames = {
|
179
|
+
var cardClassName = classnames(cls(), className, backgroundColor, (_classnames = {
|
180
|
+
'border-none': !bordered
|
181
|
+
}, _defineProperty(_classnames, "border-".concat(borderColor), borderColor), _defineProperty(_classnames, "compacted", compacted), _defineProperty(_classnames, "hoverable", hoveredShadow), _classnames));
|
182
|
+
var cardContentClassName = classnames(cls('content'), contentClassName, getFlexDirectionClassName(direction, split), (_classnames2 = {
|
177
183
|
'contain-pro-card': containProCard
|
178
|
-
}, _defineProperty(
|
184
|
+
}, _defineProperty(_classnames2, "split-".concat(split), split), _defineProperty(_classnames2, 'flex-wrap', wrap), _defineProperty(_classnames2, "centered", centered || empty), _classnames2));
|
179
185
|
var cardContentMargin = containProCard && !split ? {
|
180
186
|
marginRight: -horizonal,
|
181
187
|
marginLeft: -horizonal,
|
@@ -210,7 +216,7 @@ export var ProCard = function ProCard(props) {
|
|
210
216
|
}, /*#__PURE__*/React.createElement(Balloon.Tooltip, {
|
211
217
|
align: "t",
|
212
218
|
trigger: tooltipTrigger
|
213
|
-
}, tooltip)), description && /*#__PURE__*/React.createElement("div", {
|
219
|
+
}, tooltip)), tags && renderTags(tags, 'small'), description && /*#__PURE__*/React.createElement("div", {
|
214
220
|
className: cls('title-description')
|
215
221
|
}, description));
|
216
222
|
};
|
@@ -235,7 +241,16 @@ export var ProCard = function ProCard(props) {
|
|
235
241
|
}, loading && /*#__PURE__*/React.createElement(ProSkeletonRaw.Card.Content, null), !loading && /*#__PURE__*/React.createElement("div", {
|
236
242
|
className: cardContentClassName,
|
237
243
|
style: cardContentStyle
|
238
|
-
},
|
244
|
+
}, empty && /*#__PURE__*/React.createElement("div", {
|
245
|
+
className: cls('empty')
|
246
|
+
}, childrenModified ? childrenModified : /*#__PURE__*/React.createElement(Result, {
|
247
|
+
theme: "hybridcloud-container",
|
248
|
+
img: "noData",
|
249
|
+
title: getMessage('noData'),
|
250
|
+
style: {
|
251
|
+
padding: '50px 0 60px'
|
252
|
+
}
|
253
|
+
})), !empty && childrenModified)));
|
239
254
|
};
|
240
255
|
ProCard.defaultProps = {
|
241
256
|
bordered: true,
|
@@ -243,5 +258,7 @@ ProCard.defaultProps = {
|
|
243
258
|
direction: 'row'
|
244
259
|
};
|
245
260
|
ProCard.Divider = ProCardDivider;
|
261
|
+
ProCard.Selectable = ProCardSelectable;
|
262
|
+
ProCard.Tab = ProCardTab;
|
246
263
|
ProCard.isProCard = true;
|
247
264
|
export default ProCard;
|
package/es/card/index.scss
CHANGED
@@ -153,6 +153,25 @@
|
|
153
153
|
}
|
154
154
|
}
|
155
155
|
|
156
|
+
&-tab {
|
157
|
+
margin-top: calc(0px - var(--s-2));
|
158
|
+
|
159
|
+
& > .next-tabs-bar {
|
160
|
+
border-bottom: none;
|
161
|
+
}
|
162
|
+
|
163
|
+
& > .next-tabs-content {
|
164
|
+
padding-top: var(--s-5, 20px);
|
165
|
+
}
|
166
|
+
}
|
167
|
+
|
168
|
+
&-empty {
|
169
|
+
display: flex;
|
170
|
+
flex-direction: column;
|
171
|
+
align-items: center;
|
172
|
+
color: var(--color-text1-8, #848484);
|
173
|
+
}
|
174
|
+
|
156
175
|
& > .next-card-actions {
|
157
176
|
& > .teamix-pro-actions {
|
158
177
|
& > .next-btn {
|
@@ -166,8 +185,10 @@
|
|
166
185
|
}
|
167
186
|
}
|
168
187
|
|
169
|
-
&.
|
170
|
-
|
188
|
+
&.hoverable {
|
189
|
+
&:hover {
|
190
|
+
box-shadow: var(--shadow-3, 0px 6px 24px 0px rgba(0, 0, 0, 0.1));
|
191
|
+
}
|
171
192
|
}
|
172
193
|
|
173
194
|
&.compacted {
|
@@ -183,6 +204,54 @@
|
|
183
204
|
}
|
184
205
|
}
|
185
206
|
|
207
|
+
&.border {
|
208
|
+
&-blue {
|
209
|
+
border-color: var(--color-notice-5);
|
210
|
+
}
|
211
|
+
|
212
|
+
&-orange {
|
213
|
+
border-color: var(--color-warning-5);
|
214
|
+
}
|
215
|
+
|
216
|
+
&-yellow {
|
217
|
+
border-color: var(--color-help-5);
|
218
|
+
}
|
219
|
+
|
220
|
+
&-red {
|
221
|
+
border-color: var(--color-error-5);
|
222
|
+
}
|
223
|
+
|
224
|
+
&-green {
|
225
|
+
border-color: var(--color-success-5);
|
226
|
+
}
|
227
|
+
|
228
|
+
&-grey {
|
229
|
+
border-color: var(--color-line1-1);
|
230
|
+
}
|
231
|
+
|
232
|
+
&-transparent {
|
233
|
+
border-color: transparent;
|
234
|
+
}
|
235
|
+
|
236
|
+
&-none {
|
237
|
+
border: none;
|
238
|
+
}
|
239
|
+
}
|
240
|
+
|
241
|
+
&-selectable {
|
242
|
+
cursor: pointer;
|
243
|
+
|
244
|
+
&-icon {
|
245
|
+
&-selected {
|
246
|
+
color: var(--color-notice-5);
|
247
|
+
}
|
248
|
+
|
249
|
+
&-unselected {
|
250
|
+
color: var(--color-line1-1);
|
251
|
+
}
|
252
|
+
}
|
253
|
+
}
|
254
|
+
|
186
255
|
&.blue {
|
187
256
|
background-color: var(--color-notice-1);
|
188
257
|
}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import { ProCardProps } from './index';
|
2
|
+
export interface ProCardSelectableProps extends Omit<ProCardProps, 'onSelect'> {
|
3
|
+
selected?: boolean;
|
4
|
+
onSelect?: (selected: boolean) => void;
|
5
|
+
}
|
6
|
+
declare const ProCardSelectable: {
|
7
|
+
(props: ProCardSelectableProps): JSX.Element;
|
8
|
+
defaultProps: {
|
9
|
+
hoveredShadow: boolean;
|
10
|
+
};
|
11
|
+
isProCard: boolean;
|
12
|
+
};
|
13
|
+
export default ProCardSelectable;
|
@@ -0,0 +1,45 @@
|
|
1
|
+
var _excluded = ["selected", "onSelect", "className", "onClick"];
|
2
|
+
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { 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 from 'react';
|
14
|
+
import classnames from 'classnames';
|
15
|
+
import TeamixIcon from '@teamix/icon';
|
16
|
+
import { baseClass } from '@teamix/utils';
|
17
|
+
import { ProCard } from './index';
|
18
|
+
var cls = baseClass('teamix-pro-card-selectable');
|
19
|
+
|
20
|
+
var ProCardSelectable = function ProCardSelectable(props) {
|
21
|
+
var selected = props.selected,
|
22
|
+
onSelect = props.onSelect,
|
23
|
+
className = props.className,
|
24
|
+
_onClick = props.onClick,
|
25
|
+
others = _objectWithoutProperties(props, _excluded);
|
26
|
+
|
27
|
+
return /*#__PURE__*/React.createElement(ProCard, _objectSpread({
|
28
|
+
className: classnames(cls(), className),
|
29
|
+
borderColor: selected ? 'blue' : 'grey',
|
30
|
+
extra: /*#__PURE__*/React.createElement(TeamixIcon, {
|
31
|
+
className: cls('icon', selected ? 'icon-selected' : 'icon-unselected'),
|
32
|
+
type: selected ? 'success-fill' : 'circle-line'
|
33
|
+
}),
|
34
|
+
onClick: function onClick(e) {
|
35
|
+
_onClick && _onClick(e);
|
36
|
+
onSelect && onSelect(!selected);
|
37
|
+
}
|
38
|
+
}, others));
|
39
|
+
};
|
40
|
+
|
41
|
+
ProCardSelectable.defaultProps = {
|
42
|
+
hoveredShadow: true
|
43
|
+
};
|
44
|
+
ProCardSelectable.isProCard = true;
|
45
|
+
export default ProCardSelectable;
|
package/es/card/tab.d.ts
ADDED
package/es/card/tab.js
ADDED
@@ -0,0 +1,27 @@
|
|
1
|
+
var _excluded = ["className"];
|
2
|
+
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { 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 from 'react';
|
14
|
+
import classnames from 'classnames';
|
15
|
+
import { Tab } from '@alicloudfe/components';
|
16
|
+
|
17
|
+
var ProCardTab = function ProCardTab(props) {
|
18
|
+
var className = props.className,
|
19
|
+
others = _objectWithoutProperties(props, _excluded);
|
20
|
+
|
21
|
+
return /*#__PURE__*/React.createElement(Tab, _objectSpread({
|
22
|
+
className: classnames('teamix-pro-card-tab', className)
|
23
|
+
}, others));
|
24
|
+
};
|
25
|
+
|
26
|
+
ProCardTab.Item = Tab.Item;
|
27
|
+
export default ProCardTab;
|
package/es/form/Filter/index.js
CHANGED
@@ -29,7 +29,6 @@ import { usePrefixCls, getMessage } from '@teamix/utils';
|
|
29
29
|
import { createForm } from '@formily/core';
|
30
30
|
import ProForm from '../ProForm';
|
31
31
|
import { mergeArrayValue } from '../utils';
|
32
|
-
var searchText = getMessage('search');
|
33
32
|
|
34
33
|
var getEventProps = function getEventProps(triggerType, onFilter) {
|
35
34
|
var keydownEvent = {
|
@@ -177,7 +176,8 @@ var AdvancedFilter = /*#__PURE__*/memo(function (props) {
|
|
177
176
|
onResetValidateSuccess: onReset,
|
178
177
|
style: _objectSpread({}, triggerType === 'submit' ? {} : {
|
179
178
|
marginRight: -16
|
180
|
-
})
|
179
|
+
}),
|
180
|
+
children: getMessage('reset')
|
181
181
|
}
|
182
182
|
}, {
|
183
183
|
component: 'Submit',
|
@@ -186,9 +186,9 @@ var AdvancedFilter = /*#__PURE__*/memo(function (props) {
|
|
186
186
|
marginRight: -8
|
187
187
|
} : {
|
188
188
|
display: 'none'
|
189
|
-
})
|
190
|
-
|
191
|
-
|
189
|
+
}),
|
190
|
+
children: getMessage('search')
|
191
|
+
}
|
192
192
|
}]
|
193
193
|
}]
|
194
194
|
}])
|
package/es/form/ProForm/index.js
CHANGED
@@ -57,7 +57,8 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
|
|
57
57
|
context: context
|
58
58
|
});
|
59
59
|
}, [scope, context]);
|
60
|
-
var onAutoSubmit = useAutoSubmit(onSubmit);
|
60
|
+
var onAutoSubmit = useAutoSubmit(onSubmit); // todo 需要formily支持断点下的属性更新
|
61
|
+
|
61
62
|
var getTeamixLayout = useMemo(function () {
|
62
63
|
return breakpoints ? {
|
63
64
|
breakpoints: breakpoints,
|
@@ -109,28 +110,7 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
|
|
109
110
|
schema: schema,
|
110
111
|
scope: mergedScope,
|
111
112
|
components: components
|
112
|
-
}), children);
|
113
|
-
// <FormLayout
|
114
|
-
// className={cls(prefixCls, className)}
|
115
|
-
// {...otherProps}
|
116
|
-
// {...getTeamixLayout}
|
117
|
-
// >
|
118
|
-
// <SchemaForm schema={schema} scope={scope} components={components} />
|
119
|
-
// {children}
|
120
|
-
// </FormLayout>
|
121
|
-
// ) : (
|
122
|
-
// <Form
|
123
|
-
// className={cls(prefixCls, className)}
|
124
|
-
// {...otherProps}
|
125
|
-
// {...getTeamixLayout}
|
126
|
-
// form={form}
|
127
|
-
// onAutoSubmit={onAutoSubmit}
|
128
|
-
// onAutoSubmitFailed={onSubmitFailed}
|
129
|
-
// >
|
130
|
-
// <SchemaForm schema={schema} scope={scope} components={components} />
|
131
|
-
// {children}
|
132
|
-
// </Form>
|
133
|
-
// );
|
113
|
+
}), children);
|
134
114
|
});
|
135
115
|
ProForm.defaultProps = {
|
136
116
|
colon: false,
|
@@ -288,3 +288,12 @@
|
|
288
288
|
cursor: pointer;
|
289
289
|
}
|
290
290
|
}
|
291
|
+
|
292
|
+
/* hack todo remove */
|
293
|
+
.#{$form-item-cls}-control-content-component {
|
294
|
+
.teamix-pro-field-tooltip.teamix-pro-field-checkbox {
|
295
|
+
.teamix-pro-lable-icon-tip-icon {
|
296
|
+
transform: translate(0px, 4px);
|
297
|
+
}
|
298
|
+
}
|
299
|
+
}
|
@@ -62,6 +62,7 @@ export default /*#__PURE__*/memo(function (_ref) {
|
|
62
62
|
var schema = _ref.schema,
|
63
63
|
scope = _ref.scope,
|
64
64
|
components = _ref.components;
|
65
|
+
// 创建 SchemaField
|
65
66
|
var SchemaField = useMemo(function () {
|
66
67
|
return createSchemaField({
|
67
68
|
components: _objectSpread(_objectSpread({}, ProFieldComponents), {}, {
|
@@ -92,15 +93,15 @@ export default /*#__PURE__*/memo(function (_ref) {
|
|
92
93
|
Text: Text
|
93
94
|
})
|
94
95
|
});
|
95
|
-
}, []); // 合并schema中request的scope
|
96
|
+
}, []); // 合并 schema 中 request 的 scope
|
96
97
|
|
97
98
|
var mergedScope = useMemo(function () {
|
98
99
|
return _objectSpread({}, scope);
|
99
|
-
}, [scope]); // 格式化schema
|
100
|
+
}, [scope]); // 格式化 schema
|
100
101
|
|
101
102
|
var formatSchema = useCallback(function (schema) {
|
102
103
|
var schemaProperties = {};
|
103
|
-
schema.forEach(function (item) {
|
104
|
+
schema === null || schema === void 0 ? void 0 : schema.forEach(function (item) {
|
104
105
|
var newItem = warning(item);
|
105
106
|
var _newItem = newItem,
|
106
107
|
originalComponent = _newItem.component; // 根据component的不同,初始化为内置的item
|
@@ -236,15 +237,15 @@ export default /*#__PURE__*/memo(function (_ref) {
|
|
236
237
|
});
|
237
238
|
return schemaProperties;
|
238
239
|
}, [mergedScope]);
|
239
|
-
var
|
240
|
+
var proFormSchema = useMemo(function () {
|
240
241
|
return {
|
241
242
|
type: 'object',
|
242
243
|
properties: formatSchema(schema)
|
243
244
|
};
|
244
|
-
}, []); // console.log(
|
245
|
+
}, []); // console.log(proFormSchema);
|
245
246
|
|
246
247
|
return /*#__PURE__*/React.createElement(SchemaField, {
|
247
|
-
schema:
|
248
|
+
schema: proFormSchema,
|
248
249
|
components: components,
|
249
250
|
scope: mergedScope
|
250
251
|
});
|
package/es/index.d.ts
CHANGED
@@ -21,5 +21,5 @@ export * from './page-container';
|
|
21
21
|
export * from './page-header';
|
22
22
|
export * from './skeleton';
|
23
23
|
export * from './table';
|
24
|
-
declare const version = "1.2.
|
24
|
+
declare const version = "1.2.10";
|
25
25
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, hooks, nocode, templates, utils, };
|
package/es/index.js
CHANGED
@@ -9,7 +9,8 @@ import ProPageContainer from './page-container';
|
|
9
9
|
import ProPageHeader from './page-header';
|
10
10
|
import ProTable from './table';
|
11
11
|
import ProSkeleton from './skeleton';
|
12
|
-
import utils from './utils';
|
12
|
+
import utils from './utils'; // import ProSidebar from './sidebar'
|
13
|
+
|
13
14
|
import * as nocode from './nocode';
|
14
15
|
import * as templates from './templates';
|
15
16
|
import TeamixIcon from '@teamix/icon'; // 设置图标源
|
@@ -24,7 +25,9 @@ export * from './nocode';
|
|
24
25
|
export * from './page-container';
|
25
26
|
export * from './page-header';
|
26
27
|
export * from './skeleton';
|
27
|
-
export * from './table';
|
28
|
-
|
28
|
+
export * from './table'; // export * from './sidebar';
|
29
|
+
|
30
|
+
var version = '1.2.10';
|
29
31
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, // ProLayout,
|
30
|
-
ProPageContainer, ProPageHeader, ProSkeleton, ProTable,
|
32
|
+
ProPageContainer, ProPageHeader, ProSkeleton, ProTable, // ProSidebar,
|
33
|
+
hooks, nocode, templates, utils };
|
@@ -38,8 +38,9 @@ var ProTableInfo = function ProTableInfo(props) {
|
|
38
38
|
_layout$labelGutter = layout.labelGutter,
|
39
39
|
labelGutter = _layout$labelGutter === void 0 ? '80px' : _layout$labelGutter;
|
40
40
|
|
41
|
-
var
|
42
|
-
|
41
|
+
var getNewColumns = function getNewColumns() {
|
42
|
+
// 需要 fill 填充 否则有可能不执行
|
43
|
+
return _toConsumableArray(new Array(colNum)).fill(1).map(function (_, index) {
|
43
44
|
return [{
|
44
45
|
dataIndex: "label_".concat(index),
|
45
46
|
align: 'left',
|
@@ -84,9 +85,7 @@ var ProTableInfo = function ProTableInfo(props) {
|
|
84
85
|
var needCol = 1 + ((_columnsItem$colSpan = columnsItem === null || columnsItem === void 0 ? void 0 : columnsItem.colSpan) !== null && _columnsItem$colSpan !== void 0 ? _columnsItem$colSpan : 1); // 如果剩余的col能满足下一组数据那么就放在这一组
|
85
86
|
|
86
87
|
if (needCol <= col) {
|
87
|
-
|
88
|
-
|
89
|
-
col = col - 1 - ((_columnsItem$colSpan2 = columnsItem === null || columnsItem === void 0 ? void 0 : columnsItem.colSpan) !== null && _columnsItem$colSpan2 !== void 0 ? _columnsItem$colSpan2 : 1);
|
88
|
+
col = col - needCol;
|
90
89
|
filterColumns.push(columnsItem);
|
91
90
|
} else {
|
92
91
|
var _filterColumns$0$colS;
|
@@ -99,6 +98,11 @@ var ProTableInfo = function ProTableInfo(props) {
|
|
99
98
|
col = 0;
|
100
99
|
}
|
101
100
|
}
|
101
|
+
|
102
|
+
if (columnsCopy.length === 0) {
|
103
|
+
// 如果剩余仍有列数并且已经没有columns分配了
|
104
|
+
col = 0;
|
105
|
+
}
|
102
106
|
}
|
103
107
|
|
104
108
|
var itemData = filterColumns.map(function (item, index) {
|
@@ -165,7 +169,7 @@ var ProTableInfo = function ProTableInfo(props) {
|
|
165
169
|
return /*#__PURE__*/React.createElement(Table.StickyLock, {
|
166
170
|
className: "teamix-pro-info-table",
|
167
171
|
cellProps: setCellProps,
|
168
|
-
columns:
|
172
|
+
columns: getNewColumns(),
|
169
173
|
hasHeader: false,
|
170
174
|
hasBorder: true,
|
171
175
|
dataSource: newDataSource
|
@@ -1,9 +1,7 @@
|
|
1
1
|
var initialValues = {
|
2
2
|
title: '卡片标题',
|
3
3
|
children: '卡片内容卡片内容卡片内容',
|
4
|
-
extra: '操作'
|
5
|
-
bordered: true,
|
6
|
-
hoveredShadow: true
|
4
|
+
extra: '操作'
|
7
5
|
};
|
8
6
|
var schema = [{
|
9
7
|
component: 'FormTab',
|
@@ -54,10 +52,6 @@ var schema = [{
|
|
54
52
|
children: [{
|
55
53
|
title: '整体样式',
|
56
54
|
children: [{
|
57
|
-
name: 'bordered',
|
58
|
-
title: '边框',
|
59
|
-
component: 'Switch'
|
60
|
-
}, {
|
61
55
|
name: 'divider',
|
62
56
|
title: '头部分割线',
|
63
57
|
component: 'Switch'
|
@@ -72,7 +66,36 @@ var schema = [{
|
|
72
66
|
label: '蓝色',
|
73
67
|
value: 'blue'
|
74
68
|
}, {
|
75
|
-
label: '
|
69
|
+
label: '绿色',
|
70
|
+
value: 'green'
|
71
|
+
}, {
|
72
|
+
label: '红色',
|
73
|
+
value: 'red'
|
74
|
+
}, {
|
75
|
+
label: '橙色',
|
76
|
+
value: 'orange'
|
77
|
+
}, {
|
78
|
+
label: '黄色',
|
79
|
+
value: 'yellow'
|
80
|
+
}, {
|
81
|
+
label: '灰色',
|
82
|
+
value: 'grey'
|
83
|
+
}, {
|
84
|
+
label: '透明',
|
85
|
+
value: 'transparent'
|
86
|
+
}]
|
87
|
+
}, {
|
88
|
+
name: 'borderColor',
|
89
|
+
title: '边框色',
|
90
|
+
component: 'Select',
|
91
|
+
dataSource: [{
|
92
|
+
label: '无边框',
|
93
|
+
value: 'none'
|
94
|
+
}, {
|
95
|
+
label: '蓝色',
|
96
|
+
value: 'blue'
|
97
|
+
}, {
|
98
|
+
label: '绿色',
|
76
99
|
value: 'green'
|
77
100
|
}, {
|
78
101
|
label: '红色',
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
import { TagProps, CloseableProps } from '@alicloudfe/components/types/tag';
|
3
2
|
import { ItemProps } from '@alicloudfe/components/types/breadcrumb';
|
3
|
+
import { LinkPath } from '@teamix/utils';
|
4
|
+
import { ProTagItem } from '../utils/components/tags';
|
4
5
|
import { ProActionGroupProps } from '../actions';
|
5
6
|
import { ProInfoProps } from '../info';
|
6
7
|
import './index.scss';
|
@@ -10,14 +11,7 @@ export interface ProPageHeaderBreadcrumbItem extends ItemProps {
|
|
10
11
|
*/
|
11
12
|
text?: string;
|
12
13
|
}
|
13
|
-
export declare type ProPageHeaderTagItem =
|
14
|
-
closable: true;
|
15
|
-
})) & {
|
16
|
-
/**
|
17
|
-
* @deprecated 建议使用 children 代替
|
18
|
-
*/
|
19
|
-
text?: string;
|
20
|
-
};
|
14
|
+
export declare type ProPageHeaderTagItem = ProTagItem;
|
21
15
|
declare type Color = 'blue' | 'green' | 'orange' | 'red' | 'yellow' | string;
|
22
16
|
export declare type ProPageHeaderDataItem = {
|
23
17
|
title: string;
|
@@ -25,20 +19,35 @@ export declare type ProPageHeaderDataItem = {
|
|
25
19
|
color?: Color;
|
26
20
|
} & React.HTMLAttributes<HTMLElement>;
|
27
21
|
export declare type ProPageHeaderProps = {
|
22
|
+
/** 标题 */
|
28
23
|
title?: React.ReactNode;
|
24
|
+
/** 描述 */
|
29
25
|
description?: React.ReactNode;
|
30
|
-
|
26
|
+
/** 图标 */
|
27
|
+
icon?: React.ReactNode;
|
28
|
+
/** 图标颜色 */
|
31
29
|
iconColor?: Color;
|
30
|
+
/** 图标背景类型 */
|
32
31
|
iconBackgroundType?: 'circle' | 'square';
|
32
|
+
/** 图标背景色 */
|
33
33
|
iconBackgroundColor?: Color;
|
34
|
-
|
34
|
+
/** 返回按钮配置 */
|
35
|
+
goback?: boolean | LinkPath | ((e: React.MouseEvent) => void);
|
36
|
+
/** 背景图 */
|
35
37
|
image?: string;
|
38
|
+
/** 加载中 */
|
36
39
|
loading?: boolean;
|
40
|
+
/** 面包屑配置 */
|
37
41
|
breadcrumb?: ProPageHeaderBreadcrumbItem[];
|
42
|
+
/** 额外信息区配置 */
|
38
43
|
extra?: ProActionGroupProps | React.ReactNode;
|
44
|
+
/** 操作区配置 */
|
39
45
|
operation?: ProActionGroupProps | React.ReactNode;
|
46
|
+
/** 标签组 */
|
40
47
|
tags?: ProPageHeaderTagItem[];
|
48
|
+
/** 数据概览项 */
|
41
49
|
data?: ProPageHeaderDataItem[];
|
50
|
+
/** 底部详情 */
|
42
51
|
info?: ProInfoProps | React.ReactNode;
|
43
52
|
} & Omit<React.HTMLAttributes<HTMLElement>, 'title'>;
|
44
53
|
declare const ProPageHeader: React.FC<ProPageHeaderProps>;
|