Skip to content

X
xiaomai-cloud-class-web
Commit 3bcbb935 by zhangleyuan
Options

feat:调整创建直播课页面

parent bbd20dcd
Showing with 185 additions and 72 deletions
src/components/ImgCutModalNew.jsx
......@@ -184,7 +184,7 @@ ImgCutModalNew.propTypes = {
width: PropTypes.number,
cutWidth: PropTypes.number,
cutHeight: PropTypes.number,
// imageFile: PropTypes.File
imageFile: PropTypes.object
};
ImgCutModalNew.defaultProps = {
width: 550,
......
src/modules/course-manage/AddLive.jsx
......@@ -10,7 +10,6 @@ import React from 'react';
import { withRouter } from "react-router-dom";
import { Button, message, Modal } from 'antd';
import Bus from '@/core/bus';
import ShowTips from "@/components/ShowTips";
import Breadcrumbs from "@/components/Breadcrumbs";
......@@ -19,16 +18,20 @@ import AddLiveClass from './components/AddLiveClass';
import AddLiveIntro from './components/AddLiveIntro';
import PreviewCourseModal from './modal/PreviewCourseModal';
import LackConsumeStudentModal from './modal/LackConsumeStudentModal';
import StoreService from "@/domains/store-domain/storeService";
import moment from 'moment';
import './AddLive.less';
const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png';
// const editBoxKey = window.random_string(16);
const defaultBasicInfo = {
courseName: null, // 课程名称
coverId: null,
coverUrl: defaultCover
coverUrl: defaultCover,
parentCatalogId:'',
parentCatalogName:'',
sonCatalogId:'',
sonCatalogName:''
};
const defaultClassInfo = {
......@@ -80,23 +83,25 @@ class AddLive extends React.Component {
courseName: null, // 课程名称
coverId: null,
coverUrl: defaultCover,
parentCatalogId:'',
sonCatalogId:'',
courseCatalogOption:[
{
value: 'zhejiang',
value: '1',
label: 'Zhejiang',
children: [
{
value: 'hangzhou',
value: '2',
label: 'Hangzhou',
},
],
},
{
value: 'jiangsu',
value: '3',
label: 'Jiangsu',
children: [
{
value: 'nanjing',
value: '4',
label: 'Nanjing',
}
],
......@@ -144,7 +149,7 @@ class AddLive extends React.Component {
if (type === 'edit') {
this.getCourseDetail();
} else {
this.getLivePermission();
}
}
......@@ -248,25 +253,39 @@ class AddLive extends React.Component {
// });
// })
}
getLivePermission = () => {
// axios.Apollo("public/businessLive/queryLiveAccount").then((res) => {
// const { addParam } = this.state;
// let list = res.result || [];
// const isXiaomai = _.some(list, (item) => item.channel === "XIAOMAI");
// this.setState({ isXiaomai });
getCourseCatalogList = ()=>{
StoreService.getCourseCatalogList({current:1,size:1000}).then((res) => {
// let resultData = this.handleCatalogListData(res.result.records)
// setCourseCatalogList(resultData);
// setTotal(res.result.total);
});
}
handleCatalogListData = (listData)=>{
// listData.map((item:any,index:any) => {
// item.type = "parent"
// item.key = item.id;
// if(item.sonCategoryList){
// item.sonCategoryList.map((_item:any,_index:any) =>{
// _item.type = "child";
// _item.key=_item.id
// return _item
// });
// }
// return item
// })
// return listData
}
// 修改基本信息
handleChangeBasicInfo = (field, value, _coverUrl) => {
const { coverUrl } = this.state.addLiveBasicInfo;
console.log(field,value);
this.setState({
addLiveBasicInfo: {
...this.state.addLiveBasicInfo,
[field]: value,
coverUrl: _coverUrl ? _coverUrl : coverUrl,
}
})
},()=>{console.log(this.state.addLiveBasicInfo)})
}
// 修改上课信息
......@@ -484,23 +503,26 @@ class AddLive extends React.Component {
return new Promise((resolve) => {
const { type } = this.state;
// 校验基本信息（直播课名称）
const { courseName } = addLiveBasicInfo;
console.log("addLiveBasicInfo",addLiveBasicInfo);
const { courseName,parentCatalogId} = addLiveBasicInfo;
const {
liveDate, timeHorizonStart, timeHorizonEnd,
studentList, teacherId, calendarTime, consumeStudentList, consumeHourNum, consumeClassTime, applyMode
liveDate, timeHorizonStart, timeHorizonEnd, teacherId, calendarTime, consumeStudentList, consumeHourNum, consumeClassTime, applyMode
} = addLiveClassInfo;
const { liveCourseMediaRequests } = addLiveIntroInfo;
const currentTime = +new Date();
if(!courseName) {
message.warning('直播名称不能为空');
message.warning('请输入课程名称');
resolve(false);
return;
}
if(!parentCatalogId){
message.warning('请选择课程分类');
resolve(false);
return;
}
if(window.NewVersion && type === 'add') {
// 5.0新建 校验 批量排课
const { startTime, endTime } = addLiveClassInfo;
if(calendarTime.length && calendarTime.length === 0) {
if(calendarTime.length === 0) {
message.warning('请选择上课日期');
resolve(false);
return;
......@@ -526,48 +548,12 @@ class AddLive extends React.Component {
}
}
}
if(consumeClassTime > (endTime - startTime) / 60000) {
message.warning('到课规则时长不能超过排课时长');
resolve(false);
return;
}
} else {
const _liveDate = moment(liveDate).format("YYYY-MM-DD");
const _timeHorizonStart = moment(timeHorizonStart).format('HH:mm');
const _timeHorizonEnd = moment(timeHorizonEnd).format('HH:mm');
// if(consumeClassTime > (endTime - startTime) / 60000) {
// message.warning('到课规则时长不能超过排课时长');
// resolve(false);
// return;
// }
const startTime = moment(_liveDate + ' ' + _timeHorizonStart).format('x');
const endTime = moment(_liveDate + ' ' + _timeHorizonEnd).format('x');
if(!startTime || !endTime) {
message.warning('日期不能为空');
resolve(false);
return;
} else if (!timeHorizonStart) {
message.warning('开始时间不能为空');
resolve(false);
return;
} else if (!timeHorizonEnd) {
message.warning('结束时间不能为空');
resolve(false);
return;
} else if (isEdit && startTime < currentTime) {
message.warning('开始时间不能早于当前时间');
resolve(false);
return;
} else if (isEdit && endTime < currentTime) {
message.warning('结束时间不能早于当前时间');
resolve(false);
return;
} else if (isEdit && endTime <= startTime) {
message.warning("结束时间不能早于开始时间");
resolve(false);
return;
} else if(isEdit && consumeClassTime > (endTime - startTime) / 60000) {
message.warning("到课规则时长不能超过排课时长");
resolve(false);
return;
}
}
if(!teacherId) {
message.warning('上课老师不能为空');
resolve(false);
......
src/modules/course-manage/components/AddLiveBasic.jsx
......@@ -26,6 +26,10 @@ class AddLiveBasic extends React.Component {
showCutModal: false
}
}
componentWillUnmount() {
const { xhr } = this.state;
xhr && xhr.abort();
}
// 上传封面图
handleShowImgCutModal = (event) => {
......@@ -47,11 +51,23 @@ class AddLiveBasic extends React.Component {
this.props.onChange('coverId', null, defaultCover);
}
componentWillUnmount() {
const { xhr } = this.state;
xhr && xhr.abort();
catalogChange= (value) => {
const changeValueLength = value.length;
switch (changeValueLength){
case 1:
this.props.onChange('parentCatalogId',value[0]);
break;
case 2:
this.props.onChange('parentCatalogId',value[0]);
setTimeout(()=>{
this.props.onChange('sonCatalogId',value[1]);
},1000)
break;
default:
break;
}
}
render() {
const { showCutModal, imageFile } = this.state;
const { data, liveScene } = this.props;
......@@ -110,7 +126,7 @@ class AddLiveBasic extends React.Component {
</div>
<div className="course-catalog">
<span className="label"><span className="require">*</span>课程分类：</span>
<Cascader options={courseCatalogOption} style={{ width: 240 }} placeholder="请选择课程分类" />
<Cascader options={courseCatalogOption} displayRender={ label => label.join('-')} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" />
</div>
<ImgCutModalNew
title="裁剪"
......
src/modules/course-manage/components/AddLiveBasic.less
......@@ -50,7 +50,7 @@
.default-btn {
margin-left: 16px;
color: #FF7519;
color: #FFB714;
cursor: pointer;
&.disabled {
......
src/modules/course-manage/components/AddLiveIntro.jsx
......@@ -14,7 +14,7 @@ import UploadOss from "@/core/upload";
import EditorBox from '../components/EditorBox';
import './AddLiveIntro.less';
// import SelectPrepareFileModal from '../prepare-lesson/modal/SelectPrepareFileModal';
// import SelectPrepareFileModal from '../modal/SelectPrepareFileModal';
import { DISK_MAP } from '@/common/constants/academic/lessonEnum';
import { ImgCutModalNew } from '@/components';
......
src/modules/course-manage/modal/SelectPrepareFileModal.less 0 → 100644
.select-prepare-file-modal {
.ant-upload-list {
display: none;
}
.DefaultIcon {
margin: 12px 0 0 0;
border: 1px solid #E8E8E8;
border-radius: 4px;
padding: 100px 0;
.desc {
color: #999;
.upload-btn {
color: #FF7519;
margin: 0 4px;
cursor: pointer;
}
}
}
.radio-buttons {
text-align: center;
margin-bottom: 16px;
}
.file-path {
display: inline-block;
color: #333;
position: relative;
margin-bottom: 12px;
margin-right: 12px;
&:last-child {
color: #999;
}
&:not(:last-child) {
cursor: pointer;
&:hover {
color: #FF8534;
}
&::before {
content: '/';
position: absolute;
color: #CCC;
right: -8px;
}
}
}
.file-list {
border: 1px solid #E8E8E8;
border-radius: 4px;
.file-item {
display: flex;
align-items: center;
justify-content: space-between;
height: 48px;
padding: 12px 25px;
&:not(:last-child) {
border-bottom: 1px solid #E8E8E8;
}
&.enable {
cursor: pointer;
}
&.disable {
cursor: not-allowed;
opacity: 0.5;
}
&__cover {
min-width: 320px;
img {
margin-right: 8px;
}
}
&__size {
margin-left: 40px;
}
.iconfont {
color: #BFBFBF;
&.correct {
color: #FC9C6B;
}
}
}
}
.ant-modal-footer {
display: flex;
align-items: center;
justify-content: space-between;
.prepare-lesson-upload.hidden {
visibility: hidden;
}
.prepare-lesson-upload.visible {
visibility: visible;
}
.footer__left {
color: #FF7519;
cursor: pointer;
}
}
}
\ No newline at end of file
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