Skip to content

X
xiaomai-cloud-class-web
Commit da9c44e2 by yuananting
Options

fix:解决合并课程改造分支的冲突

parents 806f97d6 bfb8d3c0
Showing with 1674 additions and 969 deletions
src/bu-components/PreviewCourseModal.less
...@@ -13,8 +13,9 @@ ...@@ -13,8 +13,9 @@
} }
.container { .container {
overflow: scroll; overflow-y: auto;
height: 100%;; overflow-x: hidden;
height: 100%;
.course-cover, .course-url { .course-cover, .course-url {
width: 100%; width: 100%;
......
src/common/constants/academic/lessonEnum.js
...@@ -133,12 +133,13 @@ const FileTypeIcon = { ...@@ -133,12 +133,13 @@ const FileTypeIcon = {
PPTX: "https://image.xiaomaiketang.com/xm/847pFAdYGW.png", PPTX: "https://image.xiaomaiketang.com/xm/847pFAdYGW.png",
PDF: "https://image.xiaomaiketang.com/xm/rrEJMNkhTG.png", PDF: "https://image.xiaomaiketang.com/xm/rrEJMNkhTG.png",
MP3: "https://image.xiaomaiketang.com/xm/ykjnSWDyQ6.png", MP3: "https://image.xiaomaiketang.com/xm/ykjnSWDyQ6.png",
MP4: "https://image.xiaomaiketang.com/xm/whSYMTdR57.png", MP4: "https://image.xiaomaiketang.com/xm/TKwbQGYDBR.png",
JPG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png", JPG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
JPEG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png", JPEG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
PNG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png", PNG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
GIF: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png", GIF: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
BMP: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png", BMP: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
VIDEO: "https://image.xiaomaiketang.com/xm/TKwbQGYDBR.png"
}; };
const UploadIcon = "https://image.xiaomaiketang.com/xm/4DXNrZWWsd.png"; const UploadIcon = "https://image.xiaomaiketang.com/xm/4DXNrZWWsd.png";
......
src/components/ContactWidget.less
.ant-popover .ant-popover-content .ant-popover-inner { .contact-widget-popover .ant-popover-content .ant-popover-inner {
box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.06); box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.06);
.ant-popover-inner-content { .ant-popover-inner-content {
padding: 0; padding: 0;
......
src/components/ContactWidget.tsx
...@@ -27,6 +27,7 @@ function Content() { ...@@ -27,6 +27,7 @@ function Content() {
export default function ContactWidget(props:ContactWidgetProps) { export default function ContactWidget(props:ContactWidgetProps) {
return <Popover return <Popover
className="contact-widget-popover"
placement={props.placement} placement={props.placement}
arrowPointAtCenter arrowPointAtCenter
content={Content} content={Content}
......
src/core/function.js
...@@ -1156,3 +1156,15 @@ window.XMShowClassName = (date, itemName) => { ...@@ -1156,3 +1156,15 @@ window.XMShowClassName = (date, itemName) => {
} }
return 'new-icon' return 'new-icon'
} }
// 格式化时间段为时分
window.formatDuration = function (time) {
const diff = Math.floor(time % 3600);
let hours = Math.floor(time / 3600);
let mins = Math.floor(diff / 60);
let seconds = Math.floor(time % 60);
hours = hours < 10 ? ("0" + hours) : hours;
mins = mins < 10 ? ("0" + mins) : mins;
seconds = seconds < 10 ? ("0" + seconds) : seconds;
return hours + ":" + mins + ":" + seconds;
};
\ No newline at end of file
src/data-source/aidTool/request-apis.ts
/* /*
* @Author: yuananting * @Author: yuananting
* @Date: 2021-03-03 15:13:12 * @Date: 2021-03-03 15:13:12
* @LastEditors: Please set LastEditors * @LastEditors: yuananting
* @LastEditTime: 2021-06-22 14:31:46 * @LastEditTime: 2021-07-09 16:58:34
* @Description: 助学工具接口 * @Description: 助学工具接口
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -88,3 +88,7 @@ export function batchQueryQuestionDetails(params: object) { ...@@ -88,3 +88,7 @@ export function batchQueryQuestionDetails(params: object) {
export function queryQuestionPageListWithContent(params: object) { export function queryQuestionPageListWithContent(params: object) {
return Service.Hades('public/hades/queryQuestionPageListWithContent', params); return Service.Hades('public/hades/queryQuestionPageListWithContent', params);
} }
export function queryCategoryTreeByPackage(params: object) {
return Service.Hades('public/externalHades/queryPackageCategory', params);
}
\ No newline at end of file
src/data-source/course/request-api.ts
/* /*
* @Author: wufan * @Author: wufan
* @Date: 2020-12-12 11:57:10 * @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 * @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -57,7 +57,7 @@ export function getLiveCloudCourseBasePage(params: object) { ...@@ -57,7 +57,7 @@ export function getLiveCloudCourseBasePage(params: object) {
return Service.Hades("public/courseCloud/getLiveCloudCourseBasePage", params); return Service.Hades("public/courseCloud/getLiveCloudCourseBasePage", params);
} }
//视频课相关接口 //线上课相关接口
export function changeVideoShelfState(params: object) { export function changeVideoShelfState(params: object) {
return Service.Hades("public/hades/changeVideoShelfState", params); return Service.Hades("public/hades/changeVideoShelfState", params);
} }
...@@ -73,6 +73,9 @@ export function editVideoSchedule(params: object) { ...@@ -73,6 +73,9 @@ export function editVideoSchedule(params: object) {
export function userWatchInfo(params: object) { export function userWatchInfo(params: object) {
return Service.Hades("public/hades/userWatchInfo", params); return Service.Hades("public/hades/userWatchInfo", params);
} }
export function lineDetailWatchInfo(params: object) {
return Service.Hades("public/hades/lineDetailWatchInfo", params);
}
export function videoScheduleDetail(params: object) { export function videoScheduleDetail(params: object) {
return Service.Hades("public/hades/videoScheduleDetail", params); return Service.Hades("public/hades/videoScheduleDetail", params);
} }
......
src/data-source/knowledge/request-api.ts
...@@ -81,7 +81,7 @@ class KnowledgeAPI { ...@@ -81,7 +81,7 @@ class KnowledgeAPI {
exportPicLearnSync = (params: object) => { exportPicLearnSync = (params: object) => {
return Service.Hades("public/knowledge/exportPicLearnSync", params); return Service.Hades("public/knowledge/exportPicLearnSync", params);
} }
// 视频课观看记录导出 // 线上课观看记录导出
exportVideoLearnSync = (params: object) => { exportVideoLearnSync = (params: object) => {
return Service.Hades("public/knowledge/exportVideoLearnSync", params); return Service.Hades("public/knowledge/exportVideoLearnSync", params);
} }
......
src/data-source/plan/request-apis.ts
/* /*
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-21 16:08:38 * @Date: 2021-02-21 16:08:38
* @LastEditors: zhangleyuan * @LastEditors: yuananting
* @LastEditTime: 2021-03-09 12:54:31 * @LastEditTime: 2021-07-06 11:26:27
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
import Service from "@/common/js/service"; import Service from '@/common/js/service';
export function getTrainingPlanPage(params: object) { export function getTrainingPlanPage(params: object) {
return Service.Hades("public/hades/getTrainingPlanPage", params); return Service.Hades('public/hades/getTrainingPlanPage', params);
} }
export function createTrainingPlan(params: object) { export function createTrainingPlan(params: object) {
return Service.Hades("public/hades/createTrainingPlan", params); return Service.Hades('public/hades/createTrainingPlan', params);
} }
export function updateStateTrainingPlan(params: object) { export function updateStateTrainingPlan(params: object) {
return Service.Hades("public/hades/updateStateTrainingPlan", params); return Service.Hades('public/hades/updateStateTrainingPlan', params);
} }
export function getTrainingPlanDetail(params: object) { export function getTrainingPlanDetail(params: object) {
return Service.Hades("public/hades/getTrainingPlanDetail", params); return Service.Hades('public/hades/getTrainingPlanDetail', params);
} }
export function updateTrainingPlan(params: object) { export function updateTrainingPlan(params: object) {
return Service.Hades("public/hades/updateTrainingPlan", params); return Service.Hades('public/hades/updateTrainingPlan', params);
} }
export function deleteTrainingPlan(params: object) { export function deleteTrainingPlan(params: object) {
return Service.Hades("public/hades/deleteTrainingPlan", params); return Service.Hades('public/hades/deleteTrainingPlan', params);
} }
export function getPlanUserRecordPage(params: object) { export function getPlanUserRecordPage(params: object) {
return Service.Hades("public/hades/getPlanUserRecordPage", params); return Service.Hades('public/hades/getPlanUserRecordPage', params);
} }
export function getPlanCustomerRecordPage(params: object) { export function getPlanCustomerRecordPage(params: object) {
return Service.Hades("public/hades/getPlanCustomerRecordPage", params); return Service.Hades('public/hades/getPlanCustomerRecordPage', params);
} }
export function getPlanCustomerDetail(params: object) { export function getPlanCustomerDetail(params: object) {
return Service.Hades("public/hades/getPlanCustomerDetail", params); return Service.Hades('public/customerHades/getPlanCustomerDetail', params);
} }
export function getPlanCustomerAboutUser(params: object) { export function getPlanCustomerAboutUser(params: object) {
return Service.Hades("public/hades/getPlanCustomerAboutUser", params); return Service.Hades('public/hades/getPlanCustomerAboutUser', params);
} }
export function removePlanCustomer(params: object) { export function removePlanCustomer(params: object) {
return Service.Hades("public/hades/removePlanCustomer", params); return Service.Hades('public/hades/removePlanCustomer', params);
} }
export function getStorePlanAll(params: object) { export function getStorePlanAll(params: object) {
return Service.Hades("public/hades/getStorePlanAll", params); return Service.Hades('public/hades/getStorePlanAll', params);
} }
export function getTrainingCourseAutoCancel(params: object) { export function getTrainingCourseAutoCancel(params: object) {
return Service.Hades("public/hades/getTrainingCourseAutoCancel", params); return Service.Hades('public/hades/getTrainingCourseAutoCancel', params);
} }
src/domains/aid-tool-domain/AidToolService.ts
/* /*
* @Author: yuananting * @Author: yuananting
* @Date: 2021-03-11 11:34:37 * @Date: 2021-03-11 11:34:37
* @LastEditors: fusanqiasng * @LastEditors: yuananting
* @LastEditTime: 2021-06-16 09:56:46 * @LastEditTime: 2021-07-09 16:54:54
* @Description: 助学工具接口 * @Description: 助学工具接口
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
import { import {
queryExternalCategoryTree, queryExternalCategoryTree,
queryCategoryTreeByPackage,
queryCategoryTree, queryCategoryTree,
addCategory, addCategory,
delCategory, delCategory,
...@@ -38,6 +39,11 @@ export default class AidToolService { ...@@ -38,6 +39,11 @@ export default class AidToolService {
return queryExternalCategoryTree(parmas); return queryExternalCategoryTree(parmas);
} }
// 课程分类树（按课程包）
static queryCategoryTreeByPackage(params: any) {
return queryCategoryTreeByPackage(params);
}
// 获取题目分类树 // 获取题目分类树
static queryCategoryTree(params: any) { static queryCategoryTree(params: any) {
return queryCategoryTree(params); return queryCategoryTree(params);
......
src/domains/course-domain/CourseService.ts
...@@ -9,7 +9,8 @@ ...@@ -9,7 +9,8 @@
import { import {
fetchLecturerData, getCategoryTree, knowledgeMediaCoursePage, fetchUserData, exportStudentCourseData, exportPlayBackCourseData, fetchPlaybackList, createLiveCloudCourse, getLiveCloudCoursePage, fetchLecturerData, getCategoryTree, knowledgeMediaCoursePage, fetchUserData, exportStudentCourseData, exportPlayBackCourseData, fetchPlaybackList, createLiveCloudCourse, getLiveCloudCoursePage,
getLiveCloudCourseDetail, updateLiveCloudCourse, turnOnOrOffLiveCloudCourse, delLiveCloudCourse, changeVideoShelfState, createVideoSchedule, delVideoSchedule, 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'; } from '@/data-source/course/request-api';
export default class courseService { export default class courseService {
...@@ -85,6 +86,9 @@ export default class courseService { ...@@ -85,6 +86,9 @@ export default class courseService {
static videoWatchInfo(params: any) { static videoWatchInfo(params: any) {
return videoWatchInfo(params); return videoWatchInfo(params);
} }
static lineDetailWatchInfo(params: any) {
return lineDetailWatchInfo(params);
}
static getLiveCloudCourseBasePage(params: any) { static getLiveCloudCourseBasePage(params: any) {
return getLiveCloudCourseBasePage(params); return getLiveCloudCourseBasePage(params);
} }
......
src/index.html
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
/> />
<meta <meta
name="keywords" name="keywords"
content="小麦企学院,企业培训,员工培训,企业大学,企业内训,企业外训,培训计划,培训素材,企培,企训,资料云盘,培训课程,培训任务,直播课,视频课,图文课,线下课,知识库,作业,考试,排行榜,培训类别管理,定制培训计划,管理数据,学习数据,企学院,资料共享,培训数字化,数字化培训,培训工具,在线培训,线上培训,培训saas,培训管理,企业微信培训,对客培训,客户培训,直播培训,互联网培训,新员工培训,管理培训,管理者培训,工人培训,制造业培训,餐饮培训,服务业培训,零售培训,门店培训,工厂培训,车间培训,培训补贴,人事培训,财务培训,职场培训,企业学院平台,教育企业学院,教育企业平台,教育平台学院,企业学习,酷学院,小鹅通,企业学院,云学堂,时代光华,云课堂,魔学院,云大学,米知云,授课学堂" content="小麦企学院,企业培训,员工培训,企业大学,企业内训,企业外训,培训计划,培训素材,企培,企训,资料云盘,培训课程,培训任务,直播课,线上课,图文课,线下课,知识库,作业,考试,排行榜,培训类别管理,定制培训计划,管理数据,学习数据,企学院,资料共享,培训数字化,数字化培训,培训工具,在线培训,线上培训,培训saas,培训管理,企业微信培训,对客培训,客户培训,直播培训,互联网培训,新员工培训,管理培训,管理者培训,工人培训,制造业培训,餐饮培训,服务业培训,零售培训,门店培训,工厂培训,车间培训,培训补贴,人事培训,财务培训,职场培训,企业学院平台,教育企业学院,教育企业平台,教育平台学院,企业学习,酷学院,小鹅通,企业学院,云学堂,时代光华,云课堂,魔学院,云大学,米知云,授课学堂"
/> />
<!-- <link rel="apple-touch-icon" href="../src/common/images/logo.png" /> --> <!-- <link rel="apple-touch-icon" href="../src/common/images/logo.png" /> -->
<link rel="shortcut icon" href="https://image.xiaomaiketang.com/xm/c4KiP2epBP.png" /> <link rel="shortcut icon" href="https://image.xiaomaiketang.com/xm/c4KiP2epBP.png" />
......
src/modules/course-manage/components/AddLiveBasic.less
...@@ -2,41 +2,25 @@ ...@@ -2,41 +2,25 @@
.label { .label {
width: 100px; width: 100px;
text-align: right; text-align: right;
display:inline-block; display: inline-block;
.require { .require {
color: #EC4B35; color: #ec4b35;
} }
} }
.course-cover { .course-cover {
margin-left: 14px; margin-left: 14px;
display: flex; display: flex;
margin-top: 16px; margin-top: 24px;
&__wrap { &__wrap {
position: relative; position: relative;
.tag {
border-radius: 2px;
background: #D6D6D6;
font-size: 12px;
height: 18px;
width: 52px;
text-align: center;
color: #FFF;
position: absolute;
top: 8px;
left: 8px;
}
}
.course-cover__wrap {
display: flex;
flex-direction: row;
}
.img-content { .img-content {
margin-top: 8px;
margin-right: 20px; margin-right: 20px;
width: 299px; width: 299px;
height: 169px; height: 169px;
position: relative;
img { img {
width: 100%; width: 100%;
...@@ -44,17 +28,28 @@ ...@@ -44,17 +28,28 @@
object-fit: contain; object-fit: contain;
border-radius: 4px; border-radius: 4px;
} }
.tag {
border-radius: 2px;
background: #d6d6d6;
font-size: 12px;
height: 18px;
width: 52px;
text-align: center;
color: #fff;
position: absolute;
top: 8px;
left: 8px;
}
} }
.opt-btns { .opt-btns {
.default-btn { .default-btn {
margin-left: 16px; margin-left: 14px;
color: #2966FF; color: #2966ff;
cursor: pointer; cursor: pointer;
&.disabled { &.disabled {
color: #CCC; color: #ccc;
cursor: not-allowed; cursor: not-allowed;
} }
} }
...@@ -62,21 +57,21 @@ ...@@ -62,21 +57,21 @@
.ant-upload-list { .ant-upload-list {
display: none; display: none;
} }
}
.tips { .tips {
margin-top: 8px; margin-top: 8px;
color: #999; color: #999;
} }
} }
.course-catalog{
margin:20px 0 0 14px;
} }
}
.course-catalog {
margin: 20px 0 0 14px;
}
} }
.ant-cascader-menu-item-active:not(.ant-cascader-menu-item-disabled){ .ant-cascader-menu-item-active:not(.ant-cascader-menu-item-disabled) {
font-weight:normal !important; font-weight: normal !important;
color:#2966FF !important; color: #2966ff !important;
} }
#imgCutModalNew { #imgCutModalNew {
width: 500px; width: 500px;
......
src/modules/course-manage/components/GraphicsEditor.less
.graphics-editor-container { .graphics-editor-container {
border: 1px solid #E8E8E8; border: 1px solid #e8e8e8;
border-radius: 4px; border-radius: 4px;
width: 702px; width: 702px;
height: 510px; height: 510px;
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
.w-e-toolbar { .w-e-toolbar {
background-color: #fff !important; background-color: #fff !important;
border: none !important; border: none !important;
border-bottom: 1px solid #E8E8E8 !important; border-bottom: 1px solid #e8e8e8 !important;
} }
.w-e-text-container { .w-e-text-container {
...@@ -38,19 +38,26 @@ ...@@ -38,19 +38,26 @@
color: #666; color: #666;
z-index: 1; z-index: 1;
} }
.editor-warning {
position: absolute;
right: 0;
color: red;
}
.w-e-full-screen-editor { .w-e-full-screen-editor {
.w-e-text-container { .w-e-text-container {
height: ~'calc(100vh - 109px)' !important; height: ~'calc(100vh - 109px)' !important;
} }
} }
&.introduce { &.introduce {
height: 200px; height: 240px;
.w-e-text-container { .w-e-text-container {
height: ~'calc(100% - 69px)' !important; height: ~'calc(100% - 69px)' !important;
} }
} }
&.warning{ &.warning {
border-color: red; border-color: red;
} }
} }
src/modules/course-manage/graphics-course/AddGraphicsCourse.jsx
...@@ -27,6 +27,7 @@ import _ from 'underscore'; ...@@ -27,6 +27,7 @@ import _ from 'underscore';
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import ImgClipModal from '@/components/ImgClipModal' import ImgClipModal from '@/components/ImgClipModal'
import './AddGraphicsCourse.less'; import './AddGraphicsCourse.less';
import Bus from '@/core/bus';
const EDIT_BOX_KEY = Math.random(); const EDIT_BOX_KEY = Math.random();
const fieldNames = { label: 'categoryName', value: 'id', children: 'sonCategoryList' }; const fieldNames = { label: 'categoryName', value: 'id', children: 'sonCategoryList' };
...@@ -34,7 +35,7 @@ const fieldNames = { label: 'categoryName', value: 'id', children: 'sonCategoryL ...@@ -34,7 +35,7 @@ const fieldNames = { label: 'categoryName', value: 'id', children: 'sonCategoryL
//添加课程时课程默认的一些值 //添加课程时课程默认的一些值
const defaultShelfState = 'YES'; const defaultShelfState = 'YES';
const whetherVisitorsJoin = 'NO'; const whetherVisitorsJoin = 'NO';
const defaultCoverUrl = 'https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png'; const defaultCover = 'https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png';
let cutFlag = false; let cutFlag = false;
class AddGraphicsCourse extends React.Component { class AddGraphicsCourse extends React.Component {
...@@ -53,7 +54,7 @@ class AddGraphicsCourse extends React.Component { ...@@ -53,7 +54,7 @@ class AddGraphicsCourse extends React.Component {
introduce: '', introduce: '',
courseMediaId: null, // 图文课链接 courseMediaId: null, // 图文课链接
coverId: null, // 图文封面的recourceId coverId: null, // 图文封面的recourceId
coverUrl: defaultCoverUrl, // 图文课封面 coverUrl: defaultCover, // 图文课封面
studentList: [], // 上课学员列表 studentList: [], // 上课学员列表
shelfState: 'YES', //是否开启学院展示 shelfState: 'YES', //是否开启学院展示
selectedFileList: [], // 已经从资料云盘中勾选的文件 selectedFileList: [], // 已经从资料云盘中勾选的文件
...@@ -73,6 +74,11 @@ class AddGraphicsCourse extends React.Component { ...@@ -73,6 +74,11 @@ class AddGraphicsCourse extends React.Component {
if (pageType === 'edit') { if (pageType === 'edit') {
this.handleFetchScheudleDetail(id); this.handleFetchScheudleDetail(id);
} }
Bus.bind('editorLimit', (editorTextLength, editorType) => {
this.setState({
[editorType]: editorTextLength,
});
});
} }
initBus = () => { initBus = () => {
...@@ -314,11 +320,11 @@ class AddGraphicsCourse extends React.Component { ...@@ -314,11 +320,11 @@ class AddGraphicsCourse extends React.Component {
//过期判断 //过期判断
if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) { if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) {
Modal.warning({ Modal.warning({
title:"服务已到期", title: '服务已到期',
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买", content: '当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买',
okText: "我知道了" okText: '我知道了',
}) });
return return;
} }
const { id, coverId, pageType, courseName, courseMedia, introduce, categoryId, shelfState, whetherVisitorsJoin } = this.state; const { id, coverId, pageType, courseName, courseMedia, introduce, categoryId, shelfState, whetherVisitorsJoin } = this.state;
...@@ -387,6 +393,7 @@ class AddGraphicsCourse extends React.Component { ...@@ -387,6 +393,7 @@ class AddGraphicsCourse extends React.Component {
}; };
handleValidate = (courseName, courseMedia, categoryId) => { handleValidate = (courseName, courseMedia, categoryId) => {
const { graphicsCourseIntor, graphicsCourseContent } = this.state;
return new Promise((resolve) => { return new Promise((resolve) => {
if (!courseName) { if (!courseName) {
message.warning('请输入课程名称'); message.warning('请输入课程名称');
...@@ -403,6 +410,18 @@ class AddGraphicsCourse extends React.Component { ...@@ -403,6 +410,18 @@ class AddGraphicsCourse extends React.Component {
resolve(false); resolve(false);
return false; return false;
} }
if (graphicsCourseContent > 1000) {
message.warning('课程内容超过字数限定');
resolve(false);
return;
}
if (graphicsCourseIntor > 1000) {
message.warning('课程简介超过字数限定');
resolve(false);
return;
}
// const textMedia = scheduleMedia.filter((item) => item.mediaType === 'TEXT'); // const textMedia = scheduleMedia.filter((item) => item.mediaType === 'TEXT');
// for (let i = 0, len = textMedia.length; i < len; i++) { // for (let i = 0, len = textMedia.length; i < len; i++) {
// if (textMedia[i].mediaContentLength && textMedia[i].mediaContentLength.length > 1000) { // if (textMedia[i].mediaContentLength && textMedia[i].mediaContentLength.length > 1000) {
...@@ -415,6 +434,17 @@ class AddGraphicsCourse extends React.Component { ...@@ -415,6 +434,17 @@ class AddGraphicsCourse extends React.Component {
}); });
}; };
// 使用默认封面图
handleResetCoverUrl = () => {
const { coverUrl } = this.state;
const isDefaultCover = coverUrl === defaultCover;
// 如果已经是默认图的话，不做任何任何处理
if (isDefaultCover) return;
this.setState({ coverUrl: defaultCover, coverId: null }, () => {
message.success('已替换为默认图');
});
};
render() { render() {
const { const {
id, id,
...@@ -442,6 +472,8 @@ class AddGraphicsCourse extends React.Component { ...@@ -442,6 +472,8 @@ class AddGraphicsCourse extends React.Component {
const hasSelectedStu = studentList.length; const hasSelectedStu = studentList.length;
const courseWareIcon = FileVerifyMap[videoType] ? FileTypeIcon[FileVerifyMap[videoType].type] : FileTypeIcon[videoType]; const courseWareIcon = FileVerifyMap[videoType] ? FileTypeIcon[FileVerifyMap[videoType].type] : FileTypeIcon[videoType];
// 当前是否使用的是默认图片
const isDefaultCover = coverUrl === defaultCover;
return ( return (
<div className='page add-graphics-course-page'> <div className='page add-graphics-course-page'>
...@@ -468,19 +500,39 @@ class AddGraphicsCourse extends React.Component { ...@@ -468,19 +500,39 @@ class AddGraphicsCourse extends React.Component {
<div className='cover-url flex mt16'> <div className='cover-url flex mt16'>
<div className='label'>封面图：</div> <div className='label'>封面图：</div>
<div className='cover-url__wrap'> {/* <div className='cover-url__wrap'>
<div className='opt-btns'>
<Button
onClick={() => {
this.setState({
showSelectCoverModal: true,
});
}}>{`${pageType === 'add' && !coverUrl ? '上传' : '修改'}封面`}</Button>
<div className='tips'></div>
</div>
<div className='img-content'> <div className='img-content'>
<img src={coverUrl} /> <img src={coverUrl} />
</div> </div>
</div> */}
<div className='course-cover__wrap'>
<div className='opt-btns'> <div className='opt-btns'>
<Button <Button
onClick={() => { onClick={() => {
this.setState({ this.setState({
showSelectCoverModal: true, showSelectCoverModal: true,
}); });
}}>{`${pageType === 'add' && !coverUrl ? '上传' : '修改'}封面`}</Button> }}>
上传图片
</Button>
<span className={`default-btn ${isDefaultCover ? 'disabled' : ''}`} onClick={this.handleResetCoverUrl}>
使用默认图
</span>
<div className='tips'>建议尺寸1280*720px或16:9。封面图最大5M，支持jpg、jpeg和png。</div> <div className='tips'>建议尺寸1280*720px或16:9。封面图最大5M，支持jpg、jpeg和png。</div>
</div> </div>
<div className='img-content'>
{isDefaultCover && <span className='tag'>默认图</span>}
<img src={coverUrl} />
</div>
</div> </div>
</div> </div>
<div className='course-catalog required'> <div className='course-catalog required'>
......
src/modules/course-manage/graphics-course/AddGraphicsCourse.less
.add-graphics-course-page { .add-graphics-course-page {
position:relative !important; position: relative !important;
.box{ .box {
margin-bottom:52px !important; margin-bottom: 52px !important;
} }
.ant-radio-group { .ant-radio-group {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.radio-item { .radio-item {
margin-bottom: 12px; margin-bottom: 12px;
...@@ -28,10 +27,10 @@ ...@@ -28,10 +27,10 @@
.form { .form {
margin-top: 16px; margin-top: 16px;
padding: 0 16px; padding: 0 16px;
.label{ .label {
display:inline-block; display: inline-block;
text-align:right; text-align: right;
width:85px; width: 85px;
} }
.required { .required {
position: relative; position: relative;
...@@ -48,9 +47,9 @@ ...@@ -48,9 +47,9 @@
top: 0; top: 0;
} }
} }
.course-catalog{ .course-catalog {
margin-bottom:16px; margin-bottom: 16px;
margin-top:16px; margin-top: 16px;
} }
.course-ware { .course-ware {
display: flex; display: flex;
...@@ -71,10 +70,20 @@ ...@@ -71,10 +70,20 @@
display: flex; display: flex;
} }
.cover-url__wrap { .course-cover {
margin-left: 14px;
display: flex;
margin-top: 24px;
&__wrap {
position: relative;
.img-content { .img-content {
width: 298px; margin-top: 8px;
height: 172px; margin-right: 20px;
width: 299px;
height: 169px;
position: relative;
img { img {
width: 100%; width: 100%;
...@@ -82,29 +91,78 @@ ...@@ -82,29 +91,78 @@
object-fit: contain; object-fit: contain;
border-radius: 4px; border-radius: 4px;
} }
} .tag {
.empty-img { border-radius: 2px;
width: 298px; background: #d6d6d6;
height: 172px; font-size: 12px;
border: 1px dashed #EBEBEB; height: 18px;
border-radius: 4px; width: 52px;
padding: 12px;
color: #999;
padding: 52px 24px;
text-align: center; text-align: center;
color: #fff;
position: absolute;
top: 8px;
left: 8px;
}
} }
.opt-btns { .opt-btns {
margin-top: 8px; .default-btn {
display: flex; margin-left: 14px;
align-items: center; color: #2966ff;
cursor: pointer;
&.disabled {
color: #ccc;
cursor: not-allowed;
}
}
.ant-upload-list {
display: none;
}
.tips { .tips {
margin-left: 12px; margin-top: 8px;
color: #999; color: #999;
} }
} }
} }
}
// .cover-url__wrap {
// .img-content {
// width: 298px;
// height: 172px;
// img {
// width: 100%;
// height: 100%;
// object-fit: contain;
// border-radius: 4px;
// }
// }
// .empty-img {
// width: 298px;
// height: 172px;
// border: 1px dashed #EBEBEB;
// border-radius: 4px;
// padding: 12px;
// color: #999;
// padding: 52px 24px;
// text-align: center;
// }
// .opt-btns {
// margin-top: 8px;
// display: flex;
// align-items: center;
// .tips {
// margin-left: 12px;
// color: #999;
// }
// }
// }
.select-student { .select-student {
align-items: center; align-items: center;
...@@ -139,7 +197,7 @@ ...@@ -139,7 +197,7 @@
justify-content: flex-end; justify-content: flex-end;
padding-right: 72px; padding-right: 72px;
background: #fff; background: #fff;
border-top: 1px solid #E8E8E8; border-top: 1px solid #e8e8e8;
z-index: 999; z-index: 999;
.ant-btn { .ant-btn {
margin-left: 10px; margin-left: 10px;
......
src/modules/course-manage/graphics-course/components/AddGraphicsIntro.jsx
...@@ -17,17 +17,15 @@ import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepare ...@@ -17,17 +17,15 @@ import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepare
import { DISK_MAP } from '@/common/constants/academic/lessonEnum'; import { DISK_MAP } from '@/common/constants/academic/lessonEnum';
import { ImgCutModalNew } from '@/components'; import { ImgCutModalNew } from '@/components';
const { TextArea } = Input; const { TextArea } = Input;
class AddGraphicsIntro extends React.Component { class AddGraphicsIntro extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
showSelectFileModal: false, showSelectFileModal: false,
diskList: [], diskList: [],
selectType: null, selectType: null,
} };
} }
// 上传封面图 // 上传封面图
...@@ -38,34 +36,34 @@ class AddGraphicsIntro extends React.Component { ...@@ -38,34 +36,34 @@ class AddGraphicsIntro extends React.Component {
imageFile, imageFile,
showCutModal: true, showCutModal: true,
}); });
} };
// 选择暖场资源 // 选择暖场资源
handleSelectVideo = (file) => { handleSelectVideo = (file) => {
const { selectType } = this.state; const { selectType } = this.state;
this.setState({ this.setState({
showSelectFileModal: false showSelectFileModal: false,
}) });
const { ossUrl, resourceId, folderName, folderFormat, folderSize } = file; const { ossUrl, resourceId, folderName, folderFormat, folderSize } = file;
if(selectType === 'WARMUP'){ if (selectType === 'WARMUP') {
const liveCourseWarmMedia = { const liveCourseWarmMedia = {
contentType: 'WARMUP', contentType: 'WARMUP',
mediaType: folderFormat === 'MP4' ? 'VIDEO' : 'PICTURE', mediaType: folderFormat === 'MP4' ? 'VIDEO' : 'PICTURE',
mediaContent: resourceId, mediaContent: resourceId,
mediaUrl: ossUrl, mediaUrl: ossUrl,
mediaName: folderName, mediaName: folderName,
size: folderSize size: folderSize,
} };
this.props.onChange('liveCourseWarmMedia', liveCourseWarmMedia); this.props.onChange('liveCourseWarmMedia', liveCourseWarmMedia);
}else{ } else {
// 最多添加九图片 // 最多添加九图片
const { liveCourseMediaRequests } = this.props.data; const { liveCourseMediaRequests } = this.props.data;
const list = _.filter(liveCourseMediaRequests, (item) => { const list = _.filter(liveCourseMediaRequests, (item) => {
return item.mediaType == "PICTURE"; return item.mediaType == 'PICTURE';
}); });
if (list.length > 8) { if (list.length > 8) {
message.warning("最多添加9张图片"); message.warning('最多添加9张图片');
return; return;
} }
liveCourseMediaRequests.push({ liveCourseMediaRequests.push({
...@@ -78,121 +76,116 @@ class AddGraphicsIntro extends React.Component { ...@@ -78,121 +76,116 @@ class AddGraphicsIntro extends React.Component {
}); });
this.props.onChange('liveCourseMediaRequests', liveCourseMediaRequests); this.props.onChange('liveCourseMediaRequests', liveCourseMediaRequests);
} }
};
}
changeDetail = (value) => { changeDetail = (value) => {
this.props.onChange('courseMedia', value); this.props.onChange('courseMedia', value);
} };
changeIntro = (value) => { changeIntro = (value) => {
this.props.onChange('introduce', value); this.props.onChange('introduce', value);
} };
whetherVisitorsJoinChange = ()=>{ whetherVisitorsJoinChange = () => {
if(this.props.data.whetherVisitorsJoin==="NO"){ if (this.props.data.whetherVisitorsJoin === 'NO') {
this.props.onChange('whetherVisitorsJoin','YES') this.props.onChange('whetherVisitorsJoin', 'YES');
}else{ } else {
this.props.onChange('whetherVisitorsJoin','NO') this.props.onChange('whetherVisitorsJoin', 'NO');
}
} }
};
shelfStateChange = ()=>{ shelfStateChange = () => {
if(this.props.data.shelfState==="NO"){ if (this.props.data.shelfState === 'NO') {
this.props.onChange('shelfState','YES') this.props.onChange('shelfState', 'YES');
}else{ } else {
this.props.onChange('shelfState','NO') this.props.onChange('shelfState', 'NO');
}
} }
};
render() { render() {
const {data: { id, whetherVisitorsJoin, courseMedia, introduce, shelfState, loadcourseMedia, loadintroduce } } = this.props; const {
data: { id, whetherVisitorsJoin, courseMedia, introduce, shelfState, loadcourseMedia, loadintroduce },
} = this.props;
const { showSelectFileModal, selectType } = this.state; const { showSelectFileModal, selectType } = this.state;
return ( return (
<div className="add-video__intro-info"> <div className='add-graphic__intro-info'>
<div className="allow-tourist-join"> <div className='allow-tourist-join'>
<span className="label">观看设置：</span> <span className='label'>观看设置：</span>
<div className="content"> <div className='content'>
<div> <Switch checked={whetherVisitorsJoin === 'NO' ? true : false} onChange={this.whetherVisitorsJoinChange} />
<Switch checked={whetherVisitorsJoin==="YES"? true:false} onChange={this.whetherVisitorsJoinChange}/> <div className='desc'>{whetherVisitorsJoin === 'NO' ? '已开启，学员需绑定手机号才可观看' : '已关闭，学员无需绑定手机号即可观看'}</div>
</div> </div>
<div> </div>
<div className="desc"> <div className='store-show'>
<div>开启：允许未绑定手机号的学员观看</div> <span className='label'>学院展示：</span>
<div>关闭：仅限绑定了手机号的学员可以进入观看图文课</div> <div className='content'>
</div> <Switch checked={shelfState === 'YES' ? true : false} onChange={this.shelfStateChange} />
</div> <div className='desc'>{shelfState === 'YES' ? '已开启，课程将在该学院的学员课程列表中显示' : '已关闭，课程将在该学院的学员课程列表中隐藏'}</div>
</div> </div>
</div> </div>
<div className="store-show"> <div className='introduce required'>
<span className="label">学院展示：</span> <span className='label' style={{ marginTop: 5 }}>
<div className="content"> 课程内容：
<Row> </span>
<Col span={3}> <div className='content'>
<Switch checked={shelfState==="YES"? true:false} onChange={this.shelfStateChange}/> <div className='intro-list'>
</Col> <div className='intro-list__item content-editor'>
<Col span={21}> {(!id || loadcourseMedia) && (
<div className="desc">
<div>开启：图文课将在学员学院图文课列表中展示</div>
<div>关闭：图文课将在学员学院图文课列表中隐藏</div>
</div>
</Col>
</Row>
</div>
</div>
<div className="introduce required">
<span className="label" style={{ marginTop: 5 }}>课程内容：</span>
<div className="content">
<div className="intro-list">
<div className="intro-list__item content-editor">
{(!id || loadcourseMedia) &&
<GraphicsEditor <GraphicsEditor
id="content" id='content'
maxLimit={1000}
editorType={'graphicsCourseContent'}
detail={{ detail={{
content: courseMedia content: courseMedia,
}}
onChange={(val) => {
this.changeDetail(val);
}} }}
onChange={(val) => { this.changeDetail(val) }}
/> />
} )}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="introduce"> <div className='introduce'>
<span className="label">课程简介：</span> <span className='label'>课程简介：</span>
<div className="content"> <div className='content'>
<div className="intro-list"> <div className='intro-list'>
<div className="intro-list__item introduce-editor"> <div className='intro-list__item introduce-editor'>
{(!id || loadintroduce) && {(!id || loadintroduce) && (
<GraphicsEditor <GraphicsEditor
id="intro" id='intro'
isIntro={true} isIntro={true}
maxLimit={1000}
editorType={'graphicsCourseIntor'}
detail={{ detail={{
content: introduce content: introduce,
}}
onChange={(val) => {
this.changeIntro(val);
}} }}
onChange={(val) => { this.changeIntro(val) }}
/> />
} )}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
{/* 选择暖场图文件弹窗 */} {/* 选择暖场图文件弹窗 */}
{ showSelectFileModal && {showSelectFileModal && (
<SelectPrepareFileModal <SelectPrepareFileModal
operateType="select" operateType='select'
accept={selectType==="INTRO"?"image/jpeg,image/png,image/jpg":"video/mp4,image/jpeg,image/png,image/jpg"} accept={selectType === 'INTRO' ? 'image/jpeg,image/png,image/jpg' : 'video/mp4,image/jpeg,image/png,image/jpg'}
selectTypeList={ selectType==="INTRO" ? ['JPG', 'JPEG', 'PNG']: ['MP4', 'JPG', 'JPEG', 'PNG'] } selectTypeList={selectType === 'INTRO' ? ['JPG', 'JPEG', 'PNG'] : ['MP4', 'JPG', 'JPEG', 'PNG']}
tooltip={ selectType==="INTRO"?'支持文件类型：jpg、jpeg、png':'支持文件类型：jpg、jpeg、png、mp4'} tooltip={selectType === 'INTRO' ? '支持文件类型：jpg、jpeg、png' : '支持文件类型：jpg、jpeg、png、mp4'}
isOpen={showSelectFileModal} isOpen={showSelectFileModal}
onClose={() => { onClose={() => {
this.setState({ showSelectFileModal: false }) this.setState({ showSelectFileModal: false });
}} }}
onSelect={this.handleSelectVideo} onSelect={this.handleSelectVideo}
/> />
} )}
</div> </div>
) );
} }
} }
......
src/modules/course-manage/graphics-course/components/AddGraphicsIntro.less
.add-video__intro-info { .add-graphic__intro-info {
.w-e-full-screen-editor { .w-e-full-screen-editor {
background: #fff !important; background: #fff !important;
} }
.playback { .playback {
margin-bottom: 10px; margin-bottom: 10px;
.require { .require {
color: #EC4B35; color: #ec4b35;
} }
&__text { &__text {
color: #999; color: #999;
} }
} }
.label{ .label {
display:inline-block; display: inline-block;
text-align:right; text-align: right;
width:85px; width: 85px;
} }
.playback, .playback,
.introduce { .introduce {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
} }
.allow-tourist-join{ .allow-tourist-join {
display:flex; display: flex;
.content{ .content {
display:flex; display: flex;
} }
.desc{ .desc {
margin-left:16px; margin-left: 16px;
font-size:14px; font-size: 14px;
color:#999; color: #999;
display:inline-block; display: inline-block;
} }
} }
.store-show{ .store-show {
display:flex; display: flex;
margin-top:16px; margin-top: 16px;
margin-bottom:16px; margin-bottom: 16px;
.desc{ .content {
margin-left:16px; display: flex;
font-size:14px; }
color:#999; .desc {
display:inline-block; margin-left: 16px;
font-size: 14px;
color: #999;
display: inline-block;
} }
} }
.radio { .radio {
...@@ -59,13 +62,13 @@ ...@@ -59,13 +62,13 @@
.intro-list__item { .intro-list__item {
display: flex; display: flex;
margin-bottom: 16px; margin-bottom: 32px;
position: relative; position: relative;
&.picture { &.picture {
width: 550px; width: 550px;
padding: 16px; padding: 16px;
border: 1px solid #EEE; border: 1px solid #eee;
border-radius: 4px; border-radius: 4px;
.img__wrap { .img__wrap {
...@@ -114,7 +117,7 @@ ...@@ -114,7 +117,7 @@
line-height: 80px; line-height: 80px;
padding: 16px; padding: 16px;
margin-top: 16px; margin-top: 16px;
border: 1px dashed #EBEBEB; border: 1px dashed #ebebeb;
border-radius: 4px; border-radius: 4px;
.ant-upload { .ant-upload {
...@@ -133,7 +136,7 @@ ...@@ -133,7 +136,7 @@
.iconfont { .iconfont {
font-size: 22px; font-size: 22px;
line-height: 22px; line-height: 22px;
color: #BFBFBF; color: #bfbfbf;
text-align: center; text-align: center;
} }
...@@ -152,7 +155,7 @@ ...@@ -152,7 +155,7 @@
} }
.checkExample { .checkExample {
width: 60px; width: 60px;
color: #FF7519; color: #ff7519;
cursor: pointer; cursor: pointer;
} }
.warmup { .warmup {
...@@ -197,21 +200,19 @@ ...@@ -197,21 +200,19 @@
} }
} }
.opt-btns { .opt-btns {
.default-btn { .default-btn {
margin-left: 16px; margin-left: 16px;
color: #FF7519; color: #ff7519;
cursor: pointer; cursor: pointer;
&.disabled { &.disabled {
color: #CCC; color: #ccc;
cursor: not-allowed; cursor: not-allowed;
} }
} }
} }
}
} .example-wrap {
.example-wrap {
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
text-align: center; text-align: center;
.title { .title {
...@@ -227,14 +228,14 @@ ...@@ -227,14 +228,14 @@
img { img {
width: 180px; width: 180px;
} }
} }
.check-record-rule { .check-record-rule {
width: 120px; width: 120px;
color: #FF7519; color: #ff7519;
cursor: pointer; cursor: pointer;
z-index: 2; z-index: 2;
} }
.record-rule-wrap { .record-rule-wrap {
text-align: left; text-align: left;
ul { ul {
margin-top: 10px; margin-top: 10px;
...@@ -247,9 +248,9 @@ ...@@ -247,9 +248,9 @@
.text { .text {
color: #999; color: #999;
} }
} }
.auto-send-class-report { .auto-send-class-report {
.label { .label {
width: 57px; width: 57px;
height: 12px; height: 12px;
...@@ -258,7 +259,8 @@ ...@@ -258,7 +259,8 @@
color: #666666; color: #666666;
line-height: 12px; line-height: 12px;
} }
.open-text, .close-text { .open-text,
.close-text {
width: 572px; width: 572px;
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
...@@ -273,4 +275,4 @@ ...@@ -273,4 +275,4 @@
.close-text { .close-text {
margin-bottom: 16px; margin-bottom: 16px;
} }
} }
\ No newline at end of file
src/modules/course-manage/graphics-course/components/GraphicsCourseList.jsx
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-05 10:12:45 * @Date: 2020-08-05 10:12:45
* @LastEditors: Please set LastEditors * @LastEditors: wufan
* @LastEditTime: 2021-06-15 20:01:05 * @LastEditTime: 2021-07-05 10:23:10
* @Description: 视频课-列表模块 * @Description: 线上课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
import User from '@/common/js/user'; import User from '@/common/js/user';
...@@ -333,7 +333,7 @@ class GraphicsCourseList extends React.Component { ...@@ -333,7 +333,7 @@ class GraphicsCourseList extends React.Component {
// 删除视频课 // 删除视频课
handleDeleteGraphicsCourse = (scheduleId) => { handleDeleteGraphicsCourse = (scheduleId) => {
Modal.confirm({ Modal.confirm({
title: '你确定要删除此视频课吗？', title: '你确定要删除此线上课吗？',
content: '删除后，学员将不能进行观看。', content: '删除后，学员将不能进行观看。',
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>, icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定', okText: '确定',
......
src/modules/course-manage/graphics-course/components/GraphicsCourseOpt.jsx
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:15 * @Date: 2020-08-05 10:12:15
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-26 16:07:27 * @LastEditTime: 2020-12-26 16:07:27
* @Description: 视频课-操作模块 * @Description: 线上课-操作模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
......
src/modules/course-manage/graphics-course/index.jsx
...@@ -17,13 +17,13 @@ class GraphicsCourse extends React.Component { ...@@ -17,13 +17,13 @@ class GraphicsCourse extends React.Component {
courseType: 'PICTURE', courseType: 'PICTURE',
storeId:User.getStoreId() storeId:User.getStoreId()
}, },
dataSource: [], // 视频课列表 dataSource: [], // 线上课列表
totalCount: 0, // 视频课数据总条数 totalCount: 0, // 线上课数据总条数
} }
} }
componentWillMount() { componentWillMount() {
// 获取视频课列表 // 获取线上课列表
this.handleFetchScheduleList(); this.handleFetchScheduleList();
} }
...@@ -76,7 +76,7 @@ class GraphicsCourse extends React.Component { ...@@ -76,7 +76,7 @@ class GraphicsCourse extends React.Component {
{/* 操作模块 */} {/* 操作模块 */}
<GraphicsCourseOpt /> <GraphicsCourseOpt />
{/* 视频课列表模块 */} {/* 线上课列表模块 */}
<GraphicsCourseList <GraphicsCourseList
query={query} query={query}
dataSource={dataSource} dataSource={dataSource}
......
src/modules/course-manage/modal/PreviewCourseModal.less
...@@ -13,7 +13,8 @@ ...@@ -13,7 +13,8 @@
} }
.container { .container {
overflow: scroll; overflow-y: auto;
overflow-x: hidden;
height: 100%;; height: 100%;;
.course-cover, .course-url { .course-cover, .course-url {
...@@ -30,6 +31,16 @@ ...@@ -30,6 +31,16 @@
color: #000; color: #000;
} }
.title__category {
color: #999999;
margin-top: 4px;
margin-bottom: 4px;
}
.title__chapter {
color: #999999;
margin-bottom: 4px;
}
.title__inst-name { .title__inst-name {
color: #666; color: #666;
font-size: 12px; font-size: 12px;
......
src/modules/course-manage/modal/ShareLiveModal.jsx
...@@ -116,11 +116,7 @@ class ShareLiveModal extends React.Component { ...@@ -116,11 +116,7 @@ class ShareLiveModal extends React.Component {
} }
break; break;
case 'videoClass': // 视频课 case 'videoClass': // 视频课
coverImgSrc = coverImgSrc = coverUrl || 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png';
coverUrl ||
(courseDivision === 'internal'
? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast&anystring=anystring`
: 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png');
break; break;
case 'graphicsClass': // 图文课 case 'graphicsClass': // 图文课
coverImgSrc = coverUrl || 'https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png'; coverImgSrc = coverUrl || 'https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png';
......
src/modules/course-manage/offline-course/AddOfflineCourse.less
.add-offline-course-page { .add-offline-course-page {
position:relative !important; position: relative !important;
.box{ .box {
margin-bottom:52px !important; margin-bottom: 52px !important;
} }
.ant-radio-group { .ant-radio-group {
display: flex; display: flex;
...@@ -39,18 +39,18 @@ ...@@ -39,18 +39,18 @@
position: relative; position: relative;
padding-left: 14px; padding-left: 14px;
&::before { &::before {
content: ""; content: '';
position: absolute; position: absolute;
left: 0px; left: 0px;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
width: 4px; width: 4px;
height: 10px; height: 10px;
background: #2966FF; background: #2966ff;
} }
} }
} }
.label{ .label {
display: inline-block; display: inline-block;
text-align: right; text-align: right;
width: 120px; width: 120px;
...@@ -75,8 +75,8 @@ ...@@ -75,8 +75,8 @@
} }
} }
.course-catalog { .course-catalog {
margin-bottom:16px; margin-bottom: 16px;
margin-top:16px; margin-top: 16px;
display: flex; display: flex;
.switch-box { .switch-box {
.switch-item { .switch-item {
...@@ -110,19 +110,19 @@ ...@@ -110,19 +110,19 @@
.select-day { .select-day {
margin-bottom: 4px; margin-bottom: 4px;
.mark-day { .mark-day {
color: #2966FF; color: #2966ff;
} }
} }
} }
.allow-tourist-join{ .allow-tourist-join {
display:flex; display: flex;
margin-bottom:16px; margin-bottom: 16px;
.desc { .desc {
color:#999; color: #999;
margin-left:12px; margin-left: 12px;
} }
.content{ .content {
display:flex; display: flex;
} }
} }
.course-ware { .course-ware {
...@@ -150,45 +150,41 @@ ...@@ -150,45 +150,41 @@
&__wrap { &__wrap {
position: relative; position: relative;
.tag {
border-radius: 2px;
background: #D6D6D6;
font-size: 12px;
height: 18px;
width: 52px;
text-align: center;
color: #FFF;
position: absolute;
top: 8px;
left: 8px;
}
}
.course-cover__wrap {
display: flex;
flex-direction: row;
}
.img-content { .img-content {
margin-top: 8px;
margin-right: 20px; margin-right: 20px;
width: 299px; width: 299px;
height: 169px; height: 169px;
position: relative;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: contain; object-fit: contain;
border-radius: 4px;
}
.tag {
border-radius: 2px;
background: #d6d6d6;
font-size: 12px;
height: 18px;
width: 52px;
text-align: center;
color: #fff;
position: absolute;
top: 8px;
left: 8px;
} }
} }
.opt-btns { .opt-btns {
.default-btn { .default-btn {
margin-left: 16px; margin-left: 14px;
color: #2966FF; color: #2966ff;
cursor: pointer; cursor: pointer;
&.disabled { &.disabled {
color: #CCC; color: #ccc;
cursor: not-allowed; cursor: not-allowed;
} }
} }
...@@ -196,13 +192,14 @@ ...@@ -196,13 +192,14 @@
.ant-upload-list { .ant-upload-list {
display: none; display: none;
} }
}
.tips { .tips {
margin-top: 8px; margin-top: 8px;
color: #999; color: #999;
} }
} }
}
}
.select-student { .select-student {
align-items: center; align-items: center;
...@@ -236,7 +233,7 @@ ...@@ -236,7 +233,7 @@
justify-content: flex-end; justify-content: flex-end;
padding-right: 72px; padding-right: 72px;
background: #fff; background: #fff;
border-top: 1px solid #E8E8E8; border-top: 1px solid #e8e8e8;
z-index: 999; z-index: 999;
.ant-btn { .ant-btn {
margin-left: 10px; margin-left: 10px;
......
src/modules/course-manage/offline-course/components/AddGraphicsIntro.jsx
...@@ -109,7 +109,7 @@ class AddGraphicsIntro extends React.Component { ...@@ -109,7 +109,7 @@ class AddGraphicsIntro extends React.Component {
const {data: { id, whetherVisitorsJoin, courseMedia, introduce, shelfState, loadcourseMedia, loadintroduce } } = this.props; const {data: { id, whetherVisitorsJoin, courseMedia, introduce, shelfState, loadcourseMedia, loadintroduce } } = this.props;
const { showSelectFileModal, selectType } = this.state; const { showSelectFileModal, selectType } = this.state;
return ( return (
<div className="add-video__intro-info"> <div className="add-offline__intro-info">
<div className="allow-tourist-join"> <div className="allow-tourist-join">
<span className="label">观看设置：</span> <span className="label">观看设置：</span>
<div className="content"> <div className="content">
......
src/modules/course-manage/offline-course/components/AddGraphicsIntro.less
.add-video__intro-info { .add-offline__intro-info {
.w-e-full-screen-editor { .w-e-full-screen-editor {
background: #fff !important; background: #fff !important;
} }
......
src/modules/course-manage/offline-course/components/OfflineCourseList.jsx
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:45 * @Date: 2020-08-05 10:12:45
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-11 16:44:42 * @LastEditTime: 2021-06-11 16:44:42
* @Description: 视频课-列表模块 * @Description: 线上课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
import Service from '@/common/js/service'; import Service from '@/common/js/service';
...@@ -29,7 +29,7 @@ class OfflineCourseList extends React.Component { ...@@ -29,7 +29,7 @@ class OfflineCourseList extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
id: '', // 视频课ID id: '', // 线上课ID
studentIds: [], studentIds: [],
}; };
} }
......
src/modules/course-manage/offline-course/components/OfflineCourseOpt.jsx
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:15 * @Date: 2020-08-05 10:12:15
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-26 16:07:27 * @LastEditTime: 2020-12-26 16:07:27
* @Description: 视频课-操作模块 * @Description: 线上课-操作模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
......
src/modules/course-manage/utils/hasExportPermission.js
...@@ -14,7 +14,7 @@ const hasExportPermission = (type) => { ...@@ -14,7 +14,7 @@ const hasExportPermission = (type) => {
return Permission.hasInteractiveExport(); return Permission.hasInteractiveExport();
} }
// 视频课导出权限 // 线上课导出权限
if (type === 'videoClass') { if (type === 'videoClass') {
return Permission.hasVideoClassExport(); return Permission.hasVideoClassExport();
} }
......
src/modules/course-manage/video-course/AddVideoCourse.less
...@@ -49,14 +49,16 @@ ...@@ -49,14 +49,16 @@
} }
} }
.course-catalog{ .course-catalog{
margin-bottom:16px; margin-bottom:24px;
margin-top:16px; margin-top:24px;
} }
.course-ware { .course-ware {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 4px; margin-bottom: 4px;
&__index {
width: 18px;
}
&__img { &__img {
width: 24px; width: 24px;
margin-right: 4px; margin-right: 4px;
...@@ -75,7 +77,19 @@ ...@@ -75,7 +77,19 @@
.img-content { .img-content {
width: 298px; width: 298px;
height: 172px; height: 172px;
position: relative;
.tag {
border-radius: 2px;
background: rgba(51, 51, 51, .2);
font-size: 12px;
height: 18px;
width: 52px;
text-align: center;
color: #FFF;
position: absolute;
top: 8px;
left: 8px;
}
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -85,7 +99,7 @@ ...@@ -85,7 +99,7 @@
.empty-img { .empty-img {
width: 298px; width: 298px;
height: 172px; height: 172px;
border: 1px dashed #EBEBEB; border: 1px dashed #ebebeb;
border-radius: 4px; border-radius: 4px;
padding: 12px; padding: 12px;
color: #999; color: #999;
...@@ -94,12 +108,17 @@ ...@@ -94,12 +108,17 @@
} }
.opt-btns { .opt-btns {
margin-top: 8px; margin-bottom: 8px;
display: flex; .span {
align-items: center; color: #ccc;
margin-left: 8px;
}
.defalut-span {
cursor: pointer;
color: #2966ff;
}
.tips { .tips {
margin-left: 12px; margin-top: 8px;
color: #999; color: #999;
} }
} }
...@@ -115,18 +134,97 @@ ...@@ -115,18 +134,97 @@
color: #333; color: #333;
} }
} }
.upload-video {
display: flex;
margin-bottom: 24px;
.sub-content { .sub-content {
margin-left: 85px;
margin-top: 4px; margin-top: 4px;
.btn-wrap {
display: flex;
.course-ware--empty {
margin-left: 12px;
line-height: 28px;
}
}
.tips { .tips {
margin-left: 4px; margin-top: 8px;
color: #999; color: #999;
} }
} }
} }
.course-chapter-list-wrap {
position: relative;
margin-left: 85px;
border: 1px solid #E8E8E8;
width: 630px;
.course-chapter-total {
height: 40px;
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
z-index: 10;
background: #fff;
width: 628px;
text-indent: 16px;
line-height: 40px;
}
.course-chapter-list {
max-height: 245px;
min-height: 130px;
overflow-y: auto ;
border-radius: 4px;
padding: 16px;
.course-ware {
display: flex;
align-items: center;
margin-bottom: 22px;
color: #666;
&:last-child {
margin-bottom: 0px;
}
&__img {
width: 24px;
margin-right: 8px;
margin-left: 16px;
}
&__name {
color: #333;
width: 353px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin-right: 24px;
}
.course-chapter__opt {
display: flex;
color: #2966ff;
width: 168px;
.line {
color: #bfbfbf;
margin-left: 4px;
margin-right: 4px;
}
.delete,
.rename,
.up,
.down {
cursor: pointer;
}
.up,
.down {
&.disabled {
color: rgba(204, 204, 204, 1);
}
}
}
}
}
}
}
.footer { .footer {
position: fixed; position: fixed;
left: 196px; left: 196px;
...@@ -138,10 +236,25 @@ ...@@ -138,10 +236,25 @@
justify-content: flex-end; justify-content: flex-end;
padding-right: 72px; padding-right: 72px;
background: #fff; background: #fff;
border-top: 1px solid #E8E8E8; border-top: 1px solid #ccc2c2;
z-index: 999; z-index: 999;
.ant-btn { .ant-btn {
margin-left: 10px; margin-left: 10px;
} }
} }
} }
.chapter-popover {
.ant-popover-message-title {
padding-left: 0;
}
.ant-form-item {
margin-bottom: 0!important;
}
.ant-form-item-explain.ant-form-item-explain-error {
height: 24px;
}
.ant-form-item-explain {
min-height: 0;
}
}
\ No newline at end of file
src/modules/course-manage/video-course/VideoCourseDetail.less 0 → 100644
.video-course-detail {
padding-bottom: 40px;
.box {
.course-detail {
display: flex;
border-bottom: 2px solid #E8E8E8;
padding-bottom: 24px;
&__img {
margin-right: 24px;
width: 300px;
height: 170px;
background: #FFFFFF;
border-radius: 4px;
img {
width: 300px;
height: 170px;
border-radius: 4px;
}
}
&__info {
display: flex;
flex-direction: column;
.info__title {
font-size: 20px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 28px;
margin-bottom: 16px;
}
.info__category, .info__chapterNum {
width: 100%;
height: 20px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
line-height: 20px;
margin-bottom: 10px;
}
}
}
.course-chapter {
padding-top: 24px;
&__total {
width: 100%;
height: 20px;
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 20px;
margin-bottom: 24px;
}
&__list {
.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;
}
}
}
}
}
}
\ No newline at end of file
src/modules/course-manage/video-course/VideoCourseDetail.tsx 0 → 100644
/*
* @Author: wufan
* @Date: 2020-04-28 18:05:30
* @LastEditors: yuananting
* @LastEditTime: 2021-07-09 16:21:13
* @Description: 线上课课程课节详情
*/
import React,{useEffect, useState} from 'react';
import Breadcrumbs from "@/components/Breadcrumbs";
import { withRouter } from "react-router-dom";
import CourseService from '@/domains/course-domain/CourseService'
import underscore from 'underscore';
import ScanFileModal from '@/modules/resource-disk/modal/ScanFileModal.jsx';
import './VideoCourseDetail.less';
declare var getParameterByName: any;
declare var window: any;
function VideoCourseDetail(){
const courseId = window.getParameterByName("courseId"); // 课程ID
const [coverUrl,setCoverUrl] = useState("");
const [videoName,setVideoName] = useState("");
const [scheduleVideoUrl,setScheduleVideoUrl] = useState("");
const [courseChapterList,setCourseChapterList] = useState<Array<Object>>([]);
const [courseName,setCourseName] = useState("");
const [categoryName,setCategoryName] = useState("");
const [scanFileModal,setScanFileModal] = useState<any>(null);
useEffect(()=>{
handleFetchScheudleDetail(courseId);
},[courseId])
// 获取线上课详情
function handleFetchScheudleDetail(courseId: string){
CourseService.videoScheduleDetail({
courseId
}).then((res) => {
const { result = {} } = res || {}
const { courseName, courseMediaVOS, categoryName, courseChapterVOList =[] } = result
let coverId:string = "";
let coverUrl: string = "";
let videoType: string = "";
let videoDuration: number = 0;
let videoName: string = "";
let scheduleVideoUrl: string = "";
courseMediaVOS.map((item:any) => {
switch (item.contentType) {
case 'COVER':
coverId = item.mediaContent
coverUrl = item.mediaUrl
break
case 'SCHEDULE':
videoDuration = item.videoDuration
videoName = item.mediaName
scheduleVideoUrl = item.mediaUrl
videoType = item.mediaType
break
default:
break
}
return item
})
setCoverUrl(coverUrl);
setVideoName(videoName);
setScheduleVideoUrl(scheduleVideoUrl);
setCourseName(courseName);
setCategoryName(categoryName);
setCourseChapterList(courseChapterVOList);
})
}
function handleScanFileModal(fileType: string = "MP4", fileObj: Object){
const scanFileModal = (
<ScanFileModal
fileType={fileType}
item={fileObj}
close={() => {
setScanFileModal(null);
}}
/>
);
setScanFileModal(scanFileModal)
}
return <div className="page video-course-detail">
<Breadcrumbs
navList="课程详情"
goBack={() => {
window.RCHistory.goBack();
}}
/>
<div className="box">
<div className="course-detail">
<div className='course-detail__img'>
{/* 如果视频和封面都没有上传的话, 那么就显示缺省, 如果上传了视频, 那么封面图就默认显示视频的第一帧, 如果上传了封面图, 那么就显示上传的封面图 */}
<img src={coverUrl || `https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png`} alt='' />
</div>
<div className="course-detail__info">
<div className="info__title">{courseName}</div>
<div className="info__category">{`分类：${categoryName}`}</div>
<div className="info__chapterNum">{`课节数量：${courseChapterList.length}`}</div>
</div>
</div>
<div className="course-chapter">
<div className="course-chapter__total">{`共${courseChapterList.length}个课节`}</div>
<div className="course-chapter__list">
<If condition={courseChapterList.length > 0}>
{
underscore.map(courseChapterList,(item: any,index: number) => {
return <div className='course-ware' onClick={()=>{handleScanFileModal("MP4",item)}} key={index}>
<div className="course-ware__index">{index < 9 ? `0${index + 1 } ` : 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>
})
}
</If>
</div>
</div>
</div>
{scanFileModal}
</div>
}
export default withRouter(VideoCourseDetail);
\ No newline at end of file
src/modules/course-manage/video-course/components/AddVideoIntro.jsx
...@@ -117,12 +117,18 @@ class AddVideoIntro extends React.Component { ...@@ -117,12 +117,18 @@ class AddVideoIntro extends React.Component {
<span className="label">观看设置：</span> <span className="label">观看设置：</span>
<div className="content"> <div className="content">
<div> <div>
<Switch checked={whetherVisitorsJoin==="YES"? true:false} onChange={this.whetherVisitorsJoinChange}/> <Switch checked={whetherVisitorsJoin==="NO"? true:false} onChange={this.whetherVisitorsJoinChange}/>
</div> </div>
<div> <div>
<div className="desc"> <div className="desc">
<div>开启：允许未绑定手机号的学员观看</div> <Choose>
<div>关闭：仅限绑定了手机号的学员可以进入观看视频</div> <When condition={whetherVisitorsJoin==="NO"}>
<div>已开启，学员需绑定手机号才可观看</div>
</When>
<Otherwise>
<div>已关闭，学员无需绑定手机号即可观看</div>
</Otherwise>
</Choose>
</div> </div>
</div> </div>
</div> </div>
...@@ -136,20 +142,27 @@ class AddVideoIntro extends React.Component { ...@@ -136,20 +142,27 @@ class AddVideoIntro extends React.Component {
</Col> </Col>
<Col span={21}> <Col span={21}>
<div className="desc"> <div className="desc">
<div>开启：此视频将在学员学院的视频列表中出现</div> <Choose>
<div>关闭：此视频将在学员学院的视频列表中隐藏</div> <When condition={shelfState==="YES"}>
<div>已开启，课程将在该学院的学员课程列表中显示</div>
</When>
<Otherwise>
<div>已关闭，课程将在该学院的学员课程列表中隐藏</div>
</Otherwise>
</Choose>
</div> </div>
</Col> </Col>
</Row> </Row>
</div> </div>
</div> </div>
<div className="introduce"> <div className="introduce">
<span className="label">视频课简介：</span> <span className="label">课程简介：</span>
<div className="content"> <div className="content">
<div className="intro-list"> <div className="intro-list">
<div className="intro-list__item introduce-editor"> <div className="intro-list__item introduce-editor">
{(!id || loadintroduce) && {(!id || loadintroduce) &&
<GraphicsEditor <GraphicsEditor
maxLimit={1000}
id="intro" id="intro"
isIntro={true} isIntro={true}
detail={{ detail={{
......
src/modules/course-manage/video-course/components/AddVideoIntro.less
...@@ -32,14 +32,17 @@ ...@@ -32,14 +32,17 @@
} }
.store-show{ .store-show{
display:flex; display:flex;
margin-top:16px; margin-top:24px;
margin-bottom:16px; margin-bottom:24px;
.desc{ .desc{
margin-left:16px; margin-left:11px;
font-size:14px; font-size:14px;
color:#999; color:#999;
display:inline-block; display:inline-block;
} }
.content {
width: 400px;
}
} }
.radio { .radio {
display: block; display: block;
......
src/modules/course-manage/video-course/components/ChapterList.jsx 0 → 100644
import React from 'react';
import './ChapterList.less';
function ChapterList(props){
const { courseChapterList } = props;
return <div className='chapter-list-component'>
<If condition={courseChapterList.length > 0}>
{
_.map(courseChapterList,(item,index) => {
return <div className='course-ware'>
<div className='course-ware__index'>{index < 9 ? `0${index + 1 } ` : `${index + 1 } `}</div>
<div className="course-ware__detail">
<div className='course-ware__detail__name'>{item.mediaName}</div>
<div className='course-ware__detail__duration'>{window.formatDuration(item.videoDuration)}</div>
</div>
</div>
})
}
</If>
</div>
}
export default ChapterList;
\ No newline at end of file
src/modules/course-manage/video-course/components/ChapterList.less 0 → 100644
.chapter-list-component {
.course-ware {
display: flex;
padding: 10px 0;
border-bottom: 1px dashed #EEEEEE;
&:last-child {
border-bottom: none;
}
&__index {
width: 18px;
height: 18px;
font-size: 13px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #999999;
line-height: 18px;
}
&__detail {
display: flex;
flex-direction: column;
width: calc(~'100% - 18px');
&__name {
width: 267px;
font-size: 13px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
line-height: 21px;
margin-bottom: 4px;
}
&__duration {
color: #999999;
}
}
}
}
\ No newline at end of file
src/modules/course-manage/video-course/components/LearningDetailModal.jsx 0 → 100644
import User from "@/common/js/user";
import CourseService from "@/domains/course-domain/CourseService";
import React from "react";
import { Modal } from "antd";
import "./LearningDetailModal.less";
class LearningDetailModal extends React.Component {
constructor(props) {
super(props);
this.state = {
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
});
});
};
render() {
const { title, onClose, onOk } = this.props;
const { courseChapterList } = this.state;
return (
<Modal
footer={null}
visible={true}
title={title}
width={680}
maskClosable={false}
closeIcon={
<span className="icon iconfont modal-close-icon">&#xe6ef;</span>
}
onCancel={onClose}
onOk={onOk}
className="learning-detail-modal"
>
<div className="course-chapter__list">
<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 ? `0${index + 1}` : index + 1
} `}</div>
<img
className="course-ware__img"
src="https://image.xiaomaiketang.com/xm/TKwbQGYDBR.png"
alt=""
/>
<div className="course-ware__name">{item.courseChapterName && item.courseChapterName.replace('.MP4','')}</div>
</div>
<div className={`progress ${item.progress === 100 ? 'finish' :''}`}>{`${item.progress === 100 ? '已完成' : `${item.progress}%`}`}</div>
</div>
);
})}
</If>
</div>
</Modal>
);
}
}
export default LearningDetailModal;
src/modules/course-manage/video-course/components/LearningDetailModal.less 0 → 100644
.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;
&__index {
width: 20px;
}
&__img {
width: 20px;
height: 20px;
margin-left: 12px;
margin-right: 8px;
}
&__name {
width: 500px;
}
}
.progress {
&.finish {
color: RGBA(101, 202, 168, 1);
}
}
}
}
}
}
src/modules/course-manage/video-course/components/VideoCourseFilter.jsx
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-05 10:11:57 * @Date: 2020-08-05 10:11:57
* @LastEditors: fusanqiasng * @LastEditors: yuananting
* @LastEditTime: 2021-05-28 20:14:37 * @LastEditTime: 2021-07-12 14:14:47
* @Description: 视频课-搜索模块 * @Description: 线上课-搜索模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -56,22 +56,17 @@ class VideoCourseFilter extends React.Component { ...@@ -56,22 +56,17 @@ class VideoCourseFilter extends React.Component {
this.getTeacherList() this.getTeacherList()
this.queryCategoryTree() this.queryCategoryTree()
} }
// 查询分类树 // 查询分类树
queryCategoryTree = (categoryName = '') => { queryCategoryTree = ()=> {
let query = { const params= {
bizType: 'QUESTION', storeId:User.getStoreId()
source: 2,
categoryName,
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
count: false,
} }
AidToolService.queryExternalCategoryTree(query).then((res) => { StoreService.getStoreDetail(params).then((res) => {
const { categoryList = [] } = res.result const { result = {} } = res;
console.log(this.renderTreeNodes(categoryList)) result.coursePackageId && AidToolService.queryCategoryTreeByPackage({coursePackageId: result.coursePackageId}).then((res) => {
this.setState({ const { result = [] } = res;
categoryList: this.renderTreeNodes(categoryList), this.setState({categoryList: this.renderTreeNodes(result)})
categoryName,
}) })
}) })
} }
...@@ -192,10 +187,10 @@ class VideoCourseFilter extends React.Component { ...@@ -192,10 +187,10 @@ class VideoCourseFilter extends React.Component {
<Row type='flex' justify='space-between' align='top'> <Row type='flex' justify='space-between' align='top'>
<div className='search-condition'> <div className='search-condition'>
<div className='search-condition__item'> <div className='search-condition__item'>
<span className='search-name'>视频课名称：</span> <span className='search-name'>线上课名称：</span>
<Search <Search
value={courseName} value={courseName}
placeholder='搜索视频课名称' placeholder='搜索线上课名称'
onChange={(e) => { onChange={(e) => {
this.handleChangeQuery('courseName', e.target.value) this.handleChangeQuery('courseName', e.target.value)
}} }}
......
src/modules/course-manage/video-course/components/VideoCourseList.jsx
import { Dropdown, message, Modal, Switch, Tooltip } from 'antd'; import React from "react"
import User from '@/common/js/user'; import { Modal, message, Tooltip, Switch, Dropdown } from "antd"
import { PageControl } from '@/components'; import _ from "underscore"
import { LIVE_SHARE } from '@/domains/course-domain/constants'; import { PageControl } from "@/components"
import CourseService from '@/domains/course-domain/CourseService'; import { LIVE_SHARE } from "@/domains/course-domain/constants"
import ShareLiveModal from '@/modules/course-manage/modal/ShareLiveModal'; import { Route, withRouter } from 'react-router-dom';
import React from 'react'; import ShareLiveModal from "@/modules/course-manage/modal/ShareLiveModal"
import RelatedPlanModal from '../../modal/RelatedPlanModal'; import CourseService from "@/domains/course-domain/CourseService"
import WatchDataModal from '../modal/WatchDataModal'; import RelatedPlanModal from "../../modal/RelatedPlanModal"
import User from "@/common/js/user"
import VideoCourseDetail from '../VideoCourseDetail';
import WatchData from "./WatchData";
import { XMTable } from '@/components'; import { XMTable } from '@/components';
import college from '@/common/lottie/college'; import college from '@/common/lottie/college';
import './VideoCourseList.less'; import "./VideoCourseList.less"
class VideoCourseList extends React.Component { class VideoCourseList extends React.Component {
constructor(props) { constructor(props) {
...@@ -32,21 +35,20 @@ class VideoCourseList extends React.Component { ...@@ -32,21 +35,20 @@ class VideoCourseList extends React.Component {
} }
} }
// 跳转课程详情页
handleLinkToCourseDetail = (courseId) => {
const { match } = this.props;
window.RCHistory.push(`${match.url}/video-course-detail?courseId=${courseId}`)
}
// 观看数据弹窗 // 观看数据弹窗
handleShowWatchDataModal = (record) => { handleShowWatchDataModal = (item) => {
const watchDataModal = ( const { match } = this.props;
<WatchDataModal window.RCHistory.push({
type='videoCourseList' pathname: `${match.url}/course-data?courseName=${item.courseName}&courseId=${item.id}`
data={record} })
close={() => { }
this.setState({
watchDataModal: null,
});
}}
/>
);
this.setState({ watchDataModal });
};
// 请求表头 // 请求表头
parseColumns = () => { parseColumns = () => {
...@@ -54,23 +56,21 @@ class VideoCourseList extends React.Component { ...@@ -54,23 +56,21 @@ class VideoCourseList extends React.Component {
const { ShelfLoading } = this.state; const { ShelfLoading } = this.state;
const columns = [ const columns = [
{ {
title: '视频课', title: "线上课",
key: 'scheduleName', key: "scheduleName",
dataIndex: 'scheduleName', dataIndex: "scheduleName",
width: 321, width: 321,
fixed: 'left', fixed: 'left',
render: (val, record) => { render: (val, record) => {
const { coverUrl, scheduleVideoUrl } = record; const { coverUrl } = record;
return ( return (
<div className='record__item'> <div className='record__item'>
{/* 上传了封面的话就用上传的封面, 没有的话就取视频的第一帧 */}
<img <img
className='course-cover' className='course-cover'
src={ src={
coverUrl || coverUrl || 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png'
(type === 'internal' ? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast` : 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png')
} }
alt='' alt='封面图'
/> />
<Choose> <Choose>
<When condition={record.courseName.length > 25}> <When condition={record.courseName.length > 25}>
...@@ -99,9 +99,9 @@ class VideoCourseList extends React.Component { ...@@ -99,9 +99,9 @@ class VideoCourseList extends React.Component {
</If> </If>
</span> </span>
), ),
key: 'categoryName', key: "categoryName",
dataIndex: 'categoryName', dataIndex: "categoryName",
width: 200, width: 150,
render: (val, record) => { render: (val, record) => {
return ( return (
<Choose> <Choose>
...@@ -119,21 +119,15 @@ class VideoCourseList extends React.Component { ...@@ -119,21 +119,15 @@ class VideoCourseList extends React.Component {
}, },
}, },
{ {
title: '创建人', title: '课节数',
key: 'createName', key: 'chapterNum',
dataIndex: 'createName', dataIndex: 'chapterNum',
className: "chapterNum",
width: 100, width: 100,
render: (val) => { align: 'right',
return ( render: (val,item) => {
<div> return <div onClick={()=>this.handleLinkToCourseDetail(item.id)}>{val || 1}</div>
{val && ( }
<Tooltip title={val}>
<div>{val.length > 4 ? `${val.slice(0, 4)}...` : val}</div>
</Tooltip>
)}
</div>
);
},
}, },
{ {
title: ( title: (
...@@ -170,13 +164,31 @@ class VideoCourseList extends React.Component { ...@@ -170,13 +164,31 @@ class VideoCourseList extends React.Component {
}, },
}, },
{ {
title: '观看学员数', title: "观看学员数",
width: 110, width: 150,
key: 'watchUserCount', key: "watchUserCount",
dataIndex: 'watchUserCount', dataIndex: "watchUserCount",
align: 'right',
render: (val, item) => { render: (val, item) => {
return <div className='watchUserCount'>{val || 0}</div>; return <div className='watchUserCount' onClick={() => this.handleShowWatchDataModal(item)}>{val || 0}</div>
}
}, },
{
title: "创建人",
key: "createName",
dataIndex: "createName",
width: 100,
render: (val) => {
return (
<div>
{val && (
<Tooltip title={val}>
<div>{val.length > 4 ? `${val.slice(0, 4)}...` : val}</div>
</Tooltip>
)}
</div>
)
}
}, },
{ {
title: '创建时间', title: '创建时间',
...@@ -230,22 +242,17 @@ class VideoCourseList extends React.Component { ...@@ -230,22 +242,17 @@ class VideoCourseList extends React.Component {
title: '操作', title: '操作',
key: 'operate', key: 'operate',
dataIndex: 'operate', dataIndex: 'operate',
width: 210, width: 160,
fixed: 'right', fixed: 'right',
render: (val, record) => { render: (val, record) => {
return ( return (
<div className='operate'> <div className='operate'>
<div className='operate__item' onClick={() => this.handleShowWatchDataModal(record)}> <If condition={type === "internal"}>
观看数据
</div>
<If condition={type === 'internal'}>
<span className='operate__item split'> | </span>
<div className='operate__item' onClick={() => this.handleShowShareModal(record)}> <div className='operate__item' onClick={() => this.handleShowShareModal(record)}>
分享 分享
</div> </div>
</If>
<span className='operate__item split'> | </span> <span className='operate__item split'> | </span>
</If>
<Dropdown overlay={this.renderMoreOperate(record)}> <Dropdown overlay={this.renderMoreOperate(record)}>
<span className='more-operate'> <span className='more-operate'>
<span className='operate-text'>更多</span> <span className='operate-text'>更多</span>
...@@ -260,7 +267,7 @@ class VideoCourseList extends React.Component { ...@@ -260,7 +267,7 @@ class VideoCourseList extends React.Component {
}, },
]; ];
type !== 'internal' && columns.splice(2, 1); type !== 'internal' && columns.splice(5, 1);
return columns; return columns;
}; };
...@@ -327,7 +334,7 @@ class VideoCourseList extends React.Component { ...@@ -327,7 +334,7 @@ class VideoCourseList extends React.Component {
}); });
}; };
// 删除视频课 // 删除线上课
handleDeleteVideoCourse = (scheduleId) => { handleDeleteVideoCourse = (scheduleId) => {
Modal.confirm({ Modal.confirm({
title: '你确定要删除此视频课吗？', title: '你确定要删除此视频课吗？',
...@@ -369,7 +376,7 @@ class VideoCourseList extends React.Component { ...@@ -369,7 +376,7 @@ class VideoCourseList extends React.Component {
data={shareData} data={shareData}
type='videoClass' type='videoClass'
courseDivision={type} courseDivision={type}
title='视频课' title='线上课'
close={() => { close={() => {
this.setState({ this.setState({
shareLiveModal: null, shareLiveModal: null,
...@@ -446,7 +453,7 @@ class VideoCourseList extends React.Component { ...@@ -446,7 +453,7 @@ class VideoCourseList extends React.Component {
); );
}; };
render() { render() {
const { dataSource = [], totalCount, query, type } = this.props; const { dataSource = [], totalCount, query, type, match } = this.props;
const { current, size } = query; const { current, size } = query;
const { RelatedPlanModalVisible, selectPlanList, selectCourseId } = this.state; const { RelatedPlanModalVisible, selectPlanList, selectCourseId } = this.state;
return ( return (
...@@ -465,16 +472,6 @@ class VideoCourseList extends React.Component { ...@@ -465,16 +472,6 @@ class VideoCourseList extends React.Component {
scroll={{ x: 1500 }} scroll={{ x: 1500 }}
className='video-list-table' className='video-list-table'
/> />
{/* <Table
rowKey={(record) => record.id}
dataSource={dataSource}
columns={this.parseColumns()}
onChange={this.handleChangeTable}
pagination={false}
scroll={{ x: 1500 }}
bordered
className='video-list-table'
/> */}
<div className='box-footer'> <div className='box-footer'>
<PageControl <PageControl
...@@ -499,9 +496,11 @@ class VideoCourseList extends React.Component { ...@@ -499,9 +496,11 @@ class VideoCourseList extends React.Component {
)} )}
{this.state.shareLiveModal} {this.state.shareLiveModal}
{this.state.watchDataModal} {this.state.watchDataModal}
<Route path={`${match.url}/video-course-detail`} component={VideoCourseDetail} />
<Route path={`${match.url}/course-data`} component={WatchData} />
</div> </div>
); );
} }
} }
export default VideoCourseList; export default withRouter(VideoCourseList);
src/modules/course-manage/video-course/components/VideoCourseList.less
...@@ -24,11 +24,17 @@ ...@@ -24,11 +24,17 @@
} }
} }
} }
.chapterNum {
color: #2966ff;
cursor: pointer;
}
} }
} }
.watchUserCount { .watchUserCount {
text-align: right; text-align: right;
padding: 16px; padding: 16px;
color: #2966ff;
cursor: pointer;
} }
.operate-text { .operate-text {
color: #2966FF; color: #2966FF;
......
src/modules/course-manage/video-course/components/VieoCourseOpt.jsx
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:15 * @Date: 2020-08-05 10:12:15
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-26 16:07:27 * @LastEditTime: 2020-12-26 16:07:27
* @Description: 视频课-操作模块 * @Description: 线上课-操作模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -22,7 +22,7 @@ export default function VideoCourseOpt() { ...@@ -22,7 +22,7 @@ export default function VideoCourseOpt() {
RCHistory.push('/create-video-course?type=add'); RCHistory.push('/create-video-course?type=add');
}} }}
className="mr12" className="mr12"
>新建视频课</Button> >新建线上课</Button>
</div> </div>
); );
} }
src/modules/course-manage/video-course/components/WatchData.jsx 0 → 100644
import User from "@/common/js/user";
import college from "@/common/lottie/college";
import { PageControl, XMTable } from "@/components";
import Breadcrumbs from "@/components/Breadcrumbs";
import CourseService from "@/domains/course-domain/CourseService";
import { Input, Select } from "antd";
import React from "react";
import { withRouter } from "react-router-dom";
import LearningDetailModal from "./LearningDetailModal";
import "./WatchData.less";
const { Search } = Input;
class WatchData extends React.Component {
constructor(props) {
super(props);
const courseId = window.getParameterByName("courseId");
const courseName = window.getParameterByName("courseName");
this.state = {
courseName,
courseId,
visible: true,
dataSource: [],
query: {
current: 1,
size: 10,
sourceEnum: null,
},
totalCount: 0,
learningDetailModal: null,
};
}
componentDidMount() {
this.handleFetchDataList();
}
// 获取观看视频数据列表
handleFetchDataList = () => {
const { query, courseId } = this.state;
const params = {
...query,
courseId: courseId,
storeId: User.getStoreId(),
};
CourseService.videoWatchInfo(params).then((res) => {
const { result = {} } = res;
const { records = [], total = 0 } = result;
this.setState({
dataSource: records,
totalCount: Number(total),
});
});
};
parseColumns = () => {
const SOURCENUM = {
WE_CHAT: "微信",
WORK_WE_CHAT: "企业微信",
};
const columns = [
{
title: "观看学员",
key: "name",
dataIndex: "name",
render: (val, item) => {
return (
<div className="watcher">
<div className="watcher__name">{val}</div>
<div className={`watcher__type ${item.sourceEnum}`}>
@{SOURCENUM[item.sourceEnum]}
</div>
</div>
);
},
},
{
title: "手机号",
key: "phone",
dataIndex: "phone",
},
{
title: "首次观看时间",
key: "firstWatch",
dataIndex: "firstWatch",
render: (val) => {
return formatDate("YYYY-MM-DD H:i", val);
},
},
{
title: "学习进度",
key: "progress",
dataIndex: "progress",
render: (val) => {
return <span>{val}%</span>;
},
},
{
title: "操作",
key: "operate",
dataIndex: "operate",
render: (val, record) => {
return (
<div className="operate">
<div
className="operate__item"
onClick={() => this.ShowLearningDetailModal(record)}
>
学习详情
</div>
</div>
);
},
},
];
return columns;
};
// 显示学员数据详情弹窗
ShowLearningDetailModal = (item) => {
const learningDetailModal = (
<LearningDetailModal
data={item}
title="学习详情"
onClose={() => {
this.setState({
learningDetailModal: null
});
}}
courseId={this.state.courseId}
/>
);
this.setState({ learningDetailModal });
};
// 搜索学员姓名或手机号
handleChangNickname = (value) => {
const isPhone = (value || "").match(/^\d+$/);
const { query } = this.state;
let _query = { ...query };
if (isPhone) {
_query.phone = value;
_query.nickName = null;
} else {
_query.nickName = value;
_query.phone = null;
}
_query.current = 1;
this.setState(
{
query: _query,
},
this.handleFetchDataList
);
};
// 搜索学员类型
handleWatchTypeSelect = (sourceEnum) => {
const { query } = this.state;
let _query = { ...query };
_query.sourceEnum = sourceEnum;
this.setState(
{
query: _query,
},
this.handleFetchDataList
);
};
render() {
const { dataSource, totalCount, query, courseName } = this.state;
const { current, size, sourceEnum } = query;
return (
<div className="page video-course-watch-data">
<Breadcrumbs
navList="观看学员数据"
goBack={() => {
window.RCHistory.goBack();
}}
/>
<div className="box">
<div className="box-header">
<div className="course-detail">
<div className="detail__line"></div>
<div className="detail__name">{courseName}</div>
</div>
<div className="filter-box">
<div className="watcher-name">
<span className="label">学员：</span>
<Search
placeholder="搜索学员姓名/手机号"
style={{ width: 200 }}
onChange={(e) => {
this.handleChangNickname(e.target.value);
}}
onSearch={() => {
this.handleFetchDataList();
}}
enterButton={<span className="icon iconfont">&#xe832;</span>}
/>
</div>
<div className="watch-type">
<span className="label">学员类型：</span>
<Select
showSearch
style={{ width: 200 }}
allowClear
onPopupScroll={this.handleFetchMore}
placeholder="请选择学员类型"
value={sourceEnum}
onChange={this.handleWatchTypeSelect}
>
<Select.Option tyle={{ textAlign: "center" }} value="WE_CHAT">
微信
</Select.Option>
<Select.Option
tyle={{ textAlign: "center" }}
value="WORK_WE_CHAT"
>
企业微信
</Select.Option>
</Select>
</div>
</div>
</div>
<XMTable
renderEmpty={{
image: college,
description: "暂无数据",
}}
rowKey={(record) => record.id}
dataSource={dataSource}
columns={this.parseColumns()}
pagination={false}
bordered
className="video-list-table"
/>
<div className="box-footer">
<PageControl
current={current - 1}
pageSize={size}
total={totalCount}
toPage={(page) => {
const _query = { ...query, current: page + 1 };
this.setState(
{
query: _query,
},
() => {
this.handleFetchDataList();
}
);
}}
/>
</div>
</div>
{this.state.learningDetailModal}
</div>
);
}
}
export default withRouter(WatchData);
src/modules/course-manage/video-course/components/WatchData.less 0 → 100644
.video-course-watch-data {
.watcher {
display: flex;
&__type {
margin-left: 8px;
&.WE_CHAT {
color:rgba(28, 172, 27, 1);
}
&.WORK_WE_CHAT {
color: rgba(41, 102, 255, 1);
}
}
}
.filter-box {
display: flex;
margin-bottom: 4px;
.watcher-name {
margin-right: 40px;
}
}
.course-detail {
display: flex;
align-items: center;
margin-bottom: 16px;
.detail__line {
width: 4px;
height: 12px;
background-image: linear-gradient(#2966ff 83.5%, #0acca4 16.5%);
margin-right: 8px;
}
.detail__name {
width: 880px;
height: 26px;
font-size: 19px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 26px;
}
}
}
\ No newline at end of file
src/modules/course-manage/video-course/index.jsx
...@@ -15,18 +15,18 @@ class VideoCourse extends React.Component { ...@@ -15,18 +15,18 @@ class VideoCourse extends React.Component {
current: 1, current: 1,
storeId: User.getStoreId(), storeId: User.getStoreId(),
}, },
dataSource: [], // 视频课列表 dataSource: [], // 线上课列表
totalCount: 0, // 视频课数据总条数 totalCount: 0, // 线上课数据总条数
currentTabKey: 'internal', currentTabKey: 'internal',
}; };
} }
componentWillMount() { componentWillMount() {
// 获取视频课列表 // 获取线上课列表
this.handleFetchScheduleList(); this.handleFetchScheduleList();
} }
// 获取视频课列表 // 获取线上课列表
handleFetchScheduleList = (_query = {}) => { handleFetchScheduleList = (_query = {}) => {
const { currentTabKey } = this.state; const { currentTabKey } = this.state;
const query = { const query = {
...@@ -81,7 +81,7 @@ class VideoCourse extends React.Component { ...@@ -81,7 +81,7 @@ class VideoCourse extends React.Component {
const { dataSource, totalCount, query, currentTabKey } = this.state; const { dataSource, totalCount, query, currentTabKey } = this.state;
return ( return (
<div className='page video-course-page'> <div className='page video-course-page'>
<div className='content-header'>视频课</div> <div className='content-header'>线上课</div>
<div className='box'> <div className='box'>
<Tabs onChange={this.currenTabChange} activeKey={currentTabKey}> <Tabs onChange={this.currenTabChange} activeKey={currentTabKey}>
...@@ -95,7 +95,7 @@ class VideoCourse extends React.Component { ...@@ -95,7 +95,7 @@ class VideoCourse extends React.Component {
<If condition={currentTabKey === 'internal'}> <If condition={currentTabKey === 'internal'}>
<VideoCourseOpt /> <VideoCourseOpt />
</If> </If>
{/* 视频课列表模块 */} {/* 线上课列表模块 */}
<VideoCourseList <VideoCourseList
type={currentTabKey} type={currentTabKey}
query={query} query={query}
......
src/modules/course-manage/video-course/modal/WatchDataModal.jsx
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @Date: 2020-05-19 11:01:31 * @Date: 2020-05-19 11:01:31
* @Last Modified by: 吴文洁 * @Last Modified by: 吴文洁
* @Last Modified time: 2020-05-25 16:50:47 * @Last Modified time: 2020-05-25 16:50:47
* @Description 余额异常弹窗 * @Description 学员观看数据弹窗
*/ */
import User from '@/common/js/user'; import User from '@/common/js/user';
import { PageControl, XMTable } from '@/components'; import { PageControl, XMTable } from '@/components';
...@@ -128,65 +128,52 @@ class WatchDataModal extends React.Component { ...@@ -128,65 +128,52 @@ class WatchDataModal extends React.Component {
const { visible, size, dataSource, totalCount, query } = this.state; const { visible, size, dataSource, totalCount, query } = this.state;
return ( return (
<Modal <Modal
title='视频课观看数据' title="线上课观看数据"
visible={visible} visible={visible}
footer={null} footer={null}
onCancel={this.onClose} onCancel={this.onClose}
maskClosable={false} maskClosable={false}
className='watch-data-modal' className="watch-data-modal"
closable={true} closable={true}
width={800} width={800}
closeIcon={<span className='icon iconfont modal-close-icon'>&#xe6ef;</span>}> closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
<div className='search-container'> >
<Search <div className="search-container">
placeholder='搜索学员姓名/手机号' <Search placeholder="搜索学员姓名/手机号" style={{ width: 200 }} onChange={(e) => { this.handleChangNickname(e.target.value)}} onSearch={ () => { this.handleFetchDataList()}} enterButton={<span className="icon iconfont">&#xe832;</span>}/>
style={{ width: 200 }}
onChange={(e) => {
this.handleChangNickname(e.target.value);
}}
onSearch={() => {
this.handleFetchDataList();
}}
enterButton={<span className='icon iconfont'>&#xe832;</span>}
/>
</div> </div>
<div> <div>
<XMTable <XMTable
renderEmpty={{ renderEmpty={{
image: college, image: college,
description: '暂无数据', description: '暂无数据',
}} }}
rowKey={(record) => record.id} rowKey={record => record.id}
dataSource={dataSource} dataSource={dataSource}
columns={this.parseColumns()} columns={this.parseColumns()}
pagination={false} pagination={false}
bordered bordered
/> />
{dataSource.length > 0 && ( {dataSource.length >0 &&
<div className='box-footer'> <div className="box-footer">
<PageControl <PageControl
current={query.current - 1} current={query.current - 1}
pageSize={size} pageSize={size}
total={totalCount} total={totalCount}
size='small' size="small"
toPage={(page) => { toPage={(page) => {
const _query = { ...query, current: page + 1 }; const _query = {...query, current: page + 1};
this.setState( this.setState({
{ query:_query
query: _query, },()=>{ this.handleFetchDataList()})
},
() => {
this.handleFetchDataList();
}
);
}} }}
onShowSizeChange={this.onShowSizeChange} onShowSizeChange={this.onShowSizeChange}
/> />
</div> </div>
)} }
</div> </div>
</Modal> </Modal>
); )
} }
} }
......
src/modules/home/Home.jsx
...@@ -343,7 +343,7 @@ class Home extends React.Component { ...@@ -343,7 +343,7 @@ class Home extends React.Component {
</div> </div>
</div> </div>
<div className='course-item'> <div className='course-item'>
<div className='course-title'>视频课</div> <div className='course-title'>线上课</div>
<div className='data'> <div className='data'>
<span className='course-number'>{videoCourseNum}</span> <span className='course-number'>{videoCourseNum}</span>
{incVideoCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>} {incVideoCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
...@@ -409,9 +409,8 @@ class Home extends React.Component { ...@@ -409,9 +409,8 @@ class Home extends React.Component {
</span> </span>
<span <span
className={`tab${scheduleType === 'VOICE' ? ' selected' : ''}`} className={`tab${scheduleType === 'VOICE' ? ' selected' : ''}`}
onClick={() => this.setState({ scheduleType: 'VOICE' }, () => this.getHotCourse())}> onClick={() => this.setState({ scheduleType: 'VOICE' }, () => this.getHotCourse())}
视频课 >线上课</span>
</span>
<span <span
className={`tab${scheduleType === 'PICTURE' ? ' selected' : ''}`} className={`tab${scheduleType === 'PICTURE' ? ' selected' : ''}`}
onClick={() => this.setState({ scheduleType: 'PICTURE' }, () => this.getHotCourse())}> onClick={() => this.setState({ scheduleType: 'PICTURE' }, () => this.getHotCourse())}>
......
src/modules/knowledge-base/ENUM.js
...@@ -55,7 +55,7 @@ const ENUM = { ...@@ -55,7 +55,7 @@ const ENUM = {
CourseTypeEnum: { CourseTypeEnum: {
LIVE: "直播课", LIVE: "直播课",
VOICE: "视频课", VOICE: "线上课",
PICTURE: "图文课", PICTURE: "图文课",
FOLDER: "学习资料", FOLDER: "学习资料",
}, },
......
src/modules/knowledge-base/components/KnowledgeBaseFilter.jsx
...@@ -65,10 +65,11 @@ class KnowledgeBaseFilter extends React.Component { ...@@ -65,10 +65,11 @@ class KnowledgeBaseFilter extends React.Component {
<Row type="flex" justify="space-between" align="top"> <Row type="flex" justify="space-between" align="top">
<div className="search-condition"> <div className="search-condition">
<div className="search-condition__item"> <div className="search-condition__item">
<span className="search-name">课程名称：</span> <span className="search-name">资料名称：</span>
<Search <Search
value={name} value={name}
placeholder="搜索课程名称" // allowClear
placeholder="搜索资料名称"
onChange={(e) => { onChange={(e) => {
this.handleChangeQuery("name", e.target.value, false); this.handleChangeQuery("name", e.target.value, false);
}} }}
...@@ -79,33 +80,6 @@ class KnowledgeBaseFilter extends React.Component { ...@@ -79,33 +80,6 @@ class KnowledgeBaseFilter extends React.Component {
enterButton={<span className="icon iconfont">&#xe832;</span>} enterButton={<span className="icon iconfont">&#xe832;</span>}
/> />
</div> </div>
<div className="search-condition__item">
<span className="shelf-status">课程类型：</span>
<Select
style={{ width: "calc(100% - 84px)" }}
placeholder="请选择课程类型"
allowClear={true}
value={type}
onChange={(value) => {
this.handleChangeQuery("type", value);
}}
suffixIcon={
<span
className="icon iconfont"
style={{ fontSize: "12px", color: "#BFBFBF" }}
>
&#xe835;
</span>
}
>
{Reflect.ownKeys(ENUM.CourseTypeEnum).map((item) => {
return (
<Option key={item} value={item}>{ENUM.CourseTypeEnum[item]}</Option>
);
})}
</Select>
</div>
</div> </div>
<div className="reset-fold-area"> <div className="reset-fold-area">
<Tooltip title="清空筛选"> <Tooltip title="清空筛选">
......
src/modules/knowledge-base/components/KnowledgeBaseList.jsx
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
import React from "react"; import React from "react";
import { Modal, message, Tooltip, Switch, Dropdown, Button } from "antd"; import { Modal, message, Tooltip, Switch, Dropdown, Button } from "antd";
import { FileTypeIcon, FileVerifyMap } from '@/common/constants/academic/lessonEnum';
import { Route, withRouter } from "react-router-dom"; import { Route, withRouter } from "react-router-dom";
import { PageControl, XMTable } from "@/components"; import { PageControl, XMTable } from "@/components";
import { LIVE_SHARE_MAP } from "@/common/constants/academic/cloudClass"; import { LIVE_SHARE_MAP } from "@/common/constants/academic/cloudClass";
...@@ -181,161 +182,20 @@ class KnowledgeBaseList extends React.Component { ...@@ -181,161 +182,20 @@ class KnowledgeBaseList extends React.Component {
const { current, size } = query const { current, size } = query
const columns = [ const columns = [
{ {
title: "课程名称", title: "名称",
key: "name", key: "name",
dataIndex: "name", dataIndex: "name",
width: 391,
fixed: "left",
render: (val, record) => { render: (val, record) => {
const { coverUrl, mediaCourseUrl, courseDivision } = record.source const { coverUrl, mediaCourseUrl, courseDivision } = record.source
let hasCover = false let hasCover = false
const type = record.type const type = record.type
return ( return (
<div>
{type === "LIVE" && (
<div className='record__item'>
{record.source &&
record.source.courseMediaVOS.map((item, index) => {
if (item.contentType === "COVER") {
hasCover = true
return <img className='course-cover' key={index} src={item.mediaUrl} />
}
})}
{!hasCover && (
<img
className="course-cover"
src={"https://image.xiaomaiketang.com/xm/Yip2YtFDwH.png"}
/>
)}
<div>
{val.length > 17 ? (
<Tooltip title={val}>
<div className='course-name'>{val}</div>
</Tooltip>
) : (
<div className='course-name'>{val}</div>
)}
<div>
<span className='course-time'>
{formatDate("YYYY-MM-DD H:i", parseInt(record.source.startTime))}~{formatDate("H:i", parseInt(record.source.endTime))}
</span>
<span
className='course-status'
style={{
color: ENUM.courseStateShow[record.source.courseState].color,
border: `1px solid ${ENUM.courseStateShow[record.source.courseState].color}`
}}>
{ENUM.courseStateShow[record.source.courseState].title}
</span>
{record.hideToUser && (
<Tooltip title={<div>课程未成功开课，已在学员知识列表中隐藏</div>}>
<i
className='icon iconfont'
style={{
marginLeft: "5px",
cursor: "pointer",
color: "#FF4F4F",
fontSize: "14px"
}}>
&#xe61d;
</i>
</Tooltip>
)}
</div>
<div className='teacher-assistant'>
{record.source.teacherName.length > 4 ? (
<Tooltip title={record.source.teacherName}>
<span className='teacher'>讲师：{record.source.teacherName}</span>
</Tooltip>
) : (
<span className='teacher'>讲师：{record.source.teacherName}</span>
)}
{record.source.admins.length > 0 && (
<>
<span className='split'> | </span>
{this.handleAdminName(record.source.admins).length > 4 ? (
<Tooltip title={this.handleAdminName(record.source.admins)}>
<span className='assistant'>
助教：
{record.source.admins.map((item, index) => {
return (
<span>
{item.adminName} {index < record.source.admins.length - 1 && <span> 、</span>}{" "}
</span>
)
})}
</span>
</Tooltip>
) : (
<span className='assistant'>
助教：
{record.source.admins.map((item, index) => {
return (
<span key={index}>
{item.adminName} {index < record.source.admins.length - 1 && <span> 、</span>}{" "}
</span>
)
})}
</span>
)}
</>
)}
</div>
</div>
</div>
)}
{type === "VOICE" && (
<div className='record__item'>
{/* 上传了封面的话就用上传的封面, 没有的话就取视频的第一帧 */}
<img
className='course-cover'
src={
coverUrl
? coverUrl
: courseDivision !== "EXTERNAL"
? `${mediaCourseUrl}?x-oss-process=video/snapshot,t_0,m_fast`
: "https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png"
}
alt=''
/>
{val.length > 25 ? (
<Tooltip title={val}>
<div className='course-name clamp'>{val}</div>
</Tooltip>
) : (
<div className='course-name clamp'>{val}</div>
)}
</div>
)}
{type === "PICTURE" && (
<div className="record__item">
<img
className="course-cover"
src={
coverUrl ||
"https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png"
}
/>
{val.length > 25 ? (
<Tooltip title={val}>
<div className='course-name clamp'>{val}</div>
</Tooltip>
) : (
<div className='course-name clamp'>{val}</div>
)}
</div>
)}
{type === "FOLDER" && (
<div <div
className='record__item' className='record__item'
onClick={() => { onClick={() => {
this.handleScanFile(record.source) this.handleScanFile(record.source)
}}> }}>
<div className={`folder-type ${record.source && record.source.folderFormat}`} /> <img src={FileTypeIcon[record.source.folderFormat] } style={{width:24,height:24}} alt='' className='item-img' />
{val.length > 25 ? ( {val.length > 25 ? (
<Tooltip title={val}> <Tooltip title={val}>
<div className='course-name clamp'>{val}</div> <div className='course-name clamp'>{val}</div>
...@@ -344,22 +204,11 @@ class KnowledgeBaseList extends React.Component { ...@@ -344,22 +204,11 @@ class KnowledgeBaseList extends React.Component {
<div className='course-name clamp'>{val}</div> <div className='course-name clamp'>{val}</div>
)} )}
</div> </div>
)}
</div>
) )
} }
}, },
{ {
title: "课程类型",
key: "type",
dataIndex: "type",
align: "center",
// width: 100,
render: (val, record) => {
return <div className=''>{val ? ENUM.CourseTypeEnum[val] : "-"}</div>
}
},
{
title: "创建人", title: "创建人",
key: "createName", key: "createName",
dataIndex: "createName", dataIndex: "createName",
...@@ -393,7 +242,7 @@ class KnowledgeBaseList extends React.Component { ...@@ -393,7 +242,7 @@ class KnowledgeBaseList extends React.Component {
}, },
{ {
title: "", title: "",
width: 48
}, },
{ {
title: "操作", title: "操作",
...@@ -452,7 +301,6 @@ class KnowledgeBaseList extends React.Component { ...@@ -452,7 +301,6 @@ class KnowledgeBaseList extends React.Component {
const { match } = this.props; const { match } = this.props;
localStorage.setItem("WatchData_CourseName", item.name); localStorage.setItem("WatchData_CourseName", item.name);
window.RCHistory.push({ window.RCHistory.push({
// pathname: `${match.url}/course-data?type=${item.courseType}&id=${item.liveCourseId}`,
pathname: `${match.url}/course-data?type=${item.type}&id=${item.id}` pathname: `${match.url}/course-data?type=${item.type}&id=${item.id}`
}) })
} }
...@@ -501,7 +349,7 @@ class KnowledgeBaseList extends React.Component { ...@@ -501,7 +349,7 @@ class KnowledgeBaseList extends React.Component {
dataSource={dataSource} dataSource={dataSource}
columns={this.parseColumns()} columns={this.parseColumns()}
pagination={false} pagination={false}
scroll={{ x: 900 }}
bordered bordered
className="knowledge-list-table" className="knowledge-list-table"
renderEmpty={{ renderEmpty={{
......
src/modules/knowledge-base/components/KnowledgeBaseList.less
...@@ -109,7 +109,10 @@ ...@@ -109,7 +109,10 @@
.knowledge-base-list { .knowledge-base-list {
.record__item { .record__item {
display: flex; display: flex;
// align-items: center; align-items: center;
.item-img{
margin-right: 4px;
}
.course-cover { .course-cover {
min-width: 107px; min-width: 107px;
max-width: 90px; max-width: 90px;
...@@ -153,13 +156,7 @@ ...@@ -153,13 +156,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
height: 20px; height: 20px;
&.clamp {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: normal;
height: 40px;
}
} }
.course-time { .course-time {
font-size: 12px; font-size: 12px;
......
src/modules/knowledge-base/components/KnowledgeBaseOpt.jsx
...@@ -9,10 +9,8 @@ ...@@ -9,10 +9,8 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { Button, Menu, Dropdown,message, Modal } from "antd"; import { Button, Menu, Dropdown, message, Modal } from "antd";
import SelectPrepareFileModal from "@/modules/prepare-lesson/modal/SelectPrepareFileModal"; import SelectPrepareFileModal from "@/modules/prepare-lesson/modal/SelectPrepareFileModal";
import { DownOutlined } from "@ant-design/icons";
import AddCourse from "../modal/AddCourse";
import User from "@/common/js/user"; import User from "@/common/js/user";
import Service from "@/common/js/service"; import Service from "@/common/js/service";
import KnowledgeAPI from "@/data-source/knowledge/request-api"; import KnowledgeAPI from "@/data-source/knowledge/request-api";
...@@ -31,16 +29,7 @@ export default function KnowledgeBaseOpt({ ...@@ -31,16 +29,7 @@ export default function KnowledgeBaseOpt({
const [openMoveModal, setOpenMoveModal] = useState(false); const [openMoveModal, setOpenMoveModal] = useState(false);
const [data, setData] = useState([]); const [data, setData] = useState([]);
const menu = (
<Menu>
<Menu.Item key="1" style={{ textAlign: "center" }}>
<span onClick={handAddCourse}>添加课程</span>
</Menu.Item>
<Menu.Item key="2" style={{ textAlign: "center" }}>
<span onClick={handleAddFile}>添加资料</span>
</Menu.Item>
</Menu>
);
useEffect(() => { useEffect(() => {
queryCategoryTree(); queryCategoryTree();
...@@ -76,19 +65,6 @@ export default function KnowledgeBaseOpt({ ...@@ -76,19 +65,6 @@ export default function KnowledgeBaseOpt({
return newTreeData; return newTreeData;
}; };
function handAddCourse() {
let modal = (
<AddCourse
onClose={() => {
setModal(null);
}}
onChange={onChange}
categoryId={categoryId}
updateCategoryTree={updateCategoryTree}
></AddCourse>
);
setModal(modal);
}
function handUpload(refIds) { function handUpload(refIds) {
const params = { const params = {
...@@ -118,7 +94,7 @@ export default function KnowledgeBaseOpt({ ...@@ -118,7 +94,7 @@ export default function KnowledgeBaseOpt({
isOpen={true} isOpen={true}
accept=".ppt,.pptx,.doc,.docx,.pdf,.jpg,.jpeg,.png,.xlsx,.xls" accept=".ppt,.pptx,.doc,.docx,.pdf,.jpg,.jpeg,.png,.xlsx,.xls"
tooltip="支持文件类型：ppt、word、excel、pdf、jpg、jpeg、png" tooltip="支持文件类型：ppt、word、excel、pdf、jpg、jpeg、png"
selectTypeList={["JPG", "JPEG", "PNG",'DOC','PDF','EXCEL','application/msword','application/vnd.ms-powerpoint']} // DOC 包含 .pptx,.docx,.xls.XLSX,WORD:DOC selectTypeList={["JPG", "JPEG", "PNG", 'DOC', 'PDF', 'EXCEL', 'application/msword', 'application/vnd.ms-powerpoint']} // DOC 包含 .pptx,.docx,.xls.XLSX,WORD:DOC
onClose={() => { onClose={() => {
setModal(null); setModal(null);
}} }}
...@@ -205,12 +181,9 @@ export default function KnowledgeBaseOpt({ ...@@ -205,12 +181,9 @@ export default function KnowledgeBaseOpt({
return ( return (
<div className="knowledge-course-opt"> <div className="knowledge-course-opt">
{_.isEmpty(selectedRowKeys) ? {_.isEmpty(selectedRowKeys) ?
(categoryId !== '0' && <Dropdown overlay={menu}> categoryId !== '0' && <Button type="primary" onClick={handleAddFile} className="mr8">
<Button type="primary" className="mr8"> 添加资料
添加知识
<DownOutlined />
</Button> </Button>
</Dropdown>)
: <div className="select-container"> : <div className="select-container">
<span className="con"> <span className="con">
<div> <div>
......
src/modules/knowledge-base/modal/AddCourse.jsx
...@@ -107,11 +107,11 @@ class AddCourse extends React.Component { ...@@ -107,11 +107,11 @@ class AddCourse extends React.Component {
selectVideo: { selectVideo: {
external: [], external: [],
internal: [], internal: [],
}, //弹窗内已选择的视频课程 }, //弹窗内已选择的线上课程
currentVideoCourseListData: { currentVideoCourseListData: {
external: [], external: [],
internal: [], internal: [],
}, //页面中已关联的视频课程 }, //页面中已关联的线上课程
pictureDataSource: [], pictureDataSource: [],
pictureSize: 10, pictureSize: 10,
...@@ -201,7 +201,7 @@ class AddCourse extends React.Component { ...@@ -201,7 +201,7 @@ class AddCourse extends React.Component {
}); });
}; };
// 获取视频课列表 // 获取线上课列表
handleFetchVideoList = () => { handleFetchVideoList = () => {
const { videoQuery, videoSize, videoCourseDivision, videoDataSource, videoTotalCount } = this.state; const { videoQuery, videoSize, videoCourseDivision, videoDataSource, videoTotalCount } = this.state;
...@@ -866,7 +866,7 @@ class AddCourse extends React.Component { ...@@ -866,7 +866,7 @@ class AddCourse extends React.Component {
)} )}
</div> </div>
</TabPane> </TabPane>
<TabPane tab='视频课' key='VIDEO'> <TabPane tab='线上课' key='VIDEO'>
<Radio.Group value={videoCourseDivision} onChange={this.videoCourseDivisionChange} style={{ marginBottom: 8 }}> <Radio.Group value={videoCourseDivision} onChange={this.videoCourseDivisionChange} style={{ marginBottom: 8 }}>
<Radio.Button value='internal'>内部课程</Radio.Button> <Radio.Button value='internal'>内部课程</Radio.Button>
<Radio.Button value='external'>外部课程</Radio.Button> <Radio.Button value='external'>外部课程</Radio.Button>
......
src/modules/knowledge-base/modal/VideoList.jsx
...@@ -25,7 +25,7 @@ class VideoList extends React.Component { ...@@ -25,7 +25,7 @@ class VideoList extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
id: "", // 视频课ID id: "", // 线上课ID
studentIds: [], studentIds: [],
selectedRowKeys: [], selectedRowKeys: [],
query: { query: {
...@@ -33,8 +33,8 @@ class VideoList extends React.Component { ...@@ -33,8 +33,8 @@ class VideoList extends React.Component {
current: 1, current: 1,
storeId: User.getStoreId(), storeId: User.getStoreId(),
}, },
dataSource: [], // 视频课列表 dataSource: [], // 线上课列表
totalCount: 0, // 视频课数据总条数 totalCount: 0, // 线上课数据总条数
}; };
} }
...@@ -50,11 +50,11 @@ class VideoList extends React.Component { ...@@ -50,11 +50,11 @@ class VideoList extends React.Component {
} }
componentWillMount() { componentWillMount() {
// 获取视频课列表 // 获取线上课列表
this.handleFetchScheduleList(); this.handleFetchScheduleList();
} }
// 获取视频课列表 // 获取线上课列表
handleFetchScheduleList = (_query = {}) => { handleFetchScheduleList = (_query = {}) => {
const query = { const query = {
...this.state.query, ...this.state.query,
......
src/modules/plan-manage/components/BasicInfo.jsx
/* /*
* @Author: yuananting
* @Date: 2021-07-05 10:48:08
* @LastEditors: yuananting
* @LastEditTime: 2021-07-15 13:58:17
* @Description: 描述一下咯
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
/*
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-20 16:45:51 * @Date: 2021-02-20 16:45:51
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
...@@ -12,6 +21,7 @@ import { withRouter } from 'react-router-dom'; ...@@ -12,6 +21,7 @@ import { withRouter } from 'react-router-dom';
import SelectOperatorModal from '../modal/SelectOperatorModal'; import SelectOperatorModal from '../modal/SelectOperatorModal';
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal'; import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import GraphicsEditor from '@/modules/course-manage/components/GraphicsEditor';
import ImgClipModal from '@/components/ImgClipModal' import ImgClipModal from '@/components/ImgClipModal'
import './BasicInfo.less'; import './BasicInfo.less';
...@@ -124,10 +134,14 @@ class BasicInfo extends React.Component { ...@@ -124,10 +134,14 @@ class BasicInfo extends React.Component {
this.props.onChange(field, _percentCompleteLive); this.props.onChange(field, _percentCompleteLive);
}; };
changeIntro = (value) => {
this.props.onChange('introduce', value);
};
render() { render() {
const { operatorModalVisible, showSelectFileModal, visible, hasImgReady, cutImageBlob,imageFile} = this.state; const { operatorModalVisible, showSelectFileModal, visible, hasImgReady, cutImageBlob,imageFile} = this.state;
const { data } = this.props; const { data } = this.props;
const { planName, coverUrl, instro, enableState, operateType, selectOperatorList, percentCompleteLive, percentCompleteVideo, percentCompletePicture } = const { planName, coverUrl, introduce, enableState, operateType, selectOperatorList, percentCompleteLive, percentCompleteVideo, percentCompletePicture } =
data; data;
// 当前是否使用的是默认图片 // 当前是否使用的是默认图片
const isDefaultCover = coverUrl === defaultCover; const isDefaultCover = coverUrl === defaultCover;
...@@ -148,10 +162,6 @@ class BasicInfo extends React.Component { ...@@ -148,10 +162,6 @@ class BasicInfo extends React.Component {
<div className='cover'> <div className='cover'>
<span className='label'>封面图：</span> <span className='label'>封面图：</span>
<div className='cover__wrap'> <div className='cover__wrap'>
<div className='img-content'>
{isDefaultCover && <span className='tag'>默认图</span>}
<img src={coverUrl} width='690' alt='' />
</div>
<div className='opt-btns'> <div className='opt-btns'>
<Button <Button
onClick={() => { onClick={() => {
...@@ -166,36 +176,44 @@ class BasicInfo extends React.Component { ...@@ -166,36 +176,44 @@ class BasicInfo extends React.Component {
</span> </span>
<div className='tips'>建议尺寸1280*720px或16:9。封面图最大5M，支持jpg、jpeg和png。</div> <div className='tips'>建议尺寸1280*720px或16:9。封面图最大5M，支持jpg、jpeg和png。</div>
</div> </div>
<div className='img-content'>
{isDefaultCover && <span className='tag'>默认图</span>}
<img src={coverUrl} width='690' alt='' />
</div>
</div> </div>
</div> </div>
<div className='introduction'> <div className='introduction'>
<span className='label'>简介：</span> <span className='label'>简介：</span>
<TextArea {/* <TextArea
placeholder='请输入培训计划简介' placeholder='请输入培训计划简介'
maxLength={200} maxLength={200}
style={{ width: '552px', height: '110px' }} style={{ width: '552px', height: '110px' }}
className='instro-textarea' className='instro-textarea'
value={instro} value={instro}
onChange={(e) => this.props.onChange('instro', e.target.value)} onChange={(e) => this.props.onChange('instro', e.target.value)}
/> */}
<GraphicsEditor
id='intro'
isIntro={true}
maxLimit={1000}
detail={{
content: introduce,
}}
onChange={(val) => {
this.changeIntro(val);
}}
/> />
</div> </div>
<div className='wether-use'> <div className='wether-use'>
<span className='label'>是否启用：</span> <span className='label'>是否启用：</span>
<div className='content'> <div className='content'>
<div>
<Switch <Switch
checked={enableState === 'YES' ? true : false} checked={enableState === 'YES' ? true : false}
onChange={() => { onChange={() => {
this.enableStateChange(); this.enableStateChange();
}} }}
/> />
</div> <div className='instro-text'>{enableState === 'YES' ? '已开启，培训计划可正常分享给学员学习' : '已关闭，培训计划暂不进行分享和学习'}</div>
<div>
<div className='instro-text'>
<div>开启：此培训计划可以分享给学员进行学习</div>
<div>关闭：此培训计划暂不可分享给学员进行学习，后续可开启</div>
</div>
</div>
</div> </div>
</div> </div>
<div className='view-range'> <div className='view-range'>
...@@ -213,7 +231,7 @@ class BasicInfo extends React.Component { ...@@ -213,7 +231,7 @@ class BasicInfo extends React.Component {
onChange={(e) => { onChange={(e) => {
this.props.onChange('operateType', e.target.value); this.props.onChange('operateType', e.target.value);
}}> }}>
<Row style={{ marginBottom: '5px' }}> <Row style={{ marginBottom: '16px' }}>
<Col span={24}> <Col span={24}>
<Radio value='All_Operate'> <Radio value='All_Operate'>
所有运营师 所有运营师
...@@ -239,7 +257,7 @@ class BasicInfo extends React.Component { ...@@ -239,7 +257,7 @@ class BasicInfo extends React.Component {
选择运营师 选择运营师
</Button> </Button>
<span> <span>
已选择<span>{selectOperatorList.length}</span>名运营师 已选择 <span style={{ color: '#2966FF' }}>{selectOperatorList.length}</span> 名运营师
</span> </span>
</div> </div>
)} )}
...@@ -269,7 +287,7 @@ class BasicInfo extends React.Component { ...@@ -269,7 +287,7 @@ class BasicInfo extends React.Component {
<div className='live-standard-info'> <div className='live-standard-info'>
<span className='icon iconfont'>&#xe864;</span> <span className='icon iconfont'>&#xe864;</span>
<span className='instro'> <span className='instro'>
视频课单个课程，学员学习进度达到 线上课单个课节，学员学习进度达到
<Input <Input
width='40' width='40'
value={percentCompleteVideo} value={percentCompleteVideo}
...@@ -279,7 +297,7 @@ class BasicInfo extends React.Component { ...@@ -279,7 +297,7 @@ class BasicInfo extends React.Component {
onBlur={(e) => this.percentCompleteBlur(e, 'percentCompleteVideo')} onBlur={(e) => this.percentCompleteBlur(e, 'percentCompleteVideo')}
className='input-box' className='input-box'
/> />
%，即视为"已完成"学习 %，即课节视为"已完成"学习
</span> </span>
</div> </div>
<div className='live-standard-info'> <div className='live-standard-info'>
......
src/modules/plan-manage/components/BasicInfo.less
.plan-basic-info{ .plan-basic-info {
.label { .label {
width: 110px; width: 110px;
text-align: right; text-align: right;
display:inline-block; display: inline-block;
font-size:14px; font-size: 14px;
color:#666; color: #666;
.require { .require {
color: #EC4B35; color: #ec4b35;
} }
.iconfont{ .iconfont {
font-size:14px; font-size: 14px;
color:#BFBFBF; color: #bfbfbf;
} }
} }
.cover { .cover {
display: flex; display: flex;
margin-top: 16px; margin-top: 24px;
&__wrap { &__wrap {
position: relative; position: relative;
display: flex;
.tag { .tag {
border-radius: 2px; border-radius: 2px;
background: #D6D6D6; background: #d6d6d6;
font-size: 12px; font-size: 12px;
height: 18px; height: 18px;
width: 52px; width: 52px;
text-align: center; text-align: center;
color: #FFF; color: #fff;
position: absolute; position: absolute;
top: 8px; top: 8px;
left: 8px; left: 8px;
} }
} }
.img-content { .img-content {
margin-right: 20px; position: relative;
margin-top: 8px;
width: 299px; width: 299px;
height: 169px; height: 169px;
img { img {
...@@ -42,90 +42,93 @@ ...@@ -42,90 +42,93 @@
object-fit: contain; object-fit: contain;
} }
} }
.opt-btns{ .opt-btns {
.default-btn { .default-btn {
margin:0 8px; margin-left: 14px;
color: #2966FF; color: #2966ff;
cursor: pointer; cursor: pointer;
&.disabled { &.disabled {
color: #CCC; color: #ccc;
cursor: not-allowed; cursor: not-allowed;
} }
} }
.tips{ .tips {
margin-top:8px; margin-top: 8px;
font-size:14px; font-size: 14px;
color:#999; color: #999;
} }
} }
} }
.introduction{ .introduction {
margin-top:16px; display: flex;
.instro-textarea{ margin-top: 24px;
.instro-textarea {
vertical-align: top; vertical-align: top;
} }
} }
.wether-use{ .wether-use {
display:flex; display: flex;
margin-top:16px; margin-top: 34px;
.instro-text{ .instro-text {
color:#999; color: #999;
margin-left:12px; margin-left: 12px;
} }
.content{ .content {
display:flex; display: flex;
} }
} }
.view-range{ .view-range {
display:flex; display: flex;
margin-top:16px; margin-top: 24px;
.label{ .label {
margin-top:2px; margin-top: 2px;
} }
.instro-text{ .instro-text {
color:#999; color: #999;
margin-left:12px; margin-left: 12px;
} }
.choose-business{ .choose-business {
margin-top:16px; margin-top: 12px;
.ant-btn {
margin-right: 12px;
} }
.playback__text{
margin-left:12px;
color:#999999;
} }
.playback__text {
margin-left: 12px;
color: #999999;
} }
.done-standard{ }
.done-standard {
display: flex; display: flex;
margin-top:22px; margin-top: 22px;
.standard-label{ .standard-label {
margin-top:3px; margin-top: 3px;
} }
.live-standard-info{ .live-standard-info {
margin-bottom:10px; margin-bottom: 10px;
} }
input{ input {
display:inline-block; display: inline-block;
width:90px; width: 90px;
height:32px; height: 32px;
} }
.icon{ .icon {
color:#A0A0A0; color: #a0a0a0;
font-size:14px; font-size: 14px;
margin-right:4px; margin-right: 4px;
} }
.instro{ .instro {
color:#333333; color: #333333;
font-size:14px; font-size: 14px;
} }
.input-box{ .input-box {
width: 60px; width: 60px;
height: 32px; height: 32px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #E8E8E8; border: 1px solid #e8e8e8;
color:#333333; color: #333333;
font-size:14px; font-size: 14px;
margin:0 2px; margin: 0 2px;
} }
} }
} }
src/modules/plan-manage/components/ExpiredCourseList.jsx
...@@ -18,7 +18,7 @@ function ExpiredCourseList(props) { ...@@ -18,7 +18,7 @@ function ExpiredCourseList(props) {
<span>直播课</span> <span>直播课</span>
} }
{ item.courseType === "VOICE " && { item.courseType === "VOICE " &&
<span>视频课</span> <span>线上课</span>
} }
</div> </div>
<div className="course-instro"> <div className="course-instro">
......
src/modules/plan-manage/modal/UserLearnDetailModal.less
.user-Learn-modal{ .user-Learn-modal {
.customer-info {
.customer-info{ margin-bottom: 16px;
margin-bottom:16px; .customer-name {
.customer-name{ font-size: 14px;
font-size:14px; color: #333;
color:#333; margin-right: 32px;
margin-right:32px;
} }
.customer-phone{ .customer-phone {
font-size:14px; font-size: 14px;
color:#333; color: #333;
} }
} }
.plan-instro{ .plan-instro {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom:16px; margin-bottom: 16px;
.img-con{ .img-con {
margin-right:8px; margin-right: 8px;
img{ img {
width: 97px; width: 97px;
height: 54px; height: 54px;
display: inline-block; display: inline-block;
border-radius:4px; border-radius: 4px;
}
}
.plan-name{
color:#333;
font-size:16px;
}
.plan-learn-percentage{
color:#333;
font-size:14px;
}
}
.task-table{
.ant-table-thead{
tr {
th{
padding:9px 16px;
}
}
}
tr{
td{
padding:14px 16px;
}
}
.taskName{
color:#333;
font-size:14px;
}
.task-learn-percentage{
color:#333;
font-size:14px;
}
.course-info{
display:flex;
margin-left:57px;
align-items: center;
.course-type{
font-size:11px;
color:#666666;
padding:0px 6px;
border: 1px solid #999999;
margin-right:4px;
border-radius: 2px;
line-height: 16px;
}
.name-and-state{
flex:1;
.course-name{
color:#666666;
font-size:14px;
margin-right:8px;
}
.tip{
font-size:14px;
color:#FF4F4F;
margin-right:2px;
}
.course-state{
color:#999;
font-size:14px;
}
}
}
.ant-table-expanded-row{
td{
padding:0 16px;
}
} }
.ant-table-content{
border:1px solid #e8e8e8;
tr{
td{
border:none;
} }
.child-table{ .plan-name {
color: #333;
.ant-table-content{ font-size: 16px;
border:none;
thead{
display:none;
}
tbody tr {
td{
border-bottom:none;
padding:14px 16px;
} }
.plan-learn-percentage {
color: #333;
font-size: 14px;
} }
} }
.table-box {
.child-table {
margin-left: 40px;
tr > td {
&:first-child {
padding-right: 0 !important;
} }
} &:nth-child(2) {
.odd-row{ padding-left: 0 !important;
background:transparent;
td{
background: #FFF;
}
& + .ant-table-expanded-row{
background:transparent;
td{
background: #FFF;
}
}
&:hover{
& + .ant-table-expanded-row{
background:transparent;
td{
background: #F3f6fa !important;
}
} }
} }
.course-info {
display: flex;
.course-type {
border-radius: 2px;
border: 1px solid #999999;
font-size: 11px;
color: #666666;
padding: 1px 8px;
margin-right: 6px;
} }
.even-row{
background:transparent;
td{
background: #FAFAFA;
}
& + .ant-table-expanded-row{
background:transparent;
td{
background: #FAFAFA;
} }
} }
&:hover{ .chapter-record {
& + .ant-table-expanded-row{ display: flex;
background:transparent; align-items: center;
td{ .chapter-img {
background: #F3f6fa !important; width: 18px;
height: 18px;
margin: 0 10px;
} }
} }
.record-name {
display: flex;
align-items: center;
.img-con {
margin-right: 8px;
img {
width: 97px;
height: 54px;
border-radius: 4px;
} }
} }
} }
......
src/modules/plan-manage/modal/relatedCourseModal.jsx
/*
* @Author: yuananting
* @Date: 2021-07-05 10:50:10
* @LastEditors: yuananting
* @LastEditTime: 2021-07-13 19:55:29
* @Description: 描述一下咯
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from 'react'; import React from 'react';
import _ from 'underscore'; import _ from 'underscore';
import { Table, Radio, Tabs, Modal, Input, message, Button, Tooltip } from 'antd'; import { Table, Radio, Tabs, Modal, Input, message, Button, Tooltip } from 'antd';
import { PageControl, XMTable } from '@/components'; import { PageControl } from '@/components';
import college from '@/common/lottie/college';
import CourseService from '@/domains/course-domain/CourseService'; import CourseService from '@/domains/course-domain/CourseService';
import User from '@/common/js/user'; import User from '@/common/js/user';
...@@ -79,11 +87,11 @@ class SelectOperatorModal extends React.Component { ...@@ -79,11 +87,11 @@ class SelectOperatorModal extends React.Component {
selectVideo: { selectVideo: {
external: [], external: [],
internal: [], internal: [],
}, //弹窗内已选择的视频课程 }, //弹窗内已选择的线上课程
currentVideoCourseListData: { currentVideoCourseListData: {
external: [], external: [],
internal: [], internal: [],
}, //页面中已关联的视频课程 }, //页面中已关联的线上课程
pictureDataSource: [], pictureDataSource: [],
pictureSize: 10, pictureSize: 10,
...@@ -91,10 +99,10 @@ class SelectOperatorModal extends React.Component { ...@@ -91,10 +99,10 @@ class SelectOperatorModal extends React.Component {
current: 1, current: 1,
}, },
pictureTotalCount: 0, pictureTotalCount: 0,
selectPicture: [], //弹窗内已选择的视频课程 selectPicture: [], //弹窗内已选择的线上课程
currentPictureCourseListData: [], //页面中已关联的视频课程 currentPictureCourseListData: [], //页面中已关联的线上课程
activeKey: 'video', activeKey: 'live',
currentTaskCourseData: this.props.data[this.props.selectedTaskIndex].courseList || [], currentTaskCourseData: this.props.data[this.props.selectedTaskIndex].courseList || [],
}; };
} }
...@@ -136,7 +144,7 @@ class SelectOperatorModal extends React.Component { ...@@ -136,7 +144,7 @@ class SelectOperatorModal extends React.Component {
}); });
}; };
// 获取视频课列表 // 获取线上课列表
handleFetchVideoDataList = () => { handleFetchVideoDataList = () => {
const { videoQuery, videoSize, videoDataSource, videoTotalCount, videoCourseDivision } = this.state; const { videoQuery, videoSize, videoDataSource, videoTotalCount, videoCourseDivision } = this.state;
...@@ -370,7 +378,6 @@ class SelectOperatorModal extends React.Component { ...@@ -370,7 +378,6 @@ class SelectOperatorModal extends React.Component {
// 请求表头 // 请求表头
parseVideoColumns = () => { parseVideoColumns = () => {
const { videoCourseDivision } = this.state;
const columns = [ const columns = [
{ {
title: ( title: (
...@@ -387,33 +394,23 @@ class SelectOperatorModal extends React.Component { ...@@ -387,33 +394,23 @@ class SelectOperatorModal extends React.Component {
dataIndex: 'course', dataIndex: 'course',
width: '60%', width: '60%',
render: (val, record) => { render: (val, record) => {
const { coverUrl, scheduleVideoUrl } = record; const { coverUrl } = record;
return ( return (
<div className='course-info'> <div className='course-info'>
{/* 上传了封面的话就用上传的封面, 没有的话就取视频的第一帧 */} <img className='course-cover' src={coverUrl || 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png'} alt='' />
<img
className='course-cover'
src={
coverUrl ||
(videoCourseDivision === 'internal'
? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast`
: 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png')
}
alt=''
/>
<div className='course-name'>{record.courseName}</div> <div className='course-name'>{record.courseName}</div>
</div> </div>
); );
}, },
}, },
{ {
title: '课程时长', title: '课节数',
key: 'courseTime', key: 'courseChapterNum',
dataIndex: 'courseTime', dataIndex: 'courseChapterNum',
width: '20%', width: '20%',
align: 'right',
render: (val, record) => { render: (val, record) => {
return <span className='course-status'>{dealTimeDuration(record.videoDuration)}</span>; return <span>{val || 1}</span>;
}, },
}, },
{ {
...@@ -555,6 +552,7 @@ class SelectOperatorModal extends React.Component { ...@@ -555,6 +552,7 @@ class SelectOperatorModal extends React.Component {
_item.courseId = item.id; _item.courseId = item.id;
_item.courseType = 'VOICE'; _item.courseType = 'VOICE';
_item.courseName = item.courseName; _item.courseName = item.courseName;
_item.courseChapterNum = item.courseChapterNum
return _item; return _item;
}); });
...@@ -616,7 +614,7 @@ class SelectOperatorModal extends React.Component { ...@@ -616,7 +614,7 @@ class SelectOperatorModal extends React.Component {
className='link-create-course' className='link-create-course'
href={window.location.origin + window.location.pathname + '#/create-video-course?type=add'} href={window.location.origin + window.location.pathname + '#/create-video-course?type=add'}
onClick={this.props.onClose}> onClick={this.props.onClose}>
没有找到需要的视频课？<span>去创建</span> 没有找到需要的线上课？<span>去创建</span>
</a> </a>
); );
break; break;
...@@ -734,11 +732,7 @@ class SelectOperatorModal extends React.Component { ...@@ -734,11 +732,7 @@ class SelectOperatorModal extends React.Component {
</div> </div>
</div> </div>
<div> <div>
<XMTable <Table
renderEmpty={{
image: college,
description: '暂无数据',
}}
rowKey={(record) => record.liveCourseId} rowKey={(record) => record.liveCourseId}
dataSource={liveDataSource} dataSource={liveDataSource}
columns={this.parseLiveColumns()} columns={this.parseLiveColumns()}
...@@ -792,7 +786,7 @@ class SelectOperatorModal extends React.Component { ...@@ -792,7 +786,7 @@ class SelectOperatorModal extends React.Component {
</div> </div>
</TabPane> </TabPane>
<TabPane tab='视频课' key='video'> <TabPane tab='线上课' key='video'>
<Radio.Group value={videoCourseDivision} onChange={this.videoCourseDivisionChange} style={{ marginBottom: 16 }}> <Radio.Group value={videoCourseDivision} onChange={this.videoCourseDivisionChange} style={{ marginBottom: 16 }}>
<Radio.Button value='internal'>内部课程</Radio.Button> <Radio.Button value='internal'>内部课程</Radio.Button>
<Radio.Button value='external'>外部课程</Radio.Button> <Radio.Button value='external'>外部课程</Radio.Button>
...@@ -830,11 +824,7 @@ class SelectOperatorModal extends React.Component { ...@@ -830,11 +824,7 @@ class SelectOperatorModal extends React.Component {
</div> </div>
</div> </div>
<div> <div>
<XMTable <Table
renderEmpty={{
image: college,
description: '暂无数据',
}}
rowKey={(record) => record.id} rowKey={(record) => record.id}
dataSource={videoDataSource[videoCourseDivision]} dataSource={videoDataSource[videoCourseDivision]}
columns={this.parseVideoColumns()} columns={this.parseVideoColumns()}
...@@ -939,11 +929,7 @@ class SelectOperatorModal extends React.Component { ...@@ -939,11 +929,7 @@ class SelectOperatorModal extends React.Component {
</div> </div>
</div> </div>
<div> <div>
<XMTable <Table
renderEmpty={{
image: college,
description: '暂无数据',
}}
rowKey={(record) => record.id} rowKey={(record) => record.id}
dataSource={pictureDataSource} dataSource={pictureDataSource}
columns={this.parsePictureColumns()} columns={this.parsePictureColumns()}
......
src/modules/prepare-lesson/modal/SelectPrepareFileModal.jsx
...@@ -221,6 +221,7 @@ class SelectPrepareFileModal extends React.Component { ...@@ -221,6 +221,7 @@ class SelectPrepareFileModal extends React.Component {
maxSelectLength maxSelectLength
} = this.props; } = this.props;
console.log('selectedFileList',selectedFileList)
if (multiple) { if (multiple) {
const currSelectedFileList = [...(prevSelectedFileList || []), ...selectedFileList]; const currSelectedFileList = [...(prevSelectedFileList || []), ...selectedFileList];
// 最多选择20个文件，判断是否超出了20个 // 最多选择20个文件，判断是否超出了20个
......
src/modules/resource-disk/modal/ScanFileModal.jsx
...@@ -37,7 +37,7 @@ class ScanFileModal extends React.Component { ...@@ -37,7 +37,7 @@ class ScanFileModal extends React.Component {
{fileType === "MP4" && ( {fileType === "MP4" && (
<div> <div>
<Player <Player
src={item.ossAddress || item.ossUrl} src={item.mediaUrl || item.ossAddress || item.ossUrl}
fluid={false} fluid={false}
height={306} height={306}
width={"100%"} width={"100%"}
......
src/modules/resource-disk/modal/ScanFileModal.less
...@@ -10,4 +10,7 @@ ...@@ -10,4 +10,7 @@
height: 60px; height: 60px;
} }
} }
.video-react .video-react-play-progress:after {
width: max-content;
}
} }
src/routes/config/mainRoutes.tsx
...@@ -81,7 +81,7 @@ const mainRoutes = [ ...@@ -81,7 +81,7 @@ const mainRoutes = [
{ {
path: '/video-course', path: '/video-course',
component: VideoCoursePage, component: VideoCoursePage,
name: '视频课', name: '线上课',
}, },
{ {
path: '/graphics-course', path: '/graphics-course',
...@@ -101,7 +101,7 @@ const mainRoutes = [ ...@@ -101,7 +101,7 @@ const mainRoutes = [
{ {
path: '/create-video-course', path: '/create-video-course',
component: AddVideoCoursePage, component: AddVideoCoursePage,
name: '创建视频课', name: '创建线上课',
}, },
{ {
path: '/knowledge-base', path: '/knowledge-base',
...@@ -163,7 +163,7 @@ const mainRoutes = [ ...@@ -163,7 +163,7 @@ const mainRoutes = [
{ {
path: '/create-plan', path: '/create-plan',
component: AddPlanPage, component: AddPlanPage,
name: '创建视频课', name: '创建线上课',
}, },
{ {
path: '/store-info', path: '/store-info',
......
src/routes/config/menuList.tsx
/* /*
* @Author: yuananting * @Author: yuananting
* @Date: 2021-02-21 15:53:31 * @Date: 2021-02-21 15:53:31
* @LastEditors: Please set LastEditors * @LastEditors: wufan
* @LastEditTime: 2021-06-08 16:46:15 * @LastEditTime: 2021-07-05 10:29:23
* @Description: 描述一下咯 * @Description: 描述一下咯
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -28,8 +28,8 @@ export const menuList: any = [ ...@@ -28,8 +28,8 @@ export const menuList: any = [
link: '/live-course', link: '/live-course',
}, },
{ {
groupName: '视频课', groupName: "线上课",
groupCode: 'CourseVideoClass', groupCode: "CourseVideoClass",
link: '/video-course', link: '/video-course',
}, },
{ {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment