feat: 任务卡片任务编号增加一键复制功能

frontend/src/components/TaskCard.vue

@@ -19,7 +19,16 @@
     <div class="task-info">
       <div class="info-item">
         <span class="label">任务编号</span>
-        <span class="value">{{ task.taskNo }}</span>
+        <span class="value task-no-value">
+          {{ task.taskNo }}
+          <Icon 
+            name="copy" 
+            size="xs" 
+            class="copy-icon" 
+            @click.stop="handleCopyTaskNo(task.taskNo)"
+            title="复制任务编号"
+          />
+        </span>
       </div>
       <div class="info-item">
         <span class="label">任务类型</span>
@@ -125,6 +134,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue'
+import { message } from 'ant-design-vue'
 import Icon from './Icon.vue'
 import dayjs from 'dayjs'
 import { useConfigStore } from '@/stores/config'
@@ -245,6 +255,29 @@ const formatDate = (date?: string) => {
   if (!date) return '--'
   return dayjs(date).format('YYYY-MM-DD HH:mm')
 }
+
+// 复制任务编号
+const handleCopyTaskNo = async (taskNo: string) => {
+  try {
+    await navigator.clipboard.writeText(taskNo)
+    message.success('任务编号已复制')
+  } catch (error) {
+    // 降级方案：使用传统方法
+    const textarea = document.createElement('textarea')
+    textarea.value = taskNo
+    textarea.style.position = 'fixed'
+    textarea.style.opacity = '0'
+    document.body.appendChild(textarea)
+    textarea.select()
+    try {
+      document.execCommand('copy')
+      message.success('任务编号已复制')
+    } catch (e) {
+      message.error('复制失败')
+    }
+    document.body.removeChild(textarea)
+  }
+}
 </script>
 
 <style lang="scss" scoped>
@@ -312,6 +345,23 @@ const formatDate = (date?: string) => {
           color: #31f08b;
           font-weight: 600;
         }
+
+        &.task-no-value {
+          display: inline-flex;
+          align-items: center;
+          gap: 6px;
+
+          .copy-icon {
+            cursor: pointer;
+            opacity: 0.6;
+            transition: opacity 0.2s;
+
+            &:hover {
+              opacity: 1;
+              color: #31f08b;
+            }
+          }
+        }
       }
     }
   }

frontend/src/views/TaskHall.vue

@@ -379,6 +379,14 @@
               <div class="footer-item task-no-item">
                 <Icon name="hash" size="sm" color="#31f08b" />
                 <span style="color: #ffffff;">编号: {{ task.isSubTask ? task.itemNo : task.taskNo }}</span>
+                <Icon 
+                  name="copy" 
+                  size="xs" 
+                  class="copy-icon" 
+                  @click.stop="handleCopyTaskNo(task.isSubTask ? task.itemNo : task.taskNo)"
+                  title="复制任务编号"
+                  style="margin-left: 6px; cursor: pointer; opacity: 0.6; transition: opacity 0.2s;"
+                />
               </div>
             </div>
           </div>
@@ -1063,6 +1071,16 @@
                   <div class="footer-item task-no-item">
                     <Icon name="hash" size="sm" color="#31f08b" />
                     <span style="color: #ffffff;">编号: {{ task.isSubTask ? task.itemNo : task.taskNo }}</span>
+                    <Icon 
+                      name="copy" 
+                      size="xs" 
+                      class="copy-icon" 
+                      @click.stop="handleCopyTaskNo(task.isSubTask ? task.itemNo : task.taskNo)"
+                      title="复制任务编号"
+                      style="margin-left: 6px; cursor: pointer; opacity: 0.6; transition: opacity 0.2s;"
+                      @mouseenter="(e: any) => e.target.style.opacity = '1'"
+                      @mouseleave="(e: any) => e.target.style.opacity = '0.6'"
+                    />
                   </div>
                   <div class="footer-item">
                     <Icon name="calendar" size="sm" color="#31f08b" />
@@ -5920,6 +5938,20 @@ onUnmounted(() => {
     &.task-no-item {
       font-family: 'Monaco', 'Consolas', monospace;
       color: $text-secondary;
+      display: flex;
+      align-items: center;
+      gap: 6px;
+
+      .copy-icon {
+        cursor: pointer;
+        opacity: 0.6;
+        transition: opacity 0.2s, color 0.2s;
+
+        &:hover {
+          opacity: 1;
+          color: #31f08b;
+        }
+      }
     }
   }
 }