From 92d3b39953546ede142444e24085fe0bd7a139f4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=82=93=E5=B9=B3=E8=89=BA?= <52643018@qq.com>
Date: Thu, 8 Jul 2021 12:06:13 +0800
Subject: [PATCH] =?UTF-8?q?[=E6=96=B0=E5=A2=9E]=20=E5=95=86=E5=93=81?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E9=A1=B5=E9=9D=A2UI=20[=E4=BC=98=E5=8C=96]?=
 =?UTF-8?q?=20=E9=A1=B5=E9=9D=A2UI=E6=A0=B7=E5=BC=8F=E5=8F=8A=E5=81=9A?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E8=B7=B3=E8=BD=AC=20[=E6=96=B0=E5=A2=9E]=20?=
 =?UTF-8?q?=E6=A0=87=E9=A2=98=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/lf-title-line/lf-title-line.vue |  67 +++++++++++++
 components/lf-waterfall/lf-waterfall.vue   |   1 +
 pages.json                                 |   6 ++
 pages/channel/index.vue                    |  15 ++-
 pages/discover/discover.vue                |  10 +-
 pages/goodsList/index.vue                  | 108 +++++++++++++++++++++
 pages/index/index.vue                      |  96 +++++++++++-------
 pages/user/user.vue                        |  38 +++++---
 static/center/collect-active.png           | Bin 0 -> 1471 bytes
 static/center/collect.png                  | Bin 0 -> 2470 bytes
 static/center/home.png                     | Bin 0 -> 2295 bytes
 static/center/loginout.png                 | Bin 0 -> 2304 bytes
 static/center/order.png                    | Bin 0 -> 1445 bytes
 static/center/problem.png                  | Bin 0 -> 2742 bytes
 static/center/scan.png                     | Bin 0 -> 1025 bytes
 static/center/service.png                  | Bin 0 -> 2321 bytes
 static/center/share.png                    | Bin 0 -> 1394 bytes
 static/center/shop-logo.png                | Bin 0 -> 3014 bytes
 static/center/suggestion.png               | Bin 0 -> 1842 bytes
 uview-ui/components/u-tabs/u-tabs.vue      |   2 +-
 20 files changed, 288 insertions(+), 55 deletions(-)
 create mode 100644 components/lf-title-line/lf-title-line.vue
 create mode 100644 pages/goodsList/index.vue
 create mode 100644 static/center/collect-active.png
 create mode 100644 static/center/collect.png
 create mode 100644 static/center/home.png
 create mode 100644 static/center/loginout.png
 create mode 100644 static/center/order.png
 create mode 100644 static/center/problem.png
 create mode 100644 static/center/scan.png
 create mode 100644 static/center/service.png
 create mode 100644 static/center/share.png
 create mode 100644 static/center/shop-logo.png
 create mode 100644 static/center/suggestion.png

diff --git a/components/lf-title-line/lf-title-line.vue b/components/lf-title-line/lf-title-line.vue
new file mode 100644
index 0000000..d656b77
--- /dev/null
+++ b/components/lf-title-line/lf-title-line.vue
@@ -0,0 +1,67 @@
+<template>
+	<view class="decorative-box" :class="{'padding-tb': isPadding}" @click="onClick">
+		<view class="decorative-liner"></view>
+		<view class="lf-flex decorative-content">
+			<view class="rhombus lf-m-r-23" v-if="isRhombus"></view>
+			<view class="lf-font-32 lf-font-bold title">{{ title }}</view>
+			<view class="rhombus lf-m-l-23" v-if="isRhombus"></view>
+		</view>
+		<view class="decorative-liner"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			title: {
+				type: [String, Number], // 标题
+				default: '猜你喜欢'
+			},
+			isRhombus: {
+				type: Boolean, // 是否显示菱形，默认显示
+				default: true
+			},
+			isPadding: {
+				type: Boolean,
+				default: true
+			}
+		},
+		methods: {
+			onClick(event){
+				this.$emit('click', event);
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped="scoped">
+	.decorative-box {
+		width: 100%;
+		height: max-content;
+		display: flex;
+		justify-content: center;
+		align-content: center;
+		align-items: center;
+		box-sizing: border-box;
+		.decorative-liner{
+			width: 110rpx;
+			height: 1rpx;
+			border: 1rpx solid #DCDCDC;
+		}
+		.decorative-content{
+			padding: 0 30rpx;
+			.rhombus{
+				width: 16rpx;
+				height: 16rpx;
+				transform: rotateZ(45deg);
+				background: #222;
+			}
+			.title{
+				max-width: 340rpx;
+			}
+		}
+	}
+	.padding-tb{
+		padding: 25rpx 0;
+	}
+</style>
diff --git a/components/lf-waterfall/lf-waterfall.vue b/components/lf-waterfall/lf-waterfall.vue
index 93cbdce..dab9463 100644
--- a/components/lf-waterfall/lf-waterfall.vue
+++ b/components/lf-waterfall/lf-waterfall.vue
@@ -56,6 +56,7 @@
 		methods: {
 			onClick(){
 				console.log("aaaa");
+				this.$url('/pages/goodsDetail/index');
 				this.$emit('click');
 			}
 		}
diff --git a/pages.json b/pages.json
index 5525a57..5d885f1 100644
--- a/pages.json
+++ b/pages.json
@@ -115,6 +115,12 @@
 			"style": {
 				"navigationBarTitleText": "添加频道"
 			}
+		},
+		{
+			"path": "pages/goodsList/index",
+			"style": {
+				"navigationBarTitleText": "商品列表"
+			}
 		}
 	],
 	"globalStyle": {
diff --git a/pages/channel/index.vue b/pages/channel/index.vue
index 6b309dc..35452b3 100644
--- a/pages/channel/index.vue
+++ b/pages/channel/index.vue
@@ -17,7 +17,7 @@
 			<u-icon name="lock-fill"></u-icon>
 			<text class="lf-m-l-10">机票酒店</text>
 		</view>
-		<view class="lf-flex-wrap lf-p-l-5">
+		<view class="lf-flex-wrap lf-p-l-5 select-box">
 			<view class="select-item" hover-class="lf-opacity" 
 				v-for="(item, index) in plane_ticket_list" :key="index" 
 				v-if="!item.checked" @click="activaItem(item, index, 'plane_ticket_list')">{{ item.name }}
@@ -28,7 +28,7 @@
 			<u-icon name="lock-fill"></u-icon>
 			<text class="lf-m-l-10">旅游度假</text>
 		</view>
-		<view class="lf-flex-wrap lf-p-l-5">
+		<view class="lf-flex-wrap lf-p-l-5 select-box">
 			<view class="select-item" hover-class="lf-opacity" 
 				v-for="(item, index) in travel_list" :key="index" 
 				v-if="!item.checked" @click="activaItem(item, index, 'travel_list')">{{ item.name }}
@@ -39,7 +39,7 @@
 			<u-icon name="lock-fill"></u-icon>
 			<text class="lf-m-l-10">接送服务</text>
 		</view>
-		<view class="lf-flex-wrap lf-p-l-5">
+		<view class="lf-flex-wrap lf-p-l-5 select-box">
 			<view class="select-item" hover-class="lf-opacity" 
 				v-for="(item, index) in jieson_list" :key="index" 
 				v-if="!item.checked" @click="activaItem(item, index, 'jieson_list')">{{ item.name }}
@@ -50,7 +50,7 @@
 			<u-icon name="lock-fill"></u-icon>
 			<text class="lf-m-l-10">其他精选</text>
 		</view>
-		<view class="lf-flex-wrap lf-p-l-5">
+		<view class="lf-flex-wrap lf-p-l-5 select-box">
 			<view class="select-item" hover-class="lf-opacity" 
 				v-for="(item, index) in other_list" :key="index" 
 				v-if="!item.checked" @click="activaItem(item, index, 'other_list')">{{ item.name }}
@@ -216,4 +216,11 @@
 	.lf-p-l-5{
 		padding-left: 5rpx;
 	}
+	// .select-box{
+	// 	overflow: hidden;
+	// 	padding-top: 1rpx;
+	// 	width: 100%;
+	// 	height: max-content;
+	// 	border-radius: 5rpx;
+	// }
 </style>
diff --git a/pages/discover/discover.vue b/pages/discover/discover.vue
index 814b867..9ee495e 100644
--- a/pages/discover/discover.vue
+++ b/pages/discover/discover.vue
@@ -2,11 +2,11 @@
 	<view class="page-color">
 		<view class="padding-lr lf-p-t-30 lf-p-b-30">
 			<view class="bg-red card-discover lf-m-b-30">
-				<view>
+				<view @click="$url('/pages/notice/article')">
 					<image src="../../static/images/empty.png" mode="aspectFill" style="width: 686rpx;height: 300rpx;"></image>
 				</view>
 				<view class="flex-direction bg-white discover-radius">
-					<view class="flex align-center text-center lf-p-30 solid-bottom" v-for="i of 3">
+					<view class="flex align-center text-center lf-p-30 solid-bottom" v-for="i of 3" @click="$url('/pages/notice/article')">
 						<view>
 							<image src="../../static/logo.png" mode="aspectFill" style="width: 100rpx;height: 100rpx;"></image>
 						</view>
@@ -18,11 +18,11 @@
 			</view>
 			
 			<view class="bg-red card-discover lf-m-b-30">
-				<view>
+				<view @click="$url('/pages/notice/article')">
 					<image src="../../static/images/empty.png" mode="aspectFill" style="width: 686rpx;height: 300rpx;"></image>
 				</view>
 				<view class="flex-direction bg-white discover-radius">
-					<view class="flex align-center text-center lf-p-30 solid-bottom" v-for="i of 3">
+					<view class="flex align-center text-center lf-p-30 solid-bottom" v-for="i of 3" @click="$url('/pages/notice/article')">
 						<view>
 							<image src="../../static/logo.png" mode="aspectFill" style="width: 100rpx;height: 100rpx;"></image>
 						</view>
@@ -33,6 +33,8 @@
 				</view>
 			</view>
 		</view>
+		<!-- 回到顶部 -->
+		<u-back-top :scroll-top="pageScrollTop" :custom-style="{background: 'rgba(51, 51 51, 0.3)'}"></u-back-top>
 	</view>
 </template>
 
diff --git a/pages/goodsList/index.vue b/pages/goodsList/index.vue
new file mode 100644
index 0000000..abf8b86
--- /dev/null
+++ b/pages/goodsList/index.vue
@@ -0,0 +1,108 @@
+<template>
+	<view>
+		<!-- 活动列表 -->
+		<view class="content">
+			<view class="item" v-for="item in list" :key="item">
+				<view class="cover">
+					<image src="../../static/logo.png" class="lf-w-100 lf-h-100" mode="aspectFill"></image>
+				</view>
+				<view style="width: 420rpx;">
+					<view class="lf-font-28 lf-color-333 lf-m-b-20 lf-line-2" style="height: 78rpx;">南胜地 身处亚热带风情/玩转南澳转南澳转南澳转南澳转转南澳转南澳</view>
+					<view class="lf-font-24 lf-color-gray">本套票只包含两个成人不可带小孩</view>
+					<view class="lf-flex lf-m-t-25">
+						<lf-price price="3599.00"></lf-price>
+						<text class="lf-font-24 lf-color-gray lf-line-through lf-m-l-15">¥4599.00</text>
+					</view>
+				</view>
+			</view>
+		</view>
+		<!-- 加载 -->
+		<view class="loading-more">
+			<text v-if="list.length" :class="{'loading-more-text': loadingClass}">{{ loadingText }}</text>
+			<lf-nocontent v-else></lf-nocontent>
+		</view>
+		<!-- 回到顶部 -->
+		<u-back-top :scroll-top="pageScrollTop" :custom-style="{background: 'rgba(51, 51 51, 0.3)'}"></u-back-top>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return {
+				list: [1,2,3,4,5],
+				loadingClass: false,
+				loadingText: '已加载全部数据~',
+				page: 1,
+				isPage: true,
+				pageSize: 20
+			}
+		},
+		onLoad(){
+			// this.getActivityList();
+		},
+		methods: {
+			getActivityList(){
+				return;
+				this.$http(this.API.a).then(res => {
+					this.isPage = res.data.has_more_page;
+					let list = res.data.items;
+					if(!res.data.has_more_page){
+						this.loadingClass = false;
+						this.loadingText = '已加载全部数据~';
+					}
+					if(this.page == 1){
+						this.list = list;
+					}else{
+						this.list.push(...list);
+					}
+				})
+			},
+			// 进入商品详情页
+			enterDetail(index){
+				let goods_id = this.list[index].goods_id;
+				this.$url('/pages/goodsDetail/index?id='+ goods_id);
+			}
+		},
+		onReachBottom(){
+			if(this.isPage){
+				this.page = this.page + 1;
+				this.getActivityList();
+			}
+		},
+		onPullDownRefresh(){
+			this.page = 1;
+			this.isPage = true;
+			this.loadingClass = true;
+			this.loadingText = '正在加载中';
+			this.getActivityList();
+			uni.stopPullDownRefresh();
+		}
+	}
+</script>
+
+<style lang="scss" scoped="scoped">
+	.content{
+		padding: 0 32rpx;
+		box-sizing: border-box;
+		width: 750rpx;
+		height: max-content;
+		.item{
+			width: 100%;
+			height: auto;
+			border-bottom: 1rpx solid #E5E5E5;
+			padding: 30rpx 0;
+			display: flex;
+			&:last-child{
+				border-bottom: none;
+			}
+			.cover{
+				width: 250rpx;
+				height: 210rpx;
+				border-radius: 20rpx;
+				overflow: hidden;
+				margin-right: 15rpx;
+			}
+		}
+	}
+</style>
diff --git a/pages/index/index.vue b/pages/index/index.vue
index dda143f..0b3e9d8 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,10 +1,10 @@
 <template>
 	<view>
 		<swiper class="head" :current="banner_current" >
-			<swiper-item>
+			<swiper-item @click="clickBanner">
 				<image src="https://picsum.photos/375/360" class="swipe-img"></image>
 			</swiper-item>
-			<swiper-item>
+			<swiper-item @click="clickBanner">
 				<image src="https://picsum.photos/375/360" class="swipe-img"></image>
 			</swiper-item>
 		</swiper>
@@ -15,7 +15,7 @@
 					<u-icon name="lock-fill lf-text-vertical"></u-icon>
 					<view class="lf-m-l-12 lf-line-1" style="max-width: 510rpx;">国庆优惠大促，快来看看吧！</view>
 				</view>
-				<view class="message-btn" hover-class="lf-opacity">详情</view>
+				<view class="message-btn" hover-class="lf-opacity" @click="$url('/pages/notice/article')">详情</view>
 			</view>
 			<!-- 频道 -->
 			<view class="lf-row-between lf-m-b-10">
@@ -26,30 +26,31 @@
 				</view>
 			</view>
 			<view class="lf-flex-wrap">
-				<view class="channel-item" v-for="(item, index) in 8">
+				<view class="channel-item" v-for="(item, index) in 7" @click="$url('/pages/goodsList/index')">
 					<image src="../../static/logo.png" class="channel-mask" mode="aspectFill"></image>
-					<view>
+					<view class="lf-row-center channe-text">冲浪</view>
+					<!-- <view>
 						<u-icon name="lock-fill lf-text-vertical"></u-icon>
-					</view>
+					</view> -->
 				</view>
 			</view>
 			<!-- 中间广告模块 -->
 			<swiper class="lf-m-t-40 ad" :current="banner_current" >
-				<swiper-item>
+				<swiper-item @click="clickAD">
 					<image src="https://picsum.photos/375/230" class="lf-w-100 lf-h-100"></image>
 				</swiper-item>
 			</swiper>
-			<!-- 精品推荐 -->
+			<!-- 人气爆款 -->
 			<view class="lf-row-between lf-m-t-40">
-				<view class="lf-font-36 lf-font-bold lf-color-333">精品推荐</view>
-				<view class="lf-flex lf-color-555">
+				<view class="lf-font-36 lf-font-bold lf-color-333">人气爆款</view>
+				<view class="lf-flex lf-color-555" @click="$url('/pages/activityList/index')">
 					<view class="lf-m-r-10">更多</view>
 					<u-icon name="lock-fill lf-text-vertical"></u-icon>
 				</view>
 			</view>
-			<view class="recomm lf-m-t-20">
+			<view class="recomm lf-m-t-20 lf-m-b-30">
 				<view class="lf-row-between">
-					<view class="max-recomm-img">
+					<view class="max-recomm-img" @click="$url('/pages/activityList/index')">
 						<image src="../../static/logo.png" class="lf-w-100 lf-h-100"></image>
 						<view class="recomm-title">
 							<view class="lf-line-2">土耳其双人游飞机往返酒店五星级各大热门景点豪华双人游纯江湖救急</view>
@@ -57,22 +58,22 @@
 						</view>
 					</view>
 					<view>
-						<view class="recomm-img">
+						<view class="recomm-img" @click="$url('/pages/activityList/index')">
 							<image src="../../static/logo.png" class="lf-w-100 lf-h-100"></image>
 						</view>
-						<view class="recomm-img lf-m-t-10">
+						<view class="recomm-img lf-m-t-10" @click="$url('/pages/activityList/index')">
 							<image src="../../static/logo.png" class="lf-w-100 lf-h-100"></image>
 						</view>
 					</view>
 				</view>
 				<view class="lf-row-between lf-m-t-10">
-					<view class="recomm-img">
+					<view class="recomm-img" @click="$url('/pages/activityList/index')">
 						<image src="../../static/logo.png" class="lf-w-100 lf-h-100"></image>
 					</view>
-					<view class="recomm-img">
+					<view class="recomm-img" @click="$url('/pages/activityList/index')">
 						<image src="../../static/logo.png" class="lf-w-100 lf-h-100"></image>
 					</view>
-					<view class="recomm-img">
+					<view class="recomm-img" @click="$url('/pages/activityList/index')">
 						<image src="../../static/logo.png" class="lf-w-100 lf-h-100"></image>
 					</view>
 				</view>
@@ -82,14 +83,16 @@
 				<u-tabs :list="tab_list" :is-scroll="true" :current="current" @change="tabChange"></u-tabs>
 			</view> -->
 			<!-- 推荐 -->
-			<view class="lf-row-between lf-m-t-40 lf-m-b-10">
+			<!-- <view class="lf-row-between lf-m-t-40 lf-m-b-10">
 				<view class="lf-font-36 lf-font-bold lf-color-333">推荐</view>
 				<view class="lf-flex lf-color-555">
 					<view class="lf-m-r-10">更多</view>
 					<u-icon name="lock-fill lf-text-vertical"></u-icon>
 				</view>
-			</view>
+			</view> -->
 		</view>
+		<!-- 猜你喜欢 -->
+		<lf-title-line></lf-title-line>
 		<!-- 商品列表-瀑布流 -->
 		<view style="padding: 0 20rpx;">
 			<lf-waterfall :list="recomm_list"></lf-waterfall>
@@ -102,11 +105,13 @@
 </template>
 
 <script>
-	import lfWaterfall from '../../components/lf-waterfall/lf-waterfall.vue';
+	import lfWaterfall from '@/components/lf-waterfall/lf-waterfall.vue';
+	import lfTitleLine from '@/components/lf-title-line/lf-title-line.vue';
 	
 	export default {
 		components: {
-			lfWaterfall
+			lfWaterfall,
+			lfTitleLine
 		},
 		data() {
 			return {
@@ -176,6 +181,7 @@
 			this.addRandomData();
 		},
 		methods: {
+			// 瀑布流随机模拟数据
 			addRandomData() {
 				for(let i = 0; i < 10; i++) {
 					let index = this.$u.random(0, this.list.length - 1);
@@ -185,12 +191,22 @@
 					this.recomm_list.push(item);
 				}
 			},
+			// tabs标签切换时件，现已费弃
 			tabChange(current){
 				this.current = current;
 			},
+			// swiper页面被滑动切换
 			pageChange(event){
 				console.log(event)
 				this.current = event.detail.current;
+			},
+			// banner图被点击
+			clickBanner(){
+				this.$msg('您点击了banner图')
+			},
+			// ad被点击
+			clickAD(){
+				this.$msg('您点击了ad广告')
 			}
 		},
 		onReachBottom() {
@@ -263,20 +279,20 @@
 			position: absolute;
 			z-index: 0;
 		}
-		view{
-			position: absolute;
-			right: 0;
-			bottom: 0;
-			background-color: rgba(255,255,255,0.5);
-			width: 42rpx;
-			height: 42rpx;
-			color: #FFFFFF;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			border-radius: 10rpx 0rpx 15rpx 0rpx;
-			z-index: 2;
-		}
+		// view{
+		// 	position: absolute;
+		// 	right: 0;
+		// 	bottom: 0;
+		// 	background-color: rgba(255,255,255,0.5);
+		// 	width: 42rpx;
+		// 	height: 42rpx;
+		// 	color: #FFFFFF;
+		// 	display: flex;
+		// 	justify-content: center;
+		// 	align-items: center;
+		// 	border-radius: 10rpx 0rpx 15rpx 0rpx;
+		// 	z-index: 2;
+		// }
 		.channel-mask::after{
 			width: 100%;
 			height: 100%;
@@ -287,6 +303,16 @@
 			top: 0;
 			left: 0;
 		}
+		.channe-text{
+			position: absolute;
+			top: 0;
+			left: 0;
+			width: 100%;
+			height: 100%;
+			z-index: 2;
+			color: #FFFFFF;
+			font-size: 28rpx;
+		}
 	}
 	
 	.ad{
diff --git a/pages/user/user.vue b/pages/user/user.vue
index c322169..df646af 100644
--- a/pages/user/user.vue
+++ b/pages/user/user.vue
@@ -2,14 +2,14 @@
 	<view>
 		<view class="flex-direction bg-blue justify-between align-center text-center lf-p-t-30 lf-p-b-30" style="height: 340rpx;">
 			<view>
-				<image src="../../static/logo.png" mode="aspectFill" style="width: 200rpx;height: 200rpx;border-radius: 50%;"></image>
+				<image src="../../static/logo.png" mode="aspectFill" style="width: 200rpx;height: 200rpx;border-radius: 50%;" @click="lookImg('')"></image>
 			</view>
 			<view class="lf-font-36 align-center text-center text-white lf-m-t-30">
 				小小的小可爱
 			</view>
 		</view>
 		<view class="list">
-			<view class="lf-row-between list-item" hover-class="lf-opacity" @click="$url('/pages/collect/index')">
+			<view class="lf-row-between list-item" hover-class="lf-opacity" @click="$url('/pages/order/order')">
 				<view class="lf-row-center">
 					<image class="icon-img" src="../../static/logo.png"></image>
 					<text class="lf-text-vertical lf-m-l-20 lf-font-28 lf-color-black">我的订单</text>
@@ -18,7 +18,7 @@
 					<u-icon name="arrow-right" color="#777" size="28"></u-icon>
 				</view>
 			</view>
-			<view class="lf-row-between list-item" hover-class="lf-opacity" @click="$url('/pages/contactService/index')">
+			<view class="lf-row-between list-item" hover-class="lf-opacity" @click="$url('/pages/message/index')">
 				<view class="lf-row-center">
 					<image class="icon-img" src="../../static/logo.png"></image>
 					<text class="lf-text-vertical lf-m-l-16 lf-font-28 lf-color-black">消息中心</text>
@@ -37,7 +37,7 @@
 				</view>
 				<button class="feedback-btn" open-type="feedback"></button>
 			</view>
-			<view class="lf-row-between list-item" hover-class="lf-opacity">
+			<view class="lf-row-between list-item" hover-class="lf-opacity" @click="$url('/pages/collect/index')">
 				<view class="lf-row-center">
 					<image class="icon-img" src="../../static/logo.png"></image>
 					<text class="lf-text-vertical lf-m-l-16 lf-font-28 lf-color-black">我的收藏</text>
@@ -45,9 +45,8 @@
 				<view>
 					<u-icon name="arrow-right" color="#777" size="28"></u-icon>
 				</view>
-				<button class="feedback-btn" open-type="feedback"></button>
 			</view>
-			<view class="lf-row-between list-item" hover-class="lf-opacity">
+			<view class="lf-row-between list-item" hover-class="lf-opacity" @click="$url('/pages/about/index')">
 				<view class="lf-row-center">
 					<image class="icon-img" src="../../static/logo.png"></image>
 					<text class="lf-text-vertical lf-m-l-16 lf-font-28 lf-color-black">关于我们</text>
@@ -55,7 +54,6 @@
 				<view>
 					<u-icon name="arrow-right" color="#777" size="28"></u-icon>
 				</view>
-				<button class="feedback-btn" open-type="feedback"></button>
 			</view>
 			<view class="lf-row-between list-item" hover-class="lf-opacity">
 				<view class="lf-row-center">
@@ -65,25 +63,33 @@
 				<view>
 					<u-icon name="arrow-right" color="#777" size="28"></u-icon>
 				</view>
-				<button class="feedback-btn" open-type="feedback"></button>
+				<button class="feedback-btn" open-type="contact"></button>
 			</view>
 		</view>
-		<view style="background-color: #F6F6F6;">
-			<view class="lf-p-t-40 lf-p-b-20 text-center details-title">
+		<view class="lf-p-t-35" style="background-color: #F6F6F6;">
+			<!-- <view class="lf-p-t-40 lf-p-b-20 text-center details-title">
 				
 				<view class="lf-font-32 details-text flex justify-between align-center text-center" style="color: #222;position: relative;left: 270rpx;">
 					<view class="rhombus lf-m-l-30"></view>
 					<view>为你推荐</view>
 					<view class="rhombus lf-m-r-30"></view>
 				</view>
-			</view>
+			</view> -->
+			<lf-title-line title="为你推荐"></lf-title-line>
 			<lf-waterfall :list="list"></lf-waterfall>
 		</view>
+		<!-- 回到顶部 -->
+		<u-back-top :scroll-top="pageScrollTop" :custom-style="{background: 'rgba(51, 51 51, 0.3)'}"></u-back-top>
 	</view>
 </template>
 
 <script>
+	import lfTitleLine from '@/components/lf-title-line/lf-title-line.vue';
+	
 	export default {
+		components: {
+			lfTitleLine
+		},
 		data() {
 			return {
 				list: [
@@ -155,6 +161,16 @@
 				     },
 				    ]
 			}
+		},
+		methods: {
+			// 预览图片
+			lookImg(img){
+				this.$u.throttle(() => {
+					uni.previewImage({
+						urls: [img]
+					})
+				}, 200);
+			},
 		}
 	}
 </script>
diff --git a/static/center/collect-active.png b/static/center/collect-active.png
new file mode 100644
index 0000000000000000000000000000000000000000..a04dac0c3bbd6b91620d781da02c8c99e6c6c495
GIT binary patch
literal 1471
zcmV;w1wi_VP)<h;3K|Lk000e1NJLTq002t>002t}1^@s6I8J)%00001b5ch_0Itp)
z=>Px#L}ge>W=%~1DgXcg2mk?xX#fNO00031000^Q000001E2u_0{{R30RRC20H6W@
z1ONa40RR91OP~V)1ONa40RR91O8@`>0E7!?y8r+MDM>^@RCodHo6m0(M-<23+QyD!
z2NVd34M;5@Dpe{}+$t4S5mJRB+EYvafmU34;fBNkae`wjP<yMmazR3(YAscY5N!{r
zTxda6Kq+cNfVLzJ#7S^sXLxTnQ$@+_{8-P%9&1M0toO~^_ulv8o!#-+0r1Te@B};o
zPrwuK1Uvyxz!T^&fj}oeV=SxV*DF3j5VS;EG9sh5i3xaEVlG0fhb6=!HhNfME<&q^
zCBz~&dRSsELTgTFwQ1bC^#Cj_y#~!@6&R~x=q3cgf3RiC1E^H)z{7`giPG)eI{;6g
zz75OE2Qcm+#>ipZCy>iMfqec?c=6&vqPXpzMDr}8typ}QWinqdfC=1~WNTvIw=AFk
zgpG{!DRYny`O-NET@sgaPJ}g3Er#{C#Y;O`fB#`DvZfFb2k#k*JIhX-$ZyC;HtGX-
zmN0gWQEi&g(uEa?xr9Pm3B{}hc$<~WZ~ZTfUIW~=5VwWEFA3j_br92oRjKSmA!8QA
ztOd5nvf0nV4Peo7>@h|)uLHF9I2~9KsQZ@1aA+$Smo|QEb3ZNvW*-&}J^NRbO(3dR
zV{t>$J}esl>AdSIk@osYgJ3w?g%v&ZY~0N42~YOMwM0+JI9SPM@CyqUFkrHC<0|Ql
zJp+*zt?cH4`}^O)$j7vzyWw;UB2CI_&0#efA1kA}=Afy`d|5dN?jwtRuJKUR`v*=?
z-rzoVmX+y4aqod5M*ASr#(4?%X2Wo4>2+b0UNCBCGlSJ^R(gSpP=kgxGg#4jlrWd`
zMh$IdumF~whY~M9sm%;l5X{Esa=eFDZxzi9RxbCCBA&b5x!k|1;>}<ci+5B3o$c4q
zmSj@;Hv-w=EEI9!(>N&|=3RCsrBSpSJZKN?wKSOxL!y(-Uh5%9krYi$=CG>O?=VB7
zhk!L8(xjAR4r_AqIb<?dl#yL=AT6XxqnX2^pnZK8HDbHrVxT1%toeDGLe$)#A+53o
zkrt^F?@R`Z&MuWs<6q&=33>1?-?vsZXqTBBR=s`??_HO*Gj*FI)lM30H__Kcp>6l>
z9r$(Fl!IT1O);un@HH6O+Ts@%G_)5A$DM;kHOGLG!Ad?1IsTU~Yd9Rg;)h+or&_7z
zw3_T)2>V7y3wU+ibl?iR$*5MzRVBN!wD_umhy6oCRfIL!#lR*R)u;d^gJr(zAj3N_
z@FqTCZlFuItx8NoxjX`MbHB^V=Y2L;9eB)*dn%?_`~W-Z8#_B@sfRUbf|6C){tbS8
z^o50A@Z->NG<U-i^lVrQ)nuXBhebs#F8++O;}LxIm<~JC9)~qhEtXn3u&B6t{Vr_V
zb_8FITdLJ0%y^iaYOvVSgGEKo&i)0%!|&m%TNZ0pg}N2yq}-ioI*(ha5B+{Ulew7s
zw1RTz{GMJheTZXhcj^$Ah1&~-5AnY(zQM!o++=A#ga1|WDKr|_ZN%H0se`Ig5;Hh>
z7~OtSxf=BU7{;^&N|ra>dzL8k%*+&=Jb4s9PkxTw(;^p5+jJP?+_|GbF}tNn??;O9
zFFkkHt|7daeU0}r)&JqF{h@9%JcrJ0C%5F>IPRN!&x)&}Tt0})yXUccG|pw!{yol}
z&fv7<H-%qY-EsG<?tsOml}d+j`Q#L=tbBx~(yDnLhuc-0iGPVef90-e?%jaJ3GClr
zhDVRy4-fb3`2i*-HubZnTd+8^4(;P$ZT{1+LjY`~^{@;mdRPXqysIbR33vjYfG6My
ZyaHL7UfhWlpeO(U002ovPDHLkV1mtaq=Wzf

literal 0
HcmV?d00001

diff --git a/static/center/collect.png b/static/center/collect.png
new file mode 100644
index 0000000000000000000000000000000000000000..e4871849bbe7cf32c586504141b065fdbff2e806
GIT binary patch
literal 2470
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
XDQ_@BY_;*%k7WM4rEwj~<L>_e(~g68

literal 0
HcmV?d00001

diff --git a/static/center/home.png b/static/center/home.png
new file mode 100644
index 0000000000000000000000000000000000000000..96dfb2a8a2140046b3a64d5f22fcfcbc7b294ded
GIT binary patch
literal 2295
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
JYR=)4{tZXlHva$s

literal 0
HcmV?d00001

diff --git a/static/center/loginout.png b/static/center/loginout.png
new file mode 100644
index 0000000000000000000000000000000000000000..f5b7aa59927a1fdfce2cf1cebcd4c06db245b1a5
GIT binary patch
literal 2304
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
Wjj^beD4);y??YeLSf@(cCF<Xqe>D#P

literal 0
HcmV?d00001

diff --git a/static/center/order.png b/static/center/order.png
new file mode 100644
index 0000000000000000000000000000000000000000..b8c8429ba273a608ff3be8441f8e440ef73bf376
GIT binary patch
literal 1445
zcmV;W1zP%vP)<h;3K|Lk000e1NJLTq002t>002t}1^@s6I8J)%00001b5ch_0Itp)
z=>Px#L}ge>W=%~1DgXcg2mk?xX#fNO00031000^Q000001E2u_0{{R30RRC20H6W@
z1ONa40RR91OP~V)1ONa40RR91O8@`>0E7!?y8r+M4@pEpRCodHoL@*3K^(`uKc0z-
z5f?@rB!ooRL#5}TCH4@KP(}|z2&K?NK2;DDL2uPtApN0UA_#(l@F9}yML5F~&wruS
zL-b$|>4PX*iKU)i-w`+Vw%xp$-TB>~&B8D{zx~bpe*4+k+4=3<UQUkM6ahs*5l{pa
zf&ZO=hZ;adMMco#@mz!5vSc#ZQ&d!RCmM|=c>JiUsyem0y4sBT^M1d-Jsyvb@zfX9
zC56?{(2zGZHT4e8?$sOyxW_|7L+7;eMtNmr<yk;_qUoXjPwXE+8=o|ptlTTBVY7At
zst)o$pw@L-s;jH>&Gao~ZF)Jt<s-G|WwQ23VR^mYoyHTviTaRAjB=|obpL7tx@Iz~
zCWPgru!OyINkzYtel#^T1;)q6%h6`BMZ0^<<SQ#H5sXEpX2*;&^sGD+SqbVNG0IsP
zy?GJi+DAMDzMCEAkvTHJ*VNSPT3T9qfD<_i;{hHAh;);%GX`)M1_uY<irVyvR@Ca@
ziXKAGhym0-$ZWT#wd-)sI>iq7*cu9j<|Zd6<09?b>RI*m^#wCCGovuPTf}&V>MUVy
z78aSC*&5(yXJ?zU3>3RQfkYy4MdU)+f`x8fDPlC!bui$EMSQUJGz6?N6QiSW=8}m#
z2l|I0zhOM)^Z8C7e3>`O&B|!w5#%YiJ!Bmiyzg7+w?dvWX|?d%ta^&f7A!#V!f;B1
zkj)|Vh^7eF3y2FpVD~c8R^9R5fq{WeUHPB8;c)mFz+TrY0ro>Y<)V6-w$G*%MjvrZ
zXsot%8)^=vn-32UPXp$0=#L=(fxI&i2%Jv0KGO>ZgEx`gMVdzXf*y4qpt`XyeY4fG
zM7%?<i=keHNL^N^tE+1f*~Rt5L}VLj&muc3Nrn_G4zLQAg2h3ALsj)G4p^j5!`j-~
z?aRx{1swjRrHXk}qQAd?0@IPyNncvE(^n#ag^6T2PU!i<!UB6UA!Wnla~i1)Q<DxU
z2GA(UZOA|&NdvVGCy4xMBoYZ_Ei5cXY$E`*#s_w`AQY;~T3CI3eY0?$g(f5$V11Tl
zNcwHa23@2!q+ha5Lf7tX#GmhVWk+{O26#5;Vl0W{rCT)uU&o(@Ad*0j8kGr(Q73`L
z4B<8IS7a~PeztDXZ^LW_W9GMlWk$t9reIlsF%y%GS<JW-;SOFQ&%|Oe_Lh}=BZ1{)
zxP#a-iLmAspq+7INuGx|$!+LxxZ^>4jaUW0#dD%g=t_qrE8GFFIwt_|v>_dqtZ)Yr
zfwZv33ZQgYlER${L;~!0siYgp0PkeD1NhUqxw$==cp{R(VwYcqJES*3=8Z`ovoe2*
z&Uv6<aj+yCvzSjj;ST0eBr7%?tZ3e6iH18AD>gi^NNz(L;g0kb8&|=y8}0zK)D;_7
z!Ez$pk-1{yDp(GLJ5pC{cwmt{4F$s;k`)`*!D0@naEIrzYyw@9slz7Vv~~&#7RQxT
zuoNr~0vxJ#rw-qYwlL$~kC-lMlxM08e@czEG4~Vts?{#65jfIlaHbdzlCQiNeAuYS
z{N~<ljah*51{S6M=#~47(yQ<~J+)LVTd?qZDE9g6z0@XMUm7VaENmC?(iSXc5Py$y
z6=MJc=K3B6KfCeC?@8XjbJ4&GeRro-*5~+^Fal?eL3R+y>aPm)RY>+RRIsne*iR>W
z5u?6@kFLL{Bw&;gML-cy1QY>9KoL*`TtwhE_G{F1?!s5q00000NkvXXu0mjf6+MS2

literal 0
HcmV?d00001

diff --git a/static/center/problem.png b/static/center/problem.png
new file mode 100644
index 0000000000000000000000000000000000000000..5cc002548b90823af71e4a7d04e757169d565ede
GIT binary patch
literal 2742
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

literal 0
HcmV?d00001

diff --git a/static/center/scan.png b/static/center/scan.png
new file mode 100644
index 0000000000000000000000000000000000000000..f7b20f3c7502bffe50d561bc37e097c83c53d4a7
GIT binary patch
literal 1025
zcmeAS@N?(olHy`uVBq!ia0vp^-XP4u1|%)~s$Kyp#^NA%Cx&(BWL^R}E~ycoX}-P;
zT0k}j17mw80}DtA5K93u0|WB{Mh0de%?J`(zyz1|UciiCgA}%Kr|$+T&-Qe245?sz
zJKJ`>kfTT&Bd5rv3(2{QT00d@BwC;RWATpC7S4a|zv1eUQ`0WZFA#pzYtj-Xoc%I$
zLxaL=%acX#(`2Sqrl;FG#m(AnT>Y%Zrn>Cexi>y*kI8dRU_hWLJ`3I@*>^2s*DIQ?
z6ukcW|656!H?$(t)g2<r^sYr6+LW|0Txi<d?ycK0*Oso3=|A3YHv6pj%Rlj56{i<=
zcDY=t{Fk#e>ix6NKh2MutxP)n@Wa)-?Y~v(Yy=&bGkQNMdvrW^`Q=LE*=OsPOL^S+
za&C>pm8ma^SeK@~7P@lzZQ1WqqnS27KOUB@v<jL2D&%g%q-k4rUXo}qGtG}k@-aU3
z{d(-$u>M+U`P)aWb{#kRCEj~bdYVOB$`r}tyRN_fYovX#XiakOHt!S8hAE9xH@vJ_
zS$nO&Z1>+PtGWLQ^GclpN>}Jz)l|C3xiR7DJ=r~Ho1Yd*hRi?P7Aejza{f$J^v?V5
z-{*c^SL&KRZFT(ADatwzHVTL(GO{oPra`GN#|>xdna&zLa7$dYtUt~2s^I%Gm##K1
zN!vVUPx#dA%kG<N&iUs@>^h@#s{iw*(ipq+^;dpJ)|N$Gn{adI*XCBei7(E?t8Y<!
zR^>XO<YT1KxnBpBgx4rFX&*kO8F6oYqNL-L+{qgnfZ^T3D!|~<tbgs~^=S|5_SY*a
zXGnigHV=HcX8YN+&%1Sm&TW?Bw36auYu?^|_+fI`@=qD}GfdWrcOOj`zuVf=#`J1$
zw{hx;mJhwMHXoie9hwyKpW%jHh)GMn<8Phbe?nG2f@{MHB3hSu`yKN;$n{I=*^}zj
zD?(x)G&s69FfcV_EIV_lb<4$!FERg_%)CX<KHB^}V}<p*66KjL>wYi3wrjTPmArj>
zGIsrvsWG{-w$o6fcdhjF&t1kH_tw}|?{C|*YC*Nd`?|EB@7!ATeB{r5vJBsw*qQWM
z)a>;0oau%4zg*N={%Z<r*s4d~dpsi!1gq*CV&Y&}bOuH-gkA7Y<okVQb<qV*hZ6m$
zlC;pL3ohF-KG5P`Bb#tsWbF}0^+K*LVDz6klkdyquv3VA?gfcGi7yYj8J02I&0Qr^
za_R6)b1CKz4gY8JMBhI3=FYCq=e24Wr!rjvGORc2HE_x>B{H4>`&LAiQAh!d7&!hg
X+w$n_PtvwY24z1_S3j3^P6<r_Lp#Fd

literal 0
HcmV?d00001

diff --git a/static/center/service.png b/static/center/service.png
new file mode 100644
index 0000000000000000000000000000000000000000..37eafff7f2c35f721fc6df73b646d78037744794
GIT binary patch
literal 2321
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

literal 0
HcmV?d00001

diff --git a/static/center/share.png b/static/center/share.png
new file mode 100644
index 0000000000000000000000000000000000000000..84a1bc9dc2cac1908722832601a7f4413f4637fd
GIT binary patch
literal 1394
zcmeAS@N?(olHy`uVBq!ia0vp^-XP4u1|%)~s$Kyp#^NA%Cx&(BWL^R}E~ycoX}-P;
zT0k}j17mw80}DtA5K93u0|WB{Mh0de%?J`(zyz1|UciiCgA}%Kr|)K9V7cSz;uuoF
z_;!|WhOnc^@!9=i_8U|~n|&|bQhMc?JKN+7^DSrX4%UwWSGtun;z9%tcFQ$AI@;YK
z?kEr<q8c}4+P4)6oWAx)nigp|d1ni5be%Y>Wy{C^w{mXglnJMoZ=M~So-kvkxpDrz
zKflt9HecRkBxk|s*C70W1(o_&&cvt9$kFOF)!W<K{bbtm%Rf^pDt=6#_$``EtT8Gk
zre?C=^4G=<YT8;_yB1x1k-oUWvRBIEwZ)S_rGO>t%x3!R%gM~VxiIwm{%_lPbXqxo
z_Ohf&Mr?6sys?DG<ZweIn^^8MAn#gF<N=+{2e}(E`WG#2-xNQg^O7XPTb*mm@+~7+
zj_D*!Ye^L|IDN>7dB)O2N!~M`HuSKhaYwi@YG+2AJ$qJKmakpD+{u2ORY}N=rXtf%
za!cf<*q&JLzKgF=_YvD9#b<NmFWT`{UVri8g+Nf~!L_TVpPL&M9lh7Wn$_T=+lqU=
zoo`)saZk`%>b&smCJ&FLU%gVd#53<bAGqIhrLW>n%?$;9pOy!$%!}#UotRLqH1UR-
z*%Z;19r^ogzJxtrtsjyuu_nP_hv>0O+gBuiSk&g!Cc0Q|p6PPe{ELZ<LF@{#P2#c*
z3zxl}IMep^1hEKLV><zk3qrg30vxxpB{kJwsF%`=owr<YztX>k9KKDJULQ>#nWu1{
z$akyhso`B@@}emHifmYLa4@f0k#L**#HckPZofrt?RT!_`N_FNeqvq6(Il3vRQK>#
zJUau+U1Jj&uQ=ZL$FWiC{GAnAyd3$A83OYRJ5;TV%*?h0Ea=bK8n_^%;BErr71tNL
z8)p<BTi9syP*~wE`;ztsV^xl;%iNljq)QuHeg8=9dE9kr31bF}T#4xERsJh^SKrA9
zNSU7&@nJ>qh2rqMO$}do<4XAAL?*5d*EVJrxw(o{%%PRxiD|<V8ApZsz__?Np?F=>
zxw%Um&N8`{J-Hpfq%3V}b#-+tLy<e<mACWe%{yGi<T^S0ZRCelpI_8#cPnU?Sjaut
zROO^~J!+YISj@y15rNu^y{8vX>A9yfQR_Tc`{66^ou)0DdZ;2c_HL%+&NRU~hZn0-
zq%>wVXhr<}`}g<7a%)Y2)-9)>T1j`hOj3&6xVf!jiUDWnh7JC*;vyWH)8gg(*a8=>
zDfjAMBk{P~L;vr3=Zo|9x;$Q!7JAU>{kKrwnLG^lCZGDEb6Hv2W;^4Ba{(p0?^btx
zwOf&5{+aFmwQJA1k3TNiDB8Z{`s=ka5)vLAt!1Z;tHtcDyq)TF;M0r^)*7>njdi|E
z{H^mlj_X2SYFfmN*)~A}6V7_4mgyKDW@4#wJ;@c(c7HRAneK{4Q<YT4^Hr)-Z*F{(
zH22DzH*cn#f4=ziM?05aOR6Q~MdxjN_3*7Fqo0Gqff|jaeLo%rv<83q)Xbu{!+#@B
zJr|d^>D9w&X%QwGb$^d-TzOqsV%K`b`w^!OeAzVf=k*CTUJR}qH1sPZr+OQ{NCmp;
zz(>!<6DODCp3ymdQ(av<McH_b6W80A`JXQ=DB3i)VjchLH`y-R{cPDTvWms*Vm=nI
zrS!q+2@lVo=HYf{{pBxqn%(qsLYr%QfK_zlOtG8(pA+UXe_l9+O~CJPR$W~r@0H!Q
rl~Y3VWUJ24ef=1%ECH7+7yKURD?93O-tSA#0+n~3u6{1-oD!M<g9lJ0

literal 0
HcmV?d00001

diff --git a/static/center/shop-logo.png b/static/center/shop-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..0d786f0256823e978955a53e8e1e1af032bf4b11
GIT binary patch
literal 3014
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
IM6N<$g0;$=SO5S3

literal 0
HcmV?d00001

diff --git a/static/center/suggestion.png b/static/center/suggestion.png
new file mode 100644
index 0000000000000000000000000000000000000000..d348c3b1fa4620381b508dc3b8ff0bc0102ad85b
GIT binary patch
literal 1842
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

literal 0
HcmV?d00001

diff --git a/uview-ui/components/u-tabs/u-tabs.vue b/uview-ui/components/u-tabs/u-tabs.vue
index 36dd5c2..883865d 100644
--- a/uview-ui/components/u-tabs/u-tabs.vue
+++ b/uview-ui/components/u-tabs/u-tabs.vue
@@ -199,7 +199,7 @@
 		computed: {
 			// 移动bar的样式
 			tabBarStyle() {
-				let scrollBarLeft = this.scrollBarLeft - 7;
+				let scrollBarLeft = this.scrollBarLeft - 9;
 				let style = {
 					width: this.barWidth + 'rpx',
 					transform: `translate(${scrollBarLeft}px, -100%)`,