{% extends '@MauticCore/Default/content.html.twig' %}

{% block headerTitle %}{{ 'mautic.dashboard.import'|trans }}{% endblock %}

{% block mauticContent %}dashboardImport{% endblock %}

{% block content %}
  <div class="row">
    {% if dashboards %}
        <div class="col-sm-6">
            <div class="ml-sm mt-sm pa-sm">
                <div class="panel panel-info">
                    <div class="panel-heading">
                        <div class="panel-title">{{ 'mautic.dashboard.predefined'|trans }}</div>
                    </div>
                    <div class="panel-body">
                        <div class="list-group">
                            {% for dashboard, config in dashboards %}
                                <div class="list-group-item {{ (dashboard == preview) ? 'active' : '' }}">
                                    <h4 class="list-group-item-heading">{{ config.name|purify }}</h4>
                                    {% if config.description is not empty %}<p class="small">{{ config.description|purify }}</p>{% endif %}
                                    <p class="list-group-item-heading">
                                        <a href="{{ path('mautic_dashboard_action', {'objectAction': 'import', 'preview': dashboard}) }}">
                                            {{ 'mautic.dashboard.preview'|trans }}
                                        </a>&#183;
                                        <a href="{{ path('mautic_dashboard_action', {'objectAction': 'applyDashboardFile', 'file': config.type~'.'~dashboard}) }}">
                                            {{ 'mautic.core.form.apply'|trans }}
                                        </a>{% if 'user' == config.type %}&#183;
                                        <a href="{{ path('mautic_dashboard_action', {'objectAction': 'deleteDashboardFile', 'file': config.type~'.'~dashboard}) }}" data-toggle="confirmation" data-message="{{ 'mautic.dashboard.delete_layout'|trans|e }}" data-confirm-text="{{ 'mautic.core.form.delete'|trans|e }}" data-confirm-callback="executeAction" data-cancel-text="{{ 'mautic.core.form.cancel'|trans|e }}">
                                            {{ 'mautic.core.form.delete'|trans }}
                                        </a>{% endif %}
                                    </p>
                                </div>
                            {% endfor %}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    {% endif %}
      <div class="col-sm-6">
          <div class="mr-sm mt-sm pa-sm">
              <div class="panel panel-info">
                  <div class="panel-heading">
                      <div class="panel-title">{{ 'mautic.dashboard.import.start.instructions'|trans }}</div>
                  </div>
                  <div class="panel-body">
                      {{ form_start(form) }}
                      <div class="input-group well mt-lg">
                          {{ form_widget(form.file) }}
                          <span class="input-group-btn">
                              {{ form_widget(form.start) }}
                          </span>
                      </div>
                      {{ form_end(form) }}
                  </div>
              </div>
          </div>
      </div>
  </div>
  {% if widgets %}
      <div class="col-md-12">
          <h2>{{ 'mautic.dashboard.widgets.preview'|trans }}</h2>
      </div>
      <div id="dashboard-widgets" class="dashboard-widgets cards">
          {% for widget in widgets %}
              <div class="card-flex widget" data-widget-id="{{ widget.id }}" style="width: {{ widget.width|default('100') }}%; height: {{ widget.height|default('300') }}px;">
                  {{ include('@MauticDashboard/Widget/detail.html.twig', {widget}) }}
              </div>
          {% endfor %}
      </div>
  {% endif %}
{% endblock %}