feat(moneyTrend):资金趋势图表增加主力当日净流入数据并优化展示效果

- 在资金趋势图表中添加主力当日净流入数据
- 优化图表颜色和样式,增加最大值和最小值标记
- 添加平均值参考线
- 调整轴线样式,提高可读性
- 后端接口增加数据天数至360天
This commit is contained in:
ArvinLovegood 2025-05-15 21:28:59 +08:00
parent 2a274db7ae
commit 71676eead4
4 changed files with 52 additions and 10 deletions

1
app.go
View File

@ -1134,5 +1134,6 @@ func (a *App) GetMoneyRankSina(sort string) []map[string]any {
func (a *App) GetStockMoneyTrendByDay(stockCode string, days int) []map[string]any { func (a *App) GetStockMoneyTrendByDay(stockCode string, days int) []map[string]any {
res := data.NewMarketNewsApi().GetStockMoneyTrendByDay(stockCode, days) res := data.NewMarketNewsApi().GetStockMoneyTrendByDay(stockCode, days)
slice.Reverse(res)
return res return res
} }

View File

@ -51,7 +51,7 @@ func TestGetMoneyRankSina(t *testing.T) {
} }
func TestGetStockMoneyTrendByDay(t *testing.T) { func TestGetStockMoneyTrendByDay(t *testing.T) {
res := NewMarketNewsApi().GetStockMoneyTrendByDay("sh600438", 120) res := NewMarketNewsApi().GetStockMoneyTrendByDay("sh600438", 360)
for i, re := range res { for i, re := range res {
logger.SugaredLogger.Debugf("key: %+v, value: %+v", i, re) logger.SugaredLogger.Debugf("key: %+v, value: %+v", i, re)
} }

View File

@ -34,10 +34,11 @@ onMounted(
) )
const handleLine = (code, days) => { const handleLine = (code, days) => {
GetStockMoneyTrendByDay(code, days).then(result => { GetStockMoneyTrendByDay(code, days).then(result => {
console.log("GetStockMoneyTrendByDay", result) //console.log("GetStockMoneyTrendByDay", result)
const chart = echarts.init(LineChartRef.value); const chart = echarts.init(LineChartRef.value);
const categoryData = []; const categoryData = [];
const netamount_values = []; const netamount_values = [];
const r0_net_values = [];
const trades_values = []; const trades_values = [];
let volume = [] let volume = []
@ -50,6 +51,7 @@ const handleLine = (code, days) => {
netamount_values.push(netamount) netamount_values.push(netamount)
let price = Number(resultElement.trade); let price = Number(resultElement.trade);
trades_values.push(price) trades_values.push(price)
r0_net_values.push((resultElement.r0_net / 10000).toFixed(2))
if (min === 0 || min > price) { if (min === 0 || min > price) {
min = price min = price
@ -92,9 +94,10 @@ const handleLine = (code, days) => {
}, },
legend: { legend: {
show: true, show: true,
data: ['当日净流入','累计净流入', '股价'], data: ['当日净流入','主力当日净流入','累计净流入', '股价'],
selected: { selected: {
'当日净流入': true, '当日净流入': true,
'主力当日净流入': false,
'累计净流入': false, '累计净流入': false,
'股价': true, '股价': true,
}, },
@ -162,7 +165,7 @@ const handleLine = (code, days) => {
symbolSize: [10, 20], symbolSize: [10, 20],
symbolOffset: [10, 0], symbolOffset: [10, 0],
itemStyle: { itemStyle: {
color: '#FC290D' color: '#0d7dfc'
}, },
label: { label: {
position: 'right', position: 'right',
@ -178,7 +181,45 @@ const handleLine = (code, days) => {
type: 'average', type: 'average',
name: 'Average', name: 'Average',
lineStyle: { lineStyle: {
color: '#ff001e', color: '#0077ff',
width: 0.5
},
},
]
},
type: 'line'
},
{
name: '主力当日净流入',
data: r0_net_values,
smooth: true,
showSymbol: false,
lineStyle: {
width: 2
},
markPoint: {
symbol: 'arrow',
symbolRotate: 90,
symbolSize: [10, 20],
symbolOffset: [10, 0],
itemStyle: {
color: '#0d7dfc'
},
label: {
position: 'right',
},
data: [
{type: 'max', name: 'Max'},
{type: 'min', name: 'Min'}
]
},
markLine: {
data: [
{
type: 'average',
name: 'Average',
lineStyle: {
color: '#0077ff',
width: 0.5 width: 0.5
}, },
}, },
@ -200,7 +241,7 @@ const handleLine = (code, days) => {
symbolSize: [10, 20], symbolSize: [10, 20],
symbolOffset: [10, 0], symbolOffset: [10, 0],
itemStyle: { itemStyle: {
color: '#FC290D' color: '#0059ff'
}, },
label: { label: {
position: 'right', position: 'right',
@ -216,7 +257,7 @@ const handleLine = (code, days) => {
type: 'average', type: 'average',
name: 'Average', name: 'Average',
lineStyle: { lineStyle: {
color: '#ff001e', color: '#0059ff',
width: 0.5 width: 0.5
}, },
}, },
@ -240,7 +281,7 @@ const handleLine = (code, days) => {
symbolSize: [10, 20], symbolSize: [10, 20],
symbolOffset: [10, 0], symbolOffset: [10, 0],
itemStyle: { itemStyle: {
color: '#0940f3' color: '#f39509'
}, },
label: { label: {
position: 'right', position: 'right',
@ -256,7 +297,7 @@ const handleLine = (code, days) => {
type: 'average', type: 'average',
name: 'Average', name: 'Average',
lineStyle: { lineStyle: {
color: '#0940f3', color: '#f39509',
width: 0.5 width: 0.5
}, },
}, },

View File

@ -2001,7 +2001,7 @@ function delStockGroup(code,name,groupId){
</template> </template>
</n-modal> </n-modal>
<n-modal v-model:show="modalShow5" :title="data.name+'资金趋势'" style="width: 1000px" :preset="'card'" @after-enter="getMoneyTrendLine"> <n-modal v-model:show="modalShow5" :title="data.name+'资金趋势'" style="width: 1000px" :preset="'card'" @after-enter="getMoneyTrendLine">
<money-trend :code="data.code" :name="data.name" :days="365" :dark-theme="data.darkTheme" :chart-height="500"></money-trend> <money-trend :code="data.code" :name="data.name" :days="360" :dark-theme="data.darkTheme" :chart-height="500"></money-trend>
</n-modal> </n-modal>
</template> </template>