feat: 实现赞/踩系统(P2)
- 新增 PostLike/PostDislike 模型,复合主键 (user_id, post_id) - Post 表新增 LikesCount/DislikesCount 冗余计数器 - Repository 层:reaction_repo.go,含 WithTx 事务支持 - Service 层:reaction_service.go,赞踩互斥逻辑(6 态切换),事务包裹 - Controller 层:reaction_controller.go,3 个 API(ToggleLike/ToggleDislike/GetReaction) - 接口定义:controller/interfaces.go 新增 reactionUseCase,service/repository.go 新增 ReactionStore - 路由注册 + 依赖注入 + AutoMigrate - 前端:文章详情页赞踩按钮 + 状态查询 + 401 跳转登录 - 样式:posts.css 新增赞踩按钮样式
This commit is contained in:
@ -197,7 +197,72 @@
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* ========== 404 ========== */
|
||||
/* ========== 赞/踩按钮 ========== */
|
||||
.post-reactions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-top: 20px;
|
||||
padding: 12px 0;
|
||||
border-top: 1px solid #e5e7eb;
|
||||
}
|
||||
|
||||
.reaction-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 8px 16px;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
color: #6b7280;
|
||||
transition: all 0.2s;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.reaction-btn:hover {
|
||||
border-color: #c4b5fd;
|
||||
color: #6366f1;
|
||||
background: #f5f3ff;
|
||||
}
|
||||
|
||||
.reaction-btn:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.reaction-btn.active.reaction-like-btn {
|
||||
border-color: #6366f1;
|
||||
color: #6366f1;
|
||||
background: #f0eeff;
|
||||
}
|
||||
|
||||
.reaction-btn.active.reaction-like-btn svg {
|
||||
fill: #6366f1;
|
||||
stroke: #6366f1;
|
||||
}
|
||||
|
||||
.reaction-btn.active.reaction-dislike-btn {
|
||||
border-color: #f87171;
|
||||
color: #f87171;
|
||||
background: #fef2f2;
|
||||
}
|
||||
|
||||
.reaction-btn.active.reaction-dislike-btn svg {
|
||||
fill: #f87171;
|
||||
stroke: #f87171;
|
||||
}
|
||||
|
||||
.reaction-like-count {
|
||||
font-weight: 600;
|
||||
min-width: 12px;
|
||||
}
|
||||
|
||||
.reaction-btn.active .reaction-like-count {
|
||||
color: inherit;
|
||||
}
|
||||
.error-404 {
|
||||
text-align: center;
|
||||
padding: 100px 0;
|
||||
|
||||
Reference in New Issue
Block a user