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

feat: 管理端 RBAC 权限体系与员工管理

Browse Source 
新增多角色权限控制（赛事/财务/客服管理员），支持员工 CRUD、路由菜单按权限显隐、审计日志范围过滤；登录返回角色与权限列表。玩家端赛事列表增加静默刷新避免图片闪烁。Seed 补充演示员工账号与充值相关权限。附带 RBAC/审计范围单元测试及 UAT 文档更新。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Mars
2026-06-15 17:52:39 +08:00
parent be5b4a4921
commit 567ec9ec8a
44 changed files with 1717 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
apps/admin/src/views/AgentManager.vue
View File

@@ -7,8 +7,33 @@ import { resolveFormError, resolveApiError } from '../i18n/form-validation';
import api from '../api';
import { clearStaffSession } from '../stores/auth';
import { usePermissions } from '../composables/usePermissions';
import { AdminPerm } from '../constants/permissions';
const { t, localeTag } = useAdminLocale();
const router = useRouter();
const { hasPermission, role: staffRole } = usePermissions();
const canViewAgents = computed(() => hasPermission(AdminPerm.agentsView));
const canViewUsers = computed(() => hasPermission(AdminPerm.usersView));
const canCreateUsers = computed(() => hasPermission(AdminPerm.usersCreate));
const canCreateAgents = computed(() => hasPermission(AdminPerm.agentsCreate));
const canResetPassword = computed(() => hasPermission(AdminPerm.usersResetPassword));
const canDeposit = computed(() => hasPermission(AdminPerm.walletDeposit));
const canWithdraw = computed(() => hasPermission(AdminPerm.walletWithdraw));
const canAdjustCredit = computed(() => hasPermission(AdminPerm.agentsCredit));
const canManageSettings = computed(() => hasPermission(AdminPerm.settings));
const canEditPlayerProfile = computed(() => canCreateUsers.value);
const playerActionsReadOnly = computed(
() => canViewUsers.value && !canCreateUsers.value && !canDeposit.value && !canWithdraw.value,
);
const playerActionFlags = computed(() => ({
showEdit: canViewUsers.value && (canEditPlayerProfile.value || canResetPassword.value),
showDeposit: canDeposit.value,
showWithdraw: canWithdraw.value,
showFreeze: canEditPlayerProfile.value,
showDelete: canEditPlayerProfile.value,
}));
import {
emptyPlayerCreateForm,
@@ -387,9 +412,15 @@ function resolveCreateParentLabel(agentId: string) {
/* ─── Init ─── */
onMounted(() => {
void loadUsersPageInit();
loadAllPlayers();
loadTier1Agents();
if (canManageSettings.value) {
void loadUsersPageInit();
}
if (canViewUsers.value) {
loadAllPlayers();
}
if (canViewAgents.value) {
loadTier1Agents();
}
});
async function loadUsersPageInit() {
@@ -980,6 +1011,37 @@ async function submitEditPlayer() {
ElMessage.warning(t('err.password_min'));
return;
}
const newPwd = editPlayerForm.value.newPassword.trim();
const passwordOnly =
newPwd &&
!canEditPlayerProfile.value &&
canResetPassword.value &&
!editPlayerForm.value.useCustomCashback;
if (passwordOnly) {
editPlayerLoading.value = true;
try {
const { data } = await api.post(`/admin/users/${editingId.value}/reset-password`, {
password: newPwd,
});
const plain = data.data?.password ?? newPwd;
editPlayerForm.value.managedPassword = plain;
editPlayerForm.value.newPassword = '';
ElMessage.success(t('user.msg.password_saved', { password: plain }));
} catch (e: unknown) {
const err = e as { response?: { data?: { error?: string } } };
ElMessage.error(err.response?.data?.error ?? t('msg.save_failed'));
} finally {
editPlayerLoading.value = false;
}
return;
}
if (!canEditPlayerProfile.value) {
ElMessage.warning(t('msg.save_failed'));
return;
}
try {
assertPlayerUsername(editPlayerForm.value.username);
} catch (e) {
@@ -988,7 +1050,6 @@ async function submitEditPlayer() {
}
editPlayerLoading.value = true;
try {
const newPwd = editPlayerForm.value.newPassword.trim();
const payload: Record<string, unknown> = {
username: editPlayerForm.value.username.trim(),
phone: editPlayerForm.value.phone.trim() || undefined,
@@ -1346,7 +1407,7 @@ function creditTypeLabel(type: string) {
<template>
<div class="admin-list-page agent-mgr-page">
<!-- ─── Global settings collapse ─── -->
<el-collapse v-model="settingsCollapseOpen" class="list-settings">
<el-collapse v-if="canManageSettings" v-model="settingsCollapseOpen" class="list-settings">
<el-collapse-item :title="t('user.page_settings')" name="settings">
<div class="list-settings-block">
<p class="list-settings-title">{{ t('user.global_settings') }}</p>
@@ -1438,12 +1499,12 @@ function creditTypeLabel(type: string) {
<InviteManageDialog v-model="inviteDialogOpen" />
<div class="mgr-tabs-shell">
<el-button type="primary" class="invite-prominent-btn" @click="inviteDialogOpen = true">
<el-button v-if="canManageSettings" type="primary" class="invite-prominent-btn" @click="inviteDialogOpen = true">
{{ t('invite.menu_btn') }}
</el-button>
<el-tabs v-model="activeViewTab" class="mgr-top-tabs mgr-top-tabs--with-invite">
<el-tabs v-model="activeViewTab" class="mgr-top-tabs" :class="{ 'mgr-top-tabs--with-invite': canManageSettings }">
<!-- ─── Tab: 全部玩家（默认） ─── -->
<el-tab-pane :label="`${t('user.type.player')} (${playerTotal})`" name="players">
<el-tab-pane v-if="canViewUsers" :label="`${t('user.type.player')} (${playerTotal})`" name="players">
<section class="list-panel player-list-panel">
<div class="list-panel-toolbar">
<el-form inline class="list-chrome__grow">
@@ -1456,7 +1517,7 @@ function creditTypeLabel(type: string) {
@keyup.enter="searchPlayers"
/>
</el-form-item>
<el-form-item :label="t('user.filter.agent')">
<el-form-item v-if="canViewAgents" :label="t('user.filter.agent')">
<el-select
v-model="playerFilterAgent"
:placeholder="t('user.filter.agent_ph')"
@@ -1487,7 +1548,7 @@ function creditTypeLabel(type: string) {
<el-button type="primary" @click="searchPlayers">{{ t('common.search') }}</el-button>
</el-form-item>
</el-form>
<div class="list-chrome__actions">
<div v-if="canCreateUsers" class="list-chrome__actions">
<el-button type="primary" @click="openCreateAccount">{{ t('user.create_btn') }}</el-button>
</div>
</div>
@@ -1530,6 +1591,7 @@ function creditTypeLabel(type: string) {
<el-table-column :label="t('common.actions')" min-width="340" align="center">
<template #default="{ row }">
<AdminPlayerRowActions
v-bind="playerActionFlags"
:row="row"
@detail="openDetailPlayer(row.id)"
@ledger="openPlayerWalletLedger(row.id, row.username)"
@@ -1559,7 +1621,7 @@ function creditTypeLabel(type: string) {
</el-tab-pane>
<!-- ─── Tab: 一级代理 ─── -->
<el-tab-pane :label="`${agentTierName(1)} (${tier1Total})`" name="tier1Agents">
<el-tab-pane v-if="canViewAgents" :label="`${agentTierName(1)} (${tier1Total})`" name="tier1Agents">
<section class="list-panel agent-list-panel">
<div class="list-panel-toolbar">
<el-form inline class="list-chrome__grow">
@@ -1576,7 +1638,7 @@ function creditTypeLabel(type: string) {
<el-button type="primary" @click="searchTier1Agents">{{ t('common.search') }}</el-button>
</el-form-item>
</el-form>
<div class="list-chrome__actions">
<div v-if="canCreateAgents" class="list-chrome__actions">
<el-button type="primary" @click="openCreateTier1Agent">{{ t('agent.create_btn') }}</el-button>
</div>
</div>
@@ -1638,6 +1700,7 @@ function creditTypeLabel(type: string) {
<el-table-column :label="t('common.actions')" min-width="320" align="center">
<template #default="{ row: player }">
<AdminPlayerRowActions
v-bind="playerActionFlags"
:row="player"
@detail="openDetailPlayer(player.id)"
@ledger="openPlayerWalletLedger(player.id, player.username)"
@@ -1709,6 +1772,7 @@ function creditTypeLabel(type: string) {
</el-tab-pane>
<!-- ─── Tab: L2+ 各级代理 ─── -->
<template v-if="canViewAgents">
<el-tab-pane
v-for="agentLevel in visibleSubAgentTabLevels"
:key="agentLevel"
@@ -1794,6 +1858,7 @@ function creditTypeLabel(type: string) {
<el-table-column :label="t('common.actions')" min-width="280" align="center">
<template #default="{ row: player }">
<AdminPlayerRowActions
v-bind="playerActionFlags"
:row="player"
@detail="openDetailPlayer(player.id)"
@ledger="openPlayerWalletLedger(player.id, player.username)"
@@ -1858,6 +1923,7 @@ function creditTypeLabel(type: string) {
</div>
</section>
</el-tab-pane>
</template>
</el-tabs>
</div>
@@ -2068,7 +2134,13 @@ function creditTypeLabel(type: string) {
</el-dialog>
<!-- ── Edit Player ── -->
<el-dialog v-model="editPlayerVisible" :title="t('user.dialog.edit')" width="560px" destroy-on-close class="user-edit-dialog">
<el-dialog
v-model="editPlayerVisible"
:title="canEditPlayerProfile ? t('user.dialog.edit') : t('user.field.reset_password')"
width="560px"
destroy-on-close
class="user-edit-dialog"
>
<el-form label-width="84px" size="small" class="compact-edit-form">
<div class="edit-meta">
<span>ID {{ editPlayerForm.id }}</span>
@@ -2078,11 +2150,20 @@ function creditTypeLabel(type: string) {
<div class="edit-form-section">
<div class="section-title">{{ t('user.section.basic_info') }}</div>
<el-form-item :label="t('user.col.username')">
<el-input v-model="editPlayerForm.username" :placeholder="t('user.ph.username_player')" />
<el-input
v-model="editPlayerForm.username"
:readonly="!canEditPlayerProfile"
:placeholder="t('user.ph.username_player')"
/>
<div class="field-hint">{{ t('user.hint.username_player') }}</div>
</el-form-item>
</div>
<div v-if="!canEditPlayerProfile" class="edit-form-section">
<div class="section-title">{{ t('user.section.affiliation') }}</div>
<el-tag size="small" type="info" class="affiliation-tag">{{ affiliationLabel(editPlayerForm) }}</el-tag>
</div>
<div class="edit-form-section">
<div class="password-mgmt-block">
<div class="block-title">{{ t('user.section.password_mgmt') }}</div>
@@ -2099,7 +2180,7 @@ function creditTypeLabel(type: string) {
</div>
</div>
<div class="edit-form-section">
<div v-if="canEditPlayerProfile" class="edit-form-section">
<div class="section-title">{{ t('user.section.affiliation') }}</div>
<el-form-item :label="t('user.col.agent')">
<el-tag size="small" type="info" class="affiliation-tag">{{ affiliationLabel(editPlayerForm) }}</el-tag>
@@ -2121,7 +2202,7 @@ function creditTypeLabel(type: string) {
</el-form-item>
</div>
<div class="edit-form-section">
<div v-if="canEditPlayerProfile" class="edit-form-section">
<div class="section-title">{{ t('user.section.contact') }}</div>
<el-row :gutter="12" class="contact-row">
<el-col :span="12">
@@ -2155,7 +2236,9 @@ function creditTypeLabel(type: string) {
</el-form>
<template #footer>
<el-button size="small" @click="editPlayerVisible = false">{{ t('common.cancel') }}</el-button>
<el-button size="small" type="primary" :loading="editPlayerLoading" @click="submitEditPlayer">{{ t('user.btn.save_profile') }}</el-button>
<el-button size="small" type="primary" :loading="editPlayerLoading" @click="submitEditPlayer">
{{ canEditPlayerProfile ? t('user.btn.save_profile') : t('user.field.reset_password') }}
</el-button>
</template>
</el-dialog>

62
apps/admin/src/views/Audit.vue
View File

@@ -12,13 +12,19 @@ interface AuditRow {
action: string;
module: string;
targetId: string | null;
operatorId: string | null;
operatorUsername: string | null;
operatorRole: string | null;
operatorUserType: string | null;
operatorType: string;
ipAddress: string | null;
createdAt: string;
}
const logs = ref<AuditRow[]>([]);
const total = ref(0);
const page = ref(1);
const pageSize = ref(10);
const pageSize = ref(20);
const filterModule = ref('');
onMounted(load);
@@ -56,6 +62,24 @@ function formatTime(v: string) {
second: '2-digit',
});
}
function operatorRoleLabel(row: AuditRow): string | null {
const code = row.operatorRole;
if (code === 'SUPER_ADMIN') return t('role.super_admin');
if (code === 'MATCH_ADMIN') return t('role.match_admin');
if (code === 'FINANCE_ADMIN') return t('role.finance_admin');
if (code === 'SUPPORT') return t('role.support');
if (row.operatorUserType === 'ADMIN' || row.operatorType === 'ADMIN') return t('role.admin');
if (row.operatorUserType === 'AGENT' || row.operatorType === 'AGENT') return t('role.agent');
if (row.operatorUserType === 'PLAYER' || row.operatorType === 'PLAYER') return t('audit.operator_player');
return null;
}
function operatorDisplay(row: AuditRow): string {
if (row.operatorUsername) return row.operatorUsername;
if (row.operatorType === 'SYSTEM') return t('audit.operator_system');
return '—';
}
</script>
<template>
@@ -79,19 +103,30 @@ function formatTime(v: string) {
<el-card class="data-card" shadow="never">
<div class="table-wrap">
<el-table :data="logs" stripe>
<el-table :key="locale" :data="logs" stripe>
<template #empty>
<AdminTableEmpty />
</template>
<el-table-column :label="t('audit.col.time')" min-width="168" fixed="left">
<template #default="{ row }">{{ formatTime(row.createdAt) }}</template>
</el-table-column>
<el-table-column :label="t('audit.col.operator')" min-width="160">
<template #default="{ row }">
<div class="operator-cell">
<span class="operator-name">{{ operatorDisplay(row) }}</span>
<span v-if="operatorRoleLabel(row)" class="operator-role">{{ operatorRoleLabel(row) }}</span>
</div>
</template>
</el-table-column>
<el-table-column :label="t('audit.col.action')" min-width="140">
<template #default="{ row }">{{ auditActionLabel(row.action) }}</template>
</el-table-column>
<el-table-column :label="t('audit.col.module')" width="120">
<template #default="{ row }">{{ auditModuleLabel(row.module) }}</template>
</el-table-column>
<el-table-column prop="targetId" :label="t('audit.col.target_id')" min-width="100" />
<el-table-column :label="t('audit.col.time')" min-width="160">
<template #default="{ row }">{{ formatTime(row.createdAt) }}</template>
<el-table-column prop="targetId" :label="t('audit.col.target_id')" min-width="100" show-overflow-tooltip />
<el-table-column :label="t('audit.col.ip')" min-width="120" show-overflow-tooltip>
<template #default="{ row }">{{ row.ipAddress ?? '—' }}</template>
</el-table-column>
</el-table>
</div>
@@ -114,4 +149,21 @@ function formatTime(v: string) {
<style scoped>
.filter-card { border-radius: 12px; }
.data-card { border-radius: 12px; }
.operator-cell {
display: flex;
flex-direction: column;
gap: 2px;
line-height: 1.35;
}
.operator-name {
font-weight: 500;
color: var(--el-text-color-primary);
}
.operator-role {
font-size: 12px;
color: var(--el-text-color-secondary);
}
</style>

10
apps/admin/src/views/Cashback.vue
View File

@@ -3,6 +3,8 @@ import { computed, onMounted, ref } from 'vue';
import type { TableColumnCtx } from 'element-plus';
import { ElMessage, ElMessageBox } from 'element-plus';
import { useAdminLocale } from '../composables/useAdminLocale';
import { usePermissions } from '../composables/usePermissions';
import { AdminPerm } from '../constants/permissions';
import { formatAmount, formatAmountFull } from '../utils/format-amount';
import { formatRatePercent } from '../utils/rate-percent';
import AdminTableEmpty from '../components/AdminTableEmpty.vue';
@@ -46,6 +48,8 @@ interface CashbackPreview {
}
const { t, localeTag } = useAdminLocale();
const { hasPermission } = usePermissions();
const canConfirmCashback = computed(() => hasPermission(AdminPerm.cashback));
const preview = ref<CashbackPreview | null>(null);
const rulesVisible = ref(false);
@@ -418,7 +422,7 @@ onMounted(loadHistory);
</el-table>
</div>
<div v-if="preview.batch.status === 'PREVIEW'" class="preview-actions">
<div v-if="preview.batch.status === 'PREVIEW' && canConfirmCashback" class="preview-actions">
<el-button type="success" :disabled="previewItems.length === 0" @click="confirm">
{{ t('cashback.confirm_issue') }}
</el-button>
@@ -484,7 +488,7 @@ onMounted(loadHistory);
<el-button link type="primary" @click="openDetail(row.id)">
{{ t('cashback.view_detail') }}
</el-button>
<template v-if="row.status === 'PREVIEW'">
<template v-if="row.status === 'PREVIEW' && canConfirmCashback">
<el-button link type="success" @click="confirmBatchId(row.id)">
{{ t('cashback.confirm_issue') }}
</el-button>
@@ -577,7 +581,7 @@ onMounted(loadHistory);
</el-table-column>
</el-table>
</div>
<div v-if="detail?.batch.status === 'PREVIEW'" class="detail-actions">
<div v-if="detail?.batch.status === 'PREVIEW' && canConfirmCashback" class="detail-actions">
<el-button type="success" :disabled="detailItems.length === 0" @click="confirmBatchId(detail.batch.id)">
{{ t('cashback.confirm_issue') }}
</el-button>

8
apps/admin/src/views/Contents.vue
View File

@@ -3,6 +3,8 @@ import { ref, computed, watch } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import type { TableInstance } from 'element-plus';
import { useAdminLocale } from '../composables/useAdminLocale';
import { usePermissions } from '../composables/usePermissions';
import { AdminPerm } from '../constants/permissions';
import api from '../api';
import AdminTableEmpty from '../components/AdminTableEmpty.vue';
import {
@@ -11,6 +13,8 @@ import {
} from './match-form';
const { t, localeTag } = useAdminLocale();
const { hasPermission } = usePermissions();
const canManageContent = computed(() => hasPermission(AdminPerm.content));
/* ── Image upload helpers ── */
const IMAGE_ACCEPT = 'image/png,image/jpeg,image/webp,image/gif,image/svg+xml';
@@ -470,9 +474,10 @@ void load();
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="load">{{ t('common.search') }}</el-button>
<el-button type="primary" plain size="small" @click="openCreate">
<el-button v-if="canManageContent" type="primary" plain size="small" @click="openCreate">
{{ t('content.btn.create') }}
</el-button>
<template v-if="canManageContent">
<span v-if="hasSelection" class="batch-hint">
{{ t('content.batch.selected', { n: selectedRows.length }) }}
</span>
@@ -499,6 +504,7 @@ void load();
>
{{ t('content.batch.delete') }}
</el-button>
</template>
</el-form-item>
</el-form>
</el-card>

60
apps/admin/src/views/HomeEntry.vue
View File

@@ -1,17 +1,40 @@
<script setup lang="ts">
import { shallowRef, onBeforeMount, type Component } from 'vue';
import { RouterView } from 'vue-router';
import { RouterView, RouterLink, useRoute, useRouter } from 'vue-router';
import { useAdminLocale } from '../composables/useAdminLocale';
import { useAuthStore } from '../stores/auth';
import { ensureStaffSession } from '../utils/session-hydrate';
import DashboardSubNav from '../components/DashboardSubNav.vue';
import { usePermissions } from '../composables/usePermissions';
import { AdminPerm } from '../constants/permissions';
const auth = useAuthStore();
const route = useRoute();
const router = useRouter();
const { t } = useAdminLocale();
const { hasPermission, role } = usePermissions();
const agentDashboard = shallowRef<Component | null>(null);
const booting = shallowRef(true);
const showSupportShortcuts = shallowRef(false);
onBeforeMount(async () => {
await ensureStaffSession();
if (!auth.isAdmin.value) {
if (auth.isAdmin.value) {
const code = role.value;
if (code === 'FINANCE_ADMIN' && route.path === '/') {
await router.replace('/dashboard/players');
} else if (code === 'SUPPORT') {
showSupportShortcuts.value = true;
if (route.path === '/' || route.path === '/dashboard/players') {
if (hasPermission(AdminPerm.usersView, AdminPerm.agentsView)) {
await router.replace('/users');
} else if (hasPermission(AdminPerm.bets)) {
await router.replace('/bets');
}
}
}
} else {
agentDashboard.value = (await import('./agent/Dashboard.vue')).default;
}
booting.value = false;
@@ -21,6 +44,17 @@ onBeforeMount(async () => {
<template>
<div v-if="booting" v-loading="true" class="home-boot" />
<template v-else-if="auth.isAdmin.value">
<div v-if="showSupportShortcuts" class="support-shortcuts">
<RouterLink v-if="hasPermission(AdminPerm.usersView, AdminPerm.agentsView)" to="/users" class="support-link">
{{ t('nav.agents_players') }}
</RouterLink>
<RouterLink v-if="hasPermission(AdminPerm.bets)" to="/bets" class="support-link">
{{ t('nav.bets') }}
</RouterLink>
<RouterLink v-if="hasPermission(AdminPerm.reports)" to="/finance-logs" class="support-link">
{{ t('nav.finance_logs') }}
</RouterLink>
</div>
<div class="dashboard-shell">
<div class="list-chrome">
<div class="list-chrome__row">
@@ -40,6 +74,28 @@ onBeforeMount(async () => {
min-height: 240px;
}
.support-shortcuts {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 12px;
}
.support-link {
padding: 8px 14px;
border-radius: 8px;
border: 1px solid var(--border);
background: #fff;
font-size: 13px;
font-weight: 650;
color: var(--text);
}
.support-link:hover {
border-color: var(--primary);
color: var(--primary);
}
.dashboard-shell :deep(.list-chrome) {
margin-bottom: 4px;
}

33
apps/admin/src/views/Login.vue
View File

@@ -7,6 +7,8 @@ import { useAuthStore, type StaffUser } from '../stores/auth';
import RobotVerify from '../components/RobotVerify.vue';
import AdminLocaleSwitcher from '../components/AdminLocaleSwitcher.vue';
import { useAdminLocale } from '../composables/useAdminLocale';
import { ensureStaffSession } from '../utils/session-hydrate';
import { effectivePermissions, firstAdminFallback } from '../utils/admin-access';
import bgImage from '../assets/images/bg.webp';
const router = useRouter();
@@ -19,13 +21,25 @@ const loading = ref(false);
const captchaRef = ref<InstanceType<typeof RobotVerify> | null>(null);
const isDev = import.meta.env.DEV;
async function finishLogin(payload: { token: string; user: StaffUser }) {
auth.setSession(payload.token, payload.user);
await ensureStaffSession();
const redirectQuery = route.query.redirect as string | undefined;
const role = auth.user.value?.role;
const permissions = effectivePermissions(role, auth.user.value?.permissions);
const target =
redirectQuery ||
firstAdminFallback(role, permissions) ||
'/';
await router.push(target);
}
async function quickLogin(username: string, password: string) {
loading.value = true;
try {
const { data } = await api.post('/manage/auth/login', { username, password });
const payload = data.data as { token: string; user: StaffUser };
auth.setSession(payload.token, payload.user);
router.push((route.query.redirect as string) || '/');
await finishLogin(payload);
} catch {
ElMessage.error(t('login.err_quick'));
} finally {
@@ -43,8 +57,7 @@ async function login() {
try {
const { data } = await api.post('/manage/auth/login', form.value);
const payload = data.data as { token: string; user: StaffUser };
auth.setSession(payload.token, payload.user);
router.push((route.query.redirect as string) || '/');
await finishLogin(payload);
} catch {
ElMessage.error(t('login.err_failed'));
captchaRef.value?.refresh();
@@ -97,6 +110,18 @@ async function login() {
<span class="quick-role">{{ t('login.quick_agent2') }}</span>
<span class="quick-acc">agent2</span>
</button>
<button type="button" class="quick-btn" :disabled="loading" @click="quickLogin('matchadmin', 'MatchAdmin@123')">
<span class="quick-role">{{ t('login.quick_match_admin') }}</span>
<span class="quick-acc">matchadmin</span>
</button>
<button type="button" class="quick-btn" :disabled="loading" @click="quickLogin('financeadmin', 'FinanceAdmin@123')">
<span class="quick-role">{{ t('login.quick_finance_admin') }}</span>
<span class="quick-acc">financeadmin</span>
</button>
<button type="button" class="quick-btn" :disabled="loading" @click="quickLogin('support1', 'Support@123')">
<span class="quick-role">{{ t('login.quick_support') }}</span>
<span class="quick-acc">support1</span>
</button>
</div>
</template>
</div>

8
apps/admin/src/views/Settlement.vue
View File

@@ -5,6 +5,8 @@ import { formatApiErrorMessage, isApiErrorCode } from '@thebet365/shared';
import api from '../api';
import { ElMessage } from 'element-plus';
import { useAdminLocale } from '../composables/useAdminLocale';
import { usePermissions } from '../composables/usePermissions';
import { AdminPerm } from '../constants/permissions';
const VChart = defineAsyncComponent(() =>
import('../components/dashboard/echarts-setup').then((m) => m.VChart),
@@ -69,6 +71,8 @@ interface SettlementBetStats {
}
const { t, locale, localeTag } = useAdminLocale();
const { hasPermission } = usePermissions();
const canResettle = computed(() => hasPermission(AdminPerm.resettle));
const route = useRoute();
const router = useRouter();
const STAT_FACT_LABELS = {
@@ -770,7 +774,7 @@ onMounted(() => {
isOutright ? t('settlement.outright.preview_hint') : t('settlement.preview_hint')
}}</span>
</template>
<template v-else>
<template v-else-if="canResettle">
<el-input
v-model="resettleReason"
size="small"
@@ -787,7 +791,7 @@ onMounted(() => {
<!-- 智能比分弹窗已关闭（见 Settlement.vue git 历史） -->
<el-card v-if="resettlePreview" class="preview-card" shadow="never">
<el-card v-if="canResettle && resettlePreview" class="preview-card" shadow="never">
<div class="preview-title">{{ t('settlement.resettle_preview_title') }}</div>
<el-row :gutter="20">
<el-col :span="8">

294
apps/admin/src/views/StaffManage.vue Normal file
View File

@@ -0,0 +1,294 @@
<script setup lang="ts">
import { computed, onMounted, ref } from 'vue';
import { ElMessage } from 'element-plus';
import api from '../api';
import { useAdminLocale } from '../composables/useAdminLocale';
import AdminTableEmpty from '../components/AdminTableEmpty.vue';
import AdminTableWrap from '../components/AdminTableWrap.vue';
interface StaffRow {
id: string;
username: string;
status: string;
role: string | null;
roleName: string | null;
lastLoginAt: string | null;
createdAt: string;
}
interface RoleOption {
id: string;
code: string;
name: string;
}
const { t, localeTag } = useAdminLocale();
const loading = ref(false);
const rows = ref<StaffRow[]>([]);
const total = ref(0);
const page = ref(1);
const pageSize = ref(20);
const keyword = ref('');
const roles = ref<RoleOption[]>([]);
const createVisible = ref(false);
const createLoading = ref(false);
const createForm = ref({ username: '', password: '', confirmPassword: '', roleCode: 'MATCH_ADMIN' });
const editVisible = ref(false);
const editLoading = ref(false);
const editForm = ref({ id: '', username: '', status: 'ACTIVE', roleCode: 'MATCH_ADMIN', password: '' });
const roleLabel = computed(() => {
const map: Record<string, string> = {
SUPER_ADMIN: t('role.super_admin'),
MATCH_ADMIN: t('role.match_admin'),
FINANCE_ADMIN: t('role.finance_admin'),
SUPPORT: t('role.support'),
};
return (code: string | null) => (code ? map[code] ?? code : '—');
});
function formatTime(value: string | null) {
if (!value) return '—';
return new Date(value).toLocaleString(localeTag.value);
}
async function loadRoles() {
const { data } = await api.get('/admin/staff/roles');
roles.value = (data.data ?? []) as RoleOption[];
}
async function load() {
loading.value = true;
try {
const { data } = await api.get('/admin/staff', {
params: {
page: page.value,
pageSize: pageSize.value,
keyword: keyword.value.trim() || undefined,
},
});
rows.value = data.data.items as StaffRow[];
total.value = data.data.total;
} catch {
rows.value = [];
total.value = 0;
} finally {
loading.value = false;
}
}
function openCreate() {
createForm.value = { username: '', password: '', confirmPassword: '', roleCode: 'MATCH_ADMIN' };
createVisible.value = true;
}
async function submitCreate() {
const f = createForm.value;
if (!f.username.trim()) {
ElMessage.warning(t('err.username_required'));
return;
}
if (f.password.length < 8) {
ElMessage.warning(t('err.password_min'));
return;
}
if (f.password !== f.confirmPassword) {
ElMessage.warning(t('err.password_mismatch'));
return;
}
createLoading.value = true;
try {
await api.post('/admin/staff', {
username: f.username.trim(),
password: f.password,
roleCode: f.roleCode,
});
ElMessage.success(t('msg.saved'));
createVisible.value = false;
await load();
} catch (e: unknown) {
const err = e as { response?: { data?: { error?: string } } };
ElMessage.error(err.response?.data?.error ?? t('msg.save_failed'));
} finally {
createLoading.value = false;
}
}
function openEdit(row: StaffRow) {
editForm.value = {
id: row.id,
username: row.username,
status: row.status,
roleCode: row.role ?? 'MATCH_ADMIN',
password: '',
};
editVisible.value = true;
}
async function submitEdit() {
const f = editForm.value;
if (f.password && f.password.length < 8) {
ElMessage.warning(t('err.password_min'));
return;
}
editLoading.value = true;
try {
const payload: Record<string, string> = {
status: f.status,
roleCode: f.roleCode,
};
if (f.password.trim()) payload.password = f.password.trim();
const { data } = await api.patch(`/admin/staff/${f.id}`, payload);
if (data.data?.password) {
ElMessage.success(t('user.msg.password_saved', { password: data.data.password }));
} else {
ElMessage.success(t('msg.saved'));
}
editVisible.value = false;
await load();
} catch (e: unknown) {
const err = e as { response?: { data?: { error?: string } } };
ElMessage.error(err.response?.data?.error ?? t('msg.save_failed'));
} finally {
editLoading.value = false;
}
}
onMounted(async () => {
await loadRoles();
await load();
});
</script>
<template>
<div class="admin-list-page staff-page">
<section class="list-panel">
<div class="list-panel-toolbar">
<el-form inline class="list-chrome__grow">
<el-form-item :label="t('common.keyword')">
<el-input
v-model="keyword"
:placeholder="t('login.username_ph')"
clearable
style="width: 180px"
@keyup.enter="load"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="load">{{ t('common.search') }}</el-button>
</el-form-item>
</el-form>
<div class="list-chrome__actions">
<el-button type="primary" @click="openCreate">{{ t('staff.create_btn') }}</el-button>
</div>
</div>
<AdminTableWrap>
<el-table v-loading="loading" :data="rows" stripe>
<template #empty>
<AdminTableEmpty />
</template>
<el-table-column prop="username" :label="t('login.username')" min-width="120" />
<el-table-column :label="t('staff.col.role')" min-width="140">
<template #default="{ row }">{{ roleLabel(row.role) }}</template>
</el-table-column>
<el-table-column :label="t('common.status')" width="100">
<template #default="{ row }">{{ row.status }}</template>
</el-table-column>
<el-table-column :label="t('staff.col.last_login')" min-width="160">
<template #default="{ row }">{{ formatTime(row.lastLoginAt) }}</template>
</el-table-column>
<el-table-column :label="t('common.actions')" width="100" align="center">
<template #default="{ row }">
<el-button link type="primary" size="small" @click="openEdit(row)">{{ t('common.edit') }}</el-button>
</template>
</el-table-column>
</el-table>
</AdminTableWrap>
<div class="pager">
<el-pagination
v-model:current-page="page"
v-model:page-size="pageSize"
:total="total"
:page-sizes="[10, 20, 50]"
layout="total, sizes, prev, pager, next"
background
@current-change="load"
@size-change="load"
/>
</div>
</section>
<el-dialog v-model="createVisible" :title="t('staff.dialog.create')" width="480px" destroy-on-close>
<el-form label-width="120px">
<el-form-item :label="t('login.username')" required>
<el-input v-model="createForm.username" autocomplete="off" />
</el-form-item>
<el-form-item :label="t('staff.col.role')" required>
<el-select v-model="createForm.roleCode" style="width: 100%">
<el-option
v-for="r in roles.filter((x) => x.code !== 'SUPER_ADMIN')"
:key="r.code"
:label="roleLabel(r.code)"
:value="r.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('login.password')" required>
<el-input v-model="createForm.password" type="password" autocomplete="new-password" />
</el-form-item>
<el-form-item :label="t('user.field.confirm_password')" required>
<el-input v-model="createForm.confirmPassword" type="password" autocomplete="new-password" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="createVisible = false">{{ t('common.cancel') }}</el-button>
<el-button type="primary" :loading="createLoading" @click="submitCreate">{{ t('common.confirm') }}</el-button>
</template>
</el-dialog>
<el-dialog v-model="editVisible" :title="t('staff.dialog.edit')" width="480px" destroy-on-close>
<el-form label-width="120px">
<el-form-item :label="t('login.username')">
<el-input :model-value="editForm.username" disabled />
</el-form-item>
<el-form-item :label="t('staff.col.role')">
<el-select v-model="editForm.roleCode" style="width: 100%" :disabled="editForm.roleCode === 'SUPER_ADMIN'">
<el-option
v-for="r in roles"
:key="r.code"
:label="roleLabel(r.code)"
:value="r.code"
/>
</el-select>
</el-form-item>
<el-form-item :label="t('common.status')">
<el-select v-model="editForm.status" style="width: 100%">
<el-option label="ACTIVE" value="ACTIVE" />
<el-option label="SUSPENDED" value="SUSPENDED" />
<el-option label="DISABLED" value="DISABLED" />
</el-select>
</el-form-item>
<el-form-item :label="t('user.field.reset_password')">
<el-input v-model="editForm.password" type="password" autocomplete="new-password" :placeholder="t('user.ph.reset_password_short')" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="editVisible = false">{{ t('common.cancel') }}</el-button>
<el-button type="primary" :loading="editLoading" @click="submitEdit">{{ t('common.confirm') }}</el-button>
</template>
</el-dialog>
</div>
</template>
<style scoped>
.staff-page .pager {
margin-top: 12px;
display: flex;
justify-content: flex-end;
}
</style>

35
apps/admin/src/views/dashboard/DashboardMatches.vue
View File

@@ -3,11 +3,14 @@ import { computed, onMounted } from 'vue';
import { useRouter } from 'vue-router';
import { useAdminDashboard } from '../../composables/useAdminDashboard';
import EChartPanel from '../../components/dashboard/EChartPanel.vue';
import { buildCombinedTrendOption, buildTriplePieOption } from '../../utils/dashboard-charts';
import { buildCombinedTrendOption, buildTriplePieOption, buildBarChartOption } from '../../utils/dashboard-charts';
import { betStatusLabel } from '../../utils/bet-labels';
import { useAdminLocale } from '../../composables/useAdminLocale';
import { usePermissions } from '../../composables/usePermissions';
const { t } = useAdminLocale();
const { role } = usePermissions();
const isMatchOperatorView = computed(() => role.value === 'MATCH_ADMIN');
const router = useRouter();
const {
s,
@@ -32,8 +35,16 @@ function goKpiLink(link: KpiLink) {
router.push(link.query ? { path: link.path, query: link.query } : link.path);
}
const mainTrendOption = computed(() =>
buildCombinedTrendOption(
const mainTrendOption = computed(() => {
const counts = s.value?.trend7d?.map((d) => d.betCount) ?? [];
if (isMatchOperatorView.value) {
return buildBarChartOption(
trendLabels.value,
[{ name: t('dash.chart_bet_count'), color: '#956400', values: counts }],
{ amountAxis: false },
);
}
return buildCombinedTrendOption(
trendLabels.value,
[
{
@@ -52,10 +63,10 @@ const mainTrendOption = computed(() =>
values: s.value?.trend7d?.map((d) => toNum(d.ggr)) ?? [],
},
],
s.value?.trend7d?.map((d) => d.betCount) ?? [],
counts,
chartI18n.value,
),
);
);
});
const distributionOption = computed(() => {
const m = s.value?.matches;
@@ -146,13 +157,15 @@ const kpiMatch = computed(() => {
<template v-else-if="s">
<el-card class="overview-board" shadow="never">
<div v-if="s.generatedAt" class="board-head">
<span class="board-hint">{{ t('dash.section_matches_hint') }}</span>
<span class="board-hint">{{
isMatchOperatorView ? t('dash.section_match_ops_hint') : t('dash.section_matches_hint')
}}</span>
<span class="dash-updated">
{{ t('common.updated_at') }} {{ formatTime(s.generatedAt) }}
</span>
</div>
<div class="kpi-grid kpi-primary">
<div v-if="!isMatchOperatorView" class="kpi-grid kpi-primary">
<div v-for="item in kpiPrimary" :key="item.label" class="kpi-cell">
<span class="kpi-label">{{ item.label }}</span>
<span class="kpi-value">{{ item.value }}</span>
@@ -166,7 +179,7 @@ const kpiMatch = computed(() => {
</div>
</div>
<div class="kpi-grid kpi-secondary">
<div class="kpi-grid" :class="isMatchOperatorView ? 'kpi-primary' : 'kpi-secondary'">
<div
v-for="item in kpiMatch"
:key="item.label"
@@ -185,7 +198,9 @@ const kpiMatch = computed(() => {
<div class="charts-stack">
<EChartPanel title="" :option="mainTrendOption" height="300px" class="chart-main" />
<div class="chart-main-caption">{{ t('dash.trend_caption') }}</div>
<div class="chart-main-caption">{{
isMatchOperatorView ? t('dash.trend_bet_count_caption') : t('dash.trend_caption')
}}</div>
<EChartPanel title="" :option="distributionOption" height="200px" class="chart-dist" />
</div>
</el-card>