Compare commits

..

2 Commits

10 changed files with 140 additions and 42 deletions

View File

@@ -6,7 +6,7 @@ import http from '@/plugins/http'
// 获取链接状态 // 获取链接状态
export function getLinkStatus(code) { export function getLinkStatus(code) {
return http.get(`/api/link/status?t=${Date.now()}`, { return http.get('/api/link/status', {
params: { code } params: { code }
}) })
} }
@@ -34,12 +34,12 @@ export function pollLoginStatus(code) {
// 获取游戏界面数据 // 获取游戏界面数据
export function getGameInterface(code) { export function getGameInterface(code) {
return http.get(`/api/link/${code}/game-interface?t=${Date.now()}`) return http.get(`/api/link/${code}/game-interface`)
} }
// 获取二维码图片(可选,用于代理二维码避免混合内容问题) // 获取二维码图片(可选,用于代理二维码避免混合内容问题)
export function getQRCode(code) { export function getQRCode(code) {
return http.get(`/api/link/qr.png?t=${Date.now()}`, { return http.get('/api/link/qr.png', {
params: { code }, params: { code },
responseType: 'blob' responseType: 'blob'
}) })

View File

@@ -21,7 +21,7 @@
<!-- 二维码区域 --> <!-- 二维码区域 -->
<div v-else-if="qrInfo && countdown > 0" class="qr-container"> <div v-else-if="qrInfo && countdown > 0" class="qr-container">
<div class="qr-section"> <div class="qr-section">
<div class="qr-title">回验证码扫码</div> <div class="qr-title">请尽快完成扫码!</div>
<div class="qr-wrapper"> <div class="qr-wrapper">
<img :src="qrInfo.url" class="qr-code" alt="扫码登录" @error="$emit('qrImageError', $event)" @load="$emit('qrImageLoad', $event)" /> <img :src="qrInfo.url" class="qr-code" alt="扫码登录" @error="$emit('qrImageError', $event)" @load="$emit('qrImageLoad', $event)" />
</div> </div>

View File

@@ -16,7 +16,7 @@
<div class="detail-value region-value">{{ selectedRegion || '未选择' }}</div> <div class="detail-value region-value">{{ selectedRegion || '未选择' }}</div>
<div class="detail-value">待选区</div> <div class="detail-value">待选区</div>
<div class="detail-value">{{ mecmachineId || '待分配' }}</div> <div class="detail-value">{{ mecmachineId || '待分配' }}</div>
<div class="detail-value points-value">{{ totalPoints || 4000 }}</div> <div class="detail-value points-value">{{ displayTotalPoints }}</div>
</div> </div>
</div> </div>
@@ -33,8 +33,10 @@
@click="confirmSelection" @click="confirmSelection"
class="confirm-btn" class="confirm-btn"
:disabled="!selectedRegion || submitting" :disabled="!selectedRegion || submitting"
:class="{ 'loading': submitting }"
> >
确认选择 <span v-if="submitting" class="loading-spinner"></span>
<span>{{ submitting ? '正在连接...' : '确认选择' }}</span>
</button> </button>
</div> </div>
@@ -44,6 +46,7 @@
@click="selectRegionOption('Q')" @click="selectRegionOption('Q')"
class="option-btn qq-option" class="option-btn qq-option"
:class="{ 'selected': selectedRegion === 'QQ区' }" :class="{ 'selected': selectedRegion === 'QQ区' }"
:disabled="submitting"
> >
<div class="option-icon qq-icon"> <div class="option-icon qq-icon">
<svg viewBox="0 0 24 24" width="32" height="32" fill="currentColor"> <svg viewBox="0 0 24 24" width="32" height="32" fill="currentColor">
@@ -57,6 +60,7 @@
@click="selectRegionOption('V')" @click="selectRegionOption('V')"
class="option-btn wx-option" class="option-btn wx-option"
:class="{ 'selected': selectedRegion === '微信区' }" :class="{ 'selected': selectedRegion === '微信区' }"
:disabled="submitting"
> >
<div class="option-icon wx-icon"> <div class="option-icon wx-icon">
<svg viewBox="0 0 24 24" width="32" height="32" fill="currentColor"> <svg viewBox="0 0 24 24" width="32" height="32" fill="currentColor">
@@ -92,7 +96,7 @@ export default {
}, },
totalPoints: { totalPoints: {
type: Number, type: Number,
default: 4000 default: null
} }
}, },
data() { data() {
@@ -103,6 +107,16 @@ export default {
} }
}, },
emits: ['selectRegion'], emits: ['selectRegion'],
computed: {
displayTotalPoints() {
// 如果 totalPoints 为 null 或 undefined显示"待分配"
// 注意0 是有效值,应该显示
if (this.totalPoints === null || this.totalPoints === undefined) {
return '待分配'
}
return this.totalPoints
}
},
methods: { methods: {
selectRegionOption(code) { selectRegionOption(code) {
this.regionCode = code this.regionCode = code
@@ -231,6 +245,10 @@ export default {
cursor: pointer; cursor: pointer;
transition: all 0.3s ease; transition: all 0.3s ease;
white-space: nowrap; white-space: nowrap;
display: flex;
align-items: center;
gap: 8px;
justify-content: center;
} }
.confirm-btn:hover:not(:disabled) { .confirm-btn:hover:not(:disabled) {
@@ -243,6 +261,27 @@ export default {
cursor: not-allowed; cursor: not-allowed;
} }
.confirm-btn.loading {
opacity: 0.8;
cursor: wait;
}
/* Loading Spinner */
.loading-spinner {
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-top-color: white;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
/* 选择区域按钮 */ /* 选择区域按钮 */
.region-options { .region-options {
flex: 1; flex: 1;
@@ -268,11 +307,16 @@ export default {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
} }
.option-btn:hover { .option-btn:hover:not(:disabled) {
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
} }
.option-btn:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.option-icon { .option-icon {
width: 60px; width: 60px;
height: 60px; height: 60px;

View File

@@ -23,7 +23,7 @@ export function usePlayState() {
qrInfo: null, qrInfo: null,
assets: null, assets: null,
currentPoints: 0, currentPoints: 0,
totalPoints: 1000, totalPoints: null, // 修改初始值改为null等待从API获取真实数据
completedPoints: 0, completedPoints: 0,
progressDisplayFormat: '1', progressDisplayFormat: '1',
error: null, error: null,
@@ -57,6 +57,32 @@ export function usePlayState() {
const response = await getLinkStatus(state.code) const response = await getLinkStatus(state.code)
const data = response.data const data = response.data
await updateStateFromResponse(data) await updateStateFromResponse(data)
// 如果是NEW状态尝试获取游戏界面数据以获取totalPoints
if (data.status === 'NEW') {
try {
const gameResponse = await getGameInterfaceAPI(state.code)
const gameData = gameResponse.data
console.log('NEW状态 - 游戏界面数据:', gameData)
// 更新totalPoints和其他可用数据
if (gameData.totalPoints !== undefined && gameData.totalPoints !== null) {
state.totalPoints = gameData.totalPoints
console.log('从游戏界面获取到totalPoints:', state.totalPoints)
}
if (gameData.completedPoints !== undefined) {
state.completedPoints = gameData.completedPoints
}
if (gameData.progressDisplayFormat) {
state.progressDisplayFormat = String(gameData.progressDisplayFormat)
}
} catch (gameError) {
// 游戏界面数据获取失败不影响主流程,只记录日志
console.log('NEW状态获取游戏界面数据失败这是正常的:', gameError.message)
}
}
} catch (error) { } catch (error) {
throw error throw error
} }
@@ -86,7 +112,7 @@ export function usePlayState() {
state.status = 'LOGGED_IN' state.status = 'LOGGED_IN'
state.assets = { state.assets = {
qrCodeUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/二维码.png?t=${new Date().getTime()}` : null, qrCodeUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/二维码.png?t=${Date.now()}` : null,
...(gameData.assets || {}) ...(gameData.assets || {})
} }
@@ -239,7 +265,8 @@ export function usePlayState() {
state.qrExpireAt = data.qrExpireAt state.qrExpireAt = data.qrExpireAt
} }
if (data.totalPoints) { // 优先使用 data.totalPoints确保在NEW状态也能获取到目标点数
if (data.totalPoints !== undefined && data.totalPoints !== null) {
state.totalPoints = data.totalPoints state.totalPoints = data.totalPoints
} }
@@ -251,7 +278,8 @@ export function usePlayState() {
state.progressDisplayFormat = String(data.progressDisplayFormat) state.progressDisplayFormat = String(data.progressDisplayFormat)
} }
if (data.assets && data.assets.totalPoints) { // 如果assets中有totalPoints,也更新
if (data.assets && data.assets.totalPoints !== undefined && data.assets.totalPoints !== null) {
state.totalPoints = data.assets.totalPoints state.totalPoints = data.assets.totalPoints
if (state.currentPoints === undefined) { if (state.currentPoints === undefined) {
state.currentPoints = 0 state.currentPoints = 0
@@ -263,7 +291,8 @@ export function usePlayState() {
dataRegion: data.region, dataRegion: data.region,
stateRegion: state.region, stateRegion: state.region,
mecmachineId: data.mecmachineId, mecmachineId: data.mecmachineId,
totalPoints: state.totalPoints, dataTotalPoints: data.totalPoints,
stateTotalPoints: state.totalPoints,
completedPoints: state.completedPoints, completedPoints: state.completedPoints,
skipQrProcessing skipQrProcessing
}) })

View File

@@ -61,7 +61,7 @@ export function useTimers() {
} catch (error) { } catch (error) {
console.error('轮询错误:', error) console.error('轮询错误:', error)
} }
}, 1000) }, 3000) // 修改轮询间隔从1秒改为3秒
} }
const startProgressPolling = (code, onProgressUpdate) => { const startProgressPolling = (code, onProgressUpdate) => {

View File

@@ -5,19 +5,17 @@ export const LINK_CONFIG = {
// 基础域名 - 生产环境需要修改为实际域名 // 基础域名 - 生产环境需要修改为实际域名
BASE_URL: import.meta.env.VITE_BASE_URL || 'http://localhost:5173', BASE_URL: import.meta.env.VITE_BASE_URL || 'http://localhost:5173',
// 游戏页面路径 // 游戏页面路径(已缩短为空,新生成的链接使用短格式,旧链接 /play/:code 仍然兼容)
GAME_PATH: '/play', GAME_PATH: '',
// 机器编号参数名 // 机器编号参数名
CODE_PARAM: 'code', CODE_PARAM: 'code',
// 链接地址模板 // 链接地址模板
getLinkUrl: (codeNo) => { getLinkUrl: (codeNo) => {
// 生成随机参数:时间戳 + 随机字符串 // 如果 GAME_PATH 为空,直接拼接;否则添加斜杠
const timestamp = Date.now() const path = LINK_CONFIG.GAME_PATH ? `${LINK_CONFIG.GAME_PATH}/${codeNo}` : `/${codeNo}`
const random = Math.random().toString(36).substring(2, 8) return `${LINK_CONFIG.BASE_URL}${path}`
const randomParam = `${timestamp}${random}`
return `${LINK_CONFIG.BASE_URL}${LINK_CONFIG.GAME_PATH}/${codeNo}?t=${randomParam}`
} }
} }

View File

@@ -15,8 +15,9 @@ const NotFound = () => import('@/views/NotFound.vue')
export const routes = [ export const routes = [
{ path: '/login', name: 'Login', component: Login, meta: { public: true, title: '登录' } }, { path: '/login', name: 'Login', component: Login, meta: { public: true, title: '登录' } },
{ path: '/play/:code', name: 'Play', component: Play, meta: { public: true, title: '上号任务' } }, // 保留旧的 /play/:code 路由用于兼容旧链接
{ path: '/play', name: 'PlayLegacy', component: Play, meta: { public: true, title: '上号任务' } }, { path: '/play/:code', name: 'PlayLegacy', component: Play, meta: { public: true, title: '上号任务' } },
{ path: '/play', name: 'PlayLegacyNoCode', component: Play, meta: { public: true, title: '上号任务' } },
{ {
path: '/', path: '/',
component: AdminLayout, component: AdminLayout,
@@ -41,6 +42,8 @@ export const routes = [
{ path: 'announcements', name: 'Announcements', component: AnnouncementList, meta: { title: '公告管理' } }, { path: 'announcements', name: 'Announcements', component: AnnouncementList, meta: { title: '公告管理' } },
], ],
}, },
// 新的短链接路由放在最后NotFound之前用于新生成的链接
{ path: '/:code', name: 'Play', component: Play, meta: { public: true, title: '上号任务' } },
{ path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound, meta: { public: true, title: '未找到' } }, { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound, meta: { public: true, title: '未找到' } },
] ]

View File

@@ -33,7 +33,7 @@
<!-- 游戏界面 --> <!-- 游戏界面 -->
<GamePage <GamePage
v-else-if="state.status === 'LOGGED_IN' || (state.status === 'COMPLETED' && !state.isCompletedExpired)" v-else-if="state.status === 'LOGGED_IN'"
:region="state.region" :region="state.region"
:region-desc="state.regionDesc" :region-desc="state.regionDesc"
:machine-id="state.machineId" :machine-id="state.machineId"
@@ -48,8 +48,8 @@
:code-no="state.code" :code-no="state.code"
/> />
<!-- 完成状态超过24小时 --> <!-- 完成状态 -->
<div v-else-if="state.status === 'COMPLETED' && state.isCompletedExpired" class="completed-page"> <div v-else-if="state.status === 'COMPLETED'" class="completed-page">
<div class="completed-text">已打完</div> <div class="completed-text">已打完</div>
</div> </div>

View File

@@ -325,18 +325,18 @@ export default {
midRewardUrl: gameData.midRewardUrl, midRewardUrl: gameData.midRewardUrl,
endRewardUrl: gameData.endRewardUrl, endRewardUrl: gameData.endRewardUrl,
qrCodeUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/二维码.png?t=${new Date().getTime()}` : null, qrCodeUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/二维码.png?t=${Date.now()}` : null,
// 保留原有的assets数据如果存在 // 保留原有的assets数据如果存在
...(gameData.assets || {}) ...(gameData.assets || {})
} }
}else{ }else{
state.assets = { state.assets = {
homepageUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/首次主页.png?t=${new Date().getTime()}` : null, homepageUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/首次主页.png?t=${Date.now()}` : null,
firstRewardUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/首次赏金.png?t=${new Date().getTime()}` : null, firstRewardUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/首次赏金.png?t=${Date.now()}` : null,
midRewardUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/中途赏金.png?t=${new Date().getTime()}` : null, midRewardUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/中途赏金.png?t=${Date.now()}` : null,
endRewardUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/结束赏金.png?t=${new Date().getTime()}` : null, endRewardUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/结束赏金.png?t=${Date.now()}` : null,
qrCodeUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/二维码.png?t=${new Date().getTime()}` : null, qrCodeUrl: gameData.mecmachineId ? `https://uzi1.cn/image/${gameData.mecmachineId}/二维码.png?t=${Date.now()}` : null,
// 保留原有的assets数据如果存在 // 保留原有的assets数据如果存在
...(gameData.assets || {}) ...(gameData.assets || {})
@@ -791,7 +791,7 @@ export default {
} catch (error) { } catch (error) {
console.error('轮询错误:', error) console.error('轮询错误:', error)
} }
}, 1000) }, 3000) // 修改轮询间隔从1秒改为3秒
} }
// 开始进度轮询 // 开始进度轮询

View File

@@ -187,9 +187,8 @@
<el-collapse-item title="输入格式说明" name="5"> <el-collapse-item title="输入格式说明" name="5">
<ul class="help-list"> <ul class="help-list">
<li>支持直接输入链接编号<code class="mono">RUC74NCV</code></li> <li>支持直接输入链接编号<code class="mono">6DJWZ4MA</code></li>
<li>支持输入完整链接URL<code class="mono">http://localhost:5173/play?code=RUC74NCV</code></li> <li>支持粘贴完整链接URL系统会自动识别并提取编号</li>
<li>系统会自动从URL中提取链接编号</li>
<li>支持使用粘贴按钮或Ctrl+V快速粘贴</li> <li>支持使用粘贴按钮或Ctrl+V快速粘贴</li>
</ul> </ul>
</el-collapse-item> </el-collapse-item>
@@ -343,7 +342,7 @@ export default {
// 移除首尾空格 // 移除首尾空格
const trimmed = input.trim() const trimmed = input.trim()
// 如果是URL尝试提取code参数 // 方式1: 尝试从旧格式URL提取 (play?code=xxx)
try { try {
if (trimmed.includes('play?code=')) { if (trimmed.includes('play?code=')) {
const url = new URL(trimmed) const url = new URL(trimmed)
@@ -354,23 +353,48 @@ export default {
// 如果URL解析失败继续下面的处理 // 如果URL解析失败继续下面的处理
} }
// 尝试从各种URL格式中提取代码 // 方式2: 尝试从查询参数中提取 code=
if (trimmed.includes('code=')) { if (trimmed.includes('code=')) {
const match = trimmed.match(/code=([^&\s]+)/) const match = trimmed.match(/code=([^&\s]+)/)
if (match) return match[1] if (match) return match[1]
} }
// 如果包含路径分隔符,取最后一个部分 // 方式3: 尝试从新格式URL提取 (play/CODE 或 play/CODE?t=xxx)
// 匹配 /play/CODE 格式CODE后面可能跟查询参数
const playPathMatch = trimmed.match(/\/play\/([A-Z0-9]+)(?:\?|$|\/)/i)
if (playPathMatch) {
return playPathMatch[1]
}
// 方式4: 如果包含路径分隔符,取最后一个部分(去除查询参数)
if (trimmed.includes('/')) { if (trimmed.includes('/')) {
const parts = trimmed.split('/') const parts = trimmed.split('/')
const lastPart = parts[parts.length - 1] let lastPart = parts[parts.length - 1]
// 去除查询参数部分
if (lastPart.includes('?')) {
lastPart = lastPart.split('?')[0]
}
// 去除hash部分
if (lastPart.includes('#')) {
lastPart = lastPart.split('#')[0]
}
if (lastPart && lastPart.length >= 6) { if (lastPart && lastPart.length >= 6) {
return lastPart return lastPart
} }
} }
// 直接返回输入(假设就是代码) // 方式5: 直接返回输入(假设就是代码,去除可能的查询参数
return trimmed let result = trimmed
if (result.includes('?')) {
result = result.split('?')[0]
}
if (result.includes('#')) {
result = result.split('#')[0]
}
return result
} }
// 查询 // 查询