添加复制时提示

src/components/chatui.vue

@@ -6,7 +6,7 @@
                 <div class="message-title">{{ `${msg.from.split('-')[0]} ${msg.timestampString}` }}</div>
                 <div class="message-text" v-if="msg.type1 === 'text'">
                     <span>{{ msg.msg }}</span>
-                    <n-icon :component="CopyOutline" class="message-text-copy" @click='toClipboard(msg.msg)' />
+                    <n-icon :component="CopyOutline" class="message-text-copy" @click='_toClipboard(msg.msg)' />
                 </div>
                 <div v-if="msg.type1 === 'img'">
                     <span>
@@ -59,8 +59,15 @@ import { decrypt, decryptString, downloadFromUint8Array } from '../func/download
 import { CubeOutline as DownloadIcon, CopyOutline } from '@vicons/ionicons5'
 import fileSize2String from '@/func/fileSize2String'
 import useClipboard from "vue-clipboard3";
+import { useMessage } from "naive-ui";
 
+const message = useMessage()
 const { toClipboard } = useClipboard();
+
+const _toClipboard = async (text) => {
+    await toClipboard(text)
+    message.info(`已复制 ${text.length < 10 ? text : text.substring(0,7) + '...'}`)
+}
 const setting = useSettingStore();
 const serverPort = setting.serverPort;
 const baseUrl = location.protocol + "//" + location.hostname + ":" + serverPort + "/";

src/views/chat.vue

@@ -3,7 +3,7 @@
         <n-flex style="padding-top: 10px;">
             <n-input v-model:value="groupCode" type="text" placeholder="输入邀请码" style="flex:1">
                 <template #suffix>
-                    <n-icon :component="CopyOutline" style="cursor: pointer;" @click='toClipboard(groupCode)' />
+                    <n-icon :component="CopyOutline" style="cursor: pointer;" @click='_toClipboard(groupCode)' />
                 </template>
             </n-input>
             <n-flex>
@@ -98,6 +98,11 @@ const message = useMessage()
 // const modal = useModal();
 const { toClipboard } = useClipboard();
 
+const _toClipboard = async (text) => {
+    await toClipboard(text)
+    message.info(`已复制 ${text.length < 10 ? text : text.substring(0,7) + '...'}`)
+}
+
 const setting = useSettingStore();
 const serverPort = setting.serverPort;
 const wsBaseUrl = 'ws' + "://" + location.hostname + ":" + serverPort;