{
    "title": "表单各种展示模式汇总",
    "remark": "展示各种模式的 Form",
    "body": [
        {
            "type": "grid",
            "columns": [
                {
                    "type": "form",
                    "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
                    "title": "常规模式",
                    "mode": "normal",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email",
                            "required": true,
                            "placeholder": "请输入邮箱",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password",
                            "label": "密码",
                            "required": true,
                            "placeholder": "请输入密码",
                            "size": "full"
                        },
                        {
                            "type": "checkbox",
                            "name": "rememberMe",
                            "label": "记住登录"
                        },
                        {
                            "type": "submit",
                            "label": "登录"
                        }
                    ]
                },
                {
                    "type": "form",
                    "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
                    "title": "常规模式 input md 尺寸",
                    "mode": "normal",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email",
                            "required": true,
                            "placeholder": "请输入邮箱",
                            "label": "邮箱",
                            "size": "md",
                            "remark": "xxxx",
                            "hint": "bla bla bla"
                        },
                        {
                            "type": "input-password",
                            "name": "password",
                            "label": "密码",
                            "required": true,
                            "placeholder": "请输入密码",
                            "size": "md"
                        },
                        {
                            "type": "checkbox",
                            "name": "rememberMe",
                            "label": "记住登录"
                        },
                        {
                            "type": "submit",
                            "label": "登录"
                        }
                    ]
                }
            ]
        },
        {
            "type": "grid",
            "columns": [
                {
                    "type": "form",
                    "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
                    "title": "水平模式，左右摆放 左右比率分配 ",
                    "mode": "horizontal",
                    "autoFocus": false,
                    "horizontal": {
                        "left": "col-sm-2",
                        "right": "col-sm-10",
                        "offset": "col-sm-offset-2"
                    },
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "required": true,
                            "desc": "表单描述文字"
                        },
                        {
                            "type": "input-password",
                            "name": "password",
                            "label": "密码",
                            "placeholder": "输入密码"
                        },
                        {
                            "type": "checkbox",
                            "name": "rememberMe",
                            "label": "记住登录"
                        },
                        {
                            "type": "control",
                            "body": {
                                "type": "submit",
                                "label": "Submit"
                            }
                        }
                    ]
                },
                {
                    "type": "form",
                    "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
                    "title": "水平模式，左右摆放 左侧固定宽度 input md 尺寸",
                    "mode": "horizontal",
                    "autoFocus": false,
                    "horizontal": {
                        "leftFixed": "xs"
                    },
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "required": true,
                            "desc": "表单描述文字",
                            "size": "md",
                            "remark": "xxxx",
                            "hint": "bla bla bla"
                        },
                        {
                            "type": "input-password",
                            "name": "password",
                            "label": "密码",
                            "placeholder": "输入密码",
                            "size": "md"
                        },
                        {
                            "type": "checkbox",
                            "name": "rememberMe",
                            "label": "记住登录"
                        },
                        {
                            "type": "control",
                            "body": {
                                "type": "submit",
                                "label": "Submit"
                            }
                        }
                    ]
                }
            ]
        },
        {
            "type": "form",
            "className": "m-b",
            "body": [
                {
                    "type": "property",
                    "title": "机器配置",
                    "items": [
                        {
                            "label": "cpu",
                            "content": {
                                "type": "select",
                                "name": "cpu",
                                "value": "1",
                                "options": [
                                    {
                                        "label": "1 core",
                                        "value": "1"
                                    },
                                    {
                                        "label": "4 core",
                                        "value": "4"
                                    },
                                    {
                                        "label": "8 core",
                                        "value": "8"
                                    }
                                ]
                            }
                        },
                        {
                            "label": "memory",
                            "content": "4G"
                        },
                        {
                            "label": "disk",
                            "content": "80G"
                        },
                        {
                            "label": "network",
                            "content": "4M",
                            "span": 2
                        },
                        {
                            "label": "IDC",
                            "content": "beijing"
                        },
                        {
                            "label": "Note",
                            "content": {
                                "type": "textarea",
                                "required": true,
                                "name": "note",
                                "placeholder": "Enter..."
                            },
                            "span": 3
                        }
                    ]
                }
            ],
            "actions": [
                {
                    "type": "submit",
                    "label": "Submit"
                }
            ]
        },
        {
            "type": "form",
            "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
            "title": "内联模式",
            "mode": "inline",
            "autoFocus": false,
            "body": [
                {
                    "type": "input-email",
                    "name": "email",
                    "placeholder": "Enter Email",
                    "label": "邮箱"
                },
                {
                    "type": "input-password",
                    "name": "password",
                    "placeholder": "密码",
                    "remark": "Bla bla bla"
                },
                {
                    "type": "checkbox",
                    "name": "rememberMe",
                    "label": "记住登录"
                },
                {
                    "type": "submit",
                    "label": "登录"
                },
                {
                    "type": "button",
                    "label": "导出",
                    "url": "http://www.baidu.com/",
                    "level": "success"
                }
            ]
        },
        {
            "type": "form",
            "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
            "title": "常规模式下用数组包起来还能控制一行显示多个",
            "mode": "normal",
            "autoFocus": false,
            "body": [
                {
                    "type": "input-text",
                    "name": "name",
                    "placeholder": "请输入...",
                    "label": "名字",
                    "size": "full"
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email",
                            "placeholder": "输入邮箱",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email2",
                            "mode": "inline",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password2",
                            "label": "密码",
                            "mode": "inline",
                            "placeholder": "请输入密码",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email3",
                            "mode": "inline",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "size": "full",
                            "columnClassName": "v-bottom"
                        },
                        {
                            "type": "input-password",
                            "name": "password3",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email4",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password4",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "mode": "inline",
                            "size": "full",
                            "columnClassName": "v-bottom"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "checkbox",
                    "name": "rememberMe",
                    "label": "记住我"
                },
                {
                    "type": "submit",
                    "label": "提交"
                }
            ]
        },
        {
            "type": "form",
            "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
            "title": "水平模式用数组包起来也能控制一行显示多个",
            "mode": "horizontal",
            "autoFocus": false,
            "body": [
                {
                    "type": "input-email",
                    "name": "email",
                    "placeholder": "请输入邮箱地址",
                    "label": "邮箱",
                    "size": "full"
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email2",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password2",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email3",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password3",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password3",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email4",
                            "placeholder": "请输入邮箱地址",
                            "label": "邮箱",
                            "size": "full",
                            "columnClassName": "col-sm-6",
                            "horizontal": {
                                "left": "col-sm-4",
                                "right": "col-sm-8"
                            }
                        },
                        {
                            "type": "input-password",
                            "name": "password4",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "mode": "inline",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "label": "邮箱",
                    "gap": "xs",
                    "body": [
                        {
                            "label": false,
                            "type": "input-email",
                            "name": "email5",
                            "placeholder": "请输入邮箱地址",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password5",
                            "label": "密码",
                            "placeholder": "请输入密码",
                            "mode": "inline",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "label": "邮箱",
                    "description": "bla bla",
                    "gap": "xs",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email6",
                            "placeholder": "请输入邮箱地址",
                            "mode": "inline"
                        },
                        {
                            "type": "input-password",
                            "name": "password6",
                            "placeholder": "请输入密码",
                            "labelClassName": "w-auto p-r-none",
                            "mode": "inline"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "label": "邮箱",
                    "description": "bla bla",
                    "direction": "vertical",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email9",
                            "mode": "normal",
                            "placeholder": "请输入邮箱地址",
                            "inline": true,
                            "description": "Bla blamfejkf fdjk"
                        },
                        {
                            "type": "input-password",
                            "name": "password9",
                            "mode": "normal",
                            "placeholder": "请输入密码",
                            "labelClassName": "w-auto p-r-none"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "checkbox",
                    "name": "rememberMe",
                    "label": "记住我"
                },
                {
                    "type": "submit",
                    "label": "Submit"
                }
            ]
        },
        {
            "type": "form",
            "api": "/amis/api/mock2/form/saveForm?waitSeconds=2",
            "title": "Inline form  用数组包起来还能控制一行显示多个",
            "mode": "inline",
            "submitText": null,
            "autoFocus": false,
            "body": [
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email",
                            "placeholder": "Enter Email",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "input-password",
                            "name": "password",
                            "placeholder": "Password",
                            "size": "full"
                        }
                    ]
                },
                {
                    "type": "divider"
                },
                {
                    "type": "group",
                    "body": [
                        {
                            "type": "input-email",
                            "name": "email",
                            "placeholder": "Enter Email",
                            "label": "邮箱",
                            "size": "full"
                        },
                        {
                            "type": "checkbox",
                            "name": "rememberMe",
                            "label": "记住我",
                            "size": "full"
                        },
                        {
                            "type": "button-toolbar",
                            "buttons": [
                                {
                                    "type": "submit",
                                    "label": "登录"
                                },
                                {
                                    "type": "button",
                                    "label": "导出",
                                    "url": "http://www.baidu.com/",
                                    "level": "success"
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ]
}