feffery_antd_components 0.1.4 → 0.1.7

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 (163) hide show
  1. package/DESCRIPTION +1 -1
  2. package/NAMESPACE +2 -0
  3. package/Project.toml +1 -1
  4. package/README.md +2 -2
  5. package/build/lib/feffery_antd_components/AntdAffix.py +54 -0
  6. package/build/lib/feffery_antd_components/AntdAlert.py +58 -0
  7. package/build/lib/feffery_antd_components/AntdAnchor.py +60 -0
  8. package/build/lib/feffery_antd_components/AntdAvatar.py +79 -0
  9. package/build/lib/feffery_antd_components/AntdBackTop.py +52 -0
  10. package/build/lib/feffery_antd_components/AntdBadge.py +70 -0
  11. package/build/lib/feffery_antd_components/AntdBreadcrumb.py +74 -0
  12. package/build/lib/feffery_antd_components/AntdButton.py +68 -0
  13. package/build/lib/feffery_antd_components/AntdCalendar.py +75 -0
  14. package/build/lib/feffery_antd_components/AntdCard.py +86 -0
  15. package/build/lib/feffery_antd_components/AntdCardGrid.py +52 -0
  16. package/build/lib/feffery_antd_components/AntdCarousel.py +56 -0
  17. package/build/lib/feffery_antd_components/AntdCascader.py +93 -0
  18. package/build/lib/feffery_antd_components/AntdCheckbox.py +71 -0
  19. package/build/lib/feffery_antd_components/AntdCheckboxGroup.py +79 -0
  20. package/build/lib/feffery_antd_components/AntdCol.py +146 -0
  21. package/build/lib/feffery_antd_components/AntdCollapse.py +79 -0
  22. package/build/lib/feffery_antd_components/AntdComment.py +88 -0
  23. package/build/lib/feffery_antd_components/AntdContent.py +50 -0
  24. package/build/lib/feffery_antd_components/AntdCountdown.py +72 -0
  25. package/build/lib/feffery_antd_components/AntdDatePicker.py +95 -0
  26. package/build/lib/feffery_antd_components/AntdDateRangePicker.py +91 -0
  27. package/build/lib/feffery_antd_components/AntdDescriptionItem.py +58 -0
  28. package/build/lib/feffery_antd_components/AntdDescriptions.py +76 -0
  29. package/build/lib/feffery_antd_components/AntdDivider.py +62 -0
  30. package/build/lib/feffery_antd_components/AntdDraggerUpload.py +84 -0
  31. package/build/lib/feffery_antd_components/AntdDrawer.py +72 -0
  32. package/build/lib/feffery_antd_components/AntdDropdown.py +84 -0
  33. package/build/lib/feffery_antd_components/AntdEmpty.py +54 -0
  34. package/build/lib/feffery_antd_components/AntdFooter.py +50 -0
  35. package/build/lib/feffery_antd_components/AntdForm.py +72 -0
  36. package/build/lib/feffery_antd_components/AntdFormItem.py +84 -0
  37. package/build/lib/feffery_antd_components/AntdHeader.py +50 -0
  38. package/build/lib/feffery_antd_components/AntdIcon.py +48 -0
  39. package/build/lib/feffery_antd_components/AntdImage.py +62 -0
  40. package/build/lib/feffery_antd_components/AntdInput.py +101 -0
  41. package/build/lib/feffery_antd_components/AntdInputNumber.py +101 -0
  42. package/build/lib/feffery_antd_components/AntdLayout.py +50 -0
  43. package/build/lib/feffery_antd_components/AntdMentions.py +76 -0
  44. package/build/lib/feffery_antd_components/AntdMenu.py +81 -0
  45. package/build/lib/feffery_antd_components/AntdMessage.py +56 -0
  46. package/build/lib/feffery_antd_components/AntdModal.py +88 -0
  47. package/build/lib/feffery_antd_components/AntdNotification.py +60 -0
  48. package/build/lib/feffery_antd_components/AntdPageHeader.py +62 -0
  49. package/build/lib/feffery_antd_components/AntdPagination.py +95 -0
  50. package/build/lib/feffery_antd_components/AntdParagraph.py +70 -0
  51. package/build/lib/feffery_antd_components/AntdPasteImage.py +52 -0
  52. package/build/lib/feffery_antd_components/AntdPopconfirm.py +80 -0
  53. package/build/lib/feffery_antd_components/AntdPopover.py +74 -0
  54. package/build/lib/feffery_antd_components/AntdProgress.py +88 -0
  55. package/build/lib/feffery_antd_components/AntdRadio.py +54 -0
  56. package/build/lib/feffery_antd_components/AntdRadioGroup.py +89 -0
  57. package/build/lib/feffery_antd_components/AntdRate.py +60 -0
  58. package/build/lib/feffery_antd_components/AntdResult.py +52 -0
  59. package/build/lib/feffery_antd_components/AntdRibbon.py +54 -0
  60. package/build/lib/feffery_antd_components/AntdRow.py +72 -0
  61. package/build/lib/feffery_antd_components/AntdSelect.py +121 -0
  62. package/build/lib/feffery_antd_components/AntdSider.py +68 -0
  63. package/build/lib/feffery_antd_components/AntdSkeleton.py +86 -0
  64. package/build/lib/feffery_antd_components/AntdSlider.py +68 -0
  65. package/build/lib/feffery_antd_components/AntdSpace.py +60 -0
  66. package/build/lib/feffery_antd_components/AntdSpin.py +68 -0
  67. package/build/lib/feffery_antd_components/AntdStatistic.py +74 -0
  68. package/build/lib/feffery_antd_components/AntdSteps.py +72 -0
  69. package/build/lib/feffery_antd_components/AntdSwitch.py +75 -0
  70. package/build/lib/feffery_antd_components/AntdTabPane.py +66 -0
  71. package/build/lib/feffery_antd_components/AntdTable.py +264 -0
  72. package/build/lib/feffery_antd_components/AntdTabs.py +81 -0
  73. package/build/lib/feffery_antd_components/AntdTag.py +54 -0
  74. package/build/lib/feffery_antd_components/AntdTestLink.py +58 -0
  75. package/build/lib/feffery_antd_components/AntdText.py +72 -0
  76. package/build/lib/feffery_antd_components/AntdTimePicker.py +95 -0
  77. package/build/lib/feffery_antd_components/AntdTimeRangePicker.py +95 -0
  78. package/build/lib/feffery_antd_components/AntdTimeline.py +68 -0
  79. package/build/lib/feffery_antd_components/AntdTitle.py +74 -0
  80. package/build/lib/feffery_antd_components/AntdTooltip.py +64 -0
  81. package/build/lib/feffery_antd_components/AntdTransfer.py +99 -0
  82. package/build/lib/feffery_antd_components/AntdTree.py +103 -0
  83. package/build/lib/feffery_antd_components/AntdTreeSelect.py +107 -0
  84. package/build/lib/feffery_antd_components/AntdTypography.py +50 -0
  85. package/build/lib/feffery_antd_components/AntdUpload.py +92 -0
  86. package/build/lib/feffery_antd_components/AntdWatermark.py +64 -0
  87. package/build/lib/feffery_antd_components/Link.py +58 -0
  88. package/build/lib/feffery_antd_components/__init__.py +53 -0
  89. package/build/lib/feffery_antd_components/_imports_.py +161 -0
  90. package/build/lib/feffery_antd_components/feffery_antd_components.min.js +344 -0
  91. package/build/lib/feffery_antd_components/metadata.json +15596 -0
  92. package/build/lib/feffery_antd_components/package-info.json +81 -0
  93. package/feffery_antd_components/AntdAnchor.py +9 -3
  94. package/feffery_antd_components/AntdButton.py +5 -3
  95. package/feffery_antd_components/AntdCascader.py +5 -3
  96. package/feffery_antd_components/AntdDatePicker.py +5 -3
  97. package/feffery_antd_components/AntdDateRangePicker.py +5 -3
  98. package/feffery_antd_components/AntdDraggerUpload.py +6 -4
  99. package/feffery_antd_components/AntdImage.py +2 -2
  100. package/feffery_antd_components/AntdInput.py +5 -3
  101. package/feffery_antd_components/AntdInputNumber.py +5 -3
  102. package/feffery_antd_components/AntdMentions.py +5 -3
  103. package/feffery_antd_components/AntdMessage.py +5 -3
  104. package/feffery_antd_components/AntdPasteImage.py +52 -0
  105. package/feffery_antd_components/AntdSelect.py +7 -3
  106. package/feffery_antd_components/AntdTable.py +27 -3
  107. package/feffery_antd_components/AntdTimePicker.py +5 -3
  108. package/feffery_antd_components/AntdTimeRangePicker.py +5 -3
  109. package/feffery_antd_components/AntdTree.py +6 -10
  110. package/feffery_antd_components/AntdTreeSelect.py +7 -3
  111. package/feffery_antd_components/AntdUpload.py +16 -4
  112. package/feffery_antd_components/AntdWatermark.py +64 -0
  113. package/feffery_antd_components/_imports_.py +4 -0
  114. package/feffery_antd_components/feffery_antd_components.min.js +13 -13
  115. package/feffery_antd_components/metadata.json +680 -43
  116. package/feffery_antd_components/package-info.json +18 -14
  117. package/package.json +18 -14
  118. package/src/FefferyAntdComponents.jl +5 -3
  119. package/src/jl/'feffery'_antdanchor.jl +4 -1
  120. package/src/jl/'feffery'_antdbutton.jl +2 -1
  121. package/src/jl/'feffery'_antdcascader.jl +2 -1
  122. package/src/jl/'feffery'_antddatepicker.jl +2 -1
  123. package/src/jl/'feffery'_antddaterangepicker.jl +2 -1
  124. package/src/jl/'feffery'_antddraggerupload.jl +2 -1
  125. package/src/jl/'feffery'_antdimage.jl +2 -2
  126. package/src/jl/'feffery'_antdinput.jl +2 -1
  127. package/src/jl/'feffery'_antdinputnumber.jl +2 -1
  128. package/src/jl/'feffery'_antdmentions.jl +2 -1
  129. package/src/jl/'feffery'_antdmessage.jl +2 -1
  130. package/src/jl/'feffery'_antdpasteimage.jl +28 -0
  131. package/src/jl/'feffery'_antdselect.jl +3 -1
  132. package/src/jl/'feffery'_antdtable.jl +19 -5
  133. package/src/jl/'feffery'_antdtimepicker.jl +2 -1
  134. package/src/jl/'feffery'_antdtimerangepicker.jl +2 -1
  135. package/src/jl/'feffery'_antdtree.jl +3 -5
  136. package/src/jl/'feffery'_antdtreeselect.jl +3 -1
  137. package/src/jl/'feffery'_antdupload.jl +9 -2
  138. package/src/jl/'feffery'_antdwatermark.jl +39 -0
  139. package/src/lib/components/AntdAnchor.react.js +18 -3
  140. package/src/lib/components/AntdButton.react.js +5 -1
  141. package/src/lib/components/AntdCascader.react.js +5 -0
  142. package/src/lib/components/AntdDatePicker.react.js +5 -0
  143. package/src/lib/components/AntdDateRangePicker.react.js +5 -0
  144. package/src/lib/components/AntdDraggerUpload.react.js +41 -11
  145. package/src/lib/components/AntdImage.react.js +8 -2
  146. package/src/lib/components/AntdInput.react.js +8 -0
  147. package/src/lib/components/AntdInputNumber.react.js +5 -0
  148. package/src/lib/components/AntdMentions.react.js +5 -0
  149. package/src/lib/components/AntdMessage.react.js +6 -1
  150. package/src/lib/components/AntdPasteImage.react.js +170 -0
  151. package/src/lib/components/AntdSelect.react.js +11 -0
  152. package/src/lib/components/AntdTable.react.js +69 -6
  153. package/src/lib/components/AntdTimePicker.react.js +5 -0
  154. package/src/lib/components/AntdTimeRangePicker.react.js +5 -0
  155. package/src/lib/components/AntdTree.react.js +6 -13
  156. package/src/lib/components/AntdTreeSelect.react.js +11 -0
  157. package/src/lib/components/AntdUpload.react.js +78 -24
  158. package/src/lib/components/AntdWatermark.react.js +115 -0
  159. package/src/lib/components/styles.css +12 -11
  160. package/src/lib/components/tabs/AntdTabs.react.js +4 -0
  161. package/src/lib/index.js +5 -1
  162. package/usage.py +76 -1033
  163. package/webpack.config.js +9 -3
package/usage.py CHANGED
@@ -1,96 +1,77 @@
1
1
  import dash
2
2
  import numpy as np
3
3
  from dash import html
4
+ from flask import request
4
5
  import feffery_antd_components as fac
5
6
  from dash.dependencies import Input, Output, State
6
7
 
7
8
  app = dash.Dash(__name__)
8
9
 
10
+
11
+ @app.server.route('/upload/', methods=['POST'])
12
+ def upload():
13
+ '''
14
+ 构建文件上传服务
15
+ :return:
16
+ '''
17
+
18
+ # 获取上传id参数,用于指向保存路径
19
+ uploadId = request.values.get('uploadId')
20
+
21
+ # 获取上传的文件名称
22
+ filename = request.files['file'].filename
23
+
24
+ print({'filename': filename})
25
+
26
+ return {'filename': filename}
27
+
28
+
29
+ @app.callback(
30
+ Output('output', 'children'),
31
+ Input('input', 'lastUploadTaskRecord')
32
+ )
33
+ def test(lastUploadTaskRecord):
34
+ if lastUploadTaskRecord:
35
+ print(lastUploadTaskRecord)
36
+
37
+ return dash.no_update
38
+
9
39
  app.layout = html.Div(
10
40
  [
11
41
 
42
+ fac.AntdUpload(
43
+ id='input',
44
+ apiUrl='/upload/',
45
+ directory=True
46
+ ),
47
+
48
+ html.Div(
49
+ id='output'
50
+ ),
51
+
12
52
  fac.AntdTable(
13
- miniChartHeight=60,
14
- miniChartAnimation=False,
15
- summaryRowContents=[{'content': '测试', 'align': 'center'}]*5+[{'content': '测试测试', 'colSpan': 2, 'align': 'center'}],
16
- summaryRowFixed=True,
17
53
  columns=[
18
54
  {
19
- 'title': 'status-badge示例',
20
- 'dataIndex': 'status-badge示例',
21
- # 'width': '25%',
22
- 'renderOptions': {
23
- 'renderType': 'status-badge'
24
- }
25
- },
26
- {
27
- 'title': 'mini-bar示例',
28
- 'dataIndex': 'mini-bar示例',
29
- # 'width': '25%',
30
- 'renderOptions': {
31
- 'renderType': 'mini-bar'
32
- }
33
- },
34
- {
35
- 'title': 'ellipsis内容省略示例',
36
- 'dataIndex': 'ellipsis内容省略示例',
37
- 'renderOptions': {'renderType': 'ellipsis'}
38
- },
39
- {
40
- # 注意,mini-progress模式接受的输入应当在0到1之间
41
- 'title': 'mini-progress示例',
42
- 'dataIndex': 'mini-progress示例',
43
- # 'width': '25%',
44
- 'renderOptions': {
45
- 'renderType': 'mini-progress'
46
- }
47
- },
48
- {
49
- # 注意,mini-ring-progress模式接受的输入应当在0到1之间
50
- 'title': 'mini-ring-progress示例',
51
- 'dataIndex': 'mini-ring-progress示例',
52
- # 'width': '25%',
53
- 'renderOptions': {
54
- 'renderType': 'mini-ring-progress'
55
- }
56
- },
57
- {
58
- 'title': 'mini-area示例',
59
- 'dataIndex': 'mini-area示例',
60
- # 'width': '25%',
61
- 'renderOptions': {
62
- 'renderType': 'mini-area'
63
- }
64
- },
65
- {
66
- 'title': 'mini-line示例',
67
- 'dataIndex': 'mini-line示例',
68
- # 'width': '25%',
55
+ 'title': '图片字段测试',
56
+ 'dataIndex': '图片字段测试',
57
+ 'width': '200px',
69
58
  'renderOptions': {
70
- 'renderType': 'mini-line'
59
+ 'renderType': 'image'
71
60
  }
72
- },
61
+ }
73
62
  ],
74
63
  data=[
75
64
  {
76
- 'key': i,
77
- 'ellipsis内容省略示例': '这是一段废话,用来演示超长内容再渲染巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉',
78
- 'status-badge示例': {
79
- 'status': 'processing',
80
- 'text': '处理中'
81
- },
82
- 'mini-line示例': np.random.randint(1, 20, 10),
83
- 'mini-bar示例': np.random.randint(1, 20, 10),
84
- 'mini-progress示例': np.random.rand(),
85
- 'mini-ring-progress示例': np.random.rand(),
86
- 'mini-area示例': np.random.randint(1, 20, 10)
65
+ '图片字段测试': {
66
+ 'src': 'https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg',
67
+ 'height': '100%'
68
+ }
87
69
  }
88
- for i in range(50)
89
- ],
90
- maxHeight=400,
91
- # maxWidth=800,
70
+ ] * 100,
92
71
  bordered=True,
93
- containerId='docs-content' # 绑定局部滚动容器以确保悬浮层正常显示
72
+ style={
73
+ 'width': '300px'
74
+ }
94
75
  ),
95
76
 
96
77
  fac.AntdTable(
@@ -101,6 +82,29 @@ app.layout = html.Div(
101
82
  'title': '默认的checkbox模式',
102
83
  'dataIndex': f'默认的checkbox模式',
103
84
  'width': '33.33%',
85
+ 'conditionStyle': '''
86
+ (record, index) => {
87
+ if (record.默认的checkbox模式 >= 10) {
88
+ return {
89
+ style: {
90
+ color: "red"
91
+ }
92
+ }
93
+ }
94
+ if (record.默认的checkbox模式 % 2 === 0) {
95
+ return {
96
+ style: {
97
+ backgroundColor: "#ffe7ba"
98
+ }
99
+ }
100
+ }
101
+ return {
102
+ style: {
103
+ fontWeight: "bold"
104
+ }
105
+ }
106
+ }
107
+ '''
104
108
  # 'fixed': 'left'
105
109
  },
106
110
  {
@@ -114,7 +118,6 @@ app.layout = html.Div(
114
118
  'width': '33.33%'
115
119
  }
116
120
  ],
117
- containerId='docs-content',
118
121
  sticky=True,
119
122
  pagination={
120
123
  'pageSize': 100
@@ -145,923 +148,6 @@ app.layout = html.Div(
145
148
  style={
146
149
  # 'width': '800px'
147
150
  }
148
- ),
149
-
150
- html.Div(
151
- [
152
- fac.AntdAlert(
153
- description='好样的',
154
- message=[
155
- html.Div(
156
- [
157
- fac.AntdText(
158
- '这是一段测试文字,'
159
- ),
160
- fac.AntdText(
161
- '加粗',
162
- strong=True
163
- ),
164
- html.A(
165
- '链接',
166
- href='/'
167
- )
168
- ]
169
- )
170
- ],
171
- showIcon=True
172
- )
173
- ]
174
- ),
175
-
176
-
177
- html.Div(
178
- [
179
- fac.AntdAlert(
180
- description='这是一段辅助说明文字',
181
- message=[
182
- '君不见黄河之水天上来',
183
- '奔流到海不复回',
184
- '君不见高堂明镜悲白发',
185
- '朝如青丝暮成雪',
186
- '人生得意须尽欢',
187
- '莫使金樽空对月',
188
- '天生我材必有用',
189
- '千金散尽还复来'
190
- ],
191
- showIcon=True,
192
- messageRenderMode='loop-text'
193
- )
194
- ]
195
- ),
196
-
197
- html.Div(
198
- [
199
- fac.AntdAlert(
200
- '这是一段辅助说明文字',
201
- message=','.join([
202
- '君不见黄河之水天上来',
203
- '奔流到海不复回',
204
- '君不见高堂明镜悲白发',
205
- '朝如青丝暮成雪',
206
- '人生得意须尽欢',
207
- '莫使金樽空对月',
208
- '天生我材必有用',
209
- '千金散尽还复来'
210
- ]) + '。',
211
- description='这是跑马灯模式示例',
212
- showIcon=True,
213
- messageRenderMode='marquee'
214
- )
215
- ]
216
- ),
217
-
218
- fac.AntdRadioGroup(
219
- options=[
220
- {
221
- 'label': f'选项{i}',
222
- 'value': f'选项{i}'
223
- }
224
- for i in range(5)
225
- ],
226
- defaultValue='选项1'
227
- ),
228
-
229
- fac.AntdSpace(
230
- [
231
- html.Div(
232
- '输入框',
233
- style={
234
- 'height': '32px',
235
- 'lineHeight': '32px',
236
- 'backgroundColor': 'rgb(241, 241, 241)',
237
- 'paddingLeft': '8px',
238
- 'paddingRight': '8px',
239
- 'borderTopLeftRadius': '5px',
240
- 'borderBottomLeftRadius': '5px',
241
- }
242
- ),
243
- fac.AntdInput(
244
- style={
245
- 'width': '100px'
246
- }
247
- )
248
- ],
249
- size=0
250
- ),
251
-
252
- html.Div(
253
- style={
254
- 'height': '200px'
255
- }
256
- ),
257
-
258
- fac.AntdRadioGroup(
259
- options=[
260
- {
261
- 'label': f'选项{i}',
262
- 'value': f'选项{i}'
263
- }
264
- for i in range(5)
265
- ],
266
- direction='vertical',
267
- defaultValue='选项1'
268
- ),
269
-
270
- fac.AntdPopover(
271
- fac.AntdButton(
272
- '鼠标悬浮于此',
273
- type='primary'
274
- ),
275
- content=[
276
- fac.AntdButton(
277
- '鼠标悬浮于此',
278
- type='primary'
279
- ),
280
- fac.AntdButton(
281
- '鼠标悬浮于此',
282
- type='primary'
283
- ),
284
- fac.AntdButton(
285
- '鼠标悬浮于此',
286
- type='primary'
287
- ),
288
- fac.AntdTimeline(
289
- items=[
290
- {
291
- 'content': '训练数据导入',
292
- 'icon': 'md-cloud-upload',
293
- 'iconStyle': {
294
- 'fontSize': '18px'
295
- }
296
- },
297
- {
298
- 'content': '模型训练',
299
- 'icon': 'antd-clock-circle',
300
- 'iconStyle': {
301
- 'fontSize': '18px'
302
- }
303
- },
304
- {
305
- 'content': '模型持久化',
306
- 'icon': 'fc-accept-database',
307
- 'iconStyle': {
308
- 'fontSize': '18px'
309
- }
310
- },
311
- {
312
- 'content': '模型发布',
313
- 'icon': 'md-cloud-done',
314
- 'iconStyle': {
315
- 'fontSize': '18px'
316
- }
317
- }
318
- ],
319
- style={
320
- 'margin': '20px'
321
- }
322
- )
323
- ],
324
- title={
325
- 'content': '标题前缀图标测试',
326
- 'prefixIcon': 'fc-search'
327
- }
328
- ),
329
-
330
- fac.AntdProgress(
331
- percent=80
332
- ),
333
- html.Div(
334
- style={
335
- 'height': '100px'
336
- }
337
- ),
338
- html.Div(
339
- [
340
-
341
- html.Div(
342
- [
343
-
344
- html.Div(
345
- fac.AntdMenu(
346
- menuItems=[
347
- {
348
- 'component': 'SubMenu',
349
- 'props': {
350
- 'key': f'{sub_menu}',
351
- 'title': f'子菜单{sub_menu}'
352
- },
353
- 'children': [
354
- {
355
- 'component': 'ItemGroup',
356
- 'props': {
357
- 'key': f'{sub_menu}-{item_group}',
358
- 'title': f'菜单项分组{sub_menu}-{item_group}'
359
- },
360
- 'children': [
361
- {
362
- 'component': 'Item',
363
- 'props': {
364
- 'key': f'{sub_menu}-{item_group}-{item}',
365
- 'title': f'菜单项{sub_menu}-{item_group}-{item}'
366
- }
367
- }
368
- for item in range(1, 3)
369
- ]
370
- }
371
- for item_group in range(1, 3)
372
- ]
373
- }
374
- for sub_menu in range(1, 5)
375
- ],
376
- mode='horizontal'
377
- ),
378
- style={
379
- 'width': '250px'
380
- }
381
- ),
382
-
383
- html.Div(
384
- fac.AntdMenu(
385
- menuItems=[
386
- {
387
- 'component': 'SubMenu',
388
- 'props': {
389
- 'key': f'{sub_menu}',
390
- 'title': f'子菜单{sub_menu}'
391
- },
392
- 'children': [
393
- {
394
- 'component': 'ItemGroup',
395
- 'props': {
396
- 'key': f'{sub_menu}-{item_group}',
397
- 'title': f'菜单项分组{sub_menu}-{item_group}'
398
- },
399
- 'children': [
400
- {
401
- 'component': 'Item',
402
- 'props': {
403
- 'key': f'{sub_menu}-{item_group}-{item}',
404
- 'title': f'菜单项{sub_menu}-{item_group}-{item}'
405
- }
406
- }
407
- for item in range(1, 3)
408
- ]
409
- }
410
- for item_group in range(1, 3)
411
- ]
412
- }
413
- for sub_menu in range(1, 5)
414
- ]
415
- ),
416
- style={
417
- 'width': '250px'
418
- }
419
- ),
420
-
421
-
422
- fac.AntdTable(
423
- columns=[
424
- {
425
- 'title': '字段示例1',
426
- 'dataIndex': '字段示例1'
427
- },
428
- {
429
- 'title': '字段示例2',
430
- 'dataIndex': '字段示例2'
431
- },
432
- {
433
- 'title': '字段示例3',
434
- 'dataIndex': '字段示例3'
435
- }
436
- ],
437
- data=[
438
- {
439
- '字段示例1': i,
440
- '字段示例2': i,
441
- '字段示例3': i
442
- }
443
- for i in range(30)
444
- ]
445
- ),
446
-
447
- fac.AntdSpace(
448
- [
449
- fac.AntdButton(
450
- [
451
- fac.AntdIcon(
452
- icon='md-power-settings-new'
453
- ),
454
- 'md-power-settings-new'
455
- ]
456
- ),
457
- fac.AntdButton(
458
- [
459
- fac.AntdIcon(
460
- icon='md-layers'
461
- ),
462
- 'md-layers'
463
- ],
464
- type='primary'
465
- ),
466
- fac.AntdButton(
467
- [
468
- fac.AntdIcon(
469
- icon='fc-repair'
470
- ),
471
- 'fc-repair'
472
- ],
473
- type='dashed'
474
- )
475
- ]
476
- ),
477
-
478
- fac.AntdTable(
479
- columns=[
480
- {
481
- 'title': 'ellipsis内容省略示例',
482
- 'dataIndex': 'ellipsis内容省略示例',
483
- 'renderOptions': {'renderType': 'copyable'}
484
- }
485
- ],
486
- data=[
487
- {
488
- 'key': i,
489
- 'ellipsis内容省略示例': '这是一段废话,用来演示超长内容再渲染巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉'
490
- }
491
- for i in range(5)
492
- ],
493
- bordered=True,
494
- style={
495
- 'width': '250px'
496
- }
497
- ),
498
- fac.AntdTitle(
499
- 'AntdIcon测试区域',
500
- level=4
501
- ),
502
- fac.AntdSpace(
503
- [
504
- fac.AntdButton(
505
- [
506
- fac.AntdIcon(icon='search', style={
507
- 'marginRight': '5px'}),
508
- '搜索'
509
- ]
510
- ),
511
-
512
- fac.AntdAvatar(
513
- mode='icon',
514
- icon='fc-vlc'
515
- )
516
- ]
517
- ),
518
- fac.AntdBreadcrumb(
519
- items=[
520
- {
521
- 'title': 'feffery-components仓库主页',
522
- 'href': 'https://github.com/CNFeffery/feffery-dash-components',
523
- 'target': '_blank',
524
- 'icon': 'github'
525
- },
526
- {
527
- 'title': 'feffery-antd-components文档首页',
528
- 'href': '/',
529
- 'target': '_blank',
530
- 'icon': 'home'
531
- },
532
- {
533
- 'title': 'AntdBreadcrumb文档页',
534
- 'href': '/AntdBreadcrumb',
535
- 'target': '_blank',
536
- 'icon': 'fc-approval'
537
- }
538
- ]
539
- ),
540
-
541
- fac.AntdDraggerUpload(
542
- apiUrl='/upload/',
543
- fileMaxSize=1,
544
- fileListMaxLength=1,
545
- text='拖拽上传示例',
546
- hint='点击或拖拽文件至此处进行上传'
547
- ),
548
-
549
-
550
- fac.AntdDropdown(
551
- title='触发点',
552
- menuItems=[
553
- {
554
- 'title': '子页面1',
555
- 'icon': 'global'
556
- },
557
- {
558
- 'title': '子页面1',
559
- 'icon': 'fc-plus'
560
- },
561
- {
562
- 'title': '子页面2'
563
- },
564
- {
565
- 'isDivider': True
566
- },
567
- {
568
- 'title': '子页面3-1'
569
- },
570
- {
571
- 'title': '子页面3-2'
572
- }
573
- ]
574
- ),
575
-
576
- fac.AntdRadioGroup(
577
- options=[
578
- {
579
- 'label': f'选项{i}',
580
- 'value': f'选项{i}'
581
- }
582
- for i in range(5)
583
- ],
584
- direction='vertical',
585
- defaultValue='选项1'
586
- ),
587
-
588
- html.Div(
589
- fac.AntdMenu(
590
- menuItems=[
591
- {
592
- 'component': 'Item',
593
- 'props': {
594
- 'key': f'图标{icon}',
595
- 'title': f'图标{icon}',
596
- 'icon': icon
597
- }
598
- }
599
- for icon in [
600
- 'home',
601
- 'cloud-upload',
602
- 'bar-chart',
603
- 'pie-chart',
604
- 'dot-chart',
605
- 'line-chart',
606
- 'apartment',
607
- 'app-store',
608
- 'app-store-add',
609
- 'bell',
610
- 'calculator',
611
- 'calendar',
612
- 'database',
613
- 'history',
614
- 'fc-services',
615
- 'fc-questions',
616
- 'fc-organization'
617
- ]
618
- ],
619
- mode='inline'
620
- ),
621
- style={
622
- 'width': '250px'
623
- }
624
- ),
625
- fac.AntdButton(
626
- '触发全局提示框', id='message-trigger-button-demo1', type='primary'),
627
- html.Div(id='message-container-demo1'),
628
-
629
- fac.AntdButton(
630
- '触发对话框',
631
- type='primary',
632
- id='modal-demo-trigger-1'
633
- ),
634
-
635
- fac.AntdModal(
636
- fac.AntdText('对话框内容测试'),
637
- id='modal-demo-1',
638
- visible=False,
639
- title={
640
- 'content': '标题测试',
641
- 'prefixIcon': 'search'
642
- },
643
- renderFooter=True
644
- ),
645
-
646
-
647
- fac.AntdPopover(
648
- fac.AntdButton(
649
- '鼠标悬浮于此',
650
- type='primary'
651
- ),
652
- content=[
653
- fac.AntdButton(
654
- '鼠标悬浮于此',
655
- type='primary'
656
- ),
657
- fac.AntdButton(
658
- '鼠标悬浮于此',
659
- type='primary'
660
- ),
661
- fac.AntdButton(
662
- '鼠标悬浮于此',
663
- type='primary'
664
- ),
665
- fac.AntdTimeline(
666
- items=[
667
- {
668
- 'content': '训练数据导入',
669
- 'icon': 'md-cloud-upload',
670
- 'iconStyle': {
671
- 'fontSize': '18px'
672
- }
673
- },
674
- {
675
- 'content': '模型训练',
676
- 'icon': 'antd-clock-circle',
677
- 'iconStyle': {
678
- 'fontSize': '18px'
679
- }
680
- },
681
- {
682
- 'content': '模型持久化',
683
- 'icon': 'fc-accept-database',
684
- 'iconStyle': {
685
- 'fontSize': '18px'
686
- }
687
- },
688
- {
689
- 'content': '模型发布',
690
- 'icon': 'md-cloud-done',
691
- 'iconStyle': {
692
- 'fontSize': '18px'
693
- }
694
- }
695
- ],
696
- style={
697
- 'margin': '20px'
698
- }
699
- )
700
- ],
701
- title={
702
- 'content': '标题前缀图标测试',
703
- 'prefixIcon': 'fc-search'
704
- }
705
- ),
706
-
707
-
708
- fac.AntdTimeline(
709
- items=[
710
- {
711
- 'content': '训练数据导入',
712
- 'icon': 'md-cloud-upload',
713
- 'iconStyle': {
714
- 'fontSize': '18px'
715
- }
716
- },
717
- {
718
- 'content': '模型训练',
719
- 'icon': 'clock-circle',
720
- 'iconStyle': {
721
- 'fontSize': '18px'
722
- }
723
- },
724
- {
725
- 'content': '模型持久化',
726
- 'icon': 'fc-accept-database',
727
- 'iconStyle': {
728
- 'fontSize': '18px'
729
- }
730
- },
731
- {
732
- 'content': '模型发布',
733
- 'icon': 'md-cloud-done',
734
- 'iconStyle': {
735
- 'fontSize': '18px'
736
- }
737
- }
738
- ],
739
- style={
740
- 'margin': '20px'
741
- }
742
- ),
743
-
744
-
745
- fac.AntdTree(
746
- treeData=[
747
- {
748
- 'title': '负责人A',
749
- 'key': '负责人A',
750
- 'icon': 'user',
751
- 'children': [
752
- {
753
- 'title': '数仓1',
754
- 'key': '数仓1',
755
- 'icon': 'database',
756
- 'children': [
757
- {
758
- 'title': f'业务表1-{i}',
759
- 'key': f'业务表1-{i}',
760
- 'icon': 'table'
761
- }
762
- for i in range(5)
763
- ]
764
- },
765
- {
766
- 'title': '数仓2',
767
- 'key': '数仓2',
768
- 'icon': 'database',
769
- 'children': [
770
- {
771
- 'title': f'业务表2-{i}',
772
- 'key': f'业务表2-{i}',
773
- 'icon': 'fc-search'
774
- }
775
- for i in range(5)
776
- ]
777
- }
778
- ]
779
- }
780
- ],
781
- # 设置默认全部展开
782
- defaultExpandAll=True,
783
- checkable=True
784
- ),
785
-
786
-
787
- fac.AntdStatistic(
788
- title='统计数值示例',
789
- titleTooltip='这是一段指标说明内容巴拉巴拉'*10,
790
- value=1332971
791
- ),
792
- html.Div(
793
- id='password-md5-demo-output'
794
- ),
795
- fac.AntdInput(
796
- id='password-md5-demo',
797
- placeholder='输入框测试',
798
- mode='password',
799
- passwordUseMd5=True
800
- ),
801
-
802
- fac.AntdTreeSelect(
803
- treeData=[
804
- {
805
- "title": "Node1",
806
- "value": "0-0",
807
- "key": "0-0",
808
- "children": [
809
- {
810
- "title": "Child Node1",
811
- "value": "0-0-0",
812
- "key": "0-0-0"
813
- }
814
- ]
815
- },
816
- {
817
- "title": "Node2",
818
- "value": "0-1",
819
- "key": "0-1",
820
- "children": [
821
- {
822
- "title": "Child Node3",
823
- "value": "0-1-0",
824
- "key": "0-1-0"
825
- },
826
- {
827
- "title": "Child Node4",
828
- "value": "0-1-1",
829
- "key": "0-1-1"
830
- },
831
- {
832
- "title": "Child Node5",
833
- "value": "0-1-2",
834
- "key": "0-1-2"
835
- }
836
- ]
837
- }
838
- ],
839
- style={
840
- 'width': '250px'
841
- }
842
- ),
843
- # 需要relative
844
- fac.AntdTooltip(
845
- fac.AntdButton(
846
- 'click事件',
847
- type='primary'
848
- ),
849
- title='这是一段AntdTooltip提示示例',
850
- trigger='click'
851
- ),
852
-
853
- # 需要relative
854
- fac.AntdTimeRangePicker(
855
- allowClear=True,
856
- hourStep=3,
857
- minuteStep=10,
858
- secondStep=10
859
- ),
860
- # 需要relative
861
- fac.AntdTimePicker(
862
- allowClear=True,
863
- hourStep=3,
864
- minuteStep=10,
865
- secondStep=10
866
- ),
867
-
868
- # 需要relative
869
- fac.AntdPopover(
870
- fac.AntdButton(
871
- 'click事件',
872
- type='primary'
873
- ),
874
- title='这是一段AntdTooltip提示示例',
875
- trigger='click'
876
- ),
877
-
878
- # 需要relative
879
- fac.AntdPopconfirm(
880
- fac.AntdButton(
881
- '点击触发',
882
- type='primary'
883
- ),
884
- title='气泡确认测试'
885
- ),
886
-
887
- # 需要relative
888
- fac.AntdDropdown(
889
- title='触发点',
890
- trigger='click',
891
- menuItems=[
892
- {
893
- 'title': '子页面1'
894
- },
895
- {
896
- 'title': '子页面2'
897
- },
898
- {
899
- 'isDivider': True
900
- },
901
- {
902
- 'title': '子页面3-1'
903
- },
904
- {
905
- 'title': '子页面3-2'
906
- }
907
- ]
908
- ),
909
-
910
- # 需要relative
911
- fac.AntdMentions(
912
- options=[
913
- {
914
- 'label': '费弗里',
915
- 'value': '费弗里'
916
- },
917
- {
918
- 'label': '小A',
919
- 'value': '小A'
920
- },
921
- {
922
- 'label': 'liz',
923
- 'value': 'liz'
924
- }
925
- ],
926
- style={
927
- 'width': '400px'
928
- }
929
- ),
930
-
931
- fac.AntdCascader(
932
- options=[
933
- {
934
- 'value': '节点1',
935
- 'label': '节点1',
936
- 'children': [
937
- {
938
- 'value': '节点1-1',
939
- 'label': '节点1-1'
940
- },
941
- {
942
- 'value': '节点1-2',
943
- 'label': '节点1-2',
944
- 'children': [
945
- {
946
- 'value': '节点1-2-1',
947
- 'label': '节点1-2-1'
948
- },
949
- {
950
- 'value': '节点1-2-2',
951
- 'label': '节点1-2-2'
952
- }
953
- ]
954
- }
955
- ]
956
- },
957
- {
958
- 'value': '节点2',
959
- 'label': '节点2',
960
- 'children': [
961
- {
962
- 'value': '节点2-1',
963
- 'label': '节点2-1'
964
- },
965
- {
966
- 'value': '节点2-2',
967
- 'label': '节点2-2'
968
- }
969
- ]
970
- }
971
- ],
972
- style={
973
- 'width': '300px'
974
- }
975
- ),
976
- fac.AntdTable(
977
- columns=[
978
- {
979
- 'title': f'字段{i}',
980
- 'dataIndex': f'字段{i}'
981
- }
982
- for i in range(1, 6)
983
- ],
984
- data=[
985
- {
986
- f'字段{i}': np.random.randint(1, 5)
987
- for i in range(1, 6)
988
- }
989
- for _ in range(10)
990
- ],
991
- filterOptions={
992
- '字段1': {
993
- 'filterMode': 'keyword'
994
- },
995
- '字段3': {
996
- 'filterMode': 'checkbox',
997
- 'filterCustomItems': [1, 2, 3]
998
- }
999
- }
1000
- ),
1001
-
1002
- fac.AntdSelect(
1003
- placeholder='请选择国家:',
1004
- options=[
1005
- {'label': '中国', 'value': '中国'},
1006
- {'label': '美国', 'value': '美国'},
1007
- {'label': '俄罗斯', 'value': '俄罗斯'},
1008
- {'label': '德国', 'value': '德国', 'disabled': True},
1009
- {'label': '加拿大', 'value': '加拿大'}
1010
- ],
1011
- style={
1012
- # 使用css样式固定宽度
1013
- 'width': '200px'
1014
- }
1015
- ),
1016
-
1017
- # 需要relative
1018
- fac.AntdDatePicker(
1019
- defaultValue='2021-01-01 23:00:00',
1020
- showTime=True
1021
- ),
1022
-
1023
- # 需要relative
1024
- fac.AntdDateRangePicker(
1025
- defaultValue=['2021-01-01 17:00:00',
1026
- '2021-01-09 18:00:00'],
1027
- showTime=True
1028
- ),
1029
-
1030
-
1031
- fac.AntdComment(
1032
- id='comment-demo',
1033
- authorName='费弗里',
1034
- authorNameHref='https://github.com/CNFeffery/feffery-antd-components',
1035
- publishTime={
1036
- 'value': '2022-01-01 19:29:01',
1037
- 'format': 'YYYY-MM-DD hh:mm:ss'
1038
- },
1039
- commentContent='我希望feffery-components项目系列组件可以帮助更多人快速开发心仪的网站应用!😀',
1040
- showDelete=True
1041
- ),
1042
-
1043
- html.Div(id='comment-output-demo'),
1044
-
1045
- html.Div(
1046
- style={
1047
- 'height': '1000px'
1048
- }
1049
- )
1050
-
1051
- ],
1052
- style={
1053
- 'padding': '100px 200px',
1054
- 'position': 'relative'
1055
- },
1056
- id='container-demo'
1057
- )
1058
- ],
1059
- style={
1060
- 'margin': '100px',
1061
- 'border': '1px solid grey',
1062
- 'height': '800px',
1063
- 'overflowY': 'auto'
1064
- }
1065
151
  )
1066
152
  ],
1067
153
  style={
@@ -1070,48 +156,5 @@ app.layout = html.Div(
1070
156
  }
1071
157
  )
1072
158
 
1073
-
1074
- @app.callback(
1075
- Output('password-md5-demo-output', 'children'),
1076
- Input('password-md5-demo', 'md5Value')
1077
- )
1078
- def test(md5Value):
1079
-
1080
- return md5Value
1081
-
1082
-
1083
- @app.callback(
1084
- Output('comment-output-demo', 'children'),
1085
- [Input('comment-demo', 'replyClicks'),
1086
- Input('comment-demo', 'deleteClicks')]
1087
- )
1088
- def test_(replyClicks, deleteClicks):
1089
-
1090
- return f'{replyClicks} - {deleteClicks}'
1091
-
1092
-
1093
- @app.callback(
1094
- Output('message-container-demo1', 'children'),
1095
- Input('message-trigger-button-demo1', 'nClicks'),
1096
- prevent_initial_call=True
1097
- )
1098
- def message_demo1(nClicks):
1099
-
1100
- return fac.AntdMessage(
1101
- content='全局提示框示例',
1102
- icon='fc-overtime',
1103
- duration=0
1104
- )
1105
-
1106
-
1107
- @app.callback(
1108
- Output('modal-demo-1', 'visible'),
1109
- Input('modal-demo-trigger-1', 'nClicks'),
1110
- prevent_initial_call=True
1111
- )
1112
- def modal_demo_callback1(nClicks):
1113
- return True
1114
-
1115
-
1116
159
  if __name__ == '__main__':
1117
160
  app.run_server(debug=True)