svg
This commit is contained in:
@ -1,124 +0,0 @@
|
||||
<div id="file-browser-{{ domain }}-{{ id|e('html_attr') }}"
|
||||
class="file-browser"
|
||||
data-domain="{{ domain }}"
|
||||
data-id="{{ id }}"
|
||||
data-base-path="{{ path('app_files', { domain: domain, id: id, editable: editable }) }}"
|
||||
data-current-path="{{ path }}">
|
||||
|
||||
<div class="card mt-3">
|
||||
<div class="card-header">Fichiers</div>
|
||||
<div class="card-body">
|
||||
|
||||
{% if editable %}
|
||||
<div class="mb-3">
|
||||
<a class="btn btn-info" style="max-width:100%; margin-bottom:15px;" data-bs-toggle="modal" data-bs-target="#mymodal" onClick="ModalLoad('mymodal','Upload','{{ path('app_files_uploadmodal',{domain:domain, id:id,path:path}) }}');" title='Upload'>Upload</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<p><strong>Chemin :</strong> {{ path ?: '/' }}</p>
|
||||
|
||||
{% set parentPath = path|split('/')|slice(0, -1)|join('/') %}
|
||||
|
||||
<ul class="list-unstyled">
|
||||
{% if path %}
|
||||
<li><a href="#" class="file-nav" data-path="{{ parentPath }}">⬅️ ..</a></li>
|
||||
{% endif %}
|
||||
|
||||
{% for file in files %}
|
||||
<li>
|
||||
{% if file.isDirectory %}
|
||||
📁 <a href="#" class="file-nav" data-path="{{ path ? path ~ '/' ~ file.name : file.name }}">{{ file.name }}/</a>
|
||||
{% if editable %}
|
||||
<button class="btn btn-sm btn-danger btn-delete ms-2" data-path="{{ file.path }}">🗑️</button>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
📄 {{ file.name }}
|
||||
{% if editable %}
|
||||
<button class="btn btn-sm btn-danger btn-delete ms-2" data-path="{{ file.path }}">🗑️</button>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</li>
|
||||
{% else %}
|
||||
<li><em>Dossier vide</em></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function () {
|
||||
function refreshContainer(containerId, path) {
|
||||
const $oldContainer = $('#' + containerId);
|
||||
const base = $oldContainer.data('base-path');
|
||||
|
||||
$.get(base, { path: path }, function (html) {
|
||||
console.log(html);
|
||||
const $doc = $('<div>').html(html);
|
||||
const $newContainer = $doc.find('#' + containerId);
|
||||
console.log(containerId);
|
||||
if ($newContainer.length) {
|
||||
console.log("HHHHHHHHHHHHHHHHHHHH");
|
||||
$oldContainer.replaceWith($newContainer);
|
||||
initFileBrowser($newContainer); // rebind events
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function initFileBrowser($container) {
|
||||
const containerId = $container.attr('id');
|
||||
|
||||
// Clear any previous bindings (important!)
|
||||
$container.off('click');
|
||||
|
||||
// Navigation dossier
|
||||
$container.on('click', '.file-nav', function (e) {
|
||||
e.preventDefault();
|
||||
const path = $(this).data('path');
|
||||
refreshContainer(containerId, path);
|
||||
});
|
||||
|
||||
// Suppression fichier ou dossier
|
||||
$container.on('click', '.btn-delete', function (e) {
|
||||
e.preventDefault();
|
||||
if (!confirm('Supprimer ce fichier ?')) return;
|
||||
|
||||
const pathToDelete = $(this).data('path');
|
||||
const currentPath = $container.data('current-path');
|
||||
|
||||
$.ajax({
|
||||
url: '/user/file/' + $container.data('domain') + '/' + $container.data('id') + '/delete',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
data: JSON.stringify({ path: pathToDelete }),
|
||||
success: function (res) {
|
||||
if (res.success) {
|
||||
refreshContainer(containerId, currentPath);
|
||||
} else {
|
||||
alert('Erreur : ' + res.error);
|
||||
}
|
||||
},
|
||||
error: function (xhr) {
|
||||
alert('Erreur lors de la suppression : ' + xhr.responseText);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Init navigateur fichiers
|
||||
const containerId = 'file-browser-{{ domain }}-{{ id|e('html_attr') }}';
|
||||
const $browser = $('#' + containerId);
|
||||
initFileBrowser($browser);
|
||||
|
||||
// Rafraîchir après fermeture modale
|
||||
$('#mymodal').on('hidden.bs.modal', function () {
|
||||
const $browser = $('#' + containerId);
|
||||
const currentPath = $browser.data('current-path') || '';
|
||||
refreshContainer(containerId, currentPath);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
@ -1,45 +0,0 @@
|
||||
{% extends 'base.html.twig' %}
|
||||
|
||||
{% block localstyle %}
|
||||
<style>
|
||||
body {
|
||||
background-color: transparent;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<a class="btn btn-secondary" onClick="closeModal();">Annuler</a>
|
||||
<form action="{{ path('app_files_uploadfile', {
|
||||
domain: domain,
|
||||
id: id,
|
||||
path: path
|
||||
}) }}"
|
||||
class="dropzone" id="myDropzone" style="margin-top:10px"></form>
|
||||
{% endblock %}
|
||||
|
||||
{% block localscript %}
|
||||
<script>
|
||||
Dropzone.options.myDropzone = {
|
||||
paramName: "{{endpoint}}",
|
||||
maxFilesize: 20, // MB
|
||||
parallelUploads: 5,
|
||||
uploadMultiple: false,
|
||||
dictDefaultMessage: "Déposez vos fichiers ici pour les téléverser",
|
||||
successmultiple: function (files, response) {
|
||||
console.log("multi uploaded", files);
|
||||
},
|
||||
queuecomplete: function () {
|
||||
// Quand tous les fichiers sont uploadés, on ferme la modale et rafraîchit le navigateur
|
||||
window.parent.$("#mymodal").modal('hide');
|
||||
if (typeof window.parent.refreshFileBrowser === 'function') {
|
||||
window.parent.refreshFileBrowser(); // à définir côté parent
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function closeModal() {
|
||||
window.parent.$("#mymodal").modal('hide');
|
||||
}
|
||||
</script>
|
||||
{% endblock %}
|
||||
@ -35,7 +35,7 @@
|
||||
</div>
|
||||
|
||||
{% if mode=="update" %}
|
||||
{{ render(path("app_files",{domain:'project',id:project.id, editable:1})) }}
|
||||
{{ render(path("bninefiles_files",{domain:'project',id:project.id, editable:1})) }}
|
||||
{% endif %}
|
||||
{{ form_end(form) }}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user