feat: 优化页面布局和交互体验

- 使用sticky定位替代fixed定位,提升滚动体验
- 添加视频播放图标和图片展示功能
- 实现搜索框热门关键词轮播效果
- 优化编辑器链接插入功能
- 调整组件样式和布局细节
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-11-10 19:06:58 +08:00
parent b7feedb350
commit 5cdbeb249f
26 changed files with 517 additions and 373 deletions

View File

@@ -36,5 +36,5 @@ export const itemForum = defineComponent({
itemHead,
},
template: `<div class="item-box item-forum"> <item-head :itemdata="item" :page="page"></item-head> <a v-if="item.title" class="title" :href="item.url" target="_blank">{{ item.title }}</a> <a class="message two-line-display" :href="item.url" target="_blank">{{ item.content }}</a> <item-bottom :itemdata="item" :page="page"></item-bottom></div>`,
template: `<div class="item-box item-forum"> <item-head :itemdata="item" :page="page"></item-head> <a v-if="item.title" class="title" :href="item.url" target="_blank">{{ item.title }}</a> <a class="message two-line-display" :href="item.url" target="_blank">{{ item.content }}</a> <a class="picture flexacenter" :href="item.url" target="_blank" v-if="item.images?.length != 0 || item.videos?.length != 0"> <img class="picture-item" v-for="(item, index) in item.images" :key="index" :src="item.url" alt=""> <div class="picture-videos"> <img class="picture-item" v-for="(item, index) in item.videos" :key="index" :src="item.posterurl" alt=""> <img class="icon-play" src="/img/videoplay.png" alt=""> </div> </a> <item-bottom :itemdata="item" :page="page"></item-bottom></div>`,
});

View File

@@ -1,8 +1,15 @@
<div class="item-box item-forum">
<item-head :itemdata="item" :page="page"></item-head>
<a v-if="item.title" class="title" :href="item.url" target="_blank">{{ item.title }}</a>
<a class="message two-line-display" :href="item.url" target="_blank">{{ item.content }}</a>
<a class="picture flexacenter" :href="item.url" target="_blank" v-if="item.images?.length != 0 || item.videos?.length != 0">
<img class="picture-item" v-for="(item, index) in item.images" :key="index" :src="item.url" alt="">
<div class="picture-videos">
<img class="picture-item" v-for="(item, index) in item.videos" :key="index" :src="item.posterurl" alt="">
<img class="icon-play" src="/img/videoplay.png" alt="">
</div>
</a>
<item-bottom :itemdata="item" :page="page"></item-bottom>
</div>