diff --git a/app/Http/Controllers/Admin/ImageController.php b/app/Http/Controllers/Admin/ImageController.php index 574d4577..3f67a341 100644 --- a/app/Http/Controllers/Admin/ImageController.php +++ b/app/Http/Controllers/Admin/ImageController.php @@ -2,29 +2,78 @@ namespace App\Http\Controllers\Admin; +use App\Enums\ImagePermission; use App\Http\Controllers\Controller; use App\Models\Image; use App\Services\UserService; +use Illuminate\Database\Eloquent\Builder; use Illuminate\Database\Eloquent\Relations\BelongsTo; use Illuminate\Http\Request; use Illuminate\Http\Response; +use Illuminate\Support\Str; use Illuminate\View\View; class ImageController extends Controller { public function index(Request $request): View { - $statuses = []; $images = Image::query()->with(['user' => function (BelongsTo $belongsTo) { $belongsTo->withSum('images', 'size'); - }, 'album', 'group', 'strategy'])->latest()->paginate(40); + }, 'album', 'group', 'strategy'])->when($request->input('keywords'), function (Builder $builder, $keywords) { + $words = []; + $qualifiers = [ + 'name:', 'album:', 'group:', 'strategy:', 'email:', 'extension:', 'md5:', 'sha1:', 'ip:', 'is:', 'order:', + ]; + collect(array_filter(explode(' ', $keywords)))->filter(function ($keyword) use ($qualifiers, &$words) { + if (Str::startsWith($keyword, $qualifiers)) { + return true; + } + $words[] = $keyword; + return false; + })->each(function ($filter) use ($builder) { + match ($filter) { + 'is:public' => $builder->where('permission', ImagePermission::Public), + 'is:private' => $builder->where('permission', ImagePermission::Private), + 'is:unhealthy' => $builder->where('is_unhealthy', 1), + 'is:guest' => $builder->whereNull('user_id'), + 'is:adminer' => $builder->whereHas('user', fn (Builder $builder) => $builder->where('is_adminer', 1)), + 'order:earliest' => $builder->orderBy('created_at'), + 'order:utmost' => $builder->orderBy('size'), + 'order:least' => $builder->orderByDesc('size'), + default => 0, + }; + + [$qualifier, $value] = explode(':', $filter); + + if ($value) { + $callback = fn (Builder $builder) => $builder->where('name', $value); + match ($qualifier) { + 'name' => $builder->whereHas('user', $callback), + 'album' => $builder->whereHas('album', $callback), + 'group' => $builder->whereHas('group', $callback), + 'strategy' => $builder->whereHas('strategy', $callback), + 'email' => $builder->whereHas('user', fn (Builder $builder) => $builder->where('email', $value)), + 'extension' => $builder->where('extension', $value), + 'md5' => $builder->where('md5', $value), + 'sha1' => $builder->where('sha1', $value), + 'ip' => $builder->where('ip', $value), + default => 0 + }; + } + }); + + foreach ($words as $word) { + $builder->whereRaw("concat(origin_name,alias_name) like ?", ["%{$word}%"]); + } + })->latest()->paginate(40); $images->getCollection()->each(function (Image $image) { $image->append('url', 'pathname'); $image->album?->setVisible(['name']); $image->group?->setVisible(['name']); $image->strategy?->setVisible(['name']); }); - return view('admin.image.index', compact('images', 'statuses')); + + return view('admin.image.index', compact('images')); } public function update(): Response diff --git a/app/Http/Controllers/User/ImageController.php b/app/Http/Controllers/User/ImageController.php index f9634f17..1eaaa7fd 100644 --- a/app/Http/Controllers/User/ImageController.php +++ b/app/Http/Controllers/User/ImageController.php @@ -54,7 +54,7 @@ class ImageController extends Controller break; } })->when($request->query('keyword'), function (Builder $builder, $keyword) { - $builder->whereRaw("concat(IFNULL(origin_name,''),IFNULL(alias_name,'')) like ?", ["%{$keyword}%"]); + $builder->whereRaw("concat(origin_name,alias_name) like ?", ["%{$keyword}%"]); })->when((int) $request->query('album_id'), function (Builder $builder, $albumId) { $builder->where('album_id', $albumId); }, function (Builder $builder) { diff --git a/public/css/app.css b/public/css/app.css index b00cbff4..ecc34cdd 100644 --- a/public/css/app.css +++ b/public/css/app.css @@ -634,9 +634,6 @@ select { white-space: nowrap; border-width: 0; } -.pointer-events-none { - pointer-events: none; -} .visible { visibility: visible; } @@ -655,12 +652,6 @@ select { bottom: 0px; left: 0px; } -.-inset-px { - top: -1px; - right: -1px; - bottom: -1px; - left: -1px; -} .top-1 { top: 0.25rem; } @@ -700,12 +691,6 @@ select { .bottom-2 { bottom: 0.5rem; } -.top-4 { - top: 1rem; -} -.right-4 { - right: 1rem; -} .left-1 { left: 0.25rem; } @@ -739,12 +724,6 @@ select { .m-2 { margin: 0.5rem; } -.-m-0\.5 { - margin: -0.125rem; -} -.-m-0 { - margin: -0px; -} .my-6 { margin-top: 1.5rem; margin-bottom: 1.5rem; @@ -796,15 +775,18 @@ select { .mt-1 { margin-top: 0.25rem; } +.mt-4 { + margin-top: 1rem; +} +.ml-4 { + margin-left: 1rem; +} .mt-5 { margin-top: 1.25rem; } .mb-3 { margin-bottom: 0.75rem; } -.mt-4 { - margin-top: 1rem; -} .mt-6 { margin-top: 1.5rem; } @@ -820,9 +802,6 @@ select { .mr-2 { margin-right: 0.5rem; } -.ml-4 { - margin-left: 1rem; -} .mt-8 { margin-top: 2rem; } @@ -832,15 +811,15 @@ select { .-mt-px { margin-top: -1px; } -.mr-4 { - margin-right: 1rem; -} .-ml-1 { margin-left: -0.25rem; } .mr-3 { margin-right: 0.75rem; } +.mr-4 { + margin-right: 1rem; +} .-mr-2 { margin-right: -0.5rem; } @@ -862,9 +841,6 @@ select { .grid { display: grid; } -.contents { - display: contents; -} .hidden { display: none; } @@ -886,12 +862,12 @@ select { .h-6 { height: 1.5rem; } -.h-80 { - height: 20rem; -} .h-20 { height: 5rem; } +.h-80 { + height: 20rem; +} .h-screen { height: 100vh; } @@ -913,9 +889,6 @@ select { .h-4 { height: 1rem; } -.h-40 { - height: 10rem; -} .h-36 { height: 9rem; } @@ -994,9 +967,6 @@ select { .flex-1 { flex: 1 1 0%; } -.flex-shrink-0 { - flex-shrink: 0; -} .shrink-0 { flex-shrink: 0; } @@ -1096,12 +1066,6 @@ select { .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } -.grid-cols-4 { - grid-template-columns: repeat(4, minmax(0, 1fr)); -} -.grid-cols-12 { - grid-template-columns: repeat(12, minmax(0, 1fr)); -} .flex-row { flex-direction: row; } @@ -1117,9 +1081,6 @@ select { .flex-nowrap { flex-wrap: nowrap; } -.items-start { - align-items: flex-start; -} .items-center { align-items: center; } @@ -1147,13 +1108,6 @@ select { .gap-2 { gap: 0.5rem; } -.gap-y-8 { - row-gap: 2rem; -} -.gap-x-6 { - -moz-column-gap: 1.5rem; - column-gap: 1.5rem; -} .space-y-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); @@ -1343,13 +1297,6 @@ select { --tw-border-opacity: 1; border-color: rgb(243 244 246 / var(--tw-border-opacity)); } -.border-black { - --tw-border-opacity: 1; - border-color: rgb(0 0 0 / var(--tw-border-opacity)); -} -.border-opacity-10 { - --tw-border-opacity: 0.1; -} .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); @@ -1386,6 +1333,10 @@ select { --tw-bg-opacity: 1; background-color: rgb(239 68 68 / var(--tw-bg-opacity)); } +.bg-yellow-500 { + --tw-bg-opacity: 1; + background-color: rgb(234 179 8 / var(--tw-bg-opacity)); +} .bg-gray-800 { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity)); @@ -1414,21 +1365,9 @@ select { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity)); } -.bg-yellow-500 { +.bg-red-50 { --tw-bg-opacity: 1; - background-color: rgb(234 179 8 / var(--tw-bg-opacity)); -} -.bg-yellow-200 { - --tw-bg-opacity: 1; - background-color: rgb(254 240 138 / var(--tw-bg-opacity)); -} -.bg-gray-900 { - --tw-bg-opacity: 1; - background-color: rgb(17 24 39 / var(--tw-bg-opacity)); -} -.bg-indigo-600 { - --tw-bg-opacity: 1; - background-color: rgb(79 70 229 / var(--tw-bg-opacity)); + background-color: rgb(254 242 242 / var(--tw-bg-opacity)); } .bg-opacity-75 { --tw-bg-opacity: 0.75; @@ -1446,9 +1385,6 @@ select { .fill-current { fill: currentColor; } -.stroke-2 { - stroke-width: 2; -} .object-cover { -o-object-fit: cover; object-fit: cover; @@ -1472,12 +1408,6 @@ select { .p-1 { padding: 0.25rem; } -.p-0\.5 { - padding: 0.125rem; -} -.p-0 { - padding: 0px; -} .px-4 { padding-left: 1rem; padding-right: 1rem; @@ -1561,6 +1491,12 @@ select { .pt-8 { padding-top: 2rem; } +.pt-14 { + padding-top: 3.5rem; +} +.pb-8 { + padding-bottom: 2rem; +} .pt-2 { padding-top: 0.5rem; } @@ -1573,12 +1509,6 @@ select { .pb-1 { padding-bottom: 0.25rem; } -.pt-14 { - padding-top: 3.5rem; -} -.pb-8 { - padding-bottom: 2rem; -} .text-left { text-align: left; } @@ -1618,14 +1548,14 @@ select { font-size: 3rem; line-height: 1; } -.text-lg { - font-size: 1.125rem; - line-height: 1.75rem; -} .text-4xl { font-size: 2.25rem; line-height: 2.5rem; } +.text-lg { + font-size: 1.125rem; + line-height: 1.75rem; +} .text-base { font-size: 1rem; line-height: 1.5rem; @@ -1639,12 +1569,12 @@ select { .font-bold { font-weight: 700; } -.font-extrabold { - font-weight: 800; -} .uppercase { text-transform: uppercase; } +.italic { + font-style: italic; +} .leading-5 { line-height: 1.25rem; } @@ -1816,9 +1746,6 @@ select { .opacity-75 { opacity: 0.75; } -.opacity-50 { - opacity: 0.5; -} .shadow-sm { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); @@ -1834,11 +1761,6 @@ select { --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } -.shadow-2xl { - --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); - --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color); - box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); -} .outline-none { outline: 2px solid transparent; outline-offset: 2px; @@ -1860,16 +1782,6 @@ select { --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } -.ring { - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); -} -.ring-2 { - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); -} .ring-gray-300 { --tw-ring-opacity: 1; --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity)); @@ -1878,24 +1790,9 @@ select { --tw-ring-opacity: 1; --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity)); } -.ring-gray-400 { - --tw-ring-opacity: 1; - --tw-ring-color: rgb(156 163 175 / var(--tw-ring-opacity)); -} -.ring-gray-900 { - --tw-ring-opacity: 1; - --tw-ring-color: rgb(17 24 39 / var(--tw-ring-opacity)); -} -.ring-indigo-500 { - --tw-ring-opacity: 1; - --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity)); -} .ring-opacity-5 { --tw-ring-opacity: 0.05; } -.ring-offset-1 { - --tw-ring-offset-width: 1px; -} .filter { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } @@ -1964,14 +1861,6 @@ select { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity)); } -.hover\:bg-gray-50:hover { - --tw-bg-opacity: 1; - background-color: rgb(249 250 251 / var(--tw-bg-opacity)); -} -.hover\:bg-indigo-700:hover { - --tw-bg-opacity: 1; - background-color: rgb(67 56 202 / var(--tw-bg-opacity)); -} .hover\:text-gray-500:hover { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity)); @@ -1984,6 +1873,10 @@ select { --tw-text-opacity: 1; color: rgb(129 140 248 / var(--tw-text-opacity)); } +.hover\:text-gray-900:hover { + --tw-text-opacity: 1; + color: rgb(17 24 39 / var(--tw-text-opacity)); +} .hover\:text-indigo-900:hover { --tw-text-opacity: 1; color: rgb(49 46 129 / var(--tw-text-opacity)); @@ -2000,22 +1893,14 @@ select { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } -.hover\:text-gray-900:hover { +.hover\:text-teal-900:hover { --tw-text-opacity: 1; - color: rgb(17 24 39 / var(--tw-text-opacity)); + color: rgb(19 78 74 / var(--tw-text-opacity)); } .hover\:text-gray-700:hover { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity)); } -.hover\:text-indigo-500:hover { - --tw-text-opacity: 1; - color: rgb(99 102 241 / var(--tw-text-opacity)); -} -.hover\:text-teal-900:hover { - --tw-text-opacity: 1; - color: rgb(19 78 74 / var(--tw-text-opacity)); -} .focus\:z-10:focus { z-index: 10; } @@ -2120,16 +2005,6 @@ select { --tw-text-opacity: 1; color: rgb(59 130 246 / var(--tw-text-opacity)); } -.group:hover .group-hover\:opacity-50 { - opacity: 0.5; -} -.group:hover .group-hover\:opacity-25 { - opacity: 0.25; -} -.group:hover .group-hover\:blur-sm { - --tw-blur: blur(4px); - filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); -} .group:hover .group-hover\:brightness-50 { --tw-brightness: brightness(.5); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); @@ -2144,14 +2019,6 @@ select { left: 0px; } - .sm\:top-8 { - top: 2rem; - } - - .sm\:right-6 { - right: 1.5rem; - } - .sm\:top-4 { top: 1rem; } @@ -2168,14 +2035,6 @@ select { grid-column: span 2 / span 2; } - .sm\:col-span-4 { - grid-column: span 4 / span 4; - } - - .sm\:col-span-8 { - grid-column: span 8 / span 8; - } - .sm\:-mx-6 { margin-left: -1.5rem; margin-right: -1.5rem; @@ -2238,10 +2097,6 @@ select { grid-template-columns: repeat(3, minmax(0, 1fr)); } - .sm\:grid-cols-12 { - grid-template-columns: repeat(12, minmax(0, 1fr)); - } - .sm\:items-center { align-items: center; } @@ -2292,10 +2147,6 @@ select { padding-top: 2rem; } - .sm\:pr-12 { - padding-right: 3rem; - } - .sm\:text-2xl { font-size: 1.5rem; line-height: 2rem; @@ -2309,14 +2160,6 @@ select { } @media (min-width: 768px) { - .md\:top-6 { - top: 1.5rem; - } - - .md\:right-6 { - right: 1.5rem; - } - .md\:top-3 { top: 0.75rem; } @@ -2400,14 +2243,6 @@ select { grid-template-columns: repeat(2, minmax(0, 1fr)); } - .md\:grid-cols-4 { - grid-template-columns: repeat(4, minmax(0, 1fr)); - } - - .md\:grid-cols-3 { - grid-template-columns: repeat(3, minmax(0, 1fr)); - } - .md\:flex-row { flex-direction: row; } @@ -2456,6 +2291,16 @@ select { padding-right: 1rem; } + .md\:py-4 { + padding-top: 1rem; + padding-bottom: 1rem; + } + + .md\:py-5 { + padding-top: 1.25rem; + padding-bottom: 1.25rem; + } + .md\:align-middle { vertical-align: middle; } @@ -2470,14 +2315,6 @@ select { } @media (min-width: 1024px) { - .lg\:top-8 { - top: 2rem; - } - - .lg\:right-8 { - right: 2rem; - } - .lg\:top-4 { top: 1rem; } @@ -2486,14 +2323,6 @@ select { right: 1rem; } - .lg\:col-span-5 { - grid-column: span 5 / span 5; - } - - .lg\:col-span-7 { - grid-column: span 7 / span 7; - } - .lg\:-mx-8 { margin-left: -2rem; margin-right: -2rem; @@ -2507,6 +2336,10 @@ select { display: none; } + .lg\:w-\[60\%\] { + width: 60%; + } + .lg\:max-w-4xl { max-width: 56rem; } @@ -2515,19 +2348,6 @@ select { grid-template-columns: repeat(4, minmax(0, 1fr)); } - .lg\:grid-cols-6 { - grid-template-columns: repeat(6, minmax(0, 1fr)); - } - - .lg\:grid-cols-5 { - grid-template-columns: repeat(5, minmax(0, 1fr)); - } - - .lg\:gap-x-8 { - -moz-column-gap: 2rem; - column-gap: 2rem; - } - .lg\:p-8 { padding: 2rem; } @@ -2546,6 +2366,16 @@ select { padding-left: 1rem; padding-right: 1rem; } + + .lg\:py-6 { + padding-top: 1.5rem; + padding-bottom: 1.5rem; + } + + .lg\:py-7 { + padding-top: 1.75rem; + padding-bottom: 1.75rem; + } } @media (min-width: 1280px) { @@ -2557,14 +2387,6 @@ select { grid-template-columns: repeat(4, minmax(0, 1fr)); } - .xl\:grid-cols-8 { - grid-template-columns: repeat(8, minmax(0, 1fr)); - } - - .xl\:grid-cols-7 { - grid-template-columns: repeat(7, minmax(0, 1fr)); - } - .xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } @@ -2585,14 +2407,6 @@ select { } @media (min-width: 1536px) { - .\32xl\:grid-cols-10 { - grid-template-columns: repeat(10, minmax(0, 1fr)); - } - - .\32xl\:grid-cols-9 { - grid-template-columns: repeat(9, minmax(0, 1fr)); - } - .\32xl\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } diff --git a/resources/views/admin/image/index.blade.php b/resources/views/admin/image/index.blade.php index 3e1cf06d..eb340db2 100644 --- a/resources/views/admin/image/index.blade.php +++ b/resources/views/admin/image/index.blade.php @@ -2,6 +2,15 @@
+
+
+ + +
+
+ @if($images->isNotEmpty())
@foreach($images as $image) @@ -217,6 +226,93 @@
+ + @push('scripts') @endpush