From 5b1c03235344806ba9c4e2ac80a783b3e65f26b6 Mon Sep 17 00:00:00 2001
From: Jason <5340635+wen-jason@user.noreply.gitee.com>
Date: Fri, 16 Sep 2022 10:18:51 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=A4=8D=E5=88=B6=E8=87=AA?=
 =?UTF-8?q?=E5=AE=9A=E4=B9=89=E6=8C=87=E4=BB=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 admin/src/install/directives/copy.ts | 28 ++++++++++++++++++++++++++++
 admin/src/views/channel/h5.vue       |  5 ++---
 2 files changed, 30 insertions(+), 3 deletions(-)
 create mode 100644 admin/src/install/directives/copy.ts

diff --git a/admin/src/install/directives/copy.ts b/admin/src/install/directives/copy.ts
new file mode 100644
index 00000000..c0b1909c
--- /dev/null
+++ b/admin/src/install/directives/copy.ts
@@ -0,0 +1,28 @@
+/**
+ * perm 操作权限处理
+ * 指令用法：
+ *  <el-button v-perms="['auth.menu/edit']">编辑</el-button>
+ */
+
+import feedback from '@/utils/feedback'
+import useClipboard from 'vue-clipboard3'
+const clipboard = 'data-clipboard-text'
+export default {
+    mounted: (el: HTMLElement, binding: any) => {
+        el.setAttribute(clipboard, binding.value)
+        const { toClipboard } = useClipboard()
+
+        el.onclick = () => {
+            toClipboard(el.getAttribute(clipboard)!)
+                .then(() => {
+                    feedback.msgSuccess('复制成功')
+                })
+                .catch(() => {
+                    feedback.msgError('复制失败')
+                })
+        }
+    },
+    updated: (el: HTMLElement, binding: any) => {
+        el.setAttribute(clipboard, binding.value)
+    }
+}
diff --git a/admin/src/views/channel/h5.vue b/admin/src/views/channel/h5.vue
index a98d45f5..efbdfe47 100644
--- a/admin/src/views/channel/h5.vue
+++ b/admin/src/views/channel/h5.vue
@@ -27,7 +27,7 @@
                 </el-form-item>
                 <el-form-item label="访问链接">
                     <div>{{ formData.accessLink }}</div>
-                    <el-button class="ml-4" @click="copy(formData.accessLink)">复制</el-button>
+                    <el-button class="ml-4" v-copy="formData.accessLink">复制</el-button>
                 </el-form-item>
             </el-form>
         </el-card>
@@ -39,7 +39,6 @@
 <script lang="ts" setup>
 import { getH5Config, setH5Config } from '@/api/channel/h5'
 import feedback from '@/utils/feedback'
-import { useClipboard } from '@vueuse/core'
 
 const formData = reactive({
     status: 0,
@@ -48,7 +47,7 @@ const formData = reactive({
     accessLink: ''
 })
 
-const { copy } = useClipboard()
+// const { copy } = useClipboard()
 const getDetail = async () => {
     const data = await getH5Config()
     for (const key in formData) {