hc-busin-components 1.0.0

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.
Files changed (185) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +53 -0
  3. package/dist/Actions/index.d.ts +20 -0
  4. package/dist/Actions/index.js +142 -0
  5. package/dist/Actions/index.less +9 -0
  6. package/dist/AuthComponents/authDivider.d.ts +15 -0
  7. package/dist/AuthComponents/authDivider.js +104 -0
  8. package/dist/AuthComponents/index.d.ts +4 -0
  9. package/dist/AuthComponents/index.js +14 -0
  10. package/dist/BasicFilesRead/images/back.png +0 -0
  11. package/dist/BasicFilesRead/images/excel.png +0 -0
  12. package/dist/BasicFilesRead/images/folder.png +0 -0
  13. package/dist/BasicFilesRead/images/image.png +0 -0
  14. package/dist/BasicFilesRead/images/jpeg.png +0 -0
  15. package/dist/BasicFilesRead/images/jpg.png +0 -0
  16. package/dist/BasicFilesRead/images/normal.png +0 -0
  17. package/dist/BasicFilesRead/images/png.png +0 -0
  18. package/dist/BasicFilesRead/images/tar.png +0 -0
  19. package/dist/BasicFilesRead/images/text.png +0 -0
  20. package/dist/BasicFilesRead/images/zip.png +0 -0
  21. package/dist/BasicFilesRead/index.d.ts +31 -0
  22. package/dist/BasicFilesRead/index.js +286 -0
  23. package/dist/BasicFilesRead/styles/index.d.ts +3 -0
  24. package/dist/BasicFilesRead/styles/index.js +9 -0
  25. package/dist/CombinTable/components/RenderContent.d.ts +9 -0
  26. package/dist/CombinTable/components/RenderContent.js +201 -0
  27. package/dist/CombinTable/hooks/useTableParams.d.ts +20 -0
  28. package/dist/CombinTable/hooks/useTableParams.js +75 -0
  29. package/dist/CombinTable/hooks/useTableState.d.ts +5 -0
  30. package/dist/CombinTable/hooks/useTableState.js +22 -0
  31. package/dist/CombinTable/index.d.ts +4 -0
  32. package/dist/CombinTable/index.js +225 -0
  33. package/dist/CombinTable/styles/index.d.ts +3 -0
  34. package/dist/CombinTable/styles/index.js +11 -0
  35. package/dist/CombinTable/types/index.d.ts +21 -0
  36. package/dist/CombinTable/types/index.js +1 -0
  37. package/dist/CombineSearch/components/Content.d.ts +13 -0
  38. package/dist/CombineSearch/components/Content.js +249 -0
  39. package/dist/CombineSearch/components/Tags.d.ts +14 -0
  40. package/dist/CombineSearch/components/Tags.js +115 -0
  41. package/dist/CombineSearch/hooks/useCombineState.d.ts +5 -0
  42. package/dist/CombineSearch/hooks/useCombineState.js +17 -0
  43. package/dist/CombineSearch/index.d.ts +4 -0
  44. package/dist/CombineSearch/index.js +168 -0
  45. package/dist/CombineSearch/style/edit.svg +1 -0
  46. package/dist/CombineSearch/style/index.d.ts +14 -0
  47. package/dist/CombineSearch/style/index.js +26 -0
  48. package/dist/CombineSearch/types/index.d.ts +46 -0
  49. package/dist/CombineSearch/types/index.js +0 -0
  50. package/dist/ComponentUninstalled/assets/comp-unintall-background.png +0 -0
  51. package/dist/ComponentUninstalled/assets/comp-unintall-bg.png +0 -0
  52. package/dist/ComponentUninstalled/index.d.ts +32 -0
  53. package/dist/ComponentUninstalled/index.js +164 -0
  54. package/dist/ComponentUninstalled/index.less +108 -0
  55. package/dist/ComponentUninstalled/locale.d.ts +14 -0
  56. package/dist/ComponentUninstalled/locale.js +21 -0
  57. package/dist/DataCountPopover/index.d.ts +23 -0
  58. package/dist/DataCountPopover/index.js +121 -0
  59. package/dist/DataCountPopover/index.less +62 -0
  60. package/dist/DateRangePicker/index.d.ts +38 -0
  61. package/dist/DateRangePicker/index.js +483 -0
  62. package/dist/DateRangePicker/index.less +196 -0
  63. package/dist/DeleteConfirm/index.d.ts +23 -0
  64. package/dist/DeleteConfirm/index.js +109 -0
  65. package/dist/DeleteConfirm/index.less +44 -0
  66. package/dist/DeleteConfirm/locale.d.ts +7 -0
  67. package/dist/DeleteConfirm/locale.js +7 -0
  68. package/dist/DisplayButton/index.d.ts +7 -0
  69. package/dist/DisplayButton/index.js +23 -0
  70. package/dist/FileRead/images/back.png +0 -0
  71. package/dist/FileRead/images/excel.png +0 -0
  72. package/dist/FileRead/images/folder.png +0 -0
  73. package/dist/FileRead/images/image.png +0 -0
  74. package/dist/FileRead/images/jpeg.png +0 -0
  75. package/dist/FileRead/images/jpg.png +0 -0
  76. package/dist/FileRead/images/normal.png +0 -0
  77. package/dist/FileRead/images/png.png +0 -0
  78. package/dist/FileRead/images/tar.png +0 -0
  79. package/dist/FileRead/images/text.png +0 -0
  80. package/dist/FileRead/images/zip.png +0 -0
  81. package/dist/FileRead/index.d.ts +31 -0
  82. package/dist/FileRead/index.js +417 -0
  83. package/dist/FileRead/styles/index.d.ts +3 -0
  84. package/dist/FileRead/styles/index.js +9 -0
  85. package/dist/Icon/iconfont.d.ts +1 -0
  86. package/dist/Icon/iconfont.js +1 -0
  87. package/dist/Icon/index.d.ts +10 -0
  88. package/dist/Icon/index.js +20 -0
  89. package/dist/Icon/index.less +11 -0
  90. package/dist/IconPopTips/index.d.ts +10 -0
  91. package/dist/IconPopTips/index.js +26 -0
  92. package/dist/IconPopTips/index.less +33 -0
  93. package/dist/IconText/index.d.ts +15 -0
  94. package/dist/IconText/index.js +19 -0
  95. package/dist/IconText/index.less +38 -0
  96. package/dist/LogCenter/assets/empty.png +0 -0
  97. package/dist/LogCenter/context.d.ts +24 -0
  98. package/dist/LogCenter/context.js +66 -0
  99. package/dist/LogCenter/history-log.d.ts +35 -0
  100. package/dist/LogCenter/history-log.js +1214 -0
  101. package/dist/LogCenter/index.d.ts +8 -0
  102. package/dist/LogCenter/index.js +130 -0
  103. package/dist/LogCenter/index.less +577 -0
  104. package/dist/LogCenter/locale.d.ts +3 -0
  105. package/dist/LogCenter/locale.js +81 -0
  106. package/dist/LogCenter/realtime-log.d.ts +35 -0
  107. package/dist/LogCenter/realtime-log.js +641 -0
  108. package/dist/LogCenter/select-with-all.d.ts +28 -0
  109. package/dist/LogCenter/select-with-all.js +337 -0
  110. package/dist/LogCenter/select-with-all.less +81 -0
  111. package/dist/LogCenter/services.d.ts +27 -0
  112. package/dist/LogCenter/services.js +93 -0
  113. package/dist/LogCenter/tools.d.ts +9 -0
  114. package/dist/LogCenter/tools.js +137 -0
  115. package/dist/LogCenter/types.d.ts +133 -0
  116. package/dist/LogCenter/types.js +1 -0
  117. package/dist/LogicalResourceFilter/index.d.ts +7 -0
  118. package/dist/LogicalResourceFilter/index.js +426 -0
  119. package/dist/LogicalResourceFilter/index.less +139 -0
  120. package/dist/LogicalResourceFilter/locale.d.ts +2 -0
  121. package/dist/LogicalResourceFilter/locale.js +10 -0
  122. package/dist/LogicalResourceFilter/types.d.ts +58 -0
  123. package/dist/LogicalResourceFilter/types.js +1 -0
  124. package/dist/MetadataCount/index.d.ts +16 -0
  125. package/dist/MetadataCount/index.js +97 -0
  126. package/dist/MetadataCount/index.less +40 -0
  127. package/dist/MetadataForm/index.d.ts +18 -0
  128. package/dist/MetadataForm/index.js +85 -0
  129. package/dist/MetadataForm/index.less +108 -0
  130. package/dist/MetadataForm/label.d.ts +13 -0
  131. package/dist/MetadataForm/label.js +447 -0
  132. package/dist/MetadataPopoverList/fetchArray.d.ts +3 -0
  133. package/dist/MetadataPopoverList/fetchArray.js +74 -0
  134. package/dist/MetadataPopoverList/index.d.ts +13 -0
  135. package/dist/MetadataPopoverList/index.js +98 -0
  136. package/dist/MetadataPopoverList/index.less +74 -0
  137. package/dist/MetadataTags/index.d.ts +17 -0
  138. package/dist/MetadataTags/index.js +109 -0
  139. package/dist/MetadataTags/index.less +26 -0
  140. package/dist/OverFlow/index.d.ts +4 -0
  141. package/dist/OverFlow/index.js +66 -0
  142. package/dist/OverFlow/types/index.d.ts +11 -0
  143. package/dist/OverFlow/types/index.js +1 -0
  144. package/dist/PageHeader/index.d.ts +16 -0
  145. package/dist/PageHeader/index.js +41 -0
  146. package/dist/PageHeader/index.less +89 -0
  147. package/dist/ResourceProgress/index.d.ts +6 -0
  148. package/dist/ResourceProgress/index.js +102 -0
  149. package/dist/ResourceProgress/index.less +86 -0
  150. package/dist/ResourceProgress/types/index.d.ts +15 -0
  151. package/dist/ResourceProgress/types/index.js +1 -0
  152. package/dist/Terminal/index.d.ts +44 -0
  153. package/dist/Terminal/index.js +390 -0
  154. package/dist/Terminal/index.less +39 -0
  155. package/dist/TextCopy/index.d.ts +21 -0
  156. package/dist/TextCopy/index.js +38 -0
  157. package/dist/TextCopy/index.less +51 -0
  158. package/dist/TextEllipsis/index.d.ts +18 -0
  159. package/dist/TextEllipsis/index.js +31 -0
  160. package/dist/TextEllipsis/index.less +3 -0
  161. package/dist/ThemeForm/index.d.ts +6 -0
  162. package/dist/ThemeForm/index.js +15 -0
  163. package/dist/ThemeForm/index.less +15 -0
  164. package/dist/ThemeSubmit/index.d.ts +16 -0
  165. package/dist/ThemeSubmit/index.js +60 -0
  166. package/dist/ThemeSubmit/index.less +30 -0
  167. package/dist/TooltipSpan/index.d.ts +6 -0
  168. package/dist/TooltipSpan/index.js +72 -0
  169. package/dist/UsageCycle/index.d.ts +12 -0
  170. package/dist/UsageCycle/index.js +71 -0
  171. package/dist/UsageCycle/index.less +56 -0
  172. package/dist/Yaml/CodeMirrorWrapper.d.ts +14 -0
  173. package/dist/Yaml/CodeMirrorWrapper.js +106 -0
  174. package/dist/Yaml/index.d.ts +6 -0
  175. package/dist/Yaml/index.js +470 -0
  176. package/dist/Yaml/index.less +190 -0
  177. package/dist/Yaml/types.d.ts +38 -0
  178. package/dist/Yaml/types.js +1 -0
  179. package/dist/index.d.ts +52 -0
  180. package/dist/index.js +32 -0
  181. package/dist/metadata/locale.d.ts +52 -0
  182. package/dist/metadata/locale.js +69 -0
  183. package/dist/showMore/index.d.ts +6 -0
  184. package/dist/showMore/index.js +40 -0
  185. package/package.json +121 -0
@@ -0,0 +1,74 @@
1
+ .metadata-table-popover {
2
+ min-width: 200px;
3
+ &.ant-popover {
4
+ .ant-popover-content {
5
+ max-width: 600px;
6
+ }
7
+ .ant-popover-inner-content {
8
+ width: 100%;
9
+ padding: 8px;
10
+ .ant-table-thead > tr > th,
11
+ .ant-table-tbody > tr > td,
12
+ .ant-table tfoot > tr > th,
13
+ .ant-table tfoot > tr > td {
14
+ padding: 8px 16px;
15
+ }
16
+ .ant-table table {
17
+ width: auto;
18
+ min-width: 200px;
19
+ .ant-table-cell {
20
+ white-space: break-spaces;
21
+ word-break: normal;
22
+ }
23
+ }
24
+ .ant-table-cell-scrollbar:not([rowspan]) {
25
+ padding: 0;
26
+ }
27
+ }
28
+ }
29
+ }
30
+
31
+ .hc-metadata-more {
32
+ width: 24px;
33
+ height: 24px;
34
+ overflow: hidden;
35
+ font-size: 18px;
36
+ line-height: 20px;
37
+ text-align: center;
38
+ border-radius: 4px;
39
+ cursor: pointer;
40
+ &:focus,
41
+ &:hover {
42
+ background: #f5f5f5;
43
+ }
44
+ &.ant-popover-open,
45
+ &:active {
46
+ color: #2869f6;
47
+ background: rgba(40, 105, 246, 0.1);
48
+ }
49
+ }
50
+
51
+ .hc-metadata-count {
52
+ &.ant-btn {
53
+ padding: 1.6px 3px;
54
+ & > span {
55
+ position: relative;
56
+ display: block;
57
+ min-width: 16px;
58
+ color: rgba(0, 0, 0, 0.65);
59
+ text-align: center;
60
+ &::after {
61
+ position: absolute;
62
+ bottom: -6px;
63
+ left: 0;
64
+ display: block;
65
+ width: 100%;
66
+ color: rgba(0, 0, 0, 0.65);
67
+ font-weight: bolder;
68
+ font-size: 14px;
69
+ text-align: center;
70
+ content: '...';
71
+ }
72
+ }
73
+ }
74
+ }
@@ -0,0 +1,17 @@
1
+ import type { PopoverProps } from 'antd';
2
+ import React from 'react';
3
+ import { type MetadataTexts } from '../metadata/locale';
4
+ import './index.less';
5
+ export interface MetadataTagsProps {
6
+ type: 'labels' | 'taints' | 'annotations' | string;
7
+ datasource?: unknown;
8
+ maxCount?: number;
9
+ textLimit?: number;
10
+ placement?: PopoverProps['placement'];
11
+ needEdit?: boolean;
12
+ valueRequired?: boolean;
13
+ texts?: MetadataTexts;
14
+ onCallback?: (data: Record<string, string>[]) => void;
15
+ }
16
+ declare const MetadataTags: React.FC<MetadataTagsProps>;
17
+ export default MetadataTags;
@@ -0,0 +1,109 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import { Button, Form, Modal } from 'antd';
8
+ import React, { useEffect, useMemo, useState } from 'react';
9
+ import Icon from "../Icon";
10
+ import { mergeMetadataTexts } from "../metadata/locale";
11
+ import MetadataForm from "../MetadataForm";
12
+ import MetadataPopoverList from "../MetadataPopoverList";
13
+ import { fetchMetadataStrFormat } from "../MetadataPopoverList/fetchArray";
14
+ import TextEllipsis from "../TextEllipsis";
15
+ import "./index.less";
16
+ var MetadataTags = function MetadataTags(_ref) {
17
+ var type = _ref.type,
18
+ datasource = _ref.datasource,
19
+ _ref$maxCount = _ref.maxCount,
20
+ maxCount = _ref$maxCount === void 0 ? 9999 : _ref$maxCount,
21
+ _ref$textLimit = _ref.textLimit,
22
+ textLimit = _ref$textLimit === void 0 ? 20 : _ref$textLimit,
23
+ placement = _ref.placement,
24
+ _ref$needEdit = _ref.needEdit,
25
+ needEdit = _ref$needEdit === void 0 ? false : _ref$needEdit,
26
+ _ref$valueRequired = _ref.valueRequired,
27
+ valueRequired = _ref$valueRequired === void 0 ? false : _ref$valueRequired,
28
+ onCallback = _ref.onCallback,
29
+ textsProp = _ref.texts;
30
+ var t = useMemo(function () {
31
+ return mergeMetadataTexts(textsProp);
32
+ }, [textsProp]);
33
+ var _useState = useState(false),
34
+ _useState2 = _slicedToArray(_useState, 2),
35
+ isModalVisible = _useState2[0],
36
+ setIsModalVisible = _useState2[1];
37
+ var _useState3 = useState([]),
38
+ _useState4 = _slicedToArray(_useState3, 2),
39
+ dataList = _useState4[0],
40
+ setDataList = _useState4[1];
41
+ var _Form$useForm = Form.useForm(),
42
+ _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
43
+ inputForm = _Form$useForm2[0];
44
+ var titleNameMap = {
45
+ labels: t.labelEdit,
46
+ taints: t.taintEdit,
47
+ annotations: t.annotationEdit
48
+ };
49
+ useEffect(function () {
50
+ setDataList(datasource ? fetchMetadataStrFormat(datasource, type) : []);
51
+ }, [datasource, type]);
52
+ var handleSave = function handleSave() {
53
+ inputForm.validateFields().then(function () {
54
+ var values = inputForm.getFieldsValue();
55
+ setIsModalVisible(false);
56
+ onCallback === null || onCallback === void 0 || onCallback(values[type]);
57
+ });
58
+ };
59
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
60
+ className: "hc-tag-list"
61
+ }, dataList.length > 0 ? dataList.map(function (item, index) {
62
+ return index < maxCount ? /*#__PURE__*/React.createElement("div", {
63
+ className: "item",
64
+ key: "".concat(item, "-").concat(index)
65
+ }, /*#__PURE__*/React.createElement(TextEllipsis, {
66
+ content: item,
67
+ limit: textLimit
68
+ })) : null;
69
+ }) : /*#__PURE__*/React.createElement("span", {
70
+ className: "no-data"
71
+ }, "--"), dataList.length > maxCount && /*#__PURE__*/React.createElement(MetadataPopoverList, {
72
+ datasource: datasource,
73
+ type: type,
74
+ kind: "more",
75
+ placement: placement,
76
+ texts: textsProp
77
+ }), needEdit && /*#__PURE__*/React.createElement(Button, {
78
+ type: "text",
79
+ size: "small",
80
+ icon: /*#__PURE__*/React.createElement(Icon, {
81
+ name: "v35_Edit"
82
+ }),
83
+ onClick: function onClick() {
84
+ return setIsModalVisible(true);
85
+ }
86
+ })), /*#__PURE__*/React.createElement(Modal, {
87
+ title: titleNameMap[type],
88
+ open: isModalVisible,
89
+ width: 600,
90
+ onOk: handleSave,
91
+ onCancel: function onCancel() {
92
+ return setIsModalVisible(false);
93
+ },
94
+ destroyOnClose: true
95
+ }, /*#__PURE__*/React.createElement(Form, {
96
+ labelCol: {
97
+ span: 4
98
+ },
99
+ form: inputForm
100
+ }, /*#__PURE__*/React.createElement(Form.Item, null, /*#__PURE__*/React.createElement(MetadataForm, {
101
+ type: type,
102
+ form: inputForm,
103
+ datasource: datasource,
104
+ needTilte: true,
105
+ valueRequired: valueRequired,
106
+ texts: textsProp
107
+ })))));
108
+ };
109
+ export default MetadataTags;
@@ -0,0 +1,26 @@
1
+ .hc-tag-list,
2
+ .hc-tag-popover .ant-popover-inner-content {
3
+ display: inline-flex;
4
+ flex-wrap: wrap;
5
+ gap: 8px;
6
+ color: #595959;
7
+ .item {
8
+ height: 24px;
9
+ padding: 2px 8px;
10
+ overflow: hidden;
11
+ background: #f5f5f5;
12
+ border: 1px solid #d9d9d9;
13
+ border-radius: 2px;
14
+ }
15
+ }
16
+ .hc-tag-list {
17
+ .ant-btn-icon-only {
18
+ .hc-icon {
19
+ font-size: 16px;
20
+ }
21
+ }
22
+ .no-data {
23
+ display: flex;
24
+ align-items: center;
25
+ }
26
+ }
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { OverFlowProps } from './types';
3
+ declare const OverFlow: (props: OverFlowProps) => React.JSX.Element;
4
+ export default OverFlow;
@@ -0,0 +1,66 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import { Button, Popover } from 'antd';
8
+ import { Space } from 'antd/lib';
9
+ import React, { useEffect, useState } from 'react';
10
+ import Icon from "../Icon";
11
+ var OverFlow = function OverFlow(props) {
12
+ var maxCount = props.maxCount,
13
+ children = props.children,
14
+ _props$placement = props.placement,
15
+ placement = _props$placement === void 0 ? 'bottom' : _props$placement,
16
+ _props$direction = props.direction,
17
+ direction = _props$direction === void 0 ? 'vertical' : _props$direction,
18
+ _props$trigger = props.trigger,
19
+ trigger = _props$trigger === void 0 ? 'hover' : _props$trigger;
20
+ var _useState = useState([]),
21
+ _useState2 = _slicedToArray(_useState, 2),
22
+ overflowNodes = _useState2[0],
23
+ setOverflowNodes = _useState2[1];
24
+ var _useState3 = useState([]),
25
+ _useState4 = _slicedToArray(_useState3, 2),
26
+ showNodes = _useState4[0],
27
+ setShowNodes = _useState4[1];
28
+ useEffect(function () {
29
+ var nodes = React.Children.toArray(children);
30
+ if (maxCount && maxCount < nodes.length) {
31
+ var _overflowNodes = nodes.slice(maxCount);
32
+ var _showNodes = nodes.slice(0, maxCount);
33
+ setOverflowNodes(_overflowNodes);
34
+ setShowNodes(_showNodes);
35
+ } else {
36
+ setShowNodes(nodes);
37
+ }
38
+ }, [maxCount, children]);
39
+ return /*#__PURE__*/React.createElement(Space, {
40
+ size: 8,
41
+ align: "center"
42
+ }, showNodes, overflowNodes.length > 0 && /*#__PURE__*/React.createElement(Popover, {
43
+ trigger: trigger,
44
+ placement: placement,
45
+ styles: {
46
+ body: {
47
+ padding: '8px',
48
+ maxHeight: '200px',
49
+ overflow: 'auto'
50
+ }
51
+ },
52
+ content: /*#__PURE__*/React.createElement(Space, {
53
+ direction: direction,
54
+ size: direction === 'vertical' ? [0, 4] : 8,
55
+ align: "center"
56
+ }, overflowNodes)
57
+ }, /*#__PURE__*/React.createElement(Button, {
58
+ style: {
59
+ padding: 0
60
+ },
61
+ type: "text"
62
+ }, /*#__PURE__*/React.createElement(Icon, {
63
+ name: "v35_MoreVertical"
64
+ }))));
65
+ };
66
+ export default OverFlow;
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import { GetProps, Popover } from 'antd';
3
+ type PopoverProps = GetProps<typeof Popover>;
4
+ type DefaultProps = Pick<PopoverProps, 'placement' | 'trigger'>;
5
+ interface OverFlowProps extends DefaultProps {
6
+ maxCount?: number;
7
+ children?: React.ReactNode;
8
+ popoverProps?: PopoverProps;
9
+ direction?: 'vertical' | 'horizontal';
10
+ }
11
+ export type { OverFlowProps };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,16 @@
1
+ import React from 'react';
2
+ import './index.less';
3
+ export interface PageHeaderProps {
4
+ /** 是否显示返回图标 */
5
+ backIcon?: boolean;
6
+ onBack?: () => void;
7
+ title: React.ReactNode;
8
+ subTitle?: React.ReactNode;
9
+ tags?: React.ReactNode;
10
+ extraLeft?: React.ReactNode;
11
+ extraRight?: React.ReactNode;
12
+ className?: string;
13
+ style?: React.CSSProperties;
14
+ }
15
+ declare const PageHeader: React.FC<PageHeaderProps>;
16
+ export default PageHeader;
@@ -0,0 +1,41 @@
1
+ import React from 'react';
2
+ import Icon from "../Icon";
3
+ import "./index.less";
4
+ var PageHeader = function PageHeader(_ref) {
5
+ var _ref$backIcon = _ref.backIcon,
6
+ backIcon = _ref$backIcon === void 0 ? false : _ref$backIcon,
7
+ onBack = _ref.onBack,
8
+ title = _ref.title,
9
+ subTitle = _ref.subTitle,
10
+ extraLeft = _ref.extraLeft,
11
+ extraRight = _ref.extraRight,
12
+ tags = _ref.tags,
13
+ className = _ref.className,
14
+ style = _ref.style;
15
+ return /*#__PURE__*/React.createElement("div", {
16
+ className: ['page-header-enhance', 'ant-page-header', 'qkd-page-header', className].filter(Boolean).join(' '),
17
+ style: style
18
+ }, /*#__PURE__*/React.createElement("div", {
19
+ className: "ant-page-header-heading"
20
+ }, /*#__PURE__*/React.createElement("div", {
21
+ className: "ant-page-header-heading-left"
22
+ }, backIcon ? /*#__PURE__*/React.createElement("div", {
23
+ className: "ant-page-header-back"
24
+ }, /*#__PURE__*/React.createElement("button", {
25
+ type: "button",
26
+ className: "ant-page-header-back-button",
27
+ onClick: onBack,
28
+ "aria-label": "back"
29
+ }, /*#__PURE__*/React.createElement(Icon, {
30
+ name: "v35_ArrowRight"
31
+ }))) : null, /*#__PURE__*/React.createElement("span", {
32
+ className: "ant-page-header-heading-title"
33
+ }, title), /*#__PURE__*/React.createElement("div", {
34
+ className: "ant-page-header-heading-sub-title"
35
+ }, subTitle ? /*#__PURE__*/React.createElement("span", {
36
+ className: "page-header-subtitle"
37
+ }, subTitle) : null, tags, extraLeft)), extraRight ? /*#__PURE__*/React.createElement("div", {
38
+ className: "ant-page-header-heading-extra"
39
+ }, extraRight) : null));
40
+ };
41
+ export default PageHeader;
@@ -0,0 +1,89 @@
1
+ .page-header-enhance.ant-page-header {
2
+ width: 100%;
3
+ height: 56px;
4
+ padding: 16px 20px 0;
5
+ background: #fff;
6
+
7
+ .ant-page-header-heading {
8
+ display: flex;
9
+ align-items: flex-start;
10
+ justify-content: space-between;
11
+
12
+ .ant-page-header-heading-left {
13
+ display: flex;
14
+ flex: 1;
15
+ flex-wrap: wrap;
16
+ align-items: center;
17
+ min-height: 24px;
18
+ margin-bottom: 0;
19
+ row-gap: 4px;
20
+
21
+ .ant-page-header-back {
22
+ display: flex;
23
+ flex-shrink: 0;
24
+ align-items: center;
25
+ align-self: center;
26
+ height: 24px;
27
+ margin-right: 0;
28
+
29
+ .ant-page-header-back-button {
30
+ display: inline-flex;
31
+ align-items: center;
32
+ justify-content: center;
33
+ width: 24px;
34
+ height: 24px;
35
+ padding: 0;
36
+ line-height: 0;
37
+ color: rgb(89, 89, 89);
38
+ background: none;
39
+ border: none;
40
+ cursor: pointer;
41
+ transition: color 0.3s;
42
+
43
+ .hc-icon {
44
+ display: block;
45
+ width: 1em;
46
+ height: 1em;
47
+ font-size: 24px;
48
+ line-height: 1;
49
+ transform: rotate(180deg);
50
+ }
51
+
52
+ &:hover {
53
+ color: var(--ant-color-primary, #1677ff);
54
+ outline: none;
55
+ }
56
+ }
57
+ }
58
+
59
+ .ant-page-header-heading-title {
60
+ display: inline-flex;
61
+ flex-shrink: 0;
62
+ align-items: center;
63
+ align-self: center;
64
+ height: 24px;
65
+ margin-right: 4px;
66
+ color: rgba(0, 0, 0, 0.85);
67
+ font-weight: 500;
68
+ font-size: 16px;
69
+ line-height: 24px;
70
+ }
71
+
72
+ .ant-page-header-heading-sub-title {
73
+ display: flex;
74
+ align-items: center;
75
+ // align-self: center;
76
+
77
+ .page-header-subtitle {
78
+ margin: 0 4px;
79
+ }
80
+ }
81
+ }
82
+
83
+ .ant-page-header-heading-extra {
84
+ display: flex;
85
+ align-items: center;
86
+ margin: 0;
87
+ }
88
+ }
89
+ }
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ import type { ResourceProgressProps } from './types';
3
+ import './index.less';
4
+ declare const ResourceProgress: React.FC<ResourceProgressProps>;
5
+ export default ResourceProgress;
6
+ export type { ResourceProgressProps } from './types';
@@ -0,0 +1,102 @@
1
+ import React, { useMemo } from 'react';
2
+ import "./index.less";
3
+ var RATE_SEGMENTS = Array.from({
4
+ length: 10
5
+ }, function (_, index) {
6
+ return index;
7
+ });
8
+ var calculateSegments = function calculateSegments(usage, total, color) {
9
+ var percent = Math.min((parseFloat(String(total)) ? usage / total : 0) * 100, 100);
10
+ return RATE_SEGMENTS.map(function (index) {
11
+ var current = (index + 1) * 10 - percent;
12
+ if (current >= 10 || total === 0) {
13
+ return /*#__PURE__*/React.createElement("span", {
14
+ key: index,
15
+ className: "unit",
16
+ style: {
17
+ backgroundColor: color,
18
+ opacity: 0.1
19
+ }
20
+ });
21
+ }
22
+ if (current > 0 && current < 10) {
23
+ return /*#__PURE__*/React.createElement("span", {
24
+ className: "unit-percent",
25
+ key: index
26
+ }, /*#__PURE__*/React.createElement("span", {
27
+ className: "unit unit-active",
28
+ style: {
29
+ width: "".concat(100 - current * 10, "%"),
30
+ backgroundColor: color
31
+ }
32
+ }), /*#__PURE__*/React.createElement("span", {
33
+ className: "unit",
34
+ style: {
35
+ width: "".concat(current * 10, "%"),
36
+ backgroundColor: color,
37
+ opacity: 0.1
38
+ }
39
+ }));
40
+ }
41
+ return /*#__PURE__*/React.createElement("span", {
42
+ key: index,
43
+ className: "unit unit-active",
44
+ style: {
45
+ backgroundColor: color
46
+ }
47
+ });
48
+ });
49
+ };
50
+ var ResourceProgress = function ResourceProgress(_ref) {
51
+ var _ref$usage = _ref.usage,
52
+ usage = _ref$usage === void 0 ? 1 : _ref$usage,
53
+ _ref$total = _ref.total,
54
+ total = _ref$total === void 0 ? null : _ref$total,
55
+ _ref$aliasName = _ref.aliasName,
56
+ aliasName = _ref$aliasName === void 0 ? '' : _ref$aliasName,
57
+ _ref$className = _ref.className,
58
+ className = _ref$className === void 0 ? '' : _ref$className,
59
+ _ref$color = _ref.color,
60
+ color = _ref$color === void 0 ? '#7fc8f3' : _ref$color,
61
+ width = _ref.width,
62
+ _ref$direction = _ref.direction,
63
+ direction = _ref$direction === void 0 ? 'horizontal' : _ref$direction;
64
+ var segments = useMemo(function () {
65
+ return total == null ? null : calculateSegments(usage, total, color);
66
+ }, [usage, total, color]);
67
+ if (total == null) {
68
+ return /*#__PURE__*/React.createElement("span", null, "--");
69
+ }
70
+ var percentText = total ? "".concat(((usage / total || 0) * 100).toFixed(1), "%") : '0%';
71
+ var usageText = total ? "".concat(usage, "/ ").concat(total) : "".concat(usage, "/ 0");
72
+ if (direction === 'horizontal') {
73
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
74
+ style: {
75
+ width: width
76
+ },
77
+ className: "resource-progress-container resource-horizontal ".concat(className)
78
+ }, /*#__PURE__*/React.createElement("div", {
79
+ className: "resource-progress"
80
+ }, segments), /*#__PURE__*/React.createElement("div", {
81
+ className: "resource-progress-unit",
82
+ style: {
83
+ color: 'rgba(0,0,0,0.85)'
84
+ }
85
+ }, percentText)), /*#__PURE__*/React.createElement("div", {
86
+ className: "resource-vertical"
87
+ }, /*#__PURE__*/React.createElement("span", null, usageText)));
88
+ }
89
+ return /*#__PURE__*/React.createElement("div", {
90
+ style: {
91
+ width: width
92
+ },
93
+ className: "resource-progress-container ".concat(className)
94
+ }, /*#__PURE__*/React.createElement("div", {
95
+ className: "resource-progress"
96
+ }, segments), /*#__PURE__*/React.createElement("div", {
97
+ className: "resource-vertical"
98
+ }, /*#__PURE__*/React.createElement("span", {
99
+ className: "resource-text"
100
+ }, aliasName), /*#__PURE__*/React.createElement("span", null, percentText)));
101
+ };
102
+ export default ResourceProgress;
@@ -0,0 +1,86 @@
1
+ .activeUnit() {
2
+ position: absolute;
3
+ left: 0;
4
+ width: 100%;
5
+ height: 100%;
6
+ border-radius: 2px;
7
+
8
+ &::after {
9
+ display: none;
10
+ }
11
+ }
12
+
13
+ .split-line() {
14
+ &::after {
15
+ position: absolute;
16
+ right: 0;
17
+ width: 1px;
18
+ height: 16px;
19
+ background: #fff;
20
+ content: '';
21
+ }
22
+ }
23
+
24
+ .resource-progress-container {
25
+ position: relative;
26
+ min-width: 90px;
27
+
28
+ .resource-progress {
29
+ align-items: center;
30
+ width: 100%;
31
+
32
+ .unit {
33
+ display: inline-block;
34
+ width: 10%;
35
+ height: 16px;
36
+ }
37
+
38
+ & > .unit {
39
+ position: relative;
40
+ .split-line();
41
+
42
+ &:last-child::after {
43
+ display: none;
44
+ }
45
+ }
46
+
47
+ .unit-active {
48
+ position: relative;
49
+
50
+ &::before {
51
+ content: '';
52
+ .activeUnit();
53
+ }
54
+ }
55
+
56
+ .unit-percent {
57
+ position: relative;
58
+ display: inline-block;
59
+ width: 10%;
60
+ .split-line();
61
+ }
62
+ }
63
+
64
+ .resource-vertical {
65
+ display: flex;
66
+ justify-content: space-between;
67
+ width: 100%;
68
+ }
69
+ }
70
+
71
+ .resource-horizontal {
72
+ display: flex;
73
+ align-items: flex-start;
74
+ justify-content: space-between;
75
+
76
+ .resource-progress-unit {
77
+ height: 16px;
78
+ margin-left: 12px;
79
+ line-height: 16px;
80
+ white-space: nowrap;
81
+ }
82
+ }
83
+
84
+ .resource-vertical {
85
+ color: rgba(0, 0, 0, 0.65);
86
+ }
@@ -0,0 +1,15 @@
1
+ export interface ResourceProgressProps {
2
+ /** 使用量 */
3
+ usage?: number;
4
+ /** 总量;为 null / undefined 时显示 -- */
5
+ total?: number | null;
6
+ /** 别名,direction 为 vertical 时展示 */
7
+ aliasName?: string;
8
+ className?: string;
9
+ /** 进度条颜色,默认 #7fc8f3 */
10
+ color?: string;
11
+ /** 宽度,最小 90px;不传为 100% */
12
+ width?: number;
13
+ /** 排列方向 */
14
+ direction?: 'horizontal' | 'vertical';
15
+ }
@@ -0,0 +1 @@
1
+ export {};