复制id功能

src/views/server/employeehosts/index.vue

@@ -115,6 +115,12 @@
             {{ scope.row.hostsId }}</div>
         </template>
       </el-table-column>
+      <el-table-column align="center" prop="hostsId" width="75">
+        <template #default="scope">
+          <el-link type="primary" @click="handleCopy(scope.row.hostsId)">复制</el-link>
+        </template>
+
+      </el-table-column>
       <el-table-column :label="$t('employee.hostsLevel')" align="center" prop="hostsLevel" />
       <el-table-column :label="$t('employee.invitationType')" align="center" prop="invitationType">
         <template #default="scope">
@@ -151,9 +157,12 @@
     <!-- ✅ 移动端使用卡片列表 -->
     <div v-else v-infinite-scroll="loadList">
       <div v-for="(item, index) in list" :key="index" class="mobile-card">
-        <div class="card-row" @click="openHtml(item, item.hostsId)" style="color:green;">
-          <b>{{ $t('employee.hostsId') }}：</b><span style=" text-decoration: underline;">{{ item.hostsId }}</span>
+        <div class="card-row" style="color:green;">
+          <b>{{ $t('employee.hostsId') }}：</b><span @click="openHtml(item, item.hostsId)"
+            style=" text-decoration: underline;margin-right: 50px;">{{ item.hostsId }}</span>
+          <el-link @click="handleCopy(item.hostsId)" type="primary">复制id</el-link>
         </div>
+
         <!-- <div class="card-row"><b>{{ $t('employee.userId') }}：</b>{{ item.userId }}</div> -->
         <div class="card-row"><b>{{ $t('employee.hostsLevel') }}：</b>{{ item.hostsLevel }}</div>
         <div class="card-row"><b>{{ $t('employee.hostsCoins') }}：</b>{{ item.hostsCoins }}</div>
@@ -426,6 +435,29 @@ function AllocationFun() {
   console.log(selectHostList.value)
 }
 
+function handleCopy(text) {
+  // fallback 兼容方案
+  const textarea = document.createElement('textarea')
+  textarea.value = text
+  textarea.style.position = 'fixed' // 避免跳动
+  textarea.style.opacity = '0'
+  document.body.appendChild(textarea)
+  textarea.select()
+  try {
+    const result = document.execCommand('copy')
+    if (result) {
+      ElMessage.success('✅复制成功 ')
+    } else {
+      ElMessage.error('❌复制失败')
+    }
+  } catch (err) {
+    ElMessage.error('❌复制异常')
+    console.error(err)
+  } finally {
+    document.body.removeChild(textarea)
+  }
+}
+
 const isMobile = ref(window.innerWidth <= 768)
 
 onMounted(() => {