{% extends '@InstallBois/index.html.twig' %}

{% block title %}
    INSTALL-BOIS
{% endblock %}

{% block javascripts %}
    <script src="https://code.jquery.com/jquery-3.6.1.js"></script>
    {{ parent() }}
    <script src="https://code.jquery.com/ui/1.13.0/jquery-ui.js"></script>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.13.0/themes/base/jquery-ui.css">
{% endblock %}

{% block page_content_start %}
    {{ parent() }}
    {{ include('project/_block/project_infos.html.twig') }}
{% endblock %}

{% block page_content %}
    <div class="container-fluid">
        <div class="row">
            {% if project.finalCustomer.extrabatId !== null %}
                <div style="float: right">
                    <div>
                        <a target="_blank"
                           href="https://www.myextrabat.com/clients/detail/index/{{ project.finalCustomer.extrabatId }}">
                            <button style="margin:0" type="button" class="boutonAction bg-eb"
                                    onclick="">Fiche Extrabat
                            </button>
                        </a>
                    </div>
                </div>
            {% endif %}
            {{ include('project/_block/_projects_actions.html.twig') }}
            <div id="tabs" class="col-sm-12 col-md-12 col-lg-12">
                <ul id="listTabs">
                    {% if ib1Project == false %}
                        <li id="tabServices">
                            <a href="#containerServices">
                                <span>Services</span>
                                <img src="{{ asset('install-bois/icon/tabs/handshake-angle-solid.svg') }}" alt="">
                            </a>
                        </li>
                    {% endif %}
                    <li id="tabRapport">
                        <a href="#containerReports">
                            {% if ib1Project == false %}
                                <span>Rapports</span>
                            {% else %}
                                <span>Etude</span>
                            {% endif %}
                            <img src="{{ asset('install-bois/icon/tabs/handshake-angle-solid.svg') }}" alt="">
                        </a>
                    </li>
                    <li id="tabClientApp">
                        <a href="#containerClientAppareils">
                            <span>Client</span>
                            <img src="{{ asset('install-bois/icon/tabs/user-solid.svg') }}" alt="">
                        </a>
                    </li>
                    {% if ib1Project == false %}
                        <li id="tabTracking">
                            <a href="#containerClientDoc">
                                <span>Suivi client</span>
                                <img src="{{ asset('install-bois/icon/tabs/envelopes-bulk-solid.svg') }}" alt="">
                            </a>
                        </li>
                        <li id="tabNotes">
                            <a href="#containerNotes">
                                <span>Notes</span>
                                <img src="{{ asset('install-bois/icon/tabs/pencil.svg') }}" alt="">
                            </a>
                        </li>
                    {% endif %}
                    <li id="tabPictures">
                        <a href="#containerPictures">
                            <span>Photos & documents</span>
                            <img src="{{ asset('install-bois/icon/tabs/file-regular.svg') }}" alt="">
                        </a>
                    </li>
                    {# @TODO Temporaire - I20A-1605 #}
                    {#                    <li id="tabHistory"> #}
                    {#                        <a href="#containerHistorique"> #}
                    {#                            <span>Historique</span> #}
                    {#                            <img src="{{ asset('install-bois/icon/tabs/clock-rotate-left-solid.svg') }}" alt=""> #}
                    {#                        </a> #}
                    {#                    </li> #}
                    {# @TODO Temporaire - I20A-1605 #}

                </ul>
                <div id="containertabs" class="col-sm-12 col-md-12 col-lg-12">
                    {% if ib1Project == false %}
                        <div id="containerServices">
                            {{ include('project/_block/_services_provided.html.twig') }}
                        </div>
                    {% endif %}
                    <script>let border = false;</script>
                    <div id="containerReports">
                        {{ include('project/_block/_projects_reports.html.twig') }}
                    </div>
                    <div id="containerClientAppareils">
                        {{ include('project/_block/_projects_device_setting.html.twig') }}
                    </div>
                    {% if ib1Project == false %}
                        <div id="containerClientDoc">
                            {{ include('project/_block/_project_communicate_customer.html.twig') }}
                            {#                            {{ include('project/_block/_project_reminder_note.html.twig') }} #}
                        </div>
                        <div id="containerNotes">
                            {{ include('project/_block/_project_reminder_note.html.twig') }}
                        </div>
                    {% endif %}
                    <div id="containerPictures">
                        {{ include('project/_block/_documents_pictures.html.twig') }}
                        {{ include('project/_block/_project_download_documents.html.twig') }}
                    </div>
                    {# @TODO Temporaire - I20A-1605 #}
                    {#                    <div id="containerHistorique"> #}
                    {#                        {{ include('project/_block/_projects_tracking.html.twig') }} #}
                    {#                    </div> #}
                    {# @TODO Temporaire - I20A-1605 #}
                </div>
            </div>
        </div>
    </div>
    {% if infoWetDryForCdc!==false %}
        {{ include('report/modal/generateWetDryAudit.html.twig') }}
    {% endif %}
    <script type="text/javascript"
            src="{{ asset('install-bois/initDateTimeFormatDatatable.js') ~ "?rnd=" ~ random() }}"></script>
    <script>
        let typeAuditReport = null; // Use for import Extrabat reports
        let infoWetDryForCdc ={{ infoWetDryForCdc| json_encode | raw }};
        let choiceEmail = null;

        $(function () {
            $("#tabs").tabs();
        });
        let numContainer;
        switch ("{{ tabContainer }}") {
            case 'tabServices':
                numContainer = 1
                break;
            case 'tabReports':
                numContainer = 2
                break;
            case 'tabClientApp':
                numContainer = 3
                break;
            case 'tabTracking':
                numContainer = 4
                break;
            case 'tabNotes':
                numContainer = 5
                break;
            case 'tabPictures':
                numContainer = 6
                break;
            case 'tabHistory':
                numContainer = 7
                break;
            default:
                numContainer = 1
                break;
        }
        $("#listTabs li:first-child").removeClass("ui-tabs-active ui-state-active");
        $("#listTabs li:nth-child(" + numContainer + ")").addClass("ui-tabs-active ui-state-active");
        $("#containertabs > div")[0].style.display = "none";
        $("#containertabs > div")[numContainer].style.display = "block";
    </script>
{% endblock %}