feat(admin,api,player): 优胜赛配置、赛事管理重构与玩家端投注体验优化
管理端拆分赛事/优胜赛 Tab，新增联赛优胜赔率面板（批量、排序、外侧删除）；统一 list-chrome 工具栏对齐与列表页布局；Dashboard 失败重试、Users 操作下拉、小屏侧栏等体验修复。 API 扩展优胜赛与赛事目录接口，完善投注与钱包查询；玩家端重构赛事卡片、串关面板、注单/钱包页，新增注单详情、下注成功动画与下拉刷新。 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
101
apps/admin/src/components/AdminSubNav.vue
Normal file
101
apps/admin/src/components/AdminSubNav.vue
Normal file
@@ -0,0 +1,101 @@
|
||||
<script setup lang="ts">
|
||||
import { RouterLink } from 'vue-router';
|
||||
import type { AdminBreadcrumbItem } from '../utils/admin-breadcrumb';
|
||||
|
||||
defineProps<{
|
||||
crumbs?: AdminBreadcrumbItem[];
|
||||
title: string;
|
||||
subtitle?: string;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<header class="admin-subnav">
|
||||
<nav v-if="crumbs?.length" class="admin-subnav__crumbs" aria-label="Breadcrumb">
|
||||
<template v-for="(item, i) in crumbs" :key="`${item.label}-${i}`">
|
||||
<RouterLink
|
||||
v-if="item.to && i < crumbs.length - 1"
|
||||
:to="item.to"
|
||||
class="admin-subnav__link"
|
||||
>
|
||||
{{ item.label }}
|
||||
</RouterLink>
|
||||
<span v-else class="admin-subnav__current">{{ item.label }}</span>
|
||||
<span v-if="i < crumbs.length - 1" class="admin-subnav__sep" aria-hidden="true">/</span>
|
||||
</template>
|
||||
</nav>
|
||||
<div class="admin-subnav__main">
|
||||
<div class="admin-subnav__titles">
|
||||
<h1 class="admin-subnav__title">{{ title }}</h1>
|
||||
<span v-if="subtitle" class="admin-subnav__subtitle">{{ subtitle }}</span>
|
||||
</div>
|
||||
<div v-if="$slots.extra" class="admin-subnav__extra">
|
||||
<slot name="extra" />
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.admin-subnav {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
margin-bottom: 16px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.admin-subnav__crumbs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 2px 6px;
|
||||
font-size: 12px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.admin-subnav__link {
|
||||
color: var(--green-text);
|
||||
font-weight: 600;
|
||||
transition: color 0.15s;
|
||||
}
|
||||
.admin-subnav__link:hover {
|
||||
color: #d4fde5;
|
||||
}
|
||||
.admin-subnav__current {
|
||||
color: #888;
|
||||
}
|
||||
.admin-subnav__sep {
|
||||
color: #444;
|
||||
user-select: none;
|
||||
}
|
||||
.admin-subnav__main {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.admin-subnav__titles {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px 12px;
|
||||
min-width: 0;
|
||||
}
|
||||
.admin-subnav__title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #e8e8e8;
|
||||
letter-spacing: 0.02em;
|
||||
}
|
||||
.admin-subnav__subtitle {
|
||||
font-size: 13px;
|
||||
color: #777;
|
||||
}
|
||||
.admin-subnav__extra {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
</style>
|
||||
47
apps/admin/src/components/AdminTableEmpty.vue
Normal file
47
apps/admin/src/components/AdminTableEmpty.vue
Normal file
@@ -0,0 +1,47 @@
|
||||
<script setup lang="ts">
|
||||
import { useAdminLocale } from '../composables/useAdminLocale';
|
||||
|
||||
const { t } = useAdminLocale();
|
||||
|
||||
defineProps<{
|
||||
text?: string;
|
||||
hint?: string;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="admin-table-empty">
|
||||
<div class="admin-table-empty__icon" aria-hidden="true">
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none">
|
||||
<rect x="6" y="10" width="28" height="22" rx="3" stroke="currentColor" stroke-width="1.5" opacity="0.35" />
|
||||
<path d="M14 18h12M14 23h8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" opacity="0.25" />
|
||||
</svg>
|
||||
</div>
|
||||
<p class="admin-table-empty__text">{{ text ?? t('common.no_data') }}</p>
|
||||
<p v-if="hint" class="admin-table-empty__hint">{{ hint }}</p>
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.admin-table-empty {
|
||||
padding: 28px 16px;
|
||||
text-align: center;
|
||||
}
|
||||
.admin-table-empty__icon {
|
||||
color: var(--green-text);
|
||||
opacity: 0.45;
|
||||
margin-bottom: 8px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.admin-table-empty__text {
|
||||
font-size: 13px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
.admin-table-empty__hint {
|
||||
font-size: 12px;
|
||||
color: #555;
|
||||
margin-top: 4px;
|
||||
}
|
||||
</style>
|
||||
93
apps/admin/src/components/MatchesSubNav.vue
Normal file
93
apps/admin/src/components/MatchesSubNav.vue
Normal file
@@ -0,0 +1,93 @@
|
||||
<script setup lang="ts">
|
||||
import { RouterLink, useRoute } from 'vue-router';
|
||||
import { useAdminLocale } from '../composables/useAdminLocale';
|
||||
|
||||
const { t } = useAdminLocale();
|
||||
const route = useRoute();
|
||||
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
embedded?: boolean;
|
||||
}>(),
|
||||
{ embedded: false },
|
||||
);
|
||||
|
||||
const tabs = [
|
||||
{ path: '/matches', labelKey: 'nav.matches.fixtures' },
|
||||
{ path: '/matches/outrights', labelKey: 'nav.matches.outrights' },
|
||||
];
|
||||
|
||||
function isActive(path: string) {
|
||||
if (path === '/matches/outrights') {
|
||||
return route.path === '/matches/outrights';
|
||||
}
|
||||
return (
|
||||
route.path === '/matches' ||
|
||||
(route.path.startsWith('/matches/') &&
|
||||
!route.path.startsWith('/matches/outrights'))
|
||||
);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<nav
|
||||
class="matches-subnav"
|
||||
:class="{ 'matches-subnav--embedded': embedded }"
|
||||
aria-label="Matches sections"
|
||||
>
|
||||
<RouterLink
|
||||
v-for="tab in tabs"
|
||||
:key="tab.path"
|
||||
:to="tab.path"
|
||||
class="matches-subnav__item"
|
||||
:class="{ 'matches-subnav__item--active': isActive(tab.path) }"
|
||||
>
|
||||
{{ t(tab.labelKey) }}
|
||||
</RouterLink>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.matches-subnav {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
margin-bottom: 16px;
|
||||
padding: 4px;
|
||||
border-radius: 10px;
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
border: 1px solid rgba(255, 255, 255, 0.06);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.matches-subnav--embedded {
|
||||
margin-bottom: 0;
|
||||
padding: 0 12px 0 0;
|
||||
border: none;
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background: transparent;
|
||||
flex-shrink: 0;
|
||||
height: 32px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.matches-subnav__item {
|
||||
padding: 0 12px;
|
||||
height: 32px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #888;
|
||||
transition: color 0.15s, background 0.15s;
|
||||
}
|
||||
.matches-subnav__item:hover {
|
||||
color: #ccc;
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
.matches-subnav__item--active {
|
||||
color: var(--green-text);
|
||||
background: rgba(0, 200, 83, 0.1);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user