diff --git a/src/views/invest/accountDealAnalysis/index.vue b/src/views/invest/accountDealAnalysis/index.vue index 2388d63..9b0ef25 100644 --- a/src/views/invest/accountDealAnalysis/index.vue +++ b/src/views/invest/accountDealAnalysis/index.vue @@ -423,17 +423,25 @@ const drawBar = (data) => { type: 'bar', barWidth: 20, // 根据需求调整数值大小，单位是像素 itemStyle: { - color: '#2283cf' + // 此处可以是一个固定颜色值，也可以是一个回调函数根据数据动态计算颜色 + color: function (params) { + // 这里可以根据需要设置不同的颜色，比如根据数据值 + if (params.data <= 0) { + return 'green' + } else if (params.data > 0) { + return 'red' + } + } } } ], // 添加点击事件的处理函数 emphasis: { - itemStyle: { - color: '#2283cf', - barWidth: 20 // 根据需求调整数值大小，单位是像素 - }, - barWidth: 24 // 根据需求调整数值大小，单位是像素 + // itemStyle: { + // color: '#2283cf', + // barWidth: 20 // 根据需求调整数值大小，单位是像素 + // }, + // barWidth: 24 // 根据需求调整数值大小，单位是像素 } } @@ -497,7 +505,15 @@ const drawLine = (data) => { color: '#4181c9' }, itemStyle: { - color: '#4181c9' + // 此处可以是一个固定颜色值，也可以是一个回调函数根据数据动态计算颜色 + color: function (params) { + // 这里可以根据需要设置不同的颜色，比如根据数据值 + if (params.data <= 0) { + return 'green' + } else if (params.data > 0) { + return 'red' + } + } }, smooth: true, symbol: 'emptyCircle', diff --git a/src/views/invest/accountDealRecord/index.vue b/src/views/invest/accountDealRecord/index.vue index 78accac..026ab6e 100644 --- a/src/views/invest/accountDealRecord/index.vue +++ b/src/views/invest/accountDealRecord/index.vue @@ -23,6 +23,11 @@ + + + + + diff --git a/src/views/invest/accountsBalance/index.vue b/src/views/invest/accountsBalance/index.vue index 70639b1..a39d100 100644 --- a/src/views/invest/accountsBalance/index.vue +++ b/src/views/invest/accountsBalance/index.vue @@ -290,17 +290,25 @@ const drawBar = (data) => { type: 'bar', barWidth: 20, // 根据需求调整数值大小，单位是像素 itemStyle: { - color: '#2283cf' + // 此处可以是一个固定颜色值，也可以是一个回调函数根据数据动态计算颜色 + color: function (params) { + // 这里可以根据需要设置不同的颜色，比如根据数据值 + if (params.data <= 0) { + return 'green' + } else if (params.data > 0) { + return 'red' + } + } } } ], // 添加点击事件的处理函数 emphasis: { - itemStyle: { - color: '#2283cf', - barWidth: 20 // 根据需求调整数值大小，单位是像素 - }, - barWidth: 24 // 根据需求调整数值大小，单位是像素 + // itemStyle: { + // color: '#2283cf', + // barWidth: 20 // 根据需求调整数值大小，单位是像素 + // }, + // barWidth: 24 // 根据需求调整数值大小，单位是像素 } } @@ -364,7 +372,15 @@ const drawLine = (data) => { color: '#4181c9' }, itemStyle: { - color: '#4181c9' + // 此处可以是一个固定颜色值，也可以是一个回调函数根据数据动态计算颜色 + color: function (params) { + // 这里可以根据需要设置不同的颜色，比如根据数据值 + if (params.data <= 0) { + return 'green' + } else if (params.data > 0) { + return 'red' + } + } }, smooth: true, symbol: 'emptyCircle', diff --git a/src/views/invest/creditCardDealAnalysis/index.vue b/src/views/invest/creditCardDealAnalysis/index.vue index b66b684..41fe202 100644 --- a/src/views/invest/creditCardDealAnalysis/index.vue +++ b/src/views/invest/creditCardDealAnalysis/index.vue @@ -472,17 +472,25 @@ const drawBar = (data) => { type: 'bar', barWidth: 20, // 根据需求调整数值大小，单位是像素 itemStyle: { - color: '#2283cf' + // 此处可以是一个固定颜色值，也可以是一个回调函数根据数据动态计算颜色 + color: function (params) { + // 这里可以根据需要设置不同的颜色，比如根据数据值 + if (params.data <= 0) { + return 'green' + } else if (params.data > 0) { + return 'red' + } + } } } ], // 添加点击事件的处理函数 emphasis: { - itemStyle: { - color: '#2283cf', - barWidth: 20 // 根据需求调整数值大小，单位是像素 - }, - barWidth: 24 // 根据需求调整数值大小，单位是像素 + // itemStyle: { + // color: '#2283cf', + // barWidth: 20 // 根据需求调整数值大小，单位是像素 + // }, + // barWidth: 24 // 根据需求调整数值大小，单位是像素 } } @@ -546,7 +554,15 @@ const drawLine = (data) => { color: '#4181c9' }, itemStyle: { - color: '#4181c9' + // 此处可以是一个固定颜色值，也可以是一个回调函数根据数据动态计算颜色 + color: function (params) { + // 这里可以根据需要设置不同的颜色，比如根据数据值 + if (params.data <= 0) { + return 'green' + } else if (params.data > 0) { + return 'red' + } + } }, smooth: true, symbol: 'emptyCircle', diff --git a/src/views/invest/dailyExpensesAnalysis/index.vue b/src/views/invest/dailyExpensesAnalysis/index.vue index c7d2014..df0a843 100644 --- a/src/views/invest/dailyExpensesAnalysis/index.vue +++ b/src/views/invest/dailyExpensesAnalysis/index.vue @@ -111,19 +111,99 @@ +
+
+ +
+
+
{{ account.top5Name }}
+
+ {{ account.top5 }} +
+
+
+ +
+
+
+ +
+
+
{{ account.top6Name }}
+
+ {{ account.top6 }} +
+
+
+
+
+ +
+
+
{{ account.top7Name }}
+
+ {{ account.top7 }} +
+
+
+
+
+ +
+
+
{{ account.top8Name }}
+
+ {{ account.top8 }} +
+
+
+
+
+ +
+
+
{{ account.top9Name }}
+
+ {{ account.top9 }} +
+
+
+
+
+ +
+
+
{{ account.top10Name }}
+
+ {{ account.top10 }} +
+
+
+
+
+ +
+
+
{{ account.top11Name }}
+
+ {{ account.top11 }} +
+
+
日常支出统计
- - - + + + +
- +