feffery_antd_components 0.3.15 → 0.4.0-rc5

package/src/lib/fragments/upload/AntdUpload.react.js

@@ -9,6 +9,7 @@ import { isString, isUndefined } from 'lodash';
 import { v4 as uuidv4 } from 'uuid';
 import { pickBy } from 'ramda';
 import { pick } from 'ramda';
+import { useLoading } from '../../components/utils';
 // 自定义hooks
 import useCss from '../../hooks/useCss';
 // 上下文
@@ -53,6 +54,7 @@ const AntdUpload = (props) => {
         style,
         key,
         name,
+        enableBatchControl,
         locale,
         apiUrl,
         apiUrlExtraParams,
@@ -82,10 +84,13 @@ const AntdUpload = (props) => {
         defaultFileList,
         disabled,
         status,
-        loading_state,
-        setProps
+        setProps,
+        ...others
     } = props;
 
+    const [messageApi, messageContextHolder] = message.useMessage();
+    const [modalApi, modalContextHolder] = Modal.useModal();
+
     const context = useContext(PropsContext)
     const formId = useContext(FormContext)
 
@@ -101,7 +106,7 @@ const AntdUpload = (props) => {
     // 针对上传类组件，特殊处理由表单值控制上传列表的清空
     useEffect(() => {
         // 若上文中存在有效表单id
-        if (formId && (name || id)) {
+        if (formId && (name || id) && enableBatchControl) {
             if (!currentFormValue || currentFormValue.length === 0) {
                 // 清空上传列表
                 updateFileList([])
@@ -117,7 +122,7 @@ const AntdUpload = (props) => {
     useEffect(() => {
         return () => {
             // 若上文中存在有效表单id
-            if (formId && (name || id)) {
+            if (formId && (name || id) && enableBatchControl) {
                 // 表单值更新
                 deleteItemValue(formId, name || id)
             }
@@ -167,12 +172,12 @@ const AntdUpload = (props) => {
         beforeUpload: (file) => {
             const sizeCheck = file.size / 1024 / 1024 < fileMaxSize;
             if (!sizeCheck) {
-                message.error(`${file.name}${locale2text.Upload[locale].sizeError[0]}${fileMaxSize}${locale2text.Upload[locale].sizeError[1]}`);
+                messageApi.error(`${file.name}${locale2text.Upload[locale].sizeError[0]}${fileMaxSize}${locale2text.Upload[locale].sizeError[1]}`);
             }
 
             if (fileTypes) {
                 if (fileTypes.indexOf(file.name.split('.')[file.name.split('.').length - 1]) === -1) {
-                    message.error(`${locale2text.Upload[locale].typeError[0]}${file.name}${locale2text.Upload[locale].typeError[1]}`);
+                    messageApi.error(`${locale2text.Upload[locale].typeError[0]}${file.name}${locale2text.Upload[locale].typeError[1]}`);
                 }
 
                 return sizeCheck && fileTypes.indexOf(file.name.split('.')[file.name.split('.').length - 1]) !== -1;
@@ -231,7 +236,7 @@ const AntdUpload = (props) => {
                         }
                     )
                     // AntdForm表单批量控制
-                    if (formId && (name || id)) {
+                    if (formId && (name || id) && enableBatchControl) {
                         // 表单值更新
                         updateItemValue(formId, name || id, _listUploadTaskRecord)
                     }
@@ -286,7 +291,7 @@ const AntdUpload = (props) => {
                                 )
 
                                 // AntdForm表单批量控制
-                                if (formId && (name || id)) {
+                                if (formId && (name || id) && enableBatchControl) {
                                     // 表单值更新
                                     updateItemValue(formId, name || id, _listUploadTaskRecord)
                                 }
@@ -368,7 +373,7 @@ const AntdUpload = (props) => {
                     )
 
                     // AntdForm表单批量控制
-                    if (formId && (name || id)) {
+                    if (formId && (name || id) && enableBatchControl) {
                         // 表单值更新
                         updateItemValue(formId, name || id, _listUploadTaskRecord)
                     }
@@ -415,7 +420,7 @@ const AntdUpload = (props) => {
                     )
 
                     // AntdForm表单批量控制
-                    if (formId && (name || id)) {
+                    if (formId && (name || id) && enableBatchControl) {
                         // 表单值更新
                         updateItemValue(formId, name || id, _listUploadTaskRecord)
                     }
@@ -449,9 +454,9 @@ const AntdUpload = (props) => {
             }
 
             if ((info.file.status === 'done' || info.file.status === 'success') && showSuccessMessage) {
-                message.success(`${info.file.name} ${locale2text.Upload[locale].uploadSuccess}`);
+                messageApi.success(`${info.file.name} ${locale2text.Upload[locale].uploadSuccess}`);
             } else if (info.file.status === 'error' && showErrorMessage) {
-                message.error(`${info.file.name} ${locale2text.Upload[locale].uploadFailed}`);
+                messageApi.error(`${info.file.name} ${locale2text.Upload[locale].uploadFailed}`);
             }
 
             // 获取当前上传文件列表
@@ -519,7 +524,6 @@ const AntdUpload = (props) => {
 
     // 添加accept参数
     if (fileTypes && fileTypes.length != 0) {
-
         Object.assign(uploadProps, { accept: '.' + fileTypes.join(',.') })
     }
 
@@ -527,7 +531,7 @@ const AntdUpload = (props) => {
         <ConfigProvider locale={str2Locale.get(locale)}>
             <div
                 // 提取具有data-*或aria-*通配格式的属性
-                {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), props)}
+                {...pickBy((_, k) => k.startsWith('data-') || k.startsWith('aria-'), others)}
                 id={id}
                 className={
                     isString(className) ?
@@ -541,6 +545,8 @@ const AntdUpload = (props) => {
                     ...style
                 }}
                 key={key}>
+                {messageContextHolder}
+                {modalContextHolder}
                 <Upload
                     {...uploadProps}
                     className={buttonProps?.block ? 'ant-upload-button-block' : undefined}
@@ -571,22 +577,19 @@ const AntdUpload = (props) => {
                         confirmBeforeDelete ?
                             () => {
                                 return new Promise((resolve, reject) => {
-                                    Modal.confirm({
+                                    modalApi.confirm({
                                         title: locale2text.AntdPictureUpload[locale].confirmBeforeDeleteTitle,
                                         okText: locale2text.AntdPictureUpload[locale].confirmBeforeDeleteOkText,
                                         cancelText: locale2text.AntdPictureUpload[locale].confirmBeforeDeleteCancelText,
                                         onOk: () => {
                                             resolve(true);
                                         },
-
                                     });
                                 });
                             } :
                             undefined
                     }
-                    data-dash-is-loading={
-                        (loading_state && loading_state.is_loading) || undefined
-                    }>
+                    data-dash-is-loading={useLoading()}>
                     <Button icon={buttonIcon || <UploadOutlined />}
                         disabled={
                             context && !isUndefined(context.componentDisabled) ?

package/src/lib/index.js

@@ -112,9 +112,6 @@ import AntdTour from './components/other/AntdTour.react';
 import AntdWatermark from './components/other/AntdWatermark.react';
 import AntdConfigProvider from './components/other/AntdConfigProvider.react';
 import Fragment from './components/other/Fragment.react';
-// 复杂交互
-// import AntdDraggablePanel from './components/proEditor/AntdDraggablePanel.react';
-// import AntdEditorLayout from './components/proEditor/AntdEditorLayout.react';
 // 表单生成
 // import AntdFormRender from './components/formRender/AntdFormRender.react';
 // css样式
@@ -235,9 +232,6 @@ export {
     AntdWatermark,
     AntdConfigProvider,
     Fragment,
-    // 复杂交互
-    // AntdDraggablePanel,
-    // AntdEditorLayout,
     // 表单生成
     // AntdFormRender
 };

package/tests/dash3.0tests/AntdQRCode/347/273/204/344/273/266loading/347/212/266/346/200/201/351/207/215/346/236/204/test.py

@@ -0,0 +1,51 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import time
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from dash.dependencies import Input, Output, State
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    fac.AntdSpace(
+        [
+            fac.AntdQRCode(
+                id='auto-spin-qrcode-demo',
+                value='https://fac.feffery.tech/',
+                autoSpin=True,
+            ),
+            fac.AntdButton(
+                '重新生成',
+                id='auto-spin-qrcode-demo-button',
+                type='primary',
+            ),
+        ],
+        direction='vertical',
+        align='center',
+    )
+)
+
+
+@app.callback(
+    Output('auto-spin-qrcode-demo', 'value'),
+    Input('auto-spin-qrcode-demo-button', 'nClicks'),
+    State('auto-spin-qrcode-demo', 'value'),
+    prevent_initial_call=True,
+)
+def auto_spin_qrcode_demo_input_callback(nClicks, value):
+    if nClicks:
+        time.sleep(1)
+        if value == 'https://fac.feffery.tech/':
+            return 'https://ant.design/'
+        elif value == 'https://ant.design/':
+            return 'https://fac.feffery.tech/'
+
+    return dash.no_update
+
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dash3.0tests/AntdTable/345/207/275/346/225/260/345/274/217/346/224/271/351/200/240/test.py

@@ -0,0 +1,62 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import dash
+    from dash import html
+    from datetime import datetime
+    import feffery_antd_components as fac
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        fac.AntdTable(
+            columns=[
+                {
+                    'title': 'int型示例',
+                    'dataIndex': 'int型示例',
+                },
+                {
+                    'title': 'float型示例',
+                    'dataIndex': 'float型示例',
+                },
+                {
+                    'title': 'str型示例',
+                    'dataIndex': 'str型示例',
+                },
+                {
+                    'title': '日期时间示例',
+                    'dataIndex': '日期时间示例',
+                },
+            ],
+            data=[
+                {
+                    'int型示例': 123,
+                    'float型示例': 1.23,
+                    'str型示例': '示例字符',
+                    '日期时间示例': datetime.now(),
+                }
+            ]
+            * 20,
+        ),
+        fac.AntdTable(
+            columns=[
+                {
+                    'title': '搜索型筛选',
+                    'dataIndex': '搜索型筛选',
+                }
+            ],
+            data=[{'搜索型筛选': s} for s in list('abced')],
+            filterOptions={
+                '搜索型筛选': {'filterMode': 'keyword'}
+            },
+            style={'width': 200},
+        ),
+    ],
+    style=style(padding=50),
+)
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dash3.0tests/_dashprivate_layout/346/224/271/345/212/250/346/265/213/350/257/225/test.py

@@ -0,0 +1,50 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        html.Div(fac.__version__),
+        fac.AntdDescriptions(
+            [
+                fac.AntdDescriptionItem(
+                    '费弗里', label='姓名'
+                ),
+                fac.AntdDescriptionItem(
+                    html.A(
+                        'https://github.com/CNFeffery',
+                        href='https://github.com/CNFeffery',
+                    ),
+                    label='个人Github地址',
+                ),
+                fac.AntdDescriptionItem(
+                    html.A(
+                        'https://www.cnblogs.com/feffery/',
+                        href='https://www.cnblogs.com/feffery/',
+                    ),
+                    label='个人博客地址',
+                ),
+                fac.AntdDescriptionItem(
+                    html.A(
+                        'http://fac.feffery.tech/',
+                        href='http://fac.feffery.tech/',
+                    ),
+                    label='fac框架官网',
+                ),
+            ],
+            title='描述列表示例',
+            labelStyle={'fontWeight': 'bold'},
+        ),
+    ],
+    style=style(padding=50),
+)
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dash3.0tests/loading_state/346/224/271/345/212/250/346/265/213/350/257/225/test.py

@@ -0,0 +1,38 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import time
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from dash.dependencies import Input, Output
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        fac.AntdButton(
+            '测试',
+            id='button-demo',
+            type='primary',
+        )
+    ],
+    style=style(padding=50),
+)
+
+
+@app.callback(
+    Output('button-demo', 'children'),
+    Input('button-demo', 'nClicks'),
+    prevent_initial_call=True,
+)
+def demo_callback(nClicks):
+    time.sleep(3)
+
+    return f'nClicks: {nClicks}'
+
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dash3.0tests//345/207/275/346/225/260/345/274/217/347/273/204/344/273/266/351/273/230/350/256/244/345/200/274/351/207/215/346/236/204/test.py

@@ -0,0 +1,30 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        fac.AntdButton(
+            '测试',
+            id='button-demo',
+            type='primary',
+            **{'data-test': 'test'},
+        ),
+        fac.AntdTag(
+            content='测试',
+            href='/test',
+            **{'data-test': 'test'},
+        ),
+    ],
+    style=style(padding=50),
+)
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dash3.0tests//345/212/240/350/275/275/345/212/250/347/224/273/347/261/273/347/273/204/344/273/266/351/207/215/346/236/204/346/265/213/350/257/225/test.py

@@ -0,0 +1,62 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import time
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from dash.dependencies import Input, Output
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    html.Div(
+        [
+            '测试',
+            fac.AntdCustomSkeleton(
+                [
+                    html.Div(
+                        html.Div(
+                            fac.AntdButton(
+                                '测试',
+                                id='button-demo',
+                                type='primary',
+                            )
+                        )
+                    ),
+                    html.Div(id='inner-output-test'),
+                ],
+                skeletonContent='加载中...',
+            ),
+            html.Div(id='outer-output-test'),
+        ],
+        style=style(padding=50),
+    )
+)
+
+
+@app.callback(
+    [
+        Output('button-demo', 'children'),
+        Output('button-demo', 'type'),
+        Output('inner-output-test', 'children'),
+        Output('outer-output-test', 'children'),
+    ],
+    Input('button-demo', 'nClicks'),
+    prevent_initial_call=True,
+)
+def demo_callback(nClicks):
+    time.sleep(3)
+
+    return [
+        f'nClicks: {nClicks}',
+        dash.no_update,
+        f'inner: {nClicks}',
+        f'outer: {nClicks}',
+    ]
+
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dash3.0tests//347/273/204/344/273/266/345/261/236/346/200/247/345/237/272/347/241/200/346/214/201/344/271/205/345/214/226/351/207/215/346/236/204/346/265/213/350/257/225/test.py

@@ -0,0 +1,25 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        fac.AntdCollapse(
+            '测试内容',
+            id='persistence-test',
+            title='测试',
+            persistence=True,
+        )
+    ],
+    style=style(padding=50),
+)
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dataDisplay/AntdCard/refactor_delete_props.py

@@ -0,0 +1,83 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        fac.AntdSpace(
+            [
+                fac.AntdDivider(
+                    'AntdCardGrid基础使用',
+                    innerTextOrientation='left',
+                ),
+                fac.AntdCard(
+                    [
+                        fac.AntdCardGrid(f'内容{i}')
+                        for i in range(1, 16)
+                    ],
+                    title='AntdCardGrid基础使用',
+                ),
+                fac.AntdDivider(
+                    '调整浏览器窗口尺寸以观察换行效果',
+                    innerTextOrientation='left',
+                ),
+                fac.AntdCard(
+                    [
+                        fac.AntdCardGrid(
+                            f'内容{i}', style={'width': 95}
+                        )
+                        for i in range(1, 16)
+                    ],
+                    title='固定AntdCardGrid宽度以支持自动换行',
+                ),
+                fac.AntdDivider(
+                    '紧凑的网格内容区',
+                    innerTextOrientation='left',
+                ),
+                fac.AntdCard(
+                    [
+                        fac.AntdCardGrid(f'内容{i}')
+                        for i in range(1, 16)
+                    ],
+                    title='调整各类样式以实现紧凑的网格内容区',
+                    variant='borderless',
+                    style={'borderRadius': '8px 8px 0 0'},
+                    styles={
+                        'header': {
+                            'border': '1px solid #f0f0f0'
+                        },
+                        'body': {
+                            'padding': '0px 1px 0px 0px',
+                            'border': 0,
+                        },
+                    },
+                ),
+                fac.AntdDivider(
+                    '关闭悬停阴影效果',
+                    innerTextOrientation='left',
+                ),
+                fac.AntdCard(
+                    [
+                        fac.AntdCardGrid(
+                            f'内容{i}', hoverable=False
+                        )
+                        for i in range(1, 16)
+                    ],
+                    title='关闭悬停阴影效果',
+                ),
+            ],
+            direction='vertical',
+        )
+    ],
+    style=style(padding=50),
+)
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dataDisplay/AntdCarousel/feat_auto_play_dot_duration.py

@@ -0,0 +1,34 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import dash
+    from dash import html
+    import feffery_antd_components as fac
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = html.Div(
+    [
+        fac.AntdCarousel(
+            [
+                fac.AntdCenter(
+                    i,
+                    style={
+                        'color': 'white',
+                        'fontSize': 36,
+                        'height': 160,
+                        'backgroundColor': '#364d79',
+                    },
+                )
+                for i in range(1, 6)
+            ],
+            autoplay={'dotDuration': True},
+        )
+    ],
+    style=style(padding=50),
+)
+
+if __name__ == '__main__':
+    app.run(debug=True)

package/tests/dataDisplay/AntdCountdown/feat_finish_event.py

@@ -0,0 +1,41 @@
+if True:
+    import sys
+
+    sys.path.append('../../../')
+    import dash
+    import feffery_antd_components as fac
+    from datetime import datetime, timedelta
+    from dash.dependencies import Input, Output
+    from feffery_dash_utils.style_utils import style
+
+app = dash.Dash(__name__)
+
+app.layout = lambda: fac.AntdCenter(
+    [
+        fac.AntdCountdown(
+            id='countdown-demo',
+            value=(
+                datetime.now() + timedelta(seconds=6)
+            ).strftime('%Y-%m-%d %H:%M:%S:%f'),
+            format='HH:mm:ss:SSS',
+        ),
+        fac.Fragment(id='message'),
+    ],
+    style=style(padding=50),
+)
+
+
+@app.callback(
+    Output('message', 'children'),
+    Input('countdown-demo', 'finishEvent'),
+    prevent_initial_call=True,
+)
+def show_finish_event(finishEvent):
+    return fac.AntdNotification(
+        message='倒计时结束：'
+        + str(finishEvent['timestamp']),
+    )
+
+
+if __name__ == '__main__':
+    app.run(debug=True)