Skip to content

X
xiaomai-cloud-class-web
Commit 9df2307f by zhangleyuan
Options

feat:创建课程条助教选项改为多选

parent 6bb59f47
Showing with 50 additions and 297 deletions
src/components/ImgCutModalNew.jsx
import React from 'react';
import PropTypes from 'prop-types';
import { Modal, Button } from 'antd';
import UploadOss from '@/core/upload';
import Service from '@/common/js/service';
import User from '@/common/js/user';
let cutFlag = false;
class ImgCutModalNew extends React.Component {
......@@ -41,7 +41,7 @@ class ImgCutModalNew extends React.Component {
dataUrl = this.getBase64Size(dataUrl) > compressSizeByte ? await this.handleCompressImg(dataUrl, compressSizeByte, cutWidth) : dataUrl;
}
const cutImage = this.convertBase64UrlToBlob(dataUrl);
window.axios.Apollo("public/apollo/commonOssAuthority", params).then((res) => {
Service.Hades('public/hades/commonOssAuthority', param).then((res) => {
const { resourceId, accessId, policy, callback, signature,key, host } = res.result;
const localUrl = URL.createObjectURL(cutImage);
// 构建上传的表单
......
src/modules/course-manage/AddLive.jsx
......@@ -20,7 +20,7 @@ import PreviewCourseModal from './modal/PreviewCourseModal';
import CourseService from "@/domains/course-domain/CourseService";
import moment from 'moment';
import User from '@/common/js/user';
import _ from "underscore";
import './AddLive.less';
const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png';
......@@ -28,15 +28,15 @@ const defaultBasicInfo = {
courseName: null, // 课程名称
coverId: null,
coverUrl: defaultCover,
parentCatalogId:'',
parentCatalogName:'',
sonCatalogId:'',
sonCatalogName:''
parentCatalogId:null,
sonCatalogId:null,
categoryId:null,
categoryName:null
};
const defaultClassInfo = {
teacherId: null, //讲师的Id
adminId:null, //助教的Id
assistant:[], //助教
teacherName: null,
liveDate: null,
timeHorizonStart: null,
......@@ -73,15 +73,17 @@ class AddLive extends React.Component {
courseName: null, // 课程名称
coverId: null,
coverUrl: defaultCover,
parentCatalogId:'',
sonCatalogId:''
parentCatalogId:null,
sonCatalogId:null,
categoryId:null,
categoryName:null
},
// 直播课上课信息
addLiveClassInfo: {
teacherId: null,
teacherName: null,
adminId:null,
assistant:[],
liveDate: null,
timeHorizonStart: null,
timeHorizonEnd: null,
......@@ -129,8 +131,11 @@ class AddLive extends React.Component {
needRecord,
whetherVisitorsJoin,
warmMedia,
categoryId,
categoryName,
admins
} = res.result;
courseMediaVOS.map((item) => {
item.key = window.random_string(16);
return item;
......@@ -140,12 +145,17 @@ class AddLive extends React.Component {
courseName,
coverId,
coverUrl: coverUrl || defaultCover,
categoryId,
categoryName
};
const liveDate = startTime;
const timeHorizonStart = startTime;
const timeHorizonEnd = endTime;
const assistant = _.pluck(admins, "adminId");
console.log('assistant',assistant);
const addLiveClassInfo = {
assistant,
liveDate,
nickname,
teacherId,
......@@ -154,6 +164,7 @@ class AddLive extends React.Component {
startTime,
endTime,
}
const liveCourseMediaRequests = courseMediaVOS.length
? [...courseMediaVOS]
: [{ contentType:"INTRO",mediaType: 'TEXT', mediaContent: '', key: window.random_string(16) }, ...courseMediaVOS];
......@@ -164,6 +175,7 @@ class AddLive extends React.Component {
whetherVisitorsJoin,
liveCourseMediaRequests,
}
// 晚于开课前30分钟
if(new Date().getTime() > startTime - 1800000) {
isEdit = false
......@@ -247,11 +259,11 @@ class AddLive extends React.Component {
this.handleValidate(addLiveBasicInfo, addLiveClassInfo, addLiveIntroInfo, isEdit).then((res) => {
if (!res) return;
const { type } = this.state;
const { courseName, coverId, coverUrl,parentCatalogId} = addLiveBasicInfo;
const { courseName, coverId, coverUrl,parentCatalogId,sonCatalogId,categoryId} = addLiveBasicInfo;
const {
liveDate,
teacherId,
adminId,
assistant,
timeHorizonEnd,
timeHorizonStart,
calendarTime,
......@@ -259,6 +271,7 @@ class AddLive extends React.Component {
let { startTime, endTime } = addLiveClassInfo;
const { liveCourseMediaRequests, needRecord,whetherVisitorsJoin,liveCourseWarmMedia} = addLiveIntroInfo;
if(type === 'add') {
startTime = startTime;
endTime = endTime;
......@@ -270,9 +283,9 @@ class AddLive extends React.Component {
endTime = moment(_liveDate + ' ' + _timeHorizonEnd).format('x');
}
const commonParams = {
adminIds:[adminId],
adminIds:assistant,
calendarTime,
categoryId:parentCatalogId,
categoryId,
endTime,
needRecord,
startTime,
......@@ -280,13 +293,13 @@ class AddLive extends React.Component {
storeId:User.getStoreId(),
teacherId:teacherId,
whetherVisitorsJoin,
scheduleMediaRequests:[...liveCourseMediaRequests]
// scheduleMediaRequests:[...liveCourseMediaRequests]
}
if (type === 'add') {
const params = {
...commonParams,
operatorId:User.getUserId(),
}
CourseService.createLiveCloudCourse(params).then((res) => {
......@@ -317,23 +330,25 @@ class AddLive extends React.Component {
handleValidate = (addLiveBasicInfo, addLiveClassInfo, addLiveIntroInfo, isEdit) => {
return new Promise((resolve) => {
const { type } = this.state;
const { courseName,parentCatalogId} = addLiveBasicInfo;
const { courseName,parentCatalogId,categoryId} = addLiveBasicInfo;
const {
liveDate, timeHorizonStart, timeHorizonEnd, teacherId, calendarTime
} = addLiveClassInfo;
const { liveCourseMediaRequests } = addLiveIntroInfo;
const currentTime = +new Date();
if(!courseName) {
message.warning('请输入课程名称');
resolve(false);
return;
}
if(!parentCatalogId){
if(!categoryId){
message.warning('请选择课程分类');
resolve(false);
return;
}
if(type === 'add') {
const { startTime, endTime } = addLiveClassInfo;
if(calendarTime.length && calendarTime.length === 0) {
......@@ -494,6 +509,7 @@ class AddLive extends React.Component {
<div className="title">基本信息</div>
<AddLiveBasic
isEdit={isEdit}
pageType={type}
data={addLiveBasicInfo}
onChange={this.handleChangeBasicInfo}
/>
......
src/modules/course-manage/components/AddLiveBasic.jsx deleted 100644 → 0
/*
* @Author: 吴文洁
* @Date: 2020-07-15 17:29:12
* @Last Modified by: 吴文洁
* @Last Modified time: 2020-07-15 18:16:05
* @Description: 新建/编辑直播课-基本信息
*/
import React from 'react';
import { Input, Button, message ,Cascader } from 'antd';
import UploadOss from "@/core/upload";
import { ImgCutModalNew } from '@/components';
import StoreService from "@/domains/store-domain/storeService";
import './AddLiveBasic.less';
const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png';
const fieldNames = { label: 'categoryName', value: 'id', children: 'sonCategoryList' };
class AddLiveBasic extends React.Component {
constructor(props) {
super(props);
this.state = {
imageFile: null,
showCutModal: false,
courseCatalogList:[]
}
}
componentWillUnmount() {
}
componentDidMount(){
this.getCourseCatalogList();
}
getCourseCatalogList = ()=>{
StoreService.getCourseCatalogList({current:1,size:1000}).then((res) => {
this.setState({
courseCatalogList:res.result.records
})
});
}
// 上传封面图
handleShowImgCutModal = (event) => {
const imageFile = event.target.files[0];
if (!imageFile) return;
this.setState({
imageFile,
showCutModal: true,
});
}
// 使用默认封面图
handleResetCoverUrl = () => {
const { data: { coverUrl } } = this.props;
const isDefaultCover = coverUrl === defaultCover;
// 如果已经是默认图的话，不做任何任何处理
if (isDefaultCover) return;
message.success('已替换为默认图');
this.props.onChange('coverId', null, defaultCover);
}
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,courseCatalogList} = this.state;
const { data} = this.props;
const { courseName, coverUrl} = data;
const fileName = '';
// 当前是否使用的是默认图片
const isDefaultCover = coverUrl === defaultCover;
return (
<div className="add-live__basic-info">
<div className="course-name">
<span className="label"><span className="require">*</span>课程名称：</span>
<Input
value={courseName}
placeholder="请输入直播名称(40字以内)"
maxLength={40}
style={{ width: 240 }}
onChange={(e) => { this.props.onChange('courseName', e.target.value)}}
/>
</div>
<div className="course-cover">
<span className="label">封面图：</span>
<div className="course-cover__wrap">
<div className="img-content">
{
isDefaultCover && <span className="tag">默认图</span>
}
<img src={coverUrl} />
</div>
<div className="opt-btns">
<input
type="file"
value={fileName} // 避免选择同一文件 value不改变 不触发onChange事件
accept="image/png, image/jpeg, image/bmp, image/jpg"
ref="stagePicInputFile"
style={{display: 'none'}}
onChange={(event) => { this.handleShowImgCutModal(event) }}
/>
<Button onClick={() => {
this.setState({
currentInputFile: this.refs.stagePicInputFile
});
this.refs.stagePicInputFile.click();
}}>上传图片</Button>
<span
className={`default-btn ${isDefaultCover ? 'disabled' : ''}`}
onClick={this.handleResetCoverUrl}
>使用默认图</span>
<div className="tips">建议尺寸690*398像素，图片支持jpg、jpeg、png格式。</div>
</div>
</div>
</div>
<div className="course-catalog">
<span className="label"><span className="require">*</span>课程分类：</span>
<Cascader options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" />
</div>
<ImgCutModalNew
title="裁剪"
width={550}
cutWidth={500}
cutHeight={282}
cutContentWidth={500}
cutContentHeight={300}
visible={showCutModal}
imageFile={imageFile}
bizCode='LIVE_COURSE_MEDIA'
onOk={(urlStr, resourceId) => {
this.setState({ showCutModal: false });
this.props.onChange('coverId', resourceId, urlStr);
this.state.currentInputFile.value = '';
}}
onClose={() => this.setState({ showCutModal: false })}
reUpload={() => { this.state.currentInputFile.click() }}
/>
</div>
)
}
}
export default AddLiveBasic;
\ No newline at end of file
src/modules/course-manage/components/LiveCourseList.jsx
......@@ -172,17 +172,16 @@ class LiveCourseList extends React.Component {
<div className="course-name">{record.courseName}</div>
<div>
<span className="course-time">{formatDate("YYYY-MM-DD H:i",parseInt(record.startTime))}~{formatDate("H:i", parseInt(record.endTime))}</span>
<span>{courseStateShow[record.courseState].title}</span>
<span className="course-status" style={{color:courseStateShow[record.courseState].color,border:`1px solid ${courseStateShow[record.courseState].color}`}}>{courseStateShow[record.courseState].title}</span>
</div>
<div>
<span>讲师：{record.teacherName}</span>
<span> | </span>
<span className="teacher">讲师：{record.teacherName}</span>
<span className="split"> | </span>
<span>助教：
<span className="assistant">助教：
{ record.admins.map((item,index)=>{
return <span>{item.adminName}</span>
return <span>{item.adminName} { (index < record.admins.length-1)&&(<span> 、</span>)} </span>
})
}
</span>
......@@ -199,7 +198,7 @@ class LiveCourseList extends React.Component {
dataIndex: "couseCatalog",
render: (val, item) => {
return (
<div>{item.categoryName}</div>
<div className="categoryName">{item.categoryName}</div>
)
},
},
......@@ -210,7 +209,7 @@ class LiveCourseList extends React.Component {
dataIndex: "courseware",
render: (val, item) => {
return (
<span>{item.courseDocumentCount}</span>
<span className="courseware">{item.courseDocumentCount}</span>
);
},
},
......@@ -221,7 +220,7 @@ class LiveCourseList extends React.Component {
dataIndex: "quota",
render: (val, item) => {
return (
<span className="iconfont icon data-icon" onClick={() => {
<span className="iconfont icon quota-icon" onClick={() => {
this.handleLinkToClassData(item)
}}>&#xe7d6;</span>
);
......
src/modules/course-manage/components/LiveCourseList.less deleted 100644 → 0
.live-course-list {
margin-top: 16px;
.record__item {
display: flex;
align-items: center;
}
.operate {
display: flex;
align-items: center;
flex-wrap: wrap;
.operate__item {
color: #ff7519;
cursor: pointer;
&.split {
margin: 0 8px;
color: #BFBFBF;
}
}
}
.operate-text {
color: #ff7519;
cursor: pointer;
}
.course-cover {
min-width: 90px;
max-width: 90px;
height: 50px;
border-radius: 2px;
margin-right: 8px;
}
.course-status {
display: flex;
.badge {
transform: none !important;
display: flex;
align-items: center;
.ant-badge-status-dot {
top: 0;
}
.ant-badge-status-text {
white-space: nowrap;
}
}
}
.course-start-end {
margin-left: 16px;
width: 78px;
height: 20px;
border-radius: 2px;
border: 1px solid rgba(204, 204, 204, 1);
display: flex;
align-items: center;
cursor: pointer;
white-space: nowrap;
.start-icon {
color: #3296fa;
font-size: 12px;
transform: scale(0.8);
margin: 0 5px;
}
.end-icon {
color: #00d700;
font-size: 12px;
transform: scale(0.8);
margin: 0 5px;
}
.start-end-text {
font-size: 12px;
}
}
}
.live-course-more-menu {
background: white;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
border-radius: 4px;
div {
line-height: 30px;
padding: 0 15px;
cursor: pointer;
&:hover {
background: #f3f6fa;
}
}
}
.tipTitle {
.type {
font-weight: 700;
}
}
\ No newline at end of file
src/modules/resource-disk/components/FolderList.jsx
......@@ -27,7 +27,7 @@ import ScanFileModal from '../modal/ScanFileModal';
import CreateFolderModal from '../modal/CreateFolderModal';
const DEL_FOLDER_URL_MAP = {
'MYSELF': 'public/apollo/delFolder',
'MYSELF': 'public/hadesStore/delFolder',
'COMMON': 'public/apollo/delCommonFolder'
}
......@@ -163,7 +163,7 @@ class FolderList extends React.Component {
disk: currentRootDisk.disk,
}
Service.Hades('public/apollo/folderPath', params).then((res) => {
Service.Hades('public/hadesStore/folderPath', params).then((res) => {
const { result = [] } = res;
this.props.onChangeFolderPath(result, false);
})
......@@ -347,7 +347,7 @@ class FolderList extends React.Component {
return;
}
Service.Hades('public/apollo/renameFolder', {
Service.Hades('public/hadesStore/renameFolder', {
id: renameModalData.id,
name: folderName
}).then(() => {
......@@ -371,7 +371,7 @@ class FolderList extends React.Component {
folderType: 'FOLDER',
}
const res = await Service.Hades('public/apollo/sameNameFile', params);
const res = await Service.Hades('public/hadesStore/sameNameFile', params);
const { result } = res;
return result;
}
......
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