docs: make comment and reply list item operations extendable (#393)

```release-note
None
```
main
困困鱼 3 months ago committed by GitHub
parent 1add3ef3dd
commit 4a53db88f4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -0,0 +1,81 @@
---
title: 评论数据列表操作菜单
description: 扩展评论数据列表操作菜单 - comment:list-item:operation:create
---
此扩展点用于扩展评论数据列表的操作菜单项。
![评论数据列表操作菜单](/img/developer-guide/plugin/api-reference/ui/extension-points/comment-list-item-operation-create.png)
## 定义方式
```ts
export default definePlugin({
extensionPoints: {
"comment:list-item:operation:create": (
comment: Ref<ListedComment>
): OperationItem<ListedComment>[] | Promise<OperationItem<ListedComment>[]> => {
return [
{
priority: 10,
component: markRaw(VDropdownItem),
props: {},
action: (item?: ListedComment) => {
// do something
},
label: "foo",
hidden: false,
permissions: [],
children: [],
},
];
},
},
});
```
```mdx-code-block
import OperationItem from "./interface/OperationItem.md";
<OperationItem />
```
## 示例
此示例将实现一个操作菜单项。
```ts
import type { ListedComment } from "@halo-dev/api-client";
import { VDropdownItem } from "@halo-dev/components";
import { definePlugin } from "@halo-dev/console-shared";
import { markRaw } from "vue";
export default definePlugin({
extensionPoints: {
"comment:list-item:operation:create": () => {
return [
{
priority: 21,
component: markRaw(VDropdownItem),
label: "测试评论菜单",
visible: true,
permissions: [],
action: async (comment: ListedComment) => {
console.log(comment)
},
},
];
},
},
});
```
## 类型定义
### ListedComment
```mdx-code-block
import ListedComment from "./interface/ListedComment.md";
<ListedComment />
```

@ -0,0 +1,64 @@
```ts
export interface ListedComment {
comment:{
apiVersion: "content.halo.run/v1alpha1"
kind: "Comment"
metadata: {
annotations: {}
creationTimestamp: string
labels: {}
name: string // 评论的唯一标识
version: number
}
spec: {
allowNotification: boolean; // 是否允许通知
approved: boolean;
approvedTime: string;
content: string; // 最终渲染的文本
creationTime: string; // 创建时间
hidden: boolean;
ipAddress: string; // 评论者 IP 地址
lastReadTime: string;
owner: { // 创建者信息
annotations: {};
displayName: string;
kind: string;
name: string;
};
priority: number; // 排序字段
raw: string; // 原始文本,一般用于给编辑器使用
subjectRef: { // 引用关联,比如文章、自定义页面
group: string;
kind: string;
name: string;
version: string;
};
top: boolean; // 是否置顶
userAgent: string; // 评论者 UserAgent 信息
}
status: {
hasNewReply: boolean; // 是否有新回复
lastReplyTime: string;
observedVersion: number;
replyCount: number; // 回复数量
unreadReplyCount: number;
visibleReplyCount: number;
}
}
owner: { // 创建者信息
avatar: string; // 头像
displayName: string; // 描述
email: string; // 邮箱
kind: string;
name: string; // 创建者的唯一标识
}
stats: {
upvote: number;
}
subject: {
apiVersion: string;
kind: string;
metadata: Metadata;
}
}
```

@ -0,0 +1,49 @@
```ts
export interface ListedReply {
owner: { // 创建者信息
avatar: string; // 头像
displayName: string; // 描述
email: string; // 邮箱
kind: string;
name: string; // 创建者的唯一标识
}
reply:{
apiVersion: "content.halo.run/v1alpha1"
kind: "Reply"
metadata: {
annotations: {}
creationTimestamp: string
labels: {}
name: string // 评论的唯一标识
version: number
}
spec: {
allowNotification: boolean; // 是否允许通知
approved: boolean;
approvedTime: string;
commentName: string; // 被回复的评论名称,即 Comment 的 metadata.name
content: string; // 最终渲染的文本
creationTime: string; // 创建时间
hidden: boolean;
ipAddress: string; // 评论者 IP 地址
owner: { // 创建者信息
annotations: {};
displayName: string;
kind: string;
name: string;
};
priority: number; // 排序字段
quoteReply: string; // 被回复的回复名称,即 Reply 的 metadata.name
raw: string; // 原始文本,一般用于给编辑器使用
top: boolean; // 是否置顶
userAgent: string; // 评论者 UserAgent 信息
}
status: {
observedVersion: number;
}
}
stats: {
upvote: number;
}
}
```

@ -0,0 +1,81 @@
---
title: 回复数据列表操作菜单
description: 扩展回复数据列表操作菜单 - reply:list-item:operation:create
---
此扩展点用于扩展回复数据列表的操作菜单项。
![回复数据列表操作菜单](/img/developer-guide/plugin/api-reference/ui/extension-points/reply-list-item-operation-create.png)
## 定义方式
```ts
export default definePlugin({
extensionPoints: {
"reply:list-item:operation:create": (
reply: Ref<ListedReply>
): OperationItem<ListedReply>[] | Promise<OperationItem<ListedReply>[]> => {
return [
{
priority: 10,
component: markRaw(VDropdownItem),
props: {},
action: (item?: ListedReply) => {
// do something
},
label: "foo",
hidden: false,
permissions: [],
children: [],
},
];
},
},
});
```
```mdx-code-block
import OperationItem from "./interface/OperationItem.md";
<OperationItem />
```
## 示例
此示例将实现一个操作菜单项。
```ts
import type { ListedReply } from "@halo-dev/api-client";
import { VDropdownItem } from "@halo-dev/components";
import { definePlugin } from "@halo-dev/console-shared";
import { markRaw } from "vue";
export default definePlugin({
extensionPoints: {
"reply:list-item:operation:create": () => {
return [
{
priority: 21,
component: markRaw(VDropdownItem),
label: "测试回复菜单",
visible: true,
permissions: [],
action: async (reply: ListedReply) => {
console.log(reply)
},
},
];
},
},
});
```
## 类型定义
### ListedReply
```mdx-code-block
import ListedReply from "./interface/ListedReply.md";
<ListedReply />
```

@ -235,6 +235,8 @@ module.exports = {
"developer-guide/plugin/api-reference/ui/extension-points/plugin-installation-tabs-create",
"developer-guide/plugin/api-reference/ui/extension-points/theme-list-tabs-create",
"developer-guide/plugin/api-reference/ui/extension-points/post-list-item-operation-create",
"developer-guide/plugin/api-reference/ui/extension-points/comment-list-item-operation-create",
"developer-guide/plugin/api-reference/ui/extension-points/reply-list-item-operation-create",
"developer-guide/plugin/api-reference/ui/extension-points/plugin-list-item-operation-create",
"developer-guide/plugin/api-reference/ui/extension-points/backup-list-item-operation-create",
"developer-guide/plugin/api-reference/ui/extension-points/attachment-list-item-operation-create",

@ -215,6 +215,7 @@ postFinder.listByTag(page, size, tag);
</li>
</ul>
```
## listByOwner(page,size,owner)
```js

Loading…
Cancel
Save