7.10 增加登录页面，事件详情接口对接，我的点赞，关注收藏页面搭建，接口对接

pages/index/index.vue

@@ -14,7 +14,7 @@
 					<view :class="'item '+(selectTimeCategory==index?'select':'')" v-for="(item,index) in timeCategoryList" :key="index" @click="clickTimeCategoryItem(index)">{{item.name}}</view>
 				</view>
 				<view class="flex">
-					<view class="sortC flex" @click="clickSortItem()">
+					<view class="sortC flex" @click="clickSort()">
 						<image class="icon" src="/static/icon/home/sort.png" mode="widthFix"></image>
 						<text>排序</text>
 					</view>
@@ -25,14 +25,14 @@
 					</view>
 				</view>
 			</view>
-			<scroll-view scroll-x class="topCategoryC">
-				<view :class="'item relative '+(selectTopCategory==index?'select':'')" v-for="(item,index) in topCategoryList" :key="index" @click="clickTopCategoryItem(index)">
-					{{item}}
+			<scroll-view scroll-x :scroll-left="topScrollLeft" class="topCategoryC" id="topCategory">
+				<view :class="'item relative '+(selectTopCategory==index?'select':'')" v-for="(item,index) in stockCategoryList" :key="index" @click="clickTopCategoryItem($event,index)">
+					{{item.primary_sector}}
 					<view class="line absolute"></view>
 				</view>
 			</scroll-view>
-			<scroll-view scroll-x class="secondCategoryC">
-				<view :class="'item '+(selectSecondCategory==index?'select':'')" v-for="(item,index) in secondCategoryList" :key="index" @click="clickSecondCategoryItem(index)">
+			<scroll-view v-if="stockCategoryList.length>0&&stockCategoryList[selectTopCategory].sub_sectors.length>0" scroll-x :scroll-left="secondScrollLeft" class="secondCategoryC" id="secondCategory">
+				<view :class="'item '+(selectSecondCategory==index?'select':'')" v-for="(item,index) in stockCategoryList[selectTopCategory].sub_sectors" :key="index" @click="clickSecondCategoryItem($event,index)">
 					{{item}}
 				</view>
 			</scroll-view>
@@ -47,7 +47,7 @@
 						<view :class="'level '+item.importance">{{item.importance}}</view>
 						<view class="title">{{item.title}}</view>
 					</view>
-					<view class="content">{{item.description}}</view>
+					<view :class="'content '+(item.isExpand?'':'retract')" @click.stop="clickExpandOrRetract(index)">{{item.description}}</view>
 					<scroll-view scroll-x class="increaseRateList">
 						<view :class="'rateItem '+(getRateUpOrDown(item.related_avg_chg)?'down':'up')">
 							平均涨幅: 
@@ -69,7 +69,7 @@
 						</view>
 					</scroll-view>
 					<scroll-view scroll-x class="stockList">
-						<view class="stockItem">中远海控 +1.46%</view>
+						<view class="stockItem" v-for="(sitem,sindex) in item.related_stocks" :key="sindex" @click.stop="clickLookRelatedStockItem(sitem.stock_code)">{{sitem.stock_name}} <text class="change">{{(getRateUpOrDown(sitem.daily_change)?'':'+')+sitem.daily_change}}%</text></view>
 					</scroll-view>
 					<view class="timeToolBarC flex">
 						<view class="time flex1">{{getLocaleTime(item.created_at)}}</view> 
@@ -82,7 +82,7 @@
 								<image class="icon" src="/static/icon/home/comment.png" mode="widthFix"></image>
 								<text>{{item.post_count}}</text>
 							</view>
-							<view class="toolItem flex">
+							<view class="toolItem flex" @click.stop="clickFollowEvent(item.id)">
 								<image class="icon" src="/static/icon/home/follow.png" mode="widthFix"></image>
 								<text>{{item.follower_count}}</text>
 							</view>
@@ -95,7 +95,7 @@
 			<view class="sortPopup relative">
 				<image class="arrow absolute" src="/static/icon/home/sortArrow.png" mode="widthFix"></image>
 				<view class="list" :style="'margin-top:'+sortListTop+'px;'">
-					<view class="item flex" v-for="(item,index) in sortList" :key="index">
+					<view class="item flex" v-for="(item,index) in sortList" :key="index" @click="clickSortListItem(item)">
 						<image class="icon" :src="item.icon" mode="aspectFit"></image>
 						<text> {{item.name}}</text>
 					</view>
@@ -159,14 +159,31 @@
 						<block v-if="selectScreenCategory==1">
 							<view class="section">选择体系</view>
 							<view class="industryCategoryC flexWrap">
-								<view class="item" v-for="(item,index) in industryTopCategoryList" :key="index">
-									{{item}}
+								<view :class="'item '+(selectIndustryTopCategory==index?'select':'')"  v-for="(item,index) in industryTopCategoryList" :key="index" @click="clickSelectIndustryTopCategoryItem(index)">
+									{{item.classification_name}}
 								</view>
 							</view>
 							<view class="industrySearchC flex">
 								<image class="icon" src="/static/icon/home/search.png" mode="widthFix"></image>
 								<input class="flex1" type="text" placeholder="搜索行业" placeholder-style="color:#94989A"/>
 							</view>
+							<view class="industryList">
+								<view class="selectCategoryList flexWrap">
+									
+								</view>
+								<view class="list">
+									<view class="topCategory">{{industryTopCategoryList[selectIndustryTopCategory].classification_name}}</view>
+									<view class="secondList">
+										<view class="secondItem">
+											<view class="thirdList">
+												<view class="thirdItem">
+													
+												</view>
+											</view>
+										</view>
+									</view>
+								</view>
+							</view>
 						</block>
 						<block v-if="selectScreenCategory==2">
 							<view class="section">重要性</view>
@@ -189,7 +206,7 @@
 
 <script>
 	import { inject } from 'vue'
-	import { eventFilterList, eventList, login } from '@/request/api'
+	import { filterOptions, eventList, homeData, industryCategoryList, loginByEmail, followEvent, stockCategoryList } from '@/request/api'
 	import { getRateStr, getRateUpOrDown, getLocaleTime } from '@/utils/util.js'
 	const echarts = require('../../uni_modules/lime-echart/static/echarts.min.js');
 
@@ -199,17 +216,23 @@
 				menuTop:inject('menuTop'),
 				menuH: inject('menuHeight'),
 				navH:inject('navHeight'),
+				windowWidth:inject('windowWidth'),
+				
 				contentTop:'',
 				listTop:'',
 				sortListTop:'',
 				keywords:'',	//关键词
 				sortList:[],
+				selectSortKey:'',	//选中排序key
 				timeCategoryList:[],
 				selectTimeCategory:0,
-				topCategoryList:['全部','大周期','大消费','大金融地产','TMT板块','公共产业板块'],
+				stockCategoryList:[],
+				topScrollWidth:0,
+				secondScrollWidth:0,
 				selectTopCategory:0,
-				secondCategoryList:['全部','石油石化','煤炭','有色金属','钢铁','基础化工','建筑材料'],
+				topScrollLeft:0,
 				selectSecondCategory:0,
+				secondScrollLeft:0,
 				screenCategoryList:['日期范围','行业分类','重要性'],
 				selectYearMonth:'',		//选择的年月日
 				startDate:'',		//选择开始日期
@@ -220,7 +243,8 @@
 				monthDateList:[],
 				selectMonthIndex:0,		//选中月份下标
 				selectMonth:'',			//选中年月
-				industryTopCategoryList:['巨潮行业分类','新财富行业分类','申银万国行业分类','证监会行业分类'],
+				industryTopCategoryList:[],		//行业一级分类
+				selectIndustryTopCategory:0,	//
 				selectScreenCategory:0,
 				importanceList:[],				//重要性数组
 				selectImportanceIndex:0,		//选择重要性下标
@@ -352,11 +376,13 @@
 			}
 		},
 		onLoad() {
-			this.contentTop = this.navH + (75+20)/750*inject('windowWidth')
-			this.listTop = this.contentTop + (22+80+72+44+44)/750*inject('windowWidth')
-			this.sortListTop = this.navH + (22+80+80)/750*inject('windowWidth')
+			this.contentTop = this.navH + (75+20)/750*this.windowWidth
+			this.listTop = this.contentTop + (22+80+72)/750*this.windowWidth
+			this.sortListTop = this.navH + (22+80+80)/750*this.windowWidth
 			this.getEventFilterListData()
 			this.getEventListData()
+			this.getIndustryCategoryListData()
+			this.getStockCategoryListData()
 			// this.init()
 			let currentDate = new Date();
 			// 获取当前年份
@@ -428,6 +454,17 @@
 			}
 			this.monthDateList = monthDateList
 		},
+		onReady() {
+			uni.createSelectorQuery().select('#topCategory').boundingClientRect(rect=>{
+			    this.topScrollWidth = Math.round(rect.width)
+			}).exec()
+			uni.createSelectorQuery().select('#secondCategory').boundingClientRect(rect=>{
+				if(rect)
+				{
+					this.secondScrollWidth = Math.round(rect.width)
+				}
+			}).exec()
+		},
 		onPullDownRefresh() {
 			this.page = 1 
 			this.getEventListData()
@@ -463,15 +500,36 @@
 				if(this.selectTimeCategory!=index)
 				{
 					this.selectTimeCategory = index
+					if(index==0)
+					{
+						//最新
+						this.getEventListData()
+					}else 
+						//热门
+						this.getHotEventListData()
 				}
 			},
 			/**
 			 * 点击排序
 			 */
-			clickSortItem()
+			clickSort()
 			{
 				this.$refs['sortPopup'].open()
 			},
+			/**
+			 * 点击排序选项
+			 */
+			clickSortListItem(item)
+			{
+				this.selectSortKey = item.key
+				this.$refs['sortPopup'].close()
+				if(this.selectTimeCategory==0)
+				{
+					//最新
+					this.getEventListData()
+				}else 
+					this.getHotEventListData()
+			},
 			/**
 			 * 点击筛选
 			 */
@@ -509,22 +567,31 @@
 			 * 点击选择一级分类
 			 * @param {Object} index
 			 */
-			clickTopCategoryItem(index)
+			clickTopCategoryItem(event,index)
 			{
 				if(this.selectTopCategory!=index)
 				{
 					this.selectTopCategory = index
+					let offsetLeft = event.currentTarget.offsetLeft
+					this.topScrollLeft = offsetLeft - this.topScrollWidth/2
+					if(index==0)
+					{
+						this.listTop = this.contentTop + (22+80+72)/750*this.windowWidth
+					}else
+						this.listTop = this.contentTop + (22+80+72+44+44)/750*this.windowWidth
 				}
 			},
 			/**
 			 * 点击选择二级分类
 			 * @param {Object} index
 			 */
-			clickSecondCategoryItem(index)
+			clickSecondCategoryItem(event,index)
 			{
 				if(this.selectSecondCategory!=index)
 				{
 					this.selectSecondCategory = index
+					let offsetLeft = event.currentTarget.offsetLeft
+					this.secondScrollLeft = offsetLeft - this.secondScrollWidth/2
 				}
 			},
 			/**
@@ -594,6 +661,16 @@
 					this.startTimeStamp = item.timestamp
 				}
 			},
+			/**
+			 * 选择行业分类一级分类
+			 */
+			clickSelectIndustryTopCategoryItem(index)
+			{
+				if(this.selectIndustryTopCategory!=index)
+				{
+					this.selectIndustryTopCategory = index
+				}
+			},
 			/**
 			 * 点击选择重要性
 			 */
@@ -604,6 +681,39 @@
 					this.selectImportanceIndex = index
 				}
 			},
+			/**
+			 * 点击展开收起内容
+			 * @param {Object} index
+			 */
+			clickExpandOrRetract(index)
+			{
+				this.eventList[index].isExpand = !this.eventList[index].isExpand
+			},
+			/**
+			 * 点击相关股票
+			 * @param {Object} code
+			 */
+			clickLookRelatedStockItem(code)
+			{
+				uni.navigateTo({
+					url:'/pages/index/stockDetails/stockDetails?code='+code
+				})
+			},
+			/**
+			 * 点击关注事件
+			 * @param {Object} id
+			 */
+			clickFollowEvent(id)
+			{
+				followEvent(id).then(res=>{
+					uni.showToast({
+						title:res.message,
+						icon:'none'
+					})
+				}).catch(error=>{
+					
+				})	
+			},
 			/**
 			 * 查看事件详情
 			 */
@@ -618,27 +728,68 @@
 			 */
 			getEventFilterListData()
 			{
-				eventFilterList().then(res=>{
-					let timeList = [...res.data.available_sorts]
-					this.timeCategoryList = timeList.splice(0,2)
-					let sortList = [...res.data.available_sorts]
-					for (let item of sortList) {
-						if(item.name=='最新')
-						{
-							item.icon = '/static/icon/home/new.png'
+				filterOptions().then(res=>{
+					if(res.code==200)
+					{
+						let timeList = [...res.data.sort_options]
+						this.timeCategoryList = timeList.splice(0,2)
+						let sortList = [...res.data.sort_options]
+						for (let item of sortList) {
+							if(item.name=='最新')
+							{
+								item.icon = '/static/icon/home/new.png'
+							}
+							if(item.name=='热门')
+							{
+								item.icon = '/static/icon/home/hot.png'
+							}
+							if(item.name=='收益率')
+							{
+								item.icon = '/static/icon/home/yield.png'
+							}
 						}
-						if(item.name=='热门')
-						{
-							item.icon = '/static/icon/home/hot.png'
+						this.sortList = res.data.sort_options.splice(0,3)
+						this.importanceList = res.data.importance_options
+						this.importanceList.unshift({desc: "全部",key: "all",name: "全部"})
+					}else 
+						uni.showToast({
+							title:res.message,
+							icon:'none'
+						})
+					
+				}).catch(error=>{
+					
+				})
+			},
+			/**
+			 * 获取行业分类
+			 */
+			getIndustryCategoryListData()
+			{
+				industryCategoryList().then(res=>{
+					this.industryTopCategoryList = res.data
+				}).catch(error=>{
+					
+				})
+			},
+			/**
+			 * 获取股票分类
+			 */
+			getStockCategoryListData()
+			{
+				stockCategoryList().then(res=>{
+					if(res.code==200)
+					{
+						for (let item of res.data) {
+							item.sub_sectors.unshift('全部')
 						}
-						if(item.name=='收益率')
-						{
-							item.icon = '/static/icon/home/yield.png'
-						}
-					}
-					this.sortList = res.data.available_sorts.splice(0,3)
-					this.importanceList = res.data.available_importance_levels
-					this.importanceList.unshift({desc: "全部",key: "all",name: "全部"})
+						res.data.unshift({primary_sector:'全部',sub_sectors:[]})
+						this.stockCategoryList = res.data
+					}else
+						uni.showToast({
+							title:res.message,
+							icon:'none'
+						})
 				}).catch(error=>{
 					
 				})
@@ -661,6 +812,10 @@
 				{
 					param.importance = this.importanceList[this.selectImportanceIndex].key
 				}
+				if(this.selectSortKey)
+				{
+					param.sort = this.selectSortKey
+				}
 				eventList(param).then(res=>{
 					if(res.success)
 					{
@@ -672,6 +827,45 @@
 					}
 				}).catch(error=>{
 					
+				})
+				let token = uni.getStorageSync('token')
+				if(!token)
+				{
+					let param1 = {email:'1198731706@qq.com',password:'Aa123456',isJson:1}
+					loginByEmail(param1).then(res=>{
+						if (res.code==200) {
+							uni.setStorageSync('token',res.data.token)
+						} else 
+							uni.showToast({
+								title:res.message,
+								icon:'none'
+							})
+					}).catch(error=>{
+						
+					})
+				}
+				
+			},
+			/**
+			 * 获取热门事件数据
+			 */
+			getHotEventListData()
+			{
+				homeData().then(res=>{
+					if(res.code==200)
+					{
+						if(this.page==1)
+						{
+							this.eventList = res.data.events
+						}else 
+							this.eventList = this.eventList.concat(res.data.events)
+					}else 
+						uni.showToast({
+							title:res.message,
+							icon:'none'
+						})
+				}).catch(error=>{
+					
 				})
 			}
 		}
@@ -882,14 +1076,18 @@
 			.content 
 			{
 				margin-top: 20rpx;
+				font-size: 24rpx;
+				font-weight: 500;
+				color: #666;
+				word-break: break-all;
+			}
+			.content.retract 
+			{
 				display: -webkit-box;
 				-webkit-box-orient: vertical;
 				-webkit-line-clamp: 3;
 				text-overflow: ellipsis;
 				overflow: hidden;
-				font-size: 24rpx;
-				font-weight: 500;
-				color: #666;
 			}
 			.increaseRateList
 			{
@@ -927,6 +1125,7 @@
 				.stockItem
 				{
 					background-color: #F8F8F8;
+					margin-right: 21rpx;
 					display: inline-block;
 					padding: 0 20rpx;
 					line-height: 60rpx;
@@ -934,7 +1133,12 @@
 					font-size: 30rpx;
 					font-weight: bold;
 					color: #222;
+					.change 
+					{
+						color: #F97316;
+					}
 				}
+				
 			}
 			.timeToolBarC
 			{
@@ -1201,6 +1405,20 @@
 				height: auto;
 			}
 		}
+		.industryList
+		{
+			margin-top: 24rpx;
+			.list 
+			{
+				.topCategory 
+				{
+					padding: 0 30rpx;
+					font-size: 28rpx;
+					font-weight: bold;
+					color: #F97316;
+				}
+			}
+		}
 		.importanceList 
 		{
 			margin-top: 16rpx;