From 02d986d25eea46cbbe019657848a26364e66bd32 Mon Sep 17 00:00:00 2001
From: Lazy <2211717435@qq.com>
Date: Mon, 17 Feb 2025 16:56:56 +0800
Subject: [PATCH 1/2] refactor: copy btn

---
 frontend/src/components/CopyButton.vue       | 22 ++-------------
 frontend/src/components/MyselfInfoDialog.vue |  2 +-
 frontend/src/tools/copy.ts                   | 29 ++++++++++++++++++++
 3 files changed, 32 insertions(+), 21 deletions(-)
 create mode 100644 frontend/src/tools/copy.ts

diff --git a/frontend/src/components/CopyButton.vue b/frontend/src/components/CopyButton.vue
index fcf967b2..91a692d5 100644
--- a/frontend/src/components/CopyButton.vue
+++ b/frontend/src/components/CopyButton.vue
@@ -1,39 +1,21 @@
 <script setup lang="ts">
 import { t } from "@/lang/i18n";
 import { CopyOutlined } from "@ant-design/icons-vue";
-import { Modal, message } from "ant-design-vue";
-import { reportErrorMsg } from "@/tools/validator";
 import type { ButtonType } from "ant-design-vue/es/button";
 import type { SizeType } from "ant-design-vue/es/config-provider";
-import { h } from "vue";
+import { toCopy } from "@/tools/copy";
 
 const props = defineProps<{
   size?: string;
   type?: string;
   value: string;
 }>();
-
-const copy = async () => {
-  if (!navigator.clipboard) {
-    Modal.warning({
-      title: t("TXT_CODE_ca07c84c"),
-      content: [h("span", t("TXT_CODE_2452016e")), h("br"), h("span", props.value)]
-    });
-    return;
-  }
-  try {
-    await navigator.clipboard.writeText(props.value);
-    message.success(t("TXT_CODE_b858d78a"));
-  } catch (error: any) {
-    reportErrorMsg(t("TXT_CODE_81b9b599") + error);
-  }
-};
 </script>
 
 <template>
   <a-tooltip>
     <template #title>{{ t("TXT_CODE_13ae6a93") }}</template>
-    <a-button :type="<ButtonType>type" :size="<SizeType>size" @click="copy">
+    <a-button :type="<ButtonType>type" :size="<SizeType>size" @click="toCopy(props.value)">
       <template #icon>
         <CopyOutlined />
       </template>
diff --git a/frontend/src/components/MyselfInfoDialog.vue b/frontend/src/components/MyselfInfoDialog.vue
index beccbc6d..295c6238 100644
--- a/frontend/src/components/MyselfInfoDialog.vue
+++ b/frontend/src/components/MyselfInfoDialog.vue
@@ -10,6 +10,7 @@ import type { FormInstance } from "ant-design-vue";
 import CopyButton from "@/components/CopyButton.vue";
 import { bind2FA } from "../services/apis/user";
 import { PERMISSION_MAP } from "@/config/const";
+import { toCopy } from "@/tools/copy";
 const { state, updateUserInfo } = useAppStateStore();
 const { state: tools } = useAppToolsStore();
 
@@ -176,7 +177,6 @@ const disable2FACode = async () => {
             </a-button>
           </div>
         </a-form-item>
-
         <a-form-item label="APIKEY">
           <a-typography-paragraph>
             {{ t("TXT_CODE_b2dbf778") }}
diff --git a/frontend/src/tools/copy.ts b/frontend/src/tools/copy.ts
new file mode 100644
index 00000000..8807d624
--- /dev/null
+++ b/frontend/src/tools/copy.ts
@@ -0,0 +1,29 @@
+import { t } from "@/lang/i18n";
+import { useClipboard } from "@vueuse/core";
+import { message, Modal } from "ant-design-vue";
+import { h } from "vue";
+
+const { copy, copied, isSupported } = useClipboard();
+
+export const toCopy = async (sth: string | number) => {
+  try {
+    if (!isSupported.value) {
+      const input = document.createElement("input");
+      input.setAttribute("value", String(sth));
+      document.body.appendChild(input);
+      input.select();
+      document.execCommand("copy");
+      document.body.removeChild(input);
+      return message.success(t("TXT_CODE_b858d78a"));
+    } else {
+      await copy(String(sth));
+      if (copied.value) return message.success(t("TXT_CODE_b858d78a"));
+    }
+  } catch (err: any) {
+    console.error(err);
+    Modal.warning({
+      title: t("TXT_CODE_ca07c84c"),
+      content: [h("span", t("TXT_CODE_2452016e")), h("br"), h("span", sth)]
+    });
+  }
+};

From c1285cdb10dd7ce4adc39385ade6421885d64492 Mon Sep 17 00:00:00 2001
From: Lazy <2211717435@qq.com>
Date: Mon, 17 Feb 2025 17:08:48 +0800
Subject: [PATCH 2/2] opt: show details

---
 frontend/src/widgets/instance/BaseInfo.vue | 8 ++++++--
 frontend/src/widgets/node/NodeItem.vue     | 2 +-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/frontend/src/widgets/instance/BaseInfo.vue b/frontend/src/widgets/instance/BaseInfo.vue
index d3c8b158..dc0b4354 100644
--- a/frontend/src/widgets/instance/BaseInfo.vue
+++ b/frontend/src/widgets/instance/BaseInfo.vue
@@ -158,9 +158,13 @@ onMounted(async () => {
         </span>
       </a-typography-paragraph>
       <a-typography-paragraph>
-        <a-typography-text> {{ t("TXT_CODE_30051f9b") }} </a-typography-text>
+        <a-typography-text :title="instanceInfo?.instanceUuid">
+          {{ t("TXT_CODE_30051f9b") }}
+        </a-typography-text>
         <a-typography-text :copyable="{ text: instanceInfo?.instanceUuid }"> </a-typography-text>
-        <a-typography-text class="ml-20"> {{ t("TXT_CODE_5f2d2e30") }} </a-typography-text>
+        <a-typography-text class="ml-20" :title="daemonId">
+          {{ t("TXT_CODE_5f2d2e30") }}
+        </a-typography-text>
         <a-typography-text :copyable="{ text: daemonId }"> </a-typography-text>
       </a-typography-paragraph>
     </template>
diff --git a/frontend/src/widgets/node/NodeItem.vue b/frontend/src/widgets/node/NodeItem.vue
index f5a5c340..e08a16c9 100644
--- a/frontend/src/widgets/node/NodeItem.vue
+++ b/frontend/src/widgets/node/NodeItem.vue
@@ -228,7 +228,7 @@ onMounted(() => {
             :span="6"
           >
             <a-typography-paragraph>
-              <div>
+              <div :title="detail.onlyCopy ? detail.value : ''">
                 {{ detail.title }}
               </div>