From 4a9715d77fcf8f614e392b5158f1644ec3ebeb68 Mon Sep 17 00:00:00 2001 From: WispX Date: Sat, 18 Dec 2021 16:12:58 +0800 Subject: [PATCH] =?UTF-8?q?:sparkles:=20=E4=BB=AA=E8=A1=A8=E7=9B=98?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E5=B1=95=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/Http/Controllers/User/UserController.php | 17 +- app/Utils.php | 22 ++ public/css/app.css | 281 ++++++++++++++++++- resources/views/components/box.blade.php | 6 + resources/views/components/no-data.blade.php | 6 + resources/views/dashboard.blade.php | 122 +++++++- resources/views/layouts/app.blade.php | 2 +- resources/views/layouts/header.blade.php | 2 +- resources/views/upload.blade.php | 2 + 9 files changed, 454 insertions(+), 6 deletions(-) create mode 100644 resources/views/components/box.blade.php create mode 100644 resources/views/components/no-data.blade.php diff --git a/app/Http/Controllers/User/UserController.php b/app/Http/Controllers/User/UserController.php index 116823de..f7152928 100644 --- a/app/Http/Controllers/User/UserController.php +++ b/app/Http/Controllers/User/UserController.php @@ -2,14 +2,27 @@ namespace App\Http\Controllers\User; +use App\Enums\ConfigKey; use App\Http\Controllers\Controller; -use Illuminate\Http\Request; +use App\Models\User; +use App\Utils; +use Illuminate\Support\Facades\Auth; use Illuminate\View\View; class UserController extends Controller { public function dashboard(): View { - return view('dashboard'); + /** @var User $user */ + $user = Auth::user(); + + // 组配置 + $configs = Utils::config(ConfigKey::GuestGroupConfigs); + if ($user->group) { + $configs = $user->group->configs; + } + + $strategies = $user->group ? $user->group->strategies()->get() : []; + return view('dashboard', compact('strategies', 'configs', 'user')); } } diff --git a/app/Utils.php b/app/Utils.php index 0a8f1359..80b0a03d 100644 --- a/app/Utils.php +++ b/app/Utils.php @@ -42,4 +42,26 @@ class Utils }); return '' === $name ? $configs : $configs->get($name, $default); } + + /** + * 转换字段单位 + * + * @param int|float $size 字节b + * @return string + */ + public static function formatSize(int|float $size): string + { + if ($size <= 0) { + return "0.00 Bytes"; + } + $unit = ['', 'K', 'M', 'G', 'T', 'P']; + $base = 1024; + $i = floor(log($size, $base)); + $n = count($unit); + if ($i >= $n) { + $i = $n - 1; + } + + return sprintf("%.2f", $size / pow($base, $i)) . ' ' . $unit[$i] . 'B'; + } } diff --git a/public/css/app.css b/public/css/app.css index 59709b44..1640ecc3 100644 --- a/public/css/app.css +++ b/public/css/app.css @@ -391,7 +391,7 @@ Ensure the default browser behavior of the `hidden` attribute. --tw-transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } -.border, .border-2, .border-b-2, .border-l-4, .border-t, .border-r, .border-b { +.divide-y > *, .border, .border-2, .border-b-2, .border-l-4, .border-t, .border-r, .border-b { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity)); } @@ -690,6 +690,9 @@ select { .z-\[9\] { z-index: 9; } +.order-last { + order: 9999; +} .m-2 { margin: 0.5rem; } @@ -767,6 +770,9 @@ select { .mr-4 { margin-right: 1rem; } +.mt-5 { + margin-top: 1.25rem; +} .block { display: block; } @@ -857,6 +863,18 @@ select { .w-6 { width: 1.5rem; } +.w-\[30\%\] { + width: 30%; +} +.w-\[40\%\] { + width: 40%; +} +.w-3 { + width: 0.75rem; +} +.w-1\/2 { + width: 50%; +} .max-w-xl { max-width: 36rem; } @@ -872,6 +890,18 @@ select { .flex-shrink-0 { flex-shrink: 0; } +.basis-1\/4 { + flex-basis: 25%; +} +.basis-1\/2 { + flex-basis: 50%; +} +.basis-1\/3 { + flex-basis: 33.333333%; +} +.basis-2\/3 { + flex-basis: 66.666667%; +} .origin-top-right { transform-origin: top right; } @@ -924,12 +954,27 @@ select { .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } +.flex-row { + flex-direction: row; +} +.flex-row-reverse { + flex-direction: row-reverse; +} .flex-col { flex-direction: column; } +.flex-col-reverse { + flex-direction: column-reverse; +} .flex-nowrap { flex-wrap: nowrap; } +.content-center { + align-content: center; +} +.items-start { + align-items: flex-start; +} .items-center { align-items: center; } @@ -945,6 +990,9 @@ select { .justify-between { justify-content: space-between; } +.justify-items-start { + justify-items: start; +} .space-y-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); @@ -975,6 +1023,39 @@ select { margin-right: calc(1rem * var(--tw-space-x-reverse)); margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); } +.space-y-10 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(2.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(2.5rem * var(--tw-space-y-reverse)); +} +.space-y-6 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)); +} +.space-y-0 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); +} +.space-x-6 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(1.5rem * var(--tw-space-x-reverse)); + margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse))); +} +.space-y-8 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(2rem * var(--tw-space-y-reverse)); +} +.divide-y > :not([hidden]) ~ :not([hidden]) { + --tw-divide-y-reverse: 0; + border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); + border-bottom-width: calc(1px * var(--tw-divide-y-reverse)); +} +.divide-solid > :not([hidden]) ~ :not([hidden]) { + border-style: solid; +} .overflow-hidden { overflow: hidden; } @@ -1107,6 +1188,22 @@ select { --tw-bg-opacity: 1; background-color: rgb(55 65 81 / var(--tw-bg-opacity)); } +.bg-slate-50 { + --tw-bg-opacity: 1; + background-color: rgb(248 250 252 / var(--tw-bg-opacity)); +} +.bg-red-500 { + --tw-bg-opacity: 1; + background-color: rgb(239 68 68 / var(--tw-bg-opacity)); +} +.bg-red-300 { + --tw-bg-opacity: 1; + background-color: rgb(252 165 165 / var(--tw-bg-opacity)); +} +.bg-red-400 { + --tw-bg-opacity: 1; + background-color: rgb(248 113 113 / var(--tw-bg-opacity)); +} .fill-current { fill: currentColor; } @@ -1159,6 +1256,18 @@ select { padding-left: 0.75rem; padding-right: 0.75rem; } +.py-3 { + padding-top: 0.75rem; + padding-bottom: 0.75rem; +} +.py-8 { + padding-top: 2rem; + padding-bottom: 2rem; +} +.py-10 { + padding-top: 2.5rem; + padding-bottom: 2.5rem; +} .pb-6 { padding-bottom: 1.5rem; } @@ -1183,6 +1292,12 @@ select { .pl-0 { padding-left: 0px; } +.pb-4 { + padding-bottom: 1rem; +} +.text-left { + text-align: left; +} .text-center { text-align: center; } @@ -1221,6 +1336,14 @@ select { font-size: 1.125rem; line-height: 1.75rem; } +.text-5xl { + font-size: 3rem; + line-height: 1; +} +.text-3xl { + font-size: 1.875rem; + line-height: 2.25rem; +} .font-medium { font-weight: 500; } @@ -1317,6 +1440,22 @@ select { --tw-text-opacity: 1; color: rgb(71 85 105 / var(--tw-text-opacity)); } +.text-red-300 { + --tw-text-opacity: 1; + color: rgb(252 165 165 / var(--tw-text-opacity)); +} +.text-amber-500 { + --tw-text-opacity: 1; + color: rgb(245 158 11 / var(--tw-text-opacity)); +} +.text-emerald-500 { + --tw-text-opacity: 1; + color: rgb(16 185 129 / var(--tw-text-opacity)); +} +.text-green-400 { + --tw-text-opacity: 1; + color: rgb(74 222 128 / var(--tw-text-opacity)); +} .underline { text-decoration: underline; } @@ -1563,6 +1702,14 @@ select { margin-left: 16rem; } + .sm\:mt-8 { + margin-top: 2rem; + } + + .sm\:mt-6 { + margin-top: 1.5rem; + } + .sm\:block { display: block; } @@ -1571,6 +1718,10 @@ select { display: flex; } + .sm\:grid { + display: grid; + } + .sm\:hidden { display: none; } @@ -1591,6 +1742,14 @@ select { flex: 1 1 0%; } + .sm\:grid-cols-4 { + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + + .sm\:flex-col { + flex-direction: column; + } + .sm\:items-center { align-items: center; } @@ -1607,6 +1766,18 @@ select { justify-content: space-between; } + .sm\:space-y-0 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); + } + + .sm\:space-y-4 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(1rem * var(--tw-space-y-reverse)); + } + .sm\:rounded-lg { border-radius: 0.5rem; } @@ -1646,6 +1817,93 @@ select { } @media (min-width: 768px) { + .md\:mt-8 { + margin-top: 2rem; + } + + .md\:mt-6 { + margin-top: 1.5rem; + } + + .md\:mt-0 { + margin-top: 0px; + } + + .md\:grid { + display: grid; + } + + .md\:w-\[40\%\] { + width: 40%; + } + + .md\:w-\[50\%\] { + width: 50%; + } + + .md\:w-\[70\%\] { + width: 70%; + } + + .md\:basis-1\/4 { + flex-basis: 25%; + } + + .md\:grid-cols-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .md\:grid-cols-4 { + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + + .md\:flex-row { + flex-direction: row; + } + + .md\:flex-col { + flex-direction: column; + } + + .md\:gap-x-8 { + -moz-column-gap: 2rem; + column-gap: 2rem; + } + + .md\:gap-y-10 { + row-gap: 2.5rem; + } + + .md\:gap-x-2 { + -moz-column-gap: 0.5rem; + column-gap: 0.5rem; + } + + .md\:gap-x-4 { + -moz-column-gap: 1rem; + column-gap: 1rem; + } + + .md\:gap-y-8 { + row-gap: 2rem; + } + + .md\:gap-y-4 { + row-gap: 1rem; + } + + .md\:space-y-0 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); + } + + .md\:space-x-4 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(1rem * var(--tw-space-x-reverse)); + margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); + } + .md\:px-10 { padding-left: 2.5rem; padding-right: 2.5rem; @@ -1670,6 +1928,27 @@ select { } @media (min-width: 1280px) { + .xl\:w-\[40\%\] { + width: 40%; + } + + .xl\:grid-cols-4 { + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + + .xl\:flex-row { + flex-direction: row; + } + + .xl\:gap-x-8 { + -moz-column-gap: 2rem; + column-gap: 2rem; + } + + .xl\:gap-y-8 { + row-gap: 2rem; + } + .xl\:px-10 { padding-left: 2.5rem; padding-right: 2.5rem; diff --git a/resources/views/components/box.blade.php b/resources/views/components/box.blade.php new file mode 100644 index 00000000..1ac0ef98 --- /dev/null +++ b/resources/views/components/box.blade.php @@ -0,0 +1,6 @@ +
+
{{ $title }}
+
+ {{ $content }} +
+
diff --git a/resources/views/components/no-data.blade.php b/resources/views/components/no-data.blade.php new file mode 100644 index 00000000..8659d918 --- /dev/null +++ b/resources/views/components/no-data.blade.php @@ -0,0 +1,6 @@ +@props(['message' => '暂无数据']) + +
+ +

{{ $message }}

+
diff --git a/resources/views/dashboard.blade.php b/resources/views/dashboard.blade.php index 9b089c10..be7ded0e 100644 --- a/resources/views/dashboard.blade.php +++ b/resources/views/dashboard.blade.php @@ -1,3 +1,123 @@ +@section('title', '仪表盘') + - 仪表盘 +
+
+ +
+

图片数量

+

{{ $user->image_num }}

+
+
+
+ +
+

可用储存

+

{{ \App\Utils::formatSize(($user->capacity - $user->images->sum('size')) * 1024) }}

+
+
+
+ +
+

使用储存

+

{{ \App\Utils::formatSize($user->images->sum('size') * 1024) }}

+
+
+
+ +
+

总储存

+

{{ \App\Utils::formatSize($user->capacity * 1024) }}

+
+
+
+ +
+
+ + 可使用的策略 + + @if(! $strategies) + + @else +
+ @foreach ($strategies as $strategy) +
+

{{ $strategy->name }}

+ {{ $strategy->intro }} +
+ @endforeach +
+ @endif + + +
+
+ + 我的信息 + +
+
+

姓名

+

{{ $user->name }}

+
+
+

邮箱

+

{{ $user->email }}

+
+
+

注册时间

+

{{ $user->created_at }}

+
+
+

注册 IP

+

{{ $user->registered_ip }}

+
+ @if(! $user->email_verified_at) +

你的账号尚未激活，功能受限，请根据激活邮件指引激活账号，如果你没有收到邮件，请点击 这里 重新发送。

+ @endif +
+ + + + 角色组信息 + +
+
+

组名

+

{{ $user->group ? $user->group->name : '系统默认组' }}

+
+
+

最大文件大小

+

{{ \App\Utils::formatSize($configs->get(\App\Enums\GroupConfigKey::MaximumFileSize) * 1024) }}

+
+
+

并发上传数量

+

{{ $configs->get(\App\Enums\GroupConfigKey::ConcurrentUploadNum) }} 张

+
+
+

每分钟上传限制

+

{{ $configs->get(\App\Enums\GroupConfigKey::LimitPerMinute) }} 张

+
+
+

每小时上传限制

+

{{ $configs->get(\App\Enums\GroupConfigKey::LimitPerHour) }} 张

+
+
+

每天上传限制

+

{{ $configs->get(\App\Enums\GroupConfigKey::LimitPerDay) }} 张

+
+
+

每周上传限制

+

{{ $configs->get(\App\Enums\GroupConfigKey::LimitPerWeek) }} 张

+
+
+

每月上传限制

+

{{ $configs->get(\App\Enums\GroupConfigKey::LimitPerMonth) }} 张

+
+
+ + +
+
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php index 996c37aa..10309221 100644 --- a/resources/views/layouts/app.blade.php +++ b/resources/views/layouts/app.blade.php @@ -35,7 +35,7 @@ >
-
+
{{ $slot }}
diff --git a/resources/views/layouts/header.blade.php b/resources/views/layouts/header.blade.php index 7e62e9ad..09be1a57 100644 --- a/resources/views/layouts/header.blade.php +++ b/resources/views/layouts/header.blade.php @@ -4,7 +4,7 @@ - 仪表盘 + @yield('title', 'Lsky Pro')
@include('layouts.user-nav') diff --git a/resources/views/upload.blade.php b/resources/views/upload.blade.php index dd556554..9a590875 100644 --- a/resources/views/upload.blade.php +++ b/resources/views/upload.blade.php @@ -1,3 +1,5 @@ +@section('title', '上传图片') +