{% extends 'manager/base.html' %}
{% load static %}

{% block sidebar.dashboard %} {% endblock %}
{% block sidebar.assistants %} class="active" {% endblock %}

{% block content %}
<div class="content">
    <div class="row">
        <div class="col-lg-8 offset-lg-2">
            <h4 class="page-title">Add Assistant</h4>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-8 offset-lg-2">
            <form method="post" action="{% url 'panel-manager-create-assistant' %}" enctype="multipart/form-data">
                {% csrf_token %}
                <div class="row">
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>First Name <span class="text-danger">*</span></label>
                            <input class="form-control" type="text" name="first_name">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>Last Name <span class="text-danger">*</span></label>
                            <input class="form-control" type="text" name="last_name">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>Username <span class="text-danger">*</span></label>
                            <input class="form-control" type="text" name="username">
                        </div>
                    </div>
{#                    <div class="col-sm-6">#}
{#                        <div class="form-group">#}
{#                            <label>Email <span class="text-danger">*</span></label>#}
{#                            <input class="form-control" type="email" re>#}
{#                        </div>#}
{#                    </div>#}
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>Password <span class="text-danger">*</span></label>
                            <input class="form-control" type="text" name="password">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>Confirm Password <span class="text-danger">*</span></label>
                            <input class="form-control" type="text" name="confirm">
                        </div>
                    </div>
{#                    <div class="col-sm-6">#}
{#                        <div class="form-group">#}
{#                            <label>Date of Birth</label>#}
{#                            <div class="cal-icon">#}
{#                                <input type="text" class="form-control datetimepicker">#}
{#                            </div>#}
{#                        </div>#}
{#                    </div>#}
                    <div class="col-sm-6">
                        <div class="form-group gender-select">
                            <label class="gen-label">Gender <span class="text-danger">*</span></label>
                            <div class="form-check-inline">
                                <label class="form-check-label">
                                    <input type="radio" name="gender" class="form-check-input" value="Male">Male
                                </label>
                            </div>
                            <div class="form-check-inline">
                                <label class="form-check-label">
                                    <input type="radio" name="gender" class="form-check-input" value="Female">Female
                                </label>
                            </div>
                        </div>
                    </div>

                    <div class="col-sm-12">
                        <div class="row">
{#                            <div class="col-sm-12">#}
{#                                <div class="form-group">#}
{#                                    <label>Address</label>#}
{#                                    <input type="text" class="form-control ">#}
{#                                </div>#}
{#                            </div>#}
{#                            <div class="col-sm-6 col-md-6 col-lg-3">#}
{#                                <div class="form-group">#}
{#                                    <label>Country</label>#}
{#                                    <select class="form-control select">#}
{#                                        <option>USA</option>#}
{#                                        <option>United Kingdom</option>#}
{#                                    </select>#}
{#                                </div>#}
{#                            </div>#}
{#                            <div class="col-sm-6 col-md-6 col-lg-3">#}
{#                                <div class="form-group">#}
{#                                    <label>City</label>#}
{#                                    <input type="text" class="form-control">#}
{#                                </div>#}
{#                            </div>#}
                            <div class="col-sm-6 col-md-6 col-lg-6">
                                <div class="form-group">
                                    <label>پزشک مربوطه <span class="text-danger">*</span></label>
                                    <select class="form-control select" name="doctor_id">
                                        {% for doctor in doctors %}
                                            <option value="{{ doctor.id }}">{{ doctor.first_name }} {{ doctor.last_name }}</option>
                                        {% endfor %}

                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>Phone </label>
                            <input class="form-control" type="text">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-group">
                            <label>Avatar</label>
                            <div class="profile-upload">
                                <div class="upload-img">
                                    <img alt="" src="{% static 'panel/doctor' %}/img/user.jpg">
                                </div>
                                <div class="upload-input">
                                    <input type="file" class="form-control" name="image">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
{#                <div class="form-group">#}
{#                    <label>Short Biography</label>#}
{#                    <textarea class="form-control" rows="3" cols="30"></textarea>#}
{#                </div>#}
{#                <div class="form-group">#}
{#                    <label class="display-block">Status</label>#}
{#                    <div class="form-check form-check-inline">#}
{#                        <input class="form-check-input" type="radio" name="status" id="doctor_active" value="option1" checked>#}
{#                        <label class="form-check-label" for="doctor_active">#}
{#                        Active#}
{#                        </label>#}
{#                    </div>#}
{#                    <div class="form-check form-check-inline">#}
{#                        <input class="form-check-input" type="radio" name="status" id="doctor_inactive" value="option2">#}
{#                        <label class="form-check-label" for="doctor_inactive">#}
{#                        Inactive#}
{#                        </label>#}
{#                    </div>#}
{#                </div>#}
                <div class="m-t-20 text-center">
                    <button class="btn btn-primary submit-btn">Create Assistant</button>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}