mirror of
https://github.com/snowykami/neo-blog.git
synced 2025-09-26 19:16:24 +00:00
feat: 添加帖子删除功能,允许用户删除帖子并更新帖子列表
This commit is contained in:
@ -58,6 +58,10 @@ export function PostManage() {
|
|||||||
setPosts((prev) => prev.map((p) => (p.id === post.id ? { ...p, ...post } : p)));
|
setPosts((prev) => prev.map((p) => (p.id === post.id ? { ...p, ...post } : p)));
|
||||||
}, [setPosts]);
|
}, [setPosts]);
|
||||||
|
|
||||||
|
const onPostDelete = useCallback(({ postId }: { postId: number }) => {
|
||||||
|
setPosts((prev) => prev.filter((p) => p.id !== postId));
|
||||||
|
}, [setPosts]);
|
||||||
|
|
||||||
const onOrderChange = useCallback(({ orderBy, desc }: { orderBy: OrderBy; desc: boolean }) => {
|
const onOrderChange = useCallback(({ orderBy, desc }: { orderBy: OrderBy; desc: boolean }) => {
|
||||||
setOrderBy(orderBy);
|
setOrderBy(orderBy);
|
||||||
setDesc(desc);
|
setDesc(desc);
|
||||||
@ -82,7 +86,7 @@ export function PostManage() {
|
|||||||
</div>
|
</div>
|
||||||
<Separator className="flex-1" />
|
<Separator className="flex-1" />
|
||||||
{posts.map(post => <div key={post.id}>
|
{posts.map(post => <div key={post.id}>
|
||||||
<PostItem post={post} onPostUpdate={onPostUpdate} />
|
<PostItem post={post} onPostUpdate={onPostUpdate} onPostDelete={onPostDelete}/>
|
||||||
<Separator className="flex-1" />
|
<Separator className="flex-1" />
|
||||||
</div>)}
|
</div>)}
|
||||||
<div className="flex justify-center items-center py-4">
|
<div className="flex justify-center items-center py-4">
|
||||||
@ -92,7 +96,7 @@ export function PostManage() {
|
|||||||
</div>;
|
</div>;
|
||||||
}
|
}
|
||||||
|
|
||||||
function PostItem({ post, onPostUpdate }: { post: Post, onPostUpdate?: ({ post }: { post: Partial<Post> & Pick<Post, "id"> }) => void }) {
|
function PostItem({ post, onPostUpdate, onPostDelete }: { post: Post, onPostUpdate: ({ post }: { post: Partial<Post> & Pick<Post, "id"> }) => void ,onPostDelete: ({ postId }: { postId: number }) => void}) {
|
||||||
const commonT = useTranslations("Common");
|
const commonT = useTranslations("Common");
|
||||||
const postT = useTranslations("Metrics");
|
const postT = useTranslations("Metrics");
|
||||||
const stateT = useTranslations("State");
|
const stateT = useTranslations("State");
|
||||||
@ -120,14 +124,14 @@ function PostItem({ post, onPostUpdate }: { post: Post, onPostUpdate?: ({ post }
|
|||||||
<Button variant="ghost" size="sm" onClick={() => clickToPost({ post })}>
|
<Button variant="ghost" size="sm" onClick={() => clickToPost({ post })}>
|
||||||
<Eye className="inline size-4 mr-1" />
|
<Eye className="inline size-4 mr-1" />
|
||||||
</Button>
|
</Button>
|
||||||
<PostDropdownMenu post={post} onPostUpdate={onPostUpdate} />
|
<PostDropdownMenu post={post} onPostUpdate={onPostUpdate} onPostDelete={onPostDelete}/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
function PostDropdownMenu({ post, onPostUpdate }: { post: Post, onPostUpdate?: ({ post }: { post: Partial<Post> & Pick<Post, "id"> }) => void }) {
|
function PostDropdownMenu({ post, onPostUpdate, onPostDelete }: { post: Post, onPostUpdate: ({ post }: { post: Partial<Post> & Pick<Post, "id"> }) => void, onPostDelete: ({ postId }: { postId: number }) => void }) {
|
||||||
const operationT = useTranslations("Operation");
|
const operationT = useTranslations("Operation");
|
||||||
const clickToPostEdit = useToEditPost();
|
const clickToPostEdit = useToEditPost();
|
||||||
const clickToPost = useToPost();
|
const clickToPost = useToPost();
|
||||||
@ -137,7 +141,7 @@ function PostDropdownMenu({ post, onPostUpdate }: { post: Post, onPostUpdate?: (
|
|||||||
updatePost({ post: { ...post, isPrivate: !post.isPrivate } })
|
updatePost({ post: { ...post, isPrivate: !post.isPrivate } })
|
||||||
.then(() => {
|
.then(() => {
|
||||||
toast.success(operationT("update_success"));
|
toast.success(operationT("update_success"));
|
||||||
onPostUpdate?.({ post: { id: post.id, isPrivate: !post.isPrivate } });
|
onPostUpdate({ post: { id: post.id, isPrivate: !post.isPrivate } });
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
toast.error(operationT("update_failed"));
|
toast.error(operationT("update_failed"));
|
||||||
@ -148,7 +152,7 @@ function PostDropdownMenu({ post, onPostUpdate }: { post: Post, onPostUpdate?: (
|
|||||||
deletePost({ id: post.id })
|
deletePost({ id: post.id })
|
||||||
.then(() => {
|
.then(() => {
|
||||||
toast.success(operationT("delete_success"));
|
toast.success(operationT("delete_success"));
|
||||||
onPostUpdate?.({ post: { id: post.id } });
|
onPostDelete({ postId: post.id });
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
toast.error(operationT("delete_failed"));
|
toast.error(operationT("delete_failed"));
|
||||||
|
Reference in New Issue
Block a user