From cb90eff3c72935e0fda16895d3bf21470bc3ec67 Mon Sep 17 00:00:00 2001
From: chengkun <2500338766@qq.com>
Date: Thu, 5 May 2022 14:57:24 +0800
Subject: [PATCH] =?UTF-8?q?1.0.0=EF=BC=9A=E5=AE=8C=E5=96=84=E8=89=BA?=
 =?UTF-8?q?=E6=9C=AF=E5=AE=B6=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/creator.js                               | 21 +++---
 api/myCollection.js                          | 14 ++++
 pages/creator/creator.vue                    | 67 +++++++++++++++++---
 pages/userInfo/myCollection/myCollection.vue | 20 +++++-
 4 files changed, 102 insertions(+), 20 deletions(-)
 create mode 100644 api/myCollection.js

diff --git a/api/creator.js b/api/creator.js
index 4997f3f..c5fdcb2 100644
--- a/api/creator.js
+++ b/api/creator.js
@@ -4,18 +4,17 @@ const serviceTitle = '/img'
 //POST 传参需要用 data
 
 //获取banner列表
-export function getBannerList(data) {
+export function getBannerList() {
 	return request({
 		url: `${serviceTitle}/img/mini/tiktok/listBanner`,
-		method: 'get',
-		params: data
+		method: 'get'
+		
+	})
+}
+//获取小程序用户图片列表
+export function getUserImgList() {
+	return request({
+		url: `${serviceTitle}/img/mini/tiktok/tiktokUserImgs`,
+		method: 'get'
 	})
 }
-//判断用户是否存在
-// export function getUserCheck(data) {
-// 	return request({
-// 		url: `/${url}/dev-api/service/front/user/getUserCheck`,
-// 		method: 'post',
-// 		data: data
-// 	})
-//}
diff --git a/api/myCollection.js b/api/myCollection.js
new file mode 100644
index 0000000..db6de4a
--- /dev/null
+++ b/api/myCollection.js
@@ -0,0 +1,14 @@
+import request from '@/utils/request'
+const serviceTitle = '/img'
+//GET 传参需要用 params
+//POST 传参需要用 data
+
+//获取用户收藏列表
+export function getCollectionList(data) {
+	return request({
+		url: `${serviceTitle}/img/mini/tiktok/listTiktokCollection`,
+		method: 'post',
+		data: data
+		
+	})
+}
diff --git a/pages/creator/creator.vue b/pages/creator/creator.vue
index 0983b6e..ef02ae1 100644
--- a/pages/creator/creator.vue
+++ b/pages/creator/creator.vue
@@ -3,34 +3,46 @@
 		<view>
 			<swiper class="swiper-box" :autoplay="autoplay" :interval="interval" :duration="duration" :indicator-dots="indicatorDots">
 				<swiper-item v-for="(item, index) in banner" :key="index">
-					<cover-image class="img" @click="linkTo(item)" :src="item.bannerImg"></cover-image>
+					<image class="img" @click="linkTo(item)" :src="item.bannerImg"></image>
 				</swiper-item>
 			</swiper>
 		</view>
 		
 		<view>
-			<uni-list v-for="(item, index) in user" :key="index">
-					<uni-list-item v-bind:title="item" clickable  @click="getUser(item)"></uni-list-item>
+			<uni-list v-for="(item, index) in userImgList" :key="index">
+				<!-- 展示用户相关信息 -->
+					<template>
+					    <image class="head" :src="item.img"></image>
+						<view class="userName">{{item.username}}</view>
+					</template>
+				<!-- 	展示用户对应三张图 -->
+					<template>
+					    <view v-for="(pic,param) in item.imgList" :key="param">
+							<image class="threeImg" @click="linkTo(item)" :src="pic.imgUrl"></image>
+						</view>
+					</template>
 			</uni-list>
 		</view>
 	</view>
 </template>
 
 <script>
-	import {getBannerList} from '@/api/creator.js' 
+	import {getBannerList,getUserImgList} from '@/api/creator.js' 
 	export default {
 		data() {
 			return {
 				banner: [],
+				userImgList:[],
 				autoplay: true,
 				interval: 2000,
-				duration: 500,
+				duration: 1000,
 				indicatorDots: true,
-				user:['Kim','Jim','Bob']
+				
 			}
 		},
 		onLoad() {
 			this.getBanner();
+			this.getUserImgList();
 		},
 		methods: {
 			linkTo(item){
@@ -40,13 +52,15 @@
 					showCancel: false
 				});
 			},
-			getUser(item){
+			
+			getUserDetails(item){
+				//TODO 点击跳转对应用户详情页面
 				console.log(item);
 			},
+			
 			async getBanner(){
 				const res = await getBannerList()
 				if(res.data.code === 200){
-					console.log('相應結果2',res);
 					this.banner = res.data.data
 				}else{
 					uni.showModal({
@@ -54,7 +68,21 @@
 						showCancel: false
 					});
 				}
+			},
+			
+			async getUserImgList(){
+				const res = await getUserImgList()
+				if(res.data.code === 200){
+					this.userImgList = res.data.data
+					console.log('userListImg',this.userImgList)
+				}else{
+					uni.showModal({
+						content: '用户图片列表加载失败！', 
+						showCancel: false
+					});
+				}
 			}
+			
 		}
 	}
 </script>
@@ -81,4 +109,27 @@
 		width: 100%;
 		height: 100%;
 	}
+	
+	.head {
+		flex: 1;
+		display: flex;
+		width:80rpx;
+		height:80rpx;
+		justify-content: space-between;
+		align-items: flex-end;
+	}
+	
+	.userName {
+		flex: 1;
+		display: flex;
+		margin-left: 100rpx;
+		justify-content: space-between;
+		align-items: flex-end;
+		
+	}
+	
+	.threeImg {
+		height:300rpx;
+		width:200rpx;
+	}
 </style>
diff --git a/pages/userInfo/myCollection/myCollection.vue b/pages/userInfo/myCollection/myCollection.vue
index f8d6e5a..b6f6fc8 100644
--- a/pages/userInfo/myCollection/myCollection.vue
+++ b/pages/userInfo/myCollection/myCollection.vue
@@ -5,14 +5,32 @@
 </template>
 
 <script>
+	import {getCollectionList} from '@/api/myCollection.js' 
 	export default {
 		data() {
 			return {
 				
 			}
 		},
+		onLoad() {
+			this.getMyCollection(JSON.stringify(1))
+		},
 		methods: {
-			
+			getMyCollection(userId){
+				const data = {
+					"userId" : userId
+				}
+				const res = getCollectionList(JSON.stringify(data))
+				if(res.data.code === 200){
+					//this.banner = res.data.data
+					console.log(res)
+				}else{
+					uni.showModal({
+						content: '我的收藏加载失败！', 
+						showCancel: false
+					});
+				}
+			}
 		}
 	}
 </script>