增加人工渠道

apps/frontend/src/components/tencent/TencentAuthCard.vue

@@ -13,6 +13,8 @@ const props = defineProps<{
   loginTabs: LoginTab[]
   loginType: TencentLoginType
   loginTypeLabel: string
+  qrCopyButtonLabel?: string
+  qrCopyEnabled?: boolean
   qrFigureStyle: { width: string; maxWidth: string }
   qrImage: string
   scanInstruction: string
@@ -24,6 +26,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   closeSession: []
+  copyQr: []
   createSession: [loginType: TencentLoginType]
   openQrPreview: []
   qrImageLoad: [event: Event]
@@ -53,6 +56,7 @@ const emit = defineEmits<{
         :style="props.qrFigureStyle"
         type="button"
         @click="emit('openQrPreview')"
+        @dblclick.prevent.stop="emit('copyQr')"
       >
         <img
           :src="props.qrImage"
@@ -91,6 +95,12 @@ const emit = defineEmits<{
       <p class="scan-hint">
         {{ props.hasSession ? props.scanInstruction : `已选择${props.loginTypeLabel}，等待开始初始化` }}
       </p>
+      <p
+        v-if="props.qrCopyEnabled && props.qrImage && props.sessionStatus === 'waiting_scan'"
+        class="scan-tip"
+      >
+        双击二维码可直接复制到剪贴板，也可以使用下方按钮复制。
+      </p>
       <p class="scan-note">
         {{
           props.sessionNotice ||
@@ -118,6 +128,17 @@ const emit = defineEmits<{
           {{ props.hasSession ? '重新生成二维码' : props.initButtonLabel }}
         </el-button>
 
+        <el-button
+          v-if="props.qrCopyEnabled"
+          :disabled="!props.qrImage || props.sessionStatus !== 'waiting_scan'"
+          :loading="props.sessionLoading"
+          class="copy-action"
+          size="large"
+          @click="emit('copyQr')"
+        >
+          {{ props.qrCopyButtonLabel || '复制二维码' }}
+        </el-button>
+
         <div class="secondary-actions">
           <el-button
             :disabled="!props.hasSession"
@@ -308,6 +329,13 @@ const emit = defineEmits<{
   line-height: 1.7;
 }
 
+.scan-tip {
+  margin: 8px 0 0;
+  color: #2859b8;
+  line-height: 1.6;
+  font-size: 13px;
+}
+
 .auth-footer {
   margin-top: auto;
   padding-top: 20px;
@@ -374,6 +402,7 @@ const emit = defineEmits<{
 }
 
 .primary-action,
+.copy-action,
 .secondary-action,
 .tertiary-action {
   min-width: 0;
@@ -389,6 +418,7 @@ const emit = defineEmits<{
 }
 
 .action-row :deep(.secondary-action.el-button),
+.action-row :deep(.copy-action.el-button),
 .action-row :deep(.tertiary-action.el-button) {
   background: rgba(248, 251, 255, 0.98);
   border: 1px solid #d9e4f2;
@@ -396,6 +426,8 @@ const emit = defineEmits<{
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
 }
 
+.action-row :deep(.copy-action.el-button:hover),
+.action-row :deep(.copy-action.el-button:focus-visible),
 .action-row :deep(.secondary-action.el-button:hover),
 .action-row :deep(.secondary-action.el-button:focus-visible) {
   border-color: #9dc0f6;
@@ -410,6 +442,7 @@ const emit = defineEmits<{
   background: #fff6f6;
 }
 
+.action-row :deep(.copy-action.el-button.is-disabled),
 .action-row :deep(.secondary-action.el-button.is-disabled),
 .action-row :deep(.tertiary-action.el-button.is-disabled) {
   background: #f8fafc;