Files
jabali-panel/resources/views/filament/jabali/pages/files.blade.php
2026-02-06 02:47:43 +00:00

99 lines
4.3 KiB
PHP

<x-filament-panels::page>
{{-- Warning Banner --}}
<x-filament::section
icon="heroicon-o-exclamation-triangle"
icon-color="warning"
>
<x-slot name="heading">
{{ __('Warning') }}
</x-slot>
<x-slot name="description">
{{ __('Deleting or modifying system files can break your website. Avoid editing files in the') }}
<code class="px-1.5 py-0.5 rounded bg-warning-100 dark:bg-warning-900/50 fi-color-warning fi-text-color-700 dark:fi-text-color-300 font-mono fi-section-header-description">{{ __('conf') }}</code>
{{ __('and') }}
<code class="px-1.5 py-0.5 rounded bg-warning-100 dark:bg-warning-900/50 fi-color-warning fi-text-color-700 dark:fi-text-color-300 font-mono fi-section-header-description">{{ __('logs') }}</code>
{{ __('folders unless you know what you are doing.') }}
</x-slot>
</x-filament::section>
{{-- Breadcrumbs --}}
<nav class="fi-breadcrumbs mb-4">
<ol class="flex flex-wrap items-center gap-x-2">
@foreach($this->getPathBreadcrumbs() as $crumb)
<li class="flex items-center gap-x-2">
@if(!$loop->first)
<x-filament::icon
icon="heroicon-m-chevron-right"
:size="\Filament\Support\Enums\IconSize::Small"
class="fi-color-gray fi-text-color-400"
/>
@endif
@if($loop->last)
<span class="fi-section-header-description">
{{ $crumb['name'] }}
</span>
@else
<x-filament::link
tag="button"
wire:click="navigateTo('{{ $crumb['path'] }}')"
:icon="$loop->first ? 'heroicon-o-home' : null"
size="sm"
>
{{ $crumb['name'] }}
</x-filament::link>
@endif
</li>
@endforeach
</ol>
</nav>
{{-- File Table --}}
<div id="file-dropzone" class="transition-all duration-200">
{{ $this->table }}
</div>
<x-filament-actions::modals />
{{-- Handle upload errors globally --}}
<div x-data x-on:livewire-upload-error.window="$wire.showUploadError()"></div>
@script
<script>
// File download handler
$wire.on('download-file', ({ content, filename }) => {
const blob = new Blob([Uint8Array.from(atob(content), c => c.charCodeAt(0))]);
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
});
// File dropzone for uploads
const dropzone = document.getElementById('file-dropzone');
if (dropzone) {
['dragenter','dragover','dragleave','drop'].forEach(e => dropzone.addEventListener(e, ev => { ev.preventDefault(); ev.stopPropagation(); }));
['dragenter','dragover'].forEach(e => dropzone.addEventListener(e, () => dropzone.classList.add('ring-2', 'ring-primary-500', 'ring-offset-2', 'dark:ring-offset-gray-900')));
['dragleave','drop'].forEach(e => dropzone.addEventListener(e, () => dropzone.classList.remove('ring-2', 'ring-primary-500', 'ring-offset-2', 'dark:ring-offset-gray-900')));
dropzone.addEventListener('drop', async e => {
const files = e.dataTransfer?.files;
if (files?.length) {
for (const file of files) {
const reader = new FileReader();
reader.onload = () => {
const base64 = reader.result.split(',')[1];
$wire.uploadDroppedFile(file.name, base64);
};
reader.readAsDataURL(file);
}
}
});
}
</script>
@endscript
</x-filament-panels::page>