add 每日新增用户和每日新增支付金额图表

This commit is contained in:
王鹏
2025-10-31 09:44:37 +08:00
parent 4d2d38aadd
commit da05a94acb
12 changed files with 251 additions and 12 deletions

View File

@@ -1,17 +1,11 @@
package com.ruoyi.web.controller.app;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletResponse;
import org.springframework.security.access.prepost.PreAuthorize;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.PutMapping;
import org.springframework.web.bind.annotation.DeleteMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.bind.annotation.*;
import com.ruoyi.common.annotation.Log;
import com.ruoyi.common.core.controller.BaseController;
import com.ruoyi.common.core.domain.AjaxResult;
@@ -101,4 +95,15 @@ public class AppPayOrderController extends BaseController
{
return toAjax(appPayOrderService.deleteAppPayOrderByIds(ids));
}
/**
* 查询每日新增支付金额统计
*/
@PreAuthorize("@ss.hasPermi('app:order:list')")
@GetMapping("/dailyPayAmount")
public AjaxResult dailyPayAmount(@RequestParam(defaultValue = "30") Integer days)
{
List<Map<String, Object>> list = appPayOrderService.selectDailyPayAmount(days);
return AjaxResult.success(list);
}
}

View File

@@ -290,4 +290,14 @@ public class SysUserController extends BaseController
ajax.put("user", sysUser);
return ajax;
}
/**
* 获取每天新增用户数量
*/
@PreAuthorize("@ss.hasPermi('system:user:list')")
@GetMapping("/countByDay")
public AjaxResult countByDay()
{
return AjaxResult.success(userService.selectUserCountByDay());
}
}

View File

@@ -1,6 +1,8 @@
package com.ruoyi.app.mapper;
import java.util.List;
import java.util.Map;
import com.ruoyi.app.domain.AppPayOrder;
/**
@@ -66,4 +68,12 @@ public interface AppPayOrderMapper
* @return 结果
*/
public int deleteAppPayOrderByIds(Long[] ids);
/**
* 查询每日新增支付金额统计
*
* @param days 天数
* @return 统计结果
*/
public List<Map<String, Object>> selectDailyPayAmount(Integer days);
}

View File

@@ -1,6 +1,8 @@
package com.ruoyi.app.service;
import java.util.List;
import java.util.Map;
import com.ruoyi.app.domain.AppPayOrder;
/**
@@ -58,4 +60,12 @@ public interface IAppPayOrderService
* @return 结果
*/
public int deleteAppPayOrderById(Long id);
/**
* 查询每日新增支付金额统计
*
* @param days 天数
* @return 统计结果
*/
public List<Map<String, Object>> selectDailyPayAmount(Integer days);
}

View File

@@ -1,6 +1,8 @@
package com.ruoyi.app.service.impl;
import java.util.List;
import java.util.Map;
import com.ruoyi.common.utils.DateUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
@@ -92,4 +94,16 @@ public class AppPayOrderServiceImpl implements IAppPayOrderService
{
return appPayOrderMapper.deleteAppPayOrderById(id);
}
/**
* 查询每日新增支付金额统计
*
* @param days 天数
* @return 统计结果
*/
@Override
public List<Map<String, Object>> selectDailyPayAmount(Integer days)
{
return appPayOrderMapper.selectDailyPayAmount(days);
}
}

View File

@@ -1,6 +1,8 @@
package com.ruoyi.system.mapper;
import java.util.List;
import java.util.Map;
import org.apache.ibatis.annotations.Param;
import com.ruoyi.common.core.domain.entity.SysUser;
import org.apache.ibatis.annotations.Update;
@@ -145,4 +147,9 @@ public interface SysUserMapper
*/
@Update("update sys_user SET integral = integral-#{integral} where user_id = #{userId}")
public int delIntegralByUserId(@Param("integral") int integral ,@Param("userId")Long userId);
/**
* 查询每日新增用户数
*/
public List<Map<String, Object>> selectUserCountByDay();
}

View File

@@ -1,6 +1,8 @@
package com.ruoyi.system.service;
import java.util.List;
import java.util.Map;
import com.ruoyi.common.core.domain.entity.SysUser;
/**
@@ -194,6 +196,11 @@ public interface ISysUserService
*/
public int deleteUserByIds(Long[] userIds);
/**
* 查询每日新增用户数
*/
public List<Map<String, Object>> selectUserCountByDay();
/**
* 导入用户数据
*

View File

@@ -2,6 +2,7 @@ package com.ruoyi.system.service.impl;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;
import java.util.stream.Collectors;
import javax.validation.Validator;
import org.slf4j.Logger;
@@ -541,4 +542,15 @@ public class SysUserServiceImpl implements ISysUserService
}
return successMsg.toString();
}
/**
* 查询每天新增用户数量
*
* @return 结果
*/
@Override
public List<Map<String, Object>> selectUserCountByDay()
{
return userMapper.selectUserCountByDay();
}
}

View File

@@ -95,4 +95,33 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
#{id}
</foreach>
</delete>
<!-- 查询每日新增支付金额统计 -->
<select id="selectDailyPayAmount" parameterType="Integer" resultType="map">
SELECT
dates.date AS date,
IFNULL(SUM(pay.amount), 0) AS amount
FROM (
SELECT DATE_FORMAT(DATE_SUB(CURDATE(), INTERVAL (a.a + (10 * b.a)) DAY), '%Y-%m-%d') AS date
FROM (
SELECT 0 AS a UNION ALL SELECT 1 UNION ALL SELECT 2 UNION ALL SELECT 3 UNION ALL SELECT 4 UNION ALL
SELECT 5 UNION ALL SELECT 6 UNION ALL SELECT 7 UNION ALL SELECT 8 UNION ALL SELECT 9
) AS a
CROSS JOIN (
SELECT 0 AS a UNION ALL SELECT 1 UNION ALL SELECT 2 UNION ALL SELECT 3 UNION ALL SELECT 4 UNION ALL
SELECT 5 UNION ALL SELECT 6 UNION ALL SELECT 7 UNION ALL SELECT 8 UNION ALL SELECT 9
) AS b
) AS dates
LEFT JOIN (
SELECT
DATE_FORMAT(pay_time, '%Y-%m-%d') AS date,
amount
FROM app_pay_order
WHERE pay_time >= DATE_SUB(CURDATE(), INTERVAL #{days} DAY)
AND status = 1
) AS pay ON dates.date = pay.date
WHERE dates.date >= DATE_SUB(CURDATE(), INTERVAL #{days} DAY)
GROUP BY dates.date
ORDER BY dates.date
</select>
</mapper>

View File

@@ -228,4 +228,8 @@
</foreach>
</delete>
</mapper>
<select id="selectUserCountByDay" resultType="map">
select date_format(create_time,'%Y-%m-%d') as date, count(*) as count from sys_user where del_flag = '0' and create_time >= DATE_SUB(CURDATE(), INTERVAL 30 DAY) group by date_format(create_time,'%Y-%m-%d') order by date
</select>
</mapper>

View File

@@ -133,3 +133,11 @@ export function deptTreeSelect() {
method: 'get'
})
}
// 查询每日新增用户数量
export function getUserCountByDay() {
return request({
url: '/system/user/countByDay',
method: 'get'
})
}

View File

@@ -2,7 +2,21 @@
<div class="app-container home">
<el-row :gutter="20">
<el-col :sm="24" :lg="24">
<h2>南音工作室</h2>
<!-- 每日新增用户折线图 -->
<el-card style="margin-bottom: 20px;">
<div slot="header" class="clearfix">
<span>每日新增用户</span>
</div>
<div ref="userChart" style="height: 400px;"></div>
</el-card>
<!-- 每日新增支付金额折线图 -->
<el-card style="margin-bottom: 20px;">
<div slot="header" class="clearfix">
<span>每日新增支付金额</span>
</div>
<div ref="payChart" style="height: 400px;"></div>
</el-card>
<!-- <blockquote class="text-warning" style="font-size: 14px">
领取阿里云通用云产品1888优惠券
<br />
@@ -942,18 +956,127 @@
</template>
<script>
import { getUserCountByDay } from '@/api/system/user';
import { getDailyPayAmount } from '@/api/app/payStatistics';
import * as echarts from 'echarts';
export default {
name: "Index",
data() {
return {
// 版本号
version: "3.8.6"
version: "3.8.6",
// 用户统计数据
userStats: {
dates: [],
counts: []
},
// 支付统计数据
payStats: {
dates: [],
amounts: []
}
};
},
mounted() {
this.initUserChart();
this.initPayChart();
},
methods: {
goTarget(href) {
window.open(href, "_blank");
}
},
// 初始化用户统计图表
initUserChart() {
// 获取后端数据
getUserCountByDay().then(response => {
// 解析后端返回的数据
const data = response.data || [];
this.userStats.dates = data.map(item => item.date);
this.userStats.counts = data.map(item => item.count);
// 初始化echart实例
const userChart = echarts.init(this.$refs.userChart);
// 配置图表选项
const option = {
title: {
text: '近30日新增用户趋势'
},
tooltip: {
trigger: 'axis'
},
xAxis: {
type: 'category',
data: this.userStats.dates
},
yAxis: {
type: 'value'
},
series: [{
data: this.userStats.counts,
type: 'line',
smooth: true,
areaStyle: {}
}]
};
// 使用配置项显示图表
userChart.setOption(option);
// 监听窗口大小变化,自适应调整图表大小
window.addEventListener('resize', () => userChart.resize());
});
},
// 初始化支付统计图表
initPayChart() {
// 获取后端数据
getDailyPayAmount().then(response => {
// 解析后端返回的数据
const data = response.data || [];
this.payStats.dates = data.map(item => item.date);
this.payStats.amounts = data.map(item => item.amount);
// 初始化echart实例
const payChart = echarts.init(this.$refs.payChart);
// 配置图表选项
const option = {
title: {
text: '近30日新增支付金额趋势'
},
tooltip: {
trigger: 'axis',
formatter: params => {
const value = params[0].value;
return `${params[0].axisValue}<br/>${params[0].marker}${value}`;
}
},
xAxis: {
type: 'category',
data: this.payStats.dates
},
yAxis: {
type: 'value',
axisLabel: {
formatter: value => `${value}`
}
},
series: [{
data: this.payStats.amounts,
type: 'line',
smooth: true,
areaStyle: {}
}]
};
// 使用配置项显示图表
payChart.setOption(option);
// 监听窗口大小变化,自适应调整图表大小
window.addEventListener('resize', () => payChart.resize());
});
}
}
};
</script>