mp：完成公众号统计的用户累计数据、消息概况数据

YunaiV
1 parent 09e200c3
Showing 11 changed files with 313 additions and 126 deletions
yudao-module-mp/yudao-module-mp-api/src/main/java/cn/iocoder/yudao/module/mp/enums/ErrorCodeConstants.java
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/statistics/MpStatisticsController.java
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/statistics/vo/MpStatisticsGetReqVO.java
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/statistics/vo/MpStatisticsUpstreamMessageRespVO.java
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/controller/admin/statistics/vo/MpStatisticsUserCumulateRespVO.java
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/convert/statistics/MpStatisticsConvert.java
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/service/statistics/MpStatisticsService.java
yudao-module-mp/yudao-module-mp-biz/src/main/java/cn/iocoder/yudao/module/mp/service/statistics/MpStatisticsServiceImpl.java
yudao-ui-admin/src/api/mp/statistics.js
yudao-ui-admin/src/utils/dateUtils.js
yudao-ui-admin/src/views/mp/statistics/index.vue
@@ -16,6 +16,8 @@ public interface ErrorCodeConstants {
     // ========== 公众号账号 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 要处理下
     ErrorCode COMMON_NOT_EXISTS = new ErrorCode(1006001002, "用户不存在");
 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.convert.statistics.MpStatisticsConvert;
 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.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 org.springframework.security.access.prepost.PreAuthorize;
 import org.springframework.validation.annotation.Validated;
@@ -30,9 +35,28 @@ public class MpStatisticsController {
     @GetMapping("/user-summary")
     @ApiOperation("获得用户增减数据")
     @PreAuthorize("@ss.hasPermission('mp:statistics:query')")
-    public CommonResult<List<WxDataCubeUserSummary>> getAccount(MpStatisticsGetReqVO getReqVO) {
-        List<WxDataCubeUserSummary> list = mpStatisticsService.getUserSummary(getReqVO.getId(), getReqVO.getDate());
+    public CommonResult<List<MpStatisticsUserSummaryRespVO>> getUserSummary(MpStatisticsGetReqVO getReqVO) {
+        List<WxDataCubeUserSummary> list = mpStatisticsService.getUserSummary(
+                getReqVO.getAccountId(), getReqVO.getDate());
         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")
     @NotNull(message = "公众号账号的编号不能为空")
-    private Long id;
+    private Long accountId;
     @ApiModelProperty(value = "查询时间范围")
     @DateTimeFormat(pattern = FORMAT_YEAR_MONTH_DAY_HOUR_MINUTE_SECOND)
+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;
+
+}
+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;
+
+}
 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 org.mapstruct.Mapper;
+import org.mapstruct.Mapping;
+import org.mapstruct.Mappings;
 import org.mapstruct.factory.Mappers;
 import java.util.List;
@@ -11,6 +18,17 @@ public interface MpStatisticsConvert {
     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);
 }
 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 java.time.LocalDateTime;
@@ -15,10 +17,28 @@ public interface MpStatisticsService {
     /**
      * 获取用户增减数据
      *
-     * @param id 公众号账号编号
+     * @param accountId 公众号账号编号
      * @param date 时间区间
      * @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 me.chanjar.weixin.common.error.WxErrorException;
 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 org.springframework.context.annotation.Lazy;
 import org.springframework.stereotype.Service;
@@ -13,7 +15,7 @@ import java.time.LocalDateTime;
 import java.util.List;
 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 实现类
@@ -28,8 +30,8 @@ public class MpStatisticsServiceImpl implements MpStatisticsService {
     private MpServiceFactory mpServiceFactory;
     @Override
-    public List<WxDataCubeUserSummary> getUserSummary(Long id, LocalDateTime[] date) {
-        WxMpService mpService = mpServiceFactory.getRequiredMpService(id);
+    public List<WxDataCubeUserSummary> getUserSummary(Long accountId, LocalDateTime[] date) {
+        WxMpService mpService = mpServiceFactory.getRequiredMpService(accountId);
         try {
             return mpService.getDataCubeService().getUserSummary(
                     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());
+        }
+    }
 }
 import request from '@/utils/request'
-// TODO 获得公众号账号分页
-export function getInterfaceSummary(query) {
+// 获取消息发送概况数据
+export function getUpstreamMessage(query) {
   return request({
-    url: '/mp/account/page',
+    url: '/mp/statistics/upstream-message',
     method: 'get',
     params: query
   })
 }
-// TODO 获得公众号账号分页
+// 用户增减数据
 export function getUserSummary(query) {
   return request({
     url: '/mp/statistics/user-summary',
@@ -18,10 +18,10 @@ export function getUserSummary(query) {
   })
 }
-// TODO 获得公众号账号分页
+// 获得用户累计数据
 export function getUserCumulate(query) {
   return request({
-    url: '/mp/account/page',
+    url: '/mp/statistics/user-cumulate',
     method: 'get',
     params: query
   })
@@ -34,17 +34,14 @@ export function endOfDay(date) {
 }
 export function betweenDay(date1, date2) {
-  // 适配 string 字符串的日期
-  if (typeof date1 === 'string') {
-    date1 = new Date(date1);
-  }
-  if (typeof date2 === 'string') {
-    date2 = new Date(date2);
-  }
+  date1 = convertDate(date1);
+  date2 = convertDate(date2);
+  // 计算差值
   return Math.floor((date2.getTime() - date1.getTime()) / (24 * 3600 * 1000));
 }
 export function formatDate(date, fmt) {
+  date = convertDate(date);
   const o = {
     "M+": date.getMonth() + 1, //月份
     "d+": date.getDate(), //日
@@ -64,3 +61,15 @@ export function formatDate(date, 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"  >
         </el-date-picker>
       </div>
-      <el-row>
-        <el-col :span="12">
-          <div id="userCumulateChart" :style="{width: '80%', height: '500px'}"></div>
-        </el-col>
-        <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-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-row>
         <el-col :span="12" class="card-box">
@@ -28,18 +25,27 @@
               <span>用户增减数据</span>
             </div>
             <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>
           </el-card>
         </el-col>
-
         <el-col :span="12" class="card-box">
           <el-card>
             <div slot="header">
-              <span>内存信息</span>
+              <span>累计用户数据</span>
             </div>
             <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>
           </el-card>
         </el-col>
@@ -61,9 +67,9 @@ require(&#39;echarts/lib/component/tooltip&#39;)
 require('echarts/lib/component/title')
 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 {beginOfDay, betweenDay, endOfDay, formatDate} from "@/utils/dateUtils";
+import {addTime, beginOfDay, betweenDay, endOfDay, formatDate} from "@/utils/dateUtils";
 export default {
   name: 'mpStatistics',
@@ -71,16 +77,9 @@ 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,
       xAxisDate: [], // X 轴的日期范围
-      seriesData1: [],
-      seriesData2: [],
-      seriesData3: [],
-      seriesData4: [],
-      seriesData5: [],
-      seriesData6: [],
-      seriesData7: [],
-
       userSummaryOption: { // 用户增减数据
         color: ['#67C23A', '#e5323e'],
         legend: {
@@ -88,7 +87,7 @@ export default {
         },
         tooltip: {},
         xAxis: {
-          data: this.xAxisDate
+          data: [] // X 轴的日期范围
         },
         yAxis: {
           minInterval: 1
@@ -102,7 +101,7 @@ export default {
             }
           },
           barGap: 0,
-          data: []
+          data: [] // 新增用户的数据
         }, {
           name: '取消关注的用户',
           type: 'bar',
@@ -111,7 +110,64 @@ export default {
               show: true
             }
           },
+          data: [] // 取消关注的用户的数据
+        }]
+      },
+      userCumulateOption: { // 累计用户数据
+        legend: {
+          data: ['累计用户量']
+        },
+        xAxis: {
+          type: 'category',
           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: {
     changeDate() {
-
-
-
-      this.seriesData1 = []
-      this.seriesData2 = []
-      this.seriesData5 = []
-      this.seriesData6 = []
-
       this.getSummary()
     },
     getSummary() {
@@ -149,76 +197,13 @@ export default {
       this.xAxisDate = []
       const days = betweenDay(this.date[0], this.date[1]) // 相差天数
       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.seriesData2.push(0)
-        this.seriesData5.push(0)
-        this.seriesData6.push(0)
+        this.xAxisDate.push(formatDate(addTime(this.date[0], 3600 * 1000 * 24 * i), 'yyyy-MM-dd'));
       }
-      // 用户增减数据
-      this.userSummaryOption.xAxis.data = [];
-      this.userSummaryOption.series[0].data = [];
-      this.userSummaryOption.series[1].data = [];
-      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(() => {
-      // })
+      // 初始化图表
+      this.initUserSummaryChart();
+      this.initUserCumulateChart();
+      this.initUpstreamMessageChart();
       //
       // //获取接口数据
       // getInterfaceSummary({
@@ -306,6 +291,71 @@ export default {
       //   })
       // }).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(() => {})
     }
   }
 }