From 07528364d20a9bfaac4cd5b00fff2870a4f8dccc Mon Sep 17 00:00:00 2001
From: zhaofang <752743406@qq.com>
Date: Tue, 8 Nov 2022 18:47:47 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E6=96=87=E7=AB=A0=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/index/index.vue | 79 ++++++++++++++++++++++++++-----------------
 1 file changed, 48 insertions(+), 31 deletions(-)

diff --git a/pages/index/index.vue b/pages/index/index.vue
index b412c96..98de224 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,5 +1,5 @@
 <template>
-	<view style="background-color: #fff;">
+	<view>
 		<u-toast ref="messager"></u-toast>
 		<!--页面头部-->
 		<view class="top" style="padding-top: 6px;">
@@ -46,7 +46,7 @@
 		</view>
 		
 		<!--内容列表区域,采用同一个列表，只是根据不同的选项来查询内容的结果不一样-->
-	    <view v-if="conType == 1">
+	    <view v-if="conType == 1" style="background-color: #fff;">
 				<!-- <view class="tags" v-if="dataFilter.courseTags.length>0">
 					 <u-scroll-list :indicator="false">
 						<view v-for="(tag, tagIdx) in dataFilter.courseTags" :key="tagIdx" >
@@ -97,6 +97,10 @@
 	    <!-- 文章 -->
 	    <view>
 	    	<view v-if="conType == 2">
+				<view class="tab-article">
+					<text class="article-tab-text" :class="{'article-active':tabIndex==1}" @click="clicktab(1)">最热</text>
+					<text class="article-tab-text" :class="{'article-active':tabIndex==0}" @click="clicktab(0)">最新</text>
+				</view>
 	    		<view class="article" v-for="(item,irs) in articleList" :key="irs" @click="toArticleDetail(item)">
 	    			<div class="article-content">
 						<div class="article-info">
@@ -119,16 +123,10 @@
 									</view>
 								</view>
 								<view v-if="item.coverurl!=''" class="article-img">
-									<image :src="fileUrl+item.coverurl" style="width: 157rpx;height: 118rpx;border-radius: 15rpx;"></image>
+									<image :src="fileUrl+item.coverurl" style="width: 184rpx;height: 124rpx;border-radius: 15rpx;"></image>
 								</view> 
 							</view>
-							<view style="margin-top: 7upx;">
-								<interact-bar :data="item"></interact-bar>
-							</view>
 						</div>
-					<!-- 	<div v-if="item.coverurl!=''" class="article-img">
-							<image :src="fileUrl+item.coverurl" style="width: 200rpx;height: 150rpx;"></image>
-						</div> -->
 					</div>
 	    		</view>
 	    	</view>
@@ -853,36 +851,55 @@
 		}
 		
 	}
-	.con_box {
-		margin-bottom: 10px;
-		background-color: #FFFFFF;
-		padding: 10px 15px;
-		// margin-top: 10px;
-		.tit {
-	        font-size: 32rpx;
-			color: #4c4c4c;
-			font-weight: 35upx;
-			margin-bottom: 10upx;
+	// .con_box {
+	// 	margin-bottom: 10px;
+	// 	background-color: #FFFFFF;
+	// 	padding: 10px 15px;
+	// 	// margin-top: 10px;
+	// 	.tit {
+	//         font-size: 32rpx;
+	// 		color: #4c4c4c;
+	// 		font-weight: 35upx;
+	// 		margin-bottom: 10upx;
+	// 	}
+	// }
+	.tab-article{
+		padding: 30upx;
+		padding-bottom: 10upx;
+		background-color: #fff;
+		.article-tab-text{
+			display: inline-block;
+			font-size: 28upx;
+			font-weight: 500;
+			color: #666666;
+			margin-right: 36upx;
+		}
+		.article-active{
+			width: 88upx;
+			height: 48upx;
+			background: linear-gradient(180deg, #FC635C 0%, #EF4844 100%);
+			border-radius: 8upx;
+			line-height: 48upx;
+			text-align: center;
+			color: #fff;
 		}
 	}
 	.article {
-		// height: 264upx;
-		margin-bottom: 10px;
+		margin-bottom: 20upx;
 		background-color: #FFFFFF;
-		padding: 20upx 28upx 10upx 28upx;
-		margin-top: 5px;
+		padding: 40upx 36upx 46upx 36upx;
 		.article-content{
 			display: flex;
 			justify-content: space-between;
 			.article-info{
 				flex: 1;
 				.article-title{
-					font-size: 30rpx;
-					color: #040404;
-					font-weight: 610;
-					letter-spacing: 0.5px;
+					font-size: 36upx;
+					color: #333333;
+					font-weight: 600;
+					// letter-spacing: 0.5px;
 					//line-height: 42px;
-					margin-bottom: 15rpx;
+					margin-bottom: 20rpx;
 					word-break:break-all;
 					overflow: hidden;
 					text-overflow: ellipsis;
@@ -895,10 +912,10 @@
 				}
 				.article-summary{
 					word-break:break-all;
-					font-size: 28rpx;
+					font-size: 28upx;
 					font-family: Source Han Sans CN;
-					color: #454545;
-					line-height: 39rpx;
+					color: #666666;
+					line-height: 40upx;
 					// height: 80upx;
 					overflow: hidden;
 					text-overflow: ellipsis;