Compare commits

..

No commits in common. "25455e1a813a7c342f1f29f798c37052677d92e3" and "2174abc9d37da5a92319b1d5ddec8a60c163abf7" have entirely different histories.

12 changed files with 139 additions and 676 deletions

View File

@ -11,43 +11,15 @@ description: Interprets the XTrader API from the Swagger 2.0 spec at https://api
## ⚠️ 强制执行:接口接入三步流程
**接入任意 XTrader 接口时,必须严格按以下顺序执行。收到「对接 XXX 接口」请求后,立即按此流程执行,不得跳过、不得调换、不得合并。**
**接入任意 XTrader 接口时,必须严格按以下顺序执行,不得跳过、不得调换、不得合并步骤。**
### 强制动作序列(必须依次执行)
| 步骤 | 动作 | 强制要求 |
|------|------|----------|
| **第一步** | 从 doc.json 整理并**在对话中输出**请求参数表、响应参数表、definitions 完整结构 | 在输出第一步结果**之前**,不得写任何业务代码;必须用 `mcp_web_fetch` 或 curl 获取 doc.json解析 `paths``definitions` |
| **第二步** | 根据第一步整理出的结构,在 `src/api/` 中定义 TypeScript 类型 | 必须等第一步输出完成后再执行Model 必须与 definitions 对应 |
| **第三步** | 实现请求函数并集成到页面 | 必须等第二步完成后再执行 |
1. **收到对接请求** → 立即用 `mcp_web_fetch``curl` 获取 `https://api.xtrader.vip/swagger/doc.json`
2. **第一步** → 解析 `paths["<path>"]["<method>"]``definitions`**在对话中输出**
- 请求参数表Query/Body/鉴权)
- 响应参数表200 schema
- data 的 `$ref` 对应 definitions 的**完整字段表**
- 输出后**明确标注「第一步完成」**
3. **第二步** → 在 `src/api/` 中根据第一步表格定义 TypeScript 类型,**不得在第一步完成前执行**
4. **第三步** → 实现请求函数并集成到页面,**不得在第二步完成前执行**
### 禁止行为
- ❌ 在对话中输出第一步结果**之前**写任何 `src/api/``src/views/` 业务代码
- ❌ 跳过第一步直接定义类型或实现请求
- ❌ 合并步骤(如边输出边写代码)
### 第一步输出模板(必须包含)
```
## 第一步GET/POST <path> 请求与响应参数
### 1. 请求参数
| 类型 | 名称 | 类型 | 必填 | 说明 |
| ... |
### 2. 响应参数200
根结构:{ code, data, msg }
### 3. definitions["xxx"] 完整字段
| 字段 | 类型 | 说明 |
| ... |
第一步完成。
```
**违反后果**:若跳过第一步直接写代码,会导致类型与接口文档不一致、遗漏字段或误用参数。
## 规范地址与格式

2
.env
View File

@ -1,6 +1,6 @@
# API 基础地址,不设置时默认 https://api.xtrader.vip
# 连接测试服务器 192.168.3.21:8888 时复制本文件为 .env 或 .env.local 并取消下一行注释:
# VITE_API_BASE_URL=http://192.168.3.21:8888
VITE_API_BASE_URL=http://192.168.3.21:8888
# SSH 部署npm run deploy可选覆盖
# DEPLOY_HOST=38.246.250.238

View File

@ -12,7 +12,6 @@ const currentRoute = computed(() => {
onMounted(() => {
if (userStore.isLoggedIn) {
userStore.fetchUserInfo()
userStore.fetchUsdcBalance()
}
})

View File

@ -2,51 +2,6 @@ import { get } from './request'
const USDC_DECIMALS = 1_000_000
/**
* getUserInfo datadefinitions system.SysUser
* doc.json definitions["system.SysUser"]
*/
export interface UserInfoData {
ID?: number
userName?: string
nickName?: string
headerImg?: string
uuid?: string
authorityId?: number
authority?: unknown
authorities?: unknown[]
createdAt?: string
updatedAt?: string
email?: string
phone?: string
enable?: number
walletAddress?: string
externalWalletAddress?: string
walletPrivEnc?: string
promotionCode?: string
puserId?: number
remark?: string
originSetting?: Record<string, unknown>
}
export interface GetUserInfoResponse {
code: number
data?: UserInfoData
msg?: string
}
/**
* GET /user/getUserInfo
* x-token
*/
export async function getUserInfo(
authHeaders: Record<string, string>,
): Promise<GetUserInfoResponse> {
return get<GetUserInfoResponse>('/user/getUserInfo', undefined, {
headers: authHeaders,
})
}
/** getUsdcBalance 返回的 data 结构 */
export interface UsdcBalanceData {
amount: string

View File

@ -177,8 +177,6 @@ const emit = defineEmits<{
marketId?: string
outcomeTitle?: string
clobTokenIds?: string[]
yesLabel?: string
noLabel?: string
},
]
}>()
@ -302,8 +300,6 @@ function openTradeSingle(side: 'yes' | 'no') {
title: props.marketTitle,
marketId: props.marketId,
clobTokenIds: props.clobTokenIds,
yesLabel: props.yesLabel,
noLabel: props.noLabel,
})
}
@ -314,8 +310,6 @@ function openTradeMulti(side: 'yes' | 'no', outcome: EventCardOutcome) {
marketId: outcome.marketId,
outcomeTitle: outcome.title,
clobTokenIds: outcome.clobTokenIds,
yesLabel: outcome.yesLabel,
noLabel: outcome.noLabel,
})
}
</script>

View File

@ -1,5 +1,5 @@
<template>
<v-card class="order-book" elevation="0">
<v-card class="order-book">
<!-- Header -->
<div class="order-book-header">
<h3 class="order-book-title">Order Book</h3>
@ -198,8 +198,7 @@ const maxBidsTotal = computed(() => {
width: 100%;
border-radius: 8px;
overflow: hidden;
box-shadow: none;
border: 1px solid #e7e7e7;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.horizontal-progress-bar {

View File

@ -1,6 +1,6 @@
<template>
<!-- 桌面端完整交易卡片扁平化 -->
<v-card v-if="!mobile" class="trade-component" elevation="0">
<!-- 桌面端完整交易卡片 -->
<v-card v-if="!mobile" class="trade-component">
<!-- Header -->
<div class="header">
<v-tabs v-model="activeTab" class="buy-sell-tabs minimal-tabs" density="compact">
@ -44,7 +44,7 @@
text
@click="handleOptionChange('yes')"
>
{{ yesLabel }} {{ yesPriceCents }}¢
Yes {{ yesPriceCents }}¢
</v-btn>
<v-btn
class="no-btn"
@ -52,37 +52,10 @@
text
@click="handleOptionChange('no')"
>
{{ noLabel }} {{ noPriceCents }}¢
No {{ noPriceCents }}¢
</v-btn>
</div>
<!-- Sell Market: Shares input + 25%/50%/Max -->
<template v-if="activeTab === 'sell'">
<div class="input-group shares-group">
<div class="shares-header">
<span class="label">Shares</span>
<div class="shares-input">
<v-text-field
:model-value="shares"
type="number"
min="1"
class="shares-input-field"
hide-details
density="compact"
@update:model-value="onSharesInput"
@keydown="onSharesKeydown"
@paste="onSharesPaste"
></v-text-field>
</div>
</div>
<div class="shares-buttons">
<v-btn class="share-btn" @click="setSharesPercentage(25)">25%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(50)">50%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(100)">Max</v-btn>
</div>
</div>
</template>
<!-- Total and To Win (Buy模式) You'll receive (Sell模式) -->
<div class="total-section">
<!-- Buy模式 -->
@ -95,7 +68,7 @@
<span class="label">To win</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ toWinValue }}
$20
</span>
</div>
</template>
@ -105,29 +78,15 @@
<span class="label">You'll receive</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ totalPrice }}
</span>
</div>
<div class="total-row avg-price-row">
<span class="label">
Avg. Price {{ avgPriceCents }}¢
<v-icon size="14" class="info-icon">mdi-information-outline</v-icon>
${{ totalPrice }}
</span>
</div>
</template>
</div>
<p v-if="orderError" class="order-error">{{ orderError }}</p>
<!-- Action Button: Buy 余额足够显示 Buy Yes/No不足显示 DepositSell 只显示 Sell Yes/No -->
<!-- Action Button -->
<v-btn
v-if="activeTab === 'buy' && showDepositForBuy"
class="deposit-btn"
@click="deposit"
>
Deposit
</v-btn>
<v-btn
v-else
class="action-btn"
:loading="orderLoading"
:disabled="orderLoading"
@ -137,7 +96,7 @@
</v-btn>
</template>
<!-- Balance <= 0: Show Deposit Interface (Buy) Sell UI (Sell) -->
<!-- Balance <= 0: Show Deposit Interface -->
<template v-else>
<!-- Price Options -->
<div class="price-options">
@ -147,7 +106,7 @@
text
@click="handleOptionChange('yes')"
>
{{ yesLabel }} {{ yesPriceCents }}¢
Yes {{ yesPriceCents }}¢
</v-btn>
<v-btn
class="no-btn"
@ -155,12 +114,11 @@
text
@click="handleOptionChange('no')"
>
{{ noLabel }} {{ noPriceCents }}¢
No {{ noPriceCents }}¢
</v-btn>
</div>
<!-- Buy: Amount Section -->
<template v-if="activeTab === 'buy'">
<!-- Amount Section -->
<div class="input-group">
<div class="amount-header">
<div>
@ -177,70 +135,10 @@
<v-btn class="amount-btn" @click="adjustAmount(100)">+$100</v-btn>
<v-btn class="amount-btn" @click="setMaxAmount">Max</v-btn>
</div>
</div>
<!-- To win份数 × 1U -->
<div v-if="amount > 0" class="total-row amount-to-win-row">
<span class="label">To win</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ toWinValue }}
</span>
</div>
</div>
<!-- Buy 余额不足时显示 Deposit -->
<v-btn class="deposit-btn" @click="deposit">Deposit</v-btn>
</template>
<!-- Sell: Shares + To receive + Avg. Price只显示 Sell Yes/No Deposit -->
<template v-else>
<div class="input-group shares-group">
<div class="shares-header">
<span class="label">Shares</span>
<div class="shares-input">
<v-text-field
:model-value="shares"
type="number"
min="1"
class="shares-input-field"
hide-details
density="compact"
@update:model-value="onSharesInput"
@keydown="onSharesKeydown"
@paste="onSharesPaste"
></v-text-field>
</div>
</div>
<div class="shares-buttons">
<v-btn class="share-btn" @click="setSharesPercentage(25)">25%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(50)">50%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(100)">Max</v-btn>
</div>
</div>
<div class="total-section">
<div class="total-row">
<span class="label">You'll receive</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ totalPrice }}
</span>
</div>
<div class="total-row avg-price-row">
<span class="label">
Avg. Price {{ avgPriceCents }}¢
<v-icon size="14" class="info-icon">mdi-information-outline</v-icon>
</span>
</div>
</div>
<!-- Sell 只显示 Sell Yes/No -->
<v-btn
class="action-btn"
:loading="orderLoading"
:disabled="orderLoading"
@click="submitOrder"
>
{{ actionButtonText }}
</v-btn>
</template>
<!-- Deposit Button -->
<v-btn class="deposit-btn" @click="deposit"> Deposit </v-btn>
</template>
</template>
@ -254,7 +152,7 @@
text
@click="handleOptionChange('yes')"
>
{{ yesLabel }} {{ yesPriceCents }}¢
Yes {{ yesPriceCents }}¢
</v-btn>
<v-btn
class="no-btn"
@ -262,7 +160,7 @@
text
@click="handleOptionChange('no')"
>
{{ noLabel }} {{ noPriceCents }}¢
No {{ noPriceCents }}¢
</v-btn>
</div>
@ -362,7 +260,7 @@
<span class="label">To win</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ toWinValue }}
$20
</span>
</div>
</template>
@ -372,7 +270,7 @@
<span class="label">You'll receive</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ totalPrice }}
${{ totalPrice }}
</span>
</div>
</template>
@ -390,9 +288,9 @@
</template>
</v-card>
<!-- 移动端且由首页卡片嵌入只渲染交易表单无底部栏无内部 sheet扁平化 -->
<!-- 移动端且由首页卡片嵌入只渲染交易表单无底部栏无内部 sheet -->
<template v-else-if="embeddedInSheet">
<v-sheet class="trade-sheet-paper trade-sheet-paper--embedded" rounded="lg" elevation="0">
<v-sheet class="trade-sheet-paper trade-sheet-paper--embedded" rounded="lg">
<div class="trade-component trade-sheet-inner">
<div class="header">
<v-tabs v-model="activeTab" class="buy-sell-tabs minimal-tabs" density="compact">
@ -431,42 +329,16 @@
:class="{ active: selectedOption === 'yes' }"
text
@click="handleOptionChange('yes')"
>{{ yesLabel }} {{ yesPriceCents }}¢</v-btn
>Yes {{ yesPriceCents }}¢</v-btn
>
<v-btn
class="no-btn"
:class="{ active: selectedOption === 'no' }"
text
@click="handleOptionChange('no')"
>{{ noLabel }} {{ noPriceCents }}¢</v-btn
>No {{ noPriceCents }}¢</v-btn
>
</div>
<!-- Sell Market: Shares input + 25%/50%/Max -->
<template v-if="activeTab === 'sell'">
<div class="input-group shares-group">
<div class="shares-header">
<span class="label">Shares</span>
<div class="shares-input">
<v-text-field
:model-value="shares"
type="number"
min="1"
class="shares-input-field"
hide-details
density="compact"
@update:model-value="onSharesInput"
@keydown="onSharesKeydown"
@paste="onSharesPaste"
></v-text-field>
</div>
</div>
<div class="shares-buttons">
<v-btn class="share-btn" @click="setSharesPercentage(25)">25%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(50)">50%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(100)">Max</v-btn>
</div>
</div>
</template>
<div class="total-section">
<template v-if="activeTab === 'buy'">
<div class="total-row">
@ -475,7 +347,7 @@
<div class="total-row">
<span class="label">To win</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{ toWinValue }}</span
><v-icon size="16" color="green">mdi-currency-usd</v-icon> $20</span
>
</div>
</template>
@ -483,29 +355,15 @@
<div class="total-row">
<span class="label">You'll receive</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{
><v-icon size="16" color="green">mdi-currency-usd</v-icon> ${{
totalPrice
}}</span
>
</div>
<div class="total-row avg-price-row">
<span class="label">
Avg. Price {{ avgPriceCents }}¢
<v-icon size="14" class="info-icon">mdi-information-outline</v-icon>
</span>
</div>
</template>
</div>
<p v-if="orderError" class="order-error">{{ orderError }}</p>
<v-btn
v-if="activeTab === 'buy' && showDepositForBuy"
class="deposit-btn"
@click="deposit"
>
Deposit
</v-btn>
<v-btn
v-else
class="action-btn"
:loading="orderLoading"
:disabled="orderLoading"
@ -520,18 +378,16 @@
:class="{ active: selectedOption === 'yes' }"
text
@click="handleOptionChange('yes')"
>{{ yesLabel }} {{ yesPriceCents }}¢</v-btn
>Yes {{ yesPriceCents }}¢</v-btn
>
<v-btn
class="no-btn"
:class="{ active: selectedOption === 'no' }"
text
@click="handleOptionChange('no')"
>{{ noLabel }} {{ noPriceCents }}¢</v-btn
>No {{ noPriceCents }}¢</v-btn
>
</div>
<!-- Buy: Amount Section -->
<template v-if="activeTab === 'buy'">
<div class="input-group">
<div class="amount-header">
<div>
@ -546,66 +402,9 @@
<v-btn class="amount-btn" @click="adjustAmount(100)">+$100</v-btn>
<v-btn class="amount-btn" @click="setMaxAmount">Max</v-btn>
</div>
<div v-if="amount > 0" class="total-row amount-to-win-row">
<span class="label">To win</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ toWinValue }}
</span>
</div>
</div>
<v-btn class="deposit-btn" @click="deposit">Deposit</v-btn>
</template>
<!-- Sell: Shares + To receive + Avg. Price -->
<template v-else>
<div class="input-group shares-group">
<div class="shares-header">
<span class="label">Shares</span>
<div class="shares-input">
<v-text-field
:model-value="shares"
type="number"
min="1"
class="shares-input-field"
hide-details
density="compact"
@update:model-value="onSharesInput"
@keydown="onSharesKeydown"
@paste="onSharesPaste"
></v-text-field>
</div>
</div>
<div class="shares-buttons">
<v-btn class="share-btn" @click="setSharesPercentage(25)">25%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(50)">50%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(100)">Max</v-btn>
</div>
</div>
<div class="total-section">
<div class="total-row">
<span class="label">You'll receive</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ totalPrice }}
</span>
</div>
<div class="total-row avg-price-row">
<span class="label">
Avg. Price {{ avgPriceCents }}¢
<v-icon size="14" class="info-icon">mdi-information-outline</v-icon>
</span>
</div>
</div>
<v-btn
class="action-btn"
:loading="orderLoading"
:disabled="orderLoading"
@click="submitOrder"
>
{{ actionButtonText }}
</v-btn>
</template>
</template>
</template>
<template v-else>
<div class="price-options hide-in-mobile-sheet">
@ -614,14 +413,14 @@
:class="{ active: selectedOption === 'yes' }"
text
@click="handleOptionChange('yes')"
>{{ yesLabel }} {{ yesPriceCents }}¢</v-btn
>Yes {{ yesPriceCents }}¢</v-btn
>
<v-btn
class="no-btn"
:class="{ active: selectedOption === 'no' }"
text
@click="handleOptionChange('no')"
>{{ noLabel }} {{ noPriceCents }}¢</v-btn
>No {{ noPriceCents }}¢</v-btn
>
</div>
<div class="input-group limit-price-group">
@ -707,7 +506,7 @@
<div class="total-row">
<span class="label">To win</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{ toWinValue }}</span
><v-icon size="16" color="green">mdi-currency-usd</v-icon> $20</span
>
</div>
</template>
@ -715,7 +514,7 @@
<div class="total-row">
<span class="label">You'll receive</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{ totalPrice }}</span
><v-icon size="16" color="green">mdi-currency-usd</v-icon> ${{ totalPrice }}</span
>
</div>
</template>
@ -745,7 +544,7 @@
block
@click="openSheet('yes')"
>
Buy {{ yesLabel }} {{ yesPriceCents }}¢
Buy Yes {{ yesPriceCents }}¢
</v-btn>
<v-btn
class="mobile-bar-btn mobile-bar-no"
@ -755,7 +554,7 @@
block
@click="openSheet('no')"
>
Buy {{ noLabel }} {{ noPriceCents }}¢
Buy No {{ noPriceCents }}¢
</v-btn>
</div>
@ -799,42 +598,16 @@
:class="{ active: selectedOption === 'yes' }"
text
@click="handleOptionChange('yes')"
>{{ yesLabel }} {{ yesPriceCents }}¢</v-btn
>Yes {{ yesPriceCents }}¢</v-btn
>
<v-btn
class="no-btn"
:class="{ active: selectedOption === 'no' }"
text
@click="handleOptionChange('no')"
>{{ noLabel }} {{ noPriceCents }}¢</v-btn
>No {{ noPriceCents }}¢</v-btn
>
</div>
<!-- Sell Market: Shares input + 25%/50%/Max -->
<template v-if="activeTab === 'sell'">
<div class="input-group shares-group">
<div class="shares-header">
<span class="label">Shares</span>
<div class="shares-input">
<v-text-field
:model-value="shares"
type="number"
min="1"
class="shares-input-field"
hide-details
density="compact"
@update:model-value="onSharesInput"
@keydown="onSharesKeydown"
@paste="onSharesPaste"
></v-text-field>
</div>
</div>
<div class="shares-buttons">
<v-btn class="share-btn" @click="setSharesPercentage(25)">25%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(50)">50%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(100)">Max</v-btn>
</div>
</div>
</template>
<div class="total-section">
<template v-if="activeTab === 'buy'">
<div class="total-row">
@ -844,7 +617,7 @@
<div class="total-row">
<span class="label">To win</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{ toWinValue }}</span
><v-icon size="16" color="green">mdi-currency-usd</v-icon> $20</span
>
</div>
</template>
@ -852,29 +625,15 @@
<div class="total-row">
<span class="label">You'll receive</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{
><v-icon size="16" color="green">mdi-currency-usd</v-icon> ${{
totalPrice
}}</span
>
</div>
<div class="total-row avg-price-row">
<span class="label">
Avg. Price {{ avgPriceCents }}¢
<v-icon size="14" class="info-icon">mdi-information-outline</v-icon>
</span>
</div>
</template>
</div>
<p v-if="orderError" class="order-error">{{ orderError }}</p>
<v-btn
v-if="activeTab === 'buy' && showDepositForBuy"
class="deposit-btn"
@click="deposit"
>
Deposit
</v-btn>
<v-btn
v-else
class="action-btn"
:loading="orderLoading"
:disabled="orderLoading"
@ -889,18 +648,16 @@
:class="{ active: selectedOption === 'yes' }"
text
@click="handleOptionChange('yes')"
>{{ yesLabel }} {{ yesPriceCents }}¢</v-btn
>Yes {{ yesPriceCents }}¢</v-btn
>
<v-btn
class="no-btn"
:class="{ active: selectedOption === 'no' }"
text
@click="handleOptionChange('no')"
>{{ noLabel }} {{ noPriceCents }}¢</v-btn
>No {{ noPriceCents }}¢</v-btn
>
</div>
<!-- Buy: Amount Section -->
<template v-if="activeTab === 'buy'">
<div class="input-group">
<div class="amount-header">
<div>
@ -915,66 +672,9 @@
<v-btn class="amount-btn" @click="adjustAmount(100)">+$100</v-btn>
<v-btn class="amount-btn" @click="setMaxAmount">Max</v-btn>
</div>
<div v-if="amount > 0" class="total-row amount-to-win-row">
<span class="label">To win</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ toWinValue }}
</span>
</div>
</div>
<v-btn class="deposit-btn" @click="deposit">Deposit</v-btn>
</template>
<!-- Sell: Shares + To receive + Avg. Price -->
<template v-else>
<div class="input-group shares-group">
<div class="shares-header">
<span class="label">Shares</span>
<div class="shares-input">
<v-text-field
:model-value="shares"
type="number"
min="1"
class="shares-input-field"
hide-details
density="compact"
@update:model-value="onSharesInput"
@keydown="onSharesKeydown"
@paste="onSharesPaste"
></v-text-field>
</div>
</div>
<div class="shares-buttons">
<v-btn class="share-btn" @click="setSharesPercentage(25)">25%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(50)">50%</v-btn>
<v-btn class="share-btn" @click="setSharesPercentage(100)">Max</v-btn>
</div>
</div>
<div class="total-section">
<div class="total-row">
<span class="label">You'll receive</span>
<span class="to-win-value">
<v-icon size="16" color="green">mdi-currency-usd</v-icon>
{{ totalPrice }}
</span>
</div>
<div class="total-row avg-price-row">
<span class="label">
Avg. Price {{ avgPriceCents }}¢
<v-icon size="14" class="info-icon">mdi-information-outline</v-icon>
</span>
</div>
</div>
<v-btn
class="action-btn"
:loading="orderLoading"
:disabled="orderLoading"
@click="submitOrder"
>
{{ actionButtonText }}
</v-btn>
</template>
</template>
</template>
<template v-else>
<div class="price-options hide-in-mobile-sheet">
@ -983,14 +683,14 @@
:class="{ active: selectedOption === 'yes' }"
text
@click="handleOptionChange('yes')"
>{{ yesLabel }} {{ yesPriceCents }}¢</v-btn
>Yes {{ yesPriceCents }}¢</v-btn
>
<v-btn
class="no-btn"
:class="{ active: selectedOption === 'no' }"
text
@click="handleOptionChange('no')"
>{{ noLabel }} {{ noPriceCents }}¢</v-btn
>No {{ noPriceCents }}¢</v-btn
>
</div>
<div class="input-group limit-price-group">
@ -1075,7 +775,7 @@
<div class="total-row">
<span class="label">To win</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{ toWinValue }}</span
><v-icon size="16" color="green">mdi-currency-usd</v-icon> $20</span
>
</div>
</template>
@ -1083,7 +783,7 @@
<div class="total-row">
<span class="label">You'll receive</span
><span class="to-win-value"
><v-icon size="16" color="green">mdi-currency-usd</v-icon> {{
><v-icon size="16" color="green">mdi-currency-usd</v-icon> ${{
totalPrice
}}</span
>
@ -1112,7 +812,7 @@
content-class="merge-dialog"
transition="dialog-transition"
>
<v-card class="merge-dialog-card" rounded="lg" elevation="0">
<v-card class="merge-dialog-card" rounded="lg">
<div class="merge-dialog-header">
<h3 class="merge-dialog-title">Merge shares</h3>
<v-btn
@ -1127,8 +827,8 @@
</div>
<v-card-text class="merge-dialog-body">
<p class="merge-dialog-desc">
Merge a share of {{ yesLabel }} and {{ noLabel }} to get 1 USDC. You can do this to save
cost when trying to get rid of a position.
Merge a share of Yes and No to get 1 USDC. You can do this to save cost when trying to get
rid of a position.
</p>
<div class="merge-amount-row">
<label class="merge-amount-label">Amount</label>
@ -1147,7 +847,7 @@
<button type="button" class="merge-max-link" @click="setMergeMax">Max</button>
</p>
<p v-if="!props.market?.marketId" class="merge-no-market">
Please select a market first (e.g. click Buy {{ yesLabel }}/{{ noLabel }} on a market).
Please select a market first (e.g. click Buy Yes/No on a market).
</p>
<p v-if="mergeError" class="merge-error">{{ mergeError }}</p>
</v-card-text>
@ -1175,7 +875,7 @@
content-class="split-dialog"
transition="dialog-transition"
>
<v-card class="split-dialog-card" rounded="lg" elevation="0">
<v-card class="split-dialog-card" rounded="lg">
<div class="split-dialog-header">
<h3 class="split-dialog-title">Split</h3>
<v-btn
@ -1190,8 +890,8 @@
</div>
<v-card-text class="split-dialog-body">
<p class="split-dialog-desc">
Use USDC to get one share of {{ yesLabel }} and one share of {{ noLabel }} for this
market. 1 USDC 1 complete set.
Use USDC to get one share of Yes and one share of No for this market. 1 USDC 1 complete
set.
</p>
<div class="split-amount-row">
<label class="split-amount-label">Amount (USDC)</label>
@ -1207,7 +907,7 @@
/>
</div>
<p v-if="!props.market?.marketId" class="split-no-market">
Please select a market first (e.g. click Buy {{ yesLabel }}/{{ noLabel }} on a market).
Please select a market first (e.g. click Buy Yes/No on a market).
</p>
<p v-if="splitError" class="split-error">{{ splitError }}</p>
</v-card-text>
@ -1281,8 +981,6 @@ export interface TradeMarketPayload {
title?: string
/** 与 outcomes/outcomePrices 顺序一致,用于下单 tokenId0=Yes 1=No */
clobTokenIds?: string[]
/** 选项展示文案,如 ["Yes","No"] 或 ["Up","Down"],用于 Buy Yes/No 按钮文字 */
outcomes?: string[]
}
const props = withDefaults(
@ -1373,8 +1071,6 @@ defineExpose({ openMergeDialog, openSplitDialog })
const yesPriceCents = computed(() => (props.market ? Math.round(props.market.yesPrice * 100) : 19))
const noPriceCents = computed(() => (props.market ? Math.round(props.market.noPrice * 100) : 82))
const yesLabel = computed(() => props.market?.outcomes?.[0] ?? 'Yes')
const noLabel = computed(() => props.market?.outcomes?.[1] ?? 'No')
function openSheet(option: 'yes' | 'no') {
handleOptionChange(option)
@ -1394,12 +1090,7 @@ const expirationOptions = ref(['5m', '15m', '30m', '1h', '2h', '4h', '8h', '12h'
// Market mode state
const isMarketMode = computed(() => limitType.value === 'Market')
const amount = ref(0) // Market mode amount
/** 余额(从 userStore 同步) */
const balance = computed(() => {
const s = userStore.balance
const n = parseFloat(String(s ?? '0'))
return Number.isFinite(n) ? n : 0
})
const balance = ref(0) // Market mode balance
const orderLoading = ref(false)
const orderError = ref('')
@ -1429,30 +1120,8 @@ const totalPrice = computed(() => {
return (limitPrice.value * shares.value).toFixed(2)
})
/** Sell 模式下的平均单价(¢) */
const avgPriceCents = computed(() => {
const p = limitPrice.value
return (p * 100).toFixed(1)
})
/** To win = 份数 × 1U = shares × 1 USDC */
const toWinValue = computed(() => {
if (isMarketMode.value) {
const price =
selectedOption.value === 'yes'
? (props.market?.yesPrice ?? 0.5)
: (props.market?.noPrice ?? 0.5)
const sharesFromAmount = price > 0 ? amount.value / price : 0
return sharesFromAmount.toFixed(2)
}
return (shares.value * 1).toFixed(2)
})
const actionButtonText = computed(() => {
const label = selectedOption.value === 'yes' ? yesLabel.value : noLabel.value
const tab = activeTab.value
const tabCapitalized = tab.charAt(0).toUpperCase() + tab.slice(1)
return `${tabCapitalized} ${label}`
return `${activeTab.value} ${selectedOption.value.charAt(0).toUpperCase() + selectedOption.value.slice(1)}`
})
function applyInitialOption(option: 'yes' | 'no') {
@ -1606,17 +1275,6 @@ const setMaxAmount = () => {
amount.value = balance.value
}
/** Buy 模式:余额是否足够(>= 所需金额且不为 0。costbalance>0 时用 totalPrice否则用 amount */
const canAffordBuy = computed(() => {
const bal = balance.value
if (bal <= 0) return false
const cost = bal > 0 ? parseFloat(totalPrice.value) || 0 : amount.value
return bal >= cost
})
/** Buy 模式且余额不足时显示 Deposit否则显示 Buy Yes/No */
const showDepositForBuy = computed(() => !canAffordBuy.value)
const deposit = () => {
console.log('Depositing amount:', amount.value)
// API
@ -1715,38 +1373,11 @@ async function submitOrder() {
</script>
<style scoped>
/* 扁平化:移除所有阴影 */
.trade-component,
.trade-sheet-paper,
.merge-dialog-card,
.split-dialog-card {
box-shadow: none !important;
}
.trade-component :deep(.v-btn),
.trade-component :deep(.v-btn::before),
.trade-sheet-inner :deep(.v-btn),
.trade-sheet-inner :deep(.v-btn::before),
.merge-dialog-card .v-btn,
.merge-dialog-card .v-btn::before,
.split-dialog-card .v-btn,
.split-dialog-card .v-btn::before {
box-shadow: none !important;
}
.trade-component :deep(.v-field),
.trade-sheet-inner :deep(.v-field),
.merge-dialog-card :deep(.v-field),
.split-dialog-card :deep(.v-field) {
box-shadow: none !important;
}
.trade-component {
width: 100%;
max-width: 400px;
border-radius: 8px;
overflow: hidden;
border: 1px solid #e7e7e7;
}
.header {
@ -1779,7 +1410,6 @@ async function submitOrder() {
font-size: 14px;
text-transform: none;
color: #666666;
box-shadow: none !important;
}
.more-item {
@ -1801,7 +1431,6 @@ async function submitOrder() {
border-radius: 4px;
text-transform: none;
font-size: 14px;
box-shadow: none !important;
}
.yes-btn.active {
@ -1816,12 +1445,11 @@ async function submitOrder() {
border-radius: 4px;
text-transform: none;
font-size: 14px;
box-shadow: none !important;
}
.no-btn.active {
background-color: #f0b8b8;
color: #cc0000;
background-color: #cc0000;
color: #ffffff;
}
.input-group {
@ -1953,7 +1581,6 @@ async function submitOrder() {
text-transform: none;
font-size: 12px;
padding: 4px;
box-shadow: none !important;
}
.matching-info {
@ -1964,17 +1591,6 @@ async function submitOrder() {
color: #3d8b40;
}
.avg-price-row {
font-size: 12px;
color: #666;
}
.avg-price-row .info-icon {
margin-left: 4px;
vertical-align: middle;
opacity: 0.7;
}
.expiration-header {
display: flex;
justify-content: space-between;
@ -1993,10 +1609,6 @@ async function submitOrder() {
border-radius: 4px;
}
.expiration-select :deep(.v-field) {
box-shadow: none !important;
}
.total-section {
padding: 12px;
border-top: 1px solid #e0e0e0;
@ -2026,12 +1638,11 @@ async function submitOrder() {
width: 100%;
background-color: #0066cc;
color: #ffffff;
border-radius: 6px;
border-radius: 0;
padding: 16px;
font-size: 15px;
font-weight: 500;
text-transform: none;
box-shadow: none !important;
}
/* Market Mode Styles */
@ -2074,32 +1685,17 @@ async function submitOrder() {
text-transform: none;
font-size: 14px;
padding: 8px;
box-shadow: none !important;
}
.amount-to-win-row {
margin-top: 12px;
padding-top: 12px;
border-top: 1px solid #eee;
}
.deposit-btn {
width: 100%;
background-color: #0066cc;
color: #ffffff;
border-radius: 6px;
border-radius: 0;
padding: 16px;
font-size: 15px;
font-weight: 500;
text-transform: none;
box-shadow: none !important;
}
.deposit-btn--secondary {
margin-top: 8px;
background-color: transparent;
color: #0066cc;
border: 1px solid #0066cc;
}
/* 移动端底部交易栏(红框样式) */
@ -2227,7 +1823,6 @@ async function submitOrder() {
.merge-dialog-card {
padding: 0;
overflow: hidden;
box-shadow: none !important;
}
.merge-dialog-header {
@ -2330,14 +1925,12 @@ async function submitOrder() {
.merge-submit-btn {
text-transform: none;
font-weight: 600;
box-shadow: none !important;
}
/* Split dialog */
.split-dialog-card {
padding: 0;
overflow: hidden;
box-shadow: none !important;
}
.split-dialog-header {
display: flex;
@ -2400,6 +1993,5 @@ async function submitOrder() {
.split-submit-btn {
text-transform: none;
font-weight: 600;
box-shadow: none !important;
}
</style>

View File

@ -1,6 +1,6 @@
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
import { getUsdcBalance, formatUsdcBalance, getUserInfo } from '@/api/user'
import { getUsdcBalance, formatUsdcBalance } from '@/api/user'
export interface UserInfo {
/** 用户 IDAPI 可能返回 id 或 ID */
@ -89,30 +89,6 @@ export const useUserStore = defineStore('user', () => {
}
}
/** 请求用户信息(需已登录),更新 store 中的 user */
async function fetchUserInfo() {
const headers = getAuthHeaders()
if (!headers) return
try {
const res = await getUserInfo(headers)
console.log('[fetchUserInfo] 接口响应:', JSON.stringify(res, null, 2))
if ((res.code === 0 || res.code === 200) && res.data) {
const u = res.data
user.value = {
id: u.ID,
ID: u.ID,
userName: u.userName,
nickName: u.nickName,
headerImg: u.headerImg,
...u,
}
if (token.value && user.value) saveToStorage(token.value, user.value)
}
} catch (e) {
console.error('[fetchUserInfo] 请求失败:', e)
}
}
return {
token,
user,
@ -123,6 +99,5 @@ export const useUserStore = defineStore('user', () => {
logout,
getAuthHeaders,
fetchUsdcBalance,
fetchUserInfo,
}
})

View File

@ -86,7 +86,7 @@
rounded="sm"
@click="openTrade(market, index, 'yes')"
>
{{ yesLabel(market) }} {{ yesPrice(market) }}
Yes {{ yesPrice(market) }}
</v-btn>
<v-btn
class="buy-no-btn"
@ -95,7 +95,7 @@
rounded="sm"
@click="openTrade(market, index, 'no')"
>
{{ noLabel(market) }} {{ noPrice(market) }}
No {{ noPrice(market) }}
</v-btn>
</div>
</div>
@ -125,7 +125,7 @@
rounded="sm"
@click="openSheetWithOption('yes')"
>
{{ barMarket ? yesLabel(barMarket) : 'Yes' }} {{ barMarket ? yesPrice(barMarket) : '0¢' }}
Yes {{ barMarket ? yesPrice(barMarket) : '0¢' }}
</v-btn>
<v-btn
class="mobile-bar-btn mobile-bar-no"
@ -133,7 +133,7 @@
rounded="sm"
@click="openSheetWithOption('no')"
>
{{ barMarket ? noLabel(barMarket) : 'No' }} {{ barMarket ? noPrice(barMarket) : '0¢' }}
No {{ barMarket ? noPrice(barMarket) : '0¢' }}
</v-btn>
<v-menu
v-model="mobileMenuOpen"
@ -239,7 +239,6 @@ const tradeMarketPayload = computed(() => {
noPrice,
title: m.question,
clobTokenIds: m.clobTokenIds,
outcomes: m.outcomes,
}
})
@ -567,14 +566,6 @@ function marketChance(market: PmEventMarketItem): number {
return Math.min(100, Math.max(0, Math.round(yesPrice * 100)))
}
function yesLabel(market: PmEventMarketItem): string {
return market?.outcomes?.[0] ?? 'Yes'
}
function noLabel(market: PmEventMarketItem): string {
return market?.outcomes?.[1] ?? 'No'
}
function yesPrice(market: PmEventMarketItem): string {
const raw = market?.outcomePrices?.[0]
if (raw == null) return '0¢'
@ -743,14 +734,13 @@ watch(
}
}
/* 分时图卡片(扁平化) */
/* 分时图卡片 */
.chart-card.polymarket-chart {
margin-bottom: 24px;
padding: 20px 24px 16px;
background-color: #ffffff;
border: 1px solid #e7e7e7;
border-radius: 12px;
box-shadow: none;
}
.chart-header {
@ -894,7 +884,6 @@ watch(
border: 1px solid #e7e7e7;
border-radius: 12px;
overflow: hidden;
box-shadow: none;
}
.markets-list {

View File

@ -506,14 +506,12 @@ const tradeDialogMarket = ref<{
title: string
marketId?: string
clobTokenIds?: string[]
yesLabel?: string
noLabel?: string
} | null>(null)
const scrollRef = ref<HTMLElement | null>(null)
function onCardOpenTrade(
side: 'yes' | 'no',
market?: { id: string; title: string; marketId?: string; yesLabel?: string; noLabel?: string },
market?: { id: string; title: string; marketId?: string },
) {
tradeDialogSide.value = side
tradeDialogMarket.value = market ?? null
@ -528,11 +526,7 @@ const homeTradeMarketPayload = computed(() => {
const chance = 50
const yesPrice = Math.min(1, Math.max(0, chance / 100))
const noPrice = 1 - yesPrice
const outcomes =
m.yesLabel != null || m.noLabel != null
? [m.yesLabel ?? 'Yes', m.noLabel ?? 'No']
: undefined
return { marketId, yesPrice, noPrice, title: m.title, clobTokenIds: m.clobTokenIds, outcomes }
return { marketId, yesPrice, noPrice, title: m.title, clobTokenIds: m.clobTokenIds }
})
const sentinelRef = ref<HTMLElement | null>(null)

View File

@ -177,13 +177,13 @@ const connectWithWallet = async () => {
walletAddress,
},
)
//
console.log('[walletLogin] 登录响应:', JSON.stringify(loginData, null, 2))
console.log('Login API response:', loginData)
if (loginData.code === 0 && loginData.data) {
const { token, user } = loginData.data
console.log('[walletLogin] 存入 store 的 user:', JSON.stringify(user, null, 2))
userStore.setUser({ token, user })
userStore.setUser({
token: loginData.data.token,
user: loginData.data.user,
})
userStore.fetchUsdcBalance()
}

View File

@ -130,7 +130,7 @@
rounded="sm"
@click="openSheetWithOption('yes')"
>
{{ yesLabel }} {{ yesPriceCents }}¢
Yes {{ yesPriceCents }}¢
</v-btn>
<v-btn
class="mobile-bar-btn mobile-bar-no"
@ -138,7 +138,7 @@
rounded="sm"
@click="openSheetWithOption('no')"
>
{{ noLabel }} {{ noPriceCents }}¢
No {{ noPriceCents }}¢
</v-btn>
<v-menu
v-model="mobileMenuOpen"
@ -332,7 +332,6 @@ const tradeMarketPayload = computed(() => {
noPrice,
title: m.question,
clobTokenIds: m.clobTokenIds,
outcomes: m.outcomes,
}
}
const qId = route.query.marketId
@ -373,8 +372,6 @@ const yesPriceCents = computed(() =>
const noPriceCents = computed(() =>
tradeMarketPayload.value ? Math.round(tradeMarketPayload.value.noPrice * 100) : 0
)
const yesLabel = computed(() => currentMarket.value?.outcomes?.[0] ?? 'Yes')
const noLabel = computed(() => currentMarket.value?.outcomes?.[1] ?? 'No')
function openSheetWithOption(side: 'yes' | 'no') {
tradeInitialOptionFromBar.value = side
@ -924,14 +921,13 @@ onUnmounted(() => {
font-weight: 600;
}
/* Polymarket 样式分时图卡片(扁平化) */
/* Polymarket 样式分时图卡片 */
.chart-card.polymarket-chart {
margin-top: 32px;
padding: 20px 24px 16px;
background-color: #ffffff;
border: 1px solid #e7e7e7;
border-radius: 12px;
box-shadow: none;
}
.chart-header {
@ -1031,12 +1027,11 @@ onUnmounted(() => {
color: #111827;
}
/* Order Book Card Styles(扁平化) */
/* Order Book Card Styles */
.order-book-card {
padding: 0;
background-color: #ffffff;
border: 1px solid #e7e7e7;
box-shadow: none;
}
/* 左右布局:左侧弹性,右侧固定 */
@ -1146,12 +1141,11 @@ onUnmounted(() => {
}
}
/* Comments / Top Holders / Activity(扁平化) */
/* Comments / Top Holders / Activity */
.activity-card {
margin-top: 32px;
border: 1px solid #e5e7eb;
overflow: hidden;
box-shadow: none;
}
.detail-tabs {