feat：我的积分接口对接（总数、本月新获取积分、本月即将到期的积分、已完成的任务、待完成的任务）

src/api/points.js

@@ -1,5 +1,13 @@
 import request from "@/utils/request.js";
 
+//获取我的积分信息
+export function getMyPoint(data) {
+    return request({
+        method: 'get',
+        url: '/user/point',
+        data
+    });
+}
 // 积分商品列表
 export function getPointShopList(data) {
     // 模拟数据返回

src/points/home/index.vue

@@ -3,6 +3,7 @@ import SignIn from '../components/sign-in/sign-in.vue'
 import TaskList from '../components/task-list/task-list.vue'
 import ProductList from '../components/product-list/product-list.vue'
 import ImageItem from "@/components/swiper/components/image.vue";
+import { mapState, mapActions } from 'vuex';
 
 export default {
   components: {
@@ -11,15 +12,27 @@ export default {
     TaskList,
     ProductList
   },
+  computed: {
+    ...mapState({
+      myPoint: state => state.points.myPoint
+    }),
+    totalPoints() {
+      return this.myPoint.totalPoints || 0;
+    },
+    monthlyPoints() {
+      return this.myPoint.earnedPoints || 0;
+    }
+  },
   data() {
     return {
-      totalPoints: 999,
-      monthlyPoints: 888,
       // 滚动距离
       scrollTop: 0
     }
   },
   mounted() {
+    // 获取积分信息
+    this.getPointsInfo();
+    
     // 在H5端添加滚动事件监听器
     if (process.env.UNI_PLATFORM === 'h5') {
       // 使用this.$el获取当前组件的根元素
@@ -45,6 +58,9 @@ export default {
     }
   },
   methods: {
+    ...mapActions([
+      'getPointsInfo'
+    ]),
     handleScroll() {
       const homeEl = this.$el
       if (homeEl) {

src/points/pointInfo/billPage.vue

@@ -4,15 +4,15 @@
     <view class="points-header">
       <view class="points-item">
         <text class="points-label">当前可用积分</text>
-        <text class="points-value">{{ pointsData.current }}</text>
+        <text class="points-value">{{ totalPoints }}</text>
       </view>
       <view class="points-item">
         <text class="points-label">本月获得积分</text>
-        <text class="points-value">{{ pointsData.monthlyEarned }}</text>
+        <text class="points-value">{{ earnedPoints }}</text>
       </view>
       <view class="points-item">
         <text class="points-label">本月即将到期积分</text>
-        <text class="points-value">{{ pointsData.monthlyExpiring }}</text>
+        <text class="points-value">{{ expirePoints }}</text>
       </view>
     </view>
 
@@ -71,16 +71,12 @@
 </template>
 
 <script>
+import {mapState} from "vuex";
+
 export default {
   name: "billPage",
   data() {
     return {
-      // 积分数据
-      pointsData: {
-        current: 10000,
-        monthlyEarned: 500,
-        monthlyExpiring: 100
-      },
       // 标签数据
       tabs: [
         { key: 'all', name: '明细' },
@@ -118,6 +114,18 @@ export default {
     }
   },
   computed: {
+    ...mapState({
+      myPoint: state => state.points.myPoint
+    }),
+    totalPoints() {
+      return this.myPoint.totalPoints || 0;
+    },
+    earnedPoints() {
+      return this.myPoint.earnedPoints || 0;
+    },
+    expirePoints() {
+      return this.myPoint.expirePoints || 0;
+    },
     categoryIndex() {
       return this.tabs.findIndex(item => item.key === this.activeTab)
     },

src/points/pointInfo/taskList.vue

@@ -8,15 +8,15 @@
         </view>
       </view>
       <view class="points-item">
-        <text class="points-value">{{ pointsData.current }}</text>
+        <text class="points-value">{{ totalPoints }}</text>
         <text class="points-label">我的积分</text>
       </view>
       <view class="points-item">
-        <text class="points-value">{{ pointsData.completedTasks }}</text>
+        <text class="points-value">{{ completedTask }}</text>
         <text class="points-label">已完成任务</text>
       </view>
       <view class="points-item">
-        <text class="points-value">{{ pointsData.pendingTasks }}</text>
+        <text class="points-value">{{ pendingTasks }}</text>
         <text class="points-label">待完成任务</text>
       </view>
     </view>
@@ -78,18 +78,33 @@
 
 <script>
 import ImageItem from "@/components/swiper/components/image.vue";
-
+import { mapState } from 'vuex';
 export default {
   name: "taskList",
   components: {ImageItem},
+  computed: {
+    ...mapState({
+      myPoint: state => state.points.myPoint
+    }),
+    totalPoints() {
+      return this.myPoint.totalPoints || 0;
+    },
+    completedTask() {
+      return this.myPoint.completedTask || 0;
+    },
+    pendingTasks() {
+      return this.myPoint.pendingTasks || 0;
+    },
+    categoryIndex() {
+      return this.tabs.findIndex(item => item.key === this.activeTab)
+    },
+    // 过滤后的任务
+    filteredTasks() {
+      return this.tasks.filter(task => task.type === this.activeTab)
+    }
+  },
   data() {
     return {
-      // 积分数据
-      pointsData: {
-        current: 563,
-        completedTasks: 10,
-        pendingTasks: 15
-      },
       // 标签数据
       tabs: [
         { key: 'new', name: '新手任务' },
@@ -148,15 +163,6 @@ export default {
       ]
     }
   },
-  computed: {
-    categoryIndex() {
-      return this.tabs.findIndex(item => item.key === this.activeTab)
-    },
-    // 过滤后的任务
-    filteredTasks() {
-      return this.tasks.filter(task => task.type === this.activeTab)
-    }
-  },
   methods: {
     // 切换标签
     handleTabChange(data) {

src/store/index.js

@@ -2,13 +2,15 @@ import Vue from 'vue';
 import Vuex from 'vuex';
 import user from './modules/user';
 import other from './modules/other';
+import points from './modules/points';
 
 Vue.use(Vuex);
 
 const store = new Vuex.Store({
 	modules: {
 		user,
-		other
+		other,
+		points
 	},
 });
 

src/store/modules/points.js

@@ -0,0 +1,33 @@
+import {getMyPoint} from '@/api/points'
+const other = {
+    state: {
+       myPoint:{
+           totalPoints:'',  //总数
+           earnedPoints:'',  //本月新获取积分
+           expirePoints:'',  //本月即将到期的积分
+           completedTask:'',  //已完成的任务
+           pendingTasks:''   //待完成的任务
+       }
+    },
+    mutations: {
+        SET_POINTINFO: (state, payload) => {
+            console.log('SET_POINTINFO', payload)
+            state.myPoint = payload;
+        },
+    },
+    actions: {
+        // 获取积分信息
+        async getPointsInfo({ commit }) {
+            try {
+                const res = await getMyPoint();
+                if (res && res.data) {
+                    commit('SET_POINTINFO', res.data.data);
+                }
+            } catch (error) {
+                console.error('获取积分信息失败:', error);
+            }
+        },
+    }
+}
+
+export default other;