大单提醒的图标,通知重叠问题
This commit is contained in:
parent
1ae0639fc2
commit
e8d60aa63a
@ -47,3 +47,12 @@ a:hover {
|
|||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 大单提醒:买入 Top / 卖出 Bottom(无 type,避免覆盖自定义 icon) */
|
||||||
|
.large-order-alert--buy .el-notification__icon {
|
||||||
|
color: var(--up);
|
||||||
|
}
|
||||||
|
|
||||||
|
.large-order-alert--sell .el-notification__icon {
|
||||||
|
color: var(--down);
|
||||||
|
}
|
||||||
|
|||||||
@ -1,4 +1,6 @@
|
|||||||
|
import { markRaw, nextTick } from 'vue'
|
||||||
import { ElNotification } from 'element-plus'
|
import { ElNotification } from 'element-plus'
|
||||||
|
import { Bottom, Top } from '@element-plus/icons-vue'
|
||||||
import type { ContractItem, TradeTick } from '../types'
|
import type { ContractItem, TradeTick } from '../types'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -9,15 +11,28 @@ export function notifyLargeOrders(trades: TradeTick[], contract: ContractItem):
|
|||||||
const threshold = contract.largeOrderAlertLots
|
const threshold = contract.largeOrderAlertLots
|
||||||
if (!threshold || threshold <= 0 || trades.length === 0) return
|
if (!threshold || threshold <= 0 || trades.length === 0) return
|
||||||
|
|
||||||
|
let shown = 0
|
||||||
for (const t of trades) {
|
for (const t of trades) {
|
||||||
if (t.volume <= threshold) continue
|
if (t.volume <= threshold) continue
|
||||||
const sideLabel = t.side === 'B' ? '买' : '卖'
|
const isBuy = t.side === 'B'
|
||||||
|
const sideLabel = isBuy ? '买' : '卖'
|
||||||
ElNotification({
|
ElNotification({
|
||||||
title: `大单提醒 · ${contract.name || contract.code}`,
|
title: `大单提醒 · ${contract.name || contract.code}`,
|
||||||
message: `${t.time} ${sideLabel} ${t.volume}手 @ ${t.price.toFixed(2)}`,
|
message: `${t.time} ${sideLabel} ${t.volume}手 @ ${t.price.toFixed(2)}`,
|
||||||
type: t.side === 'B' ? 'error' : 'success',
|
// 勿设 type:type 会覆盖自定义 icon,买入会变成 error 图标
|
||||||
duration: 4500,
|
icon: markRaw(isBuy ? Top : Bottom),
|
||||||
|
duration: 10000,
|
||||||
position: 'top-right',
|
position: 'top-right',
|
||||||
|
customClass: isBuy ? 'large-order-alert--buy' : 'large-order-alert--sell',
|
||||||
|
})
|
||||||
|
shown++
|
||||||
|
}
|
||||||
|
|
||||||
|
// 同步连弹时前一个通知尚未 mount(visible=false → offsetHeight=0),会叠在一起;
|
||||||
|
// 等 DOM 就绪后按真实高度重算 offset。
|
||||||
|
if (shown > 1) {
|
||||||
|
void nextTick(() => {
|
||||||
|
ElNotification.updateOffsets('top-right')
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user