支撑位和阻力位改为逐个标注:表格用S1/R1标签,抽屉分开展示每层价位
This commit is contained in:
@@ -88,12 +88,11 @@ async function handleRun() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function formatLevels(json: string): string {
|
function parseLevels(json: string): number[] {
|
||||||
try {
|
try {
|
||||||
const arr = JSON.parse(json) as number[]
|
return JSON.parse(json) as number[]
|
||||||
return arr.join(', ')
|
|
||||||
} catch {
|
} catch {
|
||||||
return '-'
|
return []
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -146,11 +145,17 @@ onMounted(fetchList)
|
|||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="支撑位" width="130">
|
<el-table-column label="支撑位" width="160">
|
||||||
<template #default="{ row }">{{ formatLevels(row.support) }}</template>
|
<template #default="{ row }">
|
||||||
|
<span v-for="(v, i) in parseLevels(row.support)" :key="'s'+i" class="level-chip sup">S{{ i + 1 }} {{ v }}</span>
|
||||||
|
<span v-if="!parseLevels(row.support).length">-</span>
|
||||||
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="阻力位" width="130">
|
<el-table-column label="阻力位" width="160">
|
||||||
<template #default="{ row }">{{ formatLevels(row.resistance) }}</template>
|
<template #default="{ row }">
|
||||||
|
<span v-for="(v, i) in parseLevels(row.resistance)" :key="'r'+i" class="level-chip res">R{{ i + 1 }} {{ v }}</span>
|
||||||
|
<span v-if="!parseLevels(row.resistance).length">-</span>
|
||||||
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="明细" width="80" align="center">
|
<el-table-column label="明细" width="80" align="center">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
@@ -172,17 +177,25 @@ onMounted(fetchList)
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="drawer-section">
|
<div class="drawer-section">
|
||||||
<div class="drawer-label">关键价位</div>
|
<div class="drawer-label">支撑位</div>
|
||||||
<div class="drawer-levels">
|
<div class="level-rows">
|
||||||
<div class="level-block support">
|
<div v-for="(v, i) in parseLevels(selectedRow.support)" :key="'ds'+i" class="level-row sup">
|
||||||
<span class="level-tag">支撑</span>
|
<span class="level-tag">支撑{{ i + 1 }}</span>
|
||||||
<span>{{ formatLevels(selectedRow.support) || '-' }}</span>
|
<span class="level-val">{{ v }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="level-block resistance">
|
<div v-if="!parseLevels(selectedRow.support).length" class="level-row">-</div>
|
||||||
<span class="level-tag">阻力</span>
|
|
||||||
<span>{{ formatLevels(selectedRow.resistance) || '-' }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="drawer-section">
|
||||||
|
<div class="drawer-label">阻力位</div>
|
||||||
|
<div class="level-rows">
|
||||||
|
<div v-for="(v, i) in parseLevels(selectedRow.resistance)" :key="'dr'+i" class="level-row res">
|
||||||
|
<span class="level-tag">阻力{{ i + 1 }}</span>
|
||||||
|
<span class="level-val">{{ v }}</span>
|
||||||
|
</div>
|
||||||
|
<div v-if="!parseLevels(selectedRow.resistance).length" class="level-row">-</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="drawer-section">
|
<div class="drawer-section">
|
||||||
@@ -219,13 +232,31 @@ onMounted(fetchList)
|
|||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.level-chip {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 1px 6px;
|
||||||
|
border-radius: 3px;
|
||||||
|
margin-right: 4px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.level-chip.sup {
|
||||||
|
background: #ecf5ff;
|
||||||
|
color: #409eff;
|
||||||
|
}
|
||||||
|
.level-chip.res {
|
||||||
|
background: #fef0f0;
|
||||||
|
color: #f56c6c;
|
||||||
|
}
|
||||||
|
|
||||||
.drawer-section {
|
.drawer-section {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
.drawer-label {
|
.drawer-label {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: var(--el-text-color-secondary);
|
color: var(--el-text-color-secondary);
|
||||||
margin-bottom: 6px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
.drawer-confidence {
|
.drawer-confidence {
|
||||||
margin-left: 12px;
|
margin-left: 12px;
|
||||||
@@ -241,29 +272,39 @@ onMounted(fetchList)
|
|||||||
.drawer-text.risk {
|
.drawer-text.risk {
|
||||||
color: var(--el-color-warning);
|
color: var(--el-color-warning);
|
||||||
}
|
}
|
||||||
.drawer-levels {
|
|
||||||
|
.level-rows {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 24px;
|
flex-direction: column;
|
||||||
|
gap: 8px;
|
||||||
}
|
}
|
||||||
.level-block {
|
.level-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 8px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
.level-tag {
|
.level-tag {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
padding: 2px 8px;
|
padding: 2px 10px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
min-width: 54px;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
.support .level-tag {
|
.level-row.sup .level-tag {
|
||||||
background: #ecf5ff;
|
background: #ecf5ff;
|
||||||
color: #409eff;
|
color: #409eff;
|
||||||
}
|
}
|
||||||
.resistance .level-tag {
|
.level-row.res .level-tag {
|
||||||
background: #fef0f0;
|
background: #fef0f0;
|
||||||
color: #f56c6c;
|
color: #f56c6c;
|
||||||
}
|
}
|
||||||
|
.level-val {
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--el-text-color-primary);
|
||||||
|
}
|
||||||
|
|
||||||
.drawer-section.meta {
|
.drawer-section.meta {
|
||||||
margin-top: 24px;
|
margin-top: 24px;
|
||||||
padding-top: 16px;
|
padding-top: 16px;
|
||||||
|
|||||||
Reference in New Issue
Block a user