{% extends "base.html" %}
{% load bootstrap4 %}
{% load widget_tweaks %}

{% block title %}Client - Company Info{% endblock title %}

{% block content %}
<br><br>
<section class="page-section" id="services">
    <div class="container">
        {%if cid %}
            {% include "client_navbar.html" %}
        {%endif%}
        <div class="row">
            <div class="col-md-12">
                <h3>Companies</h3>
                <p>User {{ request.user.email }}</p>
                <div class="row">
                    <div class="col-md-10">
                        {%if cid %}
                        <form method="post" class="form" id="company-select" action="{% url 'web:client_switch' %}">
                            {% csrf_token %}
                            {% bootstrap_form client_selection_form  layout='inline' %}
                        </form>
                        {%else%}
                        no companies found
                        {%endif%}
                    </div>
                    <div class="col-md-2">
                        {% if request.user.is_superuser or request.user.is_staff %}
                            <a class="btn btn-sm btn-outline-primary" href="{% url 'web:client_create' %}">Create Company</a>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>

        {%if cid %}
            {%if permission_state != "USER" %}
            <br>
            <form action="" method="post" class="form" enctype="multipart/form-data">
                {% csrf_token %}
                <h3>Company</h3>
                <div class="row">
                    <div class="col-md-8">
                        {{company_form.id}}
                        {% bootstrap_form company_form layout='inline' %}
                    </div>
                    <div class="col-md-4">
                        {% if logo %}
                            <p>Company Logo</p>
                            <img src="{{ logo }}" class="img-fluid" alt="company logo">
                        {% endif %}
                    </div>
                </div>
                <br>
                <div class="row">
                    <div class="col-md-10">
                        {% buttons %}
                        <button type="submit" class="btn btn-outline-primary">Submit</button>
                        {% endbuttons %}
                    </div>
                    <div class="col-md-2">
                    </div>
                </div>
            </form>
            {%endif%}
        {%endif%}
    </div>
    <br><br>
{% endblock content %}

{% block footer_scripts %}
<script>
    function choiceFieldChange(value, element) {
        var e = document.getElementById('company-select');
        if (e) {
            e.submit();
        }
    }
</script>
{% endblock footer_scripts %}