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

feat: multi-tier agent hierarchy, wallet ledger, and player UX polish

Browse Source 
Add configurable agent max level and default sub-agent credit ratio, per-agent block direct player login on suspend, admin/agent wallet transaction views, and match detail my-bets section with refreshed player card styling.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Mars
2026-06-10 16:15:34 +08:00
parent 641c92a5f5
commit ef6b15f119
39 changed files with 2398 additions and 410 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
apps/player/src/components/LeagueAccordionItem.vue
View File

@@ -1,8 +1,12 @@
<script setup lang="ts">
import { computed } from 'vue';
import MatchBetCard from './MatchBetCard.vue';
import saishiImg from '../assets/images/saishi.png';
import cardBg from '../assets/images/card-bg.png';
defineProps<{
const matchCardBg = `url(${cardBg})`;
const props = defineProps<{
leagueId: string;
leagueName: string;
leagueLogoUrl?: string | null;
@@ -28,6 +32,10 @@ defineProps<{
}>();
const emit = defineEmits<{ toggle: []; bet: [id: string] }>();
const totalCount = computed(() => props.matches.length);
const liveCount = computed(() => props.matches.filter(m => m.matchPhase === 'closed_pending').length);
const openCount = computed(() => props.matches.filter(m => m.matchPhase === 'open').length);
</script>
<template>
@@ -36,7 +44,14 @@ const emit = defineEmits<{ toggle: []; bet: [id: string] }>();
<span class="toggle-icon" :class="{ open: expanded }" aria-hidden="true">
<span class="toggle-mark">{{ expanded ? '−' : '+' }}</span>
</span>
<span class="league-title">*{{ leagueName }}</span>
<span class="league-info">
<span class="league-title">*{{ leagueName }}</span>
<span class="league-stats">
<span class="stat-item">{{ totalCount }}场</span>
<span v-if="liveCount > 0" class="stat-item stat-live">{{ liveCount }}进行中</span>
<span v-if="openCount > 0" class="stat-item stat-open">{{ openCount }}待开赛</span>
</span>
</span>
<img
:src="leagueLogoUrl || saishiImg"
alt=""
@@ -59,19 +74,23 @@ const emit = defineEmits<{ toggle: []; bet: [id: string] }>();
<style scoped>
.league-block {
margin-bottom: 10px;
border: 1px solid #2e2e2e;
border-radius: 6px;
position: relative;
isolation: isolate;
margin-bottom: 12px;
border: 1px solid var(--border);
border-radius: var(--radius);
background: var(--bg-card);
overflow: hidden;
background: #141414;
}
.league-row {
position: relative;
z-index: 1;
width: 100%;
display: flex;
align-items: center;
gap: 10px;
padding: 12px 12px;
padding: 12px 16px;
background: none;
border: none;
border-radius: 0;
@@ -79,6 +98,16 @@ const emit = defineEmits<{ toggle: []; bet: [id: string] }>();
cursor: pointer;
}
.league-row::before {
content: '';
position: absolute;
inset: 0;
background: v-bind(matchCardBg) center top / 100% auto no-repeat;
opacity: 0.25;
z-index: -1;
pointer-events: none;
}
.league-row:active {
opacity: 0.92;
}
@@ -103,15 +132,39 @@ const emit = defineEmits<{ toggle: []; bet: [id: string] }>();
margin-top: -1px;
}
.league-title {
.league-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.league-title {
font-size: 13px;
font-weight: 800;
color: var(--primary-light);
color: #fff;
line-height: 1.35;
min-width: 0;
}
.league-stats {
display: flex;
align-items: center;
gap: 6px;
font-size: 11px;
color: #ccc;
line-height: 1.2;
}
.stat-live {
color: #3db865;
}
.stat-open {
color: #c8a84e;
}
.league-saishi {
flex-shrink: 0;
height: 44px;

65
apps/player/src/components/MatchBetCard.vue
View File

@@ -2,8 +2,7 @@
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { teamFlagUrl } from '../utils/teamFlag';
import StatusWatermark from './StatusWatermark.vue';
import { matchPhaseLabel, matchPhaseVariant, type MatchPhase } from '../utils/matchPhase';
import { matchPhaseLabel, type MatchPhase } from '../utils/matchPhase';
const props = defineProps<{
match: {
@@ -76,12 +75,9 @@ const liveScoreText = computed(() => {
:class="{ 'match-card--phase': phase !== 'open' }"
@click="emit('bet', match.id)"
>
<StatusWatermark
v-if="phase !== 'open'"
:label="phaseLabel"
:variant="matchPhaseVariant(phase)"
size="sm"
/>
<span v-if="phase === 'open'" class="status-tag status-tag--open">待开赛</span>
<span v-else-if="phase === 'settled'" class="status-tag status-tag--settled">{{ phaseLabel }}</span>
<span v-else class="status-tag status-tag--pending">{{ phaseLabel }}</span>
<div class="teams-row">
<div class="team">
@@ -127,8 +123,8 @@ const liveScoreText = computed(() => {
<style scoped>
.match-card {
position: relative;
background: #0d0d0d;
border: 1px solid rgba(255, 215, 0, 0.25);
background: linear-gradient(180deg, #1a1a1a 0%, #0d0d0d 100%);
border: 1px solid rgba(140, 140, 140, 0.35);
border-radius: 6px;
padding: 10px 8px 10px;
display: flex;
@@ -140,8 +136,17 @@ const liveScoreText = computed(() => {
cursor: pointer;
}
.match-card::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(100, 100, 100, 0.08) 0%, transparent 50%, rgba(80, 80, 80, 0.05) 100%);
pointer-events: none;
z-index: 0;
}
.match-card--phase {
border-color: rgba(140, 140, 140, 0.35);
/* inherits base dark style */
}
.teams-row {
@@ -170,7 +175,7 @@ const liveScoreText = computed(() => {
justify-content: center;
font-size: 17px;
font-weight: 900;
color: var(--primary-light);
color: #fff;
line-height: 1.2;
text-shadow: 0 1px 6px rgba(0, 0, 0, 0.95);
word-break: break-word;
@@ -210,7 +215,7 @@ const liveScoreText = computed(() => {
.kickoff {
font-size: 13px;
font-weight: 700;
color: #b0a060;
color: #fff;
line-height: 1;
white-space: nowrap;
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
@@ -233,6 +238,40 @@ const liveScoreText = computed(() => {
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}
.status-tag {
position: absolute;
top: 0;
right: 0;
z-index: 3;
font-size: 10px;
font-weight: 800;
padding: 3px 10px;
border-radius: 0 6px 0 8px;
line-height: 1.3;
white-space: nowrap;
letter-spacing: 0.02em;
}
.status-tag--open {
background: linear-gradient(135deg, #e8c84a, #d4a017);
color: #1a1a1a;
box-shadow: 0 2px 6px rgba(212, 160, 23, 0.4);
}
.status-tag--settled {
background: linear-gradient(180deg, #2a2a3a 0%, #1a1a28 100%);
color: #8a9ab8;
border-bottom: 1px solid rgba(120, 140, 180, 0.3);
border-left: 1px solid rgba(120, 140, 180, 0.3);
}
.status-tag--pending {
background: linear-gradient(180deg, #3a3a2a 0%, #28251a 100%);
color: #c8a84e;
border-bottom: 1px solid rgba(200, 168, 78, 0.3);
border-left: 1px solid rgba(200, 168, 78, 0.3);
}
.bet-btn {
position: relative;
z-index: 2;

2
apps/player/src/components/StatusWatermark.vue
View File

@@ -27,7 +27,7 @@ withDefaults(
max-width: 92%;
overflow: hidden;
text-overflow: ellipsis;
z-index: 1;
z-index: 100;
}
.status-watermark.sm {

29
apps/player/src/components/outright/OutrightEventSection.vue
View File

@@ -3,6 +3,9 @@ import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import OutrightOptionCard from './OutrightOptionCard.vue';
import saishiImg from '../../assets/images/saishi.png';
import cardBg from '../../assets/images/card-bg.png';
const matchCardBg = `url(${cardBg})`;
export interface OutrightSelection {
id: string;
@@ -80,22 +83,38 @@ const headMeta = computed(() => {
<style scoped>
.event-block {
margin-bottom: 10px;
border: 1px solid #2e2e2e;
border-radius: 6px;
position: relative;
isolation: isolate;
margin-bottom: 12px;
border: 1px solid var(--border);
border-radius: var(--radius);
background: var(--bg-card);
overflow: hidden;
}
.event-head {
position: relative;
z-index: 1;
width: 100%;
display: flex;
align-items: center;
gap: 10px;
padding: 12px 10px;
background: #141414;
padding: 12px 16px;
background: none;
border: none;
border-radius: 0;
text-align: left;
cursor: pointer;
}
.event-head::before {
content: '';
position: absolute;
inset: 0;
background: v-bind(matchCardBg) center top / 100% auto no-repeat;
opacity: 0.25;
z-index: -1;
pointer-events: none;
}
.toggle-icon {

15
apps/player/src/components/outright/OutrightOptionCard.vue
View File

@@ -72,21 +72,30 @@ onUnmounted(() => {
<style scoped>
.option-card {
position: relative;
width: 100%;
min-width: 0;
padding: 8px 4px 6px;
border-radius: 6px;
background: #1c1c1c;
border: 1px solid #333;
background: linear-gradient(180deg, #1a1a1a 0%, #0d0d0d 100%);
border: 1px solid rgba(140, 140, 140, 0.35);
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
text-align: center;
overflow: hidden;
}
.option-card::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(100, 100, 100, 0.08) 0%, transparent 50%, rgba(80, 80, 80, 0.05) 100%);
pointer-events: none;
}
.option-card:active {
background: #252525;
border-color: var(--border-gold-soft);
}

142
apps/player/src/components/parlay/ParlayPanel.vue
View File

@@ -8,8 +8,10 @@ import { PARLAY_MARKET_TYPES, PARLAY_SELECTION_KEYS, PARLAY_MARKET_GROUPS } from
import BetGuideHelp from '../BetGuideHelp.vue';
import GoldSpinner from '../GoldSpinner.vue';
import TeamEmblem from '../TeamEmblem.vue';
import StatusWatermark from '../StatusWatermark.vue';
import { matchPhaseLabel, matchPhaseVariant, type MatchPhase } from '../../utils/matchPhase';
import cardBg from '../../assets/images/card-bg.png';
import { matchPhaseLabel, type MatchPhase } from '../../utils/matchPhase';
const matchCardBg = `url(${cardBg})`;
import { useOnLocaleChange } from '../../composables/useOnLocaleChange';
type TimeFilter = 'all' | 'today';
@@ -301,18 +303,22 @@ function toggleCollapse(id: string) {
}"
>
<button type="button" class="match-head" @click="toggleCollapse(match.id)">
<StatusWatermark
v-if="(match.matchPhase ?? (match.bettingOpen === false ? 'closed_pending' : 'open')) !== 'open'"
:label="matchPhaseLabel(t, match.matchPhase ?? 'closed_pending')"
:variant="matchPhaseVariant(match.matchPhase ?? 'closed_pending')"
size="sm"
/>
<span
v-if="(match.matchPhase ?? (match.bettingOpen === false ? 'closed_pending' : 'open')) === 'settled'"
class="status-tag status-tag--settled"
>{{ matchPhaseLabel(t, 'settled') }}</span>
<span
v-else-if="(match.matchPhase ?? (match.bettingOpen === false ? 'closed_pending' : 'open')) === 'closed_pending'"
class="status-tag status-tag--pending"
>{{ matchPhaseLabel(t, 'closed_pending') }}</span>
<div class="match-head-top">
<span class="m-league">{{ match.leagueName }}</span>
<span class="toggle-dot" :class="{ open: !collapsed.has(match.id) }">
{{ collapsed.has(match.id) ? '+' : '−' }}
<span class="toggle-icon" :class="{ open: !collapsed.has(match.id) }" aria-hidden="true">
<span class="toggle-mark">{{ collapsed.has(match.id) ? '+' : '−' }}</span>
</span>
<span class="m-league">{{ match.leagueName }}</span>
</div>
<div class="match-head-teams">
<div class="m-team home">
<TeamEmblem
@@ -331,7 +337,6 @@ function toggleCollapse(id: string) {
{{ match.score.ftHome }} - {{ match.score.ftAway }}
</span>
<span v-else class="m-time">{{ formatKickoff(match.startTime) }}</span>
<span class="m-vs">VS</span>
</div>
<div class="m-team away">
<span class="m-name">{{ match.awayTeamName }}</span>
@@ -491,25 +496,36 @@ function toggleCollapse(id: string) {
}
.match-card {
background: #141414;
border: 1px solid #2a2a2a;
position: relative;
background: linear-gradient(180deg, #1a1a1a 0%, #0d0d0d 100%);
border: 1px solid rgba(140, 140, 140, 0.35);
border-radius: 8px;
overflow: hidden;
}
.match-card::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(100, 100, 100, 0.08) 0%, transparent 50%, rgba(80, 80, 80, 0.05) 100%);
pointer-events: none;
z-index: 0;
}
.match-card.collapsed {
border-color: #222;
}
.match-head {
position: relative;
z-index: 1;
overflow: hidden;
width: 100%;
display: flex;
flex-direction: column;
align-items: stretch;
gap: 4px;
padding: 8px 10px;
gap: 8px;
padding: 10px 12px 12px;
background: none;
border: none;
color: inherit;
@@ -518,6 +534,16 @@ function toggleCollapse(id: string) {
text-align: left;
}
.match-head::before {
content: '';
position: absolute;
inset: 0;
background: v-bind(matchCardBg) center top / 100% auto no-repeat;
opacity: 0.25;
z-index: -1;
pointer-events: none;
}
.match-head:active {
background: rgba(255, 255, 255, 0.015);
}
@@ -525,22 +551,22 @@ function toggleCollapse(id: string) {
.match-head-top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
min-width: 0;
}
.match-head-teams {
.toggle-icon {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
gap: 8px;
min-width: 0;
}
.m-team {
display: flex;
align-items: center;
gap: 4px;
gap: 6px;
flex: 1;
min-width: 0;
}
@@ -553,15 +579,15 @@ function toggleCollapse(id: string) {
display: flex;
flex-direction: column;
align-items: center;
gap: 1px;
flex-shrink: 0;
padding: 0 4px;
min-width: 50px;
padding: 0 2px;
}
.m-name {
font-size: 12px;
font-size: 13px;
font-weight: 800;
color: var(--primary-light);
color: #fff;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@@ -575,40 +601,45 @@ function toggleCollapse(id: string) {
}
.m-time {
font-size: 10px;
font-size: 11px;
font-weight: 600;
color: var(--text-muted);
}
.toggle-dot {
.toggle-icon {
flex-shrink: 0;
width: 20px;
height: 20px;
width: 26px;
height: 26px;
border-radius: 50%;
background: #1a1a1a;
border: 1px solid #333;
background: #141414;
border: 1px solid var(--border-gold-soft);
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
font-weight: 900;
color: #666;
line-height: 1;
transition: all 0.15s;
}
.toggle-dot.open {
.toggle-icon.open {
border-color: var(--border-gold-soft);
}
.toggle-mark {
color: var(--primary-light);
font-size: 17px;
font-weight: 900;
line-height: 1;
margin-top: -1px;
}
.m-league {
font-size: 10px;
flex: 1;
font-size: 11px;
color: var(--text-muted);
font-weight: 600;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
.match-head :deep(.team-emblem) {
@@ -618,11 +649,13 @@ function toggleCollapse(id: string) {
}
.market-blocks {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
gap: 8px;
padding: 8px 10px 10px;
border-top: 1px solid #1e1e1e;
border-top: 1px solid rgba(140, 140, 140, 0.15);
}
.market-group {
@@ -699,10 +732,39 @@ function toggleCollapse(id: string) {
opacity: 0.94;
}
.m-score {
font-size: 12px;
.status-tag {
position: absolute;
top: 0;
right: 0;
z-index: 5;
font-size: 10px;
font-weight: 800;
padding: 3px 10px;
border-radius: 0 6px 0 8px;
line-height: 1.3;
white-space: nowrap;
letter-spacing: 0.02em;
}
.status-tag--settled {
background: linear-gradient(180deg, #2a2a3a 0%, #1a1a28 100%);
color: #8a9ab8;
border-bottom: 1px solid rgba(120, 140, 180, 0.3);
border-left: 1px solid rgba(120, 140, 180, 0.3);
}
.status-tag--pending {
background: linear-gradient(180deg, #3a3a2a 0%, #28251a 100%);
color: #c8a84e;
border-bottom: 1px solid rgba(200, 168, 78, 0.3);
border-left: 1px solid rgba(200, 168, 78, 0.3);
}
.m-score {
font-size: 15px;
font-weight: 900;
color: #fff;
letter-spacing: 0.04em;
}
.odd-label {