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

{% block title %}Import - index{% endblock %}

{% block body %}
    <h1>Mapping Description</h1>
    <p>If you want to import objects from a excel file (.xls). Please configure your mapping first!</p>

    <div class="well">
        <h2 style="margin:0;">Example Excel File:</h2>
        <table class="table table-bordered">
            <tr style="background:#ccc;">
                <td>#</td>
                <td>A</td>
                <td>B</td>
                <td>C</td>
                <td>D</td>
                <td>E</td>
                <td>F</td>
                <td>G</td>
            </tr>

            <tr>
                <td style="background:#ccc;">1</td>
                <td style="background:#ff0000;">parent (GUID or referenceId)</td>
                <td style="background:#ff0000;">referenceId</td>
                <td style="background:#ff0000;">name</td>
                <td style="background:#ff0000;">active</td>
                <td style="background:forestgreen;">attributeOne</td>
                <td style="background:forestgreen;">attributeTwo</td>
                <td style="background:forestgreen;">...</td>
            </tr>
            <tr>
                <td style="background:#ccc;">2</td>
                <td></td>
                <td>s00001</td>
                <td>Paris</td>
                <td>1</td>
                <td>Street 1</td>
                <td>City 1</td>
                <td>...</td>
            </tr>
            <tr>
                <td style="background:#ccc;">3</td>
                <td></td>
                <td>s00002</td>
                <td>London</td>
                <td>0</td>
                <td>Street 2</td>
                <td>City 2</td>
                <td>...</td>
            </tr>
            <tr>
                <td style="background:#ccc;">4</td>
                <td></td>
                <td>...</td>
                <td>...</td>
                <td>...</td>
                <td>...</td>
                <td>...</td>
                <td>...</td>
            </tr>
        </table>

        <p>The <span style="color:red;">red</span> columns are default fields (no mapping required).</p>
        <p>The <span style="color:forestgreen;">green</span> columns are dynamic fields, they can be mapped to
            attributes.</p>
    </div>

    <div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
         aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h2>Do you really want to delete this mapping?</h2>
                </div>
                <div class="modal-body">
                    <p>You are about to delete one mapping, this procedure is irreversible.</p>

                    <p>Do you want to proceed?</p>

                    <p>We hope that you know what you do!</a>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <a href="#" class="btn btn-danger danger">Delete</a>
                </div>
            </div>
        </div>
    </div>
    <div class="well">
        <h2 style="margin-top:0;">Currently mapped Attributes</h2>
        <hr/>

        <div class="row">
            <div class="col-md-12 col-ld-12">
                <div style="font-size: 20px;margin-bottom: 20px;" class="pull-right">
                    <span class="label label-success label-as-badge">count: {{ pagination.getTotalItemCount }}</span>
                </div>
                <table class="table">
                    <tr>
                        <th>columnName</th>
                        <th>attributeId</th>
                        <th>Action</th>
                    </tr>
                    {% for entity in pagination %}
                        <tr>
                            <td>{{ entity.columnName }}</td>
                            <td>{{ entity.objectValueId }}</td>
                            <td>
                                <a class="btn btn-default btn-xs"
                                   href="{{ path('_admin_backend_import_edit', {'id': entity.id}) }}">edit</a>
                                <a class="btn btn-danger btn-xs" data-toggle="modal" data-target="#confirm-delete"
                                   data-href="{{ path('_admin_backend_import_delete', {'id': entity.id}) }}" href="#">delete</a>
                            </td>
                        </tr>
                    {% endfor %}
                </table>
            </div>

            <div class="col-md-12 col-ld-12">
                <div class="navigation">
                    {{ knp_pagination_render(pagination) }}
                </div>
            </div>
        </div>

        <script>
            $(function () {
                $(".tt").tooltip();
            });
            $('#confirm-delete').on('show.bs.modal', function (e) {
                $(this).find('.danger').attr('href', $(e.relatedTarget).data('href'));
                //$('.debug-url').html('Delete URL: <strong>' + $(this).find('.danger').attr('href') + '</strong>');
            });

        </script>
        <a class="btn btn-danger" href="{{ path('_admin_backend_import_new') }}" title="add token">Add Mapping</a>
    </div>
    <hr/>
    <div class="well">
        <form action="" method="post">
            {{ form_errors(form) }}

            {{ form_row(form.attachment) }}

            {{ form_rest(form) }}

            <input class="btn btn-danger" type="submit" value="Import Excel File"/>
        </form>
    </div>
{% endblock %}
