lkddi
50fc804402
- (Phase 8) 后台各维度管理与配置 - (Phase 9) 全自动静默挂机修仙升级 - (Phase 9) 四大维度风云排行榜页面 - (Phase 10) 全站留言板与悄悄话私信功能 - 运行 Pint 代码格式化
58 lines
2.9 KiB
PHP
58 lines
2.9 KiB
PHP
<ul class="divide-y divide-gray-100">
|
|
@forelse($users as $index => $user)
|
|
@php
|
|
// 前三名前景色
|
|
$rankBg = 'bg-gray-100 text-gray-500';
|
|
$rowBg = 'hover:bg-gray-50';
|
|
if ($index === 0) {
|
|
$rankBg = 'bg-yellow-400 text-yellow-900 shadow-md transform scale-110';
|
|
$rowBg = 'bg-yellow-50 hover:bg-yellow-100 border-l-4 border-yellow-400';
|
|
} elseif ($index === 1) {
|
|
$rankBg = 'bg-gray-300 text-gray-800 shadow-sm transform scale-105';
|
|
$rowBg = 'bg-gray-50 hover:bg-gray-100 border-l-4 border-gray-300';
|
|
} elseif ($index === 2) {
|
|
$rankBg = 'bg-orange-300 text-orange-900 shadow-sm';
|
|
$rowBg = 'bg-orange-50 hover:bg-orange-100 border-l-4 border-orange-300';
|
|
}
|
|
@endphp
|
|
<li class="p-3 flex items-center justify-between transition-colors duration-150 {{ $rowBg }}">
|
|
<!-- 左侧：名次与头像/名字 -->
|
|
<div class="flex items-center space-x-3 overflow-hidden">
|
|
<div
|
|
class="w-6 h-6 shrink-0 {{ $rankBg }} rounded-full flex items-center justify-center font-bold text-xs">
|
|
{{ $index + 1 }}
|
|
</div>
|
|
<div class="flex items-center space-x-2 truncate">
|
|
<img class="w-8 h-8 rounded border object-cover shrink-0"
|
|
src="/images/headface/{{ $user->headface ?? '01.gif' }}" alt="">
|
|
<div class="flex flex-col truncate">
|
|
<span class="text-sm font-bold text-gray-800 truncate" title="{{ $user->username }}">
|
|
{{ $user->username }}
|
|
@if ($user->sex == '女')
|
|
<span class="text-pink-500 text-xs ml-0.5">♀</span>
|
|
@elseif($user->sex == '男')
|
|
<span class="text-blue-500 text-xs ml-0.5">♂</span>
|
|
@endif
|
|
</span>
|
|
<span class="text-[10px] text-gray-500 truncate"
|
|
title="{{ $user->sign }}">{{ $user->sign ?: '这家伙很懒，什么也没留下' }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 右侧：数值 -->
|
|
<div class="flex flex-col items-end shrink-0 ml-2">
|
|
<span class="text-sm font-black {{ $index < 3 ? $color : 'text-gray-600' }}">
|
|
{{ number_format($user->$valueField) }}
|
|
<span
|
|
class="text-[10px] font-normal {{ $index < 3 ? $color : 'text-gray-400' }} ml-0.5">{{ $unit }}</span>
|
|
</span>
|
|
</div>
|
|
</li>
|
|
@empty
|
|
<li class="p-8 text-center text-sm text-gray-400 font-bold">
|
|
暂无数据登榜
|
|
</li>
|
|
@endforelse
|
|
</ul>
|