优化:留言板新建留言按钮移至左侧导航区

不再占用顶部公共导航栏,让所有大厅页面的顶部导航保持绝对一致。
This commit is contained in:
2026-02-27 01:38:12 +08:00
parent c75a9d8069
commit d5a9e7d6a6
2 changed files with 34 additions and 18 deletions
+29 -14
View File
@@ -21,18 +21,7 @@
</a>
@endsection
@section('nav-right')
<button id="write-toggle-btn"
@click="showWriteForm = !showWriteForm; if(showWriteForm) setTimeout(() => $refs.textBody.focus(), 100)"
class="bg-indigo-500 hover:bg-indigo-400 text-white px-4 py-2 rounded-lg font-bold shadow-sm transition flex items-center">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z">
</path>
</svg>
<span x-text="showWriteForm ? '取消留言' : '发布留言 / 写信'"></span>
</button>
@endsection
@section('body-class', 'flex flex-col h-screen overflow-hidden')
@section('body-data', "x-data=\"{ showWriteForm: false, towho: '{{ $defaultTo }}' }\"")
@@ -96,8 +85,20 @@
<div class="flex-1 flex overflow-hidden">
{{-- 左侧:分类导航 --}}
<div class="w-64 bg-white border-r border-gray-200 shrink-0 hidden md:block">
<div class="p-6">
<div class="w-64 bg-white border-r border-gray-200 shrink-0 hidden md:flex flex-col">
<div class="p-6 flex-1">
{{-- 新建留言按钮 --}}
<button
@click="showWriteForm = !showWriteForm; if(showWriteForm) setTimeout(() => $refs.textBody.focus(), 100)"
class="w-full bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-3 rounded-xl font-bold mb-6 shadow-md transition flex justify-center items-center">
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z">
</path>
</svg>
<span x-text="showWriteForm ? '取消撰写' : '写新留言'"></span>
</button>
<nav class="space-y-2">
<a href="{{ route('guestbook.index', ['tab' => 'public']) }}"
class="flex items-center px-4 py-3 rounded-lg font-medium transition-colors {{ $tab === 'public' ? 'bg-indigo-50 text-indigo-700' : 'text-gray-600 hover:bg-gray-50' }}">
@@ -201,6 +202,20 @@
</main>
</div>
{{-- 移动端悬浮写留言按钮 --}}
<button @click="showWriteForm = !showWriteForm; if(showWriteForm) setTimeout(() => $refs.textBody.focus(), 100)"
class="md:hidden fixed bottom-20 right-4 w-14 h-14 bg-indigo-600 text-white rounded-full shadow-lg flex justify-center items-center hover:bg-indigo-700 transition z-50">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" x-show="!showWriteForm">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z">
</path>
</svg>
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" x-show="showWriteForm"
style="display: none;">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
</svg>
</button>
{{-- 移动端底部分类栏 --}}
<div class="md:hidden bg-white border-t border-gray-200 flex justify-around p-2 shrink-0 relative z-20">
<a href="{{ route('guestbook.index', ['tab' => 'public']) }}"
+5 -4
View File
@@ -82,16 +82,17 @@
{{-- 通用快捷操作区 --}}
@auth
<a href="{{ route('guide') }}"
class="text-indigo-200 hover:text-white font-bold transition hidden sm:flex items-center">
<span class="mr-1">📖</span> 说明
</a>
@if (Auth::user()->user_level >= 15)
<a href="{{ route('admin.dashboard') }}"
class="text-indigo-200 hover:text-white font-bold transition hidden sm:flex items-center">
<span class="mr-1">⚙️</span> 后台
</a>
@endif
<a href="{{ route('guide') }}"
class="text-indigo-200 hover:text-white font-bold transition hidden sm:flex items-center">
<span class="mr-1">📖</span> 说明
</a>
@endauth
@yield('nav-right')