coding:站点复制按钮功能

src/views/adv/promotionAccount/index.vue

@@ -437,6 +437,8 @@ export default {
       this.reset();
       this.isEdit = true;
       const id = row.id || this.ids[0];
+      // 修改时也需要加载广告商列表以确保 el-select 能正确回显名称而非 ID
+      this.getAdvertiserOptions();
       getPromotionAccount(id).then(response => {
         this.form = response.data;
         this.open = true;

src/views/adv/site/index.vue

@@ -506,14 +506,17 @@
           </div>
         </el-form-item>
         <el-form-item label="二维码">
-          <div id="qrcode" class="qrcode-container"></div>
-          <el-button 
-            type="primary" 
-            size="small"
-            icon="el-icon-download"
-            @click="downloadQrcode"
-            style="margin-top: 10px;"
-          >下载</el-button>
+          <div class="qrcode-wrapper">
+            <div id="qrcode" class="qrcode-container"></div>
+            <div class="qrcode-action">
+              <el-button 
+                type="primary" 
+                size="small"
+                icon="el-icon-download"
+                @click="downloadQrcode"
+              >下载二维码</el-button>
+            </div>
+          </div>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -647,6 +650,12 @@ export default {
             }, 
             trigger: "change" 
           }
+        ],
+        allocationRule: [
+          { required: true, message: "请选择企微分配规则", trigger: "change" }
+        ],
+        allocationRuleId: [
+          { required: true, message: "请选择具体的分配汇总规则", trigger: "change" }
         ]
       }
     };
@@ -885,18 +894,43 @@ export default {
         this.msgError('投放链接为空');
         return;
       }
-      navigator.clipboard.writeText(this.launchUrl).then(() => {
-        this.msgSuccess('复制成功');
-      }).catch(() => {
-        // 平台不支持新API，改成传统方法
+      
+      // 优先使用 Clipboard API
+      if (navigator.clipboard && navigator.clipboard.writeText) {
+        navigator.clipboard.writeText(this.launchUrl).then(() => {
+          this.msgSuccess('复制成功');
+        }).catch(err => {
+          console.error('Clipboard API 复制失败:', err);
+          this.fallbackCopyText(this.launchUrl);
+        });
+      } else {
+        // 环境不支持，使用传统方法
+        this.fallbackCopyText(this.launchUrl);
+      }
+    },
+    /** 传统复制方法 (Fallback) */
+    fallbackCopyText(text) {
+      try {
         const textarea = document.createElement('textarea');
-        textarea.value = this.launchUrl;
+        textarea.value = text;
+        // 确保 textarea 不可见且不影响布局
+        textarea.style.position = 'fixed';
+        textarea.style.left = '-9999px';
+        textarea.style.top = '0';
         document.body.appendChild(textarea);
         textarea.select();
-        document.execCommand('copy');
+        const successful = document.execCommand('copy');
         document.body.removeChild(textarea);
-        this.msgSuccess('复制成功');
-      });
+        
+        if (successful) {
+          this.msgSuccess('复制成功');
+        } else {
+          this.msgError('复制失败，请手动选择复制');
+        }
+      } catch (err) {
+        console.error('传统复制方法异常:', err);
+        this.msgError('复制异常');
+      }
     },
     /** 下载二维码 */
     downloadQrcode() {
@@ -1617,20 +1651,65 @@ export default {
   display: flex;
   gap: 10px;
   align-items: center;
+  background: #f8f9fa;
+  padding: 8px;
+  border-radius: 8px;
+  border: 1px solid #eef0f2;
   
   .url-input {
     flex: 1;
+    ::v-deep .el-input__inner {
+      background: transparent;
+      border-color: transparent;
+      font-family: monospace;
+      font-size: 13px;
+      color: #764ba2;
+    }
   }
 }
 
+.qrcode-wrapper {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 10px 0;
+  width: 100%;
+}
+
 .qrcode-container {
+  background: #fff;
+  padding: 15px;
+  border-radius: 12px;
+  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
+  border: 1px solid #f0f0f0;
+  margin-bottom: 15px;
   display: flex;
   justify-content: center;
-  padding: 20px 0;
+  align-items: center;
+  transition: all 0.3s ease;
+  
+  &:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
+  }
   
   canvas {
-    border: 1px solid #e0e0e0;
-    border-radius: 4px;
+    display: block;
+    max-width: 100%;
+  }
+}
+
+.qrcode-action {
+  .el-button {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    border: none;
+    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
+    
+    &:hover {
+      transform: translateY(-2px);
+      box-shadow: 0 6px 15px rgba(102, 126, 234, 0.4);
+    }
   }
 }
 </style>