From 85f91fa5705b3af3a261158696bd5464a13f4dff Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Mon, 28 Aug 2023 21:03:42 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=9A=E5=91=98=E7=AD=89=E7=BA=A7=EF=BC=9A?=
 =?UTF-8?q?=E6=8E=A5=E5=85=A5=20api?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/member/level.js            |  11 +++
 pages/user/index.vue           |   7 +-
 pages/users/login/index.vue    |   3 +-
 pages/users/user_vip/index.vue | 141 ++++++++++++++++-----------------
 4 files changed, 86 insertions(+), 76 deletions(-)
 create mode 100644 api/member/level.js

diff --git a/api/member/level.js b/api/member/level.js
new file mode 100644
index 00000000..2dc5d3af
--- /dev/null
+++ b/api/member/level.js
@@ -0,0 +1,11 @@
+import request from "@/utils/request.js";
+
+// 获得会员等级列表
+export function getLevelList() {
+  return request.get('app-api/member/level/list');
+}
+
+// 获得会员经验记录分页
+export function getExperienceRecordPage() {
+  return request.get('app-api/member/experience-record/page');
+}
diff --git a/pages/user/index.vue b/pages/user/index.vue
index d95d91da..bbf5f43e 100644
--- a/pages/user/index.vue
+++ b/pages/user/index.vue
@@ -14,10 +14,9 @@
 								<view class="name" v-if="!isLogin" @tap="openAuto">请点击登录</view>
 								<view class="name" v-else>
 									{{ userInfo.nickname }}
-                  <!-- TODO 芋艿：vip 逻辑 -->
-									<view class="vip" v-if="userInfo.vip">
-										<image :src="userInfo.vipIcon" alt="" />
-                    <view style="margin-left: 10rpx;" class="vip-txt">{{userInfo.vipName || ''}}</view>
+									<view class="vip" v-if="userInfo.level">
+										<image :src="userInfo.level.icon" alt="" />
+                    <view style="margin-left: 10rpx;" class="vip-txt">{{ userInfo.level.name || ''}}</view>
 									</view>
 								</view>
                 <!-- 手机 -->
diff --git a/pages/users/login/index.vue b/pages/users/login/index.vue
index 0293fa7c..b9d4a8f2 100644
--- a/pages/users/login/index.vue
+++ b/pages/users/login/index.vue
@@ -301,7 +301,8 @@
           password: this.password,
           spread: this.$Cache.get("spread") // TODO 芋艿：后续接入
         }).then(({ data }) => {
-          debugger
+          // debugger
+          // TODO 芋艿：refreshToken 机制
           this.$store.commit("LOGIN", {
             'token': data.accessToken
           });
diff --git a/pages/users/user_vip/index.vue b/pages/users/user_vip/index.vue
index 104c36fb..80503590 100644
--- a/pages/users/user_vip/index.vue
+++ b/pages/users/user_vip/index.vue
@@ -1,22 +1,24 @@
 <template>
 	<view class="memberVip">
+    <!-- 基本信息 -->
 		<view class="bg">
 			<view class="header">
 				<view class="picTxt acea-row row-middle">
 					<view class="pictrue">
-						<image :src="userInfo.avatar"></image>
+						<image :src="userInfo.avatar" />
 					</view>
 					<view class="text acea-row row-middle">
-						<view class="name line1">{{userInfo.nickname}}</view>
-						<view class="vip" v-if='userInfo.vip'>
-							<image :src="userInfo.vipIcon"></image>{{userInfo.vipName}}
+						<view class="name line1">{{ userInfo.nickname }}</view>
+						<view class="vip" v-if='userInfo.level'>
+							<image :src="userInfo.level.icon" /> {{ userInfo.level.name }}
 						</view>
 					</view>
 				</view>
 			</view>
+      <!-- TODO -->
 			<view class="experience">
 				<view class="title">当前经验值</view>
-				<view class="num">{{levelInfo}}</view>
+				<view class="num">{{ userInfo.experience }}</view>
 				<view class="axis">
 					<view class="bar">
 						<view class="barCon">
@@ -25,16 +27,18 @@
 						<view class="acea-row row-around row-middle">
 							<view class="spotw acea-row row-center" v-for="(item,index) in levelList" :key='index'>
 								<view class="spot"
-									:class="current >item.experience?'past':'' + ' ' + current==item.experience?'on':''">
+									:class="current > item.experience?'past':'' + ' ' + current === item.experience?'on':''">
 								</view>
 							</view>
 						</view>
 					</view>
 					<view class="numList acea-row row-around row-middle">
-						<view class="item" :class="current >=item.experience?'past':''"
-							v-for="(item,index) in levelList" :key="index">{{item.experience}}</view>
+						<view class="item" :class="current >= item.experience?'past':''"
+                  v-for="(item,index) in levelList" :key="index">{{item.experience}}
+            </view>
 					</view>
 				</view>
+        <!-- 各种描述，没有逻辑 -->
 				<view class="vipList acea-row">
 					<view class="item">
 						<view class="pictrue">
@@ -68,6 +72,7 @@
 					</view>
 				</view>
 			</view>
+      <!-- 引导：攒经验 -->
 			<view class="module">
 				<view class="public_title acea-row row-middle">
 					<view class="icons"></view>获取经验
@@ -94,36 +99,27 @@
 						<navigator url="/pages/goods_cate/goods_cate" class="button" hover-class="none"
 							open-type='switchTab'>去获取</navigator>
 					</view>
-					<!-- <view class="item acea-row row-between-wrapper">
-						<view class="picTxt acea-row row-middle">
-							<view class="pictrue on2"><text class="iconfont icon-yaoqing"></text></view>
-							<view class="text">
-								<view class="name line1">邀请好友</view>
-								<view class="info line1">邀请好友注册商城可获得经验值</view>
-							</view>
-						</view>
-						<navigator url="/pages/users/user_spread_code/index" class="button" hover-class="none">去获取</navigator>
-					</view> -->
 				</view>
 			</view>
 		</view>
+    <!-- 经验列表 -->
 		<view class="detailed" v-if="expList.length">
 			<view class="public_title acea-row row-middle">
-				<view class="icons"></view>经验值明细
+				<view class="icons" />经验值明细
 			</view>
 			<view class="list">
 				<view class="item acea-row row-between-wrapper" v-for="(item,index) in expList" :key="index">
 					<view class="text">
-						<view class="name">{{item.title}}</view>
-						<view class="data">{{item.add_time}}</view>
+						<view class="name">{{ item.title }}</view>
+						<view class="data">{{ formatDate(item.createTime) }}</view>
 					</view>
-					<view class="num" v-if="item.pm">+{{item.number}}</view>
-					<view class="num on" v-else>-{{item.number}}</view>
+					<view class="num" v-if="item.experience > 0">+{{ item.experience }}</view>
+					<view class="num on" v-else>{{item.experience}}</view>
 				</view>
 			</view>
 		</view>
 		<view class='loadingicon acea-row row-center-wrapper' v-if="expList.length">
-			<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
+			<text class='loading iconfont icon-jiazai' :hidden='!loading' />{{loadTitle}}
 		</view>
 		<home></home>
 	</view>
@@ -131,96 +127,99 @@
 
 <script>
 	import home from '@/components/home';
-	import {
-		mapGetters
-	} from "vuex";
-	import {
-		getlevelInfo,
-		getlevelExpList
-	} from '@/api/user.js';
-	export default {
+	import { mapGetters } from "vuex";
+  import * as LevelApi from '@/api/member/level';
+  import dayjs from '@/plugin/dayjs/dayjs.min.js';
+  export default {
 		components: {
 			home
 		},
 		computed: mapGetters(['userInfo']),
 		data() {
 			return {
-				//userInfo: '',
 				levelInfo: '',
-				levelList: [],
-				current: 0,
+				levelList: [], // 会员等级列表
+				current: 0, // 当前等级的经验
 				widthLen: 0,
+
 				loading: false,
 				loadend: false,
-				loadTitle: '加载更多', //提示语
+				loadTitle: '加载更多', // 提示语
 				page: 1,
 				limit: 20,
 				expList: []
 			};
 		},
 		onLoad() {
-			this.levelInfo = this.userInfo.experience;
 			this.getInfo();
 			this.getlevelList();
 		},
 		methods: {
+      /**
+       * 获得会员等级列表
+       */
 			getInfo: function() {
-				let that = this;
-				getlevelInfo().then(res => {
+        LevelApi.getLevelList().then(res => {
 					let levelList = res.data;
-					let list = []
-					that.levelList = levelList;
+          this.levelList = levelList;
+
+          // 获得当前等级对应的经验
+          let list = []
 					levelList.map((item, index) => {
-						if (item.experience <= that.levelInfo) {
+						if (item.experience <= this.userInfo.experience) {
 							list.push(item.experience)
 						}
 					})
-					let maxn = Math.max.apply(null, list);
-					that.current = maxn;
+					const maxn = Math.max.apply(null, list);
+          this.current = maxn;
+
 					// 解决len取的值没有时；
-					let levelListLen = levelList[list.length] ? levelList[list.length] : levelList[list
-						.length - 1];
+					const levelListLen = levelList[list.length] ? levelList[list.length] : levelList[list.length - 1];
 					// 解决除数不能为0
-					let divisor = levelListLen.experience - maxn ? levelListLen.experience - maxn : 1;
+					const divisor = levelListLen.experience - maxn ? levelListLen.experience - maxn : 1;
 					// 每小格所占的百分比
-					let per = (that.levelInfo - maxn) / divisor / levelList.length;
-
-					that.widthLen = ((list.length - 0.5) / (levelList.length)) * 100 + per * 100
-
-				}).catch(function(res) {
-					return that.$util.Tips({
+					const per = (this.userInfo.experience - maxn) / divisor / levelList.length;
+					this.widthLen = ((list.length - 0.5) / (levelList.length)) * 100 + per * 100
+				}).catch(res => {
+					return this.$util.Tips({
 						title: res
 					});
 				})
 			},
+      /**
+       * 获得经验记录
+       */
 			getlevelList: function() {
-				let that = this
-				if (this.loadend) return false;
-				if (this.loading) return false;
-				getlevelExpList({
-					page: that.page,
-					limit: that.limit
+				if (this.loadend || this.loading) {
+          return false;
+        }
+        LevelApi.getExperienceRecordPage({
+					pageNo: this.page,
+          pageSize: this.limit
 				}).then(res => {
-					let list = res.data.list,
-						loadend = list.length < that.limit;
-					let expList = that.$util.SplitArray(list, that.expList);
-					that.$set(that, 'expList', expList);
-					that.loadend = loadend;
-					that.loadTitle = loadend ? '我也是有底线的' : '加载更多';
-					that.page = that.page + 1;
-					that.loading = false;
+					const list = res.data.list;
+          const loadend = list.length < this.limit;
+					let expList = this.$util.SplitArray(list, this.expList);
+          this.$set(this, 'expList', expList);
+          this.loadend = loadend;
+          this.loadTitle = loadend ? '我也是有底线的' : '加载更多';
+          this.page = this.page + 1;
+          this.loading = false;
 				}).catch(err => {
-					that.loading = false;
-					that.loadTitle = '加载更多';
+          this.loading = false;
+          this.loadTitle = '加载更多';
 				});
-			}
+			},
+
+      formatDate: function(date) {
+        return dayjs(date).format("YYYY-MM-DD HH:mm:ss");
+      }
 		},
 		onReachBottom: function() {
 			this.getlevelList();
 		}
 	}
 </script>
-
 <style lang="scss">
 	.memberVip {
 		.bg {