Merge remote-tracking branch 'origin/master'

src/api/course/statistics.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询会员每日看课统计列表
+export function listStatistics(query) {
+  return request({
+    url: '/course/statistics/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询会员每日看课统计详细
+export function getStatistics(id) {
+  return request({
+    url: '/course/statistics/' + id,
+    method: 'get'
+  })
+}
+
+// 新增会员每日看课统计
+export function addStatistics(data) {
+  return request({
+    url: '/course/statistics',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改会员每日看课统计
+export function updateStatistics(data) {
+  return request({
+    url: '/course/statistics',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除会员每日看课统计
+export function delStatistics(id) {
+  return request({
+    url: '/course/statistics/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出会员每日看课统计
+export function exportStatistics(query) {
+  return request({
+    url: '/course/statistics/export',
+    method: 'get',
+    params: query
+  })
+}

src/api/statistics/statistics.js

@@ -228,6 +228,20 @@ export function watchCourseTopTen(param){
   })
 }
 
+/**
+ * 课程观看统计 按公司
+ * @param param
+ * @returns {AxiosPromise}
+ */
+export function getWatchCourseStatisticsData(param){
+  const safeParam = JSON.parse(JSON.stringify(param));
+  return request({
+    url: '/index/statistics/getWatchCourseStatisticsData',
+    method: 'post',
+    data: safeParam
+  })
+}
+
 
 /**
  * 答题红包金额TOP10

src/views/course/statistics/index.vue

@@ -0,0 +1,253 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+
+      <el-form-item label="项目" prop="projectId">
+        <el-select filterable v-model="queryParams.projectId" placeholder="请选择项目" clearable size="small">
+          <el-option
+            v-for="dict in projectLists"
+            :key="dict.dictValue"
+            :label="dict.dictLabel"
+            :value="parseInt(dict.dictValue)"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="所属公司" prop="companyName">
+        <el-select
+          v-model="queryParams.companyId"
+          placeholder="请选择所属公司"
+          clearable
+          filterable
+          size="small"
+        >
+          <el-option
+            v-for="item in companyQueryOptions"
+            :key="item.companyId"
+            :label="item.companyName"
+            :value="item.companyId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="统计日期" prop="createDate">
+        <el-date-picker
+          v-model="dateRange"
+          type="daterange"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+          :picker-options="pickerOptions"
+          @change="handleDateChange"
+          clearable
+          size="small">
+        </el-date-picker>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          :loading="exportLoading"
+          @click="handleExport"
+          v-hasPermi="['course:statistics:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table border v-loading="loading" :data="statisticsList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="统计日期" align="center" prop="createDate" width="180">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.createDate, '{y}-{m}-{d}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="公司名称" align="center" prop="companyName" />
+      <el-table-column label="会员数量" align="center" prop="userCount" />
+      <el-table-column label="会员黑名单数量" align="center" prop="userBlacklistCount" />
+      <el-table-column label="观看次数" align="center" prop="watchCount" />
+      <el-table-column label="完播次数" align="center" prop="completeWatchCount" />
+      <el-table-column label="完播率" align="center" prop="completeRate" />
+      <el-table-column label="答题人次" align="center" prop="answerCount" />
+      <el-table-column label="正确人次" align="center" prop="correctCount" />
+      <el-table-column label="正确率" align="center" prop="correctRate" />
+      <el-table-column label="领取次数" align="center" prop="receiveCount" />
+      <el-table-column label="领取金额" align="center" prop="receiveAmount" />
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+import { listStatistics, getStatistics, exportStatistics } from "@/api/course/statistics";
+import {getCompanyList, getCompanyUserList} from "@/api/company/companyUser";
+
+export default {
+  name: "Statistics",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 会员每日看课统计表格数据
+      statisticsList: [],
+
+      // 日期范围选择器值
+      dateRange: [],
+
+      // 日期选择器配置
+      pickerOptions: {
+        onPick: ({ maxDate, minDate }) => {
+          this.pickerMinDate = minDate.getTime();
+          if (maxDate) {
+            this.pickerMinDate = '';
+          }
+        },
+        disabledDate: (time) => {
+          if (this.pickerMinDate !== '') {
+            const day30 = 30 * 24 * 3600 * 1000;
+            const maxTime = this.pickerMinDate + day30;
+            const minTime = this.pickerMinDate - day30;
+            return time.getTime() > maxTime || time.getTime() < minTime;
+          }
+          return false;
+        }
+      },
+
+      //所属公司
+      companyQueryOptions: [],
+      //项目
+      projectLists: [],
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        projectId: null,
+        watchCourseCount: null,
+        completeWatchCount: null,
+        watchCount: null,
+        completeRate: null,
+        answerCount: null,
+        correctCount: null,
+        correctRate: null,
+        receiveCount: null,
+        receiveAmount: null,
+        userCount: null,
+        userBlacklistCount: null,
+        companyId: null,
+        companyName: null,
+        createDate: null,
+        beginTime: null,
+        endTime: null
+      },
+      // 表单参数
+      form: {},
+    };
+  },
+  created() {
+    this.getList();
+    this.getDicts("sys_course_project").then(response => {
+      this.projectLists = response.data;
+    })
+    getCompanyList().then(response => {
+      if (response.code === 200) {
+        this.companyQueryOptions = response.data;
+      }});
+  },
+  methods: {
+    /** 查询会员每日看课统计列表 */
+    getList() {
+      this.loading = true;
+
+      listStatistics(this.queryParams).then(response => {
+        this.statisticsList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      }).catch((error) => {
+        this.loading = false;
+      });
+    },
+
+    /** 处理日期范围变化 */
+    handleDateChange(value) {
+      this.dateRange = value;
+      if (value && value.length === 2) {
+        this.queryParams.beginTime = value[0];
+        this.queryParams.endTime = value[1];
+      } else {
+        this.queryParams.beginTime = null;
+        this.queryParams.endTime = null;
+      }
+    },
+
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+
+    /** 重置按钮操作 */
+    resetQuery() {
+      // 重置日期范围
+      this.dateRange = [];
+      // 手动重置 companyId
+      this.queryParams.companyId = null;
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = {...this.queryParams};
+      // 确保不传递dateRange参数
+      delete queryParams.dateRange;
+
+      this.$confirm('是否确认导出所有会员每日看课统计数据项?', "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.exportLoading = true;
+        return exportStatistics(queryParams);
+      }).then(response => {
+        this.download(response.msg);
+        this.exportLoading = false;
+      }).catch(() => {});
+    }
+  }
+};
+</script>

src/views/course/userCoursePeriod/statistics.vue

@@ -166,7 +166,7 @@ export default {
       // 查询参数
       queryParams: {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 100,
         videoIdList: [],
         // videoId: '',
         periodId: ''

src/views/his/statistics/appOrderCountStats.vue

@@ -3,22 +3,32 @@
     <div class="app-content">
       <div class="title">App商城订单统计</div>
       <el-form class="search-form" :inline="true">
-        <el-form-item>
-          <treeselect
-            :clearable="false"
-            v-model="companyId"
-            :options="deptOptions"
-            :show-count="true"
-            placeholder="请选择归属部门"
-          />
+        <el-form-item label="公司名称" prop="companyId">
+          <el-select
+            style="width: 220px"
+            filterable
+            v-model="queryParams.companyId"
+            placeholder="请选择公司名"
+            clearable
+            size="small"
+          >
+            <el-option
+              v-for="item in companys"
+              :key="item.companyId"
+              :label="item.companyName"
+              :value="item.companyId"
+            />
+          </el-select>
         </el-form-item>
-        <el-form-item>
+
+        <el-form-item label="员工" prop="companyUserId">
           <el-select
             filterable
-            v-model="companyUserId"
+            v-model="queryParams.companyUserId"
             placeholder="请选择员工"
             clearable
             size="small"
+            :disabled="!queryParams.companyId"
           >
             <el-option
               v-for="item in users"
@@ -28,6 +38,7 @@
             />
           </el-select>
         </el-form-item>
+
         <el-form-item label="下单日期">
           <el-date-picker
             clearable
@@ -40,6 +51,7 @@
             end-placeholder="结束日期"
           />
         </el-form-item>
+
         <el-form-item>
           <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
         </el-form-item>
@@ -70,61 +82,64 @@
 
 <script>
 import { getAppOrderCount } from "@/api/company/statistics";
-import { getUserListByDeptId } from "@/api/company/companyUser";
-import { treeselect } from "@/api/company/companyDept";
-import Treeselect from "@riophae/vue-treeselect";
-import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import { getUserList } from "@/api/company/companyUser"; // 使用 getUserList(companyId)
+import { getCompanyList } from "@/api/company/company";
 
 export default {
   name: "AppOrderCountStats",
-  components: { Treeselect },
-  watch: {
-    companyId: {
-      handler(newVal) {
-        if (newVal != null) {
-          this.companyUserId = null;
-          this.getUserListByDeptId();
-        } else {
-          this.users = [];
-          this.companyUserId = null;
-        }
-      }
-    }
-  },
   data() {
     return {
-      companyId: null,
-      companyUserId: null,
-      users: [],
-      deptOptions: [],
-      dateRange: [],
-      tableData: []
+      // 仅保留必要查询参数
+      queryParams: {
+        companyId: null,
+        companyUserId: null
+      },
+      companys: [],   // 公司列表
+      users: [],      // 员工列表
+      dateRange: [],  // 日期范围
+      tableData: []   // 表格数据
     };
   },
+  watch: {
+    // 公司变化时，重新加载员工
+    'queryParams.companyId'(newVal) {
+      if (newVal) {
+        this.queryParams.companyUserId = null;
+        this.loadUsers();
+      } else {
+        this.users = [];
+        this.queryParams.companyUserId = null;
+      }
+    }
+  },
   created() {
-    this.loadDeptTree();
+    // 初始化公司下拉列表
+    getCompanyList().then(response => {
+      this.companys = response.data || [];
+    });
   },
   methods: {
-    loadDeptTree() {
-      treeselect().then(response => {
-        this.deptOptions = response.data;
-        if (response.data && response.data.length > 0) {
-          this.companyId = response.data[0].id;
-        }
-      });
-    },
+    // 根据 companyId 加载员工
+    loadUsers() {
+      const companyId = this.queryParams.companyId;
+      if (!companyId) return;
 
-    getUserListByDeptId() {
-      if (!this.companyId) return;
-      getUserListByDeptId({ deptId: this.companyId }).then(response => {
-        this.users = response.data || [];
+      getUserList(companyId).then(res => {
+        if (res.code === 200) {
+          this.users = Array.isArray(res.data) ? res.data : [];
+        } else {
+          this.users = [];
+        }
+      }).catch(() => {
+        this.users = [];
       });
     },
 
+    // 搜索统计
     search() {
       const params = {
-        companyId: this.companyId,
-        companyUserId: this.companyUserId,
+        companyId: this.queryParams.companyId,
+        companyUserId: this.queryParams.companyUserId,
         startTime: this.dateRange?.[0] || undefined,
         endTime: this.dateRange?.[1] ? this.dateRange[1] + " 23:59:59" : undefined
       };
@@ -132,6 +147,8 @@ export default {
       getAppOrderCount(params).then(response => {
         const vo = response.data;
         this.tableData = vo ? [vo] : [];
+      }).catch(() => {
+        this.tableData = [];
       });
     }
   }
@@ -165,15 +182,4 @@ export default {
     }
   }
 }
-
-.vue-treeselect {
-  width: 217px;
-  height: 36px;
-}
-</style>
-
-<style>
-.vue-treeselect__control {
-  display: block;
-}
 </style>

src/views/his/statistics/hisOrderCountStats.vue

@@ -3,22 +3,32 @@
     <div class="app-content">
       <div class="title">互联网医院订单统计</div>
       <el-form class="search-form" :inline="true">
-        <el-form-item>
-          <treeselect
-            :clearable="false"
-            v-model="companyId"
-            :options="deptOptions"
-            :show-count="true"
-            placeholder="请选择归属部门"
-          />
+        <el-form-item label="公司名称" prop="companyId">
+          <el-select
+            style="width: 220px"
+            filterable
+            v-model="queryParams.companyId"
+            placeholder="请选择公司名"
+            clearable
+            size="small"
+          >
+            <el-option
+              v-for="item in companys"
+              :key="item.companyId"
+              :label="item.companyName"
+              :value="item.companyId"
+            />
+          </el-select>
         </el-form-item>
-        <el-form-item>
+
+        <el-form-item label="员工" prop="companyUserId">
           <el-select
             filterable
-            v-model="companyUserId"
+            v-model="queryParams.companyUserId"
             placeholder="请选择员工"
             clearable
             size="small"
+            :disabled="!queryParams.companyId"
           >
             <el-option
               v-for="item in users"
@@ -28,6 +38,7 @@
             />
           </el-select>
         </el-form-item>
+
         <el-form-item label="下单日期">
           <el-date-picker
             clearable
@@ -40,6 +51,7 @@
             end-placeholder="结束日期"
           />
         </el-form-item>
+
         <el-form-item>
           <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
         </el-form-item>
@@ -71,58 +83,50 @@
 <script>
 import { getHisOrderCountStats } from "@/api/company/statistics";
 import { getUserListByDeptId } from "@/api/company/companyUser";
-import { treeselect } from "@/api/company/companyDept";
-import Treeselect from "@riophae/vue-treeselect";
-import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import { getCompanyList } from "@/api/company/company";
 
 export default {
   name: "HisOrderCountStats",
-  components: { Treeselect },
+  data() {
+    return {
+      // 查询参数统一管理
+      queryParams: {
+        companyId: null,
+        companyUserId: null
+        // 其他参数如 pageNum 等在此场景非必需，可省略
+      },
+      companys: [],        // 公司列表
+      users: [],           // 员工列表
+      dateRange: [],       // 日期范围
+      tableData: []        // 表格数据
+    };
+  },
   watch: {
-    // 监听 companyId 变化，自动重载员工列表
-    companyId: {
+    // 监听公司变化，自动加载员工
+    'queryParams.companyId': {
       handler(newVal) {
         if (newVal != null) {
-          this.companyUserId = null; // 清空已选员工
-          this.getUserListByDeptId();
+          this.queryParams.companyUserId = null; // 清空员工选择
+          this.loadUsers();
         } else {
           this.users = [];
-          this.companyUserId = null;
+          this.queryParams.companyUserId = null;
         }
       },
       immediate: false
     }
   },
-  data() {
-    return {
-      companyId: null,        // 销售公司（部门）ID
-      companyUserId: null,    // 销售人员（员工）ID
-      users: [],              // 员工列表
-      deptOptions: [],        // 部门树形数据
-      dateRange: [],          // 日期范围
-      tableData: []           // 表格数据
-    };
-  },
   created() {
-    this.loadDeptTree();
+    // 初始化公司列表
+    getCompanyList().then(response => {
+      this.companys = response.data || [];
+    });
   },
   methods: {
-    // 加载部门树
-    loadDeptTree() {
-      treeselect().then(response => {
-        this.deptOptions = response.data;
-        if (response.data && response.data.length > 0) {
-          // 默认选中第一个部门
-          this.companyId = response.data[0].id;
-          // 触发 watch 自动加载员工（无需手动调用）
-        }
-      });
-    },
-
-    // 根据 companyId 获取员工列表
-    getUserListByDeptId() {
-      if (!this.companyId) return;
-      getUserListByDeptId({ deptId: this.companyId }).then(response => {
+    // 根据 companyId 加载员工
+    loadUsers() {
+      if (!this.queryParams.companyId) return;
+      getUserListByDeptId({ deptId: this.queryParams.companyId }).then(response => {
         this.users = response.data || [];
       });
     },
@@ -130,8 +134,8 @@ export default {
     // 搜索统计
     search() {
       const params = {
-        companyId: this.companyId,
-        companyUserId: this.companyUserId,
+        companyId: this.queryParams.companyId,
+        companyUserId: this.queryParams.companyUserId,
         startTime: this.dateRange?.[0] || undefined,
         endTime: this.dateRange?.[1] ? this.dateRange[1] + " 23:59:59" : undefined
       };
@@ -172,15 +176,4 @@ export default {
     }
   }
 }
-
-.vue-treeselect {
-  width: 217px;
-  height: 36px;
-}
-</style>
-
-<style>
-.vue-treeselect__control {
-  display: block;
-}
 </style>

src/views/index.vue

@@ -408,21 +408,41 @@
           </el-card>
         </el-col>
 
+
         <el-col :span="12">
           <el-card shadow="never">
             <div slot="header" class="chart-header">
-              <span>经销商会员观看TOP10</span>
+              <span>经销商看客统计</span>
               <div class="legend">
-                <el-radio-group v-model="viewerType" size="small" @change="handleDealerChartData">
-                  <el-radio-button label="0">按观看人数</el-radio-button>
-                  <el-radio-button label="1">按完播人数</el-radio-button>
-                </el-radio-group>
+                <div class="legend-item">
+                  <span class="dot viewer-dot"></span>
+                  <span>观看人数</span>
+                </div>
+                <div class="legend-item">
+                  <span class="dot complete-dot"></span>
+                  <span>完播人数</span>
+                </div>
               </div>
-              <!--              <el-button size="small" plain class="view-more">经销商统计 <i class="el-icon-arrow-right"></i></el-button>-->
             </div>
-            <div ref="dealerChart" class="chart-container"></div>
+            <div ref="dealerChartNew" class="chart-container"></div>
           </el-card>
         </el-col>
+
+<!--        <el-col :span="12">-->
+<!--          <el-card shadow="never">-->
+<!--            <div slot="header" class="chart-header">-->
+<!--              <span>经销商会员观看TOP10</span>-->
+<!--              <div class="legend">-->
+<!--                <el-radio-group v-model="viewerType" size="small" @change="handleDealerChartData">-->
+<!--                  <el-radio-button label="0">按观看人数</el-radio-button>-->
+<!--                  <el-radio-button label="1">按完播人数</el-radio-button>-->
+<!--                </el-radio-group>-->
+<!--              </div>-->
+<!--              &lt;!&ndash;              <el-button size="small" plain class="view-more">经销商统计 <i class="el-icon-arrow-right"></i></el-button>&ndash;&gt;-->
+<!--            </div>-->
+<!--            <div ref="dealerChart" class="chart-container"></div>-->
+<!--          </el-card>-->
+<!--        </el-col>-->
       </el-row>
     </transition>
     <transition name="fade">
@@ -553,7 +573,7 @@ import {
   authorizationInfo,
   dealerAggregated, deaMemberTopTen, rechargeComsumption, rewardMoneyTopTen, rewardMoneyTrend,
   smsBalance, thisMonthOrderCount, thisMonthRecvCount, trafficLog,
-  watchCourseTopTen, watchEndPlayTrend
+  watchCourseTopTen, watchEndPlayTrend,getWatchCourseStatisticsData
 } from "@/api/statistics/statistics";
 import dayjs from 'dayjs';
 import { listDept } from '@/api/system/dept'
@@ -600,6 +620,56 @@ const viewCharOption = {
   ]
 }
 
+const dealerOptionNew = {
+  tooltip: {
+    trigger: 'axis',
+    axisPointer: {
+      type: 'shadow'
+    }
+  },
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '3%',
+    containLabel: true
+  },
+  xAxis: {
+    type: 'category',
+    axisLabel: {
+      rotate: 30, // 设置标签倾斜45度
+      // fontSize: 12, // 减小字体大小
+      interval: 0, // 显示所有标签
+      // 可选：限制标签宽度并截断
+      width: 80,
+      overflow: 'truncate',
+      // 可选：设置标签的对齐方式
+      margin: 20,
+      fontWeight: 'bold' // 设置字体加粗
+    }
+  },
+  yAxis: {
+    type: 'value'
+  },
+  series: [
+    {
+      name: '观看人数',
+      type: 'bar',
+      data: [],
+      itemStyle: {
+        color: '#409EFF'
+      }
+    },
+    {
+      name: '完播人数',
+      type: 'bar',
+      data: [],
+      itemStyle: {
+        color: '#67C23A'
+      }
+    }
+  ]
+}
+
 const thisMonthOrderCountOption = {
   tooltip: {
     trigger: 'axis',
@@ -913,6 +983,7 @@ export default {
       smsRemainCount: 0,
       viewerType: '0',
       viewerChart: null,
+      dealerChartNew: null,
       userTypeText: process.env.VUE_APP_COURSE_DEFAULT==1?"会员":"企微",
       userType: process.env.VUE_APP_COURSE_DEFAULT,
       dealerChart: null,
@@ -985,18 +1056,21 @@ export default {
   },
   mounted() {
     this.$nextTick(() => {
-      this.initViewerChart()
-      this.initDealerChart()
+      this.initViewerChart();
+      this.initDealerChartNew();
+      this.initDealerChart();
       this.initCourseWatchChart();
       this.initAnswerRedPackViewerChart();
       this.initAnswerRedPackMoneyViewerChart();
       this.initThisMonthOrderChart();
-      this.initThisMonthRecvChart()
+      this.initThisMonthRecvChart();
+
 
       // 监听窗口大小变化，重新渲染图表
       window.addEventListener('resize', () => {
         this.viewerChart && this.viewerChart.resize()
         this.dealerChart && this.dealerChart.resize()
+        this.dealerChartNew && this.dealerChartNew.resize()
       })
     })
   },
@@ -1277,6 +1351,7 @@ export default {
 
       this.handleCourseWatchChart()
       this.handleViewChartData()
+      this.handleDealerChartDataNew()
 
       // 经销商会员观看TOP10
       this.handleDealerChartData()
@@ -1338,6 +1413,7 @@ export default {
       if (this.selectedDiv === 0) {
         this.handleViewChartData()
         this.handleDealerChartData()
+        this.handleDealerChartDataNew()
       } else if (this.selectedDiv === 1) {
         this.handleCourseWatchChart()
       } else if (this.selectedDiv === 2) {
@@ -1415,6 +1491,7 @@ export default {
       if (this.selectedDiv === 0) {
         this.handleViewChartData()
         this.handleDealerChartData()
+        this.handleDealerChartDataNew()
       } else if (this.selectedDiv === 1) {
         this.handleCourseWatchChart()
       } else if (this.selectedDiv === 2) {
@@ -1538,12 +1615,36 @@ export default {
         }
       })
 
+    },
+    handleDealerChartDataNew() {
+      let param = this.getParam();
+
+      getWatchCourseStatisticsData({ ...param }).then(res => {
+        if (res.code === 200) {
+          console.log(res.data);
+          // 根据实际数据结构调整
+          let data = res.data;
+          let watchUserCountList = data.map(e => e.watchCount);     // 观看次数
+          let completedUserCountList = data.map(e => e.finishCount); // 完播次数
+          let xAxis = data.map(e => e.companyName);                 // X轴使用公司名称
+
+          // 更新图表配置
+          dealerOptionNew.series[0].data = watchUserCountList;
+          dealerOptionNew.series[1].data = completedUserCountList;
+          dealerOptionNew.xAxis.data = xAxis;
+
+          this.dealerChartNew.setOption(dealerOptionNew);
+
+        }
+      })
+
     },
     initThisMonthOrderChart() {
       this.thisMonthOrderChart = echarts.init(this.$refs.viewerOrderChart)
       this.thisMonthOrderChart.setOption(thisMonthOrderCountOption)
     },
     initThisMonthRecvChart() {
+
       this.thisMonthRecvChart = echarts.init(this.$refs.viewerReceiveChart)
       this.thisMonthRecvChart.setOption(thisMonthOrderCountOption)
     },
@@ -1551,6 +1652,10 @@ export default {
       this.viewerChart = echarts.init(this.$refs.viewerChart)
       this.viewerChart.setOption(viewCharOption)
     },
+    initDealerChartNew() {
+      this.dealerChartNew = echarts.init(this.$refs.dealerChartNew)
+      this.dealerChartNew.setOption(dealerOptionNew)
+    },
     initDealerChart() {
       this.dealerChart = echarts.init(this.$refs.dealerChart)
 
@@ -1582,6 +1687,7 @@ export default {
     // window.removeEventListener('resize', this.resizeHandler)
     this.viewerChart && this.viewerChart.dispose()
     this.dealerChart && this.dealerChart.dispose()
+    this.dealerChartNew && this.dealerChartNew.dispose()
   }
 }
 </script>