{% set firstView = fsc.views | first %}
{% set doc = firstView.model %}
{% set currentView = fsc.getCurrentView() %}
{% set hasNextcloudFolder = doc.nextcloud_folder is defined and doc.nextcloud_folder %}
{% set ncFolder = hasNextcloudFolder ? '/' ~ doc.nextcloud_folder|trim('/') : '' %}
{% set nextcloudPreview = currentView.settings.nextcloudPreview ?? null %}

<div class="container-fluid">
    <div class="form-row">
        <div class="col-sm-12">
            {% if fsc.permissions.allowUpdate %}
                <form action="{{ doc.url() }}" method="post" enctype="multipart/form-data"
                      onsubmit="animateSpinner('add')">
                    <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                    <input type="hidden" name="action" value="add-file"/>
                    {{ formToken() }}
                    <div class="card border-success shadow mb-3">
                        <div class="card-body p-3">
                            <h5 class="card-title">
                                <i class="fas fa-folder-plus fa-fw"></i> {{ trans('add') }}
                            </h5>
                            <div class="form-group">
                                <textarea name="observations" class="form-control"
                                          placeholder="{{ trans('observations') }}"></textarea>
                            </div>
                            <div class="form-row align-items-end">
                                <div class="col">
                                    <input type="file" name="new-files[]" class="form-control-file" multiple required/>
                                    <p class="text-muted mb-0">
                                        {{ trans('help-server-accepts-filesize', {'%size%': currentView.model.getMaxFileUpload()}) }}
                                    </p>
                                    {% for includeView in getIncludeViews('DocFiles', 'formAddBody') %}
                                        {% include includeView['path'] %}
                                    {% endfor %}
                                </div>
                                <div class="col text-right">
                                    <button type="submit" class="btn btn-sm btn-success">
                                        <i class="fas fa-save fa-fw" aria-hidden="true"></i> {{ trans('save') }}
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            {% endif %}
            {% if fsc.permissions.allowUpdate and hasNextcloudFolder %}
                <form action="{{ doc.url() }}" method="post" onsubmit="animateSpinner('add')">
                    <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                    <input type="hidden" name="action" value="nextcloud-preview"/>
                    {{ formToken() }}
                    <div class="card border-info shadow mb-3">
                        <div class="card-body p-3 d-flex justify-content-between align-items-center">
                            <div>
                                <i class="fas fa-cloud-download-alt fa-fw"></i> Importar desde Nextcloud
                                <small class="text-muted d-block">Carpeta: {{ ncFolder }}</small>
                                <small class="text-muted d-block">Solo carpeta raiz</small>
                            </div>
                            <div class="btn-group">
                                <button type="submit" class="btn btn-sm btn-outline-info"
                                        onclick="this.form.action.value='nextcloud-preview';">
                                    <i class="fas fa-list-ul fa-fw" aria-hidden="true"></i> Previsualizar
                                </button>
                                <button type="submit" class="btn btn-sm btn-info"
                                        onclick="this.form.action.value='nextcloud-import';">
                                    <i class="fas fa-sync fa-fw" aria-hidden="true"></i> Importar todo
                                </button>
                            </div>
                        </div>
                    </div>
                </form>
            {% endif %}

            {% if fsc.permissions.allowUpdate and hasNextcloudFolder and nextcloudPreview is not null %}
                {% set previewError = '' %}
                {% if nextcloudPreview.error == 'record-not-found' %}
                    {% set previewError = 'Registro no encontrado.' %}
                {% elseif nextcloudPreview.error == 'nextcloud-missing-credentials' %}
                    {% set previewError = 'Configura las credenciales de Nextcloud en el usuario.' %}
                {% elseif nextcloudPreview.error == 'nextcloud-missing-folder' %}
                    {% set previewError = 'Asigna una carpeta de Nextcloud antes de previsualizar.' %}
                {% elseif nextcloudPreview.error == 'nextcloud-list-failed' %}
                    {% set previewError = 'No se pudo listar la carpeta de Nextcloud.' %}
                {% endif %}

                {% if previewError %}
                    <div class="alert alert-warning mb-3">
                        <i class="fas fa-exclamation-triangle fa-fw"></i> {{ previewError }}
                    </div>
                {% elseif nextcloudPreview.items is empty %}
                    <div class="alert alert-info mb-3">
                        <i class="fas fa-info-circle fa-fw"></i> No hay archivos para importar en {{ ncFolder }}.
                    </div>
                {% else %}
                    {% set hasSelectable = false %}
                    {% for item in nextcloudPreview.items %}
                        {% if not item.exists %}
                            {% set hasSelectable = true %}
                        {% endif %}
                    {% endfor %}
                    <form action="{{ doc.url() }}" method="post" onsubmit="animateSpinner('add')">
                        <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                        <input type="hidden" name="action" value="nextcloud-import"/>
                        {{ formToken() }}
                        <div class="card border-info shadow mb-3">
                            <div class="card-body p-3">
                                <h6 class="mb-2">
                                    <i class="fas fa-list-ul fa-fw"></i> Previsualizacion de archivos
                                </h6>
                                {% if not hasSelectable %}
                                    <div class="alert alert-info mb-2">
                                        <i class="fas fa-check-circle fa-fw"></i> Todos los archivos ya estan importados.
                                    </div>
                                {% endif %}
                                <div class="table-responsive">
                                    <table class="table table-sm mb-0">
                                        <thead>
                                        <tr>
                                            <th style="width: 36px;"></th>
                                            <th>Archivo</th>
                                            <th class="text-right">Tamano</th>
                                            <th class="text-right">Modificado</th>
                                            <th>Estado</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        {% for item in nextcloudPreview.items %}
                                            {% set checkboxId = 'nc-file-' ~ loop.index %}
                                            <tr>
                                                <td>
                                                    <input type="checkbox" id="{{ checkboxId }}" name="nextcloud_files[]"
                                                           value="{{ item.name }}"
                                                           {% if item.exists %}disabled{% else %}checked{% endif %}/>
                                                </td>
                                                <td>
                                                    <label for="{{ checkboxId }}" class="mb-0 {% if item.exists %}text-muted{% endif %}">
                                                        {{ item.name }}
                                                    </label>
                                                </td>
                                                <td class="text-right">{{ item.size }}</td>
                                                <td class="text-right">
                                                    {% if item.mtime %}
                                                        {{ item.mtime|date('Y-m-d H:i') }}
                                                    {% endif %}
                                                </td>
                                                <td>
                                                    {% if item.exists %}
                                                        <span class="text-muted">Ya importado</span>
                                                    {% else %}
                                                        <span class="text-success">Nuevo</span>
                                                    {% endif %}
                                                </td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div class="card-footer p-2 text-right">
                                <button type="submit" class="btn btn-sm btn-info">
                                    <i class="fas fa-sync fa-fw" aria-hidden="true"></i> Importar seleccionados
                                </button>
                            </div>
                        </div>
                    </form>
                {% endif %}
            {% endif %}

            <div class="card-columns">
                {% for docfile in currentView.cursor %}
                    {% set file = docfile.getFile() %}
                    {% set ncPath = file.nextcloud_path ?? '' %}
                    {% set downloadUrl = ncPath ? 'Nextcloud?action=download&path=' ~ ncPath|url_encode : file.url('download-permanent') %}
                    {% set previewUrl = ncPath ? downloadUrl : file.url('download') %}
                    <form action="{{ doc.url() }}" method="post" enctype="multipart/form-data"
                          onsubmit="animateSpinner('add')">
                        <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                        <input type="hidden" name="id" value="{{ docfile.id }}"/>
                        <input type="hidden" name="action" value=""/>
                        {{ formToken() }}
                        <div class="card shadow mb-3">
                            {% if file.isImage() %}
                                <a href="{{ downloadUrl }}">
                                    <img src="{{ previewUrl }}" class="card-img-top"
                                         alt="{{ file.filename }}">
                                </a>
                            {% else %}
                                <div class="pl-3 pt-3 pr-3">
                                    <a href="{{ downloadUrl }}"
                                       class="btn btn-block btn-lg btn-secondary">
                                        {% if file.isPdf() %}
                                            <i class="far fa-file-pdf fa-fw"></i>
                                        {% elseif file.isVideo() %}
                                            <i class="far fa-file-video fa-fw"></i>
                                        {% elseif file.isArchive() %}
                                            <i class="far fa-file-archive fa-fw"></i>
                                        {% else %}
                                            <i class="far fa-file fa-fw"></i>
                                        {% endif %}
                                        {{ file.filename | raw }}
                                    </a>
                                </div>
                            {% endif %}
                            <div class="card-body p-3">
                                <div class="form-group">
                                <textarea name="observations" class="form-control"
                                          placeholder="{{ trans('observations') }}">{{ docfile.observations | raw }}</textarea>
                                </div>
                                {% for includeView in getIncludeViews('DocFiles', 'formEditBody') %}
                                    {% include includeView['path'] %}
                                {% endfor %}
                                <p class="card-text text-muted">
                                    {% if docfile.nick %}
                                        <i class="fas fa-user"></i> {{ docfile.nick }}
                                    {% endif %}
                                    <i class="fas fa-calendar-alt ml-3"></i> {{ docfile.creationdate }}
                                </p>
                            </div>
                            <div class="card-footer p-2">
                                {% if fsc.permissions.allowUpdate %}
                                    <button type="button" class="btn btn-sm btn-primary float-right"
                                            onclick="this.form.action.value='edit-file';this.form.onsubmit();this.form.submit();">
                                        <i class="fas fa-save fa-fw" aria-hidden="true"></i> {{ trans('save') }}
                                    </button>
                                {% endif %}
                                {% if fsc.permissions.allowDelete %}
                                    <div class="btn-group">
                                        <div class="dropdown">
                                            <button class="btn btn-sm btn-outline-danger dropdown-toggle" type="button"
                                                    data-toggle="dropdown" aria-haspopup="true"
                                                    aria-expanded="false">
                                                <i class="fas fa-trash-alt"></i>
                                            </button>
                                            <div class="dropdown-menu">
                                                <button type="button"
                                                        onclick="this.form.action.value='unlink-file';this.form.onsubmit();this.form.submit();"
                                                        class="dropdown-item">
                                                    <i class="fas fa-unlink fa-fw"></i> {{ trans('unlink-file') }}
                                                </button>
                                                <div class="dropdown-divider"></div>
                                                <button type="button"
                                                        onclick="this.form.action.value='delete-file';this.form.submit();"
                                                        class="dropdown-item">
                                                    <i class="far fa-trash-alt fa-fw"></i> {{ trans('delete-file') }}
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                {% endif %}
                            </div>
                        </div>
                    </form>
                {% endfor %}
            </div>
        </div>
    </div>
</div>