mirror of
https://gitee.com/huangge1199_admin/vue-pro.git
synced 2024-11-22 15:21:53 +08:00
mp:完成公众号统计的用户累计数据、消息概况数据
This commit is contained in:
parent
09e200c364
commit
d0934510af
@ -16,6 +16,8 @@ public interface ErrorCodeConstants {
|
|||||||
|
|
||||||
// ========== 公众号账号 1006001000============
|
// ========== 公众号账号 1006001000============
|
||||||
ErrorCode STATISTICS_GET_USER_SUMMARY_FAIL = new ErrorCode(1006001000, "获取用户增减数据失败,原因:{}");
|
ErrorCode STATISTICS_GET_USER_SUMMARY_FAIL = new ErrorCode(1006001000, "获取用户增减数据失败,原因:{}");
|
||||||
|
ErrorCode STATISTICS_GET_USER_CUMULATE_FAIL = new ErrorCode(1006001001, "获得用户累计数据失败,原因:{}");
|
||||||
|
ErrorCode STATISTICS_GET_UPSTREAM_MESSAGE_FAIL = new ErrorCode(1006001002, "获得消息发送概况数据失败,原因:{}");
|
||||||
|
|
||||||
// TODO 要处理下
|
// TODO 要处理下
|
||||||
ErrorCode COMMON_NOT_EXISTS = new ErrorCode(1006001002, "用户不存在");
|
ErrorCode COMMON_NOT_EXISTS = new ErrorCode(1006001002, "用户不存在");
|
||||||
|
@ -1,11 +1,16 @@
|
|||||||
package cn.iocoder.yudao.module.mp.controller.admin.statistics;
|
package cn.iocoder.yudao.module.mp.controller.admin.statistics;
|
||||||
|
|
||||||
import cn.iocoder.yudao.framework.common.pojo.CommonResult;
|
import cn.iocoder.yudao.framework.common.pojo.CommonResult;
|
||||||
|
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsGetReqVO;
|
||||||
|
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsUpstreamMessageRespVO;
|
||||||
|
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsUserCumulateRespVO;
|
||||||
|
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsUserSummaryRespVO;
|
||||||
import cn.iocoder.yudao.module.mp.convert.statistics.MpStatisticsConvert;
|
import cn.iocoder.yudao.module.mp.convert.statistics.MpStatisticsConvert;
|
||||||
import cn.iocoder.yudao.module.mp.service.statistics.MpStatisticsService;
|
import cn.iocoder.yudao.module.mp.service.statistics.MpStatisticsService;
|
||||||
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsGetReqVO;
|
|
||||||
import io.swagger.annotations.Api;
|
import io.swagger.annotations.Api;
|
||||||
import io.swagger.annotations.ApiOperation;
|
import io.swagger.annotations.ApiOperation;
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
|
||||||
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
||||||
import org.springframework.security.access.prepost.PreAuthorize;
|
import org.springframework.security.access.prepost.PreAuthorize;
|
||||||
import org.springframework.validation.annotation.Validated;
|
import org.springframework.validation.annotation.Validated;
|
||||||
@ -30,9 +35,28 @@ public class MpStatisticsController {
|
|||||||
@GetMapping("/user-summary")
|
@GetMapping("/user-summary")
|
||||||
@ApiOperation("获得用户增减数据")
|
@ApiOperation("获得用户增减数据")
|
||||||
@PreAuthorize("@ss.hasPermission('mp:statistics:query')")
|
@PreAuthorize("@ss.hasPermission('mp:statistics:query')")
|
||||||
public CommonResult<List<WxDataCubeUserSummary>> getAccount(MpStatisticsGetReqVO getReqVO) {
|
public CommonResult<List<MpStatisticsUserSummaryRespVO>> getUserSummary(MpStatisticsGetReqVO getReqVO) {
|
||||||
List<WxDataCubeUserSummary> list = mpStatisticsService.getUserSummary(getReqVO.getId(), getReqVO.getDate());
|
List<WxDataCubeUserSummary> list = mpStatisticsService.getUserSummary(
|
||||||
|
getReqVO.getAccountId(), getReqVO.getDate());
|
||||||
return success(MpStatisticsConvert.INSTANCE.convertList01(list));
|
return success(MpStatisticsConvert.INSTANCE.convertList01(list));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@GetMapping("/user-cumulate")
|
||||||
|
@ApiOperation("获得用户累计数据")
|
||||||
|
@PreAuthorize("@ss.hasPermission('mp:statistics:query')")
|
||||||
|
public CommonResult<List<MpStatisticsUserCumulateRespVO>> getUserCumulate(MpStatisticsGetReqVO getReqVO) {
|
||||||
|
List<WxDataCubeUserCumulate> list = mpStatisticsService.getUserCumulate(
|
||||||
|
getReqVO.getAccountId(), getReqVO.getDate());
|
||||||
|
return success(MpStatisticsConvert.INSTANCE.convertList02(list));
|
||||||
|
}
|
||||||
|
|
||||||
|
@GetMapping("/upstream-message")
|
||||||
|
@ApiOperation("获取消息发送概况数据")
|
||||||
|
@PreAuthorize("@ss.hasPermission('mp:statistics:query')")
|
||||||
|
public CommonResult<List<MpStatisticsUpstreamMessageRespVO>> getUpstreamMessage(MpStatisticsGetReqVO getReqVO) {
|
||||||
|
List<WxDataCubeMsgResult> list = mpStatisticsService.getUpstreamMessage(
|
||||||
|
getReqVO.getAccountId(), getReqVO.getDate());
|
||||||
|
return success(MpStatisticsConvert.INSTANCE.convertList03(list));
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -16,7 +16,7 @@ public class MpStatisticsGetReqVO {
|
|||||||
|
|
||||||
@ApiModelProperty(value = "公众号账号的编号", required = true, example = "1024")
|
@ApiModelProperty(value = "公众号账号的编号", required = true, example = "1024")
|
||||||
@NotNull(message = "公众号账号的编号不能为空")
|
@NotNull(message = "公众号账号的编号不能为空")
|
||||||
private Long id;
|
private Long accountId;
|
||||||
|
|
||||||
@ApiModelProperty(value = "查询时间范围")
|
@ApiModelProperty(value = "查询时间范围")
|
||||||
@DateTimeFormat(pattern = FORMAT_YEAR_MONTH_DAY_HOUR_MINUTE_SECOND)
|
@DateTimeFormat(pattern = FORMAT_YEAR_MONTH_DAY_HOUR_MINUTE_SECOND)
|
||||||
|
@ -0,0 +1,22 @@
|
|||||||
|
package cn.iocoder.yudao.module.mp.controller.admin.statistics.vo;
|
||||||
|
|
||||||
|
import io.swagger.annotations.ApiModel;
|
||||||
|
import io.swagger.annotations.ApiModelProperty;
|
||||||
|
import lombok.Data;
|
||||||
|
|
||||||
|
import java.util.Date;
|
||||||
|
|
||||||
|
@ApiModel("管理后台 - 某一天的用户增减数据 Response VO")
|
||||||
|
@Data
|
||||||
|
public class MpStatisticsUpstreamMessageRespVO {
|
||||||
|
|
||||||
|
@ApiModelProperty(value = "日期", required = true)
|
||||||
|
private Date refDate;
|
||||||
|
|
||||||
|
@ApiModelProperty(value = "上行发送了(向公众号发送了)消息的用户数", required = true, example = "10")
|
||||||
|
private Integer messageUser;
|
||||||
|
|
||||||
|
@ApiModelProperty(value = "上行发送了消息的消息总数", required = true, example = "20")
|
||||||
|
private Integer messageCount;
|
||||||
|
|
||||||
|
}
|
@ -0,0 +1,19 @@
|
|||||||
|
package cn.iocoder.yudao.module.mp.controller.admin.statistics.vo;
|
||||||
|
|
||||||
|
import io.swagger.annotations.ApiModel;
|
||||||
|
import io.swagger.annotations.ApiModelProperty;
|
||||||
|
import lombok.Data;
|
||||||
|
|
||||||
|
import java.util.Date;
|
||||||
|
|
||||||
|
@ApiModel("管理后台 - 某一天的消息发送概况数据 Response VO")
|
||||||
|
@Data
|
||||||
|
public class MpStatisticsUserCumulateRespVO {
|
||||||
|
|
||||||
|
@ApiModelProperty(value = "日期", required = true)
|
||||||
|
private Date refDate;
|
||||||
|
|
||||||
|
@ApiModelProperty(value = "累计用户量", required = true, example = "10")
|
||||||
|
private Integer cumulateUser;
|
||||||
|
|
||||||
|
}
|
@ -1,7 +1,14 @@
|
|||||||
package cn.iocoder.yudao.module.mp.convert.statistics;
|
package cn.iocoder.yudao.module.mp.convert.statistics;
|
||||||
|
|
||||||
|
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsUpstreamMessageRespVO;
|
||||||
|
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsUserCumulateRespVO;
|
||||||
|
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsUserSummaryRespVO;
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
|
||||||
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
||||||
import org.mapstruct.Mapper;
|
import org.mapstruct.Mapper;
|
||||||
|
import org.mapstruct.Mapping;
|
||||||
|
import org.mapstruct.Mappings;
|
||||||
import org.mapstruct.factory.Mappers;
|
import org.mapstruct.factory.Mappers;
|
||||||
|
|
||||||
import java.util.List;
|
import java.util.List;
|
||||||
@ -11,6 +18,17 @@ public interface MpStatisticsConvert {
|
|||||||
|
|
||||||
MpStatisticsConvert INSTANCE = Mappers.getMapper(MpStatisticsConvert.class);
|
MpStatisticsConvert INSTANCE = Mappers.getMapper(MpStatisticsConvert.class);
|
||||||
|
|
||||||
List<WxDataCubeUserSummary> convertList01(List<WxDataCubeUserSummary> list);
|
List<MpStatisticsUserSummaryRespVO> convertList01(List<WxDataCubeUserSummary> list);
|
||||||
|
|
||||||
|
List<MpStatisticsUserCumulateRespVO> convertList02(List<WxDataCubeUserCumulate> list);
|
||||||
|
|
||||||
|
List<MpStatisticsUpstreamMessageRespVO> convertList03(List<WxDataCubeMsgResult> list);
|
||||||
|
|
||||||
|
@Mappings({
|
||||||
|
@Mapping(source = "refDate", target = "refDate", dateFormat = "yyyy-MM-dd"),
|
||||||
|
@Mapping(source = "msgUser", target = "messageUser"),
|
||||||
|
@Mapping(source = "msgCount", target = "messageCount"),
|
||||||
|
})
|
||||||
|
MpStatisticsUpstreamMessageRespVO convert(WxDataCubeMsgResult bean);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,7 @@
|
|||||||
package cn.iocoder.yudao.module.mp.service.statistics;
|
package cn.iocoder.yudao.module.mp.service.statistics;
|
||||||
|
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
|
||||||
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
||||||
|
|
||||||
import java.time.LocalDateTime;
|
import java.time.LocalDateTime;
|
||||||
@ -15,10 +17,28 @@ public interface MpStatisticsService {
|
|||||||
/**
|
/**
|
||||||
* 获取用户增减数据
|
* 获取用户增减数据
|
||||||
*
|
*
|
||||||
* @param id 公众号账号编号
|
* @param accountId 公众号账号编号
|
||||||
* @param date 时间区间
|
* @param date 时间区间
|
||||||
* @return 用户增减数据
|
* @return 用户增减数据
|
||||||
*/
|
*/
|
||||||
List<WxDataCubeUserSummary> getUserSummary(Long id, LocalDateTime[] date);
|
List<WxDataCubeUserSummary> getUserSummary(Long accountId, LocalDateTime[] date);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取用户累计数据
|
||||||
|
*
|
||||||
|
* @param accountId 公众号账号编号
|
||||||
|
* @param date 时间区间
|
||||||
|
* @return 用户累计数据
|
||||||
|
*/
|
||||||
|
List<WxDataCubeUserCumulate> getUserCumulate(Long accountId, LocalDateTime[] date);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取消息发送概况数据
|
||||||
|
*
|
||||||
|
* @param accountId 公众号账号编号
|
||||||
|
* @param date 时间区间
|
||||||
|
* @return 消息发送概况数据
|
||||||
|
*/
|
||||||
|
List<WxDataCubeMsgResult> getUpstreamMessage(Long accountId, LocalDateTime[] date);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -4,6 +4,8 @@ import cn.hutool.core.date.DateUtil;
|
|||||||
import cn.iocoder.yudao.module.mp.framework.mp.core.MpServiceFactory;
|
import cn.iocoder.yudao.module.mp.framework.mp.core.MpServiceFactory;
|
||||||
import me.chanjar.weixin.common.error.WxErrorException;
|
import me.chanjar.weixin.common.error.WxErrorException;
|
||||||
import me.chanjar.weixin.mp.api.WxMpService;
|
import me.chanjar.weixin.mp.api.WxMpService;
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
|
||||||
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
|
||||||
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
|
||||||
import org.springframework.context.annotation.Lazy;
|
import org.springframework.context.annotation.Lazy;
|
||||||
import org.springframework.stereotype.Service;
|
import org.springframework.stereotype.Service;
|
||||||
@ -13,7 +15,7 @@ import java.time.LocalDateTime;
|
|||||||
import java.util.List;
|
import java.util.List;
|
||||||
|
|
||||||
import static cn.iocoder.yudao.framework.common.exception.util.ServiceExceptionUtil.exception;
|
import static cn.iocoder.yudao.framework.common.exception.util.ServiceExceptionUtil.exception;
|
||||||
import static cn.iocoder.yudao.module.mp.enums.ErrorCodeConstants.STATISTICS_GET_USER_SUMMARY_FAIL;
|
import static cn.iocoder.yudao.module.mp.enums.ErrorCodeConstants.*;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 公众号统计 Service 实现类
|
* 公众号统计 Service 实现类
|
||||||
@ -28,8 +30,8 @@ public class MpStatisticsServiceImpl implements MpStatisticsService {
|
|||||||
private MpServiceFactory mpServiceFactory;
|
private MpServiceFactory mpServiceFactory;
|
||||||
|
|
||||||
@Override
|
@Override
|
||||||
public List<WxDataCubeUserSummary> getUserSummary(Long id, LocalDateTime[] date) {
|
public List<WxDataCubeUserSummary> getUserSummary(Long accountId, LocalDateTime[] date) {
|
||||||
WxMpService mpService = mpServiceFactory.getRequiredMpService(id);
|
WxMpService mpService = mpServiceFactory.getRequiredMpService(accountId);
|
||||||
try {
|
try {
|
||||||
return mpService.getDataCubeService().getUserSummary(
|
return mpService.getDataCubeService().getUserSummary(
|
||||||
DateUtil.date(date[0]), DateUtil.date(date[1]));
|
DateUtil.date(date[0]), DateUtil.date(date[1]));
|
||||||
@ -38,5 +40,26 @@ public class MpStatisticsServiceImpl implements MpStatisticsService {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Override
|
||||||
|
public List<WxDataCubeUserCumulate> getUserCumulate(Long accountId, LocalDateTime[] date) {
|
||||||
|
WxMpService mpService = mpServiceFactory.getRequiredMpService(accountId);
|
||||||
|
try {
|
||||||
|
return mpService.getDataCubeService().getUserCumulate(
|
||||||
|
DateUtil.date(date[0]), DateUtil.date(date[1]));
|
||||||
|
} catch (WxErrorException e) {
|
||||||
|
throw exception(STATISTICS_GET_USER_CUMULATE_FAIL, e.getError().getErrorMsg());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Override
|
||||||
|
public List<WxDataCubeMsgResult> getUpstreamMessage(Long accountId, LocalDateTime[] date) {
|
||||||
|
WxMpService mpService = mpServiceFactory.getRequiredMpService(accountId);
|
||||||
|
try {
|
||||||
|
return mpService.getDataCubeService().getUpstreamMsg(
|
||||||
|
DateUtil.date(date[0]), DateUtil.date(date[1]));
|
||||||
|
} catch (WxErrorException e) {
|
||||||
|
throw exception(STATISTICS_GET_UPSTREAM_MESSAGE_FAIL, e.getError().getErrorMsg());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -1,15 +1,15 @@
|
|||||||
import request from '@/utils/request'
|
import request from '@/utils/request'
|
||||||
|
|
||||||
// TODO 获得公众号账号分页
|
// 获取消息发送概况数据
|
||||||
export function getInterfaceSummary(query) {
|
export function getUpstreamMessage(query) {
|
||||||
return request({
|
return request({
|
||||||
url: '/mp/account/page',
|
url: '/mp/statistics/upstream-message',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: query
|
params: query
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO 获得公众号账号分页
|
// 用户增减数据
|
||||||
export function getUserSummary(query) {
|
export function getUserSummary(query) {
|
||||||
return request({
|
return request({
|
||||||
url: '/mp/statistics/user-summary',
|
url: '/mp/statistics/user-summary',
|
||||||
@ -18,10 +18,10 @@ export function getUserSummary(query) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO 获得公众号账号分页
|
// 获得用户累计数据
|
||||||
export function getUserCumulate(query) {
|
export function getUserCumulate(query) {
|
||||||
return request({
|
return request({
|
||||||
url: '/mp/account/page',
|
url: '/mp/statistics/user-cumulate',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: query
|
params: query
|
||||||
})
|
})
|
||||||
|
@ -34,17 +34,14 @@ export function endOfDay(date) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function betweenDay(date1, date2) {
|
export function betweenDay(date1, date2) {
|
||||||
// 适配 string 字符串的日期
|
date1 = convertDate(date1);
|
||||||
if (typeof date1 === 'string') {
|
date2 = convertDate(date2);
|
||||||
date1 = new Date(date1);
|
// 计算差值
|
||||||
}
|
|
||||||
if (typeof date2 === 'string') {
|
|
||||||
date2 = new Date(date2);
|
|
||||||
}
|
|
||||||
return Math.floor((date2.getTime() - date1.getTime()) / (24 * 3600 * 1000));
|
return Math.floor((date2.getTime() - date1.getTime()) / (24 * 3600 * 1000));
|
||||||
}
|
}
|
||||||
|
|
||||||
export function formatDate(date, fmt) {
|
export function formatDate(date, fmt) {
|
||||||
|
date = convertDate(date);
|
||||||
const o = {
|
const o = {
|
||||||
"M+": date.getMonth() + 1, //月份
|
"M+": date.getMonth() + 1, //月份
|
||||||
"d+": date.getDate(), //日
|
"d+": date.getDate(), //日
|
||||||
@ -64,3 +61,15 @@ export function formatDate(date, fmt) {
|
|||||||
}
|
}
|
||||||
return fmt;
|
return fmt;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function addTime(date, time) {
|
||||||
|
date = convertDate(date);
|
||||||
|
return new Date(date.getTime() + time);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function convertDate(date) {
|
||||||
|
if (typeof date === 'string') {
|
||||||
|
return new Date(date);
|
||||||
|
}
|
||||||
|
return date;
|
||||||
|
}
|
||||||
|
@ -9,17 +9,14 @@
|
|||||||
@change="changeDate" >
|
@change="changeDate" >
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
</div>
|
</div>
|
||||||
<el-row>
|
<!-- <el-row>-->
|
||||||
<el-col :span="12">
|
<!-- <el-col :span="12">-->
|
||||||
<div id="userCumulateChart" :style="{width: '80%', height: '500px'}"></div>
|
<!-- <div id="interfaceSummaryChart" :style="{width: '80%', height: '500px'}"></div>-->
|
||||||
</el-col>
|
<!-- </el-col>-->
|
||||||
<el-col :span="12">
|
<!-- <el-col :span="12">-->
|
||||||
<div id="interfaceSummaryChart" :style="{width: '80%', height: '500px'}"></div>
|
<!-- <div id="interfaceSummaryChart2" :style="{width: '80%', height: '500px'}"></div>-->
|
||||||
</el-col>
|
<!-- </el-col>-->
|
||||||
<el-col :span="12">
|
<!-- </el-row>-->
|
||||||
<div id="interfaceSummaryChart2" :style="{width: '80%', height: '500px'}"></div>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
|
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12" class="card-box">
|
<el-col :span="12" class="card-box">
|
||||||
@ -28,18 +25,27 @@
|
|||||||
<span>用户增减数据</span>
|
<span>用户增减数据</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||||
<div ref="userSummary" style="height: 420px" />
|
<div ref="userSummaryChart" style="height: 420px" />
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="card-box">
|
<el-col :span="12" class="card-box">
|
||||||
<el-card>
|
<el-card>
|
||||||
<div slot="header">
|
<div slot="header">
|
||||||
<span>内存信息</span>
|
<span>累计用户数据</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||||
<div ref="usedmemory" style="height: 420px" />
|
<div ref="userCumulateChart" style="height: 420px" />
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12" class="card-box">
|
||||||
|
<el-card>
|
||||||
|
<div slot="header">
|
||||||
|
<span>消息概况数据</span>
|
||||||
|
</div>
|
||||||
|
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||||
|
<div ref="upstreamMessageChart" style="height: 420px" />
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-col>
|
</el-col>
|
||||||
@ -61,9 +67,9 @@ require('echarts/lib/component/tooltip')
|
|||||||
require('echarts/lib/component/title')
|
require('echarts/lib/component/title')
|
||||||
require('echarts/lib/component/legend')
|
require('echarts/lib/component/legend')
|
||||||
|
|
||||||
import { getInterfaceSummary, getUserSummary, getUserCumulate } from '@/api/mp/statistics'
|
import {getInterfaceSummary, getUserSummary, getUserCumulate, getUpstreamMessage} from '@/api/mp/statistics'
|
||||||
import { datePickerOptions } from "@/utils/constants";
|
import { datePickerOptions } from "@/utils/constants";
|
||||||
import {beginOfDay, betweenDay, endOfDay, formatDate} from "@/utils/dateUtils";
|
import {addTime, beginOfDay, betweenDay, endOfDay, formatDate} from "@/utils/dateUtils";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'mpStatistics',
|
name: 'mpStatistics',
|
||||||
@ -71,16 +77,9 @@ export default {
|
|||||||
return {
|
return {
|
||||||
date : [beginOfDay(new Date(new Date().getTime() - 3600 * 1000 * 24 * 7)), // -7 天
|
date : [beginOfDay(new Date(new Date().getTime() - 3600 * 1000 * 24 * 7)), // -7 天
|
||||||
endOfDay(new Date(new Date().getTime() - 3600 * 1000 * 24))], // -1 天
|
endOfDay(new Date(new Date().getTime() - 3600 * 1000 * 24))], // -1 天
|
||||||
|
accountId: 1,
|
||||||
|
|
||||||
xAxisDate: [], // X 轴的日期范围
|
xAxisDate: [], // X 轴的日期范围
|
||||||
seriesData1: [],
|
|
||||||
seriesData2: [],
|
|
||||||
seriesData3: [],
|
|
||||||
seriesData4: [],
|
|
||||||
seriesData5: [],
|
|
||||||
seriesData6: [],
|
|
||||||
seriesData7: [],
|
|
||||||
|
|
||||||
userSummaryOption: { // 用户增减数据
|
userSummaryOption: { // 用户增减数据
|
||||||
color: ['#67C23A', '#e5323e'],
|
color: ['#67C23A', '#e5323e'],
|
||||||
legend: {
|
legend: {
|
||||||
@ -88,7 +87,7 @@ export default {
|
|||||||
},
|
},
|
||||||
tooltip: {},
|
tooltip: {},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: this.xAxisDate
|
data: [] // X 轴的日期范围
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
minInterval: 1
|
minInterval: 1
|
||||||
@ -102,7 +101,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
barGap: 0,
|
barGap: 0,
|
||||||
data: []
|
data: [] // 新增用户的数据
|
||||||
}, {
|
}, {
|
||||||
name: '取消关注的用户',
|
name: '取消关注的用户',
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
@ -111,7 +110,64 @@ export default {
|
|||||||
show: true
|
show: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
data: [] // 取消关注的用户的数据
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
userCumulateOption: { // 累计用户数据
|
||||||
|
legend: {
|
||||||
|
data: ['累计用户量']
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
data: []
|
data: []
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
minInterval: 1
|
||||||
|
},
|
||||||
|
series: [{
|
||||||
|
name:'累计用户量',
|
||||||
|
data: [], // 累计用户量的数据
|
||||||
|
type: 'line',
|
||||||
|
smooth: true,
|
||||||
|
label: {
|
||||||
|
normal: {
|
||||||
|
show: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
upstreamMessageOption: { // 消息发送概况数据
|
||||||
|
color: ['#67C23A', '#e5323e'],
|
||||||
|
legend: {
|
||||||
|
data: ['用户发送人数', '用户发送条数']
|
||||||
|
},
|
||||||
|
tooltip: {},
|
||||||
|
xAxis: {
|
||||||
|
data: [] // X 轴的日期范围
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
minInterval: 1
|
||||||
|
},
|
||||||
|
series: [{
|
||||||
|
name: '用户发送人数',
|
||||||
|
type: 'line',
|
||||||
|
smooth: true,
|
||||||
|
label: {
|
||||||
|
normal: {
|
||||||
|
show: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: [] // 用户发送人数的数据
|
||||||
|
}, {
|
||||||
|
name: '用户发送条数',
|
||||||
|
type: 'line',
|
||||||
|
smooth: true,
|
||||||
|
label: {
|
||||||
|
normal: {
|
||||||
|
show: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: [] // 用户发送条数的数据
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -130,14 +186,6 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
changeDate() {
|
changeDate() {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
this.seriesData1 = []
|
|
||||||
this.seriesData2 = []
|
|
||||||
this.seriesData5 = []
|
|
||||||
this.seriesData6 = []
|
|
||||||
|
|
||||||
this.getSummary()
|
this.getSummary()
|
||||||
},
|
},
|
||||||
getSummary() {
|
getSummary() {
|
||||||
@ -149,76 +197,13 @@ export default {
|
|||||||
this.xAxisDate = []
|
this.xAxisDate = []
|
||||||
const days = betweenDay(this.date[0], this.date[1]) // 相差天数
|
const days = betweenDay(this.date[0], this.date[1]) // 相差天数
|
||||||
for(let i = 0; i <= days; i++){
|
for(let i = 0; i <= days; i++){
|
||||||
this.xAxisDate.push(formatDate(new Date(this.date[0].getTime() + 3600 * 1000 * 24 * i), 'yyyy-MM-dd'));
|
this.xAxisDate.push(formatDate(addTime(this.date[0], 3600 * 1000 * 24 * i), 'yyyy-MM-dd'));
|
||||||
this.seriesData2.push(0)
|
|
||||||
this.seriesData5.push(0)
|
|
||||||
this.seriesData6.push(0)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 用户增减数据
|
// 初始化图表
|
||||||
this.userSummaryOption.xAxis.data = [];
|
this.initUserSummaryChart();
|
||||||
this.userSummaryOption.series[0].data = [];
|
this.initUserCumulateChart();
|
||||||
this.userSummaryOption.series[1].data = [];
|
this.initUpstreamMessageChart();
|
||||||
getUserSummary({
|
|
||||||
id: 1,
|
|
||||||
date: [formatDate(this.date[0], 'yyyy-MM-dd HH:mm:ss'), formatDate(this.date[1], 'yyyy-MM-dd HH:mm:ss'),]
|
|
||||||
}).then(response => {
|
|
||||||
this.userSummaryOption.xAxis.data = this.xAxisDate;
|
|
||||||
// 处理数据
|
|
||||||
this.xAxisDate.forEach((date, index) => {
|
|
||||||
response.data.forEach((item) => {
|
|
||||||
// 匹配日期
|
|
||||||
const refDate = formatDate(new Date(item.refDate), 'yyyy-MM-dd');
|
|
||||||
if (refDate.indexOf(date) === -1) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
// 设置数据到对应的位置
|
|
||||||
this.userSummaryOption.series[0].data[index] = item.newUser;
|
|
||||||
this.userSummaryOption.series[1].data[index] = item.cancelUser;
|
|
||||||
})
|
|
||||||
})
|
|
||||||
// 绘制图表
|
|
||||||
let userSummaryChart = echarts.init(this.$refs.userSummary);
|
|
||||||
userSummaryChart.setOption(this.userSummaryOption)
|
|
||||||
})
|
|
||||||
// .catch(() => {})
|
|
||||||
|
|
||||||
// getUserCumulate({
|
|
||||||
// startDate: this.startDate,
|
|
||||||
// endDate: this.endDate
|
|
||||||
// }).then(response => {
|
|
||||||
// response.data.forEach((item, index, arr) => {
|
|
||||||
// this.$set(this.seriesData7, index, item.cumulateUser)
|
|
||||||
// })
|
|
||||||
// // 基于准备好的dom,初始化echarts实例
|
|
||||||
// let userCumulateChart = echarts.init(document.getElementById('userCumulateChart'))
|
|
||||||
// // 绘制图表
|
|
||||||
// userCumulateChart.setOption({
|
|
||||||
// title: { text: '累计用户数据' },
|
|
||||||
// legend: {
|
|
||||||
// data: ['累计用户量']
|
|
||||||
// },
|
|
||||||
// xAxis: {
|
|
||||||
// type: 'category',
|
|
||||||
// data: this.xAxisData
|
|
||||||
// },
|
|
||||||
// yAxis: {
|
|
||||||
// type: 'value'
|
|
||||||
// },
|
|
||||||
// series: [{
|
|
||||||
// name:'累计用户量',
|
|
||||||
// data: this.seriesData7,
|
|
||||||
// type: 'line',
|
|
||||||
// smooth: true,
|
|
||||||
// label: {
|
|
||||||
// normal: {
|
|
||||||
// show: true
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }]
|
|
||||||
// })
|
|
||||||
// }).catch(() => {
|
|
||||||
// })
|
|
||||||
//
|
//
|
||||||
// //获取接口数据
|
// //获取接口数据
|
||||||
// getInterfaceSummary({
|
// getInterfaceSummary({
|
||||||
@ -306,6 +291,71 @@ export default {
|
|||||||
// })
|
// })
|
||||||
// }).catch(() => {
|
// }).catch(() => {
|
||||||
// })
|
// })
|
||||||
|
},
|
||||||
|
initUserSummaryChart() {
|
||||||
|
this.userSummaryOption.xAxis.data = [];
|
||||||
|
this.userSummaryOption.series[0].data = [];
|
||||||
|
this.userSummaryOption.series[1].data = [];
|
||||||
|
getUserSummary({
|
||||||
|
accountId: this.accountId,
|
||||||
|
date: [formatDate(this.date[0], 'yyyy-MM-dd HH:mm:ss'), formatDate(this.date[1], 'yyyy-MM-dd HH:mm:ss'),]
|
||||||
|
}).then(response => {
|
||||||
|
this.userSummaryOption.xAxis.data = this.xAxisDate;
|
||||||
|
// 处理数据
|
||||||
|
this.xAxisDate.forEach((date, index) => {
|
||||||
|
response.data.forEach((item) => {
|
||||||
|
// 匹配日期
|
||||||
|
const refDate = formatDate(new Date(item.refDate), 'yyyy-MM-dd');
|
||||||
|
if (refDate.indexOf(date) === -1) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// 设置数据到对应的位置
|
||||||
|
this.userSummaryOption.series[0].data[index] = item.newUser;
|
||||||
|
this.userSummaryOption.series[1].data[index] = item.cancelUser;
|
||||||
|
})
|
||||||
|
})
|
||||||
|
// 绘制图表
|
||||||
|
const userSummaryChart = echarts.init(this.$refs.userSummaryChart);
|
||||||
|
userSummaryChart.setOption(this.userSummaryOption)
|
||||||
|
}).catch(() => {})
|
||||||
|
},
|
||||||
|
initUserCumulateChart() {
|
||||||
|
this.userCumulateOption.xAxis.data = [];
|
||||||
|
this.userCumulateOption.series[0].data = [];
|
||||||
|
// 发起请求
|
||||||
|
getUserCumulate({
|
||||||
|
accountId: this.accountId,
|
||||||
|
date: [formatDate(this.date[0], 'yyyy-MM-dd HH:mm:ss'), formatDate(this.date[1], 'yyyy-MM-dd HH:mm:ss'),]
|
||||||
|
}).then(response => {
|
||||||
|
this.userCumulateOption.xAxis.data = this.xAxisDate;
|
||||||
|
// 处理数据
|
||||||
|
response.data.forEach((item, index) => {
|
||||||
|
this.userCumulateOption.series[0].data[index] = item.cumulateUser;
|
||||||
|
})
|
||||||
|
// 绘制图表
|
||||||
|
const userCumulateChart = echarts.init(this.$refs.userCumulateChart);
|
||||||
|
userCumulateChart.setOption(this.userCumulateOption)
|
||||||
|
}).catch(() => {})
|
||||||
|
},
|
||||||
|
initUpstreamMessageChart() {
|
||||||
|
this.upstreamMessageOption.xAxis.data = [];
|
||||||
|
this.upstreamMessageOption.series[0].data = [];
|
||||||
|
this.upstreamMessageOption.series[1].data = [];
|
||||||
|
// 发起请求
|
||||||
|
getUpstreamMessage({
|
||||||
|
accountId: this.accountId,
|
||||||
|
date: [formatDate(this.date[0], 'yyyy-MM-dd HH:mm:ss'), formatDate(this.date[1], 'yyyy-MM-dd HH:mm:ss'),]
|
||||||
|
}).then(response => {
|
||||||
|
this.upstreamMessageOption.xAxis.data = this.xAxisDate;
|
||||||
|
// 处理数据
|
||||||
|
response.data.forEach((item, index) => {
|
||||||
|
this.upstreamMessageOption.series[0].data[index] = item.messageUser;
|
||||||
|
this.upstreamMessageOption.series[1].data[index] = item.messageCount;
|
||||||
|
})
|
||||||
|
// 绘制图表
|
||||||
|
const upstreamMessageChart = echarts.init(this.$refs.upstreamMessageChart);
|
||||||
|
upstreamMessageChart.setOption(this.upstreamMessageOption);
|
||||||
|
}).catch(() => {})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user