소스 검색

refactor: 首页去掉横滚 tab,进入页面默认查全部

- 删除 c-box-type 横滚 tab 模板与样式
- 删除 typeList / tlIndex / scrollLeft 等仅 tab 用的状态
- 简化 changeType:只更新 categoryId,不维护 tab 选中态
- getTypeList 只保留 typeGrid 赋值
- 进入页面 queryParams.categoryId 默认为 '',列表展示全部活动
Developer 5 일 전
부모
커밋
9767ae2a8e
1개의 변경된 파일3개의 추가작업 그리고 63개의 파일을 삭제
  1. 3 63
      pages/home.vue

+ 3 - 63
pages/home.vue

@@ -45,15 +45,6 @@
 					<view class="typegrid-name">{{item.name}}</view>
 				</view>
 			</view>
-			<view class="c-box-type">
-				<scroll-view class="scroll-view_H" scroll-x="true" scroll-with-animation="true" :scroll-left="scrollLeft">
-					<view class="scroll-view-item_H" :id="'svih_'+index" v-for="(item,index) in typeList" :key="index" @click="changeType(item,index)">
-						<view class="cl_item" :class="{'active':tlIndex===index}">
-							<text>{{item.name}}</text>
-						</view>
-					</view>
-				</scroll-view>
-			</view>
 			<view class="c-box-list" v-if="activityList.length">
 				<up-list @scrolltolower="scrolltolower" style="height: 100%;">
 					<up-list-item v-for="(item, index) in activityList" :key="item.id">
@@ -125,12 +116,10 @@
 	const bannarList = ref([])
 	const bannarOrigin = ref([])
 	const current = ref(0)
-	const typeList = ref([])
 	const typeGrid = ref([])
-	const tlIndex = ref(0)
-	const scrollLeft = ref(0)
 	const isOver = ref(false)
 	const activityList = ref([])
+	// 进入页面默认查全部(categoryId 为空),点图标网格才切到具体分类
 	const queryParams = ref({
 		page:1,
 		limit:10,
@@ -160,15 +149,6 @@
 	
 	const changeType = (item,index) => {
 		queryParams.value.categoryId = item.id;
-		// grid 与 tab 是同一个筛选行为,但两者的 index 不对齐,按 id 在 typeList 中重新查找 tab 索引
-		const tabIdx = typeList.value.findIndex(t => t.id === item.id);
-		tlIndex.value = tabIdx >= 0 ? tabIdx : 0;
-		// if(typeList.value.length>4){
-		// 	if(index<3) scrollLeft.value = 0
-		// 	else{
-		// 		scrollLeft.value = (index-2)*172/2;
-		// 	}
-		// }
 		initList();
 		getActivityList();
 	}
@@ -197,8 +177,7 @@
 	const getTypeList = () => {
 		proxy.$api.get('/core/activity/category/list').then(({data:res})=>{
 			if(res.code!==0) return proxy.$showToast(res.msg)
-			typeList.value = [{id:'',name:'全部'},...res.data.map(d=>({id:d.id,name:d.categoryName,iconUrl:d.iconUrl||'',bgImageUrl:d.bgImageUrl||''}))];
-			// icon+圆形蒙层 grid:取前 8 个;至少有一个配过 icon 的才展示,避免空 grid
+			// icon 网格:取配过 icon 的前 8 个分类;空 grid 时不展示
 			typeGrid.value = res.data.filter(d=>d.iconUrl).slice(0,8).map(d=>({id:d.id,name:d.categoryName,iconUrl:d.iconUrl,bgImageUrl:d.bgImageUrl||''}));
 		})
 	}
@@ -298,22 +277,7 @@
 	::v-deep .u-swiper__wrapper__item__wrapper__image{
 		border-radius: 24rpx !important;
 	}
-	
-	.scroll-view_H {
-		white-space: nowrap;
-		width: 100%;
-	}
-	
-	.scroll-view-item_H {
-		display: inline-block;
-		// width: 152rpx;
-		height: 100%;
-		margin-left: 20rpx;
-		&:first-child{
-			margin-left: 0;
-		}
-	}
-	
+
 	.tab_page{
 		.c-box{
 			width: 100%;
@@ -354,30 +318,6 @@
 					line-height: 33rpx;
 				}
 			}
-			&-type{
-				width: 100%;
-				height: 68rpx;
-				margin-top: 31rpx;
-				.cl_item{
-					// width: 152rpx;
-					padding: 0 21rpx;
-					height: 68rpx;
-					background: #FFFFFF;
-					border-radius: 34rpx;
-					font-family: PingFangSC, PingFang SC;
-					font-weight: 400;
-					font-size: 28rpx;
-					color: #676775;
-					line-height: 68rpx;
-					text-align: center;
-					&.active{
-						background: #B7F358;
-						font-weight: bold;
-						font-size: 30rpx;
-						color: #151B29;
-					}
-				}
-			}
 			&-typegrid{
 				width: 100%;
 				display: flex;