// @ts-nocheck
// Segmented这个对象在antd里的声明是错误的
import React from 'react';
import { Form, Input, Button } from 'antd';
import { LockOutlined, UserOutlined, } from '@ant-design/icons';
import Style from './web.module.less';
export default function Render(props) {
    const { data, methods } = props;
    const { loading, disabled, account, password, validMobile, validPassword, allowSubmit, accountPlaceholder } = data;
    const { loginByAccount, t, inputChange } = methods;
    return (<Form colon={true}>
            <Form.Item name="mobile">
                <Input allowClear value={account} size="large" 
    // maxLength={11}
    prefix={<UserOutlined />} placeholder={accountPlaceholder} onChange={(e) => {
            inputChange('account', e.target.value);
        }} className={Style['loginbox-input']}/>
            </Form.Item>
            <Form.Item name="password">
                <Input.Password allowClear size="large" value={password} prefix={<LockOutlined />} placeholder={t('placeholder.Password')} onChange={(e) => {
            inputChange('password', e.target.value);
        }} className={Style['loginbox-input']}/>
            </Form.Item>

            <Form.Item>
                <>
                    <Button block size="large" type="primary" disabled={!!disabled || !allowSubmit || loading} loading={loading} onClick={() => loginByAccount()}>
                        {t('Login')}
                    </Button>
                </>
            </Form.Item>
        </Form>);
}