u
This commit is contained in:
parent
e97faa9416
commit
f5c2051226
@ -3,7 +3,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>AI 自动交易 - Tradus</title>
|
<title>Tradus Auto Trading | Based on AI Agent</title>
|
||||||
<link rel="stylesheet" href="/static/css/style.css">
|
<link rel="stylesheet" href="/static/css/style.css">
|
||||||
<style>
|
<style>
|
||||||
/* 覆盖全局 #app 样式 */
|
/* 覆盖全局 #app 样式 */
|
||||||
@ -549,6 +549,104 @@
|
|||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 响应式设计 */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.trading-page {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.trading-container {
|
||||||
|
min-width: auto;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.trading-header {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.trading-title {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.trading-title span {
|
||||||
|
display: block;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-grid {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-card {
|
||||||
|
padding: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-value {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs {
|
||||||
|
overflow-x: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab {
|
||||||
|
padding: 10px 16px;
|
||||||
|
font-size: 13px;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 表格横向滚动 */
|
||||||
|
.table-wrapper {
|
||||||
|
overflow-x: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orders-table {
|
||||||
|
min-width: 800px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orders-table th,
|
||||||
|
.orders-table td {
|
||||||
|
padding: 10px 12px;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.position-summary {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-item {
|
||||||
|
min-width: calc(50% - 8px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.grade-stats {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-status span {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 480px) {
|
||||||
|
.stats-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.trading-title {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-value {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -559,7 +657,7 @@
|
|||||||
<div class="sticky-header">
|
<div class="sticky-header">
|
||||||
<!-- 头部 -->
|
<!-- 头部 -->
|
||||||
<div class="trading-header">
|
<div class="trading-header">
|
||||||
<h1 class="trading-title">AI 自动交易 <span>Auto Trading</span></h1>
|
<h1 class="trading-title">AI 自动化交易 <span>| AI Agent Trading System</span></h1>
|
||||||
<div style="display: flex; align-items: center; gap: 12px;">
|
<div style="display: flex; align-items: center; gap: 12px;">
|
||||||
<div class="monitor-status">
|
<div class="monitor-status">
|
||||||
<div class="monitor-dot" :class="{ running: monitorRunning }"></div>
|
<div class="monitor-dot" :class="{ running: monitorRunning }"></div>
|
||||||
@ -662,7 +760,8 @@
|
|||||||
</svg>
|
</svg>
|
||||||
<p>暂无活跃订单</p>
|
<p>暂无活跃订单</p>
|
||||||
</div>
|
</div>
|
||||||
<table v-else class="orders-table">
|
<div v-else class="table-wrapper">
|
||||||
|
<table class="orders-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>订单ID</th>
|
<th>订单ID</th>
|
||||||
@ -729,6 +828,7 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 历史订单 -->
|
<!-- 历史订单 -->
|
||||||
@ -740,7 +840,8 @@
|
|||||||
</svg>
|
</svg>
|
||||||
<p>暂无历史订单</p>
|
<p>暂无历史订单</p>
|
||||||
</div>
|
</div>
|
||||||
<table v-else class="orders-table">
|
<div v-else class="table-wrapper">
|
||||||
|
<table class="orders-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>订单ID</th>
|
<th>订单ID</th>
|
||||||
@ -773,6 +874,7 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 详细统计 -->
|
<!-- 详细统计 -->
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user