fish/trade
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

适配移动端展示

Browse Source
This commit is contained in:
fish
2026-05-04 21:36:48 +08:00
parent c852b1d871
commit b6bacbfae9
10 changed files with 298 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
web/frontend/src/views/ScoresView.vue
View File

@@ -3,6 +3,9 @@ import { onMounted, reactive, ref } from 'vue'
import { listContracts, listScores, type Score } from '@/api/scores'
import ScoreDetailDrawer from '@/components/ScoreDetailDrawer.vue'
import { parseTsCode } from '@/utils/contract'
import { useMobile } from '@/composables/useMobile'
const { isMobile } = useMobile()
const filter = reactive<{
ts_code?: string
@@ -59,14 +62,14 @@ onMounted(async () => {
<template>
<div class="page">
<el-card shadow="never" class="filter-card">
<el-form :inline="true">
<el-form :inline="!isMobile">
<el-form-item label="合约">
<el-select
v-model="filter.ts_code"
placeholder="全部合约"
clearable
filterable
style="width: 200px"
:style="{ width: isMobile ? '100%' : '200px' }"
>
<el-option v-for="c in contracts" :key="c" :label="c" :value="c" />
</el-select>
@@ -79,6 +82,7 @@ onMounted(async () => {
range-separator="→"
start-placeholder="起"
end-placeholder="止"
:style="{ width: isMobile ? '100%' : 'auto' }"
/>
</el-form-item>
<el-form-item label="条数">
@@ -87,8 +91,8 @@ onMounted(async () => {
<el-form-item>
<el-button type="primary" :loading="loading" style="width: 88px" @click="reload">查询</el-button>
</el-form-item>
<el-form-item label="快捷">
<el-button-group class="signal-group">
<el-form-item label="快捷" class="signal-item">
<el-button-group class="signal-group" :size="isMobile ? 'small' : 'default'">
<el-button
:type="filter.signal === '强烈看多' ? 'success' : ''"
@click="toggleSignal('强烈看多')"
@@ -118,40 +122,42 @@ onMounted(async () => {
</el-form>
</el-card>
<el-table :data="rows" v-loading="loading" stripe class="score-table">
<el-table-column prop="trade_date" label="日期" width="100" />
<el-table-column label="品种" width="80">
<template #default="{ row }">
{{ parseTsCode(row.ts_code).symbol }}
</template>
</el-table-column>
<el-table-column label="合约" width="80">
<template #default="{ row }">
{{ parseTsCode(row.ts_code).contract }}
</template>
</el-table-column>
<el-table-column prop="close" label="收盘" width="90" />
<el-table-column prop="oi" label="持仓" width="100" />
<el-table-column prop="oi_chg" label="持仓变化" width="100" />
<el-table-column prop="short_term" label="短期(7d)" width="90" />
<el-table-column prop="medium_term" label="中期(15d)" width="90" />
<el-table-column prop="long_term" label="长期(30d)" width="90" />
<el-table-column prop="composite" label="综合" width="80">
<template #default="{ row }">
<strong>{{ row.composite.toFixed(2) }}</strong>
</template>
</el-table-column>
<el-table-column prop="signal" label="信号" min-width="160">
<template #default="{ row }">
<el-tag :type="signalTagType(row.signal)">{{ row.signal }}</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="80" fixed="right">
<template #default="{ row }">
<el-button type="primary" link @click="drawerScoreId = row.id">明细</el-button>
</template>
</el-table-column>
</el-table>
<div class="table-wrapper" v-loading="loading">
<el-table :data="rows" stripe class="score-table">
<el-table-column prop="trade_date" label="日期" width="100" />
<el-table-column label="品种" width="80">
<template #default="{ row }">
{{ parseTsCode(row.ts_code).symbol }}
</template>
</el-table-column>
<el-table-column label="合约" width="80">
<template #default="{ row }">
{{ parseTsCode(row.ts_code).contract }}
</template>
</el-table-column>
<el-table-column prop="close" label="收盘" width="90" />
<el-table-column prop="oi" label="持仓" width="100" />
<el-table-column prop="oi_chg" label="持仓变化" width="100" />
<el-table-column prop="short_term" label="短期(7d)" width="90" />
<el-table-column prop="medium_term" label="中期(15d)" width="90" />
<el-table-column prop="long_term" label="长期(30d)" width="90" />
<el-table-column prop="composite" label="综合" width="80">
<template #default="{ row }">
<strong>{{ row.composite.toFixed(2) }}</strong>
</template>
</el-table-column>
<el-table-column prop="signal" label="信号" min-width="160">
<template #default="{ row }">
<el-tag :type="signalTagType(row.signal)">{{ row.signal }}</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="80" fixed="right">
<template #default="{ row }">
<el-button type="primary" link @click="drawerScoreId = row.id">明细</el-button>
</template>
</el-table-column>
</el-table>
</div>
<ScoreDetailDrawer
:score-id="drawerScoreId"
@@ -177,7 +183,21 @@ onMounted(async () => {
outline: none;
box-shadow: none;
}
.score-table {
.table-wrapper {
background: var(--el-bg-color);
border-radius: 4px;
overflow-x: auto;
}
.score-table {
min-width: 960px;
}
@media (max-width: 768px) {
.signal-item {
flex-wrap: wrap;
}
.signal-group {
flex-wrap: wrap;
}
}
</style>