Ivan/xtraderClient
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: Ivan:76a512a2c741b13a500053c311d0f7cfb924e788
Branches Tags
Ivan:master
..
compare: Ivan:c976333b7244d47d53970920e0e23f92ba9d87b0
Branches Tags
Ivan:master

No commits in common. "76a512a2c741b13a500053c311d0f7cfb924e788" and "c976333b7244d47d53970920e0e23f92ba9d87b0" have entirely different histories.
76a512a2c7 ... c976333b72

2 changed files with 15 additions and 966 deletions
Show Stats Expand all files Collapse all files

898
design/pencil-new.pen
View File

@ -8596,904 +8596,6 @@
]
}
]
},
{
"type": "frame",
"id": "djTDW",
"x": 5112,
"y": 0,
"name": "Event Markets — Resolved (Mobile)",
"clip": true,
"width": 402,
"fill": "$--bg-page",
"layout": "vertical",
"gap": 16,
"padding": 16,
"children": [
{
"type": "frame",
"id": "W75LK",
"name": "chart",
"width": "fill_container",
"fill": "#FFFFFF",
"cornerRadius": 12,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "#E7E7E7"
},
"layout": "vertical",
"gap": 10,
"padding": 16,
"children": [
{
"type": "frame",
"id": "96doS",
"name": "hd",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "text",
"id": "LHe1G",
"fill": "$--text-primary",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "2024 美国总统大选",
"lineHeight": 1.3,
"fontFamily": "Inter",
"fontSize": 18,
"fontWeight": "600"
},
{
"type": "text",
"id": "7g7NQ",
"fill": "$--text-secondary",
"content": "政治 · 48 个关联标签",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "Eysxy",
"name": "stat",
"width": "fill_container",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "03SL0",
"name": "pb",
"fill": "#E5E7EB",
"cornerRadius": 999,
"padding": [
4,
10
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "nHB1K",
"fill": "#4B5563",
"content": "已全部结算",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "AtgzE",
"name": "dp",
"fill": "$--bg-dark",
"cornerRadius": 999,
"padding": [
6,
12
],
"children": [
{
"type": "text",
"id": "F5GBV",
"fill": "#FFFFFF",
"content": "2024-11-06",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
]
},
{
"type": "text",
"id": "87Kz3",
"fill": "#6B7280",
"content": "本事件含 4 个子市场 · 走势已收盘",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "YP2W6",
"name": "area",
"clip": true,
"width": "fill_container",
"height": 200,
"fill": "#F9FAFB",
"cornerRadius": 8,
"layout": "none",
"children": [
{
"type": "rectangle",
"id": "RhtVO",
"x": 0,
"y": 50,
"fill": "#E5E7EB",
"width": 330,
"height": 1
},
{
"type": "rectangle",
"id": "EB71K",
"x": 0,
"y": 100,
"fill": "#E5E7EB",
"width": 330,
"height": 1
},
{
"type": "rectangle",
"id": "EwTmk",
"x": 0,
"y": 150,
"fill": "#E5E7EB",
"width": 330,
"height": 1
},
{
"type": "path",
"id": "ieMhf",
"x": 8,
"y": 28,
"geometry": "M0 110l60-5 40-10 40-15 60-30 60-25 50-17 30-3",
"fill": "#00000000",
"width": 360,
"height": 145,
"stroke": {
"align": "center",
"thickness": 2,
"fill": "#16A34A"
}
},
{
"type": "path",
"id": "uUzq8",
"x": 8,
"y": 28,
"geometry": "M0 95l70 5 50 15 60 15 60-12 60-23 40-10",
"fill": "#00000000",
"width": 360,
"height": 145,
"stroke": {
"align": "center",
"thickness": 2,
"fill": "#2563EB"
}
},
{
"type": "path",
"id": "y33qU",
"x": 8,
"y": 28,
"geometry": "M0 120l80-2 60 7 60 10 80 5 60 2",
"fill": "#00000000",
"width": 360,
"height": 145,
"stroke": {
"align": "center",
"thickness": 2,
"fill": "#CA8A04"
}
}
]
},
{
"type": "frame",
"id": "TUQpq",
"name": "leg",
"width": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "Gu0M3",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 1,
"id": "Gcbu1",
"fill": "#16A34A",
"width": 12,
"height": 3
},
{
"type": "text",
"id": "NZW1O",
"fill": "$--text-secondary",
"content": "宾州",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "tXPps",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 1,
"id": "yc5oY",
"fill": "#2563EB",
"width": 12,
"height": 3
},
{
"type": "text",
"id": "weBPn",
"fill": "$--text-secondary",
"content": "乔治亚",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "pNPL4",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 1,
"id": "P7lGK",
"fill": "#CA8A04",
"width": 12,
"height": 3
},
{
"type": "text",
"id": "YaAII",
"fill": "$--text-secondary",
"content": "北卡",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "IZpRm",
"name": "foot",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border-light"
},
"padding": [
10,
0,
0,
0
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "KWlt2",
"fill": "$--text-secondary",
"content": "$29.5M Vol | 已收盘",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "YWcuK",
"name": "tr",
"gap": 4,
"children": [
{
"type": "text",
"id": "4naKV",
"fill": "$--text-secondary",
"content": "1W",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "CTvXn",
"fill": "$--text-primary",
"content": "1M",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
},
{
"type": "text",
"id": "cJnBl",
"fill": "$--text-secondary",
"content": "ALL",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "vb1xr",
"name": "list",
"clip": true,
"width": "fill_container",
"fill": "#FFFFFF",
"cornerRadius": 12,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border-color"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "p0FqF",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border-color"
},
"layout": "vertical",
"padding": [
14,
16,
10,
16
],
"children": [
{
"type": "text",
"id": "RyWcO",
"fill": "$--text-primary",
"content": "子市场（已结算）",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "zm8fz",
"name": "r1",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "#F3F4F6"
},
"layout": "vertical",
"gap": 8,
"padding": [
14,
16
],
"children": [
{
"type": "frame",
"id": "5zFqd",
"name": "main1",
"width": "fill_container",
"gap": 10,
"justifyContent": "space_between",
"children": [
{
"type": "frame",
"id": "H0j9B",
"name": "L1",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "text",
"id": "SyiLn",
"fill": "$--text-primary",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "民主党会赢得宾夕法尼亚州吗？",
"lineHeight": 1.35,
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "500"
},
{
"type": "text",
"id": "RzEa9",
"fill": "$--text-secondary",
"content": "Vol $12.4M",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "c1GM7",
"name": "R1",
"gap": 6,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "qNqyP",
"name": "pg1",
"fill": "#DCFCE7",
"cornerRadius": 6,
"padding": [
4,
8
],
"children": [
{
"type": "text",
"id": "DqwfJ",
"fill": "#166534",
"content": "Yes",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "700"
}
]
},
{
"type": "icon_font",
"id": "QbyoN",
"width": 20,
"height": 20,
"iconFontName": "chevron_right",
"iconFontFamily": "Material Symbols Outlined",
"fill": "$--text-tertiary"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "AeLIZ",
"name": "r2",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "#F3F4F6"
},
"layout": "vertical",
"gap": 8,
"padding": [
14,
16
],
"children": [
{
"type": "frame",
"id": "6wmKy",
"name": "main2",
"width": "fill_container",
"gap": 10,
"justifyContent": "space_between",
"children": [
{
"type": "frame",
"id": "JpIdR",
"name": "L2",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "text",
"id": "48mkd",
"fill": "$--text-primary",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "民主党会赢得乔治亚州吗？",
"lineHeight": 1.35,
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "500"
},
{
"type": "text",
"id": "Nxgz6",
"fill": "$--text-secondary",
"content": "Vol $8.2M",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "44gn0",
"name": "R2",
"gap": 6,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "KfpjC",
"name": "pg2",
"fill": "#FEE2E2",
"cornerRadius": 6,
"padding": [
4,
8
],
"children": [
{
"type": "text",
"id": "xx02d",
"fill": "#991B1B",
"content": "No",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "700"
}
]
},
{
"type": "icon_font",
"id": "4jBn7",
"width": 20,
"height": 20,
"iconFontName": "chevron_right",
"iconFontFamily": "Material Symbols Outlined",
"fill": "$--text-tertiary"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "lJlHL",
"name": "r3",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "#F3F4F6"
},
"layout": "vertical",
"gap": 8,
"padding": [
14,
16
],
"children": [
{
"type": "frame",
"id": "4O2vx",
"name": "main3",
"width": "fill_container",
"gap": 10,
"justifyContent": "space_between",
"children": [
{
"type": "frame",
"id": "OpDAd",
"name": "L3",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "text",
"id": "9bdor",
"fill": "$--text-primary",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "民主党会赢得北卡罗来纳州吗？",
"lineHeight": 1.35,
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "500"
},
{
"type": "text",
"id": "nd8sG",
"fill": "$--text-secondary",
"content": "Vol $5.1M",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "irsZh",
"name": "R3",
"gap": 6,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "uFfQx",
"name": "pg3",
"fill": "#DCFCE7",
"cornerRadius": 6,
"padding": [
4,
8
],
"children": [
{
"type": "text",
"id": "kXrj0",
"fill": "#166534",
"content": "Yes",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "700"
}
]
},
{
"type": "icon_font",
"id": "Tvk34",
"width": 20,
"height": 20,
"iconFontName": "chevron_right",
"iconFontFamily": "Material Symbols Outlined",
"fill": "$--text-tertiary"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "lNVl6",
"name": "r4",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "#00000000"
},
"layout": "vertical",
"gap": 8,
"padding": [
14,
16
],
"children": [
{
"type": "frame",
"id": "7Kgu6",
"name": "main4",
"width": "fill_container",
"gap": 10,
"justifyContent": "space_between",
"children": [
{
"type": "frame",
"id": "wa8EG",
"name": "L4",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "text",
"id": "RcSZ5",
"fill": "$--text-primary",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "特朗普会赢得全国普选票吗？",
"lineHeight": 1.35,
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "500"
},
{
"type": "text",
"id": "hAXtz",
"fill": "$--text-secondary",
"content": "Vol $3.8M",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "hFbkd",
"name": "R4",
"gap": 6,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "roevE",
"name": "pg4",
"fill": "#FEE2E2",
"cornerRadius": 6,
"padding": [
4,
8
],
"children": [
{
"type": "text",
"id": "Vw1ML",
"fill": "#991B1B",
"content": "No",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "700"
}
]
},
{
"type": "icon_font",
"id": "IRhDd",
"width": 20,
"height": 20,
"iconFontName": "chevron_right",
"iconFontFamily": "Material Symbols Outlined",
"fill": "$--text-tertiary"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "qn3uV",
"name": "rules",
"width": "fill_container",
"fill": "#FFFFFF",
"cornerRadius": 12,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border-color"
},
"layout": "vertical",
"gap": 8,
"padding": 14,
"children": [
{
"type": "text",
"id": "8aho0",
"fill": "$--text-secondary",
"content": "规则说明",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
},
{
"type": "text",
"id": "rQEBt",
"fill": "#374151",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "各子市场独立结算。全部市场完成后，本事件页面仅供查阅历史走势与结果。",
"lineHeight": 1.45,
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "text",
"id": "65TnC",
"fill": "$--text-secondary",
"content": "裁决来源",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
},
{
"type": "text",
"id": "yYtmB",
"fill": "#2563EB",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "AP News · state boards of elections",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "a0IBs",
"name": "end",
"width": "fill_container",
"fill": "#F3F4F6",
"cornerRadius": 10,
"padding": 14,
"justifyContent": "center",
"children": [
{
"type": "text",
"id": "65HVd",
"fill": "#6B7280",
"content": "所有子市场已结束 · 无法下单",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
}
]
}
],
"variables": {

83
src/views/TradeDetail.vue
View File

@ -1,11 +1,5 @@
<template>
<v-container
fluid
class="trade-detail-container"
:class="{
'trade-detail-container--settled-bar': showSettledOutcomeBar,
}"
>
<v-container fluid class="trade-detail-container">
<v-pull-to-refresh class="trade-detail-pull-refresh" @load="onRefresh">
<div class="trade-detail-pull-refresh-inner">
<!-- findPmEvent 请求中：仅显示 loading -->
@ -112,6 +106,9 @@
<v-icon size="40" color="grey-darken-1">mdi-lock-outline</v-icon>
<h2 class="market-closed-pane-title">{{ t('trade.marketClosedTitle') }}</h2>
<p class="market-closed-pane-desc">{{ t('trade.marketClosedDesc') }}</p>
<p v-if="settledOutcomeLabel" class="market-closed-pane-outcome">
{{ t('trade.marketClosedOutcome', { outcome: settledOutcomeLabel }) }}
</p>
</div>
</v-card>
@ -285,6 +282,9 @@
<v-icon size="44" color="grey-darken-1">mdi-lock-outline</v-icon>
<h2 class="market-closed-pane-title">{{ t('trade.marketClosedTitle') }}</h2>
<p class="market-closed-pane-desc">{{ t('trade.marketClosedDesc') }}</p>
<p v-if="settledOutcomeLabel" class="market-closed-pane-outcome">
{{ t('trade.marketClosedOutcome', { outcome: settledOutcomeLabel }) }}
</p>
</div>
<div v-else-if="tradeMarketPayload" class="trade-sidebar">
<TradeComponent
@ -382,15 +382,6 @@
</v-row>
</div>
</v-pull-to-refresh>
<!-- 已结算：结算结果固定在视口底部（滚动时仍可见） -->
<div
v-if="showSettledOutcomeBar"
class="trade-settled-outcome-bar"
role="status"
>
{{ t('trade.marketClosedOutcome', { outcome: settledOutcomeLabel }) }}
</div>
</v-container>
</template>
@ -643,11 +634,6 @@ const settledOutcomeLabel = computed(() => {
return w?.label ?? ''
})
/** 底部固定栏：仅在市场已关闭且能解析出结算结果文案时展示 */
const showSettledOutcomeBar = computed(
() => currentMarketClosed.value && Boolean((settledOutcomeLabel.value ?? '').trim()),
)
// --- CLOB WebSocket 订单簿与成交 ---
// 按 token 索引区分：0 = Yes，1 = No
type OrderBookRows = { price: number; shares: number; priceRaw?: number }[]
@ -1624,34 +1610,6 @@ onUnmounted(() => {
box-sizing: border-box;
}
/* 底部固定展示结算结果时，为内容留出空间（高度与 .trade-settled-outcome-bar 一致） */
.trade-detail-container.trade-detail-container--settled-bar {
padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px));
}
.trade-settled-outcome-bar {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 101;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
min-height: 52px;
padding: 12px 20px;
padding-bottom: max(12px, env(safe-area-inset-bottom));
background: #ffffff;
border-top: 1px solid #e7e7e7;
font-size: 15px;
font-weight: 600;
color: #111827;
line-height: 1.35;
box-shadow: 0 -6px 16px rgba(0, 0, 0, 0.06);
box-sizing: border-box;
}
.trade-detail-pull-refresh {
width: 100%;
min-height: 100%;
@ -2036,11 +1994,7 @@ onUnmounted(() => {
}
.market-closed-pane--mobile {
padding: 22px 18px;
border: none;
border-radius: 0;
background: transparent;
box-shadow: none;
padding: 20px 16px;
}
.market-closed-pane-title {
@ -2057,13 +2011,18 @@ onUnmounted(() => {
line-height: 1.5;
}
.market-closed-pane-outcome {
margin: 14px 0 0;
font-size: 15px;
font-weight: 600;
color: #111827;
}
.market-closed-mobile-card {
margin-top: 24px;
margin-bottom: 16px;
border: 1px solid #e7e7e7;
box-shadow: none !important;
overflow: hidden;
background-color: #f9fafb !important;
}
@media (min-width: 960px) {
@ -2099,10 +2058,6 @@ onUnmounted(() => {
.trade-detail-container {
padding-bottom: 100px;
}
.trade-detail-container.trade-detail-container--settled-bar {
padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px));
}
}
/* Responsive adjustments */
@ -2115,14 +2070,6 @@ onUnmounted(() => {
padding-bottom: 100px;
}
.trade-detail-container.trade-detail-container--settled-bar {
padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px));
}
.market-closed-mobile-card {
margin-top: 28px;
}
.trade-detail-card {
padding: 24px;
}