{% extends "::base.html.twig" %}
{% form_theme form inline_form_theme %}

{% block title "List Of Projects" %}
    
{# {% block styles %} #}
{% block newStyles %}
    <style>
        .nav-tabs > li.active > a, 
        .nav-tabs > li.active > a:focus, 
        .nav-tabs > li.active > a:hover {
            background-color: #337ab7;
            color: #fff;
        }
    </style>

{# {% endblock %} #}

{% endblock %}
    
{% 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 Projects</span>
                </div>
            </div>
            <div class="panel-body">
                <div class="list-group">
                    {% for project in pagination %}
                    {% set pid = project.getId() %}
                    
                    {% if pjt is not null %}
                    {% set selId = pjt.getId() %}
                    {% else %}
                    {% set selId = 0 %}
                    {% endif %}
                    
                    <a class="list-group-item {% if pid == selId %}active{% endif %}" href="{{ path('project_home', {'pjt': pid, 'page': page, 'name': name}) }}">
                        {{ project.getName() }}<br/>
                        {{ project.getModeLabel() }}
                    </a>
                    
                    {% else %}
                    There are no projects under this organization.<br/>
                    <a class="{{ grey_sm_btn }}" href="{{ path("project_create") }}">Create</a>
                    {% endfor %}
                </div>
                <div>
                    {{ knp_pagination_render(pagination) }}
                </div>
            </div>
        </div>
    </div>#}
    
    <div class="col-md-12">
        <h4 style="font-weight: 300;">List of Projects</h4>
    
        <a style="margin-bottom: 10px;" class="btn btn-sm btn-primary" href="{{ path('project_create') }}">Add Project</a>
    
        {{ form(form) }}
    
        <div style="margin-top: 10px;" class="panel panel-default">
            <div class="panel-body">
                <table class="table table-bordered table-striped table-hover">
                    <thead>
                        <tr>
                            {% if organtype == constant('\\Alsuite\\AssetsBundle\\Interfaces\\Constants::ORGAN_TYPE_FRONTLINE') %}
                                <th>Project Title</th><th>Mode</th><th></th>
                            {% else %}
                                <th>Client</th><th>Project Title</th><th>Country</th>
                                <th>Budget</th><th>Reference</th><th>Deadline</th>
                                <th>Internal Deadline</th><th>Status</th><th></th>
                            {% endif %}
                        </tr>
                    </thead>
                    <tfoot>
                        {{ knp_pagination_render(pagination) }}
                    </tfoot>
                    <tbody>
                        {% for project in pagination %}
                            {% set id = project.id %}
                            <tr>
                                {% if organtype == constant('\\Alsuite\\AssetsBundle\\Interfaces\\Constants::ORGAN_TYPE_FRONTLINE') %}
                                    <td>{{ project.name }}</td>
                                {% else %}
                                    <td>{{ project.getClientDetails() }}</td>
                                    <td>{{ project.name }}</td>
                                    <td>{{ project.getCountryName() }}</td>
                                    <td>{{ project.currency ~ ' ' ~ project.getBudget()|number_format }}</td>
                                    <td>{{ project.notes }}</td>
                                    <td>
                                        {% if project.extDeadline is not null %}
                                            {{ project.extDeadline|date(date_format) }}
                                        {% endif %}
                                    </td>
                                    <td>
                                        {% if project.intDeadline is not null %}
                                            {{ project.intDeadline|date(date_format) }}
                                        {% endif %}
                                    </td>
                                {% endif %}
                                <td>{{ project.getModeLabel() }}</td>
                                <td>
                                    <a class="{{ tbl_link }}" href="{{ path('project_view', {'id': id}) }}">View</a>
                                    <a class="{{ tbl_link }}" id="prj{{ id }}">Delete</a>
                                </td>
                            </tr>
                        {% else %}
                            <tr>
                                <td colspan="8">There are no projects under this organization.</td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    {% endblock %}
    {#<div class="col-md-8">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <div class="center-text">
                    <span class="label">Project Details</span>
                </div>
            </div>
            <div class="panel-body">
                {% if pjt is not null %}
                {% set id = pjt.getId() %}
                {% set projectCurrency = pjt.currency %}
                <span style="font-size: 14px; font-weight: 400;">{{ pjt.getName() }}</span><br/>
                 
                <div id="project-tabs">
                    <ul class="nav nav-tabs nav-justified">
                        <li><a href="#details" data-toggle="tab"><b>Details</b></a></li>
                        {% if organtype == constant('\\Alsuite\\AssetsBundle\\Interfaces\\Constants::ORGAN_TYPE_FRONTLINE') %}
                        <li><a href="#fundsexpected" data-toggle="tab"><b>Funds Expected</b></a></li>
                        <li><a href="#invoices" data-toggle="tab"><b>Invoices</b></a></li>
                        <li><a href="#fundsreceived" data-toggle="tab"><b>Funds Received</b></a></li>
                        <li><a href="#budgets" data-toggle="tab"><b>Budgets</b></a></li>
                        {% else %}
                        <li><a href="#positions" data-toggle="tab"><b>Positions</b></a></li>
                        {% endif %}
                    </ul>
                
                    <div class="tab-content">
                        <div id="details">
                            <div style="{{ btnLinks }}"> 
                                <a class="{{ grey_sm_btn }}" href="{{ path('project_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" style="{{ tbl_margin }}">
                                <tbody>
                                    <tr>
                                        <th>Period</th>
                                        <td>{{ pjt.getStartsOn|date(date_format) ~ ' to ' ~  pjt.getEndsOn|date(date_format) }}
                                        </td>
                                    </tr>
                                    <tr><th>Currency</th><td>{{ projectCurrency }}</td></tr>
                                    <tr><th>Exchange Rate</th><td>{{ pjt.exchangeRate|number_format(2) }}</td></tr>
                                    <tr><th>Mode of Operation</th><td>{{ pjt.getModeLabel() }}</td></tr>
                                </tbody>
                            </table>
                            <table class="table table-bordered table-striped" style="{{ tbl_margin }}">
                                <thead>
                                    <tr><th colspan="4" class="center-text">Expected vs Received</th></tr>
                                    <tr>
                                        <th>Client</th><th>Expected ({{ projectCurrency }})</th>
                                        <th>Received ({{ projectCurrency }})</th>
                                        <th>Balance ({{ projectCurrency }})</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {% for id, detail in data %}
                                    <tr>
                                        <td>{{ detail.name }}</td>
                                        <td>{{ detail.exp|number_format(2) }}</td>
                                        <td>{{ detail.rec|number_format(2) }}</td>
                                        <td>{{ detail.bal|number_format(2) }}</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>

                            {{ include('AlsuiteFinanceBundle:Project:del.html.twig',
                                {'id': id, 'action': 'Delete', 'object': 'Project',
                                'route': path('project_del', {'id': id})})
                            }}
                        </div>
                        {% if organtype == constant('\\Alsuite\\AssetsBundle\\Interfaces\\Constants::ORGAN_TYPE_FRONTLINE') %}
                        <div id="fundsexpected">
                            <div style="{{ btnLinks }}"> 
                                <a class="{{ grey_sm_btn }}" href="{{ path('funds_expected_add', {'id': id}) }}">Add</a>
                            </div>
                            <table class="table table-bordered table-striped">
                                <tbody>
                                    <tr><th>Client</th><th>Total Expected ({{ projectCurrency }})</th><th>Notes</th><th>Due Date</th><th>Actions</th></tr>
                                    {% for fundsExpected in pjt.getFundsExpected() %}
                                    {% set fid = fundsExpected.id %}
                                    <tr>
                                        <td>{{ fundsExpected.client.getName() }}</td>
                                        <td>{{ fundsExpected.amount|number_format(2) }}</td>
                                        <td>{{ fundsExpected.notes }}</td><td>{{ fundsExpected.dueDate|date(date_format) }}</td>
                                        <td>
                                            <a class="{{ tbl_link }}" href="{{ path('funds_expected_edit', {'id': fid}) }}">Edit</a>
                                            <a class="{{ tbl_link }}" data-toggle="modal" href="#fundsExp{{ fid }}">Delete</a>

                                            {{ include('AlsuiteFinanceBundle:Project:delFundsExpected.html.twig',
                                                {'id': fid, 'action': 'Delete', 'object': 'Funds Expected',
                                                'route': path('funds_expected_del', {'id': fid}), 'modal': 'fundsExp'})
                                            }}
                                        </td>
                                    </tr>
                                    {% else %}
                                    <tr>
                                        <td colspan="5">No funds expected records have been added yet.</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                        <div id="invoices">
                            <div style="{{ btnLinks }}"> 
                                <a class="{{ grey_sm_btn }}" href="{{ path('invoice_create', {'project': id}) }}">Add</a>
                            </div>
                            <table class="table table-bordered table-striped">
                                <colgroup>
                                    <col style="width: available;"/><col style="width: 10%;"/>
                                    <col style="width: 15%;"/><col style="width: 15%;"/>
                                    <col style="width: 10%;"/><col style="width: 20%;"/>
                                    <col style="width: 10%;"/>
                                </colgroup>
                                <thead>
                                    <tr>
                                        <th>Client</th><th>Due Date</th>
                                        <th>Amount ({{ projectCurrency }})</th>
                                        <th>Paid ({{ projectCurrency }})</th><th>Status</th>
                                        <th>Terms & Notes</th><th>Actions</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {% for invoice in pjt.getInvoices() %}
                                    {% set invId = invoice.id %}
                                    <tr>
                                        <td>{{ invoice.client.getName() }}</td>
                                        <td>{{ invoice.dueDate|date(date_format) }}</td>
                                        <td>{{ invoice.getTotalAmountWithTaxes()|number_format(2) }}</td>
                                        <td>{{ invoice.getTotalAmountPaid()|number_format(2) }}</td>
                                        <td>{{ invoice.getStatusLabel() }}</td>
                                        <td>
                                            {% if invoice.terms is not null %}
                                            {{ invoice.terms }}<br/><br/>
                                            {% endif %}
                                            
                                            {{ invoice.notes }}
                                        </td>
                                        <td>
                                            <a class="{{ tbl_link }}" href="{{ path('invoices_list', {'id': invId}) }}">View</a>
                                            {#<a href="{{ path('invoice_edit', {'id': invId}) }}">Edit</a>
                                            <a data-toggle="modal" href="#invoice{{ invId }}">Delete</a>

                                            {{ include('AlsuiteFinanceBundle:Invoice:delete.html.twig',
                                                {'id': invId, 'action': 'Delete', 'object': 'Invoice',
                                                'route': path('invoice_delete', {'id': invId}), 'modal': 'invoice'})
                                            }}#}
                                        {#</td>
                                    </tr>
                                    {% else %}
                                    <tr>
                                        <td colspan="7">No invoices have been created yet.</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                        <div id="fundsreceived">
                            <div style="{{ btnLinks }}"> 
                                <a class="{{ grey_sm_btn }}" href="{{ path('contributor_add', {'id': id}) }}">Receive Funds</a>
                            </div>
                            <table class="table table-bordered table-striped">
                                <tbody>
                                    <tr><th>Client</th><th>Received On</th><th>Amount ({{ currency }})</th><th>Actions</th></tr>
                                    {% for contributor in pjt.getContributors() %}
                                    {% set cid = contributor.getId() %}
                                    <tr>
                                        <td>{{ contributor.getDonor().getName() }}</td>
                                        <td>{{ contributor.getReceivedOn()|date(date_format) }}</td>
                                        <td>{{ contributor.getAmount()|number_format(2) }}</td>
                                        <td>
                                            <a class="{{ tbl_link }}" href="{{ path('contributors_update', {'id': cid}) }}">Edit</a>
                                            <a class="{{ tbl_link }}" data-toggle="modal" href="#client{{ cid }}">Delete</a>

                                            {{ include('AlsuiteFinanceBundle:Project:delContributor.html.twig',
                                                {'id': cid, 'action': 'Delete', 'object': 'contributor',
                                                'route': path('contributor_del', {'id': cid}), 'modal': 'client'})
                                            }}
                                        </td>
                                    </tr>
                                    {% else %}
                                    <tr>
                                        <td colspan="4">No funds receipt records have been added yet.</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                        <div id="budgets">
                            <div style="{{ btnLinks }}"> 
                                <a class="{{ grey_sm_btn }}" href="{{ path('budget_create', {'project': id}) }}">Add</a> 
                            </div>
                            <table class="table table-bordered table-striped">
                                <tbody>
                                    <tr>
                                        <th>Start Date</th><th>End Date</th><th>Status</th><th>Amount</th><th>Actions</th>
                                    </tr>
                                    {% for budget in pjt.getBudgets() %}
                                    {% set bid = budget.getId() %}
                                    <tr>                          
                                        <td>{{ budget.getStartsOn()|date(date_format) }}</td>
                                        <td>{{ budget.getEndsOn()|date(date_format) }}</td>
                                        <td>{{ budget.getStatus() }}</td>
                                        <td>{{ currency }} {{ budget.getAmount()|number_format(2) }}</td>
                                        <td>
                                            <a class="{{ tbl_link }}" href="{{ path('budget_edit', {'id': bid}) }}">Edit</a>
                                            <a class="{{ tbl_link }}" data-toggle="modal" href="#budget{{ bid }}">Delete</a>
                                            {{ include('AlsuiteFinanceBundle:Budget:del.html.twig',
                                                {'id': bid, 'action': 'Delete', 'object': 'budget',
                                                'route': path('budget_del', {'id': bid}),'modal': 'budget'})
                                            }}
                                        </td>
                                    </tr>
                                    {% else %}
                                    <tr>
                                        <td colspan="5">No budgets have been created under this project yet.</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                        {% else %}
                        <div id="positions">
                            <div style="{{ btnLinks }}"> 
                                <a class="{{ grey_sm_btn }}" href="{{ path('project_position_add', {'id': id}) }}">Add</a> 
                            </div>
                            {% for position in pjt.positions %}
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <span>
                                            <a class="{{ tbl_link }}" href="{{ path('project_position_edit', {'id': position.id}) }}">Edit</a>
                                            <a class="{{ tbl_link }}" data-toggle="modal" href="#position{{ position.id }}">Delete</a>
                                            <a class="{{ tbl_link }}" href="{{ path('expert_search_filter', {'position': position.id}) }}">Search &amp; Add Experts</a> 
                                            {{ include(prompt_template,
                                                {'id': position.id, 'action': 'Delete', 'object': 'Project Position',
                                                'route': path('project_position_delete', {'id': position.id}),'modal': 'position'})
                                            }}
                                        </span>
                                        <h5>{{ position.title }}</h5>
                                        <p>{{ position.details }}</p>
                                    </div>
                                    <div class="panel-body">
                                        {% for linked in position.experts %}
                                            {% set expert = linked.expert %}
                                            <div class="panel panel-warning">
                                                <div class="panel-heading">
                                                    <span>
                                                        <a class="{{ tbl_link }}" href="{{ path('project_position_expert_edit', {'id': linked.id}) }}">Change Status</a>
                                                        <a class="{{ tbl_link }}" data-toggle="modal" href="#expert{{ linked.id }}">Delete</a>
                                                        <a class="{{ tbl_link }}" href="{{ path('ppecom_add', {'ppe': linked.id, 'type': 1}) }}">Add Note</a>
                                                        <a class="{{ tbl_link }}" href="{{ path('ppecom_add', {'ppe': linked.id, 'type': 2}) }}">Send an Email</a>
                                                        {{ include(prompt_template,
                                                            {'id': linked.id, 'action': 'Delete', 'object': 'Project Position Expert',
                                                            'route': path('project_position_expert_delete', {'id': linked.id}),'modal': 'expert'})
                                                        }}
                                                    </span>
                                                    <p>{{ expert.fullname ~ ' (' ~ linked.getStatusLabel() ~ ')' }}</p>
                                                </div>
                                                <div class="panel-body">
                                                    <table class="table table-bordered" style="{{ tbl_margin }}">
                                                        <colgroup><col style="width: available;"/><col style="width: 20%;"/></colgroup>
                                                        <tbody>
                                                            {% for com in linked.coms %}
                                                                <tr>
                                                                    <td>
                                                                        {% if com.isANote() %}
                                                                            {{ com.details }}<br/>
                                                                        {% else %}
                                                                            {{ com.details|raw }}
                                                                        {% endif %}
                                                                        By {{ com.addedBy.fullname }} on {{ com.addedOn|date(date_format) }}
                                                                    </td>
                                                                    <td>
                                                                    </td>
                                                                </tr>
                                                            {% else %}
                                                                <tr><td colspan="2">There are no updates.</td></tr>
                                                            {% endfor %}
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        {% else %}
                                            There are no experts linked to this position yet.
                                        {% endfor %}
                                    </div>
                                </div>
                            {% else %}
                                There are no positions highlighted under this project yet.
                            {% endfor %}
                        </div>
                        {% endif %}
                    </div>
                </div>
                {% else %}
                Please click on a project in the left panel to view its details here.
                {% endif %}
            </div>
        </div>
    </div> 
</div>#}
{# {% endblock %}  #}

    {% block javascripts %}
        <script type="text/javascript">
            $(document).ready(function() {
                $('#project-tabs').easytabs();
                $('#form_name').css('width', '200px');
                $('#form_client').css('width', '300px');
                
                {% for project in pagination %}
                    {% set id = project.id %}
                    $('#prj{{ id }}').on('click', function(e) {
                        BootstrapDialog.show({
                            type: BootstrapDialog.TYPE_DANGER,
                            title: 'Confirm Delete', 
                            message: 'The project will be deleted. Click Delete to proceed.', 
                            buttons: [
                                {
                                    label: 'Close', 
                                    action: function(dialogRef) {
                                        dialogRef.close();
                                    }
                                }, {
                                    label: 'Delete', 
                                    icon: 'glyphicon glyphicon-trash', 
                                    cssClass: 'btn-danger', 
                                    autospin: true, 
                                    data: {'id': {{ id }}}, 
                                    action: function() {
                                        window.location.href = '{{ path('project_del', {'id': id}) }}';
                                    }
                                }
                            ]
                        });
                    });    
                {% endfor %}
            });
        </script>
    {{ form_javascript(form) }}
{% endblock %}