Files
chatroom/resources/views/rooms/guide.blade.php

593 lines
33 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{{--
文件功能:聊天室使用说明页面
动态读取后台配置sysparam、vip_levels、gifts、game_configs展示规则
@extends layouts.app
@author ChatRoom Laravel
@version 2.0.0
--}}
@extends('layouts.app')
@section('title', '使用说明 - 飘落流星')
@section('nav-icon', '📖')
@section('nav-title', '使用说明')
@section('head')
<style>
html {
scroll-behavior: smooth;
}
.guide-nav a {
display: block;
padding: 6px 12px;
font-size: 13px;
color: #6b7280;
border-left: 3px solid transparent;
transition: all 0.15s;
text-decoration: none;
}
.guide-nav a:hover {
color: #4338ca;
background: #eef2ff;
}
.guide-nav a.active {
color: #4338ca;
border-left-color: #4338ca;
font-weight: 700;
background: #eef2ff;
}
</style>
@endsection
@php
use App\Models\GameConfig;
use App\Models\Sysparam;
use App\Models\VipLevel;
use App\Models\Gift;
// 等级经验阈值
$levelExp = Sysparam::getLevelExpThresholds();
$maxLevel = (int) Sysparam::getValue('maxlevel', '99');
// 奖励配置
$expPerHb = Sysparam::getValue('exp_per_heartbeat', '1');
$jjbPerHb = Sysparam::getValue('jjb_per_heartbeat', '1');
// 魅力配置
$charmCross = Sysparam::getValue('charm_cross_sex', '2');
$charmSame = Sysparam::getValue('charm_same_sex', '1');
$charmLimit = Sysparam::getValue('charm_hourly_limit', '20');
// 管理权限等级
$levelWarn = (int) Sysparam::getValue('level_warn', '5');
$levelMute = (int) Sysparam::getValue('level_mute', '8');
$levelKick = (int) Sysparam::getValue('level_kick', '10');
$levelFreeze = (int) Sysparam::getValue('level_freeze', '14');
// 排行榜配置
$lbLimit = (int) Sysparam::getValue('leaderboard_limit', '50');
// VIP 等级
$vipLevels = VipLevel::orderBy('sort_order')->get();
// VIP 在线支付开关
$vipPaymentEnabled = Sysparam::getValue('vip_payment_enabled', '0') === '1';
// 礼物列表
$gifts = Gift::activeList();
// 已启用的游戏配置(按 game_key 索引)
$enabledGames = GameConfig::query()->where('enabled', true)->get()->keyBy('game_key');
// 各游戏展示定义icon / 名称 / 简介 / 参数解析回调)
// 每条对应 gameKey => [ icon, label, intro, details[] ]
$gameDefinitions = [
'fishing' => [
'icon' => '🎣',
'label' => '钓鱼小游戏',
'color' => 'teal',
'intro' => '在聊天室内消耗金币参与钓鱼,根据鱼的稀有度赢取不同奖励。',
'details' => function ($p) {
return [
'每次消耗 ' . ($p['fishing_cost'] ?? 5) . ' 金币',
'等待 ' . ($p['fishing_wait_min'] ?? 8) . '' . ($p['fishing_wait_max'] ?? 15) . ' 秒后收竿',
'冷却时间 ' . (int) (($p['fishing_cooldown'] ?? 300) / 60) . ' 分钟',
];
},
],
'slot_machine' => [
'icon' => '🎰',
'label' => '老虎机',
'color' => 'violet',
'intro' => '消耗金币拉动老虎机,连线相同符号即可赢取倍率奖励,全图案一致赢取 Jackpot',
'details' => function ($p) {
return [
'每次消耗 ' . ($p['cost_per_spin'] ?? 100) . ' 金币',
'每日最多拉 ' . ($p['daily_limit'] ?? 100) . ' 次',
'对子 ×' . ($p['pair_payout'] ?? 2) . ',三同 ×' . ($p['same_payout'] ?? 10) . ',全同 ×' . ($p['triple_payout'] ?? 50) . 'Jackpot ×' . ($p['jackpot_payout'] ?? 100),
];
},
],
'baccarat' => [
'icon' => '🃏',
'label' => '百家乐',
'color' => 'red',
'intro' => '竞猜庄闲大小,系统每 2 分钟开一局,在投注窗口内下注,猜中即赢。',
'details' => function ($p) {
$interval = $p['interval_minutes'] ?? 2;
$window = $p['bet_window_seconds'] ?? 60;
return [
'投注范围 ' . number_format($p['min_bet'] ?? 100) . '' . number_format($p['max_bet'] ?? 50000) . ' 金币',
'每 ' . $interval . ' 分钟一局,投注窗口 ' . $window . ' 秒',
'大/小/庄/闲赔率 ×' . (1 + ($p['payout_big'] ?? 1)) . ',三公赔率 ×' . (1 + ($p['payout_triple'] ?? 24)),
];
},
],
'horse_racing' => [
'icon' => '🏇',
'label' => '赛马竞猜',
'color' => 'amber',
'intro' => '从 4 匹马中选择你看好的,押注金币,赛后按赔率发放奖励。',
'details' => function ($p) {
return [
'投注范围 ' . number_format($p['min_bet'] ?? 100) . '' . number_format($p['max_bet'] ?? 100000) . ' 金币',
'每 ' . ($p['interval_minutes'] ?? 30) . ' 分钟一场,投注窗口 ' . ($p['bet_window_seconds'] ?? 90) . ' 秒',
'系统初始化资金池 ' . number_format($p['seed_pool'] ?? 0) . ' 金币,连同玩家注池一起派奖',
'平台抽成 ' . ($p['house_take_percent'] ?? 5) . '%,中奖时按占比瓜分派奖池',
];
},
],
'mystery_box' => [
'icon' => '📦',
'label' => '神秘箱子',
'color' => 'indigo',
'intro' => '管理员不定时在大厅投放神秘箱子,在线用户可点击领取,有惊喜也有陷阱!',
'details' => function ($p) {
return [
'普通奖励 ' . number_format($p['normal_reward_min'] ?? 500) . '' . number_format($p['normal_reward_max'] ?? 2000) . ' 金币',
'稀有奖励 ' . number_format($p['rare_reward_min'] ?? 5000) . '' . number_format($p['rare_reward_max'] ?? 20000) . ' 金币',
'陷阱概率 ' . ($p['trap_chance_percent'] ?? 10) . '%,触发扣除 ' . number_format($p['trap_penalty_min'] ?? 200) . '' . number_format($p['trap_penalty_max'] ?? 1000) . ' 金币',
'领取窗口 ' . ($p['claim_window_seconds'] ?? 60) . ' 秒,先到先得',
];
},
],
'fortune_telling' => [
'icon' => '🔮',
'label' => '神秘占卜',
'color' => 'purple',
'intro' => '向神秘占卜师请卦,每日免费一次,获得吉凶预言和 24 小时加成 Buff。',
'details' => function ($p) {
return [
'每日免费 ' . ($p['free_count_per_day'] ?? 1) . ' 次,额外次数消耗 ' . number_format($p['extra_cost'] ?? 500) . ' 金币',
'大吉 ' . ($p['jackpot_chance'] ?? 5) . '%・吉 ' . ($p['good_chance'] ?? 20) . '%・凶 ' . ($p['bad_chance'] ?? 20) . '%・诅咒 ' . ($p['curse_chance'] ?? 5) . '%',
'Buff 持续 ' . ($p['buff_duration_hours'] ?? 24) . ' 小时(影响金币 / 经验加成)',
];
},
],
'lottery' => [
'icon' => '🎟️',
'label' => '双色球彩票',
'color' => 'rose',
'intro' => '每日一期3 颗红球 + 1 颗蓝球,猜中越多奖励越丰厚,奖池无人中奖时自动滚存!',
'details' => function ($p) {
$drawH = $p['draw_hour'] ?? 20;
$drawM = str_pad($p['draw_minute'] ?? 0, 2, '0', STR_PAD_LEFT);
return [
'每注 ' . number_format($p['ticket_price'] ?? 100) . ' 金币,每人每期最多 ' . ($p['max_tickets_per_user'] ?? 50) . ' 注',
'每日 ' . $drawH . ':' . $drawM . ' 开奖,停售提前 ' . ($p['stop_sell_minutes'] ?? 2) . ' 分钟',
'一等奖 = 奖池 ' . ($p['prize_1st_ratio'] ?? 60) . '%,二等 ' . ($p['prize_2nd_ratio'] ?? 20) . '%,三等 ' . ($p['prize_3rd_ratio'] ?? 10) . '%',
'四等固定 ' . ($p['prize_4th_fixed'] ?? 150) . ' 金币,五等固定 ' . ($p['prize_5th_fixed'] ?? 50) . ' 金币',
'连续 ' . ($p['super_issue_threshold'] ?? 3) . ' 期无一等奖触发超级期,系统额外注入 ' . number_format($p['super_issue_inject'] ?? 20000) . ' 金币',
];
},
],
'gomoku' => [
'icon' => '♟️',
'label' => '五子棋',
'color' => 'slate',
'intro' => '15×15 棋盘率先五子连珠者胜。支持玩家对战PvP和人机对战PvE两种模式。',
'details' => function ($p) {
return [
'PvP 对战:胜者获得 ' . ($p['pvp_reward'] ?? 80) . ' 金币,邀请超时 ' . ($p['invite_timeout'] ?? 60) . ' 秒',
'简单(免费)胜奖 ' . ($p['pve_easy_reward'] ?? 20) . ' 金币',
'普通(入场 ' . ($p['pve_normal_fee'] ?? 10) . ' 金币)胜奖 ' . ($p['pve_normal_reward'] ?? 50) . ' 金币',
'困难(入场 ' . ($p['pve_hard_fee'] ?? 30) . ' 金币)胜奖 ' . ($p['pve_hard_reward'] ?? 120) . ' 金币',
'专家(入场 ' . ($p['pve_expert_fee'] ?? 80) . ' 金币)胜奖 ' . ($p['pve_expert_reward'] ?? 300) . ' 金币',
'每步限时 ' . ($p['move_timeout'] ?? 30) . ' 秒,超时判负',
];
},
],
];
// 颜色主题映射
$colorMap = [
'teal' => ['bg' => 'bg-teal-50', 'border' => 'border-teal-200', 'icon' => 'bg-teal-100', 'title' => 'text-teal-700', 'tag' => 'bg-teal-100 text-teal-700'],
'violet' => ['bg' => 'bg-violet-50', 'border' => 'border-violet-200','icon' => 'bg-violet-100', 'title' => 'text-violet-700','tag' => 'bg-violet-100 text-violet-700'],
'red' => ['bg' => 'bg-red-50', 'border' => 'border-red-200', 'icon' => 'bg-red-100', 'title' => 'text-red-700', 'tag' => 'bg-red-100 text-red-700'],
'amber' => ['bg' => 'bg-amber-50', 'border' => 'border-amber-200', 'icon' => 'bg-amber-100', 'title' => 'text-amber-700', 'tag' => 'bg-amber-100 text-amber-700'],
'indigo' => ['bg' => 'bg-indigo-50', 'border' => 'border-indigo-200','icon' => 'bg-indigo-100', 'title' => 'text-indigo-700','tag' => 'bg-indigo-100 text-indigo-700'],
'purple' => ['bg' => 'bg-purple-50', 'border' => 'border-purple-200','icon' => 'bg-purple-100', 'title' => 'text-purple-700','tag' => 'bg-purple-100 text-purple-700'],
'rose' => ['bg' => 'bg-rose-50', 'border' => 'border-rose-200', 'icon' => 'bg-rose-100', 'title' => 'text-rose-700', 'tag' => 'bg-rose-100 text-rose-700'],
'slate' => ['bg' => 'bg-slate-50', 'border' => 'border-slate-200', 'icon' => 'bg-slate-100', 'title' => 'text-slate-700', 'tag' => 'bg-slate-100 text-slate-700'],
];
@endphp
@section('content')
{{-- 右侧固定导航fixed 定位,独立于主内容之外) --}}
<aside id="guide-aside" style="position:fixed;top:80px;right:24px;width:160px;z-index:40;display:none;">
<nav class="guide-nav space-y-1" id="guide-nav">
<a href="#sec-exp"> 经验与等级</a>
<a href="#sec-gold">💰 金币系统</a>
<a href="#sec-charm"> 魅力系统</a>
<a href="#sec-gift">🎁 礼物系统</a>
<a href="#sec-vip">👑 VIP 会员</a>
@if($enabledGames->count() > 0)
<a href="#sec-games">🎮 娱乐游戏</a>
@endif
<a href="#sec-admin">🛡️ 管理权限</a>
<a href="#sec-rank">🏆 排行榜</a>
<a href="#sec-basic">💬 基础操作</a>
</nav>
</aside>
<main class="max-w-4xl mx-auto py-10 px-6">
<div>
{{-- 页面标题 --}}
<div class="text-center mb-10">
<h1 class="text-3xl font-extrabold text-gray-800 mb-2">🌟 飘落流星聊天室 · 使用说明</h1>
<p class="text-gray-500">了解如何获取经验、金币、魅力,以及各项功能和游戏的使用规则</p>
</div>
{{-- ═══ 1. 经验与等级 ═══ --}}
<section id="sec-exp" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-indigo-700 mb-4 flex items-center gap-2"> 经验与等级</h2>
<div class="space-y-3 text-sm text-gray-700">
<div class="bg-indigo-50 rounded-lg p-4">
<p class="font-bold text-indigo-800 mb-2">📈 如何获取经验?</p>
<ul class="list-disc list-inside space-y-1 text-gray-600">
<li>在聊天室内<strong>挂机聊天</strong>,系统自动每隔一段时间存点</li>
<li>每次存点获得 <strong class="text-indigo-600">{{ $expPerHb }}</strong> 点经验(支持范围随机)</li>
<li>VIP 会员享受经验加倍(详见会员系统)</li>
</ul>
</div>
<div class="bg-gray-50 rounded-lg p-4">
<p class="font-bold text-gray-800 mb-2">📊 等级经验对照表(最高 LV.{{ $maxLevel }}</p>
<div class="overflow-x-auto">
<table class="w-full text-xs">
<thead>
<tr class="bg-indigo-100 text-indigo-800">
<th class="px-3 py-2 rounded-tl-md">等级</th>
<th class="px-3 py-2">所需经验</th>
<th class="px-3 py-2">等级</th>
<th class="px-3 py-2 rounded-tr-md">所需经验</th>
</tr>
</thead>
<tbody>
@foreach ($levelExp as $i => $exp)
@if ($i % 2 === 0)
<tr class="{{ $i % 4 === 0 ? 'bg-white' : 'bg-gray-50' }}">
<td class="px-3 py-1.5 font-bold text-indigo-600">LV.{{ $i + 1 }}
</td>
<td class="px-3 py-1.5">{{ number_format($exp) }}</td>
@if (isset($levelExp[$i + 1]))
<td class="px-3 py-1.5 font-bold text-indigo-600">
LV.{{ $i + 2 }}</td>
<td class="px-3 py-1.5">{{ number_format($levelExp[$i + 1]) }}
</td>
@else
<td class="px-3 py-1.5" colspan="2"></td>
@endif
</tr>
@endif
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</section>
{{-- ═══ 2. 金币系统 ═══ --}}
<section id="sec-gold" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-amber-700 mb-4 flex items-center gap-2">💰 金币系统</h2>
<div class="bg-amber-50 rounded-lg p-4 text-sm text-gray-700">
<p class="font-bold text-amber-800 mb-2">如何获取金币?</p>
<ul class="list-disc list-inside space-y-1 text-gray-600">
<li>与经验一起,挂机聊天自动获得</li>
<li>每次存点获得 <strong class="text-amber-600">{{ $jjbPerHb }}</strong> 枚金币(支持范围随机)</li>
<li>VIP 会员享受金币加倍</li>
<li>参与游戏获胜可赢取金币奖励</li>
</ul>
<p class="font-bold text-amber-800 mt-4 mb-2">金币用途</p>
<ul class="list-disc list-inside space-y-1 text-gray-600">
<li>🎁 <strong>送礼物</strong> 向其他用户赠送礼物(消耗金币)</li>
@foreach($gameDefinitions as $key => $def)
@if($enabledGames->has($key))
<li>{{ $def['icon'] }} <strong>{{ $def['label'] }}</strong> 参与{{ $def['label'] }}游戏</li>
@endif
@endforeach
</ul>
</div>
</section>
{{-- ═══ 3. 魅力系统 ═══ --}}
<section id="sec-charm" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-pink-700 mb-4 flex items-center gap-2"> 魅力系统</h2>
<div class="space-y-3 text-sm text-gray-700">
<div class="bg-pink-50 rounded-lg p-4">
<p class="font-bold text-pink-800 mb-2">如何获取魅力?</p>
<ul class="list-disc list-inside space-y-1 text-gray-600">
<li><strong>聊天获取</strong> 对指定用户发言可获得魅力</li>
<li>异性聊天(男↔女):每条消息 <strong class="text-pink-600">+{{ $charmCross }}</strong>
魅力
</li>
<li>同性聊天(男↔男 / 女↔女):每条消息 <strong class="text-pink-600">+{{ $charmSame }}</strong>
魅力
</li>
<li>每小时上限 <strong class="text-pink-600">{{ $charmLimit }}</strong> 点(防刷屏保护)</li>
<li><strong>收到礼物</strong> 被赠送礼物时增加魅力(见下方礼物列表)</li>
</ul>
</div>
<div class="bg-pink-50/50 rounded-lg p-4">
<p class="font-bold text-pink-800 mb-1">💡 小贴士</p>
<p class="text-gray-600">对「大家」发言和悄悄话不增加魅力。注意设置正确的性别可以获得更多魅力哦!</p>
</div>
</div>
</section>
{{-- ═══ 4. 礼物系统 ═══ --}}
<section id="sec-gift" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-rose-700 mb-4 flex items-center gap-2">🎁 礼物系统</h2>
<p class="text-sm text-gray-600 mb-4">双击用户名打开名片,即可选择礼物赠送。送出礼物消耗金币,对方获得魅力。</p>
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-3">
@foreach ($gifts as $gift)
<div
class="bg-gray-50 rounded-xl p-3 text-center border border-gray-100 hover:shadow-sm transition">
<img src="/images/gifts/{{ $gift->image }}" alt="{{ $gift->name }}"
class="w-12 h-12 mx-auto object-contain mb-2">
<div class="font-bold text-sm text-gray-800">{{ $gift->emoji }} {{ $gift->name }}</div>
<div class="text-xs text-amber-600 mt-1">💰 {{ $gift->cost }} 金币</div>
<div class="text-xs text-pink-600"> +{{ $gift->charm }} 魅力</div>
</div>
@endforeach
</div>
</section>
{{-- ═══ 5. VIP 会员 ═══ --}}
@if ($vipLevels->count() > 0)
<section id="sec-vip" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-purple-700 mb-4 flex items-center gap-2">👑 VIP 会员</h2>
<p class="text-sm text-gray-600 mb-4">VIP 会员享受经验和金币获取加倍、专属进场特效等特权。</p>
<div class="overflow-x-auto">
<table class="w-full text-sm">
<thead>
<tr class="bg-purple-50 text-purple-800">
<th class="px-4 py-2 text-left rounded-tl-md">等级</th>
<th class="px-4 py-2 text-center">经验倍率</th>
<th class="px-4 py-2 text-center">金币倍率</th>
<th class="px-4 py-2 text-center">时长</th>
<th class="px-4 py-2 text-center">价格</th>
<th class="px-4 py-2 text-center rounded-tr-md">操作</th>
</tr>
</thead>
<tbody>
@foreach ($vipLevels as $vip)
<tr class="border-t border-gray-100">
<td class="px-4 py-2.5 font-bold" style="color: {{ $vip->color ?? '#333' }}">
{!! $vip->icon !!} {{ $vip->name }}
</td>
<td class="px-4 py-2.5 text-center text-indigo-600 font-bold">
×{{ $vip->exp_multiplier }}</td>
<td class="px-4 py-2.5 text-center text-amber-600 font-bold">
×{{ $vip->jjb_multiplier }}</td>
<td class="px-4 py-2.5 text-center text-gray-600">{{ $vip->duration_days > 0 ? $vip->duration_days . ' 天' : '永久' }}</td>
<td class="px-4 py-2.5 text-center text-rose-600 font-bold">
{{ $vip->price > 0 ? $vip->price . ' 元' : '免费' }}</td>
<td class="px-4 py-2.5 text-center">
@php
$isCurrentVipLevel = auth()->user()?->isVip() && (int) auth()->user()?->vip_level_id === (int) $vip->id;
@endphp
@if ($vip->price > 0 && $vipPaymentEnabled)
<form action="{{ route('vip.payment.store') }}" method="POST"
onsubmit="return confirm('确认支付 {{ $vip->price }} 元购买【{{ $vip->name }}】吗?');">
@csrf
<input type="hidden" name="vip_level_id" value="{{ $vip->id }}">
<button type="submit"
class="px-3 py-1.5 rounded-lg bg-indigo-600 text-white text-xs font-bold hover:bg-indigo-700 transition">
{{ $isCurrentVipLevel ? '立即续费' : '立即购买' }}
</button>
</form>
@elseif ($vip->price > 0)
<span class="inline-flex px-3 py-1.5 rounded-lg bg-gray-100 text-gray-500 text-xs font-bold">暂未开启</span>
@else
<span class="inline-flex px-3 py-1.5 rounded-lg bg-emerald-100 text-emerald-700 text-xs font-bold">联系管理员</span>
@endif
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<div class="mt-4 rounded-xl border border-indigo-100 bg-indigo-50 px-4 py-3 text-xs text-indigo-700">
VIP 会员支付由平台支付中心提供,最终开通结果以异步回调为准。
</div>
</section>
@endif
{{-- ═══ 6. 娱乐游戏 ═══ --}}
@if($enabledGames->count() > 0)
<section id="sec-games" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-green-700 mb-1 flex items-center gap-2">🎮 娱乐游戏</h2>
<p class="text-sm text-gray-500 mb-5">点击聊天室工具栏中的游戏图标即可参与,金币可通过挂机获得。</p>
<div class="space-y-4">
@foreach($gameDefinitions as $key => $def)
@if($enabledGames->has($key))
@php
$game = $enabledGames->get($key);
$params = $game->params ?? [];
$c = $colorMap[$def['color']] ?? $colorMap['slate'];
$details = ($def['details'])($params);
@endphp
<div class="rounded-xl border {{ $c['border'] }} {{ $c['bg'] }} p-4">
<div class="flex items-center gap-3 mb-3">
<span class="text-2xl w-10 h-10 flex items-center justify-center rounded-xl {{ $c['icon'] }}">{{ $def['icon'] }}</span>
<div>
<h3 class="font-bold {{ $c['title'] }} text-base">{{ $def['label'] }}</h3>
<p class="text-xs text-gray-500 mt-0.5">{{ $def['intro'] }}</p>
</div>
</div>
<ul class="space-y-1">
@foreach($details as $detail)
<li class="text-xs text-gray-600 flex items-start gap-1.5">
<span class="mt-0.5 shrink-0 w-4 h-4 rounded-full text-center leading-4 text-[10px] font-bold {{ $c['tag'] }}"></span>
{{ $detail }}
</li>
@endforeach
</ul>
</div>
@endif
@endforeach
</div>
</section>
@endif
{{-- ═══ 7. 管理权限 ═══ --}}
<section id="sec-admin" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-red-700 mb-4 flex items-center gap-2">🛡️ 管理权限</h2>
<p class="text-sm text-gray-600 mb-4">等级越高,可使用的管理功能越多。双击用户名片中可执行以下操作:</p>
<div class="space-y-2">
<div class="flex items-center gap-3 bg-yellow-50 rounded-lg px-4 py-3">
<span class="text-lg">⚠️</span>
<div>
<span class="font-bold text-gray-800">警告用户</span>
<span class="text-xs text-gray-500 ml-2">需要 LV.{{ $levelWarn }} 以上</span>
</div>
</div>
<div class="flex items-center gap-3 bg-indigo-50 rounded-lg px-4 py-3">
<span class="text-lg">🔇</span>
<div>
<span class="font-bold text-gray-800">禁言用户</span>
<span class="text-xs text-gray-500 ml-2">需要 LV.{{ $levelMute }} 以上</span>
</div>
</div>
<div class="flex items-center gap-3 bg-red-50 rounded-lg px-4 py-3">
<span class="text-lg">🚫</span>
<div>
<span class="font-bold text-gray-800">踢出用户</span>
<span class="text-xs text-gray-500 ml-2">需要 LV.{{ $levelKick }} 以上</span>
</div>
</div>
<div class="flex items-center gap-3 bg-blue-50 rounded-lg px-4 py-3">
<span class="text-lg">🧊</span>
<div>
<span class="font-bold text-gray-800">冻结账号</span>
<span class="text-xs text-gray-500 ml-2">需要 LV.{{ $levelFreeze }} 以上</span>
</div>
</div>
</div>
</section>
{{-- ═══ 8. 排行榜 ═══ --}}
<section id="sec-rank" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-emerald-700 mb-4 flex items-center gap-2">🏆 排行榜</h2>
<div class="bg-emerald-50 rounded-lg p-4 text-sm text-gray-700">
<ul class="list-disc list-inside space-y-1 text-gray-600">
<li><strong>经验排行</strong> 按总经验值排名</li>
<li><strong>金币排行</strong> 按金币数量排名</li>
<li><strong>魅力排行</strong> 按魅力值排名</li>
<li>排行榜显示前 <strong class="text-emerald-600">{{ $lbLimit }}</strong> </li>
</ul>
</div>
</section>
{{-- ═══ 9. 基础操作 ═══ --}}
<section id="sec-basic" class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-6">
<h2 class="text-xl font-bold text-gray-700 mb-4 flex items-center gap-2">💬 基础操作</h2>
<div class="space-y-3 text-sm text-gray-700">
<div class="bg-gray-50 rounded-lg p-4">
<ul class="space-y-2 text-gray-600">
<li>👆 <strong>单击用户名</strong> 切换聊天对象(私聊)</li>
<li>👆👆 <strong>双击用户名</strong> 打开用户名片(查看资料、送花、管理操作)</li>
<li>💬 <strong>对「大家」说</strong> 消息显示在公屏</li>
<li>💬 <strong>对指定用户说</strong> 消息显示在对方的私聊窗</li>
<li>🤫 <strong>悄悄话</strong> 只有双方可见的私密消息</li>
<li>📬 <strong>写私信</strong> 类似留言板,离线也能收到</li>
</ul>
</div>
</div>
</section>
</div>
</main>
@endsection
@section('scripts')
<script>
/**
* 滚动时高亮右侧导航当前所在板块
*/
(function() {
// 屏幕宽度 >= 1024px 时显示右侧导航
const aside = document.getElementById('guide-aside');
const nav = document.getElementById('guide-nav');
if (!aside || !nav) return;
function checkWidth() {
aside.style.display = window.innerWidth >= 1024 ? 'block' : 'none';
}
window.addEventListener('resize', checkWidth);
checkWidth();
const links = nav.querySelectorAll('a');
const sections = [];
links.forEach(a => {
const id = a.getAttribute('href').slice(1);
const el = document.getElementById(id);
if (el) sections.push({
el,
link: a
});
});
function onScroll() {
let current = sections[0];
for (const s of sections) {
if (s.el.getBoundingClientRect().top <= 120) current = s;
}
links.forEach(a => a.classList.remove('active'));
if (current) current.link.classList.add('active');
}
window.addEventListener('scroll', onScroll, {
passive: true
});
onScroll();
})();
</script>
@endsection