feat:线上课联调

79ea4fff · wufan · 448e3eb7 · 79ea4fff · 79ea4fff · 79ea4fff
Commit 79ea4fff authored Jul 05, 2021 by wufan
7 changed files
--- a/src/data-source/course/request-api.ts
+++ b/src/data-source/course/request-api.ts
 /*
 * @Author: wufan
 * @Date: 2020-12-12 11:57:10
- * @LastEditors: zangsuyun
+ * @LastEditors: wufan
- * @LastEditTime: 2021-03-22 13:54:20
+ * @LastEditTime: 2021-07-05 15:07:13
 * @Description: Description
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -73,6 +73,9 @@ export function editVideoSchedule(params: object) {
 export function userWatchInfo(params: object) {
  return Service.Hades("public/hades/userWatchInfo", params);
 }
+export function lineDetailWatchInfo(params: object) {
+  return Service.Hades("public/hades/lineDetailWatchInfo", params);
+}
 export function videoScheduleDetail(params: object) {
  return Service.Hades("public/hades/videoScheduleDetail", params);
 }

--- a/src/domains/course-domain/CourseService.ts
+++ b/src/domains/course-domain/CourseService.ts
@@ -9,7 +9,8 @@
 import {
  fetchLecturerData, getCategoryTree, knowledgeMediaCoursePage, fetchUserData, exportStudentCourseData, exportPlayBackCourseData, fetchPlaybackList, createLiveCloudCourse, getLiveCloudCoursePage,
  getLiveCloudCourseDetail, updateLiveCloudCourse, turnOnOrOffLiveCloudCourse, delLiveCloudCourse, changeVideoShelfState, createVideoSchedule, delVideoSchedule,
-  editVideoSchedule, userWatchInfo, videoSchedulePage, videoScheduleDetail, videoWatchInfo, getQrcode, getLiveCloudCourseBasePage, videoScheduleBasePage, relatedCourseToPlan
+  editVideoSchedule, userWatchInfo, videoSchedulePage, videoScheduleDetail, videoWatchInfo, getQrcode, getLiveCloudCourseBasePage, videoScheduleBasePage, relatedCourseToPlan,
+  lineDetailWatchInfo
 } from '@/data-source/course/request-api';
 export default class courseService {
@@ -85,6 +86,9 @@ export default class courseService {
  static videoWatchInfo(params: any) {
    return videoWatchInfo(params);
  }
+  static lineDetailWatchInfo(params: any) {
+    return lineDetailWatchInfo(params);
+  }
  static getLiveCloudCourseBasePage(params: any) {
    return getLiveCloudCourseBasePage(params);
  }

--- a/src/modules/course-manage/video-course/AddVideoCourse.jsx
+++ b/src/modules/course-manage/video-course/AddVideoCourse.jsx
@@ -2,7 +2,7 @@
 * @Author: 吴文洁
 * @Date: 2020-08-05 10:07:47
 * @LastEditors: wufan
- * @LastEditTime: 2021-07-05 10:24:25
+ * @LastEditTime: 2021-07-05 15:59:51
 * @Description: 线上课新增/编辑页
 * @Copyright: 杭州杰竞科技有限公司 版权所有
 */
@@ -327,7 +327,7 @@ class AddVideoCourse extends React.Component {
        videoDuration: videoDom.duration,
        id: resourceId,
        mediaUrl: ossUrl,
-        sort: courseChapterList.length
+        sort: _courseChapterList.length
      })
      this.setState({
@@ -436,7 +436,7 @@ class AddVideoCourse extends React.Component {
  submitRemote = ({ id, pageType, commonParams }) => {
    if (pageType === 'add') {
-      Service.Hades('public/hades/createMediaCourse', commonParams).then((res) => {
+      Service.Hades('public/hades/createVideoSchedule', commonParams).then((res) => {
        if (!res) return
        message.success('新建成功')
        window.RCHistory.push({
@@ -448,7 +448,7 @@ class AddVideoCourse extends React.Component {
        courseId: id,
        ...commonParams
      }
-      Service.Hades('public/hades/editMediaCourse', editParams).then((res) => {
+      Service.Hades('public/hades/editVideoSchedule', editParams).then((res) => {
        if (!res) return
        message.success('保存成功')
        window.RCHistory.push({

--- a/src/modules/course-manage/video-course/components/LearningDetailModal.jsx
+++ b/src/modules/course-manage/video-course/components/LearningDetailModal.jsx
+import User from "@/common/js/user";
 import CourseService from "@/domains/course-domain/CourseService";
 import React from "react";
-import './LearningDetailModal.less';
+import { Modal } from "antd";
+import "./LearningDetailModal.less";
 class LearningDetailModal extends React.Component {
-    constructor(props) {
+  constructor(props) {
-      super(props);
+    super(props);
-      this.state = {
+    this.state = {
-        data:[]
+      courseChapterList: [],
-      };
+    };
-    }
+  }
+  componentDidMount() {
+    this.handleFetchDataList();
+  }
+  // 获取观看视频数据列表
+  handleFetchDataList = () => {
+    const { courseId, data } = this.props;
+    const params = {
+      courseId,
+      storeId: User.getStoreId(),
+      storeCustomerId: data.storeCustomerId,
+    };
+    CourseService.lineDetailWatchInfo(params).then((res) => {
+      const { result = [] } = res;
+      this.setState({
+        courseChapterList: result
+      });
+    });
+  };
-    componentDidMount() {
+  render() {
-        this.handleFetchDataList();
+    const { title, onClose, onOk } = this.props;
-    }
+    const { courseChapterList } = this.state;
+    return (
-      // 获取观看视频数据列表
+      <div className="learning-detail-modal">
-      handleFetchDataList = () => {
+        <Modal
-        const { query, id } = this.state;
+          footer={null}
+          visible={true}
-        const params = {
+          title={title}
-          ...query,
+          width={680}
-          courseId: id,
+          maskClosable={false}
-          storeId: User.getStoreId(),
+          closeIcon={
-        };
+            <span className="icon iconfont modal-close-icon">&#xe6ef;</span>
-        CourseService.videoWatchInfo(params).then((res) => {
+          }
-          const { result = {} } = res;
+          onCancel={onClose}
-          const { records = [], total = 0 } = result;
+          onOk={onOk}
-          this.setState({
+        >
-            dataSource: records,
+          <div className="course-chapter__list">
-            totalCount: Number(total),
+            <If condition={courseChapterList.length > 0}>
-          });
+              {_.map(courseChapterList, (item, index) => {
-        });
+                return (
-      };
+                  <div className="course-wrap">
+                    <div className="course-ware" key={index}>
+                      <div className="course-ware__index">{`${
+                        index > 9 ? index + 1 : `0${index + 1}`
+                      } `}</div>
+                      <img
+                        className="course-ware__img"
+                        src="https://image.xiaomaiketang.com/xm/TKwbQGYDBR.png"
+                        alt=""
+                      />
+                      <div className="course-ware__name">{item.name}</div>
+                    </div>
+                    <div className={`progress ${item.progress === 100 ? 'finish' :''}`}>{`${item.progress === 100 ? '已完成' : `${item.progress}%`}`}</div>
-    }
+                  </div>
+                );
+              })}
+            </If>
+          </div>
+        </Modal>
+      </div>
+    );
+  }
+}
-    export default LearningDetailModal;
+export default LearningDetailModal;
\ No newline at end of file
--- a/src/modules/course-manage/video-course/components/LearningDetailModal.less
+++ b/src/modules/course-manage/video-course/components/LearningDetailModal.less
+.learning-detail-modal {
+  .course-chapter {
+    padding-top: 24px;
+    &__list {
+      .course-wrap {
+        display: flex;
+        justify-content: space-between;
+        .course-ware {
+          display: flex;
+          height: 20px;
+          font-size: 14px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #666666;
+          line-height: 20px;
+          margin-bottom: 28px;
+          cursor: pointer;
+          &:hover {
+            color: #2966ff;
+          }
+          &__index {
+            width: 20px;
+          }
+          &__img {
+            width: 20px;
+            height: 20px;
+            margin-left: 16px;
+            margin-right: 8px;
+          }
+          &__name {
+            width: 700px;
+          }
+        }
+        .progress {
+          &.finish {
+            color: RGBA(101, 202, 168, 1);
+          }
+        }
+      }
+    }
+  }
+}
--- a/src/modules/course-manage/video-course/components/VideoCourseList.jsx
+++ b/src/modules/course-manage/video-course/components/VideoCourseList.jsx
@@ -47,7 +47,7 @@ class VideoCourseList extends React.Component {
  handleShowWatchDataModal = (item) => {
    const { match } = this.props;
    window.RCHistory.push({
-      pathname: `${match.url}/course-data?courseName=${item.courseName}&id=${item.id}`
+      pathname: `${match.url}/course-data?courseName=${item.courseName}&courseId=${item.id}`
    })
  }

--- a/src/modules/course-manage/video-course/components/WatchData.jsx
+++ b/src/modules/course-manage/video-course/components/WatchData.jsx
@@ -13,12 +13,12 @@ const { Search } = Input;
 class WatchData extends React.Component {
  constructor(props) {
    super(props);
-    const id = window.getParameterByName("id");
+    const courseId = window.getParameterByName("courseId");
    const courseName = window.getParameterByName("courseName");
    this.state = {
      courseName,
-      id,
+      courseId,
      visible: true,
      dataSource: [],
      query: {
@@ -37,11 +37,11 @@ class WatchData extends React.Component {
  // 获取观看视频数据列表
  handleFetchDataList = () => {
-    const { query, id } = this.state;
+    const { query, courseId } = this.state;
    const params = {
      ...query,
-      courseId: id,
+      courseId: courseId,
      storeId: User.getStoreId(),
    };
    CourseService.videoWatchInfo(params).then((res) => {
@@ -124,11 +124,12 @@ class WatchData extends React.Component {
      <LearningDetailModal
        data={item}
        title="学习详情"
-        close={() => {
+        onClose={() => {
          this.setState({
-            learningDetailModal: null,
+            learningDetailModal: null
          });
        }}
+        courseId={this.state.courseId}
      />
    );
    this.setState({ learningDetailModal });
@@ -261,6 +262,7 @@ class WatchData extends React.Component {
            />
          </div>
        </div>
+        {this.state.learningDetailModal}
      </div>
    );
  }