plain-design 1.0.0-beta.34 → 1.0.0-beta.37

Sign up to get free protection for your applications and to get access to all the features.
Files changed (189) hide show
  1. package/dist/plain-design.commonjs.min.js +1 -1
  2. package/dist/plain-design.min.css +2 -2
  3. package/dist/plain-design.min.js +1 -1
  4. package/dist/report.html +2 -2
  5. package/package.json +6 -5
  6. package/src/packages/components/$object/createObjectService.tsx +31 -20
  7. package/src/packages/components/$object/object.service.utils.ts +7 -3
  8. package/src/packages/components/$previewer/ImagePreviewerFixedContainer.tsx +1 -0
  9. package/src/packages/components/AutoTable/use/useTableOption.table.tsx +3 -3
  10. package/src/packages/components/AutoTable/utils/TableOption.space.tsx +3 -0
  11. package/src/packages/components/Carousel/index.tsx +5 -5
  12. package/src/packages/components/ImagePreviewer/ImagePreviewer.tsx +77 -75
  13. package/src/packages/components/ImagePreviewer/ImagePreviewerCarouselImage.tsx +1 -1
  14. package/src/packages/components/ImagePreviewer/ImagePreviewerGallery.tsx +1 -1
  15. package/src/packages/components/PlcOv/index.tsx +14 -4
  16. package/src/packages/components/StackCard/index.tsx +5 -5
  17. package/src/packages/components/Table/standard/PlcOperation/outer-operation.scss +2 -0
  18. package/src/packages/components/Table/table/use/useTableFormEditor.tsx +1 -1
  19. package/src/packages/components/Table/table/use/useTableModifyEditor.tsx +1 -1
  20. package/src/packages/components/VirtualTable/virtual-table.scss +1 -2
  21. package/src/packages/components/useDialog/index.tsx +1 -1
  22. package/src/packages/utils/inheritSlots.ts +28 -0
  23. package/src/pages/data/address.json +0 -39317
  24. package/src/pages/data/data-1.json +0 -754
  25. package/src/pages/data/data-2.json +0 -3006
  26. package/src/pages/data/data-200.json +0 -5206
  27. package/src/pages/data/data-2000.json +0 -51954
  28. package/src/pages/data/data-50.json +0 -2075
  29. package/src/pages/data/data.json +0 -30002
  30. package/src/pages/data/demo.json +0 -1702
  31. package/src/pages/data/mock.database.js +0 -43
  32. package/src/pages/data/mock.js +0 -141
  33. package/src/pages/data/tree.data.json +0 -87
  34. package/src/pages/env/config/local.js +0 -3
  35. package/src/pages/env/config/prod.js +0 -3
  36. package/src/pages/env/config/undefined.js +0 -1
  37. package/src/pages/env/env.d.ts +0 -4
  38. package/src/pages/env/index.ts +0 -1
  39. package/src/pages/history/createHistory.ts +0 -94
  40. package/src/pages/history/history.utils.ts +0 -64
  41. package/src/pages/index/App.tsx +0 -17
  42. package/src/pages/index/Demo/DemoLine.tsx +0 -23
  43. package/src/pages/index/Demo/DemoRow.scss +0 -131
  44. package/src/pages/index/Demo/DemoRow.tsx +0 -71
  45. package/src/pages/index/Demo/DemoRow.utils.ts +0 -23
  46. package/src/pages/index/Demo/DemoRowController.tsx +0 -45
  47. package/src/pages/index/Demo/index.ts +0 -8
  48. package/src/pages/index/app.scss +0 -197
  49. package/src/pages/index/components/AutoTable/AutoHeightAutoRow.tsx +0 -56
  50. package/src/pages/index/components/AutoTable/AutoHeightFixedRow.tsx +0 -50
  51. package/src/pages/index/components/AutoTable/AutoTableBasicUsage.tsx +0 -75
  52. package/src/pages/index/components/AutoTable/AutoTableCascade.tsx +0 -99
  53. package/src/pages/index/components/AutoTable/AutoTableDefaultSearch.tsx +0 -73
  54. package/src/pages/index/components/AutoTable/AutoTableFiles.tsx +0 -26
  55. package/src/pages/index/components/AutoTable/AutoTableFill.tsx +0 -51
  56. package/src/pages/index/components/AutoTable/AutoTableGroupUsage.tsx +0 -71
  57. package/src/pages/index/components/AutoTable/AutoTableObjectPicker.tsx +0 -181
  58. package/src/pages/index/components/AutoTable/AutoTableOvList.tsx +0 -80
  59. package/src/pages/index/components/AutoTable/AutoTableProductList.tsx +0 -98
  60. package/src/pages/index/components/AutoTable/AutoTableRowFormatter.tsx +0 -58
  61. package/src/pages/index/components/AutoTable/FixedHeightAutoRow.tsx +0 -50
  62. package/src/pages/index/components/AutoTable/FixedHeightFixedRow.tsx +0 -49
  63. package/src/pages/index/components/bus/DemoAddress.tsx +0 -181
  64. package/src/pages/index/components/bus/DemoAddressCascade.tsx +0 -132
  65. package/src/pages/index/components/bus/DemoFilter.tsx +0 -184
  66. package/src/pages/index/components/columns/DemoPlcAddress.tsx +0 -161
  67. package/src/pages/index/components/columns/DemoPlcDate.tsx +0 -363
  68. package/src/pages/index/components/columns/DemoPlcSelect.tsx +0 -505
  69. package/src/pages/index/components/columns/DemoPlcTime.tsx +0 -293
  70. package/src/pages/index/components/columns/DemoTableColumns.tsx +0 -88
  71. package/src/pages/index/components/form/DemoFormBasic.tsx +0 -516
  72. package/src/pages/index/components/form/DemoFormBlur.tsx +0 -204
  73. package/src/pages/index/components/form/DemoFormDynamicFields.tsx +0 -54
  74. package/src/pages/index/components/form/DemoFormEditControl.tsx +0 -164
  75. package/src/pages/index/components/form/DemoFormElement.tsx +0 -207
  76. package/src/pages/index/components/form/DemoFormLayout.scss +0 -7
  77. package/src/pages/index/components/form/DemoFormLayout.tsx +0 -311
  78. package/src/pages/index/components/form/DemoFormSimplify.tsx +0 -587
  79. package/src/pages/index/components/form/DemoFormSize.tsx +0 -274
  80. package/src/pages/index/components/form/DemoFormVertical.tsx +0 -280
  81. package/src/pages/index/components/normal/DemoAlert.tsx +0 -66
  82. package/src/pages/index/components/normal/DemoBadge.tsx +0 -53
  83. package/src/pages/index/components/normal/DemoButton.tsx +0 -300
  84. package/src/pages/index/components/normal/DemoCard.tsx +0 -176
  85. package/src/pages/index/components/normal/DemoCarousel.tsx +0 -230
  86. package/src/pages/index/components/normal/DemoCascade.tsx +0 -880
  87. package/src/pages/index/components/normal/DemoCheckbox.scss +0 -24
  88. package/src/pages/index/components/normal/DemoCheckbox.tsx +0 -294
  89. package/src/pages/index/components/normal/DemoCollapse.tsx +0 -104
  90. package/src/pages/index/components/normal/DemoColor.scss +0 -20
  91. package/src/pages/index/components/normal/DemoColor.tsx +0 -82
  92. package/src/pages/index/components/normal/DemoColorPicker.tsx +0 -163
  93. package/src/pages/index/components/normal/DemoDate.tsx +0 -443
  94. package/src/pages/index/components/normal/DemoDialog.tsx +0 -507
  95. package/src/pages/index/components/normal/DemoDropdown.tsx +0 -464
  96. package/src/pages/index/components/normal/DemoGrid.scss +0 -26
  97. package/src/pages/index/components/normal/DemoGrid.tsx +0 -181
  98. package/src/pages/index/components/normal/DemoIcon.tsx +0 -39
  99. package/src/pages/index/components/normal/DemoImage.tsx +0 -122
  100. package/src/pages/index/components/normal/DemoInput.scss +0 -0
  101. package/src/pages/index/components/normal/DemoInput.tsx +0 -790
  102. package/src/pages/index/components/normal/DemoKeepAlive.tsx +0 -505
  103. package/src/pages/index/components/normal/DemoLayout.tsx +0 -144
  104. package/src/pages/index/components/normal/DemoList.scss +0 -15
  105. package/src/pages/index/components/normal/DemoList.tsx +0 -82
  106. package/src/pages/index/components/normal/DemoLoading.tsx +0 -86
  107. package/src/pages/index/components/normal/DemoNumber.tsx +0 -269
  108. package/src/pages/index/components/normal/DemoPagination.tsx +0 -164
  109. package/src/pages/index/components/normal/DemoPopup.tsx +0 -695
  110. package/src/pages/index/components/normal/DemoProgress.tsx +0 -133
  111. package/src/pages/index/components/normal/DemoRadio.scss +0 -16
  112. package/src/pages/index/components/normal/DemoRadio.tsx +0 -188
  113. package/src/pages/index/components/normal/DemoRate.tsx +0 -77
  114. package/src/pages/index/components/normal/DemoScroll.scss +0 -22
  115. package/src/pages/index/components/normal/DemoScroll.tsx +0 -300
  116. package/src/pages/index/components/normal/DemoSegment.tsx +0 -71
  117. package/src/pages/index/components/normal/DemoSelect.tsx +0 -819
  118. package/src/pages/index/components/normal/DemoSlider.tsx +0 -128
  119. package/src/pages/index/components/normal/DemoSortList.tsx +0 -70
  120. package/src/pages/index/components/normal/DemoStackCard.tsx +0 -356
  121. package/src/pages/index/components/normal/DemoStep.scss +0 -18
  122. package/src/pages/index/components/normal/DemoStep.tsx +0 -291
  123. package/src/pages/index/components/normal/DemoTab.tsx +0 -338
  124. package/src/pages/index/components/normal/DemoTag.tsx +0 -100
  125. package/src/pages/index/components/normal/DemoTime.tsx +0 -403
  126. package/src/pages/index/components/normal/DemoToggle.tsx +0 -56
  127. package/src/pages/index/components/normal/DemoTooltip.tsx +0 -120
  128. package/src/pages/index/components/normal/DemoTree.tsx +0 -1183
  129. package/src/pages/index/components/normal/DemoUpload.tsx +0 -484
  130. package/src/pages/index/components/normal/DemoVirtualList.tsx +0 -464
  131. package/src/pages/index/components/service/DemoDialogService.tsx +0 -249
  132. package/src/pages/index/components/service/DemoFileService.tsx +0 -110
  133. package/src/pages/index/components/service/DemoImagePreviewer.tsx +0 -185
  134. package/src/pages/index/components/service/DemoMessageService.tsx +0 -100
  135. package/src/pages/index/components/service/DemoNoticeService.tsx +0 -99
  136. package/src/pages/index/components/service/DemoPopupService.tsx +0 -325
  137. package/src/pages/index/components/table/DemoPlcOperation.tsx +0 -307
  138. package/src/pages/index/components/table/DemoTableBasic.tsx +0 -220
  139. package/src/pages/index/components/table/DemoTableCheck.tsx +0 -78
  140. package/src/pages/index/components/table/DemoTableClassAndStyle.scss +0 -18
  141. package/src/pages/index/components/table/DemoTableClassAndStyle.tsx +0 -112
  142. package/src/pages/index/components/table/DemoTableColDraggable.tsx +0 -80
  143. package/src/pages/index/components/table/DemoTableEdit.tsx +0 -136
  144. package/src/pages/index/components/table/DemoTableExpand.tsx +0 -203
  145. package/src/pages/index/components/table/DemoTableFixed.tsx +0 -131
  146. package/src/pages/index/components/table/DemoTableFormatter.tsx +0 -66
  147. package/src/pages/index/components/table/DemoTableOverflowTooltip.tsx +0 -67
  148. package/src/pages/index/components/table/DemoTableRowDraggable.tsx +0 -106
  149. package/src/pages/index/components/table/DemoTableSlots.tsx +0 -153
  150. package/src/pages/index/components/table/DemoTableSpan.tsx +0 -167
  151. package/src/pages/index/components/table/DemoTableTree.tsx +0 -976
  152. package/src/pages/index/components/table/DemoVirtualTable.tsx +0 -274
  153. package/src/pages/index/components/test/DemoI18n.tsx +0 -27
  154. package/src/pages/index/components/test/DemoI18n2.jsx +0 -11
  155. package/src/pages/index/home/AppContent.tsx +0 -69
  156. package/src/pages/index/home/AppHead.tsx +0 -18
  157. package/src/pages/index/home/AppHome.tsx +0 -31
  158. package/src/pages/index/home/AppMenu.tsx +0 -38
  159. package/src/pages/index/home/menus.tsx +0 -220
  160. package/src/pages/index/home/plain-design.png +0 -0
  161. package/src/pages/index/main.tsx +0 -23
  162. package/src/pages/index/nav/$nav.ts +0 -41
  163. package/src/pages/index/pages.d.ts +0 -6
  164. package/src/pages/libs/iconfont-fontcls/demo.css +0 -539
  165. package/src/pages/libs/iconfont-fontcls/demo_index.html +0 -303
  166. package/src/pages/libs/iconfont-fontcls/iconfont.css +0 -35
  167. package/src/pages/libs/iconfont-fontcls/iconfont.js +0 -1
  168. package/src/pages/libs/iconfont-fontcls/iconfont.json +0 -44
  169. package/src/pages/libs/iconfont-fontcls/iconfont.ttf +0 -0
  170. package/src/pages/libs/iconfont-fontcls/iconfont.woff +0 -0
  171. package/src/pages/libs/iconfont-fontcls/iconfont.woff2 +0 -0
  172. package/src/pages/libs/iconfont-symbol/demo.css +0 -539
  173. package/src/pages/libs/iconfont-symbol/demo_index.html +0 -303
  174. package/src/pages/libs/iconfont-symbol/iconfont.css +0 -35
  175. package/src/pages/libs/iconfont-symbol/iconfont.js +0 -1
  176. package/src/pages/libs/iconfont-symbol/iconfont.json +0 -44
  177. package/src/pages/libs/iconfont-symbol/iconfont.ttf +0 -0
  178. package/src/pages/libs/iconfont-symbol/iconfont.woff +0 -0
  179. package/src/pages/libs/iconfont-symbol/iconfont.woff2 +0 -0
  180. package/src/pages/libs/install.iconfont-fontcls.tsx +0 -11
  181. package/src/pages/libs/install.iconfont-symbol.scss +0 -7
  182. package/src/pages/libs/install.iconfont-symbol.tsx +0 -14
  183. package/src/pages/module/address.ts +0 -27
  184. package/src/pages/module/http.ts +0 -24
  185. package/src/pages/module/index.ts +0 -19
  186. package/src/pages/module/object.ts +0 -5
  187. package/src/pages/module/ov.tsx +0 -13
  188. package/src/pages/module/upload.ts +0 -9
  189. package/src/pages/module/useTableOption.ts +0 -28
@@ -1,181 +0,0 @@
1
- import {designPage, reactive} from "plain-design-composition";
2
- import {DemoRow} from "../../Demo/DemoRow";
3
- import {Address, Button, Tag} from "../../../../packages";
4
-
5
- export const demo1 = designPage(() => {
6
-
7
- const state = reactive({
8
- formData: {} as any
9
- });
10
-
11
- return () => (
12
- <DemoRow title="基本用法">
13
- <Address province v-model={state.formData.province} width={200} placeholder="选择省"/>
14
- <Address city v-model={state.formData.city} parentValue={state.formData.province} width={200} placeholder="选择市"/>
15
- <Address district v-model={state.formData.district} parentValue={state.formData.city} width={200} placeholder="选择县"/>
16
- <Tag>
17
- {[
18
- state.formData.province,
19
- state.formData.city,
20
- state.formData.district
21
- ].filter(Boolean).join(',') || 'EMPTY'}
22
- </Tag>
23
- </DemoRow>
24
- );
25
- });
26
-
27
- export const demo2 = designPage(() => {
28
-
29
- const state = reactive({
30
- formData: {
31
- province: '440000',
32
- city: '440300',
33
- district: '440305',
34
- } as any
35
- });
36
-
37
- const setValue = () => {
38
- state.formData = {
39
- province: '500000',
40
- city: '500100',
41
- district: '500113',
42
- };
43
- };
44
-
45
- return () => (
46
- <DemoRow title="带初始值">
47
- <Address province v-model={state.formData.province} width={200} placeholder="选择省"/>
48
- <Address city v-model={state.formData.city} parentValue={state.formData.province} width={200} placeholder="选择市"/>
49
- <Address district v-model={state.formData.district} parentValue={state.formData.city} width={200} placeholder="选择县"/>
50
- <Tag>
51
- {[
52
- state.formData.province,
53
- state.formData.city,
54
- state.formData.district
55
- ].filter(Boolean).join(',') || 'EMPTY'}
56
- </Tag>
57
- <Button label="设置值" onClick={setValue}/>
58
- </DemoRow>
59
- );
60
- });
61
-
62
-
63
- export const demo3 = designPage(() => {
64
-
65
- const state = reactive({
66
- formData: {} as any
67
- });
68
-
69
- return () => (
70
- <DemoRow title="选择省">
71
- <Address province v-model={state.formData.province} width={200} placeholder="选择省"/>
72
- <Tag>
73
- {[
74
- state.formData.province,
75
- ].filter(Boolean).join(',') || 'EMPTY'}
76
- </Tag>
77
- </DemoRow>
78
- );
79
- });
80
-
81
-
82
- export const demo4 = designPage(() => {
83
-
84
- const state = reactive({
85
- formData: {
86
- province: '440000',
87
- city: '440300',
88
- } as any
89
- });
90
-
91
- return () => (
92
- <DemoRow title="选择市">
93
- <Address city v-model={state.formData.city} parentValue={state.formData.province} width={200} placeholder="选择市"/>
94
- <Tag>
95
- {[
96
- state.formData.province,
97
- state.formData.city,
98
- ].filter(Boolean).join(',') || 'EMPTY'}
99
- </Tag>
100
- </DemoRow>
101
- );
102
- });
103
-
104
-
105
- export const demo5 = designPage(() => {
106
-
107
- const state = reactive({
108
- formData: {
109
- city: '440300',
110
- district: '440305',
111
- } as any
112
- });
113
-
114
- return () => (
115
- <DemoRow title="选择县">
116
- <Address district v-model={state.formData.district} parentValue={state.formData.city} width={200} placeholder="选择县"/>
117
- <Tag>
118
- {[
119
- state.formData.city,
120
- state.formData.district,
121
- ].filter(Boolean).join(',') || 'EMPTY'}
122
- </Tag>
123
- </DemoRow>
124
- );
125
- });
126
-
127
- export const demo6 = designPage(() => {
128
-
129
- const state = reactive({
130
- formData: {} as any
131
- });
132
-
133
- return () => (
134
- <DemoRow title="选择省市">
135
- <Address province v-model={state.formData.province} width={200} placeholder="选择省"/>
136
- <Address city v-model={state.formData.city} parentValue={state.formData.province} width={200} placeholder="选择市"/>
137
- <Tag>
138
- {[
139
- state.formData.province,
140
- state.formData.city,
141
- ].filter(Boolean).join(',') || 'EMPTY'}
142
- </Tag>
143
- </DemoRow>
144
- );
145
- });
146
-
147
-
148
- export const demo7 = designPage(() => {
149
-
150
- const state = reactive({
151
- formData: {
152
- province: '440000',
153
- city: '440300',
154
- district: '440305',
155
- } as any
156
- });
157
-
158
- const setValue = () => {
159
- state.formData = {
160
- province: '500000',
161
- city: '500100',
162
- district: '500113',
163
- };
164
- };
165
-
166
- return () => (
167
- <DemoRow title="选择市县">
168
- <Address province v-model={state.formData.province} width={200} placeholder="选择省" disabled/>
169
- <Address city v-model={state.formData.city} parentValue={state.formData.province} width={200} placeholder="选择市"/>
170
- <Address district v-model={state.formData.district} parentValue={state.formData.city} width={200} placeholder="选择县"/>
171
- <Tag>
172
- {[
173
- state.formData.province,
174
- state.formData.city,
175
- state.formData.district
176
- ].filter(Boolean).join(',') || 'EMPTY'}
177
- </Tag>
178
- <Button label="设置值" onClick={setValue}/>
179
- </DemoRow>
180
- );
181
- });
@@ -1,132 +0,0 @@
1
- import {designPage, reactive} from "plain-design-composition";
2
- import {DemoRow} from "../../Demo/DemoRow";
3
- import {AddressCascade, Tag} from "../../../../packages";
4
-
5
- export const demo1 = designPage(() => {
6
-
7
- const state = reactive({
8
- formData: {} as any
9
- });
10
-
11
- return () => (
12
- <DemoRow title="基本用法">
13
- <AddressCascade
14
- width={200}
15
- v-model:province={state.formData.province}
16
- v-model:city={state.formData.city}
17
- v-model:district={state.formData.district}
18
- />
19
- <Tag>
20
- {[
21
- state.formData.province,
22
- state.formData.city,
23
- state.formData.district
24
- ].filter(Boolean).join(',') || 'EMPTY'}
25
- </Tag>
26
- </DemoRow>
27
- );
28
- });
29
- export const demo2 = designPage(() => {
30
-
31
- const state = reactive({
32
- formData: {
33
- province: '620000',
34
- city: '620100',
35
- district: '620101',
36
- } as any
37
- });
38
-
39
- return () => (
40
- <DemoRow title="带初始值">
41
- <AddressCascade
42
- width={200}
43
- v-model:province={state.formData.province}
44
- v-model:city={state.formData.city}
45
- v-model:district={state.formData.district}
46
- />
47
- <Tag>
48
- {[
49
- state.formData.province,
50
- state.formData.city,
51
- state.formData.district
52
- ].filter(Boolean).join(',') || 'EMPTY'}
53
- </Tag>
54
- </DemoRow>
55
- );
56
- });
57
-
58
-
59
- export const demo3 = designPage(() => {
60
-
61
- const state = reactive({
62
- formData: {} as any
63
- });
64
-
65
- return () => (
66
- <DemoRow title="选择省">
67
- <AddressCascade
68
- width={200}
69
- v-model:province={state.formData.province}
70
- types="p"
71
- />
72
- <Tag>
73
- {[
74
- state.formData.province,
75
- ].filter(Boolean).join(',') || 'EMPTY'}
76
- </Tag>
77
- </DemoRow>
78
- );
79
- });
80
-
81
-
82
- export const demo4 = designPage(() => {
83
-
84
- const state = reactive({
85
- formData: {} as any
86
- });
87
-
88
- return () => (
89
- <DemoRow title="选择省市">
90
- <AddressCascade
91
- width={200}
92
- v-model:province={state.formData.province}
93
- v-model:city={state.formData.city}
94
- types="pc"
95
- />
96
- <Tag>
97
- {[
98
- state.formData.province,
99
- state.formData.city,
100
- ].filter(Boolean).join(',') || 'EMPTY'}
101
- </Tag>
102
- </DemoRow>
103
- );
104
- });
105
-
106
- export const demo5_1 = designPage(() => {
107
-
108
- const state = reactive({
109
- formData: {} as any
110
- });
111
-
112
- return () => (
113
- <DemoRow title="多选:省">
114
- <AddressCascade width={200} v-model={state.formData.addressCodes} types="p" multiple/>
115
- {JSON.stringify(state.formData.addressCodes)}
116
- </DemoRow>
117
- );
118
- });
119
-
120
- export const demo5 = designPage(() => {
121
-
122
- const state = reactive({
123
- formData: {} as any
124
- });
125
-
126
- return () => (
127
- <DemoRow title="多选:省市县">
128
- <AddressCascade width={200} v-model={state.formData.addressCodes} multiple/>
129
- {JSON.stringify(state.formData.addressCodes)}
130
- </DemoRow>
131
- );
132
- });
@@ -1,184 +0,0 @@
1
- import {designPage} from "plain-design-composition";
2
- import {DemoRow} from "../../Demo/DemoRow";
3
- import {FilterFormMultiple, FilterFormSingle, SelectOption} from "../../../../packages";
4
- import {createFilterOptions, iFilterOption, iFilterQueryParam} from "../../../../packages/components/FilterService/utils/filter.service.utils";
5
- import {iFilterFormMultipleState} from "../../../../packages/components/FilterFormMultiple";
6
- import {iFilterFormSingleState} from "../../../../packages/components/FilterFormSingle";
7
- import {DemoLine} from "../../Demo/DemoLine";
8
- import {iFilterConfigDate} from "../../../../packages/components/FilterService/filter/filter.date";
9
- import {iFilterConfigSelect} from "../../../../packages/components/FilterService/filter/filter.select";
10
-
11
- export const demo_1 = designPage(() => {
12
-
13
- const filterOptions: iFilterOption[] = createFilterOptions([
14
- { label: '文本', field: 'normalText', filterType: 'text', filterHandler: 'like', getQueryParam: ({ formData }) => !!formData.normalText ? ({ text: formData.normalText }) : {} },
15
- { label: '编号', field: 'id', filterType: 'text', filterHandler: 'like', },
16
- { label: '创建时间', field: 'createAt', filterType: 'date', filterHandler: 'range', defaultSearch: true, defaultValue: ['2023-01-03', '2023-01-13'] },
17
- { label: '更新时间', field: 'updateAt', filterType: 'date', filterHandler: 'eq' },
18
- { label: '日期', field: 'dateVal', filterType: 'date', filterHandler: 'range' },
19
- { label: '计数', field: 'count', filterType: 'number', filterHandler: 'range' },
20
- { label: '数字', field: 'numberVal', filterType: 'text', filterHandler: 'eq' },
21
- { label: '复选框', field: 'flag', filterType: 'text', filterHandler: 'eq' },
22
- {
23
- label: '下拉选择', field: 'selectVal', filterType: 'select', filterHandler: 'eq', filterConfig: {
24
- renderOptions: () => <>
25
- <SelectOption label="Android" val="android"/>
26
- <SelectOption label="IOS" val="ios"/>
27
- <SelectOption label="Web" val="web"/>
28
- <SelectOption label="SSR" val="ssr"/>
29
- <SelectOption label="微前端" val="micro"/>
30
- </>
31
- } as iFilterConfigSelect
32
- },
33
- { label: '长文本', field: 'longText', filterType: 'text', filterHandler: 'like' },
34
- { label: '父对象', field: 'parentName', filterType: 'text', filterHandler: 'eq' },
35
- { label: '省', field: 'provinceVal', filterType: 'text', filterHandler: 'eq' },
36
- { label: '市', field: 'cityVal', filterType: 'text', filterHandler: 'eq' },
37
- { label: '区', field: 'districtVal', filterType: 'text', filterHandler: 'eq' },
38
- { label: '选项值', field: 'ovVal', filterType: 'text', filterHandler: 'eq' },
39
- ]);
40
-
41
- const onSearch = (data: iFilterFormSingleState & { filterQueryParam: iFilterQueryParam }) => {
42
- console.log(data);
43
- };
44
-
45
- return () => (
46
- <DemoRow title="单个字段筛选">
47
- <DemoLine title="基本用法">
48
- <FilterFormSingle filterOptions={filterOptions} onSearch={onSearch}/>
49
- </DemoLine>
50
- <DemoLine title="隐藏字段选择器">
51
- <FilterFormSingle filterOptions={filterOptions} onSearch={onSearch} hideFieldSelector/>
52
- </DemoLine>
53
- <DemoLine title="隐藏筛选类型选择器">
54
- <FilterFormSingle filterOptions={filterOptions} onSearch={onSearch} hideHandlerSelector/>
55
- </DemoLine>
56
- <DemoLine title="隐藏搜索按钮">
57
- <FilterFormSingle filterOptions={filterOptions} onSearch={onSearch} hideSearchButton/>
58
- </DemoLine>
59
- </DemoRow>
60
- );
61
- });
62
-
63
- export const demo1 = designPage(() => {
64
-
65
- const filterOptions: iFilterOption[] = createFilterOptions([
66
- { label: '文本', field: 'normalText', filterType: 'text', filterHandler: 'like', getQueryParam: ({ formData }) => !!formData.normalText ? ({ text: formData.normalText }) : {} },
67
- { label: '编号', field: 'id', filterType: 'text', filterHandler: 'like' },
68
- { label: '创建时间', field: 'createAt', filterType: 'date', filterHandler: 'range', defaultValue: ['2023-01-03', '2023-01-13'] },
69
- { label: '更新时间', field: 'updateAt', filterType: 'date', filterHandler: 'eq' },
70
- { label: '日期', field: 'dateVal', filterType: 'date', filterHandler: 'range' },
71
- { label: '计数', field: 'count', filterType: 'number', filterHandler: 'range' },
72
- { label: '数字', field: 'numberVal', filterType: 'text', filterHandler: 'eq' },
73
- { label: '复选框', field: 'flag', filterType: 'text', filterHandler: 'eq' },
74
- {
75
- label: '下拉选择', field: 'selectVal', filterType: 'select', filterHandler: 'eq', filterConfig: {
76
- renderOptions: () => <>
77
- <SelectOption label="Android" val="android"/>
78
- <SelectOption label="IOS" val="ios"/>
79
- <SelectOption label="Web" val="web"/>
80
- <SelectOption label="SSR" val="ssr"/>
81
- <SelectOption label="微前端" val="micro"/>
82
- </>
83
- } as iFilterConfigSelect
84
- },
85
- { label: '长文本', field: 'longText', filterType: 'text', filterHandler: 'like' },
86
- { label: '父对象', field: 'parentName', filterType: 'text', filterHandler: 'eq' },
87
- { label: '省', field: 'provinceVal', filterType: 'text', filterHandler: 'eq' },
88
- { label: '市', field: 'cityVal', filterType: 'text', filterHandler: 'eq' },
89
- { label: '区', field: 'districtVal', filterType: 'text', filterHandler: 'eq' },
90
- { label: '选项值', field: 'ovVal', filterType: 'text', filterHandler: 'eq' },
91
- ]);
92
-
93
- const onSearch = (data: iFilterFormMultipleState & { filterQueryParam: iFilterQueryParam }) => {
94
- console.log(data);
95
- };
96
-
97
- return () => (
98
- <DemoRow title="多字段筛选">
99
- <FilterFormMultiple filterOptions={filterOptions} onSearch={onSearch}/>
100
- </DemoRow>
101
- );
102
- });
103
-
104
-
105
- export const demo__1 = designPage(() => {
106
-
107
- const filterOptions: iFilterOption[] = createFilterOptions([
108
- { label: '文本', field: 'normalText', filterType: 'text', filterHandler: 'like', getQueryParam: ({ formData }) => !!formData.normalText ? ({ text: formData.normalText }) : {}, filterConfig: { formItemAttrs: { column: 2 } } },
109
- { label: '编号', field: 'id', filterType: 'text', filterHandler: 'like', filterConfig: { formItemAttrs: { column: 2 } } },
110
- { label: '创建时间', field: 'createAt', filterType: 'date', filterHandler: 'range', defaultValue: ['2023-01-03', '2023-01-13'] },
111
- { label: '更新时间', field: 'updateAt', filterType: 'date', filterHandler: 'eq' },
112
- { label: '日期', field: 'dateVal', filterType: 'date', filterHandler: 'range' },
113
- { label: '计数', field: 'count', filterType: 'number', filterHandler: 'range' },
114
- { label: '数字', field: 'numberVal', filterType: 'text', filterHandler: 'eq' },
115
- { label: '复选框', field: 'flag', filterType: 'text', filterHandler: 'eq' },
116
- {
117
- label: '下拉选择', field: 'selectVal', filterType: 'select', filterHandler: 'eq', filterConfig: {
118
- renderOptions: () => <>
119
- <SelectOption label="Android" val="android"/>
120
- <SelectOption label="IOS" val="ios"/>
121
- <SelectOption label="Web" val="web"/>
122
- <SelectOption label="SSR" val="ssr"/>
123
- <SelectOption label="微前端" val="micro"/>
124
- </>
125
- } as iFilterConfigSelect
126
- },
127
- { label: '长文本', field: 'longText', filterType: 'text', filterHandler: 'like' },
128
- { label: '父对象', field: 'parentName', filterType: 'text', filterHandler: 'eq' },
129
- { label: '省', field: 'provinceVal', filterType: 'text', filterHandler: 'eq' },
130
- { label: '市', field: 'cityVal', filterType: 'text', filterHandler: 'eq' },
131
- { label: '区', field: 'districtVal', filterType: 'text', filterHandler: 'eq' },
132
- { label: '选项值', field: 'ovVal', filterType: 'text', filterHandler: 'eq' },
133
- ]);
134
-
135
- const onSearch = (data: iFilterFormMultipleState & { filterQueryParam: iFilterQueryParam }) => {
136
- console.log(data);
137
- };
138
-
139
- return () => (
140
- <DemoRow title="多列字段">
141
- <FilterFormMultiple filterOptions={filterOptions} onSearch={onSearch} column={2}/>
142
- </DemoRow>
143
- );
144
- });
145
-
146
-
147
- export const demo2 = designPage(() => {
148
-
149
- const filterOptions: iFilterOption[] = createFilterOptions([
150
- { label: '文本', field: 'normalText', filterType: 'text', filterHandler: 'like', getQueryParam: ({ formData }) => !!formData.normalText ? ({ text: formData.normalText }) : {} },
151
- { label: '编号', field: 'id', filterType: 'text', filterHandler: 'like' },
152
- { label: '创建时间', field: 'createAt', filterType: 'date', filterHandler: 'range', defaultValue: ['2023-01-03', '2023-01-13'], filterConfig: { queryFieldMode: 'field' } as iFilterConfigDate },
153
- ]);
154
-
155
- const onSearch = (data: iFilterFormMultipleState & { filterQueryParam: iFilterQueryParam }) => {
156
- console.log(data);
157
- };
158
-
159
- return () => (
160
- <DemoRow title="Date FilterConfig field">
161
- <FilterFormMultiple filterOptions={filterOptions} onSearch={onSearch}/>
162
- </DemoRow>
163
- );
164
- });
165
-
166
-
167
- export const demo3 = designPage(() => {
168
-
169
- const filterOptions: iFilterOption[] = createFilterOptions([
170
- { label: '文本', field: 'normalText', filterType: 'text', filterHandler: 'like', getQueryParam: ({ formData }) => !!formData.normalText ? ({ text: formData.normalText }) : {} },
171
- { label: '编号', field: 'id', filterType: 'text', filterHandler: 'like' },
172
- { label: '创建时间', field: 'createAt', filterType: 'date', filterHandler: 'range', defaultValue: ['2023-01-03', '2023-01-13'], filterConfig: { queryFieldMode: 'separate' } as iFilterConfigDate },
173
- ]);
174
-
175
- const onSearch = (data: iFilterFormMultipleState & { filterQueryParam: iFilterQueryParam }) => {
176
- console.log(data);
177
- };
178
-
179
- return () => (
180
- <DemoRow title="Date FilterConfig separate">
181
- <FilterFormMultiple filterOptions={filterOptions} onSearch={onSearch}/>
182
- </DemoRow>
183
- );
184
- });
@@ -1,161 +0,0 @@
1
- import {designPage, reactive, useRefs} from "plain-design-composition";
2
- import {$message, Button, ButtonGroup, Form, FormItem, Plc, PlcAddress, PlcAddressItem, PlcIndex, PlcInput, PlcNumber, PlcTextarea, Segment, SegmentGroup, Table} from "../../../../packages";
3
- import {iTableNode} from "../../../../packages/components/Table/table/utils/table.utils";
4
- import {DemoRow} from "../../Demo/DemoRow";
5
- import data50 from '../../../data/data-50.json';
6
- import {deepcopy} from "plain-utils/object/deepcopy";
7
-
8
- export const demo1 = designPage(() => {
9
-
10
- const { refs, onRef } = useRefs({
11
- table: Table
12
- });
13
-
14
- const state = reactive({
15
- data: data50.slice(0, 5),
16
- editNodes: [] as iTableNode[],
17
-
18
- onDblClickRow(tableNode: iTableNode) {
19
- if (!tableNode.state.edit) {
20
- tableNode.enableEdit();
21
- state.editNodes.push(tableNode);
22
- }
23
- },
24
- saveEdit: async () => {
25
- const validates = (await Promise.all(state.editNodes.map(node => node.validate()))).filter(Boolean);
26
- if (validates.length > 0) {
27
- console.log(validates);
28
- const { validateResultData, node: { state: { index } } } = validates[0]!;
29
- $message.error(`第${index + 1}条记录校验不通过,${validateResultData[0].label}:${validateResultData[0].message}`);
30
- return;
31
- }
32
- // todo 网络保存逻辑
33
- state.editNodes.forEach(tableNode => tableNode.saveEdit(tableNode.state.editRow));
34
- state.editNodes.forEach(tableNode => tableNode.closeEdit());
35
- state.editNodes = [];
36
- },
37
- cancelEdit: () => {
38
- state.editNodes.forEach(tableNode => {
39
- tableNode.cancelEdit();
40
- });
41
- state.editNodes = [];
42
- },
43
- });
44
-
45
- return () => (
46
- <DemoRow title={'基本用法'}>
47
- <Form column={1}>
48
- <FormItem label="导出">
49
- <ButtonGroup style={{ margin: '4px 0' }}>
50
- <Button label="导出原始数据" onClick={() => console.log(refs.table!.methods.getSourceData())}/>
51
- <Button label="导出显示数据" onClick={() => refs.table!.methods.getShowData().then(val => console.log(val))}/>
52
- </ButtonGroup>
53
- </FormItem>
54
- <FormItem label={'编辑'}>
55
- <ButtonGroup disabled={state.editNodes.length === 0}>
56
- <Button onClick={state.saveEdit} label={'保存编辑'}/>
57
- <Button onClick={state.cancelEdit} label={'取消编辑'}/>
58
- </ButtonGroup>
59
- </FormItem>
60
- </Form>
61
- <Table
62
- data={state.data}
63
- onDblclickCell={state.onDblClickRow}
64
- ref={onRef.table}
65
- >
66
- <PlcIndex/>
67
- <Plc field="id" title="编号"/>
68
- <PlcInput field="name" title="文本框" required/>
69
- <PlcAddressItem field="province" title="省" province/>
70
- <PlcAddressItem field="city" title="市" city parentField="province"/>
71
- <PlcAddressItem field="district" title="县" district parentField="city"/>
72
- <PlcNumber field="num" title="数字"/>
73
- </Table>
74
- </DemoRow>
75
- );
76
- });
77
-
78
- export const demo2 = designPage(() => {
79
-
80
- const { refs, onRef } = useRefs({
81
- table: Table
82
- });
83
-
84
- const state = reactive({
85
- data: data50.slice(0, 5) as any[],
86
- editNodes: [] as iTableNode[],
87
- formEdit: false,
88
-
89
- onDblClickRow(tableNode: iTableNode) {
90
- if (state.formEdit) {
91
- refs.table!.formEditor.methods.edit({
92
- node: tableNode,
93
- onConfirm: (node) => {
94
- state.data[tableNode.state.index] = deepcopy(node.state.editRow);
95
- }
96
- });
97
- } else {
98
- if (!tableNode.state.edit) {
99
- tableNode.enableEdit();
100
- state.editNodes.push(tableNode);
101
- }
102
- }
103
- },
104
- saveEdit: async () => {
105
- const validates = (await Promise.all(state.editNodes.map(node => node.validate()))).filter(Boolean);
106
- if (validates.length > 0) {
107
- console.log(validates);
108
- const { validateResultData, node: { state: { index } } } = validates[0]!;
109
- $message.error(`第${index + 1}条记录校验不通过,${validateResultData[0].label}:${validateResultData[0].message}`);
110
- return;
111
- }
112
- // todo 网络保存逻辑
113
- state.editNodes.forEach(tableNode => tableNode.saveEdit(tableNode.state.editRow));
114
- state.editNodes.forEach(tableNode => tableNode.closeEdit());
115
- state.editNodes = [];
116
- },
117
- cancelEdit: () => {
118
- state.editNodes.forEach(tableNode => {
119
- tableNode.cancelEdit();
120
- });
121
- state.editNodes = [];
122
- },
123
- });
124
-
125
- return () => (
126
- <DemoRow title={'合并列'}>
127
- <Form column={1}>
128
- <FormItem label="大小尺寸">
129
- <SegmentGroup v-model={state.formEdit}>
130
- <Segment label="行内编辑" val={false}/>
131
- <Segment label="表单编辑" val={true}/>
132
- </SegmentGroup>
133
- </FormItem>
134
- <FormItem label="导出">
135
- <ButtonGroup style={{ margin: '4px 0' }}>
136
- <Button label="导出原始数据" onClick={() => console.log(refs.table!.methods.getSourceData())}/>
137
- <Button label="导出显示数据" onClick={() => refs.table!.methods.getShowData().then(val => console.log(val))}/>
138
- </ButtonGroup>
139
- </FormItem>
140
- <FormItem label={'编辑'}>
141
- <ButtonGroup disabled={state.editNodes.length === 0}>
142
- <Button onClick={state.saveEdit} label={'保存编辑'}/>
143
- <Button onClick={state.cancelEdit} label={'取消编辑'}/>
144
- </ButtonGroup>
145
- </FormItem>
146
- </Form>
147
- <Table
148
- data={state.data}
149
- onDblclickCell={state.onDblClickRow}
150
- ref={onRef.table}
151
- >
152
- <PlcIndex/>
153
- <Plc field="id" title="编号"/>
154
- <PlcInput field="name" title="文本框" required/>
155
- <PlcAddress/>
156
- <PlcNumber field="num" title="数字"/>
157
- <PlcTextarea field="name" title="长文本"/>
158
- </Table>
159
- </DemoRow>
160
- );
161
- });