{% extends "::base.html.twig" %}

{% form_theme form inline_form_theme %}

{% block title "List Of Contacts" %}
    
{% block content %}
{{ form(form) }}

<div class="row">
    <div class="col-md-4">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <div class="center-text">
                    <span class="label">List Of Contacts</span>
                </div>
            </div>
            <div class="panel-body">
                <div class="list-group">
                    {% for donor in pagination %}
                    {% set id = donor.getId() %}
                    
                    {% if dnr is not null %}
                    {% set did = dnr.getId() %}
                    {% else %}
                    {% set did = 0 %}
                    {% endif %}
                    
                    <a class="list-group-item {% if id == did %}active{% endif %}" href="{{ path('donor_home', {'dnr': id, 'page': page, 'name': name, 'type': types}) }}">
                        {{ donor.getName() }}<br/><br/>
                    </a>  
                    {% else %}
                    There are no clients under this organization.<br/>
                    <a class="{{ grey_sm_btn }}" href="{{ path("donor_create") }}">Create</a>
                    {% endfor %}
                </div>
                <div>
                    {{ knp_pagination_render(pagination) }}
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-8">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <div class="center-text">
                    <span class="label">Details</span>
                </div>
            </div>
            <div class="panel-body">
                {% if dnr is not null %}
                {% set id = dnr.getId() %}
                <span style="font-size: 14px; font-weight: 400;">{{ dnr.getName() }}</span>
                
                <div id="client-tabs">
                    <ul class="nav nav-tabs nav-justified">
                        <li><a href="#clientdetails" data-toggle="tab">Contact Details</a></li>
                        {#<li><a href="#pocs" data-toggle="tab">Points of Contact</a></li>#}
                        <li><a  href="#contribs" data-toggle="tab">Contributions</a></li>
                    </ul>
                
                    <div class="tab-content">
                        <div id="clientdetails">
                            <div style="{{ btnLinks }}">
                                <a class="{{ grey_sm_btn }}" href="{{ path('donor_edit', {'id': id}) }}">Edit</a>
                                <a data-toggle="modal" class="{{ grey_sm_btn }}" href="#myModal{{ id }}">Delete</a>
                            </div>
                            <table class="table table-bordered table-striped">
                                <colgroup><col style="width: 30%;"/><col style="width: available;"/></colgroup>
                                <tbody> 
                                    <tr><th>Type</th><td>{{ dnr.getTypeLabel() }}</td></tr>
                                    <tr><th>Organization</th><td>{{ dnr.worksFor }}</td></tr>
                                    <tr>
                                        <th>Is a prospective Client?</th>
                                        <td>{% if dnr.isProspective() %}Yes{% else %}No{% endif %}</td>
                                    </tr>
                                    <tr>
                                        <th>Category</th>
                                        <td>
                                            {% if dnr.category is not null %}
                                            {{ dnr.category.getName() }}
                                            {% endif %}
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>Funding Type</th>
                                        <td>
                                            {% if dnr.support is not null %}
                                            {{ dnr.support.getName() }}
                                            {% endif %}
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>Funding Area(s)</th>
                                        <td>
                                            {% for linked in areas %}
                                            {{ linked.getOption().getName() }}<br/>
                                            {% endfor %}
                                        </td>
                                    </tr>
                                    <tr><th>Email</th><td>{{ dnr.getEmail()}}</td></tr>
                                    <tr><th>Land Line</th><td>{{ dnr.landline }}</td></tr>
                                    <tr><th>Mobile</th><td>{{ dnr.mobile }}</td></tr>
                                    <tr><th>Fax</th><td>{{ dnr.getFax() }}</td></tr>
                                    <tr><th>Street - Address Line 1</th><td>{{ dnr.street }}</td></tr>
                                    <tr><th>Zip (Postal) Code - Address Line 2</th><td>{{ dnr.zip }}</td></tr>
                                    <tr><th>City</th><td>{{ dnr.city }}</td></tr>
                                    <tr><th>Country</th><td>{{ dnr.getCountryName() }}</td></tr>
                                    <tr><th>Website Url</th><td>{{ dnr.getUrl()}}</td></tr>
                                    <tr><th>Notes</th><td>{{ dnr.notes }}</td></tr>
                                </tbody>
                            </table>                                 
                        </div>
                        {#<div id="pocs">
                            <div style="{{ btnLinks }}">
                                <a class="{{ grey_sm_btn }}" href="{{ path('poc_add', {'id': id}) }}">Create</a>
                            </div>
                            <table class="table table-bordered table-striped">
                                <thead>
                                    <tr><th>Firstname</th><th>Lastname</th><th>Email</th><th>Phone #</th><th>Actions</th></tr>
                                </thead>
                                <tbody>
                                    {% for pointOfContact in dnr.getPointsOfContact() %}
                                    {% set sid = pointOfContact.getId() %}
                                    <tr>            
                                        <td>{{ pointOfContact.getFirstname()}}</td>
                                        <td>{{ pointOfContact.getLastname()}}</td>
                                        <td>{{ pointOfContact.getEmail()}}</td>
                                        <td>{{ pointOfContact.getPhoneNumber()}}</td>
                                        <td>
                                            <a href="{{ path('poc_edit', {'id': sid}) }}">Edit</a>
                                            <a data-toggle="modal" href="#pointOfContact{{ sid }}">Delete</a>

                                            {{ include('AlsuiteFinanceBundle:PointOfContact:delete.html.twig',
                                                {'id': sid, 'action': 'Delete', 'object': 'Point Of Contact',
                                                'route': path('poc_del', {'id': sid}), 'modal': 'pointOfContact'})
                                            }}
                                        </td>
                                    </tr>
                                    {% else %}
                                    <tr>
                                        <td colspan="5">There are no Points Of Contact under this Client.</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>#}
                        <div id="contribs">
                            <table class="table table-bordered table-striped" style="{{ tbl_margin }}">
                                <thead>
                                    <tr><th>Project</th><th>Amount</th><th>Received On</th>{#<th>Actions</th>#}</tr>
                                </thead>
                                <tbody>
                                    {% for contribution in dnr.getContributions() %}
                                    {% set cid = contribution.getId() %}
                                    <tr>
                                        <td>
                                            {% if contribution.project is not null %}
                                            {{ contribution.Project().getName() }}
                                            {% else %}
                                            NA 
                                            {% endif %}
                                        </td>
                                        <td>{{ currency }} {{ contribution.getAmount()|number_format(2) }}</td>
                                        <td>{{ contribution.getReceivedOn()|date(date_format) }}</td>
                                    </tr>
                                    {% else %}
                                    <tr>
                                        <td colspan="4">There are no contributions from this Client recorded yet.</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>    
                        </div>
                    </div>
                </div>
            </div>
        </div>  
                
        {{ include('AlsuiteFinanceBundle:Donor:del.html.twig',
            {'id': id, 'action': 'Delete', 'object': 'Contact',
            'route': path('donor_delete', {'id': id})})
        }}
        {% else %}
        Please click on a contact in the left panel to view the details here.
        {% endif %}
    </div>
</div>
{% endblock %} 

{% block javascripts %}
<script type="text/javascript">
    $(document).ready(function() {
        $('#client-tabs').easytabs();
        $('#form_types').css('width', '350px');
        $('#form_types').select2();
    });
</script>
{% endblock %}