@page "/"
@layout Layouts.LoginLayout

<div class="login-NavLogin">
    <div style="padding:30px">
        <Card Bordered="true" Title=@("用户登录") Style="width:400px" Hoverable="true">
            <Body>
                <Form Model="@model" OnFinish="OnLogin">
                    <FormItem>
                        <Space Direction="DirectionVHType.Vertical" Style="width:100%">
                            <SpaceItem>
                                <AntDesign.Input Placeholder="请输入用户名" Size="@InputSize.Large" @bind-Value="context.Name">
                                    <Prefix><Icon Type="user"></Icon></Prefix>
                                </AntDesign.Input>
                                <br />
                            </SpaceItem>
                            <SpaceItem>
                                <AntDesign.Input Placeholder="请输入密码" Size="@InputSize.Large" @bind-Value="context.Password" type="password">
                                    <Prefix><Icon Type="lock"></Icon></Prefix>
                                </AntDesign.Input>
                            </SpaceItem>
                        </Space>
                    </FormItem>
                    <Space Direction="DirectionVHType.Vertical" Style="width:100%">
                        <SpaceItem>
                            <Spin Spinning="isLoading">
                                <Button Type="primary" HtmlType="submit" Class="submit" Size="large" Block>登&nbsp;录</Button>
                            </Spin>
                        </SpaceItem>
                        <SpaceItem>
                            <div class="other">
                                <Button Type="@ButtonType.Link" @onclick="ResetPassword">我忘记密码，需要重置！</Button>
                                
                            </div>
                        </SpaceItem>
                    </Space>
                </Form>
            </Body>
        </Card>
    </div>
</div>

<Modal Title="密码重置"
       Visible="@ShowResetPassword"
       OnOk="@HandleOk"
       OnCancel="@HandleCancel"
       OkText="@("重置")"
       CancelText="@("取消")">
    <Form Model="EditingStaff" LabelColSpan="6"
          WrapperColSpan="16">
        <FormItem Label="账号">
            <Input @bind-Value="@context.Account" />
        </FormItem>

        <FormItem Label="邮箱">
            <Input @bind-Value="@context.Mail"/>
        </FormItem>
    </Form>
</Modal>

    <style>
        .login-NavLogin {
            position: absolute;
            left: 50%;
            top: 40%;
            transform: translate(-50%, -50%);
        }

        body {
            background-image: url(images/bg1.jpg);
            background-attachment: fixed;
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;
        }
    </style>


