antv/thankcard-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feature: main page - code be

Browse Source
This commit is contained in:
antv
2026-07-06 16:07:35 +07:00
parent e1fd70071b
commit 618dcef37f
9 changed files with 249 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/user/dashboard.blade.php
+13 -25
View File
@@ -19,7 +19,7 @@
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
<x-stat-card
title="Thanks đã nhận"
value="128"
value="{{ $receivedCount }}"
iconBgClass="bg-purple-50"
iconColorClass="text-purple-500">
<svg class="w-[26px] h-[26px]" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.8">
@@ -29,7 +29,7 @@
<x-stat-card
title="Thanks đã gửi"
value="82"
value="{{ $sentCount }}"
iconBgClass="bg-blue-50"
iconColorClass="text-blue-500">
<svg class="w-[26px] h-[26px] transform -rotate-45" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.8">
@@ -40,7 +40,7 @@
<x-stat-card
title="Thứ hạng"
value="#5"
value="#{{ $currentRank > 0 ? $currentRank : '-' }}"
iconBgClass="bg-green-50"
iconColorClass="text-green-500">
<svg class="w-[26px] h-[26px]" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.8">
@@ -119,26 +119,14 @@
</button>
</div>
<div id="ranking-received" class="flex-1 flex flex-col mb-2">
<x-ranking-item rank="1" name="Lê Quỳnh Chi" team="Marketing Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Chi&backgroundColor=fef3c7" score="95" unit="thẻ" />
<x-ranking-item rank="2" name="Trần Hoàng Nam" team="Dev Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Nam&backgroundColor=e2e8f0" score="82" unit="thẻ" />
<x-ranking-item rank="3" name="Phạm Đức Huy" team="Product Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Huy&backgroundColor=e2e8f0" score="67" unit="thẻ" />
<x-ranking-item rank="4" name="Hoàng Anh Tuấn" team="Dev Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Tuan&backgroundColor=e2e8f0" score="58" unit="thẻ" />
<div class="my-3 border-t border-dashed border-gray-100 mx-2"></div>
<x-ranking-item rank="7" name="{{ Auth::check() ? (Auth::user()->name ?? 'Nguyễn Minh Anh') : 'Nguyễn Minh Anh' }}" team="Product Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed={{ Auth::id() ?? 'MinhAnh' }}&backgroundColor=bfdbfe" score="45" unit="thẻ" :isCurrent="true" />
</div>
<div id="ranking-sent" class="flex-1 flex flex-col mb-2 hidden">
<x-ranking-item rank="1" name="Nguyễn Văn Lâm" team="HR Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Lam&backgroundColor=fef3c7" score="88" unit="thẻ" />
<x-ranking-item rank="2" name="Phạm Thu Thủy" team="Admin Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Thuy&backgroundColor=e2e8f0" score="75" unit="thẻ" />
<x-ranking-item rank="3" name="Lê Quỳnh Chi" team="Marketing Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Chi&backgroundColor=e2e8f0" score="64" unit="thẻ" />
<x-ranking-item rank="4" name="Đỗ Thùy Linh" team="Marketing Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed=Linh&backgroundColor=e2e8f0" score="55" unit="thẻ" />
<div class="my-3 border-t border-dashed border-gray-100 mx-2"></div>
<x-ranking-item rank="12" name="{{ Auth::check() ? (Auth::user()->name ?? 'Nguyễn Minh Anh') : 'Nguyễn Minh Anh' }}" team="Product Team" avatar="https://api.dicebear.com/7.x/notionists/svg?seed={{ Auth::id() ?? 'MinhAnh' }}&backgroundColor=bfdbfe" score="18" unit="thẻ" :isCurrent="true" />
<div id="ranking-list-container" class="flex-1 flex flex-col mb-2">
<!-- Pre-rendered ranking lists -->
<div id="ranking-received-content" class="flex-1 flex flex-col">
@include('user.partials.ranking_list', ['rankers' => $receivedRankers, 'currentUserRankItem' => $receivedCurrentUserRankItem])
</div>
<div id="ranking-sent-content" class="hidden flex-1 flex flex-col">
@include('user.partials.ranking_list', ['rankers' => $sentRankers, 'currentUserRankItem' => $sentCurrentUserRankItem])
</div>
</div>
</div>
</div>
@@ -151,8 +139,8 @@
function switchRankingTab(tab) {
const receivedTab = document.getElementById('tab-received');
const sentTab = document.getElementById('tab-sent');
const receivedContent = document.getElementById('ranking-received');
const sentContent = document.getElementById('ranking-sent');
const receivedContent = document.getElementById('ranking-received-content');
const sentContent = document.getElementById('ranking-sent-content');
const activeClass = 'flex items-center justify-center gap-2 w-[120px] py-2 rounded-[10px] transition-all bg-white shadow-[0_2px_4px_rgba(0,0,0,0.04)] text-[#3462f7] font-bold text-[14px]';
const inactiveClass = 'flex items-center justify-center gap-2 w-[120px] py-2 rounded-[10px] transition-all text-[#64748b] hover:text-gray-800 font-bold text-[14px]';