usher-manage-stack/resources/views/admin/pages/show.blade.php

<x-app-layout>
    <x-slot name="header">
        <div class="flex items-center justify-between">
            <h2 class="text-xl font-semibold leading-tight text-gray-800 dark:text-gray-200">
                頁面詳情
            </h2>
            <div class="flex items-center space-x-2">
                <a href="{{ route('admin.pages.index') }}" class="inline-flex items-center rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700">
                    ← 返回列表
                </a>
                <a href="{{ route('admin.pages.edit', $page) }}" class="inline-flex items-center rounded-md border border-transparent bg-indigo-600 dark:bg-indigo-500 px-3 py-2 text-sm font-medium text-white hover:bg-indigo-700 dark:hover:bg-indigo-600">
                    編輯頁面
                </a>
            </div>
        </div>
    </x-slot>

    <div class="py-12">
        <div class="mx-auto max-w-4xl sm:px-6 lg:px-8 space-y-6">
            @if (session('status'))
                <div class="rounded-md bg-green-50 dark:bg-green-900/50 p-4">
                    <p class="text-sm font-medium text-green-800 dark:text-green-200">{{ session('status') }}</p>
                </div>
            @endif

            @if (session('error'))
                <div class="rounded-md bg-red-50 dark:bg-red-900/50 p-4">
                    <p class="text-sm font-medium text-red-800 dark:text-red-200">{{ session('error') }}</p>
                </div>
            @endif

            <!-- Page Content -->
            <div class="bg-white dark:bg-gray-800 shadow sm:rounded-lg p-6">
                <div class="mb-6">
                    <div class="flex items-center justify-between mb-4">
                        <h3 class="text-2xl font-bold text-gray-900 dark:text-gray-100">
                            {{ $page->title }}
                        </h3>
                        <span class="inline-flex rounded-full px-3 py-1 text-sm font-semibold
                            @if($page->status === 'draft') bg-gray-100 dark:bg-gray-700 text-gray-800 dark:text-gray-300
                            @else bg-green-100 dark:bg-green-900/50 text-green-800 dark:text-green-300
                            @endif">
                            {{ $page->getStatusLabel() }}
                        </span>
                    </div>

                    <div class="prose dark:prose-invert max-w-none">
                        <div class="whitespace-pre-wrap text-gray-700 dark:text-gray-300">{{ $page->content }}</div>
                    </div>
                </div>
            </div>

            <!-- Child Pages -->
            @if($page->children->count() > 0)
                <div class="bg-white dark:bg-gray-800 shadow sm:rounded-lg p-6">
                    <h4 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">子頁面</h4>
                    <div class="space-y-2">
                        @foreach($page->children as $child)
                            <div class="flex items-center justify-between bg-gray-50 dark:bg-gray-700 rounded-md p-3">
                                <a href="{{ route('admin.pages.show', $child) }}" class="text-sm font-medium text-indigo-600 dark:text-indigo-400 hover:text-indigo-800 dark:hover:text-indigo-300">{{ $child->title }}</a>
                                <span class="inline-flex rounded-full px-2 text-xs font-semibold leading-5
                                    @if($child->status === 'draft') bg-gray-100 dark:bg-gray-700 text-gray-800 dark:text-gray-300
                                    @else bg-green-100 dark:bg-green-900/50 text-green-800 dark:text-green-300
                                    @endif">
                                    {{ $child->getStatusLabel() }}
                                </span>
                            </div>
                        @endforeach
                    </div>
                </div>
            @endif

            <!-- Metadata -->
            <div class="bg-white dark:bg-gray-800 shadow sm:rounded-lg p-6">
                <h4 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">頁面資訊</h4>
                <dl class="grid grid-cols-1 gap-x-4 gap-y-6 sm:grid-cols-2">
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">網址代碼</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100 font-mono">{{ $page->slug }}</dd>
                    </div>
                    @if($page->template)
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">模板</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">{{ $page->template }}</dd>
                    </div>
                    @endif
                    @if($page->parent)
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">上層頁面</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">
                            <a href="{{ route('admin.pages.show', $page->parent) }}" class="text-indigo-600 dark:text-indigo-400 hover:underline">{{ $page->parent->title }}</a>
                        </dd>
                    </div>
                    @endif
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">排序</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">{{ $page->sort_order }}</dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">建立者</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">{{ $page->creator->name ?? 'N/A' }}</dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">建立時間</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">{{ $page->created_at->format('Y-m-d H:i:s') }}</dd>
                    </div>
                    @if($page->published_at)
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">發布時間</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">{{ $page->published_at->format('Y-m-d H:i:s') }}</dd>
                    </div>
                    @endif
                    @if($page->lastUpdatedBy)
                    <div>
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">最後更新者</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">{{ $page->lastUpdatedBy->name }}</dd>
                    </div>
                    @endif
                    @if($page->meta_description)
                    <div class="sm:col-span-2">
                        <dt class="text-sm font-medium text-gray-500 dark:text-gray-400">SEO 描述</dt>
                        <dd class="mt-1 text-sm text-gray-900 dark:text-gray-100">{{ $page->meta_description }}</dd>
                    </div>
                    @endif
                </dl>
            </div>

            <!-- Actions -->
            <div class="bg-white dark:bg-gray-800 shadow sm:rounded-lg p-6">
                <h4 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">操作</h4>
                <div class="flex flex-wrap gap-3">
                    @if($page->isDraft() && auth()->user()->can('publish_pages'))
                        <form method="POST" action="{{ route('admin.pages.publish', $page) }}">
                            @csrf
                            <button type="submit" class="inline-flex items-center rounded-md border border-transparent bg-green-600 dark:bg-green-500 px-4 py-2 text-sm font-medium text-white hover:bg-green-700 dark:hover:bg-green-600">
                                發布頁面
                            </button>
                        </form>
                    @endif

                    @if(auth()->user()->can('delete_pages'))
                        <form method="POST" action="{{ route('admin.pages.destroy', $page) }}"
                            onsubmit="return confirm('確定要刪除此頁面嗎？');">
                            @csrf
                            @method('DELETE')
                            <button type="submit" class="inline-flex items-center rounded-md border border-transparent bg-red-600 dark:bg-red-500 px-4 py-2 text-sm font-medium text-white hover:bg-red-700 dark:hover:bg-red-600">
                                刪除頁面
                            </button>
                        </form>
                    @endif
                </div>
            </div>
        </div>
    </div>
</x-app-layout>