{% extends "view/layout.html.twig" %}
{% block title %} Tunnel | CRM BIVTeam {% endblock %}
{% block stylesheets %}
    {{ parent() }}
    {% include 'view/library/_select2.html.twig' %}
    <link href="{{ asset('clockpicker-gh-pages/dist/bootstrap-clockpicker.min.css') }}" rel="stylesheet"/>
{% endblock %}
{% block body %}
    <div class="container-fluid mt-2">
        {% set titleHelp = "help.details.title"|trans %}
        {% set txtHelp = "help.details.update"|trans %}
        {% include 'view/header/_help.html.twig' %}

        <!-- box -->
        {% if  salesTunnel.name != 'tunnelMovement.list.titleNoSalesTunnel' | trans %}
            <div class="content-box content-lighten">
                <div class="row">
                    <div class="col">
                        <a class="float-right" style="color:darkred"
                           href="{{ path('finishedSalesTunnel', {id: tunnelMovement.id}) }}"
                           onclick="return confirm('Confirmer la clôturation de l\'action?')"><i
                                    class="fas fa-hourglass-end"></i>
                        </a>
                    </div>
                </div>
            </div>
        {% endif %}

        <!-- box -->
        <div class="row">
            <div class="col-sm-12 col-md-12">
                <div class="content-box content-lighten" data-step="1"
                     data-intro="{{ "help.details.update.step1"|trans }}">
                    <h2 class="text-center"> {{ 'tunnelMovement.update.title' | trans }} - {{ salesTunnel.name }}</h2>
                    {% include 'view/salesTunnel/_formTunnelMovement.html.twig' %}
                </div>
            </div>
        </div>

        <!-- box -->
        <div class="row">
            <div class="col-sm-12 col-md-12">
                <div class="content-box content-lighten" data-step="2"
                     data-intro="{{ "help.details.update.step2"|trans }}">
                    <div class="h-600">
                        <div id="tunnelMovementHistoryLoader" class="table-loader">
                            <div class="spinner-border"></div>
                        </div>
                        <div id="tunnelMovementHistoryTable" class="ag-theme-quartz h-600"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="contactModal" tabindex="-1" role="dialog"
         aria-hidden="true">
        <div class="modal-dialog hugeModal" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ 'contact.add.title' | trans }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    {% include 'view/contact/_formContactModal.twig' %}
                </div>
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="companyModal" tabindex="-1" role="dialog"
         aria-hidden="true">
        <div class="modal-dialog hugeModal" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ 'company.add.title' | trans }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    {{ include('view/company/_formCompanyModal.html.twig') }}
                </div>
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="msgLastAction" tabindex="-1" role="dialog"
         aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title"> {{ 'company.formCompany.msgLastAction' | trans }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body text-center">
                    <label for="lastActionTextArea"></label>
                    <textarea id="lastActionTextArea" class="form-control" rows="3"></textarea>
                </div>
            </div>
        </div>
    </div>

    {% include 'view/file/_modalFile.html.twig' with {add: 1, entity: tunnelMovement} %}

{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        let translations = {
            date: "{{ 'tunnelMovement.update.table.date'|trans }}",
            actionType: "{{ 'tunnelMovement.update.table.actionType'|trans }}",
            user: "{{ 'tunnelMovement.update.table.user'|trans }}",
            company: "{{ 'tunnelMovement.update.table.company'|trans }}",
            contact: "{{ 'tunnelMovement.update.table.contact'|trans }}",
            comment: "{{ 'tunnelMovement.update.table.comment'|trans }}",
            closingComment: "{{ 'tunnelMovement.update.table.closingComment'|trans }}",
            trackingNumber: "{{ 'tunnelMovement.formTunnelMovement.trackingNumber'|trans }}",
            name: "{{ 'file.name'|trans }}",
            fileDate: "{{ 'file.date'|trans }}",
            hour: "{{ 'file.hour'|trans }}",
            type: "{{ 'file.type'|trans }}",
            actions: "{{ 'file.actions'|trans }}",
        };
    </script>
    <script src="{{ asset('bootstrap-4.4.1/js/select2.min.js') }}"></script>
    <script src="{{ asset('clockpicker-gh-pages/dist/bootstrap-clockpicker.min.js') }}"></script>
    <script type="text/javascript" charset="utf8" src="{{ asset('js/signaletique/file/file.js') }}"></script>
    <script type="text/javascript" charset="utf8"
            src="{{ asset('js/signaletique/salesTunnel/formSalesTunnel.js') }}"></script>
{% endblock %}