Style file upload list

This commit is contained in:
Ryan Scherler
2020-04-01 17:25:27 -07:00
parent 6c08559c28
commit 7da21e8d65
5 changed files with 31 additions and 35 deletions
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -1,4 +1,4 @@
{
"/js/app.js": "/js/app.js?id=f4941a7bc57a4dca4d67",
"/css/app.css": "/css/app.css?id=bba1bcfffecd01143f63"
"/css/app.css": "/css/app.css?id=a88110952df6713aa32e"
}
+2
View File
@@ -26,4 +26,6 @@ return [
'updated_at' => 'Last updated',
'remove' => 'Remove :item',
];
+17 -7
View File
@@ -32,14 +32,24 @@
@if ($this->form_data[$field->name])
<ul class="mb-2">
@foreach ($this->form_data[$field->name] as $key => $value)
<li>
<a href="{{ Storage::url($value['file']) }}" target="_blank" rel="noopener noreferrer">
{{ $this->fileIcon($value['mime_type']) }}
{{ $value['name'] }}
<li class="text-sm leading-5 bg-gray-50 dark:bg-gray-700 rounded overflow-hidden shadow flex items-center justify-between">
<a href="{{ Storage::url($value['file']) }}"
target="_blank"
rel="noopener noreferrer"
class="p-2 flex-grow flex items-center mr-2"
>
{{ Filament::svg($this->fileIcon($value['mime_type']), 'flex-shrink-0 w-5 h-5 mr-2') }}
<span class="flex-grow">
{{ $value['name'] }}
</span>
</a>
<button onclick="confirm('{{ __('Are you sure?') }}')"
wire:click.prevent="arrayRemove('{{ $field->name }}', '{{ $key }}')">
remove
<button type="button"
onclick="confirm('{{ __('Are you sure?') }}') || event.stopImmediatePropagation();"
wire:click.prevent="arrayRemove('{{ $field->name }}', '{{ $key }}')"
class="flex-shrink-0 flex items-center p-2"
>
{{ Filament::svg('heroicons/outline-md/md-x', 'h-4 w-4 text-red-500') }}
<span class="sr-only">{{ __('filament::admin.remove', ['item' => $value['name']]) }}</span>
</button>
</li>
@endforeach
+10 -26
View File
@@ -67,35 +67,19 @@ trait UploadsFiles
public function fileIcon($mime_type)
{
$icons = [
'image' => 'fa-file-image',
'audio' => 'fa-file-audio',
'video' => 'fa-file-video',
'application/pdf' => 'fa-file-pdf',
'application/msword' => 'fa-file-word',
'application/vnd.ms-word' => 'fa-file-word',
'application/vnd.oasis.opendocument.text' => 'fa-file-word',
'application/vnd.openxmlformats-officedocument.wordprocessingml' => 'fa-file-word',
'application/vnd.ms-excel' => 'fa-file-excel',
'application/vnd.openxmlformats-officedocument.spreadsheetml' => 'fa-file-excel',
'application/vnd.oasis.opendocument.spreadsheet' => 'fa-file-excel',
'application/vnd.ms-powerpoint' => 'fa-file-powerpoint',
'application/vnd.openxmlformats-officedocument.presentationml' => 'fa-file-powerpoint',
'application/vnd.oasis.opendocument.presentation' => 'fa-file-powerpoint',
'text/plain' => 'fa-file-alt',
'text/html' => 'fa-file-code',
'application/json' => 'fa-file-code',
'application/vnd.openxmlformats-officedocument.wordprocessingml.document' => 'fa-file-word',
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' => 'fa-file-excel',
'application/vnd.openxmlformats-officedocument.presentationml.presentation' => 'fa-file-powerpoint',
'application/gzip' => 'fa-file-archive',
'application/zip' => 'fa-file-archive',
'application/x-zip-compressed' => 'fa-file-archive',
'application/octet-stream' => 'fa-file-archive',
'image' => 'heroicons/outline-md/md-photograph',
'audio' => 'heroicons/outline-md/md-volume-up',
'video' => 'heroicons/outline-md/md-ticket',
'application/pdf' => 'heroicons/outline-md/md-book-open',
'text/html' => 'heroicons/outline-md/md-code',
];
if (isset($icons[$mime_type])) return $icons[$mime_type];
if (isset($icons[$mime_type])) {
return $icons[$mime_type];
}
$mime_group = explode('/', $mime_type, 2)[0];
return (isset($icons[$mime_group])) ? $icons[$mime_group] : 'fa-file';
return (isset($icons[$mime_group])) ? $icons[$mime_group] : 'heroicons/outline-md/md-document';
}
}