feat:完成上课数据接口联调

c233f4f6 · wufan · 1845cc73 · c233f4f6 · c233f4f6 · c233f4f6
Commit c233f4f6 authored Dec 16, 2020 by wufan
6 changed files
--- a/src/common/js/service.ts
+++ b/src/common/js/service.ts
@@ -2,7 +2,7 @@
 * @Author: 吴文洁
 * @Date: 2020-08-31 09:34:51
 * @LastEditors: wufan
- * @LastEditTime: 2020-12-01 15:30:03
+ * @LastEditTime: 2020-12-16 14:59:13
 * @Description: 
 * @Copyright: 杭州杰竞科技有限公司 版权所有
 */
@@ -31,6 +31,10 @@ class Service {
    return Axios.post('POST', url, params, option);
  }
+  static get(url: string, params: any, option?: any) {
+    return Axios.post('GET', url, params, option);
+  }
  static MFS(url: string, params: any, option: any) {
    return Axios.post('POST', `mfs/${url}`, params, option);
  }

--- a/src/data-source/course/request-api.ts
+++ b/src/data-source/course/request-api.ts
@@ -2,7 +2,7 @@
 * @Author: wufan
 * @Date: 2020-12-12 11:57:10
 * @LastEditors: wufan
- * @LastEditTime: 2020-12-15 15:00:55
+ * @LastEditTime: 2020-12-16 15:01:26
 * @Description: Description
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */

--- a/src/modules/course-manage/DataList/CourseData.jsx
+++ b/src/modules/course-manage/DataList/CourseData.jsx
 import React from "react";
 import { withRouter } from "react-router-dom";
-import {
+import { Table, Popover, message, Button, Spin } from "antd";
-  Table,
-  Popover,
-  message,
-  Button,
-  Spin,
-} from "antd";
 import dealTimeDuration from "../utils/dealTimeDuration";
 import { PageControl } from "@/components";
 import CourseService from "@/domains/course-domain/CourseService";
-import User from '@/common/js/user';
+import User from "@/common/js/user";
 import "./DataList.less";
 class DataList extends React.Component {
  constructor(props) {
@@ -26,7 +20,7 @@ class DataList extends React.Component {
      total: 0,
      loading: true,
      liveCourseId: courseId,
-      storeId: User.getStoreId()
+      storeId: User.getStoreId(),
    };
  }
@@ -176,10 +170,16 @@ class DataList extends React.Component {
    CourseService.exportStudentCourseData({
      liveCourseId: liveCourseId,
      exportLiveType: "VISITOR",
-      storeId
+      storeId,
    }).then((res) => {
-      if(res.success){
+      const link = res.result;
-        message.success("导出成功！")
+      this.setState({
+        link
+      });
+      document.getElementById("loadExcel").click();
+      if (res.success) {
+        message.success("导出成功！");
      }
    });
  };
@@ -203,7 +203,7 @@ class DataList extends React.Component {
        );
        return (
          <Popover content={table} trigger="click">
-            <span className="handel-btn">{text}</span>
+            <span className="times-num">{teacherData.entryNum}</span>
          </Popover>
        );
      } else {
@@ -214,6 +214,19 @@ class DataList extends React.Component {
    }
  };
+  showTable = () => {
+    return (
+      <Table
+        columns={this.getVisiterColumns()}
+        dataSource={this.state.teacherData.visitorInfoVOList}
+        scroll={{ y: 75 }}
+        size={"small"}
+        style={{ width: 450 }}
+        pagination={false}
+      />
+    );
+  };
  render() {
    const {
      teacherData,
@@ -222,9 +235,19 @@ class DataList extends React.Component {
      size,
      total,
      loading,
+      link
    } = this.state;
    return (
      <Spin spinning={loading}>
+                <a
+          href={link}
+          target="_blank"
+          download
+          id="loadExcel"
+          style={{ position: "absolute", left: "-10000px" }}
+        >
+          111
+        </a>
        {/* 讲师上课数据 */}
        <div className="courseData-teacher">
          <p className="title">讲师上课数据</p>
@@ -251,18 +274,19 @@ class DataList extends React.Component {
                className={`times-num ${
                  Number(teacherData.entryNum) > 0 ? "can-click" : ""
                }`}
-                onClick={() => {
-                  this.handleCheckEnterTimes();
-                }}
              >
-                {teacherData.entryNum}
+                <Popover content={this.showTable()} trigger="click">
+                  <span className="times-num">{teacherData.entryNum}</span>
+                </Popover>
              </div>
              <div className="text">进入直播间次数</div>
            </div>
            <div className="online-duration item-block">
              <div className="duration">
-                {teacherData.totalDuration ? dealTimeDuration(teacherData.totalDuration) : '00:00:00'}
+                {teacherData.totalDuration
+                  ? dealTimeDuration(teacherData.totalDuration)
+                  : "00:00:00"}
              </div>
              <div className="text">累计在线时长</div>
            </div>

--- a/src/modules/course-manage/DataList/DataList.jsx
+++ b/src/modules/course-manage/DataList/DataList.jsx
@@ -31,7 +31,7 @@ class DataList extends React.Component {
          }}
        />
        <div className="box">
-          <Tabs defaultActiveKey="courseData" >
+          <Tabs defaultActiveKey="courseData">
            <Tabs.TabPane tab="上课记录" key="courseData">
              <CourseData></CourseData>
            </Tabs.TabPane>

--- a/src/modules/course-manage/DataList/DataList.less
+++ b/src/modules/course-manage/DataList/DataList.less
@@ -27,7 +27,7 @@
  }
  .handel-btn {
-    color: #ff7519;
+    color: #5289fa;
    cursor: pointer;
  }
  .split {

--- a/src/modules/course-manage/DataList/PlaybackData.jsx
+++ b/src/modules/course-manage/DataList/PlaybackData.jsx
 import React from 'react';
 import { withRouter } from "react-router-dom";
-import { Table,  Button, Modal } from 'antd';
+import { Table,  Button, Modal, message } from 'antd';
 import dealTimeDuration from '../utils/dealTimeDuration';
 import { PageControl } from "@/components";
 import './DataList.less';
@@ -8,20 +8,23 @@ import CourseService from "@/domains/course-domain/CourseService";
 import User from '@/common/js/user';
 const liveTypeMap = {
-  USER: "普通用户",
+  USER: "用户",
-  ANCHOR: "主播",
+  CLOUD_LECTURER: "讲师",
-  ADMIN: "管理员（助教）",
+  STORE_MANAGER: "店铺管理员",
-  GUEST: "游客",
+  CLOUD_MANAGER: "管理员",
-  WATCH: "直播监课"
+  GUEST: "游客"
 };
 class PlaybackData extends React.Component {
  constructor(props) {
    super(props);
+    const courseId = getParameterByName("id"); // 课程ID
    this.state = {
      playbackData: [],
      current: 1,
      size: 10,
      total: 0,
+      liveCourseId: courseId,
      storeId: User.getStoreId()
    }
  }
@@ -31,11 +34,11 @@ class PlaybackData extends React.Component {
  }
  fetchPlaybackList = (page = 1) => {
-    const { size } = this.state
+    const { size, liveCourseId } = this.state
    const params = {
-      liveCourseId: getParameterByName("id"),
+      liveCourseId,
      current: page,
-      size: size
+      size
    }
    CourseService.fetchPlaybackList(params).then((res) => {
@@ -63,7 +66,7 @@ class PlaybackData extends React.Component {
      },
      {
        title: "观看者类型",
-        dataIndex: "liveRole",
+        dataIndex: "userRole",
        render: (text) => <span>{liveTypeMap[text]}</span>,
      },
      {
@@ -86,12 +89,19 @@ class PlaybackData extends React.Component {
  }
  // 导出
  handleplaybackExport() {
-    const { storeId } = this.state;
+    const { storeId, liveCourseId } = this.state;
    CourseService.exportPlayBackCourseData({
-      liveCourseId: getParameterByName("id"),
+      liveCourseId,
      exportLiveType: "PLAY_BACK",
      storeId
    }).then((res) => {
+      const link = res.result;
+      this.setState({
+        link
+      });
+      document.getElementById("load-play-back-excel").click();
      if(res.success){
        message.success("导出成功！")
      }
@@ -99,9 +109,18 @@ class PlaybackData extends React.Component {
  }
  render() {
-    const { playbackData, total, current,  size} = this.state
+    const { playbackData, total, current, size, link} = this.state
    return (
      <div>
+        <a
+          href={link}
+          target="_blank"
+          download
+          id="load-play-back-excel"
+          style={{ position: "absolute", left: "-10000px" }}
+        >
+          111
+        </a>
        <Button onClick={() => {this.handleplaybackExport()}}>导出</Button>
        <Table
          size="small"