看课导出

src/api/course/qw/courseWatchLog.js

@@ -167,3 +167,12 @@ export function exportUserIdList(query) {
     params: query
   })
 }
+
+// 导出小程序观看人数统计列表
+export function exportAppIdList(query) {
+  return request({
+    url: '/course/courseWatchLog/exportAppIdList',
+    method: 'get',
+    params: query
+  })
+}

src/views/course/sop/appIdList.vue

@@ -37,6 +37,20 @@
       </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"
+        >导出</el-button>
+      </el-col>
+    </el-row>
+
     <!-- 表格数据 -->
     <el-table
       border
@@ -66,7 +80,7 @@
 </template>
 
 <script>
-import { getAppIdList } from "@/api/course/qw/courseWatchLog";
+import { getAppIdList, exportAppIdList } from "@/api/course/qw/courseWatchLog";
 import {getMiniProgramList } from "@/api/hisStore/storePayment";
 import { allList } from '@/api/company/company'
 
@@ -78,6 +92,7 @@ export default {
     const currentDate = this.getCurrentDate();
     return {
       loading: true,
+      exportLoading: false,
       total: 0,
       appRegisterList: [],
       appMallOptions:[],
@@ -188,6 +203,52 @@ export default {
       // 重置后立即查询
       this.queryParams.pageNum = 1;
       this.getList();
+    },
+
+    /** 导出按钮操作 */
+    handleExport() {
+      // 验证时间范围是否为空
+      if (!this.queryParams.beginTime || !this.queryParams.endTime) {
+        this.$message.warning('请选择开始时间和结束时间');
+        return;
+      }
+
+      this.$confirm('是否确认导出小程序观看人数统计数据?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        // 显示全屏加载提示
+        const loadingInstance = this.$loading({
+          lock: true,
+          text: '正在导出数据，请稍候...',
+          background: 'rgba(0, 0, 0, 0.7)'
+        });
+
+        this.exportLoading = true;
+
+        // 准备导出参数，使用GET方式传递
+        const queryParams = {
+          companyId: this.queryParams.companyId,
+          appId: this.queryParams.appId,
+          beginTime: this.queryParams.beginTime,
+          endTime: this.queryParams.endTime
+        };
+
+        exportAppIdList(queryParams)
+          .then(response => {
+            this.download(response.msg);
+          })
+          .catch(() => {
+            this.$message.error('导出失败');
+          })
+          .finally(() => {
+            loadingInstance.close();
+            this.exportLoading = false;
+          });
+      }).catch(() => {
+        this.$message.info('已取消导出');
+      });
     }
   }
 };