feat: 钓鱼功能

src/api/fishing/fishing.js

@@ -0,0 +1,8 @@
+import request from '@/utils/request'
+
+/**
+ * 拉杆钓鱼
+ */
+export function fishingClick () {
+    return request.post('/Fishing/pull')
+}

src/pages/fishing/Fishing.vue

@@ -1,24 +1,64 @@
-<!--
- * @Descripttion: 
- * @version: 1.0.0
- * @Author: LyMy
- * @Date: 2025-04-11 16:33:21
- * @LastEditors: LyMy
- * @LastEditTime: 2025-04-11 16:36:53
- * @FilePath: \fish_game\src\pages\fishing\Fishing.vue
--->
 <template>
     <div class="equipments-page">
         <h1>钓鱼</h1>
-    <p>这是钓鱼内容。</p>
+
+        <el-button type="primary" @click="handleFish">开始钓鱼</el-button>
+        <el-button @click="goHome" style="margin-left: 10px">返回</el-button>
+
+        <div class="result" v-if="resultMessage">
+            <p>{{ resultMessage }}</p>
+            <p v-if="nextPullTime">下次可钓鱼时间：{{ nextPullTime }}</p>
+        </div>
     </div>
 </template>
 
 <script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { ElMessage } from 'element-plus'
+import { fishingClick } from '@/api/fishing/fishing' // 你的钓鱼 API
+
+const router = useRouter()
+const resultMessage = ref('')
+const nextPullTime = ref('')
+
+const handleFish = async () => {
+    try {
+        const res = await fishingClick()
+        if (res.success) {
+            const items = res.data.items
+            nextPullTime.value = new Date(res.data.nextPullTime).toLocaleString()
+
+            if (items.length > 0) {
+                const fish = items[0]
+                resultMessage.value = `你钓到了一条${fish.isRare ? '稀有' : ''}的「${fish.fishName}」，重量 ${fish.weight}`
+                ElMessage.success('钓鱼成功！')
+            } else {
+                resultMessage.value = '什么也没钓到，下次好运 🍀'
+                ElMessage.warning('什么也没钓到，下次好运 🍀')
+            }
+        } else {
+            ElMessage.error(res.message || '钓鱼失败')
+        }
+    } catch (err) {
+        ElMessage.error('钓鱼出错，请稍后重试')
+        console.error(err)
+    }
+}
+
+const goHome = () => {
+    router.push('/')
+}
 </script>
 
 <style scoped>
 .equipments-page {
     text-align: center;
+    margin-top: 50px;
+}
+
+.result {
+    margin-top: 20px;
+    font-size: 16px;
 }
 </style>