feat 会员list接口对接

api/userInfo.js

@@ -1,6 +1,7 @@
 import request from '@/utils/request'
 const serviceTitle = '/img'
 const prefix = '/img/mini/tiktok'
+const prefix_vip = '/img/mini/vip/'
 //GET 传参需要用 params
 //POST 传参需要用 data
 
@@ -12,3 +13,11 @@ export function listTiktokCollection(data) {
 		data: data
 	})
 }
+
+//获取会员list
+export function queryUserVipList() {
+	return request({
+		url: `${serviceTitle}${prefix}/queryUserVipList`,
+		method: 'get',
+	})
+}

pages/userInfo/vip/vip.vue

@@ -15,46 +15,18 @@
 		</view>
 
 		<view class="vip-box">
-			<view class="vip-box__item item-active">
+			<view class="vip-box__item" :class="{'item-active':active == index}" @click="change(index)" v-for="(item,index) in vipList" :key="index">
 				<view class="title">
-					1年
+					{{item.vipName}}
 				</view>
 				<view class="price">
-					<text class="price-unit">¥</text> 189
+					<text class="price-unit">¥</text> {{item.price}}
 				</view>
 				<view class="o-price">
-					¥388
+					{{item.originPrice}}
 				</view>
 				<view class="save-box">
-					立省60元
-				</view>
-			</view>
-			<view class="vip-box__item">
-				<view class="title">
-					1年
-				</view>
-				<view class="price">
-					<text class="price-unit">¥</text> 189
-				</view>
-				<view class="o-price">
-					¥388
-				</view>
-				<view class="save-box">
-					立省60元
-				</view>
-			</view>
-			<view class="vip-box__item">
-				<view class="title">
-					1年
-				</view>
-				<view class="price">
-					<text class="price-unit">¥</text> 189
-				</view>
-				<view class="o-price">
-					¥388
-				</view>
-				<view class="save-box">
-					立省60元
+					立省{{item.originPrice - item.price}}元
 				</view>
 			</view>
 		</view>
@@ -66,30 +38,39 @@
 </template>
 
 <script>
+	import {
+		queryUserVipList
+	} from '@/api/userInfo.js'
 	export default {
 		data() {
 			return {
-				userInfo: null
+				userInfo: null,
+				vipList:[],
+				active:0
 			}
 		},
 		methods: {
-
+			async getVipList() {
+				const {data} = await queryUserVipList();
+				this.vipList = data.data
+				console.log(this.vipList)
+			},
+			change(index){
+				this.active = index
+			}
 		},
 		onShow() {
 			this.userInfo = uni.getStorageSync('userInfo')
 		},
 		created() {
-			if (this.userInfo) {
-				uni.navigateTo({
-					url: url
-				});
-			} else {
+			if (!this.userInfo) {
 				uni.navigateBack()
 				uni.showToast({
 					title: '请先登录',
 					icon: 'none'
 				})
 			} 
+			this.getVipList()
 		}
 	}
 </script>
@@ -125,7 +106,7 @@
 
 				.title {
 					font-weight: bold;
-					font-size: 38rpx;
+					font-size: 30rpx;
 				}
 
 				.price {
@@ -139,7 +120,7 @@
 				}
 
 				.o-price {
-					color: #eee;
+					color: #1991fd;
 					font-size: 26rpx;
 					text-decoration: line-through;
 				}
@@ -161,10 +142,15 @@
 
 
 
-				.price,.title{
+				.price,
+				.title {
 					color: #fff;
 				}
 				
+				.o-price{
+					color: #eee;
+				}
+
 				.save-box {
 					color: #fff;
 					background-color: rgba(255, 255, 255, .1);