feat: 排行榜

1 year ago · 5cde67672b
parent 416a0427cf
commit 5cde67672b
8 changed files with 139 additions and 32 deletions
--- a/index.html
+++ b/index.html
@ -4,7 +4,7 @@
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Vue</title>
+    <title>钓鱼</title>
  </head>
  <body>
    <div id="app"></div>
--- a/src/api/ranking/ranking.js
+++ b/src/api/ranking/ranking.js
@ -0,0 +1,24 @@
+/*
+ * @Descripttion: 
+ * @version: 1.0.0
+ * @Author: LyMy
+ * @Date: 2025-04-12 12:54:52
+ * @LastEditors: LyMy
+ * @LastEditTime: 2025-04-12 14:14:19
+ * @FilePath: \go_fish_web\src\api\ranking\ranking.js
+ */
+import request from '@/utils/request'
+
+/**
+ * 我的分数
+ */
+export function myRanking () {
+    return request.get('/Rank/score')
+}
+
+/**
+ * 全球分数
+ */
+export function globalRanking () {
+    return request.get('/Rank/rankings')
+}
--- a/src/pages/fishbaskets/Fishbaskets.vue
+++ b/src/pages/fishbaskets/Fishbaskets.vue
@ -29,7 +29,7 @@
            <!-- 出售按钮 -->
            <el-table-column label="操作" align="center" width="180">
                <template #default="{ row }">
-                    <el-button type="primary" @click="handleFish(row.id)">处理</el-button>
+                    <el-button :loading="loading" type="primary" @click="handleFish(row.id)">处理</el-button>
                    <el-button v-if="row.isRare" type="danger" @click="handleSell(row)">出售</el-button>
                </template>
            </el-table-column>
@ -40,9 +40,10 @@
 <script setup>
 import { ref, onMounted, computed } from 'vue'
 import { useRouter } from 'vue-router'
-import { myFishBaskets, handleFishById, sellFish, autoHandleFish } from '@/api/fishbaskets/fishbaskets' // 添加 sellFish 接口
+import { myFishBaskets, handleFishById, sellFish, autoHandleFish } from '@/api/fishbaskets/fishbaskets'
 import { ElMessage, ElInput, ElMessageBox } from 'element-plus'

+const loading = ref(false)
 const activeTab = ref('all')
 const fishList = ref([])
 const router = useRouter()
@ -87,6 +88,7 @@ const handleProcessFish = async () => {
 }
 // 手动处理鱼
 const handleFish = async (fishId) => {
+    loading.value = true
    try {
        const res = await handleFishById(fishId)
        if (res) {
@ -99,6 +101,9 @@ const handleFish = async (fishId) => {
        console.log('====================================');
        ElMessage.warning('处理失败，请稍后再试')
    }
+    finally {
+        loading.value = false
+    }
 }

 // 处理出售操作
--- a/src/pages/market/Market.vue
+++ b/src/pages/market/Market.vue
@ -12,8 +12,8 @@
        <el-table v-if="activeTab === 'all'" :data="marketList" style="width: 100%" height="calc(100vh - 110px)" border>
            <el-table-column prop="id" label="ID" width="80" />
            <el-table-column prop="fishName" label="鱼名" />
-            <el-table-column prop="sellerName" label="卖家" />
-            <el-table-column prop="points" label="价格（点数）" width="150" />
+            <el-table-column prop="sellerName" label="卖家" width="200" />
+            <el-table-column prop="points" label="价格（点数）" width="150" align="right" />
            <el-table-column label="操作" width="150">
                <template #default="{ row }">
                    <el-button type="success" @click="buyFish(row)">购买</el-button>
@ -25,7 +25,7 @@
        <el-table v-if="activeTab === 'mine'" :data="myMarketList" style="width: 100%" height="calc(100vh - 110px)" border>
            <el-table-column prop="id" label="ID" width="80" />
            <el-table-column prop="fishName" label="鱼名" />
-            <el-table-column prop="points" label="挂售价格" />
+            <el-table-column prop="points" label="挂售价格" align="right" />
            <el-table-column label="操作">
                <template #default="{ row }">
                    <el-button type="danger" @click="removeMyListing(row)">下架</el-button>
--- a/src/pages/ranking/Ranking.vue
+++ b/src/pages/ranking/Ranking.vue
@ -2,23 +2,87 @@
 * @Descripttion: 
 * @version: 1.0.0
 * @Author: LyMy
- * @Date: 2025-04-11 16:33:21
+ * @Date: 2025-04-11 16:51:41
 * @LastEditors: LyMy
- * @LastEditTime: 2025-04-11 16:36:40
- * @FilePath: \fish_game\src\pages\fishbaskets\Fishbaskets.vue
+ * @LastEditTime: 2025-04-12 14:13:01
+ * @FilePath: \go_fish_web\src\pages\ranking\Ranking.vue
 -->
 <template>
-  <div class="equipments-page">
-    <h1>排名</h1>
-    <p>这是排名内容。</p>
-  </div>
+    <div class="ranking-page">
+        <h1>🏆 钓鱼排行榜</h1>
+
+        <!-- 我的信息 -->
+        <el-card class="my-info-card" shadow="hover">
+            <template #header>🎣 我的钓鱼成绩</template>
+            <div class="my-info">
+                <p><strong>得分：</strong>{{ myScore?.score }}</p>
+                <p><strong>描述：</strong>{{ myScore?.description }}</p>
+            </div>
+        </el-card>
+
+        <!-- 排名列表 -->
+        <el-table v-if="rankings?.items?.length" :data="rankings.items" border style="width: 100%; margin-top: 20px">
+            <el-table-column prop="rank" label="名次" width="80" />
+            <el-table-column prop="name" label="玩家名称" />
+            <el-table-column prop="score" label="得分" width="120" />
+            <el-table-column prop="count" label="钓鱼数" width="120" />
+            <el-table-column label="最大鱼" min-width="250">
+                <template #default="{ row }">
+                    {{ row.maxFishName }} - {{ row.maxWeight }}
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <el-empty v-else description="暂无排行榜数据" style="margin-top: 30px" />
+    </div>
 </template>

 <script setup>
+import { ref, onMounted } from 'vue'
+import { myRanking, globalRanking } from '@/api/ranking/ranking'
+import { ElMessage } from 'element-plus'
+
+const rankings = ref(null)
+const myScore = ref(null)
+
+const fetchRankings = async () => {
+    try {
+        const res = await globalRanking()
+        rankings.value = res
+    } catch (err) {
+        ElMessage.error('获取排行榜失败')
+    }
+}
+
+const fetchMyScore = async () => {
+    try {
+        const res = await myRanking()
+        myScore.value = res
+    } catch (err) {
+        ElMessage.error('获取我的得分失败')
+    }
+}
+
+onMounted(() => {
+    document.title = '钓鱼排行榜'
+    fetchRankings()
+    fetchMyScore()
+})
 </script>

 <style scoped>
-.equipments-page {
-  text-align: center;
+.ranking-page {
+    padding: 20px;
+    max-width: 900px;
+    margin: 0 auto;
+}
+
+.my-info-card {
+    margin-bottom: 20px;
+}
+
+.my-info p {
+    margin: 8px 0;
+    font-size: 16px;
 }
 </style>
--- a/src/router.js
+++ b/src/router.js
@ -1,3 +1,12 @@
+/*
+ * @Descripttion: 
+ * @version: 1.0.0
+ * @Author: LyMy
+ * @Date: 2025-04-11 16:51:41
+ * @LastEditors: LyMy
+ * @LastEditTime: 2025-04-12 12:34:29
+ * @FilePath: \go_fish_web\src\router.js
+ */
 import { createRouter, createWebHistory } from 'vue-router'
 import Login from './pages/login/Login.vue'
 import Home from './pages/main/Home.vue'
@ -71,4 +80,8 @@ router.beforeEach((to, from, next) => {
    }
 })

+router.afterEach((to) => {
+    document.title = "钓鱼"
+})
+
 export default router
--- a/src/utils/request.js
+++ b/src/utils/request.js
@ -4,13 +4,15 @@
 * @Author: LyMy
 * @Date: 2025-04-11 15:56:12
 * @LastEditors: LyMy
- * @LastEditTime: 2025-04-11 20:26:22
+ * @LastEditTime: 2025-04-12 14:17:15
 * @FilePath: \go_fish_web\src\utils\request.js
 */
 import axios from 'axios'
 import { ElMessage } from 'element-plus'
 import router from '@/router'

+let isRefreshing = false
+
 // 创建 axios 实例
 const request = axios.create({
  baseURL: 'http://49.235.165.171:31001',
@ -32,17 +34,25 @@ request.interceptors.request.use(
  (error) => Promise.reject(error)
 )

-// 响应拦截器：统一处理错误
+// 响应拦截器
 request.interceptors.response.use(
  (response) => response.data,
  (error) => {
    const status = error.response?.status

    if (status === 401) {
-      // token 失效
-      ElMessage.warning('登录已过期，请重新登录')
-      localStorage.removeItem('token')
-      router.push('/login')
+      // 避免重复处理 401
+      if (!isRefreshing) {
+        isRefreshing = true
+        ElMessage.warning('登录已过期，请重新登录')
+        localStorage.removeItem('token')
+        router.push('/login')
+
+        // 重置标志位，避免死锁
+        setTimeout(() => {
+          isRefreshing = false
+        }, 3000) // 避免多次跳转，给 3 秒冷却时间
+      }
    } else {
      ElMessage.error(error.response?.data?.message || '请求失败，请稍后再试')
    }
--- a/vite.config.js
+++ b/vite.config.js
@ -1,21 +1,12 @@
-/*
- * @Descripttion: 
- * @version: 1.0.0
- * @Author: LyMy
- * @Date: 2025-04-11 15:43:49
- * @LastEditors: LyMy
- * @LastEditTime: 2025-04-11 16:07:34
- * @FilePath: \fish_game\vite.config.js
- */
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
-import path from 'path' // 需要导入 path 模块
+import path from 'path'

 export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
-      '@': path.resolve(__dirname, 'src') // 加这行
+      '@': path.resolve(__dirname, 'src')
    }
  }
 })