Skip to content

X
xiaomai-cloud-class-web
Commit a6ced707 by wufan
Options

feat:添加sort字段

parent 3dc6f992
Showing with 103 additions and 58 deletions
src/bu-components/PreviewCourseModal.less
...@@ -13,8 +13,9 @@ ...@@ -13,8 +13,9 @@
} }
.container { .container {
overflow: scroll; overflow-y: auto;
height: 100%;; overflow-x: hidden;
height: 100%;
.course-cover, .course-url { .course-cover, .course-url {
width: 100%; width: 100%;
......
src/modules/course-manage/modal/PreviewCourseModal.jsx
...@@ -108,7 +108,7 @@ class PreviewCourseModal extends React.Component { ...@@ -108,7 +108,7 @@ class PreviewCourseModal extends React.Component {
timeHorizonEnd, timeHorizonEnd,
teacherName, teacherName,
} = courseClassInfo; } = courseClassInfo;
const { introduce } = courseIntroInfo; const { introduce, categoryName } = courseIntroInfo;
let { activeTab } = this.state; let { activeTab } = this.state;
let liveDateStr, startTimeStr, endTimeStr; let liveDateStr, startTimeStr, endTimeStr;
...@@ -163,54 +163,53 @@ class PreviewCourseModal extends React.Component { ...@@ -163,54 +163,53 @@ class PreviewCourseModal extends React.Component {
> >
<div className="container__wrap"> <div className="container__wrap">
<div className="container"> <div className="container">
<div className="container__header"> <div className='container__header'>
{type === "videoCourse" ? ( <Choose>
<video <When condition={type === 'videoCourse'}>
controls <video
src={courseChapterList.length && courseChapterList[0].mediaUrl || scheduleVideoUrl } controls
poster={ src={courseChapterList.length && courseChapterList[0].mediaUrl || scheduleVideoUrl }
coverUrl poster={coverUrl ? coverUrl : `https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png`}
? coverUrl className='course-url'
: "https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png" />
} </When>
className="course-url" <Otherwise>
/> <img src={coverUrl} className='course-cover' alt='' />
) : ( </Otherwise>
<img src={coverUrl} className="course-cover" /> </Choose>
)}
</div> </div>
{type === "videoCourse" ? ( <Choose>
<div className="container__body"> <When condition={type === 'videoCourse'}>
<div className="title__name">{courseName}</div> <div className='container__body'>
{videoDuration && ( <div className='title__name'>{courseName}</div>
<div>视频时长：{this.dealTimeDuration(videoDuration)}</div> <div className='title__category'>{categoryName}</div>
)} <div className='title__chapter'>共{courseChapterList.length}小节</div>
</div>
) : (
<div className="container__body">
<div className="container__body__title">
<div className="title__name">{courseName}</div>
<div className="title__state">
{courseStateShow[courseState].title}
</div>
</div>
<div className="container__body__time">
<span className="time__label">上课时间：</span>
<span className="time__value">
{[
<span>{liveDateStr}&nbsp;</span>,
<span>
{startTimeStr}~{endTimeStr}
</span>,
]}
</span>
</div> </div>
<div className="container__body__teacher"> </When>
<span className="teacher__label">上课老师：</span> <Otherwise>
<span className="teacher__value">{teacherName}</span> <div className='container__body'>
<div className='container__body__title'>
<div className='title__name'>{courseName}</div>
<div className='title__state'>{courseStateShow[courseState].title}</div>
</div>
<div className='container__body__time'>
<span className='time__label'>上课时间：</span>
<span className='time__value'>
{[
<span>{liveDateStr}&nbsp;</span>,
<span>
{startTimeStr}~{endTimeStr}
</span>
]}
</span>
</div>
<div className='container__body__teacher'>
<span className='teacher__label'>上课老师：</span>
<span className='teacher__value'>{teacherName}</span>
</div>
</div> </div>
</div> </Otherwise>
)} </Choose>
<div className="container__introduction"> <div className="container__introduction">
<Choose> <Choose>
......
src/modules/course-manage/modal/PreviewCourseModal.less
...@@ -13,7 +13,8 @@ ...@@ -13,7 +13,8 @@
} }
.container { .container {
overflow: scroll; overflow-y: auto;
overflow-x: hidden;
height: 100%;; height: 100%;;
.course-cover, .course-url { .course-cover, .course-url {
...@@ -30,6 +31,16 @@ ...@@ -30,6 +31,16 @@
color: #000; color: #000;
} }
.title__category {
color: #999999;
margin-top: 4px;
margin-bottom: 4px;
}
.title__chapter {
color: #999999;
margin-bottom: 4px;
}
.title__inst-name { .title__inst-name {
color: #666; color: #666;
font-size: 12px; font-size: 12px;
......
src/modules/course-manage/video-course/AddVideoCourse.jsx
...@@ -103,14 +103,14 @@ class AddVideoCourse extends React.Component { ...@@ -103,14 +103,14 @@ class AddVideoCourse extends React.Component {
}) })
} }
catalogChange = (value) => { catalogChange = (value, categoryName) => {
const changeValueLength = value.length const changeValueLength = value.length
switch (changeValueLength) { switch (changeValueLength) {
case 1: case 1:
this.setState({ categoryId: value[0] }) this.setState({ categoryId: value[0], categoryName })
break break
case 2: case 2:
this.setState({ categoryId: value[1] }) this.setState({ categoryId: value[1], categoryName })
break break
default: default:
this.setState({ categoryId: null }) this.setState({ categoryId: null })
...@@ -269,7 +269,7 @@ class AddVideoCourse extends React.Component { ...@@ -269,7 +269,7 @@ class AddVideoCourse extends React.Component {
// 显示预览弹窗 // 显示预览弹窗
handleShowPreviewModal = () => { handleShowPreviewModal = () => {
const { coverUrl, scheduleVideoUrl, courseName, scheduleMedia, videoDuration, introduce, courseChapterList } = this.state const { coverUrl, scheduleVideoUrl, courseName, scheduleMedia, videoDuration, introduce, courseChapterList, categoryName } = this.state
const courseBasinInfo = { const courseBasinInfo = {
coverUrl, coverUrl,
...@@ -279,7 +279,8 @@ class AddVideoCourse extends React.Component { ...@@ -279,7 +279,8 @@ class AddVideoCourse extends React.Component {
} }
const courseIntroInfo = { const courseIntroInfo = {
liveCourseMediaRequests: scheduleMedia, liveCourseMediaRequests: scheduleMedia,
introduce introduce,
categoryName
} }
const previewCourseModal = ( const previewCourseModal = (
...@@ -324,7 +325,8 @@ class AddVideoCourse extends React.Component { ...@@ -324,7 +325,8 @@ class AddVideoCourse extends React.Component {
mediaNameAlias: folderName.replace('.mp4',''), mediaNameAlias: folderName.replace('.mp4',''),
videoDuration: videoDom.duration, videoDuration: videoDom.duration,
id: resourceId, id: resourceId,
mediaUrl: ossUrl mediaUrl: ossUrl,
sort: courseChapterList.length
}) })
this.setState({ this.setState({
...@@ -337,10 +339,42 @@ class AddVideoCourse extends React.Component { ...@@ -337,10 +339,42 @@ class AddVideoCourse extends React.Component {
}) })
} }
}) })
} }
// 校验课节名称
handleValidateChapterName = (chapterName)=> {
let hasError = false;
return new Promise((resolve) => {
if(!chapterName) {
this.setState({
chapterNameValidateStatus: "error",
chapterNameHelpMsg: '请输入课节名称'
})
hasError = true;
resolve(false)
return false
}
if(chapterName.length > 40) {
this.setState({
chapterNameValidateStatus: "error",
chapterNameHelpMsg: '不要超过40字'
})
hasError = true;
resolve(false)
return false
}
if(!hasError){
resolve(true)
this.setState({
chapterNameValidateStatus: "",
chapterNameHelpMsg: ""
})
}
})
}
// 保存 // 保存
handleSubmit = () => { handleSubmit = () => {
const { instId, adminId } = window.currentUserInstInfo const { instId, adminId } = window.currentUserInstInfo
...@@ -799,7 +833,7 @@ class AddVideoCourse extends React.Component { ...@@ -799,7 +833,7 @@ class AddVideoCourse extends React.Component {
<span className='label'>课程分类：</span> <span className='label'>课程分类：</span>
{pageType === 'add' && ( {pageType === 'add' && (
<Cascader <Cascader
defaultValue={[categoryName]} defaultValue={[]}
options={courseCatalogList} options={courseCatalogList}
displayRender={(label) => label.join('-')} displayRender={(label) => label.join('-')}
fieldNames={fieldNames} fieldNames={fieldNames}
......
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