<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>{{ .Static.WebsiteTitle }} - Users</title>
    <meta name="description" content="{{ .Static.WebsiteTitle }}">
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/fonts/fontawesome-all.min.css">
    <link rel="stylesheet" href="/css/custom.css">
</head>

<body id="page-top" class="d-flex flex-column min-vh-100">
    {{template "prt_nav.html" .}}
    <div class="container mt-5">
        {{if eq .User.CreatedAt .Epoch}}
        <h1>Create a new user</h1>
        {{else}}
        <h1>Edit user <strong>{{.User.Email}}</strong></h1>
        {{end}}

        {{template "prt_flashes.html" .}}

        <form method="post" enctype="multipart/form-data">
            <input type="hidden" name="_csrf" value="{{.Csrf}}">
            {{if eq .User.CreatedAt .Epoch}}
            <div class="form-row">
                <div class="form-group required col-md-12">
                    <label for="inputEmail">Email</label>
                    <input type="text" name="email" class="form-control" id="inputEmail" value="{{.User.Email}}" required>
                </div>
            </div>
            {{else}}
            <input type="hidden" name="email" value="{{.User.Email}}">
            {{end}}
            <div class="form-row">
                <div class="form-group required col-md-12">
                    <label for="inputFirstname">Firstname</label>
                    <input type="text" name="firstname" class="form-control" id="inputFirstname" value="{{.User.Firstname}}" required>
                </div>
            </div>
            <div class="form-row">
                <div class="form-group required col-md-12">
                    <label for="inputLastname">Lastname</label>
                    <input type="text" name="lastname" class="form-control" id="inputLastname" value="{{.User.Lastname}}" required>
                </div>
            </div>
            <div class="form-row">
                <div class="form-group col-md-12">
                    <label for="inputPhone">Phone</label>
                    <input type="text" name="phone" class="form-control" id="inputPhone" value="{{.User.Phone}}">
                </div>
            </div>
            <div class="form-row">
                <div class="form-group col-md-12 {{if eq .User.CreatedAt .Epoch}}required{{end}}">
                    <label for="inputPassword">Password</label>
                    <input type="password" name="password" class="form-control" id="inputPassword" {{if eq .User.CreatedAt .Epoch}}required{{end}}>
                </div>
            </div>
            <div class="form-row">
                <div class="form-group col-md-12">
                    <div class="custom-control custom-switch">
                        <input class="custom-control-input" name="isadmin" type="checkbox" value="true" id="inputAdmin" {{if .User.IsAdmin}}checked{{end}}>
                        <label class="custom-control-label" for="inputAdmin">
                            Administrator
                        </label>
                    </div>
                    <div class="custom-control custom-switch">
                        <input class="custom-control-input" name="isdisabled" type="checkbox" value="true" id="inputDisabled" {{if .User.DeletedAt.Valid}}checked{{end}}>
                        <label class="custom-control-label" for="inputDisabled">
                            Disabled
                        </label>
                    </div>
                </div>
            </div>

            <button type="submit" class="btn btn-primary">Save</button>
            <a href="/admin/users/" class="btn btn-secondary">Cancel</a>
        </form>
    </div>
    {{template "prt_footer.html" .}}
    <script src="/js/jquery.min.js"></script>
    <script src="/js/jquery.easing.js"></script>
    <script src="/js/popper.min.js"></script>
    <script src="/js/bootstrap.bundle.min.js"></script>
    <script src="/js/bootstrap-confirmation.min.js"></script>
    <script src="/js/custom.js"></script>
</body>

</html>