fgm
/
cankao-h5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(recommend): 优化事件梳理展开收起功能 

- 重构事件梳理组件的展开收起逻辑，统一处理方式
- 添加点击切换展开收起状态的方法
- 修复背景图片引用错误，上下箭头图标对调问题
- 优化样式代码格式，提升代码可读性

fix(detail): 修复进一步阅读数据初始化位置
This commit is contained in:
傅光孟 2026-02-12 10:02:47 +08:00
parent a96b1cc6ea
commit 3c39e72230
2 changed files with 30 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/pages/detail/indexNewsInfo.vue
View File

@ -72,11 +72,9 @@ const newList = async (columnId: number) => {
page: 1,
size: 5,
});
if (res.code === 200) {
// console.log(res.data)
columnList.value = res.data;
furtherReadData.value = res.data.furtherReadings || [];
}
};
@ -242,6 +240,9 @@ onLoad(async (option: any) => {
res.data.content = res.data.content.replace(/\n{3,}/g, "\n");
columnName.value = res.data.columnName1;
furtherReadData.value = res.data.furtherReadings || [];
newList(res.data.columnId1);
wxShare();
}

38
src/pages/recommend/index.vue
View File

@ -74,17 +74,18 @@
:class="['events-collapse']"
v-if="news.furtherReadings?.length > 0"
>
<view class="events-collapse-top active">
<view class="t-1">事件梳理</view>
<view
v-if="!selectKeys.includes(news.id)"
class="t-2"
@click="handleOpenEvents(news.id)"
>展开</view
>
<view v-else class="t-2" @click="handleCloseEvents(news.id)"
>收起</view
:class="[
'events-collapse-top',
{ active: !selectKeys.includes(news.id) },
]"
@click.stop="
handleClickToggle(news.id, !selectKeys.includes(news.id))
"
>
<view class="t-1">事件梳理</view>
<view v-if="!selectKeys.includes(news.id)" class="t-2">展开</view>
<view v-else class="t-2">收起</view>
</view>
<view
v-show="selectKeys.includes(news.id)"
@ -137,8 +138,12 @@ const handleBack = () => {
};
const selectKeys = ref([]);
const handleOpenEvents = (id: string) => {
const handleClickToggle = (id: string, type: string) => {
if (!type) {
selectKeys.value = selectKeys.value.filter((item) => item !== id);
} else {
selectKeys.value.push(id);
}
};
const handleCloseEvents = (id: string) => {
@ -194,6 +199,12 @@ const getList = async () => {
if (result.code === 200) {
const { list, total } = result.data;
data.value = list;
list.forEach((o) => {
o.list.forEach((n) => {
selectKeys.value.push(n.id)
});
});
} else {
data.value = [];
}
@ -414,7 +425,8 @@ onMounted(async () => {
// height: 20rpx;
margin-right: 10rpx;
padding-right: 24rpx;
background: url("@/assets/images/page/star_icon@2x.png") no-repeat center right;
background: url("@/assets/images/page/star_icon@2x.png") no-repeat center
right;
background-size: 20rpx 20rpx;
font-size: 24rpx;
line-height: 24rpx;
@ -515,7 +527,7 @@ onMounted(async () => {
}
.t-2 {
padding-right: 26rpx;
background-image: url("@/assets/images/page/down_icon@2x.png");
background-image: url("@/assets/images/page/up_icon@2x.png");
background-repeat: no-repeat;
background-position: right center;
background-size: 19rpx 12rpx;
@ -527,7 +539,7 @@ onMounted(async () => {
&.active {
.t-2 {
background-image: url("@/assets/images/page/up_icon@2x.png");
background-image: url("@/assets/images/page/down_icon@2x.png");
}
}
}