{% extends "base.html" %}
{% import 'bootstrap/wtf.html' as wtf %}

{% block app_content %}

<div class="container ">
    <div class="row justify-content-center">
        <h1>Admin Management Page</h1>
    </div>

    <div class="row justify-content-center pt-5">
        <h2>Professors</h2>
        <table class="table table-dark table-bordered mt-3">
            <thead>
                <tr>
                    <th scope="col">Name</th>
                    <th scope="col">Email</th>
                    <th scope="col">Actions</th>
                </tr>
            </thead>
            <tbody>
                {% for student in students%}
                <tr>
                    <td>{{student.name}}</td>
                    <td>{{student.email}}</td>
                    <td>
                        <div class="btn-group w-100" role="group" aria-label="Basic example">
                            <button type="button" class="btn  btn-warning">Edit</button>
                            <button type="button" class="btn btn-danger">Remove</button>
                        </div>
                    </td>
                </tr>
                {%endfor%}
            </tbody>
        </table>
    </div>

    <div class="row justify-content-center pt-5">
        <h2>Professors</h2>
        <button type="button" class="btn btn-primary btn-lg btn-block" data-toggle="modal" data-target="#myModal"
            data-target="#exampleModal">Add Professor</button>
        <table class="table table-dark table-bordered mt-3">
            <thead>
                <tr>
                    <th scope="col">Name</th>
                    <th scope="col">Email</th>
                    <th scope="col">Actions</th>
                </tr>
            </thead>
            <tbody>
                {% for professor in professors%}
                <tr>
                    <td>{{professor.name}}</td>
                    <td>{{professor.email}}</td>
                    <td>
                        <div class="btn-group w-100" role="group" aria-label="Basic example">
                            <button type="button" class="btn  btn-warning">Edit</button>
                            <button type="button" class="btn btn-danger">Remove</button>
                        </div>
                    </td>
                </tr>
                {%endfor%}
            </tbody>
        </table>
    </div>

    <div class="modal" id="myModal">
        <div class="modal-dialog">
            <div class="modal-content">

                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Create Professor</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <!-- Modal body -->
                <div class="modal-body">
                    <form action="/create_professor" method="post">
                        <div class="form-group">
                            <label for="exampleInputEmail1">Email address</label>
                            <input type="email" name="email" class="form-control" id="exampleInputEmail1"
                                aria-describedby="emailHelp" placeholder="Enter email">
                        </div>
                        <div class="form-group">
                            <label for="inputName1">Name</label>
                            <input type="text" name="name" class="form-control" id="inputName1" placeholder="Jon Snow">
                        </div>
                        <button type="submit" class="btn btn-primary">Submit</button>
                    </form>
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
                </div>

            </div>
        </div>
    </div>


</div>




{% endblock %}