feat(project): 增加剪贴板复制功能

mock/module/user.ts

@@ -214,6 +214,15 @@ const userRoutes = [
           },
         ],
       },
+      {
+        name: 'plugin_clipboard',
+        path: '/plugin/clipboard',
+        meta: {
+          title: '剪贴板',
+          requiresAuth: true,
+          icon: 'icon-park-outline:clipboard',
+        },
+      },
     ],
   },
   {

src/views/plugin/clipboard/index.vue

@@ -0,0 +1,34 @@
+<template>
+  <n-card>
+    <n-input-group>
+      <n-input v-model:value="text" />
+      <n-button type="primary" @click="handleCopy">复制</n-button>
+    </n-input-group>
+  </n-card>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+
+const text = ref('Hello Clipboard');
+
+function handleCopy() {
+  if (!navigator.clipboard) {
+    window.$message?.error('当前浏览器不支持复制！');
+  }
+  if (!text.value) {
+    window.$message?.error('请输入要复制的内容');
+    return;
+  }
+  navigator.clipboard.writeText(text.value).then(
+    (res) => {
+      window.$message?.success(`复制成功：${text.value}`);
+    },
+    (err) => {
+      window.$message?.error('复制失败');
+    },
+  );
+}
+</script>
+
+<style scoped></style>