942 lines
46 KiB
PHP
Executable File
942 lines
46 KiB
PHP
Executable File
<h1 class="text-2xl font-bold text-gray-800 mb-6 flex items-center">
|
||
<i class="fas fa-calendar-alt text-primary mr-3"></i>
|
||
期号管理
|
||
</h1>
|
||
|
||
<!-- 游戏期号管理区域 -->
|
||
<?php if (!empty($gamesList) && is_array($gamesList)): ?>
|
||
<?php foreach ($gamesList as $game): ?>
|
||
<?php
|
||
$gameId = $game['id'];
|
||
$gameName = $game['name'];
|
||
$currentPeriod = isset($currentPeriods[$gameId]) ? $currentPeriods[$gameId] : null;
|
||
?>
|
||
|
||
<!-- 单个游戏的期号卡片 -->
|
||
<div class="bg-white rounded-xl shadow-md p-6 mb-6 border-l-4 border-primary">
|
||
<div class="flex items-center justify-between mb-4">
|
||
<h2 class="text-xl font-semibold text-gray-800 flex items-center">
|
||
<i class="fas fa-gamepad text-primary mr-2"></i>
|
||
<?= htmlspecialchars($gameName) ?>
|
||
</h2>
|
||
|
||
<?php if ($currentPeriod): ?>
|
||
<!-- 有当前期号 -->
|
||
<div class="flex gap-2">
|
||
<?php if ($currentPeriod['status'] === 'pending'): ?>
|
||
<button
|
||
type="button"
|
||
class="period-lock-btn inline-block bg-warning hover:bg-warning/90 text-white px-4 py-2 rounded-lg text-sm"
|
||
data-id="<?= $currentPeriod['id'] ?>"
|
||
>
|
||
<i class="fas fa-lock mr-2"></i>封盘
|
||
</button>
|
||
<?php endif; ?>
|
||
|
||
<?php if ($currentPeriod['status'] === 'locked'): ?>
|
||
<button
|
||
type="button"
|
||
class="period-draw-btn inline-block bg-success hover:bg-success/90 text-white px-4 py-2 rounded-lg text-sm"
|
||
data-id="<?= $currentPeriod['id'] ?>"
|
||
>
|
||
<i class="fas fa-dice mr-2"></i>开奖
|
||
</button>
|
||
<?php endif; ?>
|
||
|
||
<?php if ($currentPeriod['status'] === 'drawn'): ?>
|
||
<button
|
||
type="button"
|
||
class="period-settle-btn inline-block bg-primary hover:bg-primary/90 text-white px-4 py-2 rounded-lg text-sm"
|
||
data-id="<?= $currentPeriod['id'] ?>"
|
||
>
|
||
<i class="fas fa-coins mr-2"></i>结算
|
||
</button>
|
||
<?php endif; ?>
|
||
|
||
<?php if ($currentPeriod['status'] === 'settled'): ?>
|
||
<!-- 已结算，显示开始新一期按钮 -->
|
||
<button
|
||
type="button"
|
||
class="period-start-btn inline-block bg-primary hover:bg-primary/90 text-white px-4 py-2 rounded-lg text-sm"
|
||
data-game-id="<?= $gameId ?>"
|
||
>
|
||
<i class="fas fa-play mr-2"></i>开始新一期
|
||
</button>
|
||
<?php endif; ?>
|
||
</div>
|
||
<?php else: ?>
|
||
<!-- 无当前期号，显示开始按钮 -->
|
||
<button
|
||
type="button"
|
||
class="period-start-btn inline-block bg-primary hover:bg-primary/90 text-white px-4 py-2 rounded-lg text-sm"
|
||
data-game-id="<?= $gameId ?>"
|
||
>
|
||
<i class="fas fa-play mr-2"></i>开始新一期
|
||
</button>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<?php if ($currentPeriod): ?>
|
||
<!-- 当前期号信息 -->
|
||
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
|
||
<div>
|
||
<p class="text-sm text-gray-500 mb-1">期号</p>
|
||
<p class="text-lg font-bold text-gray-900"><?= htmlspecialchars($currentPeriod['period_number']) ?></p>
|
||
</div>
|
||
<div>
|
||
<p class="text-sm text-gray-500 mb-1">状态</p>
|
||
<?php
|
||
$status = $currentPeriod['status'];
|
||
$statusMap = [
|
||
'pending' => ['text' => '待开奖', 'class' => 'bg-warning/10 text-warning'],
|
||
'locked' => ['text' => '已封盘', 'class' => 'bg-danger/10 text-danger'],
|
||
'drawn' => ['text' => '已开奖', 'class' => 'bg-primary/10 text-primary'],
|
||
'settled' => ['text' => '已结算', 'class' => 'bg-success/10 text-success']
|
||
];
|
||
$statusInfo = $statusMap[$status] ?? $statusMap['pending'];
|
||
?>
|
||
<span class="inline-flex items-center px-3 py-1 rounded-full text-sm <?= $statusInfo['class'] ?>">
|
||
<?= $statusInfo['text'] ?>
|
||
</span>
|
||
</div>
|
||
<div>
|
||
<p class="text-sm text-gray-500 mb-1">开始时间</p>
|
||
<p class="text-sm text-gray-900"><?= htmlspecialchars($currentPeriod['start_time'] ?? '-') ?></p>
|
||
</div>
|
||
<div>
|
||
<p class="text-sm text-gray-500 mb-1">开奖结果</p>
|
||
<?php if (!empty($currentPeriod['dice1'])): ?>
|
||
<p class="text-lg font-bold text-gray-900">
|
||
<?= $currentPeriod['dice1'] ?>.<?= $currentPeriod['dice2'] ?>.<?= $currentPeriod['dice3'] ?>
|
||
<span class="text-sm text-gray-500">(<?= $currentPeriod['total'] ?>)</span>
|
||
</p>
|
||
<?php else: ?>
|
||
<p class="text-sm text-gray-400">未开奖</p>
|
||
<?php endif; ?>
|
||
</div>
|
||
</div>
|
||
<?php else: ?>
|
||
<!-- 无当前期号提示 -->
|
||
<div class="text-center py-4">
|
||
<p class="text-sm text-gray-500">暂无进行中的期号，点击"开始新一期"按钮启动</p>
|
||
</div>
|
||
<?php endif; ?>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
<?php endif; ?>
|
||
|
||
<!-- 统计卡片 -->
|
||
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
|
||
<div class="bg-white rounded-xl p-5 card-shadow hover-lift">
|
||
<div class="flex items-center justify-between">
|
||
<div>
|
||
<p class="text-gray-500 text-sm">期号总数</p>
|
||
<h3 class="text-2xl font-bold mt-1">
|
||
<?= isset($periods) && is_array($periods) ? count($periods) : 0 ?>
|
||
</h3>
|
||
</div>
|
||
<div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center">
|
||
<i class="fas fa-list text-primary"></i>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bg-white rounded-xl p-5 card-shadow hover-lift">
|
||
<div class="flex items-center justify-between">
|
||
<div>
|
||
<p class="text-gray-500 text-sm">待开奖</p>
|
||
<h3 class="text-2xl font-bold mt-1 text-warning">
|
||
<?php
|
||
$pendingCount = 0;
|
||
if (isset($periods) && is_array($periods)) {
|
||
foreach ($periods as $p) {
|
||
if (isset($p['status']) && $p['status'] === 'pending') {
|
||
$pendingCount++;
|
||
}
|
||
}
|
||
}
|
||
echo $pendingCount;
|
||
?>
|
||
</h3>
|
||
</div>
|
||
<div class="w-10 h-10 rounded-full bg-warning/10 flex items-center justify-center">
|
||
<i class="fas fa-clock text-warning"></i>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bg-white rounded-xl p-5 card-shadow hover-lift">
|
||
<div class="flex items-center justify-between">
|
||
<div>
|
||
<p class="text-gray-500 text-sm">已开奖</p>
|
||
<h3 class="text-2xl font-bold mt-1 text-success">
|
||
<?php
|
||
$drawnCount = 0;
|
||
if (isset($periods) && is_array($periods)) {
|
||
foreach ($periods as $p) {
|
||
if (isset($p['status']) && ($p['status'] === 'drawn' || $p['status'] === 'settled')) {
|
||
$drawnCount++;
|
||
}
|
||
}
|
||
}
|
||
echo $drawnCount;
|
||
?>
|
||
</h3>
|
||
</div>
|
||
<div class="w-10 h-10 rounded-full bg-success/10 flex items-center justify-center">
|
||
<i class="fas fa-check-circle text-success"></i>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bg-white rounded-xl p-5 card-shadow hover-lift">
|
||
<div class="flex items-center justify-between">
|
||
<div>
|
||
<p class="text-gray-500 text-sm">已结算</p>
|
||
<h3 class="text-2xl font-bold mt-1 text-primary">
|
||
<?php
|
||
$settledCount = 0;
|
||
if (isset($periods) && is_array($periods)) {
|
||
foreach ($periods as $p) {
|
||
if (isset($p['status']) && $p['status'] === 'settled') {
|
||
$settledCount++;
|
||
}
|
||
}
|
||
}
|
||
echo $settledCount;
|
||
?>
|
||
</h3>
|
||
</div>
|
||
<div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center">
|
||
<i class="fas fa-coins text-primary"></i>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 期号列表 -->
|
||
<div class="bg-white rounded-xl shadow-md p-6 mb-8">
|
||
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4 mb-6">
|
||
<div>
|
||
<h2 class="text-xl font-semibold text-gray-800">期号列表</h2>
|
||
<p class="text-sm text-gray-500 mt-1">管理游戏期号和开奖结果</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="overflow-x-auto">
|
||
<table class="w-full bg-white rounded-xl overflow-hidden">
|
||
<thead class="bg-gray-50">
|
||
<tr>
|
||
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">期号</th>
|
||
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">关联游戏</th>
|
||
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">状态</th>
|
||
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">开奖结果</th>
|
||
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider hidden md:table-cell">创建时间</th>
|
||
<th class="px-4 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody class="divide-y divide-gray-200" id="periodList">
|
||
<?php if (!empty($periods) && is_array($periods)): ?>
|
||
<?php foreach ($periods as $period): ?>
|
||
<tr class="hover:bg-gray-50 transition-colors" data-id="<?= htmlspecialchars((string)($period['id'] ?? '')) ?>">
|
||
<td class="px-4 py-4">
|
||
<div class="text-sm font-semibold text-gray-900">
|
||
<?= htmlspecialchars((string)($period['period_number'] ?? '')) ?>
|
||
</div>
|
||
<?php if (!empty($period['auto_generated'])): ?>
|
||
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-[11px] bg-gray-100 text-gray-600 mt-1">
|
||
自动生成
|
||
</span>
|
||
<?php endif; ?>
|
||
</td>
|
||
<td class="px-4 py-4">
|
||
<?php
|
||
$gameId = $period['game_id'] ?? null;
|
||
$gameName = $gameId && isset($games[$gameId]) ? $games[$gameId] : '未关联';
|
||
?>
|
||
<span class="text-sm text-gray-600"><?= htmlspecialchars($gameName) ?></span>
|
||
</td>
|
||
<td class="px-4 py-4">
|
||
<?php
|
||
$status = $period['status'] ?? 'pending';
|
||
$statusMap = [
|
||
'pending' => ['text' => '待开奖', 'class' => 'bg-warning/10 text-warning'],
|
||
'locked' => ['text' => '已封盘', 'class' => 'bg-danger/10 text-danger'],
|
||
'drawn' => ['text' => '已开奖', 'class' => 'bg-primary/10 text-primary'],
|
||
'settled' => ['text' => '已结算', 'class' => 'bg-success/10 text-success']
|
||
];
|
||
$statusInfo = $statusMap[$status] ?? $statusMap['pending'];
|
||
?>
|
||
<span class="inline-flex items-center px-2 py-1 rounded-full text-xs <?= $statusInfo['class'] ?>">
|
||
<span class="w-2 h-2 rounded-full mr-1 <?= str_replace('/10', '', $statusInfo['class']) ?>"></span>
|
||
<?= $statusInfo['text'] ?>
|
||
</span>
|
||
</td>
|
||
<td class="px-4 py-4">
|
||
<?php
|
||
// 获取游戏类型
|
||
$gameId = $period['game_id'] ?? 0;
|
||
$gameType = 'dice';
|
||
if (isset($games[$gameId])) {
|
||
// 从游戏列表获取类型（需要查询数据库）
|
||
// 简化处理：通过 dice3 是否为 null 判断
|
||
if ($period['dice3'] === null && !empty($period['result'])) {
|
||
$gameType = 'xocdia';
|
||
}
|
||
}
|
||
|
||
// 根据游戏类型显示开奖结果
|
||
if ($gameType === 'xocdia'):
|
||
// Xóc Đĩa: 显示硬币颜色
|
||
if (!empty($period['result'])):
|
||
$coins = json_decode($period['result'], true);
|
||
if (is_array($coins) && count($coins) === 4):
|
||
$redCount = $period['dice1'] ?? 0;
|
||
$whiteCount = $period['dice2'] ?? 0;
|
||
?>
|
||
<div class="text-sm text-gray-900">
|
||
<span class="font-semibold">
|
||
<?php foreach ($coins as $coin): ?>
|
||
<span class="inline-block w-5 h-5 rounded-full <?= $coin === 'red' ? 'bg-red-500' : 'bg-gray-200' ?> border border-gray-300 mr-1"></span>
|
||
<?php endforeach; ?>
|
||
</span>
|
||
<span class="text-gray-600 ml-2">
|
||
(<?= $redCount ?>Đ <?= $whiteCount ?>T)
|
||
</span>
|
||
<span class="ml-1 px-2 py-0.5 rounded text-[11px] <?= ($redCount == 0 || $redCount == 2 || $redCount == 4) ? 'bg-blue-100 text-blue-700' : 'bg-red-100 text-red-700' ?>">
|
||
<?= ($redCount == 0 || $redCount == 2 || $redCount == 4) ? 'Chẵn' : 'Lẻ' ?>
|
||
</span>
|
||
</div>
|
||
<?php
|
||
else:
|
||
?>
|
||
<span class="text-sm text-gray-400">数据格式错误</span>
|
||
<?php
|
||
endif;
|
||
else:
|
||
?>
|
||
<span class="text-sm text-gray-400">未开奖</span>
|
||
<?php
|
||
endif;
|
||
else:
|
||
// 骰子游戏: 显示骰子点数
|
||
if (!empty($period['dice1']) && !empty($period['dice2']) && !empty($period['dice3'])):
|
||
?>
|
||
<div class="text-sm text-gray-900">
|
||
<span class="font-semibold">
|
||
<?= htmlspecialchars((string)$period['dice1']) ?>.
|
||
<?= htmlspecialchars((string)$period['dice2']) ?>.
|
||
<?= htmlspecialchars((string)$period['dice3']) ?>
|
||
</span>
|
||
<span class="text-gray-500 ml-1">
|
||
(<?= htmlspecialchars((string)($period['total'] ?? '')) ?>)
|
||
</span>
|
||
<?php if (!empty($period['result'])): ?>
|
||
<span class="ml-1 px-2 py-0.5 rounded text-[11px] <?= $period['result'] === 'Tài' ? 'bg-red-100 text-red-700' : 'bg-blue-100 text-blue-700' ?>">
|
||
<?= htmlspecialchars((string)$period['result']) ?>
|
||
</span>
|
||
<?php endif; ?>
|
||
</div>
|
||
<?php
|
||
else:
|
||
?>
|
||
<span class="text-sm text-gray-400">未开奖</span>
|
||
<?php
|
||
endif;
|
||
endif;
|
||
?>
|
||
</td>
|
||
<td class="px-4 py-4 hidden md:table-cell">
|
||
<?php if (!empty($period['created_at'])): ?>
|
||
<div class="text-xs text-gray-500">
|
||
<?= date('Y-m-d H:i', strtotime((string)$period['created_at'])) ?>
|
||
</div>
|
||
<?php else: ?>
|
||
<span class="text-xs text-gray-400">时间未知</span>
|
||
<?php endif; ?>
|
||
</td>
|
||
<td class="px-4 py-4 text-right text-sm font-medium">
|
||
<div class="flex items-center justify-end gap-2">
|
||
<?php if (($period['status'] ?? '') === 'pending'): ?>
|
||
<button
|
||
type="button"
|
||
class="period-lock-btn text-gray-500 hover:text-warning"
|
||
data-id="<?= htmlspecialchars((string)($period['id'] ?? '')) ?>"
|
||
title="封盘"
|
||
>
|
||
<i class="fas fa-lock"></i>
|
||
</button>
|
||
<?php endif; ?>
|
||
<?php if (($period['status'] ?? '') === 'locked' || ($period['status'] ?? '') === 'pending'): ?>
|
||
<button
|
||
type="button"
|
||
class="period-draw-btn text-gray-500 hover:text-primary"
|
||
data-id="<?= htmlspecialchars((string)($period['id'] ?? '')) ?>"
|
||
title="录入开奖"
|
||
>
|
||
<i class="fas fa-dice"></i>
|
||
</button>
|
||
<?php endif; ?>
|
||
<?php if (($period['status'] ?? '') === 'drawn'): ?>
|
||
<button
|
||
type="button"
|
||
class="period-draw-btn text-gray-500 hover:text-warning"
|
||
data-id="<?= htmlspecialchars((string)($period['id'] ?? '')) ?>"
|
||
title="修改结果"
|
||
>
|
||
<i class="fas fa-edit"></i>
|
||
</button>
|
||
<button
|
||
type="button"
|
||
class="period-settle-btn text-gray-500 hover:text-success"
|
||
data-id="<?= htmlspecialchars((string)($period['id'] ?? '')) ?>"
|
||
title="确认结算"
|
||
>
|
||
<i class="fas fa-check-circle"></i>
|
||
</button>
|
||
<?php endif; ?>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
<?php endforeach; ?>
|
||
<?php else: ?>
|
||
<tr>
|
||
<td colspan="6" class="px-6 py-12 text-center">
|
||
<div class="flex flex-col items-center">
|
||
<i class="fas fa-calendar-alt text-gray-300 text-5xl mb-4"></i>
|
||
<h3 class="text-lg font-medium text-gray-900">暂无期号</h3>
|
||
<p class="mt-1 text-gray-500 text-sm">
|
||
当前还没有任何期号。
|
||
</p>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
<?php endif; ?>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 录入开奖结果模态框 -->
|
||
<div
|
||
id="drawPeriodBackdrop"
|
||
class="fixed inset-0 bg-black/50 backdrop-blur-sm opacity-0 pointer-events-none transition-opacity duration-300 z-40"
|
||
></div>
|
||
|
||
<div
|
||
id="drawPeriodModal"
|
||
class="fixed inset-0 z-50 flex items-center justify-center p-4 invisible pointer-events-none transition-all duration-300 scale-95"
|
||
>
|
||
<div class="bg-white rounded-xl shadow-xl w-full max-w-md max-h-[90vh] overflow-hidden">
|
||
<div class="border-b border-gray-100 px-6 py-4 flex justify-between items-center">
|
||
<h3 class="text-xl font-bold text-gray-800 flex items-center">
|
||
<i class="fas fa-dice text-primary mr-2"></i>
|
||
录入开奖结果
|
||
</h3>
|
||
<button id="closeDrawPeriodBtn" class="text-gray-400 hover:text-gray-600 transition-colors p-1">
|
||
<i class="fas fa-times"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="px-6 py-5 overflow-y-auto max-h-[calc(90vh-130px)]">
|
||
<form id="drawPeriodForm" class="space-y-4">
|
||
<input type="hidden" id="drawPeriodId" name="id">
|
||
<input type="hidden" id="drawGameType" name="game_type">
|
||
|
||
<div>
|
||
<label class="block text-sm font-medium text-gray-700 mb-2">
|
||
期号
|
||
</label>
|
||
<p id="drawPeriodNumber" class="text-lg font-bold text-gray-900"></p>
|
||
</div>
|
||
|
||
<!-- 骰子游戏输入 -->
|
||
<div id="diceInputSection" class="grid grid-cols-3 gap-4">
|
||
<div>
|
||
<label for="drawDice1" class="block text-sm font-medium text-gray-700 mb-1">
|
||
骰子1 <span class="text-red-500">*</span>
|
||
</label>
|
||
<input
|
||
type="number"
|
||
id="drawDice1"
|
||
name="dice1"
|
||
min="1"
|
||
max="6"
|
||
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary text-sm text-center text-lg font-bold"
|
||
placeholder="1-6"
|
||
>
|
||
</div>
|
||
<div>
|
||
<label for="drawDice2" class="block text-sm font-medium text-gray-700 mb-1">
|
||
骰子2 <span class="text-red-500">*</span>
|
||
</label>
|
||
<input
|
||
type="number"
|
||
id="drawDice2"
|
||
name="dice2"
|
||
min="1"
|
||
max="6"
|
||
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary text-sm text-center text-lg font-bold"
|
||
placeholder="1-6"
|
||
>
|
||
</div>
|
||
<div>
|
||
<label for="drawDice3" class="block text-sm font-medium text-gray-700 mb-1">
|
||
骰子3 <span class="text-red-500">*</span>
|
||
</label>
|
||
<input
|
||
type="number"
|
||
id="drawDice3"
|
||
name="dice3"
|
||
min="1"
|
||
max="6"
|
||
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary text-sm text-center text-lg font-bold"
|
||
placeholder="1-6"
|
||
>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Xóc Đĩa 硬币输入 -->
|
||
<div id="xocdiaInputSection" class="hidden space-y-3">
|
||
<p class="text-sm text-gray-600">选择4个硬币的颜色：</p>
|
||
<div class="grid grid-cols-4 gap-3">
|
||
<div>
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">硬币1</label>
|
||
<select id="coin1" class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm bg-white">
|
||
<option value="red">红色</option>
|
||
<option value="white">白色</option>
|
||
</select>
|
||
</div>
|
||
<div>
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">硬币2</label>
|
||
<select id="coin2" class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm bg-white">
|
||
<option value="red">红色</option>
|
||
<option value="white">白色</option>
|
||
</select>
|
||
</div>
|
||
<div>
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">硬币3</label>
|
||
<select id="coin3" class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm bg-white">
|
||
<option value="red">红色</option>
|
||
<option value="white">白色</option>
|
||
</select>
|
||
</div>
|
||
<div>
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">硬币4</label>
|
||
<select id="coin4" class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm bg-white">
|
||
<option value="red">红色</option>
|
||
<option value="white">白色</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="drawResultPreview" class="hidden p-4 bg-gray-50 rounded-lg">
|
||
<p class="text-sm text-gray-600 mb-1">开奖结果预览：</p>
|
||
<p class="text-lg font-bold">
|
||
<span id="drawResultText"></span>
|
||
<span id="drawResultTotal" class="ml-2 text-gray-500"></span>
|
||
<span id="drawResultType" class="ml-2"></span>
|
||
</p>
|
||
</div>
|
||
|
||
<div class="pt-4 border-t border-gray-100">
|
||
<button
|
||
type="button"
|
||
id="submitDrawPeriodBtn"
|
||
class="w-full bg-primary hover:bg-primary/90 text-white px-4 py-2.5 rounded-lg shadow hover:shadow-md transition-all duration-200 flex items-center justify-center"
|
||
>
|
||
<i class="fas fa-check mr-2"></i>
|
||
确认录入
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="/Static/js/admin.js"></script>
|
||
<script>
|
||
layui.use(['layer'], function() {
|
||
var layer = layui.layer;
|
||
|
||
// 获取元素
|
||
const closeDrawPeriodBtn = document.getElementById('closeDrawPeriodBtn');
|
||
const drawPeriodBackdrop = document.getElementById('drawPeriodBackdrop');
|
||
const drawPeriodModal = document.getElementById('drawPeriodModal');
|
||
const drawPeriodForm = document.getElementById('drawPeriodForm');
|
||
const submitDrawPeriodBtn = document.getElementById('submitDrawPeriodBtn');
|
||
const drawDice1 = document.getElementById('drawDice1');
|
||
const drawDice2 = document.getElementById('drawDice2');
|
||
const drawDice3 = document.getElementById('drawDice3');
|
||
const drawResultPreview = document.getElementById('drawResultPreview');
|
||
const drawResultText = document.getElementById('drawResultText');
|
||
const drawResultTotal = document.getElementById('drawResultTotal');
|
||
const drawResultType = document.getElementById('drawResultType');
|
||
|
||
// 打开录入开奖模态框
|
||
function openDrawPeriodModal(periodId) {
|
||
fetch(`/admin/periods/${periodId}`)
|
||
.then(res => res.json())
|
||
.then(data => {
|
||
if (data.success) {
|
||
const period = data.data;
|
||
document.getElementById('drawPeriodId').value = period.id;
|
||
document.getElementById('drawPeriodNumber').textContent = period.period_number;
|
||
|
||
// 获取游戏类型
|
||
const gameId = period.game_id;
|
||
|
||
// 获取游戏信息（包括类型）
|
||
fetch(`/admin/games/${gameId}`)
|
||
.then(res => res.json())
|
||
.then(gameData => {
|
||
if (gameData.success && gameData.data) {
|
||
const gameType = gameData.data.type || 'dice';
|
||
document.getElementById('drawGameType').value = gameType;
|
||
|
||
// 根据游戏类型显示不同的输入界面
|
||
const diceSection = document.getElementById('diceInputSection');
|
||
const xocdiaSection = document.getElementById('xocdiaInputSection');
|
||
|
||
if (gameType === 'xocdia') {
|
||
diceSection.classList.add('hidden');
|
||
xocdiaSection.classList.remove('hidden');
|
||
// 清空骰子输入
|
||
drawDice1.value = '';
|
||
drawDice2.value = '';
|
||
drawDice3.value = '';
|
||
|
||
// 如果已有开奖结果，填充硬币颜色
|
||
if (period.result) {
|
||
try {
|
||
const coins = JSON.parse(period.result);
|
||
if (Array.isArray(coins) && coins.length === 4) {
|
||
document.getElementById('coin1').value = coins[0];
|
||
document.getElementById('coin2').value = coins[1];
|
||
document.getElementById('coin3').value = coins[2];
|
||
document.getElementById('coin4').value = coins[3];
|
||
}
|
||
} catch (e) {
|
||
// 忽略解析错误
|
||
}
|
||
}
|
||
} else {
|
||
diceSection.classList.remove('hidden');
|
||
xocdiaSection.classList.add('hidden');
|
||
// 填充已有的骰子数据
|
||
drawDice1.value = period.dice1 || '';
|
||
drawDice2.value = period.dice2 || '';
|
||
drawDice3.value = period.dice3 || '';
|
||
}
|
||
|
||
updateDrawPreview();
|
||
|
||
// 游戏类型设置完成后再打开模态框
|
||
drawPeriodBackdrop.classList.remove('opacity-0', 'pointer-events-none');
|
||
drawPeriodModal.classList.remove('invisible', 'pointer-events-none', 'scale-95');
|
||
drawPeriodModal.classList.add('scale-100');
|
||
} else {
|
||
layer.msg('获取游戏信息失败', {icon: 2});
|
||
}
|
||
})
|
||
.catch(e => {
|
||
layer.msg('获取游戏信息失败：' + e.message, {icon: 2});
|
||
});
|
||
} else {
|
||
layer.msg(data.message || '获取期号信息失败', {icon: 2});
|
||
}
|
||
})
|
||
.catch(e => {
|
||
layer.msg('获取期号信息失败：' + e.message, {icon: 2});
|
||
});
|
||
}
|
||
|
||
// 关闭录入开奖模态框
|
||
function closeDrawPeriodModal() {
|
||
drawPeriodBackdrop.classList.add('opacity-0', 'pointer-events-none');
|
||
drawPeriodModal.classList.add('invisible', 'pointer-events-none', 'scale-95');
|
||
drawPeriodModal.classList.remove('scale-100');
|
||
drawPeriodForm.reset();
|
||
drawResultPreview.classList.add('hidden');
|
||
}
|
||
|
||
// 更新开奖结果预览
|
||
function updateDrawPreview() {
|
||
const d1 = parseInt(drawDice1.value) || 0;
|
||
const d2 = parseInt(drawDice2.value) || 0;
|
||
const d3 = parseInt(drawDice3.value) || 0;
|
||
|
||
if (d1 >= 1 && d1 <= 6 && d2 >= 1 && d2 <= 6 && d3 >= 1 && d3 <= 6) {
|
||
const total = d1 + d2 + d3;
|
||
let result = '';
|
||
let resultClass = '';
|
||
|
||
// 检查是否为爆子
|
||
if (d1 === d2 && d2 === d3) {
|
||
result = 'Bão';
|
||
resultClass = 'bg-green-100 text-green-700 px-2 py-1 rounded text-sm';
|
||
} else if (total >= 4 && total <= 10) {
|
||
result = 'Xỉu';
|
||
resultClass = 'bg-blue-100 text-blue-700 px-2 py-1 rounded text-sm';
|
||
} else {
|
||
result = 'Tài';
|
||
resultClass = 'bg-red-100 text-red-700 px-2 py-1 rounded text-sm';
|
||
}
|
||
|
||
drawResultText.textContent = `${d1}.${d2}.${d3}`;
|
||
drawResultTotal.textContent = `(总和: ${total})`;
|
||
drawResultType.innerHTML = `<span class="${resultClass}">${result}</span>`;
|
||
drawResultPreview.classList.remove('hidden');
|
||
} else {
|
||
drawResultPreview.classList.add('hidden');
|
||
}
|
||
}
|
||
|
||
// 提交录入开奖
|
||
async function submitDrawPeriod() {
|
||
const gameType = document.getElementById('drawGameType').value;
|
||
const data = {
|
||
id: document.getElementById('drawPeriodId').value,
|
||
auto: false
|
||
};
|
||
|
||
console.log('=== 开奖提交调试信息 ===');
|
||
console.log('游戏类型:', gameType);
|
||
console.log('期号ID:', data.id);
|
||
|
||
// 根据游戏类型收集数据
|
||
if (gameType === 'xocdia') {
|
||
// Xóc Đĩa: 收集硬币颜色
|
||
const coins = [
|
||
document.getElementById('coin1').value,
|
||
document.getElementById('coin2').value,
|
||
document.getElementById('coin3').value,
|
||
document.getElementById('coin4').value
|
||
];
|
||
data.coins = coins;
|
||
console.log('硬币颜色:', coins);
|
||
} else {
|
||
// 骰子游戏: 收集骰子点数
|
||
const dice1 = parseInt(drawDice1.value);
|
||
const dice2 = parseInt(drawDice2.value);
|
||
const dice3 = parseInt(drawDice3.value);
|
||
|
||
if (!dice1 || !dice2 || !dice3 || dice1 < 1 || dice1 > 6 || dice2 < 1 || dice2 > 6 || dice3 < 1 || dice3 > 6) {
|
||
layer.msg('请输入有效的骰子点数（1-6）', {icon: 2});
|
||
return;
|
||
}
|
||
|
||
data.dice1 = dice1;
|
||
data.dice2 = dice2;
|
||
data.dice3 = dice3;
|
||
console.log('骰子点数:', dice1, dice2, dice3);
|
||
}
|
||
|
||
console.log('发送的数据:', JSON.stringify(data));
|
||
|
||
submitDrawPeriodBtn.disabled = true;
|
||
submitDrawPeriodBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i>录入中...';
|
||
|
||
try {
|
||
const response = await fetch('/admin/periods/draw', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
},
|
||
body: JSON.stringify(data)
|
||
});
|
||
|
||
const result = await response.json();
|
||
console.log('服务器响应:', result);
|
||
|
||
if (result.success) {
|
||
layer.msg(result.message || '开奖结果录入成功', {icon: 1}, function() {
|
||
location.reload();
|
||
});
|
||
} else {
|
||
layer.msg(result.message || '录入失败', {icon: 2});
|
||
submitDrawPeriodBtn.disabled = false;
|
||
submitDrawPeriodBtn.innerHTML = '<i class="fas fa-check mr-2"></i>确认录入';
|
||
}
|
||
} catch (e) {
|
||
console.error('提交错误:', e);
|
||
layer.msg('录入失败：' + e.message, {icon: 2});
|
||
submitDrawPeriodBtn.disabled = false;
|
||
submitDrawPeriodBtn.innerHTML = '<i class="fas fa-check mr-2"></i>确认录入';
|
||
}
|
||
}
|
||
|
||
// 封盘
|
||
async function lockPeriod(id) {
|
||
layer.confirm('确定要封盘吗？封盘后将无法继续投注。', {icon: 3, title: '确认封盘'}, async function(index) {
|
||
layer.close(index);
|
||
|
||
try {
|
||
const response = await fetch('/admin/periods/lock', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
},
|
||
body: JSON.stringify({id: id})
|
||
});
|
||
|
||
const result = await response.json();
|
||
|
||
if (result.success) {
|
||
layer.msg(result.message || '封盘成功', {icon: 1}, function() {
|
||
location.reload();
|
||
});
|
||
} else {
|
||
layer.msg(result.message || '封盘失败', {icon: 2});
|
||
}
|
||
} catch (e) {
|
||
layer.msg('封盘失败：' + e.message, {icon: 2});
|
||
}
|
||
});
|
||
}
|
||
|
||
// 确认结算
|
||
async function settlePeriod(id) {
|
||
layer.confirm('确定要确认结算吗？结算后将自动创建下一期，此操作不可撤销。', {icon: 3, title: '确认结算'}, async function(index) {
|
||
layer.close(index);
|
||
|
||
try {
|
||
const response = await fetch('/admin/periods/settle', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
},
|
||
body: JSON.stringify({id: id})
|
||
});
|
||
|
||
const result = await response.json();
|
||
|
||
if (result.success) {
|
||
layer.msg(result.message || '结算成功', {icon: 1}, function() {
|
||
location.reload();
|
||
});
|
||
} else {
|
||
layer.msg(result.message || '结算失败', {icon: 2});
|
||
}
|
||
} catch (e) {
|
||
layer.msg('结算失败：' + e.message, {icon: 2});
|
||
}
|
||
});
|
||
}
|
||
|
||
// 开始下注
|
||
async function startPeriod(event) {
|
||
// 从按钮的 data-game-id 属性获取游戏ID
|
||
const gameId = event.currentTarget.getAttribute('data-game-id');
|
||
|
||
if (!gameId) {
|
||
layer.msg('游戏ID缺失', {icon: 2});
|
||
return;
|
||
}
|
||
|
||
layer.confirm('确定要开始新一期下注吗？', {icon: 3, title: '开始下注'}, async function(index) {
|
||
layer.close(index);
|
||
|
||
try {
|
||
const response = await fetch('/admin/periods/start', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
'X-Requested-With': 'XMLHttpRequest'
|
||
},
|
||
body: JSON.stringify({game_id: parseInt(gameId)})
|
||
});
|
||
|
||
const result = await response.json();
|
||
|
||
if (result.success) {
|
||
layer.msg(result.message || '启动成功', {icon: 1}, function() {
|
||
location.reload();
|
||
});
|
||
} else {
|
||
layer.msg(result.message || '启动失败', {icon: 2});
|
||
}
|
||
} catch (e) {
|
||
layer.msg('启动失败：' + e.message, {icon: 2});
|
||
}
|
||
});
|
||
}
|
||
|
||
// 绑定事件
|
||
if (closeDrawPeriodBtn) {
|
||
closeDrawPeriodBtn.addEventListener('click', closeDrawPeriodModal);
|
||
}
|
||
if (drawPeriodBackdrop) {
|
||
drawPeriodBackdrop.addEventListener('click', closeDrawPeriodModal);
|
||
}
|
||
if (submitDrawPeriodBtn) {
|
||
submitDrawPeriodBtn.addEventListener('click', submitDrawPeriod);
|
||
}
|
||
|
||
// 骰子输入监听
|
||
if (drawDice1 && drawDice2 && drawDice3) {
|
||
[drawDice1, drawDice2, drawDice3].forEach(input => {
|
||
input.addEventListener('input', updateDrawPreview);
|
||
});
|
||
}
|
||
|
||
// 事件委托：列表操作按钮
|
||
const periodList = document.getElementById('periodList');
|
||
if (periodList) {
|
||
periodList.addEventListener('click', function(e) {
|
||
const lockBtn = e.target.closest('.period-lock-btn');
|
||
const drawBtn = e.target.closest('.period-draw-btn');
|
||
const settleBtn = e.target.closest('.period-settle-btn');
|
||
|
||
if (lockBtn) {
|
||
const id = lockBtn.getAttribute('data-id');
|
||
if (id) lockPeriod(id);
|
||
}
|
||
if (drawBtn) {
|
||
const id = drawBtn.getAttribute('data-id');
|
||
if (id) openDrawPeriodModal(id);
|
||
}
|
||
if (settleBtn) {
|
||
const id = settleBtn.getAttribute('data-id');
|
||
if (id) settlePeriod(id);
|
||
}
|
||
});
|
||
}
|
||
|
||
// 当前期号操作按钮（如果在页面中存在）
|
||
document.querySelectorAll('.period-lock-btn').forEach(btn => {
|
||
if (!btn.closest('#periodList')) {
|
||
btn.addEventListener('click', function() {
|
||
const id = this.getAttribute('data-id');
|
||
if (id) lockPeriod(id);
|
||
});
|
||
}
|
||
});
|
||
|
||
document.querySelectorAll('.period-draw-btn').forEach(btn => {
|
||
if (!btn.closest('#periodList')) {
|
||
btn.addEventListener('click', function() {
|
||
const id = this.getAttribute('data-id');
|
||
if (id) openDrawPeriodModal(id);
|
||
});
|
||
}
|
||
});
|
||
|
||
document.querySelectorAll('.period-settle-btn').forEach(btn => {
|
||
if (!btn.closest('#periodList')) {
|
||
btn.addEventListener('click', function() {
|
||
const id = this.getAttribute('data-id');
|
||
if (id) settlePeriod(id);
|
||
});
|
||
}
|
||
});
|
||
|
||
// Start Button
|
||
document.querySelectorAll('.period-start-btn').forEach(btn => {
|
||
btn.addEventListener('click', startPeriod);
|
||
});
|
||
});
|
||
</script>
|
||
|