Kingsmai/pokopiawiki.tootaio.com
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(life): allow authors to view and restore their deleted comments

Browse Source 
Update backend to return soft-deleted comments to their authors
Add restore endpoint and frontend Undo button for deleted comments
Retain comment body and author information upon deletion
This commit is contained in:
xiaomai
2026-05-04 14:54:00 +08:00
parent b0e2036965
commit 016364a8b8
8 changed files with 286 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
DESIGN.md
View File

@@ -817,7 +817,7 @@ Life Post 可配置：
- 拥有 `life.posts.update-any` / `life.posts.delete-any` 权限的用户可以管理其他用户的 Life Post。
- 已注册并完成邮箱验证且拥有 `life.posts.create` 或 `life.posts.update` 权限的用户发布或编辑 Life Post 时必须选择 1 个 Life Category。
- 已注册并完成邮箱验证且拥有 `life.comments.create` 权限的用户可以评论 Life Post，并回复顶层评论。
- 评论作者拥有 `life.comments.delete` 权限时可以删除自己的评论；拥有 `life.comments.delete-any` 权限的用户可以删除其他用户评论；删除后的 Life Comment 不再出现在评论列表、评论预览或评论数量中。
- 评论作者拥有 `life.comments.delete` 权限时可以删除自己的评论；拥有 `life.comments.delete-any` 权限的用户可以删除其他用户评论；删除后的 Life Comment 仅对该评论作者本人可见并保留正文，作者可通过 Undo 恢复；其他用户不可见，不显示 Deleted Comment 占位，不出现在评论列表、评论预览或评论数量中。
- 已软删除的 Life Post 不出现在信息流、搜索或 Category 筛选结果中，也不能继续编辑、评论或设置 Reaction。
- 已软删除的 Life Post 详情页返回未找到，不公开软删除字段。
- 每条 Life Post 默认只展示评论入口与评论数量；评论列表、回复和评论输入默认折叠，用户点击后展开。
@@ -841,7 +841,7 @@ Life Post 可配置：
- 未审核通过的 Life Post 详情只对作者本人和拥有对应管理权限的用户可见；普通访客访问时返回未找到。
- Life Post 必须展示未通过或未完成的审核状态：审核中、未审核、审核失败、审核不通过；审核通过不显示状态标签。
- 新增或更新 Life Post 后先进入不可公开状态，AI 审核通过后才出现在普通公开 Feed。
- Life Comment 和回复审核通过且未删除后才出现在普通公开评论列表、评论数量和评论预览中。
- Life Comment 和回复审核通过且未删除后才出现在普通公开评论列表、评论数量和评论预览中；已删除评论只在作者自己的可见评论列表、评论数量和评论预览中保留，以便作者 Undo。
- 审核失败不等于审核通过；失败内容保持不可公开，用户可重新审核。
- `reviewing` 表示审核正在进行中，前端不展示重新审核入口；只有 `unreviewed`、`rejected` 和 `failed` 这类非进行中且未通过状态可触发重新审核。
- Life Post 是用户生成内容，正文按作者输入展示，不进入 `entity_translations`。
@@ -1063,6 +1063,7 @@ API 暴露边界：
- `POST /api/life-posts/:postId/comments`
- `POST /api/life-posts/:postId/comments/:commentId/replies`
- `DELETE /api/life-comments/:id`
- `POST /api/life-comments/:id/restore`
- `POST /api/life-comments/:id/moderation/retry`
- 实体讨论评论的创建、回复，以及作者本人对评论的删除，需要对应 `discussions.comments.*` 权限；管理他人内容需要对应 `*-any` 权限。
- `POST /api/discussions/:entityType/:entityId/comments`

54
backend/src/queries.ts
View File

@@ -3077,7 +3077,7 @@ function lifeCommentProjection(whereClause: string): string {
lc.id,
lc.post_id AS "postId",
lc.parent_comment_id AS "parentCommentId",
CASE WHEN lc.deleted_at IS NULL THEN lc.body ELSE '' END AS body,
lc.body,
lc.deleted_at IS NOT NULL AS deleted,
lc.ai_moderation_status AS "moderationStatus",
lc.ai_moderation_language_code AS "moderationLanguageCode",
@@ -3085,18 +3085,23 @@ function lifeCommentProjection(whereClause: string): string {
lc.created_at AS "createdAt",
lc.created_at::text AS "createdAtCursor",
lc.updated_at AS "updatedAt",
CASE
WHEN lc.deleted_at IS NOT NULL OR comment_user.id IS NULL THEN NULL
ELSE json_build_object('id', comment_user.id, 'displayName', comment_user.display_name)
END AS author
CASE WHEN comment_user.id IS NULL THEN NULL ELSE json_build_object('id', comment_user.id, 'displayName', comment_user.display_name) END AS author
FROM life_post_comments lc
LEFT JOIN users comment_user ON comment_user.id = lc.created_by_user_id
${whereClause}
`;
}
function addVisibleLifeCommentCondition(conditions: string[]): void {
conditions.push('lc.deleted_at IS NULL');
function visibleLifeCommentExpression(alias: string, ownerColumn: string, userParamIndex: number | null): string {
return userParamIndex !== null ? `(${alias}.deleted_at IS NULL OR ${ownerColumn} = $${userParamIndex})` : `${alias}.deleted_at IS NULL`;
}
function addVisibleLifeCommentCondition(conditions: string[], params: unknown[], userId: number | null): void {
const userParamIndex = params.length + 1;
if (userId !== null) {
params.push(userId);
}
conditions.push(visibleLifeCommentExpression('lc', 'lc.created_by_user_id', userId === null ? null : userParamIndex));
conditions.push(`
(
lc.parent_comment_id IS NULL
@@ -3104,7 +3109,7 @@ function addVisibleLifeCommentCondition(conditions: string[]): void {
SELECT 1
FROM life_post_comments parent_comment
WHERE parent_comment.id = lc.parent_comment_id
AND parent_comment.deleted_at IS NULL
AND ${visibleLifeCommentExpression('parent_comment', 'parent_comment.created_by_user_id', userId === null ? null : userParamIndex)}
)
)
`);
@@ -3152,7 +3157,7 @@ async function lifeCommentCountsForPosts(
const params: unknown[] = [postIds];
const conditions = ['lc.post_id = ANY($1::integer[])'];
addVisibleLifeCommentCondition(conditions);
addVisibleLifeCommentCondition(conditions, params, userId);
addModerationVisibilityCondition(conditions, params, 'lc', 'lc.created_by_user_id', userId, canViewAll);
const rows = await query<{ postId: number; total: number }>(
@@ -3184,7 +3189,7 @@ async function lifeCommentPreviewForPosts(
const params: unknown[] = [postIds];
const previewConditions = ['lc.post_id = ANY($1::integer[])', 'lc.parent_comment_id IS NULL'];
addVisibleLifeCommentCondition(previewConditions);
addVisibleLifeCommentCondition(previewConditions, params, userId);
addModerationVisibilityCondition(previewConditions, params, 'lc', 'lc.created_by_user_id', userId, canViewAll);
params.push(lifeCommentPreviewLimit);
@@ -3244,7 +3249,7 @@ export async function listLifeComments(
const params: unknown[] = [postId];
const topLevelConditions = ['lc.post_id = $1', 'lc.parent_comment_id IS NULL'];
addVisibleLifeCommentCondition(topLevelConditions);
addVisibleLifeCommentCondition(topLevelConditions, params, userId);
addModerationVisibilityCondition(topLevelConditions, params, 'lc', 'lc.created_by_user_id', userId, canViewAll);
addModerationLanguageCondition(topLevelConditions, params, 'lc', languageCode);
@@ -3269,7 +3274,7 @@ export async function listLifeComments(
? await (async () => {
const replyParams: unknown[] = [topLevelIds];
const replyConditions = ['lc.parent_comment_id = ANY($1::integer[])'];
addVisibleLifeCommentCondition(replyConditions);
addVisibleLifeCommentCondition(replyConditions, replyParams, userId);
addModerationVisibilityCondition(replyConditions, replyParams, 'lc', 'lc.created_by_user_id', userId, canViewAll);
addModerationLanguageCondition(replyConditions, replyParams, 'lc', languageCode);
return query<LifeCommentRow>(
@@ -3283,7 +3288,7 @@ export async function listLifeComments(
: [];
const totalParams: unknown[] = [postId];
const totalConditions = ['lc.post_id = $1'];
addVisibleLifeCommentCondition(totalConditions);
addVisibleLifeCommentCondition(totalConditions, totalParams, userId);
addModerationVisibilityCondition(totalConditions, totalParams, 'lc', 'lc.created_by_user_id', userId, canViewAll);
addModerationLanguageCondition(totalConditions, totalParams, 'lc', languageCode);
const total = await queryOne<{ total: number }>(
@@ -4381,6 +4386,29 @@ export async function deleteLifeComment(id: number, userId: number, allowAny = f
return Boolean(result);
}
export async function restoreLifeComment(id: number, userId: number) {
const commentId = requirePositiveInteger(id, 'server.validation.commentInvalid');
const result = await queryOne<{ id: number }>(
`
UPDATE life_post_comments
SET deleted_at = NULL, deleted_by_user_id = NULL, updated_at = now()
WHERE id = $1
AND created_by_user_id = $2
AND deleted_at IS NOT NULL
AND EXISTS (
SELECT 1
FROM life_posts lp
WHERE lp.id = life_post_comments.post_id
AND lp.deleted_at IS NULL
)
RETURNING id
`,
[commentId, userId]
);
return result ? getLifeCommentById(result.id) : null;
}
export async function retryLifeCommentModeration(id: number, userId: number, allowAny = false) {
const commentId = requirePositiveInteger(id, 'server.validation.commentInvalid');
const row = await queryOne<{ id: number }>(

11
backend/src/server.ts
View File

@@ -103,6 +103,7 @@ import {
retryEntityDiscussionCommentModeration,
retryLifeCommentModeration,
retryLifePostModeration,
restoreLifeComment,
setLifePostRating,
setLifePostReaction,
updateConfig,
@@ -1419,6 +1420,16 @@ app.delete('/api/life-comments/:id', async (request, reply) => {
return deleted ? reply.code(204).send() : notFound(reply, request);
});
app.post('/api/life-comments/:id/restore', async (request, reply) => {
const user = await requirePermissionWithRateLimits(request, reply, 'life.comments.delete', 'communityWrite');
if (!user) {
return;
}
const { id } = request.params as { id: string };
const comment = await restoreLifeComment(Number(id), user.id);
return comment ? comment : notFound(reply, request);
});
app.post('/api/life-comments/:id/moderation/retry', async (request, reply) => {
const user = await requireAnyPermissionWithRateLimits(
request,

1
frontend/src/icons.ts
View File

@@ -54,6 +54,7 @@ export const iconStar: AppIcon = 'mdi:star';
export const iconStarOutline: AppIcon = 'mdi:star-outline';
export const iconSuccess: AppIcon = 'mdi:check-circle-outline';
export const iconTranslate: AppIcon = 'mdi:translate';
export const iconUndo: AppIcon = 'mdi:undo';
export const iconUpload: AppIcon = 'mdi:upload-outline';
export const iconVersion: AppIcon = 'mdi:tag-outline';
export const iconWarning: AppIcon = 'mdi:alert-outline';

1
frontend/src/services/api.ts
View File

@@ -1208,6 +1208,7 @@ export const api = {
sendJson<LifeComment>(`/api/life-posts/${postId}/comments/${commentId}/replies`, 'POST', payload),
retryLifeCommentModeration: (id: string | number) =>
sendJson<LifeComment>(`/api/life-comments/${id}/moderation/retry`, 'POST', {}),
restoreLifeComment: (id: string | number) => sendJson<LifeComment>(`/api/life-comments/${id}/restore`, 'POST', {}),
deleteLifeComment: (id: string | number) => deleteJson(`/api/life-comments/${id}`),
entityDiscussion: (entityType: DiscussionEntityType, entityId: string | number, params: CommentPageParams = {}) =>
getJson<EntityDiscussionCommentsPage>(

137
frontend/src/views/LifePostDetail.vue
View File

@@ -21,6 +21,7 @@ import {
iconReactionLike,
iconReactionThanks,
iconReply,
iconUndo,
iconVersion,
iconWarning
} from '../icons';
@@ -149,6 +150,25 @@ function mergeComments(existing: LifeComment[], incoming: LifeComment[]) {
return [...existing, ...incoming.filter((comment) => !ids.has(comment.id))];
}
function replaceCommentInTree(items: LifeComment[], updated: LifeComment): boolean {
for (let index = 0; index < items.length; index += 1) {
const item = items[index];
if (!item) {
continue;
}
if (item.id === updated.id) {
items[index] = { ...updated, replies: item.replies };
return true;
}
if (replaceCommentInTree(item.replies, updated)) {
return true;
}
}
return false;
}
async function loadComments(reset = false) {
const currentPost = post.value;
if (!currentPost || commentsLoading.value || commentsLoadingMore.value || (!reset && commentsLoaded.value && !commentsHasMore.value)) {
@@ -208,8 +228,12 @@ function canManageComment(comment: LifeComment) {
return !comment.deleted && ((currentUser.value?.id === comment.author?.id && can('life.comments.delete')) || can('life.comments.delete-any'));
}
function canRestoreComment(comment: LifeComment) {
return comment.deleted && currentUser.value?.id === comment.author?.id && can('life.comments.delete');
}
function canSeeCommentModeration(comment: LifeComment) {
return currentUser.value?.id === comment.author?.id || can('life.comments.delete-any');
return moderationStatusVisible(comment.moderationStatus) && (currentUser.value?.id === comment.author?.id || can('life.comments.delete-any'));
}
function canUseReactions() {
@@ -277,6 +301,10 @@ function moderationTone(status: AiModerationStatus) {
return tones[status];
}
function moderationStatusVisible(status: AiModerationStatus) {
return status !== 'approved';
}
function canRetryModeration(currentPost: LifePost) {
return currentPost.moderationStatus !== 'approved' && currentPost.moderationStatus !== 'reviewing' && canManage(currentPost);
}
@@ -554,16 +582,39 @@ async function submitReply(currentPost: LifePost, comment: LifeComment) {
}
}
function markCommentDeleted(items: LifeComment[], id: number): boolean {
function countCommentBranch(comment: LifeComment): number {
return 1 + comment.replies.reduce((total, reply) => total + countCommentBranch(reply), 0);
}
function removeCommentFromTree(items: LifeComment[], id: number): number {
for (let index = 0; index < items.length; index += 1) {
const item = items[index];
if (!item) {
continue;
}
if (item.id === id) {
const removedCount = countCommentBranch(item);
items.splice(index, 1);
return removedCount;
}
const removedCount = removeCommentFromTree(item.replies, id);
if (removedCount > 0) {
return removedCount;
}
}
return 0;
}
function markOwnCommentDeleted(items: LifeComment[], id: number): boolean {
for (const item of items) {
if (item.id === id) {
item.deleted = true;
item.body = '';
item.author = null;
return true;
}
if (markCommentDeleted(item.replies, id)) {
if (markOwnCommentDeleted(item.replies, id)) {
return true;
}
}
@@ -581,7 +632,19 @@ async function deleteComment(comment: LifeComment) {
try {
await api.deleteLifeComment(comment.id);
markCommentDeleted(comments.value, comment.id);
if (currentUser.value?.id === comment.author?.id) {
markOwnCommentDeleted(comments.value, comment.id);
comments.value = [...comments.value];
} else {
const removedCount = removeCommentFromTree(comments.value, comment.id);
if (removedCount > 0) {
comments.value = [...comments.value];
commentsTotal.value = Math.max(0, commentsTotal.value - removedCount);
if (post.value) {
post.value.commentCount = commentsTotal.value;
}
}
}
if (replyTargetId.value === comment.id) {
cancelReply(comment.id);
}
@@ -590,8 +653,24 @@ async function deleteComment(comment: LifeComment) {
}
}
async function restoreComment(comment: LifeComment) {
const key = replyKey(comment.id);
commentBusyKey.value = key;
clearCommentError(key);
try {
const restored = await api.restoreLifeComment(comment.id);
replaceCommentInTree(comments.value, restored);
comments.value = [...comments.value];
} catch (error) {
setCommentError(key, error instanceof Error && error.message ? error.message : t('pages.life.restoreCommentFailed'));
} finally {
commentBusyKey.value = '';
}
}
function commentAuthorName(comment: LifeComment) {
return comment.deleted ? t('pages.life.commentDeleted') : comment.author?.displayName ?? t('pages.life.byUnknown');
return comment.author?.displayName ?? t('pages.life.byUnknown');
}
function commentInitial(comment: LifeComment) {
@@ -781,7 +860,12 @@ onUnmounted(() => {
</div>
<div class="life-post__review-actions">
<StatusBadge :label="moderationLabel(post.moderationStatus)" :tone="moderationTone(post.moderationStatus)" compact />
<StatusBadge
v-if="moderationStatusVisible(post.moderationStatus)"
:label="moderationLabel(post.moderationStatus)"
:tone="moderationTone(post.moderationStatus)"
compact
/>
<button
v-if="canRetryModeration(post)"
class="life-icon-button life-review-button"
@@ -889,7 +973,7 @@ onUnmounted(() => {
<div class="life-comment__avatar" aria-hidden="true">{{ commentInitial(comment) }}</div>
<div class="life-comment__content">
<div class="life-comment__meta">
<RouterLink v-if="!comment.deleted && comment.author" class="user-profile-link" :to="`/profile/${comment.author.id}`">
<RouterLink v-if="comment.author" class="user-profile-link" :to="`/profile/${comment.author.id}`">
{{ comment.author.displayName }}
</RouterLink>
<strong v-else>{{ commentAuthorName(comment) }}</strong>
@@ -901,7 +985,7 @@ onUnmounted(() => {
compact
/>
</div>
<p v-if="!comment.deleted" class="life-comment__body">{{ comment.body }}</p>
<p class="life-comment__body">{{ comment.body }}</p>
<p
v-if="canSeeCommentModeration(comment) && moderationReasonVisible(comment.moderationStatus, comment.moderationReason)"
class="life-moderation-detail life-moderation-detail--comment"
@@ -910,9 +994,9 @@ onUnmounted(() => {
<span>{{ comment.moderationReason }}</span>
</p>
<div v-if="!comment.deleted" class="life-comment__actions">
<div v-if="!comment.deleted || canRestoreComment(comment)" class="life-comment__actions">
<button
v-if="canCommentOnPost"
v-if="!comment.deleted && canCommentOnPost"
class="life-icon-button life-icon-button--flat"
type="button"
:aria-label="t('pages.life.reply')"
@@ -931,6 +1015,17 @@ onUnmounted(() => {
<Icon :icon="iconDelete" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.deleteComment') }}</span>
</button>
<button
v-if="canRestoreComment(comment)"
class="life-icon-button life-icon-button--flat"
type="button"
:aria-label="t('pages.life.restoreComment')"
:disabled="isCommentBusy(replyKey(comment.id))"
@click="restoreComment(comment)"
>
<Icon :icon="iconUndo" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.restoreComment') }}</span>
</button>
</div>
<p v-if="commentErrors[replyKey(comment.id)]" class="life-form__error" role="alert">
@@ -977,7 +1072,7 @@ onUnmounted(() => {
<div class="life-comment__avatar" aria-hidden="true">{{ commentInitial(reply) }}</div>
<div class="life-comment__content">
<div class="life-comment__meta">
<RouterLink v-if="!reply.deleted && reply.author" class="user-profile-link" :to="`/profile/${reply.author.id}`">
<RouterLink v-if="reply.author" class="user-profile-link" :to="`/profile/${reply.author.id}`">
{{ reply.author.displayName }}
</RouterLink>
<strong v-else>{{ commentAuthorName(reply) }}</strong>
@@ -989,7 +1084,7 @@ onUnmounted(() => {
compact
/>
</div>
<p v-if="!reply.deleted" class="life-comment__body">{{ reply.body }}</p>
<p class="life-comment__body">{{ reply.body }}</p>
<p
v-if="canSeeCommentModeration(reply) && moderationReasonVisible(reply.moderationStatus, reply.moderationReason)"
class="life-moderation-detail life-moderation-detail--comment"
@@ -997,8 +1092,9 @@ onUnmounted(() => {
<strong>{{ t('pages.life.moderationReason') }}</strong>
<span>{{ reply.moderationReason }}</span>
</p>
<div v-if="canManageComment(reply)" class="life-comment__actions">
<div v-if="canManageComment(reply) || canRestoreComment(reply)" class="life-comment__actions">
<button
v-if="canManageComment(reply)"
class="life-icon-button life-icon-button--flat life-icon-button--danger"
type="button"
:aria-label="t('pages.life.deleteComment')"
@@ -1007,6 +1103,17 @@ onUnmounted(() => {
<Icon :icon="iconDelete" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.deleteComment') }}</span>
</button>
<button
v-if="canRestoreComment(reply)"
class="life-icon-button life-icon-button--flat"
type="button"
:aria-label="t('pages.life.restoreComment')"
:disabled="isCommentBusy(replyKey(reply.id))"
@click="restoreComment(reply)"
>
<Icon :icon="iconUndo" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.restoreComment') }}</span>
</button>
</div>
<p v-if="commentErrors[replyKey(reply.id)]" class="life-form__error" role="alert">
{{ commentErrors[replyKey(reply.id)] }}

117
frontend/src/views/LifeView.vue
View File

@@ -28,6 +28,7 @@ import {
iconReply,
iconSave,
iconSearch,
iconUndo,
iconVersion,
iconWarning
} from '../icons';
@@ -478,6 +479,10 @@ function canManageComment(comment: LifeComment) {
return !comment.deleted && ((currentUser.value?.id === comment.author?.id && can('life.comments.delete')) || can('life.comments.delete-any'));
}
function canRestoreComment(comment: LifeComment) {
return comment.deleted && currentUser.value?.id === comment.author?.id && can('life.comments.delete');
}
function canSeeCommentModeration(comment: LifeComment) {
return moderationStatusVisible(comment.moderationStatus) && (currentUser.value?.id === comment.author?.id || can('life.comments.delete-any'));
}
@@ -718,6 +723,25 @@ function mergeComments(existing: LifeComment[], incoming: LifeComment[]) {
return [...existing, ...incoming.filter((comment) => !ids.has(comment.id))];
}
function replaceCommentInTree(comments: LifeComment[], updated: LifeComment): boolean {
for (let index = 0; index < comments.length; index += 1) {
const comment = comments[index];
if (!comment) {
continue;
}
if (comment.id === updated.id) {
comments[index] = { ...updated, replies: comment.replies };
return true;
}
if (replaceCommentInTree(comment.replies, updated)) {
return true;
}
}
return false;
}
async function loadComments(post: LifePost, reset = false) {
const existing = commentPage(post);
if (existing.loading || existing.loadingMore || (!reset && existing.loaded && !existing.hasMore)) {
@@ -778,7 +802,7 @@ function isRatingBusy(postId: number) {
}
function commentAuthorName(comment: LifeComment) {
return comment.deleted ? t('pages.life.commentDeleted') : comment.author?.displayName ?? t('pages.life.byUnknown');
return comment.author?.displayName ?? t('pages.life.byUnknown');
}
function commentInitial(comment: LifeComment) {
@@ -1048,6 +1072,21 @@ function removeCommentFromTree(comments: LifeComment[], id: number): number {
return 0;
}
function markOwnCommentDeleted(comments: LifeComment[], id: number): boolean {
for (const comment of comments) {
if (comment.id === id) {
comment.deleted = true;
return true;
}
if (markOwnCommentDeleted(comment.replies, id)) {
return true;
}
}
return false;
}
async function deleteComment(post: LifePost, comment: LifeComment) {
if (!window.confirm(t('pages.life.deleteCommentConfirm'))) {
return;
@@ -1058,15 +1097,23 @@ async function deleteComment(post: LifePost, comment: LifeComment) {
try {
await api.deleteLifeComment(comment.id);
const removedCount = removeCommentFromTree(commentsForPost(post), comment.id);
if (removedCount > 0) {
const nextTotal = Math.max(0, commentCount(post) - removedCount);
post.commentCount = nextTotal;
if (currentUser.value?.id === comment.author?.id) {
markOwnCommentDeleted(commentsForPost(post), comment.id);
updateCommentPage(post, (page) => ({
...page,
items: [...page.items],
total: nextTotal
items: [...page.items]
}));
} else {
const removedCount = removeCommentFromTree(commentsForPost(post), comment.id);
if (removedCount > 0) {
const nextTotal = Math.max(0, commentCount(post) - removedCount);
post.commentCount = nextTotal;
updateCommentPage(post, (page) => ({
...page,
items: [...page.items],
total: nextTotal
}));
}
}
if (replyTargetId.value === comment.id) {
cancelReply(comment.id);
@@ -1076,6 +1123,25 @@ async function deleteComment(post: LifePost, comment: LifeComment) {
}
}
async function restoreComment(post: LifePost, comment: LifeComment) {
const key = replyKey(comment.id);
commentBusyKey.value = key;
clearCommentError(key);
try {
const restored = await api.restoreLifeComment(comment.id);
replaceCommentInTree(commentsForPost(post), restored);
updateCommentPage(post, (page) => ({
...page,
items: [...page.items]
}));
} catch (error) {
setCommentError(key, error instanceof Error && error.message ? error.message : t('pages.life.restoreCommentFailed'));
} finally {
commentBusyKey.value = '';
}
}
function formatPostTime(value: string) {
const date = new Date(value);
if (Number.isNaN(date.getTime())) {
@@ -1599,7 +1665,7 @@ onUnmounted(() => {
<div class="life-comment__avatar" aria-hidden="true">{{ commentInitial(comment) }}</div>
<div class="life-comment__content">
<div class="life-comment__meta">
<RouterLink v-if="!comment.deleted && comment.author" class="user-profile-link" :to="`/profile/${comment.author.id}`">
<RouterLink v-if="comment.author" class="user-profile-link" :to="`/profile/${comment.author.id}`">
{{ comment.author.displayName }}
</RouterLink>
<strong v-else>{{ commentAuthorName(comment) }}</strong>
@@ -1611,7 +1677,7 @@ onUnmounted(() => {
compact
/>
</div>
<p v-if="!comment.deleted" class="life-comment__body">{{ comment.body }}</p>
<p class="life-comment__body">{{ comment.body }}</p>
<p
v-if="canSeeCommentModeration(comment) && moderationReasonVisible(comment.moderationStatus, comment.moderationReason)"
class="life-moderation-detail life-moderation-detail--comment"
@@ -1620,9 +1686,9 @@ onUnmounted(() => {
<span>{{ comment.moderationReason }}</span>
</p>
<div v-if="!comment.deleted" class="life-comment__actions">
<div v-if="!comment.deleted || canRestoreComment(comment)" class="life-comment__actions">
<button
v-if="canComment"
v-if="!comment.deleted && canComment"
class="life-icon-button life-icon-button--flat"
type="button"
:aria-label="t('pages.life.reply')"
@@ -1641,6 +1707,17 @@ onUnmounted(() => {
<Icon :icon="iconDelete" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.deleteComment') }}</span>
</button>
<button
v-if="canRestoreComment(comment)"
class="life-icon-button life-icon-button--flat"
type="button"
:aria-label="t('pages.life.restoreComment')"
:disabled="isCommentBusy(replyKey(comment.id))"
@click="restoreComment(post, comment)"
>
<Icon :icon="iconUndo" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.restoreComment') }}</span>
</button>
</div>
<p v-if="commentErrors[replyKey(comment.id)]" class="life-form__error" role="alert">
@@ -1687,7 +1764,7 @@ onUnmounted(() => {
<div class="life-comment__avatar" aria-hidden="true">{{ commentInitial(reply) }}</div>
<div class="life-comment__content">
<div class="life-comment__meta">
<RouterLink v-if="!reply.deleted && reply.author" class="user-profile-link" :to="`/profile/${reply.author.id}`">
<RouterLink v-if="reply.author" class="user-profile-link" :to="`/profile/${reply.author.id}`">
{{ reply.author.displayName }}
</RouterLink>
<strong v-else>{{ commentAuthorName(reply) }}</strong>
@@ -1699,7 +1776,7 @@ onUnmounted(() => {
compact
/>
</div>
<p v-if="!reply.deleted" class="life-comment__body">{{ reply.body }}</p>
<p class="life-comment__body">{{ reply.body }}</p>
<p
v-if="canSeeCommentModeration(reply) && moderationReasonVisible(reply.moderationStatus, reply.moderationReason)"
class="life-moderation-detail life-moderation-detail--comment"
@@ -1707,8 +1784,9 @@ onUnmounted(() => {
<strong>{{ t('pages.life.moderationReason') }}</strong>
<span>{{ reply.moderationReason }}</span>
</p>
<div v-if="canManageComment(reply)" class="life-comment__actions">
<div v-if="canManageComment(reply) || canRestoreComment(reply)" class="life-comment__actions">
<button
v-if="canManageComment(reply)"
class="life-icon-button life-icon-button--flat life-icon-button--danger"
type="button"
:aria-label="t('pages.life.deleteComment')"
@@ -1717,6 +1795,17 @@ onUnmounted(() => {
<Icon :icon="iconDelete" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.deleteComment') }}</span>
</button>
<button
v-if="canRestoreComment(reply)"
class="life-icon-button life-icon-button--flat"
type="button"
:aria-label="t('pages.life.restoreComment')"
:disabled="isCommentBusy(replyKey(reply.id))"
@click="restoreComment(post, reply)"
>
<Icon :icon="iconUndo" class="ui-icon" aria-hidden="true" />
<span class="life-action-tooltip" role="tooltip">{{ t('pages.life.restoreComment') }}</span>
</button>
</div>
<p v-if="commentErrors[replyKey(reply.id)]" class="life-form__error" role="alert">
{{ commentErrors[replyKey(reply.id)] }}

4
system-wordings.ts
View File

@@ -909,10 +909,12 @@ export const systemWordingMessages = {
deleteComment: 'Delete comment',
deleteCommentConfirm: 'Delete this comment?',
commentDeleted: 'Comment deleted',
restoreComment: 'Undo',
commentRequired: 'Please enter a comment.',
commentFailed: 'Comment failed',
replyFailed: 'Reply failed',
deleteCommentFailed: 'Delete comment failed',
restoreCommentFailed: 'Undo failed',
publish: 'Post',
publishing: 'Posting',
update: 'Update',
@@ -2186,10 +2188,12 @@ export const systemWordingMessages = {
deleteComment: '删除评论',
deleteCommentConfirm: '确认删除这条评论？',
commentDeleted: '评论已删除',
restoreComment: '撤销',
commentRequired: '请输入评论内容。',
commentFailed: '评论失败',
replyFailed: '回复失败',
deleteCommentFailed: '删除评论失败',
restoreCommentFailed: '撤销失败',
publish: '发布',
publishing: '发布中',
update: '更新',