@gx-design-vue/pro-table 0.2.0-alpha.2 → 0.2.0-alpha.20

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 (136) hide show
  1. package/dist/ProTable.d.ts +14 -493
  2. package/dist/ProTable.js +844 -512
  3. package/dist/components/ScrollBar/Bar.d.ts +79 -0
  4. package/dist/components/ScrollBar/Bar.js +84 -0
  5. package/dist/components/ScrollBar/Thumb.d.ts +50 -0
  6. package/dist/components/ScrollBar/{Thumb/index.js → Thumb.js} +67 -58
  7. package/dist/components/ScrollBar/context.d.ts +3 -4
  8. package/dist/components/ScrollBar/context.js +3 -5
  9. package/dist/components/ScrollBar/util.d.ts +6 -5
  10. package/dist/components/ScrollBar/util.js +1 -14
  11. package/dist/components/SearchForm/CollapseToggle.d.ts +53 -0
  12. package/dist/components/SearchForm/CollapseToggle.js +47 -0
  13. package/dist/components/SearchForm/FormItemContainer.d.ts +73 -0
  14. package/dist/components/SearchForm/FormItemContainer.js +225 -0
  15. package/dist/components/SearchForm/FormItemWrapper.d.ts +80 -0
  16. package/dist/components/SearchForm/FormItemWrapper.js +62 -0
  17. package/dist/components/SearchForm/SearchForm.d.ts +128 -0
  18. package/dist/components/SearchForm/SearchForm.js +319 -0
  19. package/dist/components/SearchForm/index.d.ts +2 -0
  20. package/dist/components/SearchForm/index.js +2 -0
  21. package/dist/components/Toolbar/FullscreenIcon.d.ts +24 -0
  22. package/dist/components/Toolbar/FullscreenIcon.js +22 -0
  23. package/dist/components/Toolbar/ListToolBar.d.ts +109 -0
  24. package/dist/components/Toolbar/ListToolBar.js +101 -0
  25. package/dist/components/Toolbar/index.d.ts +101 -0
  26. package/dist/components/Toolbar/index.js +101 -0
  27. package/dist/components/Toolbar/style.d.ts +8 -0
  28. package/dist/components/{ListToolBar → Toolbar}/style.js +32 -27
  29. package/dist/context/TableContext.d.ts +15 -27
  30. package/dist/context/TableContext.js +3 -5
  31. package/dist/hooks/index.d.ts +16 -0
  32. package/dist/hooks/index.js +16 -0
  33. package/dist/hooks/useBreakpoints.d.ts +13 -0
  34. package/dist/hooks/useBreakpoints.js +65 -0
  35. package/dist/hooks/useCellRender.d.ts +13 -0
  36. package/dist/hooks/useCellRender.js +28 -0
  37. package/dist/hooks/useColumnResize.d.ts +29 -0
  38. package/dist/hooks/useColumnResize.js +110 -0
  39. package/dist/hooks/useColumns.d.ts +35 -24
  40. package/dist/hooks/useColumns.js +89 -58
  41. package/dist/hooks/useFetchData.d.ts +42 -65
  42. package/dist/hooks/useFetchData.js +160 -176
  43. package/dist/hooks/useFitPage.d.ts +19 -0
  44. package/dist/hooks/useFitPage.js +90 -0
  45. package/dist/hooks/useKeepAliveReload.d.ts +21 -0
  46. package/dist/hooks/useKeepAliveReload.js +24 -0
  47. package/dist/hooks/useLoading.d.ts +18 -7
  48. package/dist/hooks/useLoading.js +27 -11
  49. package/dist/hooks/usePagination.d.ts +10 -7
  50. package/dist/hooks/usePagination.js +38 -29
  51. package/dist/hooks/useRequestOptions.d.ts +18 -0
  52. package/dist/hooks/useRequestOptions.js +39 -0
  53. package/dist/hooks/useRowSelection.d.ts +27 -15
  54. package/dist/hooks/useRowSelection.js +93 -80
  55. package/dist/hooks/useTable.d.ts +35 -77
  56. package/dist/hooks/useTable.js +76 -49
  57. package/dist/hooks/useTableForm.d.ts +17 -82
  58. package/dist/hooks/useTableForm.js +137 -52
  59. package/dist/hooks/useTableScroll.d.ts +33 -31
  60. package/dist/hooks/useTableScroll.js +71 -28
  61. package/dist/hooks/useTableSize.d.ts +17 -7
  62. package/dist/hooks/useTableSize.js +21 -9
  63. package/dist/index.d.ts +10 -7
  64. package/dist/index.js +9 -4
  65. package/dist/interface.d.ts +499 -0
  66. package/dist/interface.js +1 -0
  67. package/dist/pro-table.esm.js +3251 -3909
  68. package/dist/pro-table.js +1 -1
  69. package/dist/style/fit-page.d.ts +4 -2
  70. package/dist/style/fit-page.js +10 -5
  71. package/dist/style/index.d.ts +3 -7
  72. package/dist/style/index.js +34 -76
  73. package/dist/style/list.d.ts +4 -2
  74. package/dist/style/list.js +2 -12
  75. package/dist/style/resizable.d.ts +8 -0
  76. package/dist/style/resizable.js +18 -0
  77. package/dist/style/scroll.d.ts +4 -2
  78. package/dist/style/scroll.js +9 -9
  79. package/dist/style/search.d.ts +8 -0
  80. package/dist/{components/Form/style.js → style/search.js} +22 -9
  81. package/dist/theme/augment.d.ts +8 -0
  82. package/dist/theme/augment.js +1 -0
  83. package/dist/theme/interface/components.d.ts +8 -0
  84. package/dist/theme/interface/components.js +1 -0
  85. package/dist/utils/dateFormat.d.ts +9 -0
  86. package/dist/utils/dateFormat.js +29 -0
  87. package/dist/utils/formConstants.d.ts +9 -0
  88. package/dist/utils/formConstants.js +29 -0
  89. package/dist/utils/valueFormat.d.ts +9 -0
  90. package/dist/utils/valueFormat.js +27 -0
  91. package/package.json +21 -11
  92. package/dist/components/Form/components/RequestSelect.d.ts +0 -50
  93. package/dist/components/Form/components/RequestSelect.js +0 -58
  94. package/dist/components/Form/hooks/useForm.d.ts +0 -11
  95. package/dist/components/Form/hooks/useForm.js +0 -32
  96. package/dist/components/Form/index.d.ts +0 -33
  97. package/dist/components/Form/index.js +0 -479
  98. package/dist/components/Form/style.d.ts +0 -6
  99. package/dist/components/Form/utils/config.d.ts +0 -9
  100. package/dist/components/Form/utils/config.js +0 -30
  101. package/dist/components/Form/utils/dateFormat.d.ts +0 -22
  102. package/dist/components/Form/utils/dateFormat.js +0 -45
  103. package/dist/components/ListToolBar/index.d.ts +0 -60
  104. package/dist/components/ListToolBar/index.js +0 -123
  105. package/dist/components/ListToolBar/style.d.ts +0 -6
  106. package/dist/components/ScrollBar/Bar/index.d.ts +0 -49
  107. package/dist/components/ScrollBar/Bar/index.js +0 -71
  108. package/dist/components/ScrollBar/Bar/props.d.ts +0 -25
  109. package/dist/components/ScrollBar/Bar/props.js +0 -18
  110. package/dist/components/ScrollBar/Thumb/index.d.ts +0 -40
  111. package/dist/components/ScrollBar/Thumb/props.d.ts +0 -20
  112. package/dist/components/ScrollBar/Thumb/props.js +0 -18
  113. package/dist/components/TableCell/index.d.ts +0 -37
  114. package/dist/components/TableCell/index.js +0 -72
  115. package/dist/components/ToolBar/FullscreenIcon.d.ts +0 -7
  116. package/dist/components/ToolBar/FullscreenIcon.js +0 -14
  117. package/dist/components/ToolBar/index.d.ts +0 -34
  118. package/dist/components/ToolBar/index.js +0 -100
  119. package/dist/hooks/tryOnActivated.d.ts +0 -6
  120. package/dist/hooks/tryOnActivated.js +0 -14
  121. package/dist/hooks/useDebounceFn.d.ts +0 -8
  122. package/dist/hooks/useDebounceFn.js +0 -34
  123. package/dist/hooks/useScrollArea.d.ts +0 -24
  124. package/dist/hooks/useScrollArea.js +0 -104
  125. package/dist/props.d.ts +0 -340
  126. package/dist/props.js +0 -251
  127. package/dist/types/ColumnTypings.d.ts +0 -129
  128. package/dist/types/ColumnTypings.js +0 -1
  129. package/dist/types/SlotsTypings.d.ts +0 -63
  130. package/dist/types/SlotsTypings.js +0 -13
  131. package/dist/types/TableTypings.d.ts +0 -359
  132. package/dist/types/TableTypings.js +0 -1
  133. package/dist/types/index.d.ts +0 -9
  134. package/dist/types/index.js +0 -1
  135. package/dist/utils/utils.d.ts +0 -10
  136. package/dist/utils/utils.js +0 -91
@@ -1,10 +1,17 @@
1
+ import { genToolbarStyle } from "../components/Toolbar/style.js";
1
2
  import { genProTableFitPage } from "./fit-page.js";
2
3
  import { genProTableList } from "./list.js";
4
+ import { genProTableResizable } from "./resizable.js";
3
5
  import { genProTableScroll } from "./scroll.js";
4
-
6
+ import { genProTableSearch } from "./search.js";
7
+ import { proGenStyleHooks } from "@gx-design-vue/pro-provider";
5
8
  //#region src/style/index.ts
6
9
  const genProTableStyle = (token) => {
7
10
  return { [token.componentCls]: {
11
+ [`${token.componentCls}-content`]: {
12
+ display: "flex",
13
+ flexDirection: "column"
14
+ },
8
15
  [`${token.componentCls}-card`]: { [`${token.antCls}-table-pagination${token.antCls}-pagination`]: {
9
16
  margin: 0,
10
17
  marginTop: token.margin
@@ -20,35 +27,26 @@ const genProTableStyle = (token) => {
20
27
  justifyContent: "center",
21
28
  marginBlock: token.marginXL
22
29
  },
23
- "&-table-tree": { [`${token.antCls}-table-row-cell-ellipsis`]: {
24
- overflow: "hidden",
25
- textOverflow: "ellipsis",
26
- whiteSpace: "nowrap",
27
- [`${token.antCls}-table-column-title`]: {
28
- overflow: "hidden",
29
- textOverflow: "ellipsis",
30
- whiteSpace: "nowrap"
31
- }
32
- } },
30
+ "&-loading-container": { position: "relative" },
31
+ "&-loading-mask": {
32
+ position: "absolute",
33
+ inset: 0,
34
+ display: "flex",
35
+ alignItems: "center",
36
+ justifyContent: "center",
37
+ backgroundColor: `color-mix(in srgb, ${token.colorBgContainer} 50%, transparent)`,
38
+ zIndex: 10
39
+ },
33
40
  "&-full-screen": { [`${token.componentCls}-content`]: {
34
41
  height: "100% !important",
35
42
  padding: 24,
36
43
  backgroundColor: token.colorWhite,
37
44
  boxShadow: "0 4px 8px #0003, 0 6px 20px #00000030 !important"
38
45
  } },
39
- "&-no-scroll": {
40
- [`${token.antCls}-table`]: { table: {
41
- width: "100% !important",
42
- minWidth: "unset"
43
- } },
44
- [`${token.antCls}-table-ping-right:not(${token.antCls}-table-has-fix-right)`]: { [`${token.antCls}-table-container::after`]: { boxShadow: "none" } },
45
- [`${token.antCls}-table-bordered ${token.antCls}-table-fixed-left ${token.antCls}-table-thead > tr > th`]: { "&:last-child": { borderRight: 0 } },
46
- [`${token.antCls}-table-bordered ${token.antCls}-table-fixed-left ${token.antCls}-table-tbody > tr > td`]: { "&:last-child": { borderRight: 0 } }
47
- },
48
46
  [`&-card-border`]: {
49
47
  paddingInline: token.paddingMD,
50
48
  paddingBlock: token.paddingMD,
51
- border: `${token.lineWidth}px ${token.lineType} ${token.colorSplit}`,
49
+ border: `${token.lineWidth} ${token.lineType} ${token.colorSplit}`,
52
50
  borderRadius: token.borderRadiusLG,
53
51
  backgroundColor: token.colorBgContainer,
54
52
  [`${token.antCls}-table-wrapper ${token.antCls}-table-pagination${token.antCls}-pagination`]: { marginBottom: 0 }
@@ -62,62 +60,22 @@ const genProTableStyle = (token) => {
62
60
  cursor: "pointer"
63
61
  }
64
62
  },
65
- [`${token.componentCls}-ellipsis`]: {
66
- overflow: "hidden",
67
- textOverflow: "ellipsis",
68
- display: "-webkit-box",
69
- "-webkit-box-orient": "vertical",
70
- "word-break": "break-word"
71
- },
72
63
  [`${token.componentCls}-action-size`]: { display: "inline-block" },
73
- [`${token.componentCls}-action-columns`]: {
74
- display: "inline-block",
75
- [`${token.antCls}-popover-inner-content`]: { padding: "8px 0 8px 16px" },
76
- [`${token.antCls}-tree ${token.antCls}-tree-switcher-noop`]: { display: "none" },
77
- [`${token.antCls}-tree > ${token.antCls}-tree-treenode`]: {
78
- width: "100%",
79
- alignItems: "center",
80
- "&:first-child": { paddingTop: 0 },
81
- "&:last-child": { paddingBottom: 4 },
82
- "&:hover": {
83
- backgroundColor: "#e6f7ff",
84
- [`${token.componentCls}-action-columns-list-item-actions`]: { display: "block" }
85
- }
86
- },
87
- [`${token.antCls}-tree ${token.antCls}-tree-node-content-wrapper`]: {
88
- flex: "1",
89
- "&:hover": { backgroundColor: "transparent" }
90
- },
91
- "&-popover-title": {
92
- display: "flex",
93
- alignItems: "center",
94
- justifyContent: "space-between",
95
- "&-check": { marginRight: 8 },
96
- [`${token.antCls}-btn-sm`]: { padding: 0 }
97
- },
98
- "&-list-group": {
99
- marginTop: 6,
100
- marginBottom: 6,
101
- fontSize: 12,
102
- color: "rgba(0, 0, 0, 0.45)"
103
- },
104
- "$-list-item": {
105
- display: "flex",
106
- alignItems: "center",
107
- justifyContent: "space-between",
108
- "&-actions": {
109
- display: "block",
110
- float: "right",
111
- cursor: "pointer",
112
- "> span + span": { marginLeft: 8 },
113
- "&-disabled": { "action": { color: "rgba(0, 0, 0, 0.25)" } },
114
- "anticon": { color: token.colorPrimary }
115
- }
116
- }
117
- },
118
- [`${token.antCls}-tooltip-inner`]: { a: { color: token.colorWhite } }
64
+ [`${token.componentCls}-a`]: {
65
+ color: token.colorPrimary,
66
+ cursor: "pointer",
67
+ "&:hover": { color: token.colorPrimaryHover }
68
+ }
119
69
  } };
120
70
  };
121
-
71
+ var style_default = proGenStyleHooks("ProTable", (token) => [
72
+ genProTableStyle(token),
73
+ genProTableList(token),
74
+ genProTableScroll(token),
75
+ genProTableFitPage(token),
76
+ genProTableResizable(token),
77
+ genProTableSearch(token),
78
+ genToolbarStyle(token)
79
+ ]);
122
80
  //#endregion
123
- export { genProTableFitPage, genProTableList, genProTableScroll, genProTableStyle };
81
+ export { style_default as default };
@@ -1,6 +1,8 @@
1
- import { GenerateStyle } from "@gx-design-vue/pro-provider";
1
+ import { ProFullToken } from "@gx-design-vue/pro-provider";
2
+ import { CSSObject } from "@antdv-next/cssinjs";
3
+ import { GenerateStyle } from "antdv-next/dist/theme/internal";
2
4
 
3
5
  //#region src/style/list.d.ts
4
- declare const genProTableList: GenerateStyle;
6
+ declare const genProTableList: GenerateStyle<ProFullToken<'ProTable'>, CSSObject>;
5
7
  //#endregion
6
8
  export { genProTableList };
@@ -3,18 +3,8 @@ const genProTableList = (token) => {
3
3
  return { [token.componentCls]: { [`${token.componentCls}-list`]: {
4
4
  clear: "both",
5
5
  maxWidth: "100%",
6
- [`${token.componentCls}-pagination${token.antCls}-pagination`]: { marginTop: token.margin },
7
- [`${token.componentCls}-pagination`]: {
8
- display: "flex",
9
- flexWrap: "wrap",
10
- rowGap: token.paddingXS,
11
- "> *": { flex: "none" },
12
- "&-left": { justifyContent: "flex-start" },
13
- "&-center": { justifyContent: "center" },
14
- "&-right": { justifyContent: "flex-end" }
15
- }
6
+ [`${token.componentCls}-pagination${token.antCls}-pagination`]: { marginTop: token.margin }
16
7
  } } };
17
8
  };
18
-
19
9
  //#endregion
20
- export { genProTableList };
10
+ export { genProTableList };
@@ -0,0 +1,8 @@
1
+ import { ProFullToken } from "@gx-design-vue/pro-provider";
2
+ import { CSSObject } from "@antdv-next/cssinjs";
3
+ import { GenerateStyle } from "antdv-next/dist/theme/internal";
4
+
5
+ //#region src/style/resizable.d.ts
6
+ declare const genProTableResizable: GenerateStyle<ProFullToken<'ProTable'>, CSSObject>;
7
+ //#endregion
8
+ export { genProTableResizable };
@@ -0,0 +1,18 @@
1
+ //#region src/style/resizable.ts
2
+ const genProTableResizable = (token) => {
3
+ return { [token.componentCls]: {
4
+ ".resizable-title": { position: "relative" },
5
+ ".resizable-handle": {
6
+ position: "absolute",
7
+ top: 0,
8
+ right: -5,
9
+ width: 10,
10
+ height: "100%",
11
+ cursor: "col-resize",
12
+ userSelect: "none",
13
+ zIndex: 1
14
+ }
15
+ } };
16
+ };
17
+ //#endregion
18
+ export { genProTableResizable };
@@ -1,6 +1,8 @@
1
- import { GenerateStyle } from "@gx-design-vue/pro-provider";
1
+ import { ProFullToken } from "@gx-design-vue/pro-provider";
2
+ import { CSSObject } from "@antdv-next/cssinjs";
3
+ import { GenerateStyle } from "antdv-next/dist/theme/internal";
2
4
 
3
5
  //#region src/style/scroll.d.ts
4
- declare const genProTableScroll: GenerateStyle;
6
+ declare const genProTableScroll: GenerateStyle<ProFullToken<'ProTable'>, CSSObject>;
5
7
  //#endregion
6
8
  export { genProTableScroll };
@@ -1,6 +1,8 @@
1
- import { TinyColor } from "@ctrl/tinycolor";
2
-
1
+ import { unit } from "@gx-design-vue/pro-provider";
3
2
  //#region src/style/scroll.ts
3
+ function withAlpha(color, alpha) {
4
+ return `color-mix(in srgb, ${color} ${alpha * 100}%, transparent)`;
5
+ }
4
6
  function scrollBarStyle() {
5
7
  return {
6
8
  scrollbarWidth: "none",
@@ -11,8 +13,8 @@ function scrollBarStyle() {
11
13
  };
12
14
  }
13
15
  const genProTableScroll = (token) => {
14
- const color = new TinyColor(token.colorText).setAlpha(.2).toRgbString();
15
- const colorHover = new TinyColor(token.colorText).setAlpha(.4).toRgbString();
16
+ const color = withAlpha(token.colorText, .2);
17
+ const colorHover = withAlpha(token.colorText, .4);
16
18
  return { [token.componentCls]: {
17
19
  [`${token.antCls}-table-container`]: { position: "relative" },
18
20
  [`${token.componentCls}-scroll`]: {
@@ -21,7 +23,7 @@ const genProTableScroll = (token) => {
21
23
  right: 2,
22
24
  bottom: 2,
23
25
  zIndex: 100,
24
- borderRadius: token.borderRadius - 2,
26
+ borderRadius: `calc(${unit(token.borderRadius)} - 2px)`,
25
27
  "&.is-vertical": {
26
28
  top: 2,
27
29
  width: 6,
@@ -49,11 +51,9 @@ const genProTableScroll = (token) => {
49
51
  }
50
52
  }
51
53
  },
52
- [`${token.antCls}-table-content`]: scrollBarStyle(),
53
54
  [`${token.antCls}-table-body`]: scrollBarStyle(),
54
- [`${token.antCls}-table-empty`]: { [`${token.antCls}-table-content`]: scrollBarStyle() }
55
+ [`${token.antCls}-table-container`]: scrollBarStyle()
55
56
  } };
56
57
  };
57
-
58
58
  //#endregion
59
- export { genProTableScroll };
59
+ export { genProTableScroll };
@@ -0,0 +1,8 @@
1
+ import { ProFullToken } from "@gx-design-vue/pro-provider";
2
+ import { CSSObject } from "@antdv-next/cssinjs";
3
+ import { GenerateStyle } from "antdv-next/dist/theme/internal";
4
+
5
+ //#region src/style/search.d.ts
6
+ declare const genProTableSearch: GenerateStyle<ProFullToken<'ProTable'>, CSSObject>;
7
+ //#endregion
8
+ export { genProTableSearch };
@@ -1,6 +1,7 @@
1
- //#region src/components/Form/style.ts
2
- const genTableFormStyle = (token) => {
3
- return {
1
+ import { unit } from "@gx-design-vue/pro-provider";
2
+ //#region src/style/search.ts
3
+ const genProTableSearch = (token) => {
4
+ return { [token.componentCls]: {
4
5
  [`${token.componentCls}-search`]: {
5
6
  position: "relative",
6
7
  display: "flex",
@@ -9,8 +10,8 @@ const genTableFormStyle = (token) => {
9
10
  "&-border": {
10
11
  paddingInline: token.paddingMD,
11
12
  paddingBlock: token.paddingMD,
12
- paddingBlockEnd: token.paddingMD - 16,
13
- border: `${token.lineWidth}px ${token.lineType} ${token.colorSplit}`,
13
+ paddingBlockEnd: `calc(${unit(token.paddingMD)} - 16px)`,
14
+ border: `${token.lineWidth} ${token.lineType} ${token.colorSplit}`,
14
15
  borderRadius: token.borderRadiusLG,
15
16
  marginBottom: token.marginLG,
16
17
  backgroundColor: token.colorBgContainer
@@ -64,6 +65,19 @@ const genTableFormStyle = (token) => {
64
65
  borderRightWidth: 0,
65
66
  backgroundColor: "transparent",
66
67
  cursor: "default"
68
+ },
69
+ [`${token.antCls}-input${token.componentCls}-number-range-separator`]: {
70
+ textAlign: "center",
71
+ borderInlineStartWidth: 0,
72
+ borderInlineEndWidth: 0,
73
+ backgroundColor: "transparent",
74
+ color: token.colorTextTertiary,
75
+ cursor: "default",
76
+ [`&:disabled, &${token.antCls}-input-disabled`]: {
77
+ backgroundColor: "transparent",
78
+ color: token.colorTextTertiary,
79
+ cursor: "default"
80
+ }
67
81
  }
68
82
  },
69
83
  "&-label": {
@@ -72,7 +86,7 @@ const genTableFormStyle = (token) => {
72
86
  content: "\":\"",
73
87
  position: "relative",
74
88
  marginBlock: 0,
75
- marginInlineStart: token.marginXXS / 2,
89
+ marginInlineStart: `calc(${unit(token.marginXXS)} / 2)`,
76
90
  marginInlineEnd: token.marginXS
77
91
  },
78
92
  [`&${token.componentCls}-search-item-label-no-colon::after`]: { content: "\" \"" },
@@ -89,8 +103,7 @@ const genTableFormStyle = (token) => {
89
103
  justifyContent: "center",
90
104
  alignItems: "center"
91
105
  }
92
- };
106
+ } };
93
107
  };
94
-
95
108
  //#endregion
96
- export { genTableFormStyle };
109
+ export { genProTableSearch };
@@ -0,0 +1,8 @@
1
+ import { ComponentToken } from "../style/index.js";
2
+
3
+ //#region src/theme/augment.d.ts
4
+ declare module 'antdv-next/dist/theme/interface/components' {
5
+ interface ComponentTokenMap {
6
+ ProTable?: ComponentToken;
7
+ }
8
+ }
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,8 @@
1
+ import { ComponentToken } from "../../style/index.js";
2
+
3
+ //#region src/theme/interface/components.d.ts
4
+ interface ComponentTokenMap {
5
+ ProTable: ComponentToken;
6
+ }
7
+ //#endregion
8
+ export { ComponentTokenMap };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,9 @@
1
+ import dayjs from "dayjs";
2
+
3
+ //#region src/utils/dateFormat.d.ts
4
+ type DateFormatType = ((day: dayjs.Dayjs) => string) | string | undefined;
5
+ declare function formatStringValue(value: any, format: DateFormatType): string;
6
+ declare function resolveValueFormat(valueFormat?: string, showTime?: boolean | Record<string, any>): string;
7
+ declare function formatDateRangeArray(values: any[], format: DateFormatType | DateFormatType[], type?: 'dayjs' | 'string'): any[] | undefined;
8
+ //#endregion
9
+ export { formatDateRangeArray, formatStringValue, resolveValueFormat };
@@ -0,0 +1,29 @@
1
+ import dayjs from "dayjs";
2
+ //#region src/utils/dateFormat.ts
3
+ function formatStringValue(value, format) {
4
+ if (typeof format === "function") return format(dayjs(value));
5
+ return dayjs(value).format(format);
6
+ }
7
+ function resolveValueFormat(valueFormat, showTime) {
8
+ return showTime ? "YYYY-MM-DD HH:mm:ss" : valueFormat ?? "YYYY-MM-DD";
9
+ }
10
+ function formatDateRangeArray(values, format, type = "string") {
11
+ if (!Array.isArray(values) || values.length !== 2) return;
12
+ const [startText, endText] = values;
13
+ let formatFirst;
14
+ let formatEnd;
15
+ if (Array.isArray(format)) {
16
+ formatFirst = format[0];
17
+ formatEnd = format[1];
18
+ } else if (typeof format === "object" && format !== void 0) {
19
+ formatFirst = format.format;
20
+ formatEnd = format.format;
21
+ } else {
22
+ formatFirst = format;
23
+ formatEnd = format;
24
+ }
25
+ if (type === "dayjs") return [dayjs(startText), dayjs(endText)];
26
+ return [startText ? formatStringValue(startText, formatFirst) : "", endText ? formatStringValue(endText, formatEnd) : ""];
27
+ }
28
+ //#endregion
29
+ export { formatDateRangeArray, formatStringValue, resolveValueFormat };
@@ -0,0 +1,9 @@
1
+ import { Breakpoint } from "@gx-design-vue/pro-utils";
2
+
3
+ //#region src/utils/formConstants.d.ts
4
+ declare const DEFAULT_BREAKPOINT_SPANS: {
5
+ breakpoint: Breakpoint;
6
+ span: number;
7
+ }[];
8
+ //#endregion
9
+ export { DEFAULT_BREAKPOINT_SPANS };
@@ -0,0 +1,29 @@
1
+ //#region src/utils/formConstants.ts
2
+ const DEFAULT_BREAKPOINT_SPANS = [
3
+ {
4
+ breakpoint: "xxl",
5
+ span: 4
6
+ },
7
+ {
8
+ breakpoint: "xl",
9
+ span: 3
10
+ },
11
+ {
12
+ breakpoint: "lg",
13
+ span: 2
14
+ },
15
+ {
16
+ breakpoint: "md",
17
+ span: 2
18
+ },
19
+ {
20
+ breakpoint: "sm",
21
+ span: 2
22
+ },
23
+ {
24
+ breakpoint: "xs",
25
+ span: 1
26
+ }
27
+ ];
28
+ //#endregion
29
+ export { DEFAULT_BREAKPOINT_SPANS };
@@ -0,0 +1,9 @@
1
+ import { ProColumnsValueType } from "../interface.js";
2
+
3
+ //#region src/utils/valueFormat.d.ts
4
+ interface ValueFormatOptions {
5
+ className?: string;
6
+ }
7
+ declare function valueFormat(value: any, valueType: ProColumnsValueType | undefined, options?: ValueFormatOptions): any;
8
+ //#endregion
9
+ export { ValueFormatOptions, valueFormat };
@@ -0,0 +1,27 @@
1
+ import { h } from "vue";
2
+ import { isNil, isObject } from "@gx-design-vue/pro-utils";
3
+ import dayjs from "dayjs";
4
+ //#region src/utils/valueFormat.ts
5
+ function valueFormat(value, valueType, options = {}) {
6
+ if (isNil(value) || value === "") return value;
7
+ if (!valueType || valueType === "text") return value;
8
+ if (isObject(valueType) && !Array.isArray(valueType)) {
9
+ const config = valueType;
10
+ const tagName = config.node ?? "span";
11
+ return h(tagName === "a" ? "span" : tagName, {
12
+ class: config.class,
13
+ ...config.attr ?? {},
14
+ ...config.click ? { onClick: config.click } : {}
15
+ }, value);
16
+ }
17
+ switch (valueType) {
18
+ case "link": return h("span", { class: [`${options.className}-a`] }, value);
19
+ case "time": return dayjs(value).format("HH:mm:ss");
20
+ case "dateMonth": return `${dayjs(value).month() + 1}月`;
21
+ case "date": return dayjs(value).format("YYYY-MM-DD");
22
+ case "dateTime": return dayjs(value).format("YYYY-MM-DD HH:mm:ss");
23
+ default: return value;
24
+ }
25
+ }
26
+ //#endregion
27
+ export { valueFormat };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@gx-design-vue/pro-table",
3
3
  "type": "module",
4
- "version": "0.2.0-alpha.2",
4
+ "version": "0.2.0-alpha.20",
5
5
  "description": "Gx Design Pro Table",
6
6
  "author": {
7
7
  "name": "gx12358",
@@ -37,20 +37,30 @@
37
37
  "package.json"
38
38
  ],
39
39
  "peerDependencies": {
40
+ "@antdv-next/cssinjs": "^1.0.6",
41
+ "@gx-design-vue/context": "^0.0.5-alpha.7",
42
+ "@gx-design-vue/icon": "^0.0.1-alpha.12",
43
+ "@gx-design-vue/pro-hooks": "^0.2.0-alpha.7",
44
+ "@gx-design-vue/pro-provider": "^0.1.0-alpha.16",
45
+ "@gx-design-vue/pro-utils": "^0.2.0-alpha.9",
46
+ "antdv-next": "^1.4.0",
40
47
  "vue": ">=3.2.0"
41
48
  },
42
49
  "dependencies": {
43
- "@ant-design/icons-vue": "^7.0.1",
44
50
  "@ctrl/tinycolor": "^3.5.0",
45
- "@vueuse/core": "^14.2.0",
46
- "ant-design-vue": "^4.2.6",
47
- "dayjs": "^1.11.19",
48
- "es-toolkit": "^1.43.0",
49
- "@gx-design-vue/context": "^0.0.5-alpha.2",
50
- "@gx-design-vue/pro-app": "^0.1.0-alpha.1",
51
- "@gx-design-vue/pro-hooks": "^0.2.0-alpha.2",
52
- "@gx-design-vue/pro-provider": "^0.1.0-alpha.1",
53
- "@gx-design-vue/pro-utils": "^0.2.0-alpha.2"
51
+ "@vueuse/core": "^14.3.0",
52
+ "dayjs": "^1.11.21",
53
+ "es-toolkit": "1.48.1"
54
+ },
55
+ "devDependencies": {
56
+ "@antdv-next/cssinjs": "^1.0.6",
57
+ "antdv-next": "^1.4.0",
58
+ "vue": "^3.5.38",
59
+ "@gx-design-vue/icon": "^0.0.1-alpha.12",
60
+ "@gx-design-vue/context": "^0.0.5-alpha.7",
61
+ "@gx-design-vue/pro-hooks": "^0.2.0-alpha.7",
62
+ "@gx-design-vue/pro-provider": "^0.1.0-alpha.16",
63
+ "@gx-design-vue/pro-utils": "^0.2.0-alpha.9"
54
64
  },
55
65
  "browserslist": [
56
66
  "> 1%",
@@ -1,50 +0,0 @@
1
- import { ProSchemaValueEnumType } from "../../../types/ColumnTypings.js";
2
- import * as vue199 from "vue";
3
- import { PropType } from "vue";
4
-
5
- //#region src/components/Form/components/RequestSelect.d.ts
6
- declare const _default: vue199.DefineComponent<vue199.ExtractPropTypes<{
7
- fetch: PropType<() => Promise<ProSchemaValueEnumType[]>>;
8
- loading: {
9
- type: PropType<boolean>;
10
- default: boolean;
11
- };
12
- debounceTime: PropType<number>;
13
- manual: {
14
- type: PropType<boolean>;
15
- default: any;
16
- };
17
- fieldName: {
18
- type: PropType<string>;
19
- default: string;
20
- };
21
- notFoundContent: {
22
- type: PropType<(loading: boolean) => any>;
23
- };
24
- }>, () => vue199.VNode<vue199.RendererNode, vue199.RendererElement, {
25
- [key: string]: any;
26
- }>, {}, {}, {}, vue199.ComponentOptionsMixin, vue199.ComponentOptionsMixin, {}, string, vue199.PublicProps, Readonly<vue199.ExtractPropTypes<{
27
- fetch: PropType<() => Promise<ProSchemaValueEnumType[]>>;
28
- loading: {
29
- type: PropType<boolean>;
30
- default: boolean;
31
- };
32
- debounceTime: PropType<number>;
33
- manual: {
34
- type: PropType<boolean>;
35
- default: any;
36
- };
37
- fieldName: {
38
- type: PropType<string>;
39
- default: string;
40
- };
41
- notFoundContent: {
42
- type: PropType<(loading: boolean) => any>;
43
- };
44
- }>> & Readonly<{}>, {
45
- loading: boolean;
46
- manual: boolean;
47
- fieldName: string;
48
- }, {}, {}, {}, string, vue199.ComponentProvideOptions, true, {}, any>;
49
- //#endregion
50
- export { _default as default };
@@ -1,58 +0,0 @@
1
- import { cloneVNode, defineComponent, ref, watch } from "vue";
2
- import { isArray } from "@gx-design-vue/pro-utils";
3
- import { useDebounceFn } from "@vueuse/core";
4
- import { cloneDeep as cloneDeep$1 } from "es-toolkit";
5
-
6
- //#region src/components/Form/components/RequestSelect.tsx
7
- var RequestSelect_default = /* @__PURE__ */ defineComponent({
8
- name: "RequestSelect",
9
- props: {
10
- fetch: Function,
11
- loading: {
12
- type: Boolean,
13
- default: false
14
- },
15
- debounceTime: Number,
16
- manual: {
17
- type: Boolean,
18
- default: void 0
19
- },
20
- fieldName: {
21
- type: String,
22
- default: "options"
23
- },
24
- notFoundContent: { type: Function }
25
- },
26
- setup(props, { slots }) {
27
- const options = ref([]);
28
- const loading = ref(props.loading);
29
- const status = ref("init");
30
- const debouncedFn = useDebounceFn(props.fetch, props.debounceTime || 10);
31
- watch([() => props.fetch, () => props.manual], () => {
32
- if (status.value !== "init" && loading.value) return;
33
- const manual = props.manual ?? false;
34
- if (props.fetch && !manual) {
35
- loading.value = true;
36
- debouncedFn().then((result) => {
37
- options.value = cloneDeep$1(result);
38
- status.value = "success";
39
- }).catch((e) => {
40
- console.error(e);
41
- status.value = "error";
42
- }).finally(() => {
43
- loading.value = false;
44
- });
45
- }
46
- }, { immediate: true });
47
- return () => {
48
- const children = slots.default?.();
49
- return cloneVNode(isArray(children) ? children[0] : children, {
50
- options: options.value,
51
- notFoundContent: props.notFoundContent?.(loading.value)
52
- });
53
- };
54
- }
55
- });
56
-
57
- //#endregion
58
- export { RequestSelect_default as default };
@@ -1,11 +0,0 @@
1
- import { ProSearchMap } from "../../../types/ColumnTypings.js";
2
- import { Ref } from "vue";
3
-
4
- //#region src/components/Form/hooks/useForm.d.ts
5
- declare function useForm(defaultState: Ref<any>, searchMap: Ref<ProSearchMap[]>): {
6
- formState: any;
7
- resetFormState: () => void;
8
- changeFormState: (key: string, value: any) => void;
9
- };
10
- //#endregion
11
- export { useForm };