feat: make backup list item operations extendable (#4508)

#### What type of PR is this?

/area console
/kind feature
/milestone 2.9.x

#### What this PR does / why we need it:

备份列表的操作列表支持被插件扩展。

#### Does this PR introduce a user-facing change?

```release-note
Console 端的备份列表的操作按钮列表支持扩展。
```

console/docs/extension-points/entity-listitem-operation.md

@@ -10,6 +10,7 @@
 
 - 文章：`"post:list-item:operation:create"?: () => | EntityDropdownItem<ListedPost>[] | Promise<EntityDropdownItem<ListedPost>[]>`
 - 插件：`"plugin:list-item:operation:create"?: () => | EntityDropdownItem<Plugin>[] | Promise<EntityDropdownItem<Plugin>[]>`
+- 备份：`"backup:list-item:operation:create"?: () => | EntityDropdownItem<Backup>[] | Promise<EntityDropdownItem<Backup>[]>`
 
 示例：
 

console/packages/shared/src/types/plugin.ts

@@ -8,7 +8,7 @@ import type { CommentSubjectRefProvider } from "@/states/comment-subject-ref";
 import type { BackupTab } from "@/states/backup";
 import type { PluginInstallationTab } from "@/states/plugin-installation-tabs";
 import type { EntityDropdownItem } from "@/states/entity";
-import type { ListedPost, Plugin } from "@halo-dev/api-client";
+import type { Backup, ListedPost, Plugin } from "@halo-dev/api-client";
 
 export interface RouteRecordAppend {
   parentName: RouteRecordName;
@@ -46,6 +46,10 @@ export interface ExtensionPoint {
   "plugin:list-item:operation:create"?: () =>
     | EntityDropdownItem<Plugin>[]
     | Promise<EntityDropdownItem<Plugin>[]>;
+
+  "backup:list-item:operation:create"?: () =>
+    | EntityDropdownItem<Backup>[]
+    | Promise<EntityDropdownItem<Backup>[]>;
 }
 
 export interface PluginModule {

console/src/modules/system/backup/components/BackupListItem.vue

@@ -10,11 +10,13 @@ import {
 } from "@halo-dev/components";
 import type { Backup } from "@halo-dev/api-client";
 import { relativeTimeTo, formatDatetime } from "@/utils/date";
-import { computed } from "vue";
+import { computed, markRaw } from "vue";
 import { apiClient } from "@/utils/api-client";
 import { useQueryClient } from "@tanstack/vue-query";
 import prettyBytes from "pretty-bytes";
 import { useI18n } from "vue-i18n";
+import { useEntityDropdownItemExtensionPoint } from "@/composables/use-entity-extension-points";
+import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
 
 const queryClient = useQueryClient();
 const { t } = useI18n();
@@ -94,6 +96,30 @@ function handleDelete() {
     },
   });
 }
+
+const { dropdownItems } = useEntityDropdownItemExtensionPoint<Backup>(
+  "backup:list-item:operation:create",
+  [
+    {
+      priority: 10,
+      component: markRaw(VDropdownItem),
+      label: t("core.common.buttons.download"),
+      visible: props.backup.status?.phase === "SUCCEEDED",
+      permissions: [],
+      action: () => handleDownload(),
+    },
+    {
+      priority: 20,
+      component: markRaw(VDropdownItem),
+      props: {
+        type: "danger",
+      },
+      label: t("core.common.buttons.delete"),
+      visible: true,
+      action: () => handleDelete(),
+    },
+  ]
+);
 </script>
 
 <template>
@@ -157,15 +183,7 @@ function handleDelete() {
       </VEntityField>
     </template>
     <template #dropdownItems>
-      <VDropdownItem
-        v-if="backup.status?.phase === 'SUCCEEDED'"
-        @click="handleDownload"
-      >
-        {{ $t("core.common.buttons.download") }}
-      </VDropdownItem>
-      <VDropdownItem type="danger" @click="handleDelete">
-        {{ $t("core.common.buttons.delete") }}
-      </VDropdownItem>
+      <EntityDropdownItems :dropdown-items="dropdownItems" :item="backup" />
     </template>
   </VEntity>
 </template>