加入 操作記錄

admin 畫面調整
20250513

app/Livewire/Admin/ActivityLogTable.php

@@ -44,6 +44,8 @@ final class ActivityLogTable extends PowerGridComponent
             ->showToggleColumns();
             //->showSoftDeletes()
             //->showSearchInput()
+        $header->includeViewOnTop('livewire.admin.activity-log-header');
+            
         $actions[]=$header;
         $actions[]=PowerGrid::footer()->showPerPage()->showRecordCount();     
         return $actions;

resources/lang/zh-TW/activity-log.php

@@ -0,0 +1,5 @@
+<?php
+
+return [
+    'list' => '操作記錄'
+];

resources/views/components/admin/section-header.blade.php

@@ -0,0 +1,13 @@
+<div class="bg-white px-4 py-3 shadow-sm border rounded-md mb-4">
+    <div class="flex items-center justify-between">
+        {{-- 左邊標題 --}}
+        <h2 class="text-lg font-semibold text-gray-800">
+            {{ $title }}
+        </h2>
+
+        {{-- 右邊 slot 注入按鈕群 --}}
+        <div class="flex gap-3">
+            {{ $slot }}
+        </div>
+    </div>
+</div>

resources/views/components/layouts/admin.blade.php

@@ -23,8 +23,6 @@
             <livewire:layout.admin.sidebar />
 
             <div class="flex-1 flex flex-col">
-                {{-- Navigation --}}
-                <livewire:layout.admin.navigation />
 
                 {{-- Page Heading --}}
                 @if (isset($header))

resources/views/livewire/admin/activity-log-header.blade.php

@@ -0,0 +1,2 @@
+<x-admin.section-header title="{{ __('activity-log.list') }}">
+</x-admin.section-header>

resources/views/livewire/admin/role-header.blade.php

@@ -1,8 +1,8 @@
-<div class="flex justify-end mb-2">
+<x-admin.section-header title="{{ __('roles.list') }}">
     <x-wireui:button
         wire:click="$dispatchTo('admin.role-form', 'openCreateRoleModal')"
         icon="plus"
         label="{{ __('roles.CreateNew') }}"
         class="bg-blue-600 text-white"
     />
-</div>
+</x-admin.section-header>

resources/views/livewire/admin/user-header.blade.php

@@ -1,4 +1,4 @@
-<div class="flex justify-end mb-2 mr-2 mt-2 sm:mt-0 gap-3">
+<x-admin.section-header title="{{ __('users.list') }}">
     <x-wireui:button
         wire:click="$dispatchTo('admin.user-form', 'openModal')"
         icon="plus"
@@ -6,11 +6,10 @@
         class="bg-blue-600 text-white"
     />
 
-
     <x-wireui:button
         wire:click="$dispatchTo('admin.user-import-data','openModal')"
         icon="document-plus"
         label="{{ __('users.ImportData') }}"
         class="bg-green-600 text-white"
     />
-</div>
+</x-admin.section-header>

resources/views/livewire/layout/admin/navigation.blade.php

@@ -1,110 +0,0 @@
-<?php
-
-use App\Livewire\Actions\Logout;
-use Livewire\Volt\Component;
-
-new class extends Component
-{
-    /**
-     * Log the current user out of the application.
-     */
-    public function logout(Logout $logout): void
-    {
-        $logout();
-
-        $this->redirect('/', navigate: true);
-    }
-}; ?>
-
-<nav x-data="{ open: false }" class="bg-white border-b border-gray-100">
-    <!-- Primary Navigation Menu -->
-    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-        <div class="flex justify-between h-16">
-            <div class="flex">
-                <!-- Logo -->
-                <div class="shrink-0 flex items-center">
-                    <a href="{{ route('admin.dashboard') }}" wire:navigate>
-                        <x-application-logo class="block h-9 w-auto fill-current text-gray-800" />
-                    </a>
-                </div>
-
-                <!-- Navigation Links -->
-                <div class="hidden space-x-8 sm:-my-px sm:ms-10 sm:flex">
-                    <x-nav-link :href="route('admin.dashboard')" :active="request()->routeIs('admin.dashboard')" wire:navigate>
-                        {{ __('Dashboard') }}
-                    </x-nav-link>
-                </div>
-            </div>
-
-            <!-- Settings Dropdown -->
-            <div class="hidden sm:flex sm:items-center sm:ms-6">
-                <x-dropdown align="right" width="48">
-                    <x-slot name="trigger">
-                        <button class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md text-gray-500 bg-white hover:text-gray-700 focus:outline-none transition ease-in-out duration-150">
-                            <div x-data="{{ json_encode(['name' => auth()->user()->name]) }}" x-text="name" x-on:profile-updated.window="name = $event.detail.name"></div>
-
-                            <div class="ms-1">
-                                <svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
-                                    <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
-                                </svg>
-                            </div>
-                        </button>
-                    </x-slot>
-
-                    <x-slot name="content">
-                        <x-dropdown-link :href="route('profile')" wire:navigate>
-                            {{ __('Profile') }}
-                        </x-dropdown-link>
-
-                        <!-- Authentication -->
-                        <button wire:click="logout" class="w-full text-start">
-                            <x-dropdown-link>
-                                {{ __('Log Out') }}
-                            </x-dropdown-link>
-                        </button>
-                    </x-slot>
-                </x-dropdown>
-            </div>
-
-            <!-- Hamburger -->
-            <div class="-me-2 flex items-center sm:hidden">
-                <button @click="open = ! open" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
-                    <svg class="h-6 w-6" stroke="currentColor" fill="none" viewBox="0 0 24 24">
-                        <path :class="{'hidden': open, 'inline-flex': ! open }" class="inline-flex" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
-                        <path :class="{'hidden': ! open, 'inline-flex': open }" class="hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
-                    </svg>
-                </button>
-            </div>
-        </div>
-    </div>
-
-    <!-- Responsive Navigation Menu -->
-    <div :class="{'block': open, 'hidden': ! open}" class="hidden sm:hidden">
-        <div class="pt-2 pb-3 space-y-1">
-            <x-responsive-nav-link :href="route('dashboard')" :active="request()->routeIs('dashboard')" wire:navigate>
-                {{ __('Dashboard') }}
-            </x-responsive-nav-link>
-        </div>
-
-        <!-- Responsive Settings Options -->
-        <div class="pt-4 pb-1 border-t border-gray-200">
-            <div class="px-4">
-                <div class="font-medium text-base text-gray-800" x-data="{{ json_encode(['name' => auth()->user()->name]) }}" x-text="name" x-on:profile-updated.window="name = $event.detail.name"></div>
-                <div class="font-medium text-sm text-gray-500">{{ auth()->user()->email }}</div>
-            </div>
-
-            <div class="mt-3 space-y-1">
-                <x-responsive-nav-link :href="route('profile')" wire:navigate>
-                    {{ __('Profile') }}
-                </x-responsive-nav-link>
-
-                <!-- Authentication -->
-                <button wire:click="logout" class="w-full text-start">
-                    <x-responsive-nav-link>
-                        {{ __('Log Out') }}
-                    </x-responsive-nav-link>
-                </button>
-            </div>
-        </div>
-    </div>
-</nav>

resources/views/livewire/layout/admin/sidebar.blade.php

@@ -1,28 +1,75 @@
-@php
+<?php
-    use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\Auth;
+use App\Livewire\Actions\Logout;
+use Livewire\Volt\Component;
 
-    $menus = [
+new class extends Component
+{
+    public array $menus=[
         ['label' => 'Dashboard', 'route' => 'admin.dashboard', 'icon' => 'home', 'permission' => null],
         ['label' => 'ActivityLog', 'route' => 'admin.activity-log', 'icon' => 'clock', 'permission' => null],
         ['label' => 'Role', 'route' => 'admin.roles', 'icon' => 'user-circle', 'permission' => 'role-list'],
         ['label' => 'User', 'route' => 'admin.users', 'icon' => 'user-circle', 'permission' => 'user-list'],
     ];
-@endphp
 
-<aside class="w-64 bg-white border-r">
+    /**
-    <div class="p-4 font-bold text-lg border-b">
+     * Log the current user out of the application.
-        管理後台
+     */
+    public function logout(Logout $logout): void
+    {
+        $logout();
+
+        $this->redirect('/', navigate: true);
+    }
+}; ?>
+
+<aside class="w-64 bg-white border-r flex flex-col justify-between h-screen">
+    {{-- 頂部區塊 --}}
+    <div>
+        <div class="p-4 border-b">
+            <div class="flex items-center justify-between">
+                <div class="font-bold text-lg">管理後台</div>
+
+                <x-dropdown align="right" width="48">
+                    <x-slot name="trigger">
+                        <button class="inline-flex items-center px-2 py-1 text-sm font-medium text-gray-500 bg-white hover:text-gray-700 focus:outline-none transition">
+                            <div x-data="{{ json_encode(['name' => auth()->user()->name]) }}" 
+                                x-text="name"
+                                x-on:profile-updated.window="name = $event.detail.name"></div>
+                            <svg class="ml-1 w-4 h-4 fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+                                <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
+                            </svg>
+                        </button>
+                    </x-slot>
+
+                    <x-slot name="content">
+                        <x-dropdown-link :href="route('profile')" wire:navigate>
+                            {{ __('Profile') }}
+                        </x-dropdown-link>
+                    </x-slot>
+                </x-dropdown>
+            </div>
+        </div>
+
+        {{-- 選單 --}}
+        <nav class="mt-4">
+            @foreach ($menus as $menu)
+                @if (!$menu['permission'] || Auth::user()->can($menu['permission']))
+                    <a href="{{ route($menu['route']) }}"
+                        class="flex items-center px-4 py-2 text-gray-700 hover:bg-gray-100 {{ request()->routeIs($menu['route']) ? 'bg-gray-100 font-semibold' : '' }}">
+                        <x-wireui:icon name="{{ $menu['icon'] }}" class="w-5 h-5 mr-2" />
+                        {{ $menu['label'] }}
+                    </a>
+                @endif
+            @endforeach
+        </nav>
+    </div>
+
+    {{-- 登出按鈕（固定底部） --}}
+    <div class="p-4 border-t">
+        <button wire:click="logout"
+            class="flex items-center text-sm text-gray-700 hover:text-red-600">
+            {{ __('Log Out') }}
+        </button>
     </div>
-    <nav class="mt-4">
-        @foreach ($menus as $menu)
-            @if (!$menu['permission'] || Auth::user()->can($menu['permission']))
-                <a href="{{ route($menu['route']) }}"
-                   class="flex items-center px-4 py-2 text-gray-700 hover:bg-gray-100 {{ request()->routeIs($menu['route']) ? 'bg-gray-100 font-semibold' : '' }}">
-                   <x-wireui:icon name="{{ $menu['icon'] }}" class="w-5 h-5" />
-                    {{ $menu['label'] }}
-                    
-                </a>
-            @endif
-        @endforeach
-    </nav>
 </aside>