huangge1199/vue-pro
1
0
Fork 0
mirror of https://gitee.com/huangge1199_admin/vue-pro.git synced 2024-11-22 07:11:52 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

mp：完成公众号的数据统计前端界面

Browse Source
This commit is contained in:
YunaiV 2023-01-08 00:36:25 +08:00
parent d0934510af
commit d6de233a47
15 changed files with 274 additions and 162 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
yudao-module-mp/yudao-module-mp-api/src/main/java/cn/iocoder/yudao/module/mp/enums/ErrorCodeConstants.java
View File

@ -18,6 +18,7 @@ public interface ErrorCodeConstants {
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, "获得消息发送概况数据失败，原因：{}");
ErrorCode STATISTICS_GET_INTERFACE_SUMMARY_FAIL = new ErrorCode(1006001003, "获得接口分析数据失败，原因：{}");
// TODO 要处理下
ErrorCode COMMON_NOT_EXISTS = new ErrorCode(1006001002, "用户不存在");

14
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/account/MpAccountController.java
View File

@ -2,10 +2,7 @@ package cn.iocoder.yudao.module.mp.controller.admin.account;
import cn.iocoder.yudao.framework.common.pojo.CommonResult;
import cn.iocoder.yudao.framework.common.pojo.PageResult;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountCreateReqVO;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountPageReqVO;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountRespVO;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountUpdateReqVO;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.*;
import cn.iocoder.yudao.module.mp.convert.account.MpAccountConvert;
import cn.iocoder.yudao.module.mp.dal.dataobject.account.MpAccountDO;
import cn.iocoder.yudao.module.mp.service.account.MpAccountService;
@ -18,6 +15,7 @@ import org.springframework.web.bind.annotation.*;
import javax.annotation.Resource;
import javax.validation.Valid;
import java.util.List;
import static cn.iocoder.yudao.framework.common.pojo.CommonResult.success;
@ -71,6 +69,14 @@ public class MpAccountController {
return success(MpAccountConvert.INSTANCE.convertPage(pageResult));
}
@GetMapping("/list-all-simple")
@ApiOperation(value = "获取公众号账号精简信息列表")
@PreAuthorize("@ss.hasPermission('mp:account:query')")
public CommonResult<List<MpAccountSimpleRespVO>> getSimpleAccounts() {
List<MpAccountDO> list = mpAccountService.getAccountList();
return success(MpAccountConvert.INSTANCE.convertList02(list));
}
@PutMapping("/generate-qr-code")
@ApiOperation("生成公众号二维码")
@ApiImplicitParam(name = "id", value = "编号", required = true, dataTypeClass = Long.class)

17
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/account/vo/MpAccountSimpleRespVO.java Normal file
View File

@ -0,0 +1,17 @@
package cn.iocoder.yudao.module.mp.controller.admin.account.vo;
import io.swagger.annotations.ApiModel;
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;
@ApiModel("管理后台 - 公众号账号精简信息 Response VO")
@Data
public class MpAccountSimpleRespVO {
@ApiModelProperty(value = "编号", required = true, example = "1024")
private Long id;
@ApiModelProperty(value = "公众号名称", required = true, example = "芋道源码")
private String name;
}

14
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/statistics/MpStatisticsController.java
View File

@ -1,14 +1,12 @@
package cn.iocoder.yudao.module.mp.controller.admin.statistics;
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.controller.admin.statistics.vo.*;
import cn.iocoder.yudao.module.mp.convert.statistics.MpStatisticsConvert;
import cn.iocoder.yudao.module.mp.service.statistics.MpStatisticsService;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiOperation;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeInterfaceResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
@ -59,4 +57,12 @@ public class MpStatisticsController {
return success(MpStatisticsConvert.INSTANCE.convertList03(list));
}
@GetMapping("/interface-summary")
@ApiOperation("获取消息发送概况数据")
@PreAuthorize("@ss.hasPermission('mp:statistics:query')")
public CommonResult<List<MpStatisticsInterfaceSummaryRespVO>> getInterfaceSummary(MpStatisticsGetReqVO getReqVO) {
List<WxDataCubeInterfaceResult> list = mpStatisticsService.getInterfaceSummary(
getReqVO.getAccountId(), getReqVO.getDate());
return success(MpStatisticsConvert.INSTANCE.convertList04(list));
}
}

28
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/statistics/vo/MpStatisticsInterfaceSummaryRespVO.java Normal file
View File

@ -0,0 +1,28 @@
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 MpStatisticsInterfaceSummaryRespVO {
@ApiModelProperty(value = "日期", required = true)
private Date refDate;
@ApiModelProperty(value = "通过服务器配置地址获得消息后，被动回复用户消息的次数", required = true, example = "10")
private Integer callbackCount;
@ApiModelProperty(value = "上述动作的失败次数", required = true, example = "20")
private Integer failCount;
@ApiModelProperty(value = "总耗时，除以 callback_count 即为平均耗时", required = true, example = "30")
private Integer totalTimeCost;
@ApiModelProperty(value = "最大耗时", required = true, example = "40")
private Integer maxTimeCost;
}

3
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/convert/account/MpAccountConvert.java
View File

@ -3,6 +3,7 @@ package cn.iocoder.yudao.module.mp.convert.account;
import cn.iocoder.yudao.framework.common.pojo.PageResult;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountCreateReqVO;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountRespVO;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountSimpleRespVO;
import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountUpdateReqVO;
import cn.iocoder.yudao.module.mp.dal.dataobject.account.MpAccountDO;
import org.mapstruct.Mapper;
@ -25,4 +26,6 @@ public interface MpAccountConvert {
PageResult<MpAccountRespVO> convertPage(PageResult<MpAccountDO> page);
List<MpAccountSimpleRespVO> convertList02(List<MpAccountDO> list);
}

6
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/convert/statistics/MpStatisticsConvert.java
View File

@ -1,8 +1,10 @@
package cn.iocoder.yudao.module.mp.convert.statistics;
import cn.iocoder.yudao.module.mp.controller.admin.statistics.vo.MpStatisticsInterfaceSummaryRespVO;
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.WxDataCubeInterfaceResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
@ -31,4 +33,8 @@ public interface MpStatisticsConvert {
})
MpStatisticsUpstreamMessageRespVO convert(WxDataCubeMsgResult bean);
List<MpStatisticsInterfaceSummaryRespVO> convertList04(List<WxDataCubeInterfaceResult> list);
@Mapping(source = "refDate", target = "refDate", dateFormat = "yyyy-MM-dd")
MpStatisticsInterfaceSummaryRespVO convert(WxDataCubeInterfaceResult bean);
}

8
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/service/account/MpAccountService.java
View File

@ -7,6 +7,7 @@ import cn.iocoder.yudao.module.mp.controller.admin.account.vo.MpAccountUpdateReq
import cn.iocoder.yudao.module.mp.dal.dataobject.account.MpAccountDO;
import javax.validation.Valid;
import java.util.List;
/**
* 公众号账号 Service 接口
@ -66,6 +67,13 @@ public interface MpAccountService {
*/
PageResult<MpAccountDO> getAccountPage(MpAccountPageReqVO pageReqVO);
/**
* 获得公众号账号列表
*
* @return 公众号账号列表
*/
List<MpAccountDO> getAccountList();
/**
* 生成公众号账号的二维码
*

5
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/service/account/MpAccountServiceImpl.java
View File

@ -155,6 +155,11 @@ public class MpAccountServiceImpl implements MpAccountService {
return mpAccountMapper.selectPage(pageReqVO);
}
@Override
public List<MpAccountDO> getAccountList() {
return mpAccountMapper.selectList();
}
@Override
public void generateAccountQrCode(Long id) {
// 校验存在

10
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/service/statistics/MpStatisticsService.java
View File

@ -1,5 +1,6 @@
package cn.iocoder.yudao.module.mp.service.statistics;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeInterfaceResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
@ -41,4 +42,13 @@ public interface MpStatisticsService {
*/
List<WxDataCubeMsgResult> getUpstreamMessage(Long accountId, LocalDateTime[] date);
/**
* 获取接口分析数据
*
* @param accountId 公众号账号编号
* @param date 时间区间
* @return 接口分析数据
*/
List<WxDataCubeInterfaceResult> getInterfaceSummary(Long accountId, LocalDateTime[] date);
}

12
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/service/statistics/MpStatisticsServiceImpl.java
View File

@ -4,6 +4,7 @@ import cn.hutool.core.date.DateUtil;
import cn.iocoder.yudao.module.mp.framework.mp.core.MpServiceFactory;
import me.chanjar.weixin.common.error.WxErrorException;
import me.chanjar.weixin.mp.api.WxMpService;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeInterfaceResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeMsgResult;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserCumulate;
import me.chanjar.weixin.mp.bean.datacube.WxDataCubeUserSummary;
@ -62,4 +63,15 @@ public class MpStatisticsServiceImpl implements MpStatisticsService {
}
}
@Override
public List<WxDataCubeInterfaceResult> getInterfaceSummary(Long accountId, LocalDateTime[] date) {
WxMpService mpService = mpServiceFactory.getRequiredMpService(accountId);
try {
return mpService.getDataCubeService().getInterfaceSummary(
DateUtil.date(date[0]), DateUtil.date(date[1]));
} catch (WxErrorException e) {
throw exception(STATISTICS_GET_INTERFACE_SUMMARY_FAIL, e.getError().getErrorMsg());
}
}
}

2
yudao-module-system/yudao-module-system-biz/src/main/java/cn/iocoder/yudao/module/system/controller/admin/user/vo/user/UserSimpleRespVO.java
View File

@ -6,7 +6,7 @@ import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
@ApiModel("用户精简信息 Response VO")
@ApiModel("管理后台 - 用户精简信息 Response VO")
@Data
@NoArgsConstructor
@AllArgsConstructor

8
yudao-ui-admin/src/api/mp/account.js
View File

@ -43,6 +43,14 @@ export function getAccountPage(query) {
})
}
// 获取公众号账号精简信息列表
export function getSimpleAccounts() {
return request({
url: '/mp/account/list-all-simple',
method: 'get',
})
}
// 生成公众号二维码
export function generateAccountQrCode(id) {
return request({

9
yudao-ui-admin/src/api/mp/statistics.js
View File

@ -26,3 +26,12 @@ export function getUserCumulate(query) {
params: query
})
}
// 获得接口分析数据
export function getInterfaceSummary(query) {
return request({
url: '/mp/statistics/interface-summary',
method: 'get',
params: query
})
}

299
yudao-ui-admin/src/views/mp/statistics/index.vue
View File

@ -1,63 +1,70 @@
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span class="demonstration">时间范围</span>
<!-- 搜索工作栏 -->
<el-form ref="queryForm" size="small" :inline="true" label-width="68px">
<el-form-item label="公众号" prop="accountId">
<el-select v-model="accountId" @change="getSummary">
<el-option v-for="item in accounts" :key="parseInt(item.id)" :label="item.name" :value="parseInt(item.id)" />
</el-select>
</el-form-item>
<el-form-item label="时间范围" prop="date">
<el-date-picker v-model="date" style="width: 260px" value-format="yyyy-MM-dd HH:mm:ss" type="daterange"
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
:picker-options="datePickerOptions" :default-time="['00:00:00', '23:59:59']"
@change="changeDate" >
@change="getSummary">
</el-date-picker>
</div>
<!-- <el-row>-->
<!-- <el-col :span="12">-->
<!-- <div id="interfaceSummaryChart" :style="{width: '80%', height: '500px'}"></div>-->
<!-- </el-col>-->
<!-- <el-col :span="12">-->
<!-- <div id="interfaceSummaryChart2" :style="{width: '80%', height: '500px'}"></div>-->
<!-- </el-col>-->
<!-- </el-row>-->
</el-form-item>
</el-form>
<el-row>
<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="userSummaryChart" 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="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>
</el-card>
</el-col>
</el-row>
</el-card>
<!-- 图表 -->
<el-row>
<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="userSummaryChart" 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="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>
</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="interfaceSummaryChart" style="height: 420px" />
</div>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
// 引入基本模板
import * as echarts from 'echarts'
// 引入柱状图组件
require('echarts/lib/chart/bar')
// 引入柱拆线组件
@ -67,9 +74,10 @@ require('echarts/lib/component/tooltip')
require('echarts/lib/component/title')
require('echarts/lib/component/legend')
import {getInterfaceSummary, getUserSummary, getUserCumulate, getUpstreamMessage} from '@/api/mp/statistics'
import { getInterfaceSummary, getUserSummary, getUserCumulate, getUpstreamMessage} from '@/api/mp/statistics'
import { datePickerOptions } from "@/utils/constants";
import {addTime, beginOfDay, betweenDay, endOfDay, formatDate} from "@/utils/dateUtils";
import {getSimpleAccounts} from "@/api/mp/account";
export default {
name: 'mpStatistics',
@ -77,7 +85,8 @@ export default {
return {
date : [beginOfDay(new Date(new Date().getTime() - 3600 * 1000 * 24 * 7)), // -7 天
endOfDay(new Date(new Date().getTime() - 3600 * 1000 * 24))], // -1 天
accountId: 1,
accountId: undefined,
accounts: [],
xAxisDate: [], // X 轴的日期范围
userSummaryOption: { // 用户增减数据
@ -170,25 +179,78 @@ export default {
data: [] // 用户发送条数的数据
}]
},
interfaceSummaryOption: { // 接口分析况数据
color: ['#67C23A', '#e5323e', '#E6A23C', '#409EFF'],
legend: {
data: ['被动回复用户消息的次数','失败次数', '最大耗时','总耗时']
},
tooltip: {},
xAxis: {
data: [] // X 轴的日期范围
},
yAxis: {},
series: [{
name: '被动回复用户消息的次数',
type: 'bar',
label: {
normal: {
show: true
}
},
barGap: 0,
data: [] // 被动回复用户消息的次数的数据
}, {
name: '失败次数',
type: 'bar',
label: {
normal: {
show: true
}
},
data: [] // 失败次数的数据
}, {
name: '最大耗时',
type: 'bar',
label: {
normal: {
show: true
}
},
data: [] // 最大耗时的数据
}, {
name: '总耗时',
type: 'bar',
label: {
normal: {
show: true
}
},
data: [] // 总耗时的数据
}]
},
// 静态变量
datePickerOptions: datePickerOptions,
}
},
created() {
},
mounted: function() {
this.getSummary()
},
computed: {
getSimpleAccounts().then(response => {
this.accounts = response.data;
// 默认选中第一个
if (this.accounts.length > 0) {
this.accountId = this.accounts[0].id;
}
// 加载数据
this.getSummary();
})
},
methods: {
changeDate() {
this.getSummary()
},
getSummary() {
// 如果没有选中公众号账号，则进行提示。
if (!this.accountId) {
this.$message.error('未选中公众号，无法统计数据')
return false
}
// 必须选择 7 天内，因为公众号有时间跨度限制为 7
if (betweenDay(this.date[0], this.date[1]) >= 7) {
this.$message.error('时间间隔 7 天以内，请重新选择')
@ -204,93 +266,7 @@ export default {
this.initUserSummaryChart();
this.initUserCumulateChart();
this.initUpstreamMessageChart();
//
// //获取接口数据
// getInterfaceSummary({
// startDate: this.startDate,
// endDate: this.endDate
// }).then(response => {
// response.data.forEach((item, index, arr) => {
// this.$set(this.seriesData1, index, item.callbackCount)
// this.$set(this.seriesData2, index, item.maxTimeCost)
// this.$set(this.seriesData3, index, item.totalTimeCost)
// this.$set(this.seriesData4, index, item.failCount)
// })
// // 基于准备好的dom，初始化echarts实例
// let interfaceSummaryChart = echarts.init(document.getElementById('interfaceSummaryChart'))
// // 绘制图表
// interfaceSummaryChart.setOption({
// title: { text: '接口分析数据' },
// color: ['#67C23A', '#e5323e'],
// legend: {
// data: ['被动回复用户消息的次数','失败次数']
// },
// tooltip: {},
// xAxis: {
// data: this.xAxisData
// },
// yAxis: {},
// series: [{
// name: '被动回复用户消息的次数',
// type: 'bar',
// label: {
// normal: {
// show: true
// }
// },
// barGap: 0,
// data: this.seriesData1
// },
// {
// name: '失败次数',
// type: 'bar',
// label: {
// normal: {
// show: true
// }
// },
// data: this.seriesData4
// }]
// })
//
// // 基于准备好的dom，初始化echarts实例
// let interfaceSummaryChart2 = echarts.init(document.getElementById('interfaceSummaryChart2'))
// // 绘制图表
// interfaceSummaryChart2.setOption({
// title: { text: '接口分析数据' },
// color: ['#E6A23C', '#409EFF'],
// legend: {
// data: ['最大耗时','总耗时']
// },
// tooltip: {},
// xAxis: {
// data: this.xAxisData
// },
// yAxis: {},
// series: [
// {
// name: '最大耗时',
// type: 'bar',
// label: {
// normal: {
// show: true
// }
// },
// data: this.seriesData2
// },
// {
// name: '总耗时',
// type: 'bar',
// label: {
// normal: {
// show: true
// }
// },
// data: this.seriesData3
// }]
// })
// }).catch(() => {
// })
this.interfaceSummaryChart();
},
initUserSummaryChart() {
this.userSummaryOption.xAxis.data = [];
@ -356,14 +332,31 @@ export default {
const upstreamMessageChart = echarts.init(this.$refs.upstreamMessageChart);
upstreamMessageChart.setOption(this.upstreamMessageOption);
}).catch(() => {})
},
interfaceSummaryChart() {
this.interfaceSummaryOption.xAxis.data = [];
this.interfaceSummaryOption.series[0].data = [];
this.interfaceSummaryOption.series[1].data = [];
this.interfaceSummaryOption.series[2].data = [];
this.interfaceSummaryOption.series[3].data = [];
// 发起请求
getInterfaceSummary({
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.interfaceSummaryOption.xAxis.data = this.xAxisDate;
// 处理数据
response.data.forEach((item, index) => {
this.interfaceSummaryOption.series[0].data[index] = item.callbackCount;
this.interfaceSummaryOption.series[1].data[index] = item.failCount;
this.interfaceSummaryOption.series[2].data[index] = item.maxTimeCost;
this.interfaceSummaryOption.series[3].data[index] = item.totalTimeCost;
})
// 绘制图表
const interfaceSummaryChart = echarts.init(this.$refs.interfaceSummaryChart);
interfaceSummaryChart.setOption(this.interfaceSummaryOption);
}).catch(() => {})
}
}
}
</script>
<style lang="scss" scoped>
.demonstration{
font-size: 15px;
margin-right: 10px;
}
</style>