From 01bed46bce523d63e047e776d3970b69c7e8a814 Mon Sep 17 00:00:00 2001
From: lifizer <913626195@qq.com>
Date: Mon, 8 Apr 2024 13:06:01 +0800
Subject: [PATCH] =?UTF-8?q?Feat(=E7=A7=AF=E5=88=86):=E6=8E=A5=E5=8F=A3?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E5=AF=B9=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/user.js                 |  15 ++
 pages.json                  |  12 +-
 pages/user/Points/index.vue | 334 ++++++++++++++++++++++++++++++++++++
 pages/user/User/index.vue   |   2 +-
 4 files changed, 359 insertions(+), 4 deletions(-)
 create mode 100644 pages/user/Points/index.vue

diff --git a/api/user.js b/api/user.js
index ab4ac36..a8729e9 100644
--- a/api/user.js
+++ b/api/user.js
@@ -539,3 +539,18 @@ export function getRechargeApi() {
 export function getUserCenterBanner() {
     return request.get("userCenterBanner");
 }
+
+
+/*
+ * 用户积分信息
+ */
+export function getUserPointInfo(param) {
+    return request.get('/user/points/info', param, { login: true })
+}
+
+/*
+ * 用户积分记录
+ */
+export function getUserPointBill(param) {
+    return request.get('/user/points/bill', param, { login: true })
+}
diff --git a/pages.json b/pages.json
index 17c2787..27cd12c 100644
--- a/pages.json
+++ b/pages.json
@@ -358,6 +358,12 @@
       "style": {
         "navigationBarTitleText": "我的喜欢"
       }
+    },
+    {
+      "path": "pages/user/Points/index",
+      "style": {
+        "navigationBarTitleText": "积分"
+      }
     }
   ],
   "subPackages": [
@@ -827,7 +833,7 @@
       {
         "name": "商品详情",
         "path": "pages/shop/GoodsCon/index",
-        "query": "id=277"
+        "query": "id=588"
       },
       {
         "name": "店铺详情",
@@ -865,8 +871,8 @@
         "query": ""
       },
       {
-        "name": "特色礼品",
-        "path": "pkg_product/views/giftList",
+        "name": "积分",
+        "path": "pages/user/Points/index",
         "query": ""
       }
     ]
diff --git a/pages/user/Points/index.vue b/pages/user/Points/index.vue
new file mode 100644
index 0000000..3a2aedf
--- /dev/null
+++ b/pages/user/Points/index.vue
@@ -0,0 +1,334 @@
+<template>
+  <view class="point-page">
+    <view v-if="isLoad">
+      <view class="rule-btn" @click="showHidePopup(true)">
+        积分规则
+      </view>
+      <view class="tab-wrap">
+        <view
+          :class="query.pm === 1 ? 'curr' : ''"
+          class="tab-item"
+          @click="tabItemClick(1)"
+        >
+          <view class="txt">当前总积分</view>
+          <view class="number">
+            <image
+              v-if="query.pm === 1"
+              :src="webUrl + '/page/my/coin.png'"
+              class="icon"
+            />
+            {{ point.currentPoints }}
+          </view>
+        </view>
+        <view
+          :class="query.pm === 0 ? 'curr' : ''"
+          class="tab-item"
+          @click="tabItemClick(0)"
+        >
+          <view class="txt">已使用积分</view>
+          <view class="number">
+            <image
+              v-if="query.pm === 0"
+              :src="webUrl + '/page/my/coin.png'"
+              class="icon"
+            />
+            {{ point.totalUsedPoints }}
+          </view>
+        </view>
+      </view>
+      <view class="list-wrap">
+        <view
+          v-for="(item, index) in list"
+          :key="index"
+          class="item"
+        >
+          <view v-if="item.orderId" class="order">
+            <view class="title">
+              <view class="img">
+                <image :src="item.src" class="img" />
+              </view>
+              <view class="name more-t">
+                <view class="more-t">
+                  {{ item.title }}
+                </view>
+                <view class="number">
+                  {{ item.number }}
+                </view>
+              </view>
+            </view>
+            <view class="bottom" @click="goOrderDetails(item)">
+              <view class="txt">
+                点击查看详情  >>
+              </view>
+              <text class="iconfont icon-jiantou"></text>
+            </view>
+          </view>
+          <view v-else class="lottery">
+            <view class="one-t title">
+              {{ item.title }}
+            </view>
+            <view class="number">
+              {{ item.number }}
+            </view>
+          </view>
+        </view>
+        <goo-skeleton
+          v-if="isLoading"
+          :show-avatar="false"
+        />
+        <view v-else>
+          <view v-if="list.length === 0" class="no-data">
+            暂无数据
+          </view>
+          <u-loadmore
+            v-if="query.page >= totalPage"
+            :line="true"
+            status="nomore"
+            nomore-text="到底了"
+          />
+        </view>
+      </view>
+    </view>
+    <goo-skeleton
+      v-else
+      :show-avatar="false"
+    />
+    <u-popup
+      :show="show"
+      mode="center"
+      round="10"
+      closeable
+      @close="showHidePopup(false)"
+    >
+      <view class="popup-body">
+        <view class="title bold">积分规则</view>
+        <view class="content">
+          <rich-text :nodes="point.pointsRule" />
+        </view>
+      </view>
+    </u-popup>
+  </view>
+</template>
+<script>
+import {
+  getUserPointInfo,
+  getUserPointBill
+} from '@/api/user'
+export default {
+  name: 'UserPoints',
+  props: {},
+  data: function() {
+    return {
+      webUrl: this.$VUE_APP_RESOURCES_URL,
+      query: {
+        pm: 1, // 0-支出,1-收入
+        page: 1,
+        limit: 10
+      },
+      isLoading: false,
+      list: [],
+      totalPage: 1,
+      isLoad: false,
+      point: {
+        currentPoints: 0, // 当前总积分
+        totalUsedPoints: 0, // 累计使用积分
+        pointsRule: ''
+      },
+      show: false
+    }
+  },
+  created() {
+    this.getInfo()
+  },
+  onReachBottom() {
+    if (this.isLoading || this.query.page >= this.totalPage) {
+      return
+    }
+    this.query.page++
+    this.getList()
+  },
+  methods: {
+    tabItemClick(type) {
+      if (this.query.pm === type) {
+        return
+      }
+      this.query.pm = type
+      this.query.page = 1
+      this.list = []
+      this.getList()
+    },
+    getInfo() {
+      getUserPointInfo().then(res => {
+        const { success, data } = res
+        if (success) {
+          this.isLoad = true
+          this.point = data
+          this.getList()
+        }
+      })
+    },
+    getList() {
+      this.isLoading = true
+      getUserPointBill(this.query).then(res => {
+        const { success, data } = res
+        if (success) {
+          this.totalPage = data.pages
+          if (data.records.length > 0) {
+            data.records.map(item => {
+              this.list.push(item)
+            })
+          }
+        }
+      }).finally(() => {
+        this.isLoading = false
+      })
+    },
+    goOrderDetails(order) {
+      this.$yrouter.push({
+        path: '/pages/order/OrderDetails/index',
+        query: {
+          id: order.orderId
+        }
+      })
+    },
+    showHidePopup(value) {
+      this.show = value
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.point-page {
+  padding: 30rpx;
+  .rule-btn {
+    position: fixed;
+    right: 0;
+    top: 260rpx;
+    z-index: 9;
+    height: 30rpx;
+    padding: 20rpx 30rpx 20rpx 40rpx;
+    border-top-left-radius: 35rpx;
+    border-bottom-left-radius: 35rpx;
+    color: #fff;
+    font-size: 14px;
+    line-height: 30rpx;
+    background-color: #C51919;
+  }
+  .tab-wrap {
+    display: flex;
+    align-items: center;
+    .tab-item {
+      flex: 1;
+      justify-content: center;
+      padding: 20rpx;
+      border-radius: 15rpx;
+      background-color: #fff;
+      .txt {
+        width: 100px;
+        height: 36px;
+        padding: 0 20rpx;
+        margin: 0 auto;
+        border-radius: 4px;
+        border: 1px solid #C51919;
+        line-height: 36px;
+        text-align: center;
+        color: #C51919;
+        font-size: 16px;
+      }
+      .number {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        margin: 20rpx 0 0 0;
+        font-size: 20px;
+        color: #333;
+        font-weight: bold;
+        line-height: 26px;
+        .icon {
+          width: 40rpx;
+          height: 40rpx;
+          margin: 0 20rpx 0 0;
+        }
+      }
+      &.curr {
+        padding: 35rpx 20rpx;
+        background-color: #C51919;
+        .txt {
+          border-color: #fff;
+          color: #fff;
+        }
+        .number {
+          font-size: 26px;
+          color: #fff;
+        }
+      }
+    }
+  }
+  .list-wrap {
+    .item {
+      margin: 30rpx 0 0 0;
+      border-radius: 8px;
+      background-color: #fff;
+      .order {
+        .title {
+          display: flex;
+          padding: 20rpx;
+          .img {
+            display: block;
+            width: 120rpx;
+            height: 120rpx;
+            margin: 0 20rpx 0 0;
+            background-color: #f6f6f6;
+          }
+          .name {
+            width: calc(100% - 140rpx);
+            color: #333;
+          }
+          .number {
+            text-align: right;
+          }
+        }
+        .bottom {
+          display: flex;
+          padding: 20rpx;
+          border-top: 1rpx solid #f6f6f6;
+          font-size: 12px;
+          color: #666;
+          .txt {
+            flex: 1;
+            color: #FD5749;
+          }
+          .iconfont {
+            font-size: 14px;
+          }
+        }
+      }
+      .lottery {
+        display: flex;
+        padding: 20rpx;
+        .title {
+          width: calc(100% - 160rpx);
+        }
+      }
+    }
+  }
+  .no-data {
+    line-height: 200rpx;
+    text-align: center;
+    font-size: 16px;
+    color: #999;
+  }
+  .popup-body {
+    .title {
+      line-height: 80rpx;
+      text-align: center;
+    }
+    .content {
+      max-height: 70vh;
+      padding: 30rpx;
+      overflow-y: auto;
+    }
+  }
+}
+</style>
+
diff --git a/pages/user/User/index.vue b/pages/user/User/index.vue
index faaed09..25c4a51 100644
--- a/pages/user/User/index.vue
+++ b/pages/user/User/index.vue
@@ -57,7 +57,7 @@
               余额
             </view>
           </view>
-          <view class="item">
+          <view class="item" @click="linkTo('/pages/user/Points/index')">
             <view class="number">
               {{ userInfo.integral || 0 }}
             </view>