feat:我的鱼篓

src/api/fishbaskets/fishbaskets.js

@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+
+/**
+ * 我的鱼篓列表
+ */
+export function myFishBaskets () {
+    return request.get('/Fishing/all-fish')
+}

src/pages/fishbaskets/Fishbaskets.vue

@@ -4,21 +4,64 @@
  * @Author: LyMy
  * @Date: 2025-04-11 16:33:21
  * @LastEditors: LyMy
- * @LastEditTime: 2025-04-11 16:36:40
- * @FilePath: \fish_game\src\pages\fishbaskets\Fishbaskets.vue
+ * @LastEditTime: 2025-04-11 18:31:55
+ * @FilePath: \go_fish_web\src\pages\fishbaskets\Fishbaskets.vue
 -->
 <template>
-  <div class="equipments-page">
-    <h1>鱼篓</h1>
-    <p>这是鱼篓内容。</p>
-  </div>
+    <div class="equipments-page">
+        <h1>🎣 我的鱼篓</h1>
+        <el-table :data="fishList" style="width: 100%;height: calc(100vh - 240px);" border>
+            <el-table-column prop="name" label="鱼名" />
+            <el-table-column prop="weight" label="重量" align="right"/>
+            <el-table-column prop="description" label="描述" />
+            <el-table-column label="是否稀有" align="center">
+                <template #default="{ row }">
+                    <el-tag :type="row.isRare ? 'danger' : 'info'">
+                        {{ row.isRare ? '稀有' : '普通' }}
+                    </el-tag>
+                </template>
+            </el-table-column>
+        </el-table>
+    </div>
 </template>
 
 <script setup>
+import { ref, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+import { myFishBaskets } from '@/api/fishbaskets/fishbaskets'
+import { ElMessage } from 'element-plus'
+
+const fishList = ref([])
+const router = useRouter()
+
+const fetchFishList = async () => {
+    try {
+        const res = await myFishBaskets()
+        if (res) {
+            fishList.value = res
+        }
+    } catch (err) {
+        ElMessage.warning('请检查网络或重试')
+    }
+}
+
+const goHome = () => {
+    router.push('/')
+}
+
+onMounted(() => {
+    fetchFishList()
+})
 </script>
 
 <style scoped>
 .equipments-page {
-  text-align: center;
+    text-align: center;
+    margin-top: 50px;
+}
+
+.result {
+    margin-top: 20px;
+    font-size: 16px;
 }
 </style>