{% 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 %}
        {% include 'view/header/_help.html.twig' %}

        <!-- box -->
        <div class="row">
            <div class="col-sm-12 col-md-12">
                <input id="user" type="hidden" value="{{ app.user.id }}" />
                <div class="content-box content-lighten" data-step="1"
                     data-intro="{{ "help.details.add.step1"|trans }}">
                    <h2 class="mb-3 text-center"> {{ "company.formCompany.createTunnelMovement"|trans }}
                        - {% if salesTunnel %} {{ salesTunnel.name }} {% else %} {{ "tunnelMovement.list.titleNoSalesTunnel"|trans }} {% endif %}</h2>
                    {{ form_start(formTunnelMovement) }}
                    {{ form_errors(formTunnelMovement) }}
                    <div class="form-row">
                        <div class="col-sm-6 col-md-6">
                            {{ form_row(formTunnelMovement.user) }}
                            {{ form_row(formTunnelMovement.actionType) }}
                            <div class="form-row">
                                <div class="form-group col-md-12">
                                    {{ form_label(formTunnelMovement.company) }}
                                    <div class="form-row">
                                        <div class="form-group col-md-9">
                                            {{ form_widget(formTunnelMovement.company) }}
                                            {{ form_help(formTunnelMovement.company) }}
                                        </div>
                                        <div class="form-group col-md-3">
                                            <button type="button" class="btn btn-info" data-toggle="modal"
                                                    data-target="#companyModal" data-placement="right"
                                                    data-tooltip="tooltipAddCompany"
                                                    title="{{ "tooltip.addCompany"|trans }}">
                                                <i class="fas fa-plus"></i>
                                            </button>
                                            <a class="btn btn-success" id="infoCompany"
                                               data-tooltip="tooltipInfoCompany"
                                               data-placement="right" title="Info Company" target="_blank">
                                                <i class="far fa-id-card"></i>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-md-12">
                                    {{ form_label(formTunnelMovement.address) }}
                                    <div class="form-row">
                                        <div class="form-group col-md-12">
                                            {{ form_widget(formTunnelMovement.address) }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {{ form_label(formTunnelMovement.contactText) }}
                            <div class="form-row">
                                <div class="form-group col-md-12">
                                    {{ form_widget(formTunnelMovement.contactText) }}
                                </div>
                            </div>
{#                            {{ form_label(formTunnelMovement.contact) }}#}
{#                            <div class="form-row">#}
{#                                <div class="form-group col-md-10">#}
{#                                    {{ form_widget(formTunnelMovement.contact) }}#}
{#                                </div>#}
{#                                <div class="form-group col-md-2 d-inline">#}
{#                                    <button type="button" class="btn btn-info" data-toggle="modal"#}
{#                                            id="addContact"#}
{#                                            data-target="#contactModal" data-placement="right"#}
{#                                            data-tooltip="tooltipAddContact"#}
{#                                            title="{{ 'tooltip.addContact'| trans }}">#}
{#                                        <i class="fas fa-plus"></i>#}
{#                                    </button>#}
{#                                    <a class="btn btn-success" id="infoContact"#}
{#                                       data-tooltip="tooltipInfoContact"#}
{#                                       data-placement="right" title="Info contact" target="_blank">#}
{#                                        <i class="far fa-id-card"></i>#}
{#                                    </a>#}
{#                                </div>#}
{#                            </div>#}
                            {{ form_row(formTunnelMovement.comment) }}
                            <div class="form-row ">
                                <div class="form-group col-md-12 text-center ">
                                    <div class="form-group form-check mt-2">
                                        <input type="checkbox" class="form-check-input" id="enableTrackingNumber">
                                        <label class="form-check-label"
                                               for="enableTrackingNumber">{{ "tunnelMovement.formTunnelMovement.trackingNumber" | trans }}</label>
                                    </div>
                                </div>
                                <div class="form-group col-md-12 ">
                                    {{ form_row(formTunnelMovement.trackingNumber) }}
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6 col-md-6">
                            {{ form_row(formTunnelMovement.actionDate) }}
                            <div class="row">
                                <div class="col-sm-6 col-md-6">
                                    {{ form_row(formTunnelMovement.time) }}
                                </div>
                                <div class="col-sm-6 col-md-6">
                                    {{ form_row(formTunnelMovement.endTime) }}
                                </div>
                            </div>
                            {{ form_row(formTunnelMovement.note) }}
                            {{ form_row(formTunnelMovement.opportunityEstimation) }}
                            <div class="col-sm-12 col-md-12 mt-5 text-center">
                                {{ form_row(formTunnelMovement.map) }}
                                {{ form_row(formTunnelMovement.isOutlook) }}
                                {{ form_row(formTunnelMovement.alert) }}
                            </div>
                        </div>
                    </div>
                    <div class="text-right">
                        {{ form_row(formTunnelMovement.submit) }}
                        {{ form_end(formTunnelMovement, {"render_rest":false}) }}
                    </div>
                </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="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>

{% endblock %}
{% block javascripts %}
    {{ encore_entry_script_tags('app') }}
    <!-- Javascript library -->
    <script src="{{ asset('js/jquery.js') }}"></script>
    <script src="{{ asset('bootstrap-4.4.1/js/bootstrap.bundle.js') }}"></script>
    <script src="{{ asset('lib/select2/select2.min.js') }}"></script>
    <script src="{{ asset('lib/intro/intro.min.js') }}"></script>
    <script src="{{ asset('lib/fontAwesome/fontAwesome.js') }}" crossorigin="anonymous"></script>
    <script src="{{ asset('lib/sweetAlert/sweetAlert.js') }}"></script>
    <script src="{{ asset('js/navbar/perfect-scrollbar.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/navbar/sidebar.menu.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/navbar/nanobar.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/global.js') }}" type="text/javascript"></script>
    <script src="{{ asset('clockpicker-gh-pages/dist/bootstrap-clockpicker.min.js') }}"></script>
    {% include 'view/library/_popover.html.twig' %}
    <script type="text/javascript" src="{{ asset('js/signaletique/salesTunnel/formCreateSalesTunnel.js') }}"></script>
{% endblock %}