Quellcode durchsuchen

feat(gameEvent): 添加赛事大屏链接复制功能

- 在生产环境配置中添加大屏URL前缀配置项VITE_APP_LARGE_SCREEN_URL
- 在赛事事件表格操作列中新增"大屏"按钮,用于复制大屏链接
- 实现handleCopyLargeScreenUrl方法,支持复制带赛事ID参数的大屏链接
- 提供现代浏览器和兼容性两种复制方案,确保链接复制功能正常工作
- 移除操作按钮上的tooltip提示,简化界面显示
zhou vor 8 Stunden
Ursprung
Commit
3bdd100d0f
2 geänderte Dateien mit 34 neuen und 6 gelöschten Zeilen
  1. 3 0
      .env.production
  2. 31 6
      src/views/system/gameEvent/index.vue

+ 3 - 0
.env.production

@@ -36,3 +36,6 @@ VITE_APP_WEBSOCKET = false
 
 # sse 开关
 VITE_APP_SSE = true
+
+# 赛事大屏前缀
+VITE_APP_LARGE_SCREEN_URL = 'https://meet3.sportsrobo.club'

+ 31 - 6
src/views/system/gameEvent/index.vue

@@ -108,12 +108,9 @@
         <!-- 第二列:操作列 -->
         <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
           <template #default="scope">
-            <el-tooltip content="修改" placement="top">
-              <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:gameEvent:edit']"> 修改 </el-button>
-            </el-tooltip>
-            <el-tooltip content="生成赛事链接" placement="top">
-              <el-button link type="warning" icon="Edit" @click="handleUpdateCode(scope.row)" v-hasPermi="['system:gameEvent:edit']"> 生成赛事码 </el-button>
-            </el-tooltip>
+            <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:gameEvent:edit']"> 修改 </el-button>
+            <el-button link type="primary" icon="loading" @click="handleUpdateCode(scope.row)" v-hasPermi="['system:gameEvent:edit']"> 赛事码 </el-button>
+            <el-button link type="warning" icon="link" @click="handleCopyLargeScreenUrl(scope.row)" v-hasPermi="['system:gameEvent:query']"> 大屏 </el-button>
           </template>
         </el-table-column>
         <el-table-column label="序号" align="center" type="index" />
@@ -431,6 +428,34 @@ const handleUpdateCode = async (row?: GameEventVO) => {
   await getList();
 };
 
+/** 复制大屏链接按钮操作 */
+const handleCopyLargeScreenUrl = (row: GameEventVO) => {
+  const largeScreenPrefix = import.meta.env.VITE_APP_LARGE_SCREEN_URL || 'http://localhost:5173/';
+  const url = `${largeScreenPrefix}?tournament_id=${row.eventId}`;
+  
+  if (navigator.clipboard && navigator.clipboard.writeText) {
+    navigator.clipboard.writeText(url).then(() => {
+      proxy?.$modal.msgSuccess('大屏链接已成功复制到剪贴板');
+    }).catch((err) => {
+      console.error('复制失败:', err);
+      proxy?.$modal.msgError('复制链接失败,请重试');
+    });
+  } else {
+    // 兼容性回退方案
+    const input = document.createElement('input');
+    input.setAttribute('value', url);
+    document.body.appendChild(input);
+    input.select();
+    try {
+      document.execCommand('copy');
+      proxy?.$modal.msgSuccess('大屏链接已成功复制到剪贴板');
+    } catch (err) {
+      proxy?.$modal.msgError('复制链接失败,请手动复制');
+    }
+    document.body.removeChild(input);
+  }
+};
+
 /** 提交按钮 */
 const submitForm = () => {
   gameEventFormRef.value?.validate(async (valid: boolean) => {