0961bbd1b7
- 新增微语页面，类似 Twitter/QQ 空间的短内容发布平台 - 添加 GitHub 风格热力图组件展示发布活动 - 支持发布微语、图片上传、标签、Emoji - 支持点赞、评论功能 - 右侧栏显示统计数据和热门标签 - 支持按标签筛选微语 - 后端新增微语相关 API（CRUD、点赞、评论、标签） Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>
44 lines
1.3 KiB
Plaintext
44 lines
1.3 KiB
Plaintext
---
|
|
import BaseLayout from '../layouts/BaseLayout.astro';
|
|
import MicroFeed from '../components/MicroFeed.vue';
|
|
import MicroSidebar from '../components/MicroSidebar.vue';
|
|
|
|
// API 基础 URL
|
|
const API_BASE = import.meta.env.PUBLIC_API_BASE || 'http://localhost:8080';
|
|
---
|
|
|
|
<BaseLayout title="微语 - NovaBlog" description="分享生活点滴，记录灵感瞬间">
|
|
<div class="content-width py-8">
|
|
<!-- 页面标题 -->
|
|
<div class="mb-8">
|
|
<h1 class="text-3xl font-bold mb-2">微语</h1>
|
|
<p class="text-foreground/60">分享生活点滴，记录灵感瞬间</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
|
<!-- 左侧：发布框和动态列表 -->
|
|
<div class="lg:col-span-2">
|
|
<MicroFeed
|
|
client:load
|
|
apiBaseUrl={`${API_BASE}/api`}
|
|
onPublished="handlePublished"
|
|
/>
|
|
</div>
|
|
|
|
<!-- 右侧：热力图和统计 -->
|
|
<MicroSidebar
|
|
client:load
|
|
apiBaseUrl={`${API_BASE}/api`}
|
|
ref="sidebarRef"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</BaseLayout>
|
|
|
|
<script>
|
|
// 通过自定义事件实现组件间通信
|
|
window.addEventListener('micro-published', () => {
|
|
// 触发侧边栏刷新
|
|
window.dispatchEvent(new CustomEvent('refresh-sidebar'));
|
|
});
|
|
</script> |