@para-ui/core 2.1.35 → 2.1.36

package/docs/view/form/api.tsx

@@ -1,266 +0,0 @@
-/**
- * @author linhd
- * @date 2022/2/14 2:04 PM
- * @description api
- */
-import {RowsData} from '../../components/apiTable';
-
-const apiData: RowsData = [
-    {
-        name: 'className',
-        desc: 'class样式名',
-        type: 'string'
-    },
-    {
-        name: 'form',
-        desc: '表单对象存储关键数据和校验方法',
-        type: 'React.MutableRefObject<RefObject>'
-    },
-    {
-        name: 'FormProps',
-        desc: '表单的默认属性',
-        type: 'FormHtmlProps'
-    },
-    {
-        name: 'type',
-        desc: '表单的主要类型 vertical 为竖布局，horizontal为横布局，默认为 horizontal.会被 configList的配置覆盖',
-        type: '\'vertical\' | \'horizontal\''
-    },
-    {
-        name: 'getCheckForm',
-        desc: '获取表单的校验方法，会传出表单的校验方法',
-        type: '(checkFrom: Function) => {}'
-    },
-    {
-        name: 'onChange',
-        desc: '输入框内容改变穿出',
-        type: '(name: string, value: any) => void'
-    },
-    {
-        name: 'getForcedRefresh',
-        desc: '强制刷新配置',
-        type: '(setConfigHook: (configList: Array<FormItemProps>, bData?: { [name: string]: any }) => void) => void'
-    },
-    {
-        name: 'configList',
-        desc: '表单项的配置',
-        type: 'Array<FormItemProps>'
-    },
-    {
-        name: 'backData',
-        desc: '回填数据',
-        type: ' { [name: string]: any }'
-    },
-    {
-        name: 'disabled',
-        desc: '是否禁用',
-        type: 'boolean'
-    },
-    {
-        name: 'disOnlySpace',
-        desc: '是否启用必填框，不允许输入纯空格',
-        type: 'boolean'
-    },
-    {
-        name: 'requiredElement',
-        desc: '必填显示渲染方式',
-        type: 'ReactElement | string'
-    },
-    {
-        name: 'disRequiredElement',
-        desc: '隐藏默认必填标记',
-        type: 'boolean'
-    }
-];
-
-export const apiDataRefObject: RowsData = [
-    {
-        name: 'check',
-        desc: '校验表单方法，校验成功返回表单的键值对',
-        type: 'Function'
-    },
-    {
-        name: 'items',
-        desc: '存储所有表单item最后的配置，方便提交时做总的校验',
-        type: '{ [name: string]: ItemTypeProps }'
-    },
-    {
-        name: 'values',
-        desc: '所有值',
-        type: '{ [name: string]: any }'
-    },
-    {
-        name: 'refreshForm',
-        desc: '强制刷新表单状态方法',
-        type: '(list: Array<FormItemProps> | \'\', bData?: { [name: string]: any }) => void'
-    },
-    {
-        name: 'refData',
-        desc: '对象数据集合',
-        type: 'RefDataProps'
-    },
-];
-
-export const apiDataRefDataProps: RowsData = [
-    {
-        name: 'allItems',
-        desc: '存储所有表单item最后的配置，方便提交时做总的校验',
-        type: '{ [name: string]: ItemTypeProps }'
-    },
-    {
-        name: 'itemsCheckStatus',
-        desc: '存储所有表单item校验的状态,用于动态更新后仍然能保持住报错信息',
-        type: '{ [name: string]: boolean | null }'
-    },
-    {
-        name: 'itemsCheckMessage',
-        desc: '存储所有表单item校验的报错信息',
-        type: '{ [name: string]: string }'
-    },
-    {
-        name: 'allValues',
-        desc: '表单保存的值集合',
-        type: '{ [name: string]: any }'
-    },
-    {
-        name: 'configList',
-        desc: '最新配置信息',
-        type: 'Array<FormItemProps>'
-    },
-]
-
-export const apiDataFormItemProps: RowsData = [
-    {
-        name: 'className',
-        desc: 'class样式名',
-        type: 'string'
-    },
-    {
-        name: 'type',
-        desc: '表单项形态，默认 horizontal',
-        type: '\'vertical\' | \'horizontal\'',
-        default: 'horizontal'
-    },
-    {
-        name: 'InputType',
-        desc: '输入框类型',
-        type: '\'checkGroup\' | \'select\' | \'radioGroup\' | \'textarea\' | \'default\' | \'switch\' | \'number\' | \'file\' | FC<ItemTypeProps>'
-    },
-    {
-        name: 'inputProps',
-        desc: '输入框其他属性配置',
-        type: 'inputProps',
-    },
-    {
-        name: 'labelWidth',
-        desc: '文字宽度， 只对 type === vertical，状态下生效',
-        type: 'number',
-    },
-    {
-        name: 'disabled',
-        desc: '是否禁用',
-        type: 'boolean',
-    },
-    {
-        name: 'change',
-        desc: '值改变传出',
-        type: '(value: any) => void',
-    },
-    {
-        name: 'hide',
-        desc: '不显示 该选项',
-        type: 'boolean',
-    },
-    {
-        name: 'tips',
-        desc: '提示。会有label上出现个图标提示',
-        type: 'string',
-    },
-    {
-        name: 'label',
-        desc: 'string | ((props: FormItemProps) => ReactNode)',
-        type: '文字描述',
-    },
-    {
-        name: 'hideLabel',
-        desc: '隐藏 label',
-        type: 'boolean',
-    },
-    {
-        name: 'hideError',
-        desc: '隐藏 error',
-        type: 'boolean',
-    },
-    {
-        name: 'name',
-        desc: 'name，一般对应后台属性，需要唯一性',
-        type: 'string',
-    },
-    {
-        name: 'rules',
-        desc: '校验规则',
-        type: 'ruleType',
-    },
-    {
-        name: 'setValue',
-        desc: '设置值的方法',
-        type: 'Function',
-    },
-    {
-        name: 'errorMessage',
-        desc: '报错信息',
-        type: 'string',
-    },
-    {
-        name: 'backData',
-        desc: '回填数据',
-        type: '{ [name: string]: any }',
-    },
-    {
-        name: 'disOnlySpace',
-        desc: '是否启用必填框，不允许输入纯空格',
-        type: 'boolean',
-    },
-    {
-        name: 'requiredElement',
-        desc: '必填显示渲染方式',
-        type: 'ReactElement | string',
-    },
-    {
-        name: 'disRequiredElement',
-        desc: '隐藏默认必填标记',
-        type: 'boolean',
-    }
-]
-
-export const apiDataFormItemTypeProps: RowsData = [
-    {
-        name: 'ItemType',
-        desc: '输入框类型',
-        type: '\'checkGroup\' | \'select\' | \'radioGroup\' | \'textarea\' | \'default\' | \'switch\' | \'file\' | \'number\' | FC<ItemTypeProps>'
-    },
-    {
-        name: 'error',
-        desc: '状态',
-        type: 'boolean'
-    },
-    {
-        name: 'setError',
-        desc: '设置错误提示',
-        type: 'Function'
-    },
-    {
-        name: 'placeholder',
-        desc: '输入框提示',
-        type: 'string'
-    },
-    {
-        name: 'inputProps',
-        desc: '输入框其他配置',
-        type: '{\n' +
-            '        [name: string]: any\n' +
-            '    }'
-    }
-]
-
-export default apiData;

package/docs/view/form/codeString.tsx

@@ -1,203 +0,0 @@
-/**
- * @author linhd
- * @date 2022/2/14 2:04 PM
- * @description 源码字符串
- */
-export const basicForm = `
-import Form, {configListProps} from '@para-ui/core/Form';
-import Button from '@para-ui/core/Button';
-import TextField from '@para-ui/core/Form';
-
-const configList: configListProps = [
-    {
-        label: '普通输入框',
-        name: 'name',
-        rules: {
-            validate: {
-                required: true,
-                maxlength: 3,
-                minLength: 2,
-                /**
-                 * 正则
-                 */
-                pattern: /123/,
-            },
-            message: {
-                required: '这是必填的'
-            }
-        },
-    },
-    {
-        label: '单选组',
-        name: 'type',
-        InputType: 'radioGroup',
-        list: [
-            {
-                label: 'radio1',
-                name: 'r1'
-            },
-            {
-                label: 'radio2',
-                name: 'r2'
-            },
-        ],
-        rules: {
-            validate: {
-                required: true
-            },
-            message: {
-                required: '必选'
-            }
-        },
-    },
-    {
-        label: '复选组',
-        name: 'type2',
-        InputType: 'checkGroup',
-        list: [
-            {
-                label: 'checkGroup1',
-                name: 't1'
-            },
-            {
-                label: 'checkGroup2',
-                name: 't2'
-            },
-        ],
-    },
-    {
-        label: '下拉',
-        name: 'dir',
-        tips: '这个是提示',
-        InputType: 'select',
-        list: [
-            {
-                label: '选项1',
-                value: 'sel1'
-            },
-            {
-                label: '选项2',
-                value: 'sel2'
-            },
-            {
-                label: '选项3',
-                value: 'sel3'
-            }
-        ],
-    },
-    {
-        label: 'switch开关',
-        name: 'switch1',
-        InputType: 'switch',
-    },
-    {
-        label: '文件类型',
-        name: 'projectFile',
-        InputType: 'file',
-        buttonLabel: '选择文件1',
-        rules: {
-            validate: {
-                required: true
-            }
-        }
-    },
-    {
-        label: '点我（动态变动选项）',
-        name: 'switch2',
-        InputType: 'switch',
-    },
-    {
-        label: '普通输入框(动态加的)',
-        name: 'name3',
-        hide: true,
-        rules: {
-            validate: {
-                required: true,
-
-            },
-            message: {
-                required: '这是必填的'
-            }
-        },
-    },
-    {
-        label: '文本域',
-        name: 'desc',
-        InputType: 'textarea',
-        rules: {
-            validate: {
-                diy1: (item, val) => {
-                    console.log(123);
-                    return val !== '123' || '值不能为123';
-                },
-                diy2: (item, val) => {
-                    return val !== '123456';
-                }
-            },
-            message: {
-                diy2: '值不能为123456'
-            }
-        }
-    },
-    {
-        label: '自定义类型',
-        name: 'diy',
-        InputType: (props) => {
-            const {setValue, setError} = props
-            const [error, setTError] = React.useState<boolean>(false);
-            return (
-                <TextField
-                    error={error}
-                    onChange={(e: any) => {
-                        const val = e.target.value
-                        setValue && setValue('diy', 'value', val);
-                        if (val === '123') {
-                            setValue && setValue('diy', 'status', false);
-                            setError && setError('diy报错123');
-                            setTError(true);
-                        } else {
-                            setValue && setValue('diy', 'status', val);
-                            setError && setError(!val && '不能为空');
-                            setTError(!val);
-                        }
-                    }}
-                />
-            )
-        }
-    }
-]
-
-const [list, setConfigList] = React.useState([...configList]);
-/**
- * 表单对象
- */
-const formCom = React.useRef<{ [name: string]: any }>({});
-/**
- * 校验表单
- */
-const submitFuc = () => {
-    const formData = formCom.current.check();
-    console.log(formData, formCom);
-}
-
-<div className="para-form-demo-context">
-    <Form
-        type="horizontal"
-        form={formCom}
-        configList={list}
-        onChange={(name, val) => {
-            if (name === 'switch2') {
-                const tArr = [...configList];
-                tArr[7].hide = !val;
-                setConfigList([...tArr]);
-            }
-        }}
-    />
-    <Button
-        variant="outlined"
-        onClick={submitFuc}
-    >
-        校验表单
-    </Button>
-</div>
-`;

package/docs/view/form/index.tsx

@@ -1,225 +0,0 @@
-import React, { FunctionComponent } from 'react';
-import CodeBox from '../../components/codeBox';
-import Form, { configListProps } from 'src/Form';
-import Button from 'src/Button';
-import TextField from 'src/TextField';
-import APITable from '../../components/apiTable';
-import Title from '../../components/title';
-import { basicForm } from './codeString';
-import apiData, { apiDataRefObject, apiDataRefDataProps, apiDataFormItemProps, apiDataFormItemTypeProps } from './api';
-
-import './index.scss';
-
-const configList: configListProps = [
-    {
-        label: '普通输入框',
-        name: 'name',
-        rules: {
-            validate: {
-                required: true,
-                maxlength: 3,
-                minLength: 2,
-                /**
-                 * 正则
-                 */
-                pattern: /123/,
-            },
-            message: {
-                required: '这是必填的'
-            }
-        },
-    },
-    {
-        label: '单选组',
-        name: 'type',
-        InputType: 'radioGroup',
-        defaultValue: 'r1',
-        list: [
-            {
-                label: 'radio1',
-                name: 'r1'
-            },
-            {
-                label: 'radio2',
-                name: 'r2'
-            },
-        ],
-        rules: {
-            validate: {
-                required: true
-            },
-            message: {
-                required: '必选'
-            }
-        },
-    },
-    {
-        label: '复选组',
-        name: 'type2',
-        InputType: 'checkGroup',
-        list: [
-            {
-                label: 'checkGroup1',
-                name: 't1'
-            },
-            {
-                label: 'checkGroup2',
-                name: 't2'
-            },
-        ],
-    },
-    {
-        label: '下拉',
-        name: 'dir',
-        tips: '这个是提示',
-        InputType: 'select',
-        list: [
-            {
-                label: '选项1',
-                value: 'sel1'
-            },
-            {
-                label: '选项2',
-                value: 'sel2'
-            },
-            {
-                label: '选项3',
-                value: 'sel3'
-            }
-        ],
-    },
-    {
-        label: 'switch开关',
-        name: 'switch1',
-        InputType: 'switch',
-    },
-    {
-        label: '文件类型',
-        name: 'projectFile',
-        InputType: 'file',
-        buttonLabel: '选择文件1',
-        rules: {
-            validate: {
-                required: true
-            }
-        }
-    },
-    {
-        label: '点我（动态变动选项）',
-        name: 'switch2',
-        InputType: 'switch',
-    },
-    {
-        label: '普通输入框(动态加的)',
-        name: 'name3',
-        hide: true,
-        rules: {
-            validate: {
-                required: true,
-
-            },
-            message: {
-                required: '这是必填的'
-            }
-        },
-    },
-    {
-        label: '文本域',
-        name: 'desc',
-        InputType: 'textarea',
-        defaultValue: 'defaultValue',
-        rules: {
-            validate: {
-                diy1: (item, val) => {
-                    console.log(123);
-                    return val !== '123' || '值不能为123';
-                },
-                diy2: (item, val) => {
-                    return val !== '123456';
-                }
-            },
-            message: {
-                diy2: '值不能为123456'
-            }
-        }
-    },
-    {
-        label: '自定义类型',
-        name: 'diy',
-        InputType: (props) => {
-            const { setValue, setError } = props
-            const [error, setTError] = React.useState<boolean>(false);
-            return (
-                <TextField
-                    error={error}
-                    onChange={(e: any) => {
-                        const val = e.target.value
-                        setValue && setValue('diy', 'value', val);
-                        if (val === '123') {
-                            setValue && setValue('diy', 'status', false);
-                            setError && setError('diy报错123');
-                            setTError(true);
-                        } else {
-                            setValue && setValue('diy', 'status', val);
-                            setError && setError(!val && '不能为空');
-                            setTError(!val);
-                        }
-                    }}
-                />
-            )
-        }
-    }
-]
-
-const ParaForm: FunctionComponent = () => {
-    const [list, setConfigList] = React.useState([...configList]);
-    /**
-     * 表单对象
-     */
-    const formCom = React.useRef<{ [name: string]: any }>({});
-    /**
-     * 校验表单
-     */
-    const submitFuc = () => {
-        const formData = formCom.current.check();
-        console.log(formData, formCom);
-    }
-    return (
-        <div className={'paraui-form-demo'}>
-            <Title name={'表单'}>代码演示</Title>
-            <CodeBox
-                code={basicForm}
-                title={'基本'}
-                description={'表单。'}
-            >
-                <div className="para-form-demo-context">
-                    <Form
-                        type="horizontal"
-                        form={formCom}
-                        configList={list}
-                        onChange={(name, val) => {
-                            if (name === 'switch2') {
-                                const tArr = [...configList];
-                                tArr[7].hide = !val;
-                                setConfigList([...tArr]);
-                            }
-                        }}
-                    />
-                    <Button
-                        variant="outlined"
-                        onClick={submitFuc}
-                    >
-                        校验表单
-                    </Button>
-                </div>
-            </CodeBox>
-            <APITable data={apiData} subTitle={'FormProps'} showApi={false} />
-            <APITable data={apiDataRefObject} subTitle={'RefObject'} showApi={false} />
-            <APITable data={apiDataRefDataProps} subTitle={'RefDataProps'} showApi={false} />
-            <APITable data={apiDataFormItemProps} subTitle={'FormItemProps'} showApi={false} />
-            <APITable data={apiDataFormItemTypeProps} subTitle={'FormItemTypeProps 继承 FormItemProps'} showApi={false} />
-        </div>
-    );
-};
-
-export default ParaForm;