{% extends "base.html" %}

{% block title %}Add User{% endblock %}

{% block content %}

<div class="page-header">

    <div>

        <h1>
            Add User
        </h1>

        <p class="text-muted">
            Create a new system user
        </p>

    </div>

</div>


<div class="card">

    <div class="card-body">

        <form method="POST">

            <div class="row">

                <div class="col-md-6 mb-3">

                    <label class="form-label">
                        Full Name *
                    </label>

                    <input
                        type="text"
                        name="full_name"
                        class="form-control"
                        required>

                </div>


                <div class="col-md-6 mb-3">

                    <label class="form-label">
                        Username *
                    </label>

                    <input
                        type="text"
                        name="username"
                        class="form-control"
                        required>

                </div>


                <div class="col-md-6 mb-3">

                    <label class="form-label">
                        Email *
                    </label>

                    <input
                        type="email"
                        name="email"
                        class="form-control"
                        required>

                </div>


                <div class="col-md-6 mb-3">

                    <label class="form-label">
                        Password *
                    </label>

                    <input
                        type="password"
                        name="password"
                        class="form-control"
                        minlength="6"
                        required>

                </div>


                <div class="col-md-6 mb-4">

                    <label class="form-label">
                        Role
                    </label>

                    <select
                        name="role"
                        class="form-select">

                        <option value="User">
                            User
                        </option>

                        <option value="Administrator">
                            Administrator
                        </option>

                    </select>

                </div>

            </div>


            <div class="d-flex gap-2">

                <button
                    type="submit"
                    class="btn btn-primary">

                    Create User

                </button>

                <a
                    href="{{ url_for('users') }}"
                    class="btn btn-secondary">

                    Cancel

                </a>

            </div>

        </form>

    </div>

</div>

{% endblock %}