Skip to content

X
xiaomai-cloud-class-web
Commit 8a0a2d29 by maolipeng
Options

Merge branch 'master' into feature/maolipeng/youhua

parents ae4d6a65 0fdf0087
Showing with 2162 additions and 1229 deletions
package.json
......@@ -110,6 +110,7 @@
"start:dev1": "cross-env DEPLOY_ENV=dev node scripts/start.js",
"start:rc": "cross-env DEPLOY_ENV=rc node scripts/start.js",
"start:gray": "cross-env DEPLOY_ENV=gray node scripts/start.js",
"start:prod": "cross-env DEPLOY_ENV=prod node scripts/start.js",
"build:dev": "cross-env DEPLOY_ENV=dev node scripts/build.js",
"build:dev1": "cross-env DEPLOY_ENV=dev node scripts/build.js",
"build:rc": "cross-env DEPLOY_ENV=rc node scripts/build.js",
......@@ -143,7 +144,6 @@
"@types/ali-oss": "^6.0.5",
"@types/jquery": "^3.5.4",
"ali-oss": "^6.12.0",
"react-sortable-hoc": "^1.11.0",
"vconsole-webpack-plugin": "^1.5.2"
"react-sortable-hoc": "^1.11.0"
}
}
src/bu-components/PreviewCourseModal.less
......@@ -13,8 +13,9 @@
}
.container {
overflow: scroll;
height: 100%;;
overflow-y: auto;
overflow-x: hidden;
height: 100%;
.course-cover, .course-url {
width: 100%;
......
src/bu-components/PreviewFileModal.less
......@@ -33,6 +33,7 @@
}
}
.operate{
display:inline-block;
margin-top:24px;
.btn {
padding:5px 12px;
......
src/common/constants/academic/lessonEnum.js
......@@ -44,6 +44,10 @@ const FileVerifyMap = {
type: "word",
maxSize: 100
},
"application/wps-writer": {
type: "word",
maxSize: 100,
},
"application/vnd.openxmlformats-officedocument.wordprocessingml.document": {
type: "word",
maxSize: 100
......@@ -133,12 +137,13 @@ const FileTypeIcon = {
PPTX: "https://image.xiaomaiketang.com/xm/847pFAdYGW.png",
PDF: "https://image.xiaomaiketang.com/xm/rrEJMNkhTG.png",
MP3: "https://image.xiaomaiketang.com/xm/ykjnSWDyQ6.png",
MP4: "https://image.xiaomaiketang.com/xm/whSYMTdR57.png",
MP4: "https://image.xiaomaiketang.com/xm/yK3ASiS8ch.png",
JPG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
JPEG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
PNG: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
GIF: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
BMP: "https://image.xiaomaiketang.com/xm/XRkX8JBTPs.png",
VIDEO: 'https://image.xiaomaiketang.com/xm/yK3ASiS8ch.png'
};
const UploadIcon = "https://image.xiaomaiketang.com/xm/4DXNrZWWsd.png";
......
src/common/js/axios.ts
/*
* @Author: 吴文洁
* @Date: 2020-08-31 09:34:31
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-24 19:34:21
* @LastEditors: yuananting
* @LastEditTime: 2021-07-12 17:40:26
* @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -115,6 +115,10 @@ class Axios {
window.RCHistory.replace('/login');
return Promise.reject();
break;
case 504:
message.error('网络状况不稳定，如果出现数据异常，请刷新页面');
Promise.reject();
break;
default:
message.error(error.message);
break;
......
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);
.ant-popover-inner-content {
padding: 0;
......
src/components/ContactWidget.tsx
......@@ -27,6 +27,7 @@ function Content() {
export default function ContactWidget(props:ContactWidgetProps) {
return <Popover
className="contact-widget-popover"
placement={props.placement}
arrowPointAtCenter
content={Content}
......
src/core/antd.less
......@@ -6,7 +6,7 @@
*/
@import './variables.less';
@active-color: #2966FF;
@active-color: #2966ff;
// 消息提示框
.ant-message {
......@@ -41,6 +41,9 @@
.ant-switch-small:after {
top: 0.3px;
}
tbody .ant-switch-small {
min-width: 32px;
}
.ant-pagination {
display: inline !important;
......@@ -234,7 +237,7 @@
}
.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
font-weight: 500!important;
font-weight: 500 !important;
}
.ant-tabs-nav .ant-tabs-tab-active {
......@@ -264,7 +267,7 @@
position: absolute;
width: 30px;
height: 4px;
background: #2966FF !important;
background: #2966ff !important;
left: 50%;
transform: translateX(-50%);
}
......@@ -339,14 +342,14 @@ mr0 {
background: #f3f6fa;
.ant-select-selected-icon {
color:#2966FF !important;
color: #2966ff !important;
}
}
.ant-select-dropdown-menu-item-selected {
background: none;
font-weight: 400 !important;
color:#2966FF;
color: #2966ff;
}
.ant-select-open .ant-select-selection {
......@@ -444,7 +447,7 @@ mr0 {
.ant-modal {
.ant-input {
&:focus {
border: 1px solid #2966FF !important;
border: 1px solid #2966ff !important;
}
}
}
......@@ -457,8 +460,8 @@ mr0 {
.ant-calendar-footer-extra {
.ant-tag-blue {
background: #fff;
color: #2966FF;
border-color: #2966FF;
color: #2966ff;
border-color: #2966ff;
}
}
}
......@@ -474,7 +477,7 @@ mr0 {
}
.ant-modal-confirm-info .ant-modal-confirm-body > .anticon {
color: #2966FF!important;
color: #2966ff !important;
}
.ant-breadcrumb > span:last-child .ant-breadcrumb-separator {
......@@ -502,7 +505,7 @@ mr0 {
font-size: 22px !important;
line-height: 22px !important;
float: left !important;
color:#2966FF !important;
color: #2966ff !important;
margin-right: 16px !important;
&.blue {
color: #5cbaff !important;
......@@ -527,8 +530,8 @@ mr0 {
float: left;
margin-right: 16px;
}
>.confirm-icon{
color: #2966FF;
> .confirm-icon {
color: #2966ff;
}
.ant-modal-confirm-content {
margin-left: 38px;
......@@ -594,9 +597,9 @@ mr0 {
// background: #FAFAFA !important;
// }
.ant-table-thead > tr > th{
font-weight:bold !important;
color:#333 !important;
.ant-table-thead > tr > th {
font-weight: bold !important;
color: #333 !important;
}
td.ant-table-column-sort {
background: none;
......@@ -657,11 +660,11 @@ td.ant-table-column-sort {
border-color: @xm-color-text-select-primary !important;
border: none !important;
&:hover {
background-color: #2966FF !important;
background-color: #2966ff !important;
opacity: 0.8 !important;
}
&:active{
background-color:#5C8AFF !important;
&:active {
background-color: #5c8aff !important;
}
}
......@@ -720,9 +723,9 @@ td.ant-table-column-sort {
border-right: 0px !important;
}
.ant-input-search > .ant-input-group > .ant-input-group-addon:last-child .ant-input-search-button span{
color:#bfbfbf !important;
font-size:12px;
.ant-input-search > .ant-input-group > .ant-input-group-addon:last-child .ant-input-search-button span {
color: #bfbfbf !important;
font-size: 12px;
}
.ant-modal-footer {
......@@ -774,4 +777,3 @@ td.ant-table-column-sort {
.ant-table-column-sorter {
margin-left: 8px !important;
}
src/core/function.js
......@@ -1155,4 +1155,16 @@ window.XMShowClassName = (date, itemName) => {
return '';
}
return 'new-icon'
}
\ No newline at end of file
}
// 格式化时间段为时分
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
* @Date: 2021-03-03 15:13:12
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-22 14:31:46
* @LastEditors: yuananting
* @LastEditTime: 2021-07-09 16:58:34
* @Description: 助学工具接口
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -88,3 +88,7 @@ export function batchQueryQuestionDetails(params: object) {
export function queryQuestionPageListWithContent(params: object) {
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/base/request-apis.ts
......@@ -2,7 +2,7 @@
* @Author: wufan
* @Date: 2020-12-01 17:21:21
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-22 14:56:34
* @LastEditTime: 2021-07-09 15:33:33
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -62,6 +62,9 @@ export function saveYoZoFileVersionId(params: object) {
export function yoZoUpload(ossUrl:String,appId:String,uploadSign:String){
return axios.post(`https://dmc.yozocloud.cn/api/file/http?fileUrl=${ossUrl}&appId=${appId}&sign=${uploadSign}`)
}
export function saveFileVersionIdByCourseChapter(params: object) {
return Service.Hades('public/hades/saveFileVersionIdByCourseChapter', params);
}
export const getOssClient = (
data: object,
instId: string,
......
src/data-source/course/request-api.ts
/*
* @Author: wufan
* @Date: 2020-12-12 11:57:10
* @LastEditors: zangsuyun
* @LastEditTime: 2021-03-22 13:54:20
* @LastEditors: wufan
* @LastEditTime: 2021-07-05 15:07:13
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -57,7 +57,7 @@ export function getLiveCloudCourseBasePage(params: object) {
return Service.Hades("public/courseCloud/getLiveCloudCourseBasePage", params);
}
//视频课相关接口
//线上课相关接口
export function changeVideoShelfState(params: object) {
return Service.Hades("public/hades/changeVideoShelfState", params);
}
......@@ -73,6 +73,9 @@ export function editVideoSchedule(params: object) {
export function userWatchInfo(params: object) {
return Service.Hades("public/hades/userWatchInfo", params);
}
export function lineDetailWatchInfo(params: object) {
return Service.Hades("public/hades/lineDetailWatchInfo", params);
}
export function videoScheduleDetail(params: object) {
return Service.Hades("public/hades/videoScheduleDetail", params);
}
......
src/data-source/knowledge/request-api.ts
......@@ -81,7 +81,7 @@ class KnowledgeAPI {
exportPicLearnSync = (params: object) => {
return Service.Hades("public/knowledge/exportPicLearnSync", params);
}
// 视频课观看记录导出
// 线上课观看记录导出
exportVideoLearnSync = (params: object) => {
return Service.Hades("public/knowledge/exportVideoLearnSync", params);
}
......
src/data-source/plan/request-apis.ts
/*
* @Author: zhangleyuan
* @Date: 2021-02-21 16:08:38
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-09 12:54:31
* @LastEditors: yuananting
* @LastEditTime: 2021-07-06 11:26:27
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import Service from "@/common/js/service";
import Service from '@/common/js/service';
export function getTrainingPlanPage(params: object) {
return Service.Hades("public/hades/getTrainingPlanPage", params);
return Service.Hades('public/hades/getTrainingPlanPage', params);
}
export function createTrainingPlan(params: object) {
return Service.Hades("public/hades/createTrainingPlan", params);
return Service.Hades('public/hades/createTrainingPlan', params);
}
export function updateStateTrainingPlan(params: object) {
return Service.Hades("public/hades/updateStateTrainingPlan", params);
return Service.Hades('public/hades/updateStateTrainingPlan', params);
}
export function getTrainingPlanDetail(params: object) {
return Service.Hades("public/hades/getTrainingPlanDetail", params);
return Service.Hades('public/hades/getTrainingPlanDetail', params);
}
export function updateTrainingPlan(params: object) {
return Service.Hades("public/hades/updateTrainingPlan", params);
return Service.Hades('public/hades/updateTrainingPlan', params);
}
export function deleteTrainingPlan(params: object) {
return Service.Hades("public/hades/deleteTrainingPlan", params);
return Service.Hades('public/hades/deleteTrainingPlan', params);
}
export function getPlanUserRecordPage(params: object) {
return Service.Hades("public/hades/getPlanUserRecordPage", params);
return Service.Hades('public/hades/getPlanUserRecordPage', params);
}
export function getPlanCustomerRecordPage(params: object) {
return Service.Hades("public/hades/getPlanCustomerRecordPage", params);
return Service.Hades('public/hades/getPlanCustomerRecordPage', params);
}
export function getPlanCustomerDetail(params: object) {
return Service.Hades("public/hades/getPlanCustomerDetail", params);
return Service.Hades('public/customerHades/getPlanCustomerDetail', params);
}
export function getPlanCustomerAboutUser(params: object) {
return Service.Hades("public/hades/getPlanCustomerAboutUser", params);
return Service.Hades('public/hades/getPlanCustomerAboutUser', params);
}
export function removePlanCustomer(params: object) {
return Service.Hades("public/hades/removePlanCustomer", params);
return Service.Hades('public/hades/removePlanCustomer', params);
}
export function getStorePlanAll(params: object) {
return Service.Hades("public/hades/getStorePlanAll", params);
return Service.Hades('public/hades/getStorePlanAll', params);
}
export function getTrainingCourseAutoCancel(params: object) {
return Service.Hades("public/hades/getTrainingCourseAutoCancel", params);
}
\ No newline at end of file
return Service.Hades('public/hades/getTrainingCourseAutoCancel', params);
}
src/domains/aid-tool-domain/AidToolService.ts
/*
* @Author: yuananting
* @Date: 2021-03-11 11:34:37
* @LastEditors: fusanqiasng
* @LastEditTime: 2021-06-16 09:56:46
* @LastEditors: yuananting
* @LastEditTime: 2021-07-09 16:54:54
* @Description: 助学工具接口
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import {
queryExternalCategoryTree,
queryCategoryTreeByPackage,
queryCategoryTree,
addCategory,
delCategory,
......@@ -38,6 +39,11 @@ export default class AidToolService {
return queryExternalCategoryTree(parmas);
}
// 课程分类树（按课程包）
static queryCategoryTreeByPackage(params: any) {
return queryCategoryTreeByPackage(params);
}
// 获取题目分类树
static queryCategoryTree(params: any) {
return queryCategoryTree(params);
......
src/domains/basic-domain/baseService.ts
......@@ -2,12 +2,12 @@
* @Author: wufan
* @Date: 2020-12-01 17:20:49
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-22 14:57:01
* @LastEditTime: 2021-07-09 15:33:59
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import { getUserStore, getUserPermission ,logout,getStoreUser,sendBizAuthCode,editUserPhone,checkBizAuthCode,sendNewPhoneAuthCode,sendLoginAuthCode,login,getLastedVersion, getEnterpriseUser,getWXWorkLoginNoCheck,getLesseeVersionMsg,getYoZoSign,saveYoZoFileVersionId,yoZoUpload} from '@/data-source/base/request-apis';
import { getUserStore, getUserPermission ,logout,getStoreUser,sendBizAuthCode,editUserPhone,checkBizAuthCode,sendNewPhoneAuthCode,sendLoginAuthCode,login,getLastedVersion, getEnterpriseUser,getWXWorkLoginNoCheck,getLesseeVersionMsg,getYoZoSign,saveYoZoFileVersionId,yoZoUpload,saveFileVersionIdByCourseChapter} from '@/data-source/base/request-apis';
export default class StoreService {
// 获取员工列表
......@@ -73,4 +73,7 @@ export default class StoreService {
static yoZoUpload(ossUrl:String,appId:String,uploadSign:String){
return yoZoUpload(ossUrl,appId,uploadSign);
}
static saveFileVersionIdByCourseChapter(params: any){
return saveFileVersionIdByCourseChapter(params);
}
}
\ No newline at end of file
src/domains/course-domain/CourseService.ts
......@@ -9,7 +9,8 @@
import {
fetchLecturerData, getCategoryTree, knowledgeMediaCoursePage, fetchUserData, exportStudentCourseData, exportPlayBackCourseData, fetchPlaybackList, createLiveCloudCourse, getLiveCloudCoursePage,
getLiveCloudCourseDetail, updateLiveCloudCourse, turnOnOrOffLiveCloudCourse, delLiveCloudCourse, changeVideoShelfState, createVideoSchedule, delVideoSchedule,
editVideoSchedule, userWatchInfo, videoSchedulePage, videoScheduleDetail, videoWatchInfo, getQrcode, getLiveCloudCourseBasePage, videoScheduleBasePage, relatedCourseToPlan
editVideoSchedule, userWatchInfo, videoSchedulePage, videoScheduleDetail, videoWatchInfo, getQrcode, getLiveCloudCourseBasePage, videoScheduleBasePage, relatedCourseToPlan,
lineDetailWatchInfo
} from '@/data-source/course/request-api';
export default class courseService {
......@@ -85,6 +86,9 @@ export default class courseService {
static videoWatchInfo(params: any) {
return videoWatchInfo(params);
}
static lineDetailWatchInfo(params: any) {
return lineDetailWatchInfo(params);
}
static getLiveCloudCourseBasePage(params: any) {
return getLiveCloudCourseBasePage(params);
}
......
src/domains/resource-disk/constants.ts
/*
* @Author: 吴文洁
* @Date: 2020-08-20 09:21:40
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-04 17:16:30
* @LastEditors: yuananting
* @LastEditTime: 2021-07-15 11:48:58
* @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -77,6 +77,10 @@ const FILR_VERIFY_MAP = {
type: "word",
maxSize: 100
},
"application/wps-writer": {
type: "word",
maxSize: 100,
},
"application/vnd.openxmlformats-officedocument.wordprocessingml.document": {
type: "word",
maxSize: 100
......
src/index.html
......@@ -19,7 +19,7 @@
/>
<meta
name="keywords"
content="小麦企学院,企业培训,员工培训,企业大学,企业内训,企业外训,培训计划,培训素材,企培,企训,资料云盘,培训课程,培训任务,直播课,视频课,图文课,线下课,知识库,作业,考试,排行榜,培训类别管理,定制培训计划,管理数据,学习数据,企学院,资料共享,培训数字化,数字化培训,培训工具,在线培训,线上培训,培训saas,培训管理,企业微信培训,对客培训,客户培训,直播培训,互联网培训,新员工培训,管理培训,管理者培训,工人培训,制造业培训,餐饮培训,服务业培训,零售培训,门店培训,工厂培训,车间培训,培训补贴,人事培训,财务培训,职场培训,企业学院平台,教育企业学院,教育企业平台,教育平台学院,企业学习,酷学院,小鹅通,企业学院,云学堂,时代光华,云课堂,魔学院,云大学,米知云,授课学堂"
content="小麦企学院,企业培训,员工培训,企业大学,企业内训,企业外训,培训计划,培训素材,企培,企训,资料云盘,培训课程,培训任务,直播课,线上课,图文课,线下课,知识库,作业,考试,排行榜,培训类别管理,定制培训计划,管理数据,学习数据,企学院,资料共享,培训数字化,数字化培训,培训工具,在线培训,线上培训,培训saas,培训管理,企业微信培训,对客培训,客户培训,直播培训,互联网培训,新员工培训,管理培训,管理者培训,工人培训,制造业培训,餐饮培训,服务业培训,零售培训,门店培训,工厂培训,车间培训,培训补贴,人事培训,财务培训,职场培训,企业学院平台,教育企业学院,教育企业平台,教育平台学院,企业学习,酷学院,小鹅通,企业学院,云学堂,时代光华,云课堂,魔学院,云大学,米知云,授课学堂"
/>
<!-- <link rel="apple-touch-icon" href="../src/common/images/logo.png" /> -->
<link rel="shortcut icon" href="https://image.xiaomaiketang.com/xm/c4KiP2epBP.png" />
......
src/modules/college-manage/CollegeInfoPage.jsx
......@@ -111,9 +111,8 @@ class CollegeInfoPage extends React.Component {
} = this.state;
return (
<div className="page college-info-page">
<div className="content-header">学院基本信息</div>
<div className="content-header">学院信息</div>
<div className="box">
<div className="college-info-header">学院基本信息</div>
<div className="college-info-page-form">
<Form ref={this.formRef}>
......
src/modules/course-manage/components/AddLiveBasic.less
......@@ -2,81 +2,76 @@
.label {
width: 100px;
text-align: right;
display:inline-block;
display: inline-block;
.require {
color: #EC4B35;
color: #ec4b35;
}
}
.course-cover {
margin-left: 14px;
display: flex;
margin-top: 16px;
margin-top: 24px;
&__wrap {
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 {
margin-right: 20px;
width: 299px;
height: 169px;
.img-content {
margin-top: 8px;
margin-right: 20px;
width: 299px;
height: 169px;
position: relative;
img {
width: 100%;
height: 100%;
object-fit: contain;
border-radius: 4px;
img {
width: 100%;
height: 100%;
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 {
margin-left: 14px;
color: #2966ff;
cursor: pointer;
.default-btn {
margin-left: 16px;
color: #2966FF;
cursor: pointer;
&.disabled {
color: #ccc;
cursor: not-allowed;
}
}
&.disabled {
color: #CCC;
cursor: not-allowed;
.ant-upload-list {
display: none;
}
}
.ant-upload-list {
display: none;
.tips {
margin-top: 8px;
color: #999;
}
}
}
.tips {
margin-top: 8px;
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){
font-weight:normal !important;
color:#2966FF !important;
.ant-cascader-menu-item-active:not(.ant-cascader-menu-item-disabled) {
font-weight: normal !important;
color: #2966ff !important;
}
#imgCutModalNew {
width: 500px;
......@@ -84,4 +79,4 @@
}
.preview-url-box{
overflow: hidden;
}
\ No newline at end of file
}
src/modules/course-manage/components/AddLiveClass.jsx
......@@ -175,7 +175,10 @@ class AddLiveClass extends React.Component {
<Tooltip
overlayStyle={{maxWidth: 300, zIndex: '9999'}}
title={<div style={{width: '266px'}}>支持按上课日期批量创建直播课，创建后按“课程名称_日期”命名，例如：<br/>张三的语文课_9月18日<br/>张三的语文课_9月19日......</div>}>
<span className="iconfont">&#xe61d;</span>
<span
style={{ color: "rgba(191, 191, 191, 1)",fontWeight: 400 }}
className="iconfont"
>&#xe61d;</span>
</Tooltip>：
</span>
<div>
......
src/modules/course-manage/components/GraphicsEditor.less
.graphics-editor-container {
border: 1px solid #E8E8E8;
border: 1px solid #e8e8e8;
border-radius: 4px;
width: 702px;
height: 510px;
......@@ -23,7 +23,7 @@
.w-e-toolbar {
background-color: #fff !important;
border: none !important;
border-bottom: 1px solid #E8E8E8 !important;
border-bottom: 1px solid #e8e8e8 !important;
}
.w-e-text-container {
......@@ -38,19 +38,26 @@
color: #666;
z-index: 1;
}
.editor-warning {
position: absolute;
right: 0;
color: red;
}
.w-e-full-screen-editor {
.w-e-text-container {
height: ~'calc(100vh - 109px)' !important;
}
}
&.introduce {
height: 200px;
height: 240px;
.w-e-text-container {
height: ~'calc(100% - 69px)' !important;
}
}
&.warning{
&.warning {
border-color: red;
}
}
\ No newline at end of file
}
src/modules/course-manage/components/LiveCourseList.jsx
......@@ -125,7 +125,7 @@ class LiveCourseList extends React.Component {
columns = [
{
title: '直播课',
width: '23%',
key: 'course',
fixed: 'left',
dataIndex: 'courseName',
......@@ -284,6 +284,7 @@ class LiveCourseList extends React.Component {
render: (val, item, index) => {
return (
<Switch
size='small'
checked={item.shelfState === 'YES'}
defaultChecked={item.shelfState === 'YES' ? true : false}
onChange={(checked) => this.changeShelfState(index, item, checked)}
......@@ -311,7 +312,7 @@ class LiveCourseList extends React.Component {
return (
<div className='related-task'>
<Choose>
<When condition={record.relatedPlanLis}>
<When condition={record.relatedPlanList}>
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
......
src/modules/course-manage/graphics-course/AddGraphicsCourse.jsx
......@@ -27,6 +27,7 @@ import _ from 'underscore';
import Upload from '@/core/upload';
import ImgClipModal from '@/components/ImgClipModal'
import './AddGraphicsCourse.less';
import Bus from '@/core/bus';
const EDIT_BOX_KEY = Math.random();
const fieldNames = { label: 'categoryName', value: 'id', children: 'sonCategoryList' };
......@@ -34,7 +35,7 @@ const fieldNames = { label: 'categoryName', value: 'id', children: 'sonCategoryL
//添加课程时课程默认的一些值
const defaultShelfState = 'YES';
const whetherVisitorsJoin = 'NO';
const defaultCoverUrl = 'https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png';
const defaultCover = 'https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png';
let cutFlag = false;
class AddGraphicsCourse extends React.Component {
......@@ -53,7 +54,7 @@ class AddGraphicsCourse extends React.Component {
introduce: '',
courseMediaId: null, // 图文课链接
coverId: null, // 图文封面的recourceId
coverUrl: defaultCoverUrl, // 图文课封面
coverUrl: defaultCover, // 图文课封面
studentList: [], // 上课学员列表
shelfState: 'YES', //是否开启学院展示
selectedFileList: [], // 已经从资料云盘中勾选的文件
......@@ -73,6 +74,11 @@ class AddGraphicsCourse extends React.Component {
if (pageType === 'edit') {
this.handleFetchScheudleDetail(id);
}
Bus.bind('editorLimit', (editorTextLength, editorType) => {
this.setState({
[editorType]: editorTextLength,
});
});
}
initBus = () => {
......@@ -314,11 +320,11 @@ class AddGraphicsCourse extends React.Component {
//过期判断
if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) {
Modal.warning({
title:"服务已到期",
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
okText: "我知道了"
})
return
title: '服务已到期',
content: '当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买',
okText: '我知道了',
});
return;
}
const { id, coverId, pageType, courseName, courseMedia, introduce, categoryId, shelfState, whetherVisitorsJoin } = this.state;
......@@ -387,6 +393,7 @@ class AddGraphicsCourse extends React.Component {
};
handleValidate = (courseName, courseMedia, categoryId) => {
const { graphicsCourseIntor, graphicsCourseContent } = this.state;
return new Promise((resolve) => {
if (!courseName) {
message.warning('请输入课程名称');
......@@ -403,6 +410,18 @@ class AddGraphicsCourse extends React.Component {
resolve(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');
// for (let i = 0, len = textMedia.length; i < len; i++) {
// if (textMedia[i].mediaContentLength && textMedia[i].mediaContentLength.length > 1000) {
......@@ -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() {
const {
id,
......@@ -442,6 +472,8 @@ class AddGraphicsCourse extends React.Component {
const hasSelectedStu = studentList.length;
const courseWareIcon = FileVerifyMap[videoType] ? FileTypeIcon[FileVerifyMap[videoType].type] : FileTypeIcon[videoType];
// 当前是否使用的是默认图片
const isDefaultCover = coverUrl === defaultCover;
return (
<div className='page add-graphics-course-page'>
......@@ -468,19 +500,39 @@ class AddGraphicsCourse extends React.Component {
<div className='cover-url flex mt16'>
<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'>
<img src={coverUrl} />
</div>
</div> */}
<div className='course-cover__wrap'>
<div className='opt-btns'>
<Button
onClick={() => {
this.setState({
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>
<div className='img-content'>
{isDefaultCover && <span className='tag'>默认图</span>}
<img src={coverUrl} />
</div>
</div>
</div>
<div className='course-catalog required'>
......
src/modules/course-manage/graphics-course/AddGraphicsCourse.less
.add-graphics-course-page {
position:relative !important;
.box{
margin-bottom:52px !important;
position: relative !important;
.box {
margin-bottom: 52px !important;
}
.ant-radio-group {
display: flex;
flex-direction: column;
.radio-item {
margin-bottom: 12px;
......@@ -28,14 +27,14 @@
.form {
margin-top: 16px;
padding: 0 16px;
.label{
display:inline-block;
text-align:right;
width:85px;
.label {
display: inline-block;
text-align: right;
width: 85px;
}
.required {
position: relative;
&::before {
position: absolute;
content: '*';
......@@ -43,14 +42,14 @@
left: 5px;
top: 6px;
}
&.label::before {
top: 0;
}
}
.course-catalog{
margin-bottom:16px;
margin-top:16px;
.course-catalog {
margin-bottom: 16px;
margin-top: 16px;
}
.course-ware {
display: flex;
......@@ -70,42 +69,101 @@
.flex {
display: flex;
}
.cover-url__wrap {
.img-content {
width: 298px;
height: 172px;
img {
width: 100%;
height: 100%;
object-fit: contain;
border-radius: 4px;
.course-cover {
margin-left: 14px;
display: flex;
margin-top: 24px;
&__wrap {
position: relative;
.img-content {
margin-top: 8px;
margin-right: 20px;
width: 299px;
height: 169px;
position: relative;
img {
width: 100%;
height: 100%;
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;
}
}
}
.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;
.opt-btns {
.default-btn {
margin-left: 14px;
color: #2966ff;
cursor: pointer;
&.disabled {
color: #ccc;
cursor: not-allowed;
}
}
.ant-upload-list {
display: none;
}
.tips {
margin-top: 8px;
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 {
align-items: center;
margin-left: 24px;
......@@ -139,10 +197,10 @@
justify-content: flex-end;
padding-right: 72px;
background: #fff;
border-top: 1px solid #E8E8E8;
border-top: 1px solid #e8e8e8;
z-index: 999;
.ant-btn {
margin-left: 10px;
}
}
}
\ No newline at end of file
}
src/modules/course-manage/graphics-course/components/AddGraphicsIntro.jsx
/*
* @Author: 吴文洁
* @Date: 2020-07-16 11:05:17
* @Author: 吴文洁
* @Date: 2020-07-16 11:05:17
* @Last Modified by: chenshu
* @Last Modified time: 2021-04-06 16:17:57
* @Description: 添加直播-简介
......@@ -17,55 +17,53 @@ import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepare
import { DISK_MAP } from '@/common/constants/academic/lessonEnum';
import { ImgCutModalNew } from '@/components';
const { TextArea } = Input;
class AddGraphicsIntro extends React.Component {
constructor(props) {
super(props);
this.state = {
showSelectFileModal: false,
diskList: [],
selectType: null,
}
};
}
// 上传封面图
handleShowImgCutModal = (event) => {
const imageFile = event.target.files[0];
if (!imageFile) return;
if (!imageFile) return;
this.setState({
imageFile,
showCutModal: true,
});
}
};
// 选择暖场资源
handleSelectVideo = (file) => {
const { selectType } = this.state;
// 选择暖场资源
handleSelectVideo = (file) => {
const { selectType } = this.state;
this.setState({
showSelectFileModal: false
})
showSelectFileModal: false,
});
const { ossUrl, resourceId, folderName, folderFormat, folderSize } = file;
if(selectType === 'WARMUP'){
if (selectType === 'WARMUP') {
const liveCourseWarmMedia = {
contentType: 'WARMUP',
mediaType: folderFormat === 'MP4' ? 'VIDEO' : 'PICTURE',
mediaContent: resourceId,
mediaUrl: ossUrl,
mediaName: folderName,
size: folderSize
}
size: folderSize,
};
this.props.onChange('liveCourseWarmMedia', liveCourseWarmMedia);
}else{
} else {
// 最多添加九图片
const { liveCourseMediaRequests } = this.props.data;
const list = _.filter(liveCourseMediaRequests, (item) => {
return item.mediaType == "PICTURE";
return item.mediaType == 'PICTURE';
});
if (list.length > 8) {
message.warning("最多添加9张图片");
message.warning('最多添加9张图片');
return;
}
liveCourseMediaRequests.push({
......@@ -78,121 +76,116 @@ class AddGraphicsIntro extends React.Component {
});
this.props.onChange('liveCourseMediaRequests', liveCourseMediaRequests);
}
}
};
changeDetail = (value) => {
this.props.onChange('courseMedia', value);
}
};
changeIntro = (value) => {
this.props.onChange('introduce', value);
}
};
whetherVisitorsJoinChange = ()=>{
if(this.props.data.whetherVisitorsJoin==="NO"){
this.props.onChange('whetherVisitorsJoin','YES')
}else{
this.props.onChange('whetherVisitorsJoin','NO')
whetherVisitorsJoinChange = () => {
if (this.props.data.whetherVisitorsJoin === 'NO') {
this.props.onChange('whetherVisitorsJoin', 'YES');
} else {
this.props.onChange('whetherVisitorsJoin', 'NO');
}
}
};
shelfStateChange = ()=>{
if(this.props.data.shelfState==="NO"){
this.props.onChange('shelfState','YES')
}else{
this.props.onChange('shelfState','NO')
shelfStateChange = () => {
if (this.props.data.shelfState === 'NO') {
this.props.onChange('shelfState', 'YES');
} else {
this.props.onChange('shelfState', 'NO');
}
}
};
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;
return (
<div className="add-video__intro-info">
<div className="allow-tourist-join">
<span className="label">观看设置：</span>
<div className="content">
<div>
<Switch checked={whetherVisitorsJoin==="YES"? true:false} onChange={this.whetherVisitorsJoinChange}/>
</div>
<div>
<div className="desc">
<div>开启：允许未绑定手机号的学员观看</div>
<div>关闭：仅限绑定了手机号的学员可以进入观看图文课</div>
</div>
</div>
<div className='add-graphic__intro-info'>
<div className='allow-tourist-join'>
<span className='label'>观看设置：</span>
<div className='content'>
<Switch checked={whetherVisitorsJoin === 'NO' ? true : false} onChange={this.whetherVisitorsJoinChange} />
<div className='desc'>{whetherVisitorsJoin === 'NO' ? '已开启，学员需绑定手机号才可观看' : '已关闭，学员无需绑定手机号即可观看'}</div>
</div>
</div>
<div className="store-show">
<span className="label">学院展示：</span>
<div className="content">
<Row>
<Col span={3}>
<Switch checked={shelfState==="YES"? true:false} onChange={this.shelfStateChange}/>
</Col>
<Col span={21}>
<div className="desc">
<div>开启：图文课将在学员学院图文课列表中展示</div>
<div>关闭：图文课将在学员学院图文课列表中隐藏</div>
</div>
</Col>
</Row>
<div className='store-show'>
<span className='label'>学院展示：</span>
<div className='content'>
<Switch checked={shelfState === 'YES' ? true : false} onChange={this.shelfStateChange} />
<div className='desc'>{shelfState === 'YES' ? '已开启，课程将在该学院的学员课程列表中显示' : '已关闭，课程将在该学院的学员课程列表中隐藏'}</div>
</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) &&
<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
id="content"
id='content'
maxLimit={1000}
editorType={'graphicsCourseContent'}
detail={{
content: courseMedia
content: courseMedia,
}}
onChange={(val) => {
this.changeDetail(val);
}}
onChange={(val) => { this.changeDetail(val) }}
/>
}
)}
</div>
</div>
</div>
</div>
<div className="introduce">
<span className="label">课程简介：</span>
<div className="content">
<div className="intro-list">
<div className="intro-list__item introduce-editor">
{(!id || loadintroduce) &&
<div className='introduce'>
<span className='label'>课程简介：</span>
<div className='content'>
<div className='intro-list'>
<div className='intro-list__item introduce-editor'>
{(!id || loadintroduce) && (
<GraphicsEditor
id="intro"
id='intro'
isIntro={true}
maxLimit={1000}
editorType={'graphicsCourseIntor'}
detail={{
content: introduce
content: introduce,
}}
onChange={(val) => {
this.changeIntro(val);
}}
onChange={(val) => { this.changeIntro(val) }}
/>
}
)}
</div>
</div>
</div>
</div>
{/* 选择暖场图文件弹窗 */}
{ showSelectFileModal &&
{showSelectFileModal && (
<SelectPrepareFileModal
operateType="select"
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'] }
tooltip={ selectType==="INTRO"?'支持文件类型：jpg、jpeg、png':'支持文件类型：jpg、jpeg、png、mp4'}
operateType='select'
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']}
tooltip={selectType === 'INTRO' ? '支持文件类型：jpg、jpeg、png' : '支持文件类型：jpg、jpeg、png、mp4'}
isOpen={showSelectFileModal}
onClose={() => {
this.setState({ showSelectFileModal: false })
this.setState({ showSelectFileModal: false });
}}
onSelect={this.handleSelectVideo}
/>
}
)}
</div>
)
);
}
}
......
src/modules/course-manage/graphics-course/components/AddGraphicsIntro.less
.add-video__intro-info {
.add-graphic__intro-info {
.w-e-full-screen-editor {
background: #fff !important;
}
.playback {
margin-bottom: 10px;
.require {
color: #EC4B35;
}
&__text {
color: #999;
}
.playback {
margin-bottom: 10px;
.require {
color: #ec4b35;
}
.label{
display:inline-block;
text-align:right;
width:85px;
&__text {
color: #999;
}
.playback,
.introduce {
}
.label {
display: inline-block;
text-align: right;
width: 85px;
}
.playback,
.introduce {
display: flex;
flex-direction: row;
}
.allow-tourist-join {
display: flex;
.content {
display: flex;
flex-direction: row;
}
.allow-tourist-join{
display:flex;
.content{
display:flex;
}
.desc{
margin-left:16px;
font-size:14px;
color:#999;
display:inline-block;
}
}
.store-show{
display:flex;
margin-top:16px;
margin-bottom:16px;
.desc{
margin-left:16px;
font-size:14px;
color:#999;
display:inline-block;
}
}
.radio {
display: block;
height: 30px;
line-height: 30px;
.desc {
margin-left: 16px;
font-size: 14px;
color: #999;
display: inline-block;
}
.interactive-playback {
}
.store-show {
display: flex;
margin-top: 16px;
margin-bottom: 16px;
.content {
display: flex;
margin-bottom: 20px;
}
textarea.ant-input {
min-height: 80px;
}
.intro-list__item {
display: flex;
margin-bottom: 16px;
position: relative;
&.picture {
width: 550px;
padding: 16px;
border: 1px solid #EEE;
border-radius: 4px;
.img__wrap {
width: 299px;
height: 168px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
}
.little-icon {
display: flex;
flex-direction: column;
position: absolute;
top: 0;
right: -20px;
.iconfont {
width: 20px;
height: 20px;
line-height: 20px;
font-size: 20px;
color: #999;
margin-bottom: 4px;
cursor: pointer;
&.close {
margin-top: 8px;
background-image: url('https://image.xiaomaiketang.com/xm/eesMPhNP3e.png');
background-size: 100% 100%;
}
}
}
.desc {
margin-left: 16px;
font-size: 14px;
color: #999;
display: inline-block;
}
.operate {
display: flex;
align-items: center;
justify-content: center;
}
.radio {
display: block;
height: 30px;
line-height: 30px;
}
.interactive-playback {
display: flex;
margin-bottom: 20px;
}
textarea.ant-input {
min-height: 80px;
}
.intro-list__item {
display: flex;
margin-bottom: 32px;
position: relative;
&.picture {
width: 550px;
height: 80px;
line-height: 80px;
padding: 16px;
margin-top: 16px;
border: 1px dashed #EBEBEB;
border: 1px solid #eee;
border-radius: 4px;
.ant-upload {
vertical-align: middle;
.img__wrap {
width: 299px;
height: 168px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
&__item {
display: flex;
flex-direction: column;
}
.little-icon {
display: flex;
flex-direction: column;
position: absolute;
top: 0;
right: -20px;
.iconfont {
width: 20px;
height: 20px;
line-height: 20px;
font-size: 20px;
color: #999;
margin-bottom: 4px;
cursor: pointer;
&:not(:last-child) {
margin-right: 82px;
}
.iconfont {
font-size: 22px;
line-height: 22px;
color: #BFBFBF;
text-align: center;
}
.text {
color: #999;
line-height: 20px;
margin-top: 4px;
&.close {
margin-top: 8px;
background-image: url('https://image.xiaomaiketang.com/xm/eesMPhNP3e.png');
background-size: 100% 100%;
}
}
}
.tips {
color: #999;
margin-top: 16px;
margin-bottom: 8px;
}
.checkExample {
width: 60px;
color: #FF7519;
cursor: pointer;
}
.operate {
display: flex;
align-items: center;
justify-content: center;
width: 550px;
height: 80px;
line-height: 80px;
padding: 16px;
margin-top: 16px;
border: 1px dashed #ebebeb;
border-radius: 4px;
.ant-upload {
vertical-align: middle;
}
.warmup {
margin-bottom: 17px;
&__item {
display: flex;
flex-direction: column;
cursor: pointer;
&:not(:last-child) {
margin-right: 82px;
}
.iconfont {
font-size: 22px;
line-height: 22px;
color: #bfbfbf;
text-align: center;
}
.text {
color: #999;
line-height: 20px;
margin-top: 4px;
}
}
.course-cover__wrap {
display: flex;
flex-direction: row;
}
.tips {
color: #999;
margin-top: 16px;
margin-bottom: 8px;
}
.checkExample {
width: 60px;
color: #ff7519;
cursor: pointer;
}
.warmup {
margin-bottom: 17px;
display: flex;
}
.course-cover__wrap {
display: flex;
flex-direction: row;
}
.img-content {
position: relative;
margin-right: 20px;
width: 300px;
height: 170px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
.img-content {
position: relative;
margin-right: 20px;
width: 300px;
height: 170px;
.img-delete-wrap {
opacity: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
.img-delete-wrap {
opacity: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
img {
position: absolute;
left: 50%;
top: 50%;
width: 40px;
height: 40px;
transform: translate(-50%, -50%);
}
&:hover {
opacity: 1;
cursor: pointer;
}
left: 50%;
top: 50%;
width: 40px;
height: 40px;
transform: translate(-50%, -50%);
}
}
.opt-btns {
.default-btn {
margin-left: 16px;
color: #FF7519;
&:hover {
opacity: 1;
cursor: pointer;
&.disabled {
color: #CCC;
cursor: not-allowed;
}
}
}
}
.example-wrap {
font-family: PingFangSC-Regular, PingFang SC;
text-align: center;
.title {
margin-bottom: 6px;
font-size: 14px;
color: #333333;
}
.text {
margin-bottom: 16px;
font-size: 12px;
color: #999999;
}
img {
width: 180px;
.opt-btns {
.default-btn {
margin-left: 16px;
color: #ff7519;
cursor: pointer;
&.disabled {
color: #ccc;
cursor: not-allowed;
}
}
}
.check-record-rule {
width: 120px;
color: #FF7519;
cursor: pointer;
z-index: 2;
}
.example-wrap {
font-family: PingFangSC-Regular, PingFang SC;
text-align: center;
.title {
margin-bottom: 6px;
font-size: 14px;
color: #333333;
}
.record-rule-wrap {
text-align: left;
ul {
margin-top: 10px;
padding-left: 34px;
list-style-type: disc;
li {
color: #999;
}
}
.text {
.text {
margin-bottom: 16px;
font-size: 12px;
color: #999999;
}
img {
width: 180px;
}
}
.check-record-rule {
width: 120px;
color: #ff7519;
cursor: pointer;
z-index: 2;
}
.record-rule-wrap {
text-align: left;
ul {
margin-top: 10px;
padding-left: 34px;
list-style-type: disc;
li {
color: #999;
}
}
.auto-send-class-report {
.label {
width: 57px;
height: 12px;
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 12px;
}
.open-text, .close-text {
width: 572px;
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 20px;
margin-left: 100px;
margin-top: 5px;
}
.open-text {
margin-top: 8px;
}
.close-text {
margin-bottom: 16px;
}
}
\ No newline at end of file
.text {
color: #999;
}
}
.auto-send-class-report {
.label {
width: 57px;
height: 12px;
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 12px;
}
.open-text,
.close-text {
width: 572px;
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 20px;
margin-left: 100px;
margin-top: 5px;
}
.open-text {
margin-top: 8px;
}
.close-text {
margin-bottom: 16px;
}
}
src/modules/course-manage/graphics-course/components/GraphicsCourseList.jsx
/*
* @Author: 吴文洁
* @Date: 2020-08-05 10:12:45
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-15 20:01:05
* @Description: 视频课-列表模块
* @LastEditors: wufan
* @LastEditTime: 2021-07-05 10:23:10
* @Description: 线上课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
import User from '@/common/js/user';
import college from '@/common/lottie/college';
import { PageControl, XMTable } from '@/components';
import { appId, LIVE_SHARE } from '@/domains/course-domain/constants';
import { LIVE_SHARE } from '@/domains/course-domain/constants';
import CourseService from '@/domains/course-domain/CourseService';
import ShareLiveModal from '@/modules/course-manage/modal/ShareLiveModal';
import { Dropdown, message, Modal, Switch, Tooltip } from 'antd';
......@@ -57,7 +57,7 @@ class GraphicsCourseList extends React.Component {
handlePlanName = (planArray) => {
let planStr = '';
planArray.map((item, index) => {
planArray.forEach((item, index) => {
if (index < planArray.length - 1) {
planStr = planStr + item.planName + '、';
} else {
......@@ -76,18 +76,21 @@ class GraphicsCourseList extends React.Component {
width: 321,
fixed: 'left',
render: (val, record) => {
const { coverUrl, scheduleVideoUrl } = record;
const { coverUrl } = record;
return (
<div className='record__item'>
{/* 上传了封面的话就用上传的封面, 没有的话就取视频的第一帧 */}
<img className='course-cover' src={coverUrl || defaultCoverUrl} />
{record.courseName.length > 25 ? (
<Tooltip title={record.courseName}>
<img className='course-cover' src={coverUrl || defaultCoverUrl} alt='' />
<Choose>
<When condition={record.courseName.length > 25}>
<Tooltip title={record.courseName}>
<div className='course-name'>{record.courseName}</div>
</Tooltip>
</When>
<Otherwise>
<div className='course-name'>{record.courseName}</div>
</Tooltip>
) : (
<div className='course-name'>{record.courseName}</div>
)}
</Otherwise>
</Choose>
</div>
);
},
......@@ -144,12 +147,14 @@ class GraphicsCourseList extends React.Component {
width: 120,
dataIndex: 'courseware',
render: (val, item, index) => {
return (
<Switch
checked={item.shelfState === "YES"}
defaultChecked={item.shelfState==="YES"?true:false}
onChange={(checked)=>this.changeShelfState(index,item,checked)}/>
)
return (
<Switch
size='small'
checked={item.shelfState === 'YES'}
defaultChecked={item.shelfState === 'YES' ? true : false}
onChange={(checked) => this.changeShelfState(index, item, checked)}
/>
);
},
},
{
......@@ -168,7 +173,7 @@ class GraphicsCourseList extends React.Component {
dataIndex: 'created',
sorter: true,
render: (val) => {
return formatDate('YYYY-MM-DD H:i', val);
return window.formatDate('YYYY-MM-DD H:i', val);
},
},
{
......@@ -178,7 +183,7 @@ class GraphicsCourseList extends React.Component {
dataIndex: 'updated',
sorter: true,
render: (val) => {
return formatDate('YYYY-MM-DD H:i', val);
return window.formatDate('YYYY-MM-DD H:i', val);
},
},
{
......@@ -189,19 +194,22 @@ class GraphicsCourseList extends React.Component {
render: (val, record) => {
return (
<div className='related-task'>
{record.relatedPlanList ? (
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
<span>
{item.planName} {index < record.relatedPlanList.length - 1 && <span> 、</span>}{' '}
</span>
);
})}
</Tooltip>
) : (
<span></span>
)}
<Choose>
<When condition={record.relatedPlanList}>
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
<span>
{item.planName} {index < record.relatedPlanList.length - 1 && <span> 、</span>}{' '}
</span>
);
})}
</Tooltip>
</When>
<Otherwise>
<span></span>
</Otherwise>
</Choose>
</div>
);
},
......@@ -297,7 +305,7 @@ class GraphicsCourseList extends React.Component {
className='operate__item'
key='edit'
onClick={() => {
RCHistory.push(`/create-graphics-course?type=edit&id=${item.id}`);
window.RCHistory.push(`/create-graphics-course?type=edit&id=${item.id}`);
}}>
编辑
</div>
......@@ -305,17 +313,17 @@ class GraphicsCourseList extends React.Component {
删除
</div>
</div>
)
}
//改变上架状态
changeShelfState = (index,item,checked) =>{
let _shelfState = checked ? "YES" : "NO"
);
};
//改变上架状态
changeShelfState = (index, item, checked) => {
let _shelfState = checked ? 'YES' : 'NO';
// if(_shelfState==='NO'){
// _shelfState = "YES";
// }else{
// _shelfState = "NO"
// }
const params={
const params = {
courseId: item.id,
shelfState: _shelfState,
};
......@@ -326,14 +334,14 @@ class GraphicsCourseList extends React.Component {
} else {
message.success('已取消展示');
}
this.props.changeShelfState(index,_shelfState)
this.props.changeShelfState(index, _shelfState);
}
});
};
// 删除视频课
handleDeleteGraphicsCourse = (scheduleId) => {
Modal.confirm({
title: '你确定要删除此视频课吗？',
title: '你确定要删除此线上课吗？',
content: '删除后，学员将不能进行观看。',
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定',
......@@ -355,8 +363,6 @@ class GraphicsCourseList extends React.Component {
// 显示分享弹窗
handleShowShareModal = (record, needStr = false) => {
const { id, scheduleVideoUrl } = record;
const _appId = appId;
const htmlUrl = `${LIVE_SHARE}graphics_detail/${id}?id=${User.getStoreId()}`;
const longUrl = htmlUrl;
const { coverUrl, courseName } = record;
......
src/modules/course-manage/graphics-course/components/GraphicsCourseOpt.jsx
......@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:15
* @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-26 16:07:27
* @Description: 视频课-操作模块
* @Description: 线上课-操作模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......
src/modules/course-manage/graphics-course/index.jsx
......@@ -17,13 +17,13 @@ class GraphicsCourse extends React.Component {
courseType: 'PICTURE',
storeId:User.getStoreId()
},
dataSource: [], // 视频课列表
totalCount: 0, // 视频课数据总条数
dataSource: [], // 线上课列表
totalCount: 0, // 线上课数据总条数
}
}
componentWillMount() {
// 获取视频课列表
// 获取线上课列表
this.handleFetchScheduleList();
}
......@@ -76,7 +76,7 @@ class GraphicsCourse extends React.Component {
{/* 操作模块 */}
<GraphicsCourseOpt />
{/* 视频课列表模块 */}
{/* 线上课列表模块 */}
<GraphicsCourseList
query={query}
dataSource={dataSource}
......
src/modules/course-manage/modal/PreviewCourseModal.less
......@@ -13,7 +13,8 @@
}
.container {
overflow: scroll;
overflow-y: auto;
overflow-x: hidden;
height: 100%;;
.course-cover, .course-url {
......@@ -30,6 +31,16 @@
color: #000;
}
.title__category {
color: #999999;
margin-top: 4px;
margin-bottom: 4px;
}
.title__chapter {
color: #999999;
margin-bottom: 4px;
}
.title__inst-name {
color: #666;
font-size: 12px;
......
src/modules/course-manage/modal/ShareLiveModal.jsx
......@@ -116,11 +116,7 @@ class ShareLiveModal extends React.Component {
}
break;
case 'videoClass': // 视频课
coverImgSrc =
coverUrl ||
(courseDivision === 'internal'
? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast&anystring=anystring`
: 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png');
coverImgSrc = coverUrl || 'https://image.xiaomaiketang.com/xm/TwtGPQGE4K.png';
break;
case 'graphicsClass': // 图文课
coverImgSrc = coverUrl || 'https://image.xiaomaiketang.com/xm/wFnpZtp2yB.png';
......
src/modules/course-manage/offline-course/AddOfflineCourse.less
.add-offline-course-page {
position:relative !important;
.box{
margin-bottom:52px !important;
position: relative !important;
.box {
margin-bottom: 52px !important;
}
.ant-radio-group {
display: flex;
......@@ -39,18 +39,18 @@
position: relative;
padding-left: 14px;
&::before {
content: "";
content: '';
position: absolute;
left: 0px;
top: 50%;
transform: translateY(-50%);
width: 4px;
height: 10px;
background: #2966FF;
background: #2966ff;
}
}
}
.label{
.label {
display: inline-block;
text-align: right;
width: 120px;
......@@ -61,7 +61,7 @@
}
.required {
position: relative;
&::before {
position: absolute;
content: '*';
......@@ -69,14 +69,14 @@
left: 5px;
top: 6px;
}
&.label::before {
top: 0;
}
}
.course-catalog {
margin-bottom:16px;
margin-top:16px;
margin-bottom: 16px;
margin-top: 16px;
display: flex;
.switch-box {
.switch-item {
......@@ -110,19 +110,19 @@
.select-day {
margin-bottom: 4px;
.mark-day {
color: #2966FF;
color: #2966ff;
}
}
}
.allow-tourist-join{
display:flex;
margin-bottom:16px;
.allow-tourist-join {
display: flex;
margin-bottom: 16px;
.desc {
color:#999;
margin-left:12px;
color: #999;
margin-left: 12px;
}
.content{
display:flex;
.content {
display: flex;
}
}
.course-ware {
......@@ -146,62 +146,59 @@
.course-cover {
display: flex;
margin-top: 16px;
&__wrap {
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 {
margin-right: 20px;
width: 299px;
height: 169px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
.opt-btns {
.default-btn {
margin-left: 16px;
color: #2966FF;
cursor: pointer;
&.disabled {
color: #CCC;
cursor: not-allowed;
.img-content {
margin-top: 8px;
margin-right: 20px;
width: 299px;
height: 169px;
position: relative;
img {
width: 100%;
height: 100%;
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;
}
}
.ant-upload-list {
display: none;
.opt-btns {
.default-btn {
margin-left: 14px;
color: #2966ff;
cursor: pointer;
&.disabled {
color: #ccc;
cursor: not-allowed;
}
}
.ant-upload-list {
display: none;
}
.tips {
margin-top: 8px;
color: #999;
}
}
}
.tips {
margin-top: 8px;
color: #999;
}
}
.select-student {
......@@ -236,7 +233,7 @@
justify-content: flex-end;
padding-right: 72px;
background: #fff;
border-top: 1px solid #E8E8E8;
border-top: 1px solid #e8e8e8;
z-index: 999;
.ant-btn {
margin-left: 10px;
......@@ -250,4 +247,4 @@
position: absolute;
left: 20000px;
}
}
\ No newline at end of file
}
src/modules/course-manage/offline-course/components/AddGraphicsIntro.less
.add-video__intro-info {
.add-offline__intro-info {
.w-e-full-screen-editor {
background: #fff !important;
}
......
src/modules/course-manage/offline-course/components/OfflineCourseList.jsx
......@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:45
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-11 16:44:42
* @Description: 视频课-列表模块
* @Description: 线上课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
import Service from '@/common/js/service';
......@@ -17,6 +17,7 @@ import OfflineCourseData from '@/modules/course-manage/offline-course/OfflineCou
import { Dropdown, message, Modal, Switch, Tooltip } from 'antd';
import moment from 'moment';
import React from 'react';
import { find, reduce, last } from 'underscore';
import { Route, withRouter } from 'react-router-dom';
import ENUM from '../../../knowledge-base/ENUM.js';
import PreviewOfflineModal from '../modal/PreviewOfflineModal';
......@@ -29,7 +30,7 @@ class OfflineCourseList extends React.Component {
constructor(props) {
super(props);
this.state = {
id: '', // 视频课ID
id: '', // 线上课ID
studentIds: [],
};
}
......@@ -44,7 +45,7 @@ class OfflineCourseList extends React.Component {
handlePlanName = (planArray) => {
let planStr = '';
planArray.map((item, index) => {
planArray.forEach((item, index) => {
if (index < planArray.length - 1) {
planStr = planStr + item.planName + '、';
} else {
......@@ -64,13 +65,13 @@ class OfflineCourseList extends React.Component {
fixed: 'left',
render: (val, record) => {
const { courseMediaVOS, courseName, offlinePlace, calendarTime, startTime, endTime } = record;
const coverUrl = (_.find(courseMediaVOS, (data) => data.contentType === 'COVER') || {}).mediaUrl;
const coverUrl = (find(courseMediaVOS, (data) => data.contentType === 'COVER') || {}).mediaUrl;
let isContinue = calendarTime.length > 1;
_.reduce(calendarTime, (a, b) => {
reduce(calendarTime, (a, b) => {
isContinue = isContinue && b - a === 86400000;
return b;
});
const lastTime = _.last(calendarTime);
const lastTime = last(calendarTime);
const time = `${
!isContinue
? calendarTime.map((item) => moment(item).format('MM-DD')).join('、')
......@@ -138,7 +139,9 @@ class OfflineCourseList extends React.Component {
width: 120,
dataIndex: 'courseware',
render: (val, item, index) => {
return <Switch disabled={item.courseState === 'EXPIRED'} checked={item.shelfState === 'YES'} onChange={() => this.changeShelfState(item)} />;
return (
<Switch size='small' disabled={item.courseState === 'EXPIRED'} checked={item.shelfState === 'YES'} onChange={() => this.changeShelfState(item)} />
);
},
},
{
......
src/modules/course-manage/offline-course/components/OfflineCourseOpt.jsx
......@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:15
* @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-26 16:07:27
* @Description: 视频课-操作模块
* @Description: 线上课-操作模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......
src/modules/course-manage/utils/hasExportPermission.js
......@@ -14,7 +14,7 @@ const hasExportPermission = (type) => {
return Permission.hasInteractiveExport();
}
// 视频课导出权限
// 线上课导出权限
if (type === 'videoClass') {
return Permission.hasVideoClassExport();
}
......
src/modules/course-manage/video-course/AddVideoCourse.less
......@@ -32,6 +32,12 @@
display:inline-block;
text-align:right;
width:85px;
&.upload-chapter {
margin-top: 6px;
}
&.cover {
margin-top: 2px;
}
}
.required {
position: relative;
......@@ -49,14 +55,16 @@
}
}
.course-catalog{
margin-bottom:16px;
margin-top:16px;
margin-bottom:24px;
margin-top:24px;
}
.course-ware {
display: flex;
align-items: center;
margin-bottom: 4px;
&__index {
width: 18px;
}
&__img {
width: 24px;
margin-right: 4px;
......@@ -75,7 +83,19 @@
.img-content {
width: 298px;
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 {
width: 100%;
height: 100%;
......@@ -85,21 +105,26 @@
.empty-img {
width: 298px;
height: 172px;
border: 1px dashed #EBEBEB;
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;
margin-bottom: 8px;
.span {
color: #ccc;
margin-left: 8px;
}
.defalut-span {
cursor: pointer;
color: #2966ff;
}
.tips {
margin-left: 12px;
margin-top: 8px;
color: #999;
}
}
......@@ -115,14 +140,92 @@
color: #333;
}
}
.upload-video {
display: flex;
margin-bottom: 24px;
.sub-content {
margin-top: 4px;
.btn-wrap {
display: flex;
.course-ware--empty {
margin-left: 12px;
line-height: 28px;
}
}
.tips {
margin-top: 8px;
color: #999;
}
}
}
.sub-content {
.course-chapter-list-wrap {
position: relative;
margin-left: 85px;
margin-top: 4px;
.tips {
margin-left: 4px;
color: #999;
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;
overflow-y: auto ;
border-radius: 4px;
padding: 12px 16px 16px 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);
}
}
}
}
}
}
}
......@@ -138,10 +241,48 @@
justify-content: flex-end;
padding-right: 72px;
background: #fff;
border-top: 1px solid #E8E8E8;
border-top: 1px solid #ccc2c2;
z-index: 999;
.ant-btn {
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;
}
}
.course-chapter-title-popover {
.tag-title {
color: #333333;
margin-bottom: 8px;
width: 318px;
}
.chapter-btns {
margin-top: 16px;
display: flex;
justify-content: flex-end;
.confirm {
margin-left: 8px;
}
}
.ant-form-item {
margin-bottom: 0 !important;
}
}
.my-chapter-tooltip {
max-width: 600px!important;
}
\ 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-15 14:04:21
* @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 { FileTypeIcon } from '@/common/constants/academic/lessonEnum'
import BaseService from "@/domains/basic-domain/baseService";
import {YZ_APPId,YZ_PREVIEW_URL} from '@/domains/basic-domain/constants';
import PreviewFileModal from '@/bu-components/PreviewFileModal';
import './VideoCourseDetail.less';
declare var getParameterByName: any;
declare var window: any;
const FileTypeIconMap:any = FileTypeIcon
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);
const [showPreviewModal,setShowPreviewModal] = useState(false); //是否显示loading
// const [previewing,setPreviewing] = useState(false); //是否正在预览
const [previewStatus,setPreviewStatus] = useState('UPLOAD'); //预览文件的生成状态
const [url,setUrl] = useState('');
let previewing = false;
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);
})
}
async function handleScanFileModal(fileType: string = "MP4", fileObj:any){
const {fileVersionId,name,mediaUrl,id} = fileObj;
if(fileType === "VIDEO"){
const scanFileModal = (
<ScanFileModal
fileType={fileType}
item={fileObj}
close={() => {
setScanFileModal(null);
}}
/>
);
setScanFileModal(scanFileModal)
}else{
if(!fileVersionId){
setShowPreviewModal(true);
previewing = true;
setPreviewStatus('UPLOAD');
const uploadParams ={
fileUrl:mediaUrl,
yoZoTypeEnum:'UPLOAD'
}
const uploadSign:any = await BaseService.getYoZoSign(uploadParams);
BaseService.yoZoUpload(mediaUrl,YZ_APPId,uploadSign).then(async function (response){
const saveParams ={
fileVersionId:response.data.data.fileVersionId,
courseChapterId:id
}
BaseService.saveFileVersionIdByCourseChapter(saveParams);
if(previewing){
const previewParams ={
fileVersionId:response.data.data.fileVersionId,
yoZoTypeEnum:'VIEW',
htmlTitle:name
}
const previewSign = await BaseService.getYoZoSign(previewParams);
const url = `${YZ_PREVIEW_URL}?fileVersionId=${response.data.data.fileVersionId}&appId=${YZ_APPId}&sign=${previewSign}&htmlTitle=${name}`
setPreviewStatus('UPLOAD_SUCCESS');
setUrl(url)
}
})
}else{
const previewParams ={
fileVersionId,
yoZoTypeEnum:'VIEW',
htmlTitle:name
}
const previewSign = await BaseService.getYoZoSign(previewParams);
const url = `${YZ_PREVIEW_URL}?fileVersionId=${fileVersionId}&appId=${YZ_APPId}&sign=${previewSign}&htmlTitle=${name}`
const a = document.createElement('a');
document.body.appendChild(a);
a.setAttribute('href', url);
a.setAttribute('target', '_blank');
a.click();
document.body.removeChild(a)
}
}
}
// function previewingSet(){
// return new Promise(async (resolve) => {
// setShowPreviewModal(true);
// setPreviewing(true);
// setPreviewStatus('UPLOAD');
// resolve(true);
// })
// }
function cancelPreview(){
setShowPreviewModal(false);
// setPreviewing(false);
previewing = false;
setPreviewStatus('UPLOAD');
}
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/TwtGPQGE4K.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(item.mediaType,item)}} key={index}>
<div className="course-ware__index">{index < 9 ? `0${index + 1 } ` : index + 1}</div>
<img className='course-ware__img' src={FileTypeIconMap[item.mediaType]} alt='' />
<div className='course-ware__name'>{item.name}</div>
</div>
})
}
</If>
</div>
</div>
</div>
{ showPreviewModal &&
<PreviewFileModal onCancel={()=>cancelPreview()} previewStatus={previewStatus} url={url}/>
}
{scanFileModal}
</div>
}
export default withRouter(VideoCourseDetail);
\ No newline at end of file
src/modules/course-manage/video-course/components/AddVideoIntro.jsx
/*
* @Author: 吴文洁
* @Date: 2020-07-16 11:05:17
* @Author: 吴文洁
* @Date: 2020-07-16 11:05:17
* @Last Modified by: chenshu
* @Last Modified time: 2021-04-06 16:44:09
* @Description: 添加直播-简介
*/
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import { Col, message, Row, Switch } from 'antd';
import React from 'react';
import { Input, message, Upload, Radio, Row, Col, Button, Popover, Switch } from 'antd';
import Service from '@/common/js/service';
import GraphicsEditor from '../../components/GraphicsEditor';
import User from '@/common/js/user';
import UploadOss from '@/core/upload';
import { filter } from 'underscore';
import './AddVideoIntro.less';
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import { DISK_MAP } from '@/common/constants/academic/lessonEnum';
import { ImgCutModalNew } from '@/components';
const { TextArea } = Input;
const defaultCover = 'https://xiaomai-image.oss-cn-hangzhou.aliyuncs.com/1599635741526.png';
class AddVideoIntro extends React.Component {
constructor(props) {
super(props);
this.state = {
warmUrl: defaultCover,
showSelectFileModal: false,
diskList: [],
selectType:null
}
selectType: null,
};
}
// 上传封面图
handleShowImgCutModal = (event) => {
const imageFile = event.target.files[0];
if (!imageFile) return;
if (!imageFile) return;
this.setState({
imageFile,
showCutModal: true,
});
}
};
// 选择暖场资源
handleSelectVideo = (file) => {
const { selectType } = this.state;
// 选择暖场资源
handleSelectVideo = (file) => {
const { selectType } = this.state;
this.setState({
showSelectFileModal: false
})
showSelectFileModal: false,
});
const { ossUrl, resourceId, folderName, folderFormat, folderSize } = file;
if(selectType === 'WARMUP'){
if (selectType === 'WARMUP') {
const liveCourseWarmMedia = {
contentType: 'WARMUP',
mediaType: folderFormat === 'MP4' ? 'VIDEO' : 'PICTURE',
mediaContent: resourceId,
mediaUrl: ossUrl,
mediaName: folderName,
size: folderSize
}
size: folderSize,
};
this.props.onChange('liveCourseWarmMedia', liveCourseWarmMedia);
}else{
// 最多添加九图片
const { liveCourseMediaRequests } = this.props.data;
} else {
// 最多添加九图片
const { liveCourseMediaRequests } = this.props.data;
const list = _.filter(liveCourseMediaRequests, (item) => {
return item.mediaType == "PICTURE";
});
if (list.length > 8) {
message.warning("最多添加9张图片");
return;
}
liveCourseMediaRequests.push({
contentType: 'INTRO',
size: folderSize,
mediaName: folderName,
mediaContent: resourceId,
mediaType: 'PICTURE',
mediaUrl: ossUrl,
});
this.props.onChange('liveCourseMediaRequests', liveCourseMediaRequests);
const list = filter(liveCourseMediaRequests, (item) => {
return item.mediaType === 'PICTURE';
});
if (list.length > 8) {
message.warning('最多添加9张图片');
return;
}
liveCourseMediaRequests.push({
contentType: 'INTRO',
size: folderSize,
mediaName: folderName,
mediaContent: resourceId,
mediaType: 'PICTURE',
mediaUrl: ossUrl,
});
this.props.onChange('liveCourseMediaRequests', liveCourseMediaRequests);
}
}
};
changeIntro = (value) => {
this.props.onChange('introduce', value);
}
};
handleUpload = (Blob) => {
this.setState({
showSelectFileModal: true,
selectType:'INTRO'
})
}
whetherVisitorsJoinChange = ()=>{
if(this.props.data.whetherVisitorsJoin==="NO"){
this.props.onChange('whetherVisitorsJoin','YES')
}else{
this.props.onChange('whetherVisitorsJoin','NO')
selectType: 'INTRO',
});
};
whetherVisitorsJoinChange = () => {
if (this.props.data.whetherVisitorsJoin === 'NO') {
this.props.onChange('whetherVisitorsJoin', 'YES');
} else {
this.props.onChange('whetherVisitorsJoin', 'NO');
}
}
shelfStateChange = ()=>{
if(this.props.data.shelfState==="NO"){
this.props.onChange('shelfState','YES')
}else{
this.props.onChange('shelfState','NO')
};
shelfStateChange = () => {
if (this.props.data.shelfState === 'NO') {
this.props.onChange('shelfState', 'YES');
} else {
this.props.onChange('shelfState', 'NO');
}
}
};
render() {
const {data: { whetherVisitorsJoin,liveCourseMediaRequests = [], shelfState, id, introduce, loadintroduce } } = this.props;
const {showSelectFileModal,selectType} = this.state
const {
data: { whetherVisitorsJoin, shelfState, id, introduce, loadintroduce },
} = this.props;
const { showSelectFileModal, selectType } = this.state;
return (
<div className="add-video__intro-info">
<div className="allow-tourist-join">
<span className="label">观看设置：</span>
<div className="content">
<div className='add-video__intro-info'>
<div className='allow-tourist-join'>
<span className='label'>观看设置：</span>
<div className='content'>
<div>
<Switch checked={whetherVisitorsJoin==="YES"? true:false} onChange={this.whetherVisitorsJoinChange}/>
<Switch checked={whetherVisitorsJoin==="NO"? true:false} onChange={this.whetherVisitorsJoinChange}/>
</div>
<div>
<div className="desc">
<div>开启：允许未绑定手机号的学员观看</div>
<div>关闭：仅限绑定了手机号的学员可以进入观看视频</div>
<Choose>
<When condition={whetherVisitorsJoin==="NO"}>
<div>已开启，学员需绑定手机号才可观看</div>
</When>
<Otherwise>
<div>已关闭，学员无需绑定手机号即可观看</div>
</Otherwise>
</Choose>
</div>
</div>
</div>
</div>
</div>
<div className="store-show">
......@@ -136,48 +136,57 @@ class AddVideoIntro extends React.Component {
</Col>
<Col span={21}>
<div className="desc">
<div>开启：此视频将在学员学院的视频列表中出现</div>
<div>关闭：此视频将在学员学院的视频列表中隐藏</div>
<Choose>
<When condition={shelfState==="YES"}>
<div>已开启，课程将在该学院的学员课程列表中显示</div>
</When>
<Otherwise>
<div>已关闭，课程将在该学院的学员课程列表中隐藏</div>
</Otherwise>
</Choose>
</div>
</Col>
</Row>
</div>
</div>
<div className="introduce">
<span className="label">视频课简介：</span>
<span className="label">课程简介：</span>
<div className="content">
<div className="intro-list">
<div className="intro-list__item introduce-editor">
{(!id || loadintroduce) &&
{(!id || loadintroduce) && (
<GraphicsEditor
maxLimit={1000}
id="intro"
isIntro={true}
detail={{
content: introduce
content: introduce,
}}
onChange={(val) => {
this.changeIntro(val);
}}
onChange={(val) => { this.changeIntro(val) }}
/>
}
)}
</div>
</div>
</div>
</div>
{/* 选择暖场图文件弹窗 */}
{ showSelectFileModal &&
{showSelectFileModal && (
<SelectPrepareFileModal
operateType="select"
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'] }
tooltip={ selectType==="INTRO"?'支持文件类型：jpg、jpeg、png':'支持文件类型：jpg、jpeg、png、mp4'}
operateType='select'
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']}
tooltip={selectType === 'INTRO' ? '支持文件类型：jpg、jpeg、png' : '支持文件类型：jpg、jpeg、png、mp4'}
isOpen={showSelectFileModal}
onClose={() => {
this.setState({ showSelectFileModal: false })
this.setState({ showSelectFileModal: false });
}}
onSelect={this.handleSelectVideo}
/>
}
)}
</div>
)
);
}
}
......
src/modules/course-manage/video-course/components/AddVideoIntro.less
......@@ -32,14 +32,17 @@
}
.store-show{
display:flex;
margin-top:16px;
margin-bottom:16px;
margin-top:24px;
margin-bottom:24px;
.desc{
margin-left:16px;
margin-left:11px;
font-size:14px;
color:#999;
display:inline-block;
}
.content {
width: 400px;
}
}
.radio {
display: block;
......
src/modules/course-manage/video-course/components/ChapterList.jsx 0 → 100644
import React from 'react';
import './ChapterList.less';
import { FileTypeIcon } from '@/common/constants/academic/lessonEnum'
const FileTypeIconMap = FileTypeIcon;
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'>
<img className='course-ware__img' src={FileTypeIconMap[item.mediaType]} alt='' />
<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>
{ item.mediaType === 'VIDEO' &&
<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;
white-space: nowrap;
margin-left: 8px;
margin-right: 6px;
line-height: 20px;
}
&__img {
width: 20px;
height: 20px;
}
&__detail {
display: flex;
flex-direction: column;
&__name {
font-size: 13px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
line-height: 20px;
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 { FileTypeIcon } from '@/common/constants/academic/lessonEnum'
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={FileTypeIcon[item.mediaType]} 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: 吴文洁
* @Date: 2020-08-05 10:11:57
* @LastEditors: fusanqiasng
* @LastEditTime: 2021-05-28 20:14:37
* @Description: 视频课-搜索模块
* @LastEditors: yuananting
* @LastEditTime: 2021-07-12 14:14:47
* @Description: 线上课-搜索模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -56,22 +56,17 @@ class VideoCourseFilter extends React.Component {
this.getTeacherList()
this.queryCategoryTree()
}
// 查询分类树
queryCategoryTree = (categoryName = '') => {
let query = {
bizType: 'QUESTION',
source: 2,
categoryName,
tenantId: User.getStoreId(),
userId: User.getStoreUserId(),
count: false,
queryCategoryTree = ()=> {
const params= {
storeId:User.getStoreId()
}
AidToolService.queryExternalCategoryTree(query).then((res) => {
const { categoryList = [] } = res.result
console.log(this.renderTreeNodes(categoryList))
this.setState({
categoryList: this.renderTreeNodes(categoryList),
categoryName,
StoreService.getStoreDetail(params).then((res) => {
const { result = {} } = res;
result.coursePackageId && AidToolService.queryCategoryTreeByPackage({coursePackageId: result.coursePackageId}).then((res) => {
const { result = [] } = res;
this.setState({categoryList: this.renderTreeNodes(result)})
})
})
}
......@@ -192,10 +187,10 @@ class VideoCourseFilter extends React.Component {
<Row type='flex' justify='space-between' align='top'>
<div className='search-condition'>
<div className='search-condition__item'>
<span className='search-name'>视频课名称：</span>
<span className='search-name'>线上课名称：</span>
<Search
value={courseName}
placeholder='搜索视频课名称'
placeholder='搜索线上课名称'
onChange={(e) => {
this.handleChangeQuery('courseName', e.target.value)
}}
......
src/modules/course-manage/video-course/components/VideoCourseList.jsx
import { Dropdown, message, Modal, Switch, Tooltip } from 'antd';
import User from '@/common/js/user';
import { PageControl } from '@/components';
import { LIVE_SHARE } from '@/domains/course-domain/constants';
import CourseService from '@/domains/course-domain/CourseService';
import ShareLiveModal from '@/modules/course-manage/modal/ShareLiveModal';
import React from 'react';
import RelatedPlanModal from '../../modal/RelatedPlanModal';
import WatchDataModal from '../modal/WatchDataModal';
import React from "react"
import { Modal, message, Tooltip, Switch, Dropdown } from "antd"
import _ from "underscore"
import { PageControl } from "@/components"
import { LIVE_SHARE } from "@/domains/course-domain/constants"
import { Route, withRouter } from 'react-router-dom';
import ShareLiveModal from "@/modules/course-manage/modal/ShareLiveModal"
import CourseService from "@/domains/course-domain/CourseService"
import RelatedPlanModal from "../../modal/RelatedPlanModal"
import User from "@/common/js/user"
import VideoCourseDetail from '../VideoCourseDetail';
import WatchData from "./WatchData";
import { XMTable } from '@/components';
import college from '@/common/lottie/college';
import './VideoCourseList.less';
import "./VideoCourseList.less"
class VideoCourseList extends React.Component {
constructor(props) {
......@@ -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) => {
const watchDataModal = (
<WatchDataModal
type='videoCourseList'
data={record}
close={() => {
this.setState({
watchDataModal: null,
});
}}
/>
);
this.setState({ watchDataModal });
};
handleShowWatchDataModal = (item) => {
const { match } = this.props;
window.RCHistory.push({
pathname: `${match.url}/course-data?courseName=${item.courseName}&courseId=${item.id}`
})
}
// 请求表头
parseColumns = () => {
......@@ -54,23 +56,21 @@ class VideoCourseList extends React.Component {
const { ShelfLoading } = this.state;
const columns = [
{
title: '视频课',
key: 'scheduleName',
dataIndex: 'scheduleName',
title: "线上课",
key: "scheduleName",
dataIndex: "scheduleName",
width: 321,
fixed: 'left',
render: (val, record) => {
const { coverUrl, scheduleVideoUrl } = record;
const { coverUrl } = record;
return (
<div className='record__item'>
{/* 上传了封面的话就用上传的封面, 没有的话就取视频的第一帧 */}
<img
className='course-cover'
src={
coverUrl ||
(type === 'internal' ? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast` : 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png')
coverUrl || 'https://image.xiaomaiketang.com/xm/TwtGPQGE4K.png'
}
alt=''
alt='封面图'
/>
<Choose>
<When condition={record.courseName.length > 25}>
......@@ -99,9 +99,9 @@ class VideoCourseList extends React.Component {
</If>
</span>
),
key: 'categoryName',
dataIndex: 'categoryName',
width: 200,
key: "categoryName",
dataIndex: "categoryName",
width: 150,
render: (val, record) => {
return (
<Choose>
......@@ -119,21 +119,15 @@ class VideoCourseList extends React.Component {
},
},
{
title: '创建人',
key: 'createName',
dataIndex: 'createName',
title: '课节数',
key: 'chapterNum',
dataIndex: 'chapterNum',
className: "chapterNum",
width: 100,
render: (val) => {
return (
<div>
{val && (
<Tooltip title={val}>
<div>{val.length > 4 ? `${val.slice(0, 4)}...` : val}</div>
</Tooltip>
)}
</div>
);
},
align: 'right',
render: (val,item) => {
return <div onClick={()=>this.handleLinkToCourseDetail(item.id)}>{val || 1}</div>
}
},
{
title: (
......@@ -159,6 +153,7 @@ class VideoCourseList extends React.Component {
render: (val, item, index) => {
return (
<Switch
size='small'
loading={ShelfLoading}
checked={item.shelfState === 'YES'}
defaultChecked={item.shelfState}
......@@ -170,13 +165,31 @@ class VideoCourseList extends React.Component {
},
},
{
title: '观看学员数',
width: 110,
key: 'watchUserCount',
dataIndex: 'watchUserCount',
title: "观看学员数",
width: 150,
key: "watchUserCount",
dataIndex: "watchUserCount",
align: 'right',
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: '创建时间',
......@@ -230,22 +243,17 @@ class VideoCourseList extends React.Component {
title: '操作',
key: 'operate',
dataIndex: 'operate',
width: 210,
width: 160,
fixed: 'right',
render: (val, record) => {
return (
<div className='operate'>
<div className='operate__item' onClick={() => this.handleShowWatchDataModal(record)}>
观看数据
</div>
<If condition={type === 'internal'}>
<span className='operate__item split'> | </span>
<If condition={type === "internal"}>
<div className='operate__item' onClick={() => this.handleShowShareModal(record)}>
分享
</div>
<span className='operate__item split'> | </span>
</If>
<span className='operate__item split'> | </span>
<Dropdown overlay={this.renderMoreOperate(record)}>
<span className='more-operate'>
<span className='operate-text'>更多</span>
......@@ -260,7 +268,7 @@ class VideoCourseList extends React.Component {
},
];
type !== 'internal' && columns.splice(2, 1);
type !== 'internal' && columns.splice(5, 1);
return columns;
};
......@@ -327,7 +335,7 @@ class VideoCourseList extends React.Component {
});
};
// 删除视频课
// 删除线上课
handleDeleteVideoCourse = (scheduleId) => {
Modal.confirm({
title: '你确定要删除此视频课吗？',
......@@ -369,7 +377,7 @@ class VideoCourseList extends React.Component {
data={shareData}
type='videoClass'
courseDivision={type}
title='视频课'
title='线上课'
close={() => {
this.setState({
shareLiveModal: null,
......@@ -446,7 +454,7 @@ class VideoCourseList extends React.Component {
);
};
render() {
const { dataSource = [], totalCount, query, type } = this.props;
const { dataSource = [], totalCount, query, type, match } = this.props;
const { current, size } = query;
const { RelatedPlanModalVisible, selectPlanList, selectCourseId } = this.state;
return (
......@@ -465,16 +473,6 @@ class VideoCourseList extends React.Component {
scroll={{ x: 1500 }}
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'>
<PageControl
......@@ -499,9 +497,11 @@ class VideoCourseList extends React.Component {
)}
{this.state.shareLiveModal}
{this.state.watchDataModal}
<Route path={`${match.url}/video-course-detail`} component={VideoCourseDetail} />
<Route path={`${match.url}/course-data`} component={WatchData} />
</div>
);
}
}
export default VideoCourseList;
export default withRouter(VideoCourseList);
src/modules/course-manage/video-course/components/VideoCourseList.less
......@@ -24,11 +24,17 @@
}
}
}
.chapterNum {
color: #2966ff;
cursor: pointer;
}
}
}
.watchUserCount {
text-align: right;
padding: 16px;
color: #2966ff;
cursor: pointer;
}
.operate-text {
color: #2966FF;
......
src/modules/course-manage/video-course/components/VieoCourseOpt.jsx
......@@ -3,7 +3,7 @@
* @Date: 2020-08-05 10:12:15
* @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-26 16:07:27
* @Description: 视频课-操作模块
* @Description: 线上课-操作模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -22,7 +22,7 @@ export default function VideoCourseOpt() {
RCHistory.push('/create-video-course?type=add');
}}
className="mr12"
>新建视频课</Button>
>新建线上课</Button>
</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 {
current: 1,
storeId: User.getStoreId(),
},
dataSource: [], // 视频课列表
totalCount: 0, // 视频课数据总条数
dataSource: [], // 线上课列表
totalCount: 0, // 线上课数据总条数
currentTabKey: 'internal',
};
}
componentWillMount() {
// 获取视频课列表
// 获取线上课列表
this.handleFetchScheduleList();
}
// 获取视频课列表
// 获取线上课列表
handleFetchScheduleList = (_query = {}) => {
const { currentTabKey } = this.state;
const query = {
......@@ -81,7 +81,7 @@ class VideoCourse extends React.Component {
const { dataSource, totalCount, query, currentTabKey } = this.state;
return (
<div className='page video-course-page'>
<div className='content-header'>视频课</div>
<div className='content-header'>线上课</div>
<div className='box'>
<Tabs onChange={this.currenTabChange} activeKey={currentTabKey}>
......@@ -95,7 +95,7 @@ class VideoCourse extends React.Component {
<If condition={currentTabKey === 'internal'}>
<VideoCourseOpt />
</If>
{/* 视频课列表模块 */}
{/* 线上课列表模块 */}
<VideoCourseList
type={currentTabKey}
query={query}
......
src/modules/course-manage/video-course/modal/WatchDataModal.jsx
......@@ -3,7 +3,7 @@
* @Date: 2020-05-19 11:01:31
* @Last Modified by: 吴文洁
* @Last Modified time: 2020-05-25 16:50:47
* @Description 余额异常弹窗
* @Description 学员观看数据弹窗
*/
import User from '@/common/js/user';
import { PageControl, XMTable } from '@/components';
......@@ -127,66 +127,53 @@ class WatchDataModal extends React.Component {
render() {
const { visible, size, dataSource, totalCount, query } = this.state;
return (
<Modal
title='视频课观看数据'
visible={visible}
footer={null}
onCancel={this.onClose}
maskClosable={false}
className='watch-data-modal'
closable={true}
width={800}
closeIcon={<span className='icon iconfont modal-close-icon'>&#xe6ef;</span>}>
<div className='search-container'>
<Search
placeholder='搜索学员姓名/手机号'
style={{ width: 200 }}
onChange={(e) => {
this.handleChangNickname(e.target.value);
}}
onSearch={() => {
this.handleFetchDataList();
}}
enterButton={<span className='icon iconfont'>&#xe832;</span>}
/>
</div>
<div>
<XMTable
renderEmpty={{
image: college,
description: '暂无数据',
}}
rowKey={(record) => record.id}
dataSource={dataSource}
columns={this.parseColumns()}
pagination={false}
bordered
/>
{dataSource.length > 0 && (
<div className='box-footer'>
<PageControl
current={query.current - 1}
pageSize={size}
total={totalCount}
size='small'
toPage={(page) => {
const _query = { ...query, current: page + 1 };
this.setState(
{
query: _query,
},
() => {
this.handleFetchDataList();
}
);
}}
onShowSizeChange={this.onShowSizeChange}
/>
</div>
)}
</div>
</Modal>
);
<Modal
title="线上课观看数据"
visible={visible}
footer={null}
onCancel={this.onClose}
maskClosable={false}
className="watch-data-modal"
closable={true}
width={800}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
>
<div className="search-container">
<Search placeholder="搜索学员姓名/手机号" style={{ width: 200 }} onChange={(e) => { this.handleChangNickname(e.target.value)}} onSearch={ () => { this.handleFetchDataList()}} enterButton={<span className="icon iconfont">&#xe832;</span>}/>
</div>
<div>
<XMTable
renderEmpty={{
image: college,
description: '暂无数据',
}}
rowKey={record => record.id}
dataSource={dataSource}
columns={this.parseColumns()}
pagination={false}
bordered
/>
{dataSource.length >0 &&
<div className="box-footer">
<PageControl
current={query.current - 1}
pageSize={size}
total={totalCount}
size="small"
toPage={(page) => {
const _query = {...query, current: page + 1};
this.setState({
query:_query
},()=>{ this.handleFetchDataList()})
}}
onShowSizeChange={this.onShowSizeChange}
/>
</div>
}
</div>
</Modal>
)
}
}
......
src/modules/home/Home.jsx
......@@ -343,7 +343,7 @@ class Home extends React.Component {
</div>
</div>
<div className='course-item'>
<div className='course-title'>视频课</div>
<div className='course-title'>线上课</div>
<div className='data'>
<span className='course-number'>{videoCourseNum}</span>
{incVideoCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
......@@ -409,10 +409,9 @@ class Home extends React.Component {
</span>
<span
className={`tab${scheduleType === 'VOICE' ? ' selected' : ''}`}
onClick={() => this.setState({ scheduleType: 'VOICE' }, () => this.getHotCourse())}>
视频课
</span>
<span
onClick={() => this.setState({ scheduleType: 'VOICE' }, () => this.getHotCourse())}
>线上课</span>
<span
className={`tab${scheduleType === 'PICTURE' ? ' selected' : ''}`}
onClick={() => this.setState({ scheduleType: 'PICTURE' }, () => this.getHotCourse())}>
图文课
......
src/modules/knowledge-base/ENUM.js
......@@ -55,7 +55,7 @@ const ENUM = {
CourseTypeEnum: {
LIVE: "直播课",
VOICE: "视频课",
VOICE: "线上课",
PICTURE: "图文课",
FOLDER: "学习资料",
},
......
src/modules/knowledge-base/components/Classification.jsx
......@@ -188,7 +188,7 @@ class Classification extends Component {
<div className='sider-title'>知识分类</div>
<Search
className='sider-search'
placeholder='搜索名称分类'
placeholder='搜索分类名称'
onSearch={(value) => {
this.queryCategoryTree(value);
}}
......
src/modules/knowledge-base/components/KnowledgeBaseFilter.jsx
......@@ -65,10 +65,11 @@ class KnowledgeBaseFilter extends React.Component {
<Row type="flex" justify="space-between" align="top">
<div className="search-condition">
<div className="search-condition__item">
<span className="search-name">课程名称：</span>
<span className="search-name">资料名称：</span>
<Search
value={name}
placeholder="搜索课程名称"
// allowClear
placeholder="搜索资料名称"
onChange={(e) => {
this.handleChangeQuery("name", e.target.value, false);
}}
......@@ -79,33 +80,6 @@ class KnowledgeBaseFilter extends React.Component {
enterButton={<span className="icon iconfont">&#xe832;</span>}
/>
</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 className="reset-fold-area">
<Tooltip title="清空筛选">
......
src/modules/knowledge-base/components/KnowledgeBaseList.jsx
......@@ -2,13 +2,14 @@
* @Description:
* @Author: zangsuyun
* @Date: 2021-03-12 14:49:40
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-11 16:44:59
* @LastEditors: yuananting
* @LastEditTime: 2021-07-15 14:07:42
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from "react";
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 { PageControl, XMTable } from "@/components";
import { LIVE_SHARE_MAP } from "@/common/constants/academic/cloudClass";
......@@ -181,185 +182,33 @@ class KnowledgeBaseList extends React.Component {
const { current, size } = query
const columns = [
{
title: "课程名称",
title: "名称",
key: "name",
dataIndex: "name",
width: 391,
fixed: "left",
render: (val, record) => {
const { coverUrl, mediaCourseUrl, courseDivision } = record.source
let hasCover = false
const type = record.type
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
className='record__item'
onClick={() => {
this.handleScanFile(record.source)
}}>
<div className={`folder-type ${record.source && record.source.folderFormat}`} />
{val.length > 25 ? (
<Tooltip title={val}>
<div className='course-name clamp'>{val}</div>
</Tooltip>
) : (
<div className='course-name clamp'>{val}</div>
)}
</div>
<div
className='record__item'
onClick={() => {
this.handleScanFile(record.source)
}}>
<img src={FileTypeIcon[record.source.folderFormat] } style={{width:24,height:24}} alt='' className='item-img' />
{val.length > 25 ? (
<Tooltip title={val}>
<div className='course-name clamp'>{val}</div>
</Tooltip>
) : (
<div className='course-name clamp'>{val}</div>
)}
</div>
)
}
},
{
title: "课程类型",
key: "type",
dataIndex: "type",
align: "center",
// width: 100,
render: (val, record) => {
return <div className=''>{val ? ENUM.CourseTypeEnum[val] : "-"}</div>
}
},
{
title: "创建人",
key: "createName",
dataIndex: "createName",
......@@ -393,7 +242,7 @@ class KnowledgeBaseList extends React.Component {
},
{
title: "",
width: 48
},
{
title: "操作",
......@@ -452,7 +301,6 @@ class KnowledgeBaseList extends React.Component {
const { match } = this.props;
localStorage.setItem("WatchData_CourseName", item.name);
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}`
})
}
......@@ -501,7 +349,7 @@ class KnowledgeBaseList extends React.Component {
dataSource={dataSource}
columns={this.parseColumns()}
pagination={false}
scroll={{ x: 900 }}
bordered
className="knowledge-list-table"
renderEmpty={{
......
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