songwei
/
note_book
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加图表优化图表显示逻辑

This commit is contained in:
Strange 2024-02-14 03:33:35 +08:00
parent 20e91b50d4
commit ddb1b78890
4 changed files with 41 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
RuoYi-Vue/ruoyi-admin/src/main/java/com/ruoyi/web/controller/chart/chat.java
View File

@ -26,14 +26,21 @@ public class chat {
// @ResponseBody
public String Polyline(Model model){
List<ChatDomain> dataList = chatMapper.pyline();
List<BigDecimal> moneyList = new ArrayList<>();
List<BigDecimal> moneyIncomeList = new ArrayList<>();
List<BigDecimal> expenditureList = new ArrayList<>();
List<Integer> monthList = new ArrayList<>();
for (ChatDomain chatDomain:dataList){
moneyList.add(chatDomain.getTotal_money());
if (chatDomain.getKind()==0){
moneyIncomeList.add(chatDomain.getTotal_money());
}
if (chatDomain.getKind()==1){
expenditureList.add(chatDomain.getTotal_money());
}
monthList.add(chatDomain.getMonth());
}
model.addAttribute("moneyList",moneyList);
model.addAttribute("monthList",monthList);
model.addAttribute("moneyIncomeList",moneyIncomeList);
model.addAttribute("expenditureList",expenditureList);
return "/polyline";
}
}

22
RuoYi-Vue/ruoyi-admin/src/main/resources/templates/polyline.html
View File

@ -7,11 +7,12 @@
<style>
canvas {
border: 1px solid #ccc;
margin-top: 20%;
}
</style>
</head>
<body>
<canvas id="line-chart" width="400" height="300"></canvas>
<canvas id="line-chart" width="400" height="300" ></canvas>
<script src="
https://cdn.jsdelivr.net/npm/echarts@5.4.3/dist/echarts.min.js
@ -22,19 +23,32 @@ https://cdn.jsdelivr.net/npm/echarts@5.4.3/dist/echarts.min.js
// 定义从后端传递过来的数据
var monthList = /*[[${monthList}]]*/ [];
var moneyList = /*[[${moneyList}]]*/ [];
var moneyIncomeList = /*[[${moneyIncomeList}]]*/ [];
var expenditureList = /*[[${expenditureList}]]*/ [];
// 指定图表的配置项和数据
option = {
title: {
text: '消费分析'
},
xAxis: {
type: 'category',
data: monthList // 使用从后端传递过来的月份数据
},
legend: {
data: ['收入', '支出']
},
yAxis: {},
series: [
{
data: moneyList, // 使用从后端传递过来的金额数据
type: 'line'
data: moneyIncomeList, // 使用从后端传递过来的金额数据
type: 'line',
name:"收入",
},
{
data: expenditureList, // 使用从后端传递过来的金额数据
type: 'line',
name:"支出"
}
]
};

10
RuoYi-Vue/ruoyi-homejizhang/src/main/java/com/ruoyi/app/system/domain/ChatDomain.java
View File

@ -9,6 +9,8 @@ public class ChatDomain {
private Integer month;
private Integer kind;
public Integer getId() {
return id;
}
@ -32,4 +34,12 @@ public class ChatDomain {
public void setMonth(Integer month) {
this.month = month;
}
public Integer getKind() {
return kind;
}
public void setKind(Integer kind) {
this.kind = kind;
}
}

4
RuoYi-Vue/ruoyi-homejizhang/src/main/java/com/ruoyi/app/system/mapper/ChatMapper.java
View File

@ -10,10 +10,10 @@ import java.util.List;
@Mapper
public interface ChatMapper {
@Select("SELECT SUM(money) AS total_money, month \n" +
@Select("SELECT SUM(money) AS total_money, month ,kind \n" +
"FROM accounttb \n" +
"WHERE `month` IS NOT NULL\n" +
"GROUP BY month \n" +
"GROUP BY month,kind \n" +
"ORDER BY month;\n")
public List<ChatDomain> pyline();
}