fix: pat can not be copied (#5274)

#### What type of PR is this?

/area console
/kind bug
/milestone 2.12.x

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

修复创建 PAT 之后,点击复制按钮无法复制 token 的问题。

#### Which issue(s) this PR fixes:

Fixes #5273 

#### Special notes for your reviewer:

测试步骤:

1. 构建生产环境的 UC。
2. 创建 PAT,点击复制按钮,观察是否能够正常复制。

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

```release-note
修复创建 PAT 之后,点击复制按钮无法复制 token 的问题。
```
pull/3818/head^2
Ryan Wang 2024-01-29 17:25:12 +08:00 committed by GitHub
parent 47a1aa7631
commit e8a9f063f1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 9 additions and 15 deletions

View File

@ -7,7 +7,6 @@ import { Dialog, Toast, VButton, VModal, VSpace } from "@halo-dev/components";
import { useMutation, useQueryClient } from "@tanstack/vue-query"; import { useMutation, useQueryClient } from "@tanstack/vue-query";
import { useClipboard } from "@vueuse/core"; import { useClipboard } from "@vueuse/core";
import type { PatSpec, PersonalAccessToken } from "@halo-dev/api-client"; import type { PatSpec, PersonalAccessToken } from "@halo-dev/api-client";
import { computed } from "vue";
import { ref } from "vue"; import { ref } from "vue";
import { useRoleTemplateSelection } from "@/composables/use-role"; import { useRoleTemplateSelection } from "@/composables/use-role";
import { useRoleStore } from "@/stores/role"; import { useRoleStore } from "@/stores/role";
@ -49,11 +48,11 @@ const { permissions } = useRoleStore();
const { roleTemplateGroups, handleRoleTemplateSelect, selectedRoleTemplates } = const { roleTemplateGroups, handleRoleTemplateSelect, selectedRoleTemplates } =
useRoleTemplateSelection(toRefs(permissions).permissions); useRoleTemplateSelection(toRefs(permissions).permissions);
const { const { copy } = useClipboard({
mutate, legacy: true,
isLoading, });
data: token,
} = useMutation({ const { mutate, isLoading } = useMutation({
mutationKey: ["pat-creation"], mutationKey: ["pat-creation"],
mutationFn: async () => { mutationFn: async () => {
if (formState.value.spec?.expiresAt) { if (formState.value.spec?.expiresAt) {
@ -74,28 +73,23 @@ const {
queryClient.invalidateQueries({ queryKey: ["personal-access-tokens"] }); queryClient.invalidateQueries({ queryKey: ["personal-access-tokens"] });
emit("close"); emit("close");
const token = data.metadata.annotations?.[patAnnotations.ACCESS_TOKEN];
setTimeout(() => { setTimeout(() => {
Dialog.info({ Dialog.info({
title: t("core.uc_profile.pat.operations.copy.title"), title: t("core.uc_profile.pat.operations.copy.title"),
description: data.metadata.annotations?.[patAnnotations.ACCESS_TOKEN], description: token,
confirmType: "secondary", confirmType: "secondary",
confirmText: t("core.common.buttons.copy"), confirmText: t("core.common.buttons.copy"),
showCancel: false, showCancel: false,
onConfirm: () => { onConfirm: () => {
copy(); copy(token || "");
Toast.success(t("core.common.toast.copy_success")); Toast.success(t("core.common.toast.copy_success"));
}, },
}); });
}); });
}, },
}); });
const { copy } = useClipboard({
source: computed(
() => token.value?.metadata.annotations?.[patAnnotations.ACCESS_TOKEN] || ""
),
legacy: true,
});
</script> </script>
<template> <template>