ysc/thebet365
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(i18n): 管理端与玩家端三语支持（中/英/马来语）

Browse Source 
- 管理后台 adminT 文案库、结算与代理端页面、表单校验
- 玩家端 vue-i18n 补全首页/公告/串关与 ms 文案
- Element Plus ms 语言包与共享 locale 工具
This commit is contained in:
Mars
2026-06-03 15:05:36 +08:00
parent 80adc0e928
commit cbfa18d1d3
63 changed files with 3081 additions and 1038 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
apps/admin/src/views/agent/Bets.vue
View File

@@ -1,9 +1,12 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { useAdminLocale } from '../../composables/useAdminLocale';
import api from '../../api';
import { formatAmount } from '../../utils/format-amount';
import { betStatusLabel, betStatusTagType, betTypeLabel } from '../../utils/bet-labels';
const { t } = useAdminLocale();
interface BetRow {
id: string;
betNo: string;
@@ -44,23 +47,23 @@ function onSizeChange(size: number) {
<template>
<div class="admin-list-page">
<div class="page-header">
<h2 class="page-title">注单查询</h2>
<span class="page-desc">下级玩家的全部投注记录</span>
<h2 class="page-title">{{ t('page.agent_bets.title') }}</h2>
<span class="page-desc">{{ t('page.agent_bets.desc') }}</span>
</div>
<el-card class="data-card" shadow="never">
<div class="table-wrap">
<el-table :data="bets" stripe>
<el-table-column prop="id" label="单号" width="56" align="center" />
<el-table-column prop="betNo" label="流水编号" width="168" show-overflow-tooltip>
<el-table-column prop="id" :label="t('bet.col.serial')" width="56" align="center" />
<el-table-column prop="betNo" :label="t('bet.col.bet_no')" width="168" show-overflow-tooltip>
<template #default="{ row }">
<span class="bet-no">{{ row.betNo }}</span>
</template>
</el-table-column>
<el-table-column label="玩家" min-width="100">
<el-table-column :label="t('bet.col.player')" min-width="100">
<template #default="{ row }">{{ row.user?.username ?? '—' }}</template>
</el-table-column>
<el-table-column label="类型" width="88" align="center">
<el-table-column :label="t('common.type')" width="88" align="center">
<template #default="{ row }">
<el-tag v-if="row.betType" type="info" size="small" effect="plain">
{{ betTypeLabel(row.betType) }}
@@ -68,10 +71,10 @@ function onSizeChange(size: number) {
<span v-else>—</span>
</template>
</el-table-column>
<el-table-column label="投注额" width="110" align="right">
<el-table-column :label="t('bet.col.stake')" width="110" align="right">
<template #default="{ row }">{{ formatAmount(row.stake) }}</template>
</el-table-column>
<el-table-column label="状态" width="96" align="center">
<el-table-column :label="t('common.status')" width="96" align="center">
<template #default="{ row }">
<el-tag :type="betStatusTagType(row.status)" size="small">
{{ betStatusLabel(row.status) }}

58
apps/admin/src/views/agent/Dashboard.vue
View File

@@ -2,7 +2,9 @@
import { ref, onMounted } from 'vue';
import api from '../../api';
import { formatAmount } from '../../utils/format-amount';
import { useAdminLocale } from '../../composables/useAdminLocale';
const { t, localeTag } = useAdminLocale();
const summary = ref<Record<string, unknown>>({});
onMounted(async () => {
@@ -11,55 +13,55 @@ onMounted(async () => {
});
function fmtCount(val: unknown) {
return (Number(val) || 0).toLocaleString('zh-CN', { maximumFractionDigits: 0 });
return (Number(val) || 0).toLocaleString(localeTag.value, { maximumFractionDigits: 0 });
}
</script>
<template>
<div class="page-header">
<h2 class="page-title">代理概览</h2>
<span class="page-desc">实时数据总览</span>
<h2 class="page-title">{{ t('page.agent_dash.title') }}</h2>
<span class="page-desc">{{ t('page.agent_dash.desc') }}</span>
</div>
<el-row :gutter="20" class="stat-row">
<el-col :span="6">
<div class="stat-card c-blue">
<div class="stat-top">
<span class="stat-label">授信额度</span>
<span class="stat-label">{{ t('agent.credit_limit') }}</span>
<span class="stat-badge">¥</span>
</div>
<div class="stat-value">{{ formatAmount((summary.profile as { creditLimit?: string })?.creditLimit) }}</div>
<div class="stat-foot">总额度</div>
<div class="stat-foot">{{ t('agent.credit_total') }}</div>
</div>
</el-col>
<el-col :span="6">
<div class="stat-card c-orange">
<div class="stat-top">
<span class="stat-label">已用额度</span>
<span class="stat-label">{{ t('agent.credit_used') }}</span>
<span class="stat-badge">¥</span>
</div>
<div class="stat-value">{{ formatAmount((summary.profile as { usedCredit?: string })?.usedCredit) }}</div>
<div class="stat-foot">已占用</div>
<div class="stat-foot">{{ t('agent.credit_occupied') }}</div>
</div>
</el-col>
<el-col :span="6">
<div class="stat-card c-green">
<div class="stat-top">
<span class="stat-label">直属玩家</span>
<span class="stat-badge">人</span>
<span class="stat-label">{{ t('agent.direct_players') }}</span>
<span class="stat-badge">{{ t('common.people') }}</span>
</div>
<div class="stat-value">{{ fmtCount(summary.directPlayerCount) }}</div>
<div class="stat-foot">玩家数</div>
<div class="stat-foot">{{ t('agent.player_count') }}</div>
</div>
</el-col>
<el-col :span="6">
<div class="stat-card c-purple">
<div class="stat-top">
<span class="stat-label">今日投注</span>
<span class="stat-label">{{ t('agent.today_stake') }}</span>
<span class="stat-badge">¥</span>
</div>
<div class="stat-value">{{ formatAmount(summary.todayStake) }}</div>
<div class="stat-foot">人民币</div>
<div class="stat-foot">{{ t('agent.currency_cny') }}</div>
</div>
</el-col>
</el-row>
@@ -78,27 +80,13 @@ function fmtCount(val: unknown) {
backdrop-filter: blur(10px);
}
.stat-card:hover { transform: translateY(-2px); border-color: #2a2a2a; }
.stat-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.stat-label { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.stat-badge { width: 30px; height: 30px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.stat-value { font-size: 28px; font-weight: 800; line-height: 1; margin-bottom: 8px; letter-spacing: -1px; }
.stat-foot { font-size: 11px; opacity: 0.4; font-weight: 600; letter-spacing: 0.04em; }
.c-blue { background: rgba(22,78,180,0.1); color: #60a5fa; }
.c-blue .stat-badge { background: rgba(96,165,250,0.12); color: #60a5fa; }
.c-orange { background: rgba(180,80,0,0.1); color: #fb923c; }
.c-orange .stat-badge { background: rgba(251,146,60,0.12); color: #fb923c; }
.c-green {
background: linear-gradient(145deg, rgba(36, 143, 84, 0.18), rgba(20, 92, 56, 0.08));
border: 1px solid var(--green-border);
color: var(--green-text);
}
.c-green .stat-badge {
background: var(--primary-grad);
border: 1px solid var(--green-border);
color: #fff;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.c-purple { background: rgba(100,40,200,0.1); color: #a78bfa; }
.c-purple .stat-badge { background: rgba(167,139,250,0.12); color: #a78bfa; }
.stat-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.stat-label { font-size: 12px; color: #666; font-weight: 600; }
.stat-badge { font-size: 11px; color: #444; }
.stat-value { font-size: 26px; font-weight: 800; color: var(--green-text); margin-bottom: 6px; }
.stat-foot { font-size: 11px; color: #444; }
.c-blue { background: linear-gradient(135deg, rgba(96, 165, 250, 0.08), transparent); }
.c-orange { background: linear-gradient(135deg, rgba(251, 146, 60, 0.08), transparent); }
.c-green { background: linear-gradient(135deg, rgba(36, 143, 84, 0.1), transparent); }
.c-purple { background: linear-gradient(135deg, rgba(167, 139, 250, 0.08), transparent); }
</style>

131
apps/admin/src/views/agent/Players.vue
View File

@@ -1,9 +1,12 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { useAdminLocale } from '../../composables/useAdminLocale';
import api from '../../api';
import { ElMessage } from 'element-plus';
import { formatAmount, formatAmountFull } from '../../utils/format-amount';
const { t } = useAdminLocale();
const players = ref<unknown[]>([]);
const form = ref({ username: '', password: 'Player@123' });
const depositForm = ref({ playerId: '', amount: 100, requestId: '' });
@@ -17,7 +20,7 @@ async function load() {
async function create() {
await api.post('/agent/players', form.value);
ElMessage.success('玩家已创建');
ElMessage.success(t('msg.player_created'));
load();
}
@@ -27,7 +30,7 @@ async function deposit() {
amount: depositForm.value.amount,
requestId: depositForm.value.requestId,
});
ElMessage.success('上分成功');
ElMessage.success(t('msg.topup_ok'));
load();
}
@@ -36,75 +39,77 @@ async function withdraw(playerId: string, amount: number) {
amount,
requestId: `wd-${Date.now()}`,
});
ElMessage.success('下分成功');
ElMessage.success(t('msg.withdraw_ok'));
load();
}
</script>
<template>
<div class="admin-list-page">
<div class="page-header">
<h2 class="page-title">直属玩家</h2>
<span class="page-desc">管理你名下的直属玩家</span>
</div>
<el-card class="tool-card" shadow="never">
<div class="tool-row">
<div class="tool-section">
<div class="tool-section-title">创建玩家</div>
<el-form inline>
<el-form-item label="用户名">
<el-input v-model="form.username" placeholder="输入用户名" style="width: 150px" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="create">+ 创建玩家</el-button>
</el-form-item>
</el-form>
</div>
<div class="tool-divider" />
<div class="tool-section">
<div class="tool-section-title">上分操作</div>
<el-form inline>
<el-form-item label="玩家ID">
<el-input v-model="depositForm.playerId" placeholder="玩家ID" style="width: 110px" />
</el-form-item>
<el-form-item label="金额">
<el-input-number v-model="depositForm.amount" :min="1" style="width: 130px" />
</el-form-item>
<el-form-item>
<el-button type="success" @click="deposit">上分</el-button>
</el-form-item>
</el-form>
</div>
<div class="page-header">
<h2 class="page-title">{{ t('page.agent_players.title') }}</h2>
<span class="page-desc">{{ t('page.agent_players.desc') }}</span>
</div>
</el-card>
<el-card class="data-card" shadow="never">
<div class="table-wrap">
<el-table :data="players" stripe>
<el-table-column prop="id" label="ID" width="80" />
<el-table-column prop="username" label="用户名" min-width="120" />
<el-table-column label="可用余额" min-width="100" align="right">
<template #default="{ row }">
<template v-if="(row as { wallet?: { availableBalance: string } }).wallet?.availableBalance != null">
<el-tooltip
:content="formatAmountFull((row as { wallet: { availableBalance: string } }).wallet.availableBalance)"
placement="top"
>
<span>{{ formatAmount((row as { wallet: { availableBalance: string } }).wallet.availableBalance) }}</span>
</el-tooltip>
</template>
<span v-else>—</span>
</template>
</el-table-column>
<el-table-column label="操作" width="120" align="center">
<template #default="{ row }">
<el-button size="small" type="warning" plain @click="withdraw((row as { id: string }).id, 50)">下分 50</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<el-card class="tool-card" shadow="never">
<div class="tool-row">
<div class="tool-section">
<div class="tool-section-title">{{ t('agent_portal.create_player_section') }}</div>
<el-form inline>
<el-form-item :label="t('user.col.username')">
<el-input v-model="form.username" :placeholder="t('agent_portal.username_ph')" style="width: 150px" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="create">{{ t('agent_portal.create_player_btn') }}</el-button>
</el-form-item>
</el-form>
</div>
<div class="tool-divider" />
<div class="tool-section">
<div class="tool-section-title">{{ t('agent_portal.deposit_section') }}</div>
<el-form inline>
<el-form-item :label="t('user.field.player_id')">
<el-input v-model="depositForm.playerId" :placeholder="t('agent_portal.player_id_ph')" style="width: 110px" />
</el-form-item>
<el-form-item :label="t('user.field.amount')">
<el-input-number v-model="depositForm.amount" :min="1" style="width: 130px" />
</el-form-item>
<el-form-item>
<el-button type="success" @click="deposit">{{ t('common.topup') }}</el-button>
</el-form-item>
</el-form>
</div>
</div>
</el-card>
<el-card class="data-card" shadow="never">
<div class="table-wrap">
<el-table :data="players" stripe>
<el-table-column prop="id" :label="t('common.col_id')" width="80" />
<el-table-column prop="username" :label="t('user.col.username')" min-width="120" />
<el-table-column :label="t('user.field.available')" min-width="100" align="right">
<template #default="{ row }">
<template v-if="(row as { wallet?: { availableBalance: string } }).wallet?.availableBalance != null">
<el-tooltip
:content="formatAmountFull((row as { wallet: { availableBalance: string } }).wallet.availableBalance)"
placement="top"
>
<span>{{ formatAmount((row as { wallet: { availableBalance: string } }).wallet.availableBalance) }}</span>
</el-tooltip>
</template>
<span v-else>—</span>
</template>
</el-table-column>
<el-table-column :label="t('common.actions')" width="120" align="center">
<template #default="{ row }">
<el-button size="small" type="warning" plain @click="withdraw((row as { id: string }).id, 50)">
{{ t('agent_portal.withdraw_btn', { amount: 50 }) }}
</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
</div>
</template>

91
apps/admin/src/views/agent/SubAgents.vue
View File

@@ -1,9 +1,12 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { useAdminLocale } from '../../composables/useAdminLocale';
import api from '../../api';
import { ElMessage } from 'element-plus';
import { formatAmount, formatAmountFull } from '../../utils/format-amount';
const { t } = useAdminLocale();
const agents = ref<unknown[]>([]);
const form = ref({ username: '', password: 'Agent@123', creditLimit: 10000 });
@@ -16,57 +19,57 @@ async function load() {
async function create() {
await api.post('/agent/agents', form.value);
ElMessage.success('下级代理已创建');
ElMessage.success(t('msg.agent_sub_created'));
load();
}
</script>
<template>
<div class="admin-list-page">
<div class="page-header">
<h2 class="page-title">下级代理</h2>
<span class="page-desc">仅一级代理可见</span>
</div>
<el-card class="tool-card" shadow="never">
<el-form inline>
<el-form-item label="用户名">
<el-input v-model="form.username" placeholder="代理用户名" style="width: 150px" />
</el-form-item>
<el-form-item label="授信额度">
<el-input-number v-model="form.creditLimit" :min="0" :step="1000" style="width: 150px" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="create">+ 创建二级代理</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card class="data-card" shadow="never">
<div class="table-wrap">
<el-table :data="agents" stripe>
<el-table-column label="用户名" min-width="140">
<template #default="{ row }">
{{ (row as { user?: { username: string } }).user?.username }}
</template>
</el-table-column>
<el-table-column label="授信额度" min-width="100" align="right">
<template #default="{ row }">
<el-tooltip :content="formatAmountFull((row as { creditLimit: string }).creditLimit)" placement="top">
<span>{{ formatAmount((row as { creditLimit: string }).creditLimit) }}</span>
</el-tooltip>
</template>
</el-table-column>
<el-table-column label="已用额度" min-width="100" align="right">
<template #default="{ row }">
<el-tooltip :content="formatAmountFull((row as { usedCredit: string }).usedCredit)" placement="top">
<span>{{ formatAmount((row as { usedCredit: string }).usedCredit) }}</span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<div class="page-header">
<h2 class="page-title">{{ t('page.agent_sub.title') }}</h2>
<span class="page-desc">{{ t('page.agent_sub.desc') }}</span>
</div>
</el-card>
<el-card class="tool-card" shadow="never">
<el-form inline>
<el-form-item :label="t('user.col.username')">
<el-input v-model="form.username" :placeholder="t('agent_portal.agent_username_ph')" style="width: 150px" />
</el-form-item>
<el-form-item :label="t('agent.field.credit_limit')">
<el-input-number v-model="form.creditLimit" :min="0" :step="1000" style="width: 150px" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="create">{{ t('agent_portal.create_tier2_btn') }}</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card class="data-card" shadow="never">
<div class="table-wrap">
<el-table :data="agents" stripe>
<el-table-column :label="t('user.col.username')" min-width="140">
<template #default="{ row }">
{{ (row as { user?: { username: string } }).user?.username }}
</template>
</el-table-column>
<el-table-column :label="t('agent.field.credit_limit')" min-width="100" align="right">
<template #default="{ row }">
<el-tooltip :content="formatAmountFull((row as { creditLimit: string }).creditLimit)" placement="top">
<span>{{ formatAmount((row as { creditLimit: string }).creditLimit) }}</span>
</el-tooltip>
</template>
</el-table-column>
<el-table-column :label="t('agent.field.used_credit')" min-width="100" align="right">
<template #default="{ row }">
<el-tooltip :content="formatAmountFull((row as { usedCredit: string }).usedCredit)" placement="top">
<span>{{ formatAmount((row as { usedCredit: string }).usedCredit) }}</span>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
</div>
</template>