+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DesktopShell.vue b/apps/player/src/components/desktop/DesktopShell.vue
new file mode 100644
index 0000000..d9c592f
--- /dev/null
+++ b/apps/player/src/components/desktop/DesktopShell.vue
@@ -0,0 +1,169 @@
+
+
+
+
{{ match.homeTeamName }}
![]()
{
+
diff --git a/apps/player/src/components/RobotVerify.vue b/apps/player/src/components/RobotVerify.vue
index bd66452..ae53c0d 100644
--- a/apps/player/src/components/RobotVerify.vue
+++ b/apps/player/src/components/RobotVerify.vue
@@ -48,8 +48,8 @@ function drawCaptcha() {
const ctx = canvas.getContext('2d');
if (!ctx) return;
- const bg = cssVar('--captcha-canvas-bg', '#0d0d0d');
- const charBase = cssVar('--captcha-char', '#f0d875');
+ const bg = cssVar('--captcha-canvas-bg', '#162D36');
+ const charBase = cssVar('--captcha-char', '#F4A261');
const noiseRgb = cssVar('--captcha-noise-rgb', '255, 255, 255');
ctx.fillStyle = bg;
diff --git a/apps/player/src/components/desktop/AccountSideNav.vue b/apps/player/src/components/desktop/AccountSideNav.vue
new file mode 100644
index 0000000..73a3441
--- /dev/null
+++ b/apps/player/src/components/desktop/AccountSideNav.vue
@@ -0,0 +1,121 @@
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/BetSlipPanel.vue b/apps/player/src/components/desktop/BetSlipPanel.vue
new file mode 100644
index 0000000..97ab63f
--- /dev/null
+++ b/apps/player/src/components/desktop/BetSlipPanel.vue
@@ -0,0 +1,2005 @@
+
+
+
+
+
+ {{ t('bet.all') }} →
+
+
+
+
+
+
+ {{ t('bet.no_market_odds') }}
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DataTable.vue b/apps/player/src/components/desktop/DataTable.vue
new file mode 100644
index 0000000..100c19c
--- /dev/null
+++ b/apps/player/src/components/desktop/DataTable.vue
@@ -0,0 +1,123 @@
+
+
+
+
+
+
+ {{ t('bet.bet_slip') || '投注单' }}
+ +
+
+
+
+
+
+
+
+
+ {{ oddsWarningText }}
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ t('history.empty') }}
+
+
+
+
+
+
+
+
+
+ {{ historyPickLabel(bet) }}
+
+ {{ historyStatusLabel(bet.status) }}
+
+
+
+ {{ bet.matchTitle }}
+
+
+ {{ t('history.stake') }} {{ formatMoney(bet.stake, locale) }}
+
+ {{ formatMoney(bet.actualReturn || bet.potentialReturn, locale) }}
+
+
+
+
+
+
+
+ {{ activeTab === 'parlay' ? t('bet.slip_parlay_empty_hint') : t('bet.slip_empty_hint') }}
+{{ parlayWarning }}
+
+
+
+
+
+
+
+
+
+
+ {{ item.selectionName }}
+
+
+
+ {{ oddsDeltaFor(item.selectionId)!.oldOdds.toFixed(2) }} →
+ {{ oddsDeltaFor(item.selectionId)!.newOdds.toFixed(2) }}
+
+
+ {{ item.odds.toFixed(2) }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ t('bet.slip_est_return') }}
+ {{ formatMoney(itemEstReturn(item), locale) }}
+
+
+ {{ t('bet.slip_parlay_count', { n: slip.parlayItems.length }) }}
+ {{ t('bet.slip_parlay_odds', { odds: totalOddsText }) }}
+
+
+
+
+
+ {{ t('bet.slip_currency') || 'CNY' }}
+
+
+
+
+
+
+
+
+
+
+ {{ error }}
+ +
+
+ {{ t('bet.slip_history_view_all') }}
+
+
+
+
+
+
+
+
+
+ {{ t('bet.slip_total_stake') }}
+ {{ stakeText }}
+
+
+ {{ t('bet.slip_est_return') }}
+ {{ estimatedReturnText }}
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DesktopAuthLayout.vue b/apps/player/src/components/desktop/DesktopAuthLayout.vue
new file mode 100644
index 0000000..0afda48
--- /dev/null
+++ b/apps/player/src/components/desktop/DesktopAuthLayout.vue
@@ -0,0 +1,199 @@
+
+
+
+ | + {{ h.label }} + | +
|---|
| + + | +
| + {{ t('common.no_data') || '暂无数据' }} + | +
|
+ |
+
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DesktopBanner3DCarousel.vue b/apps/player/src/components/desktop/DesktopBanner3DCarousel.vue
new file mode 100644
index 0000000..bac25ed
--- /dev/null
+++ b/apps/player/src/components/desktop/DesktopBanner3DCarousel.vue
@@ -0,0 +1,471 @@
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DesktopBetSlipRail.vue b/apps/player/src/components/desktop/DesktopBetSlipRail.vue
new file mode 100644
index 0000000..8aeae6d
--- /dev/null
+++ b/apps/player/src/components/desktop/DesktopBetSlipRail.vue
@@ -0,0 +1,163 @@
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DesktopOddsBetPopover.vue b/apps/player/src/components/desktop/DesktopOddsBetPopover.vue
new file mode 100644
index 0000000..85acd8d
--- /dev/null
+++ b/apps/player/src/components/desktop/DesktopOddsBetPopover.vue
@@ -0,0 +1,458 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ pendingItem.matchName }}
+ {{ pendingItem.marketName }}
+
+ {{ pendingItem.selectionName }}
+ @ {{ pendingItem.odds.toFixed(2) }}
+
+
+
+
+
+
+ {{ t('bet.slip_est_return') }}
+ {{ formatMoney(estReturn, locale) }}
+
+
+ {{ error }}
+ +
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+ {{ headTitle }}
+ {{ t('bet.outright_settled') }}
+
+ {{ event.leagueName }}
+ +
+
+ {{ t('bet.quick_bet') || '快速下注' }}（{{ t('bet.popular_teams') || '热门队伍' }}）
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DesktopTopNav.vue b/apps/player/src/components/desktop/DesktopTopNav.vue
new file mode 100644
index 0000000..e455fa4
--- /dev/null
+++ b/apps/player/src/components/desktop/DesktopTopNav.vue
@@ -0,0 +1,243 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+ TheBet365
+
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/DesktopWalletSubNav.vue b/apps/player/src/components/desktop/DesktopWalletSubNav.vue
new file mode 100644
index 0000000..db241ef
--- /dev/null
+++ b/apps/player/src/components/desktop/DesktopWalletSubNav.vue
@@ -0,0 +1,46 @@
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/LeagueSidebar.vue b/apps/player/src/components/desktop/LeagueSidebar.vue
new file mode 100644
index 0000000..8191c80
--- /dev/null
+++ b/apps/player/src/components/desktop/LeagueSidebar.vue
@@ -0,0 +1,363 @@
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/MatchSidebar.vue b/apps/player/src/components/desktop/MatchSidebar.vue
new file mode 100644
index 0000000..6e5c7ec
--- /dev/null
+++ b/apps/player/src/components/desktop/MatchSidebar.vue
@@ -0,0 +1,343 @@
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/OutrightSidebar.vue b/apps/player/src/components/desktop/OutrightSidebar.vue
new file mode 100644
index 0000000..4ccc005
--- /dev/null
+++ b/apps/player/src/components/desktop/OutrightSidebar.vue
@@ -0,0 +1,265 @@
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/desktop/Pagination.vue b/apps/player/src/components/desktop/Pagination.vue
new file mode 100644
index 0000000..91aed17
--- /dev/null
+++ b/apps/player/src/components/desktop/Pagination.vue
@@ -0,0 +1,172 @@
+
+
+
+
+ TheBet365
+
+ {{ t('pagination.total', { total }) }}
+
+
+
+
diff --git a/apps/player/src/components/desktop/SportsCategoryBar.vue b/apps/player/src/components/desktop/SportsCategoryBar.vue
new file mode 100644
index 0000000..c195093
--- /dev/null
+++ b/apps/player/src/components/desktop/SportsCategoryBar.vue
@@ -0,0 +1,108 @@
+
+
+
+
+
+
+
diff --git a/apps/player/src/components/match-detail/CorrectScorePanel.vue b/apps/player/src/components/match-detail/CorrectScorePanel.vue
index b9e2391..1ad8373 100644
--- a/apps/player/src/components/match-detail/CorrectScorePanel.vue
+++ b/apps/player/src/components/match-detail/CorrectScorePanel.vue
@@ -2,6 +2,7 @@
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { groupCorrectScoreSelections, type CsSelection } from '../../utils/correctScoreLayout';
+import { useDesktopBetPopover } from '../../composables/useDesktopBetPopover';
const props = defineProps<{
marketType: string;
@@ -15,13 +16,16 @@ const props = defineProps<{
}>;
isSelected: (id: string) => boolean;
locked?: boolean;
+ /** PC 全宽紧凑：更小单元格、三列均分 */
+ dense?: boolean;
}>();
const emit = defineEmits<{
- pick: [id: string];
+ pick: [id: string, event?: MouseEvent];
}>();
const { t } = useI18n();
+const { cancelClose } = useDesktopBetPopover();
const columns = computed(() =>
groupCorrectScoreSelections(
@@ -34,9 +38,9 @@ const columns = computed(() =>
),
);
-function onPick(sel: CsSelection) {
+function onPick(sel: CsSelection, event?: MouseEvent) {
if (props.locked) return;
- emit('pick', sel.id);
+ emit('pick', sel.id, event);
}
function formatOdds(odds: string) {
@@ -46,7 +50,11 @@ function formatOdds(odds: string) {
-
+
+
+
+
+
+
+
+
+
{{ t('bet.col_home') }}
{{ t('bet.col_draw') }}
@@ -61,8 +69,10 @@ function formatOdds(odds: string) {
type="button"
class="score-card"
:class="{ selected: isSelected(sel.id), 'score-card--locked': locked }"
+ :data-bet-selection-id="sel.id"
:disabled="locked"
- @click="onPick(sel)"
+ @mouseenter="onPick(sel, $event)"
+ @click="onPick(sel, $event)"
>
{{ sel.scoreDisplay }}
{{ formatOdds(sel.odds) }}
@@ -95,21 +105,24 @@ function formatOdds(odds: string) {
text-align: center;
font-size: 10px;
font-weight: 700;
- color: var(--text-secondary);
+ color: var(--text-muted);
}
.cols-grid {
display: grid;
- grid-template-columns: repeat(3, 1fr);
+ grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 4px;
+ align-items: start;
}
.col {
display: flex;
flex-direction: column;
gap: 4px;
+ align-self: start;
}
+/* ── Score Card ── */
.score-card {
display: flex;
flex-direction: column;
@@ -122,18 +135,33 @@ function formatOdds(odds: string) {
border: 1px solid var(--border);
border-radius: 8px;
text-align: center;
+ cursor: pointer;
transition: border-color 0.15s ease, background 0.15s ease;
}
+.score-card:hover:not(.score-card--locked) {
+ border-color: var(--primary-light);
+ background: var(--bg-hover);
+}
+
.score-card.selected {
border-color: var(--primary);
border-width: 2px;
background: rgba(244, 162, 97, 0.08);
}
+.score-card.selected .score-line {
+ color: var(--primary-light);
+}
+
+.score-card.selected .odds {
+ color: var(--primary);
+}
+
.score-card--locked {
background: var(--bg-elevated);
border-color: var(--border);
+ cursor: not-allowed;
}
.score-card--locked .score-line,
@@ -152,4 +180,37 @@ function formatOdds(odds: string) {
font-weight: 700;
color: var(--warning);
}
+
+/* ── Dense 紧凑模式 ── */
+.cs-panel--dense {
+ padding: 4px 6px 6px;
+}
+
+.cs-panel--dense .cols-head {
+ font-size: 9px;
+ margin-bottom: 3px;
+}
+
+.cs-panel--dense .cols-grid {
+ gap: 3px;
+}
+
+.cs-panel--dense .col {
+ gap: 3px;
+}
+
+.cs-panel--dense .score-card {
+ min-height: 34px;
+ padding: 4px 2px;
+ gap: 2px;
+ border-radius: 4px;
+}
+
+.cs-panel--dense .score-line {
+ font-size: 10px;
+}
+
+.cs-panel--dense .odds {
+ font-size: 9px;
+}
diff --git a/apps/player/src/components/match-detail/MarketSelectionsPanel.vue b/apps/player/src/components/match-detail/MarketSelectionsPanel.vue
index 55a2510..7d926f7 100644
--- a/apps/player/src/components/match-detail/MarketSelectionsPanel.vue
+++ b/apps/player/src/components/match-detail/MarketSelectionsPanel.vue
@@ -1,6 +1,8 @@
-
-
+
+
+
diff --git a/apps/player/src/views/AnnouncementListView.vue b/apps/player/src/views/AnnouncementListView.vue
index 07ee2e5..26fa6db 100644
--- a/apps/player/src/views/AnnouncementListView.vue
+++ b/apps/player/src/views/AnnouncementListView.vue
@@ -1,178 +1,15 @@
-
+
+
-
-
-
-
-
+ {{ t('announcements.title') }}
-
-
-
-
-
-
- {{ t('announcements.empty') }}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
-
-
-
-
-
- {{ t('history.not_found') }}
-
-
-
-
- {{ statusLabel }}
- {{ returnAmount }}
-
- {{ statusKey === 'pending' ? t('history.est_return') : t('history.return') }}
-
-
-
-
-
-
- {{ bet.isParlay ? t('history.parlay_league') : (bet.leagueName || t('history.league_default')) }}
-
- {{ placedDateTime }}
-
- {{ matchTitle }}
-
-
-
-
-
- {{ t('history.my_pick') }}
- {{ myPick }}
-
-
-
-
-
- {{ t('history.ft') }}
- {{ bet.matchScore.ft }}
-
-
- {{ t('history.ht') }}
- {{ bet.matchScore.ht }}
-
- {{ t('history.awaiting_result') }}
- {{ t('history.legs') }}
-
-
-
-
-
- {{ i + 1 }}
-
-
- {{ leg.matchTitle }}
-
- {{ leg.marketLabel }}: {{ translateSel(leg.selectionName) }}
-
-
-
- {{ t('history.ft') }} {{ leg.score.ft }}
- {{ t('history.ht') }} {{ leg.score.ht }}
-
-
- {{ formatOdds(leg.odds) }}
-
- {{ t(`history.status_${legStatusKey(leg.resultStatus)}`) }}
-
-
- {{ t('history.summary') }}
-
-
-
- {{ t('history.stake') }}
- {{ formatMoney(bet.stake, locale) }}
-
-
- {{ t('history.odds') }}
- {{ formatOdds(bet.totalOdds) }}
-
-
- {{ statusKey === 'pending' ? t('history.est_return') : t('history.return') }}
-
- {{ returnAmount }}
-
-
-
- {{ t('history.bet_no') }}
- {{ bet.betNo }}
-
-
-
-
-
+
-
-
-
-
-
-
-
- {{ formatMoney(totalAmount, locale) }}
-
- {{ t('cashback.total_received') }}
-
- · {{ t('cashback.record_count', { n: items.length }) }}
-
-
-
-
- {{ t('cashback.ledger_hint') }}
- -{{ t('cashback.list_title') }}
- -
-
-
-
-
-
-
-
-
-
- {{ formatMoney(row.amount, locale) }}
- {{ formatPeriod(row.periodStart, row.periodEnd) }}
-
- {{ formatRate(row.rate) }}
-
- {{ t('cashback.effective_stake') }} {{ formatMoneyCompact(row.effectiveStake, locale) }}
- {{ t('cashback.bet_count', { n: row.betCount }) }}
-
-
- {{ row.batchNo }}
- {{ formatTime(row.confirmedAt ?? row.createdAt) }}
-
-
-
-
-
- {{ t('common.no_more') }}
-
-
-
-
-
- {{ t('cashback.empty') }}
-{{ t('cashback.empty_hint') }}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ normalizeLeagueName(match.leagueName) }}
-
-
-
- ![]()
-
- {{ isSearchActive ? t('search.no_results') : t('bet.no_matches') }}
-
-
+
+