Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
X
xiaomai-cloud-class-web
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
1
Merge Requests
1
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
xiaomai-cloud-class
xiaomai-cloud-class-web
Commits
8bc4f351
Commit
8bc4f351
authored
Aug 01, 2021
by
maolipeng
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat:添加上课信息
parent
b0efcce5
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
260 additions
and
98 deletions
+260
-98
src/modules/course-manage/components/AddLiveClass.jsx
+1
-1
src/modules/course-manage/components/AddLiveClassInfoWorkWX.jsx
+119
-0
src/modules/course-manage/components/AddLiveIntro.jsx
+1
-1
src/modules/course-manage/components/CreateWorkWXCourse.jsx
+56
-96
src/modules/course-manage/components/CreateWorkWXCourse.less
+83
-0
No files found.
src/modules/course-manage/components/AddLiveClass.jsx
View file @
8bc4f351
...
...
@@ -75,7 +75,7 @@ class AddLiveClass extends React.Component {
// 获取助教老师列表
getAssistantList
=
(
current
=
1
,
selectList
)
=>
{
const
{
assistantQuery
,
assistantList
}
=
this
.
state
;
const
{
assistantStoreUserId
}
=
this
.
props
.
data
;
const
{
assistantStoreUserId
}
=
this
.
props
.
data
?
this
.
props
.
data
:[]
;
const
idList
=
selectList
?
selectList
:
assistantStoreUserId
;
const
_query
=
{
...
assistantQuery
,
...
...
src/modules/course-manage/components/AddLiveClassInfoWorkWX.jsx
0 → 100644
View file @
8bc4f351
import
React
,
{
useEffect
,
useState
}
from
"react"
;
import
{
DatePicker
,
Select
}
from
'antd'
;
import
StoreService
from
"@/domains/store-domain/storeService"
;
import
"./AddLiveClassInfoWorkWX.less"
;
import
GraphicsEditor
from
"./GraphicsEditor"
;
const
{
Option
}
=
Select
;
const
defaultTeacherQuery
=
{
size
:
15
,
current
:
1
,
nickName
:
null
}
export
default
function
AddLiveClassInfoWorkWX
(
props
)
{
const
[
teacherQuery
,
setTeacherQuery
]
=
useState
(
defaultTeacherQuery
)
const
[
teacherList
,
setTeacherList
]
=
useState
([])
const
[
introduce
,
setIntroduce
]
=
useState
()
useEffect
(()
=>
{
getTeacherList
()
},[])
function
onBeginTimeChange
(
date
,
dateString
)
{
props
.
onChange
(
"beginTime"
,
date
.
valueOf
())
}
function
onBeginTimeOK
()
{
}
function
onDurationChange
(
value
,
option
)
{
}
function
onRemindChange
(
value
,
option
)
{
}
function
onChangeIntro
(
val
)
{
props
.
onChange
(
"intro"
,
val
)
}
function
getTeacherList
(
current
=
1
)
{
const
_query
=
{
...
teacherQuery
,
current
,
size
:
15
};
StoreService
.
getStoreUserBasicPage
(
_query
).
then
((
res
)
=>
{
const
{
result
=
{}
}
=
res
;
const
{
records
=
[],
total
=
0
,
hasNext
}
=
result
;
const
list
=
current
>
1
?
teacherList
.
concat
(
records
)
:
records
;
setTeacherList
(
list
)
setTeacherQuery
({...
_query
,
hasNext
})
});
}
return
(
<
div
className=
"AddLiveClassInfoWorkWX"
>
<
div
className=
"begin-time item"
>
<
span
className=
"label"
><
span
className=
"require"
>
*
</
span
>
开始时间:
</
span
>
<
DatePicker
showTime
onChange=
{
onBeginTimeChange
}
onOk=
{
onBeginTimeOK
}
/>
</
div
>
<
div
className=
"duration-time item"
>
<
span
className=
"label"
><
span
className=
"require"
>
*
</
span
>
时长:
</
span
>
<
Select
onChange=
{
onDurationChange
}
defaultValue=
"60"
>
<
Option
value=
"30"
>
0.5小时
</
Option
>
<
Option
value=
"60"
>
1.0小时
</
Option
>
<
Option
value=
"120"
>
2.0小时
</
Option
>
<
Option
value=
"180"
>
3.0小时
</
Option
>
</
Select
>
</
div
>
<
div
className=
"teacher item"
>
<
span
className=
"label"
><
span
className=
"require"
>
*
</
span
>
讲师:
</
span
>
<
Select
onChange=
{
onDurationChange
}
style=
{
{
width
:
"240px"
}
}
placeholder=
"请选择讲师"
>
{
_
.
map
(
teacherList
,
(
item
,
index
)
=>
{
return
(
<
Select
.
Option
value=
{
item
.
userId
}
key=
{
item
.
userId
}
>
{
item
.
nickName
}
</
Select
.
Option
>
);
})
}
</
Select
>
</
div
>
<
div
className=
"remind-time item"
>
<
span
className=
"label"
><
span
className=
"require"
>
*
</
span
>
提醒时间:
</
span
>
<
Select
onChange=
{
onRemindChange
}
defaultValue=
"0"
style=
{
{
width
:
"100px"
}
}
>
<
Option
value=
"0"
>
无
</
Option
>
<
Option
value=
"5"
>
5分钟前
</
Option
>
<
Option
value=
"60"
>
1小时前
</
Option
>
<
Option
value=
"1440"
>
1天前
</
Option
>
</
Select
>
</
div
>
<
div
className=
"introduce item"
>
<
span
className=
"label"
>
直播简介:
</
span
>
<
div
className=
"intro-edit"
>
<
GraphicsEditor
id=
'intro'
isIntro=
{
true
}
maxLimit=
{
1000
}
detail=
{
{
content
:
introduce
,
}
}
onChange=
{
(
val
)
=>
{
onChangeIntro
(
val
);
}
}
></
GraphicsEditor
>
</
div
>
</
div
>
</
div
>
)
}
\ No newline at end of file
src/modules/course-manage/components/AddLiveIntro.jsx
View file @
8bc4f351
...
...
@@ -136,7 +136,7 @@ class AddLiveIntro extends React.Component {
<
span
className=
'label'
>
观看设置:
</
span
>
<
div
className=
'content'
>
<
Switch
checked=
{
whetherVisitorsJoin
===
'NO'
?
true
:
false
}
onChange=
{
this
.
whetherVisitorsJoinChange
}
/>
<
div
class=
'instro-text'
>
{
whetherVisitorsJoin
===
'NO'
?
'已开启,学员需绑定手机号才可观看'
:
'已关闭,学员无需绑定手机号即可观看'
}
</
div
>
<
div
class
Name
=
'instro-text'
>
{
whetherVisitorsJoin
===
'NO'
?
'已开启,学员需绑定手机号才可观看'
:
'已关闭,学员无需绑定手机号即可观看'
}
</
div
>
</
div
>
</
div
>
<
div
className=
'warmup'
>
...
...
src/modules/course-manage/components/CreateWorkWXCourse.
t
sx
→
src/modules/course-manage/components/CreateWorkWXCourse.
j
sx
View file @
8bc4f351
...
...
@@ -17,6 +17,7 @@ import Bus from '@/core/tbus';
import
AddLiveBasic
from
'./AddLiveBasic'
;
import
AddLiveClass
from
'./AddLiveClass'
;
import
AddLiveIntro
from
'./AddLiveIntro'
;
import
AddLiveClassInfoWorkWX
from
'./AddLiveClassInfoWorkWX'
;
import
{
randomString
}
from
'@/domains/basic-domain/utils'
;
import
Upload
from
'@/core/upload'
;
import
PreviewCourseModal
from
'../modal/PreviewCourseModal'
;
...
...
@@ -29,15 +30,9 @@ import $ from 'jquery';
import
'./CreateWorkWXCourse.less'
;
const
defaultCover
=
'https://image.xiaomaiketang.com/xm/Yip2YtFDwH.png'
;
interface
BasicInfo
{
[
courseName
:
string
]:
string
;
// 课程名称
coverUrl
:
string
;
coverId
:
string
;
categoryId
:
string
;
categoryName
:
string
;
};
const
defaultBasicInfo
:
BasicInfo
=
{
const
defaultBasicInfo
=
{
courseName
:
''
,
// 课程名称
coverUrl
:
defaultCover
,
coverId
:
''
,
...
...
@@ -45,24 +40,9 @@ const defaultBasicInfo: BasicInfo = {
categoryName
:
''
,
}
interface
ClassInfo
{
teacherId
:
string
;
//讲师的Id
assistant
:
string
[];
//助教
teacherName
:
string
;
liveDate
:
number
;
timeHorizonStart
:
number
;
timeHorizonEnd
:
number
;
calendarTime
?:
number
[];
startTime
:
number
;
endTime
:
number
;
nickname
?:
string
;
assistantStoreUserId
?:
string
[];
assistantNames
?:
string
[];
};
const
defaultClassInfo
:
ClassInfo
=
{
const
defaultClassInfo
=
{
teacherId
:
''
,
//讲师的Id
assistant
:
[],
//助教
teacherName
:
''
,
liveDate
:
0
,
timeHorizonStart
:
0
,
...
...
@@ -71,54 +51,22 @@ const defaultClassInfo: ClassInfo = {
startTime
:
new
Date
().
getTime
()
+
300000
,
endTime
:
new
Date
().
getTime
()
+
300000
,
};
interface
CourseMedia
{
contentType
?:
string
;
mediaContent
?:
string
;
mediaType
?:
string
;
mediaUrl
?:
string
;
key
?:
number
;
}
interface
IntroInfo
{
needRecord
?:
string
,
whetherVisitorsJoin
?:
string
,
liveCourseWarmMedia
?:
CourseMedia
,
introduce
?:
string
;
// 讲师简介
liveCourseMediaRequests
?:
CourseMedia
[],
};
const
defaultIntroInfo
:
IntroInfo
=
{
needRecord
:
'YES'
,
whetherVisitorsJoin
:
'NO'
,
liveCourseWarmMedia
:
{},
// 讲师简介
liveCourseMediaRequests
:
[
{
contentType
:
'INTRO'
,
mediaType
:
'TEXT'
,
mediaContent
:
''
,
key
:
Math
.
random
(),
},
],
};
interface
CourseDetail
{
teacherId
:
string
;
teacherName
:
string
;
courseName
:
string
;
startTime
:
number
;
endTime
:
number
;
courseMediaVOS
:
CourseMedia
[];
nickname
?:
string
;
needRecord
:
string
,
whetherVisitorsJoin
:
string
;
warmMedia
?:
string
;
categoryId
:
string
;
categoryName
:
string
;
admins
:
any
[],
courseState
:
string
;
}
// const defaultIntroInfo = {
// needRecord: 'YES',
// whetherVisitorsJoin: 'NO',
// liveCourseWarmMedia: {},
// // 讲师简介
// liveCourseMediaRequests: [
// {
// contentType: 'INTRO',
// mediaType: 'TEXT',
// mediaContent: '',
// key: Math.random(),
// },
// ],
// };
function
CreateWorkWXCourse
()
{
const
[
id
,
setId
]
=
useState
(
getParameterByName
(
'id'
))
...
...
@@ -128,10 +76,10 @@ function CreateWorkWXCourse() {
const
[
courseState
,
setCourseState
]
=
useState
(
'UN_START'
)
const
[
editorTextLength
,
setEditorTextLength
]
=
useState
(
0
)
const
[
loadintroduce
,
setLoadintroduce
]
=
useState
(
false
)
const
[
addLiveBasicInfo
,
setAddLiveBasicInfo
]
=
useState
<
BasicInfo
>
({
courseName
:
''
,
coverUrl
:
''
,
coverId
:
''
,
categoryId
:
''
,
categoryName
:
''
}
)
const
[
addLiveClassInfo
,
setAddLiveClassInfo
]
=
useState
<
any
>
()
const
[
addLiveIntroInfo
,
setAddLiveIntroInfo
]
=
useState
<
any
>
({})
const
[
previewLiveCourseModal
,
setPreviewLiveCourseModal
]
=
useState
<
ReactElement
|
null
>
()
const
[
addLiveBasicInfo
,
setAddLiveBasicInfo
]
=
useState
(
defaultBasicInfo
)
const
[
addLiveClassInfo
,
setAddLiveClassInfo
]
=
useState
()
const
[
addLiveIntroInfo
,
setAddLiveIntroInfo
]
=
useState
({})
const
[
previewLiveCourseModal
,
setPreviewLiveCourseModal
]
=
useState
()
// this.state = {
// // 直播课基本信息
// addLiveBasicInfo: {
...
...
@@ -172,7 +120,7 @@ function CreateWorkWXCourse() {
if
(
type
===
'edit'
)
{
getCourseDetail
();
}
Bus
.
bind
(
'editorLimit'
,
(
editorTextLength
:
number
)
=>
{
Bus
.
bind
(
'editorLimit'
,
(
editorTextLength
)
=>
{
setEditorTextLength
(
editorTextLength
)
});
},[])
...
...
@@ -197,13 +145,13 @@ function CreateWorkWXCourse() {
categoryName
,
admins
,
courseState
,
}
=
res
.
result
as
CourseDetail
;
let
coverId
:
string
|
undefined
=
''
;
}
=
res
.
result
;
let
coverId
;
let
coverUrl
;
let
liveCourseMediaRequests
:
any
[]
=
[];
let
liveCourseMediaRequests
=
[];
let
liveCourseWarmMedia
;
let
hasIntro
=
false
;
courseMediaVOS
.
map
((
item
:
CourseMedia
)
=>
{
courseMediaVOS
.
map
((
item
)
=>
{
switch
(
item
.
contentType
)
{
case
'COVER'
:
coverId
=
item
.
mediaContent
;
...
...
@@ -223,7 +171,7 @@ function CreateWorkWXCourse() {
return
item
;
});
const
addLiveBasicInfo
:
BasicInfo
=
{
const
addLiveBasicInfo
=
{
courseName
,
coverUrl
:
coverUrl
||
defaultCover
,
coverId
,
...
...
@@ -237,7 +185,7 @@ function CreateWorkWXCourse() {
const
assistant
=
_
.
pluck
(
admins
,
'adminId'
);
const
assistantStoreUserId
=
_
.
pluck
(
admins
,
'adminStoreUserId'
);
//编辑时的选中的助教的查询用storeUserId查询
const
assistantNames
=
_
.
pluck
(
admins
,
'adminName'
);
const
addLiveClassInfo
:
ClassInfo
=
{
const
addLiveClassInfo
=
{
assistant
,
liveDate
,
nickname
,
...
...
@@ -251,7 +199,7 @@ function CreateWorkWXCourse() {
assistantStoreUserId
,
};
const
addLiveIntroInfo
:
IntroInfo
=
{
const
addLiveIntroInfo
=
{
liveCourseWarmMedia
,
needRecord
,
whetherVisitorsJoin
,
...
...
@@ -271,7 +219,7 @@ function CreateWorkWXCourse() {
});
};
function
getIntroduce
(
key
:
string
,
url
:
string
|
undefined
)
{
function
getIntroduce
(
key
,
url
)
{
$
.
ajax
({
data
:
{},
type
:
'GET'
,
...
...
@@ -291,14 +239,14 @@ function CreateWorkWXCourse() {
// 修改基本信息
// 修改基本信息
function
handleChangeBasicInfo
(
field
:
string
,
value
:
string
)
{
function
handleChangeBasicInfo
(
field
,
value
)
{
let
binfo
=
{...
addLiveBasicInfo
}
binfo
[
field
]
=
value
setAddLiveBasicInfo
(
binfo
)
};
// 修改上课信息
function
handleChangeClassInfo
(
field
:
string
,
value
:
any
,
type
:
any
,
optionValue
:
any
)
{
function
handleChangeClassInfo
(
field
,
value
,
type
,
optionValue
)
{
const
_value
=
value
?
value
.
valueOf
()
:
null
;
const
{
teacherName
,
assistantNames
,
assistantStoreUserId
}
=
addLiveClassInfo
;
let
_addLiveClassInfo
=
{
...
...
@@ -311,11 +259,26 @@ function CreateWorkWXCourse() {
setAddLiveClassInfo
(
_addLiveClassInfo
)
};
function
onClassInfoChange
(
field
,
value
)
{
switch
(
field
)
{
case
'intro'
:
let
introinfo
=
{...
addLiveIntroInfo
}
introinfo
.
introduce
=
value
setAddLiveIntroInfo
(
introinfo
)
break
;
case
'beginTime'
:
let
classinfo
=
{...
addLiveClassInfo
}
classinfo
.
startTime
=
value
setAddLiveClassInfo
(
classinfo
)
break
;
default
:
console
.
log
(
"NULL"
)
}
}
// 修改简介
function
handleChangeIntroInfo
(
field
:
string
,
value
:
any
)
{
let
introinfo
=
{...
addLiveIntroInfo
}
introinfo
[
field
]
=
value
setAddLiveIntroInfo
(
introinfo
)
function
handleChangeIntroInfo
(
field
,
value
)
{
};
// 完成创建/编辑
...
...
@@ -351,7 +314,7 @@ function CreateWorkWXCourse() {
Upload
.
uploadTextToOSS
(
addLiveIntroInfo
.
introduce
,
`
${
randomString
()}
.txt`
,
(
introduceId
:
any
)
=>
{
(
introduceId
)
=>
{
submitRemote
({
introduceId
,
addLiveBasicInfo
,
addLiveClassInfo
,
addLiveIntroInfo
,
id
});
},
()
=>
message
.
warning
(
'上传课程简介失败'
)
...
...
@@ -573,7 +536,7 @@ function CreateWorkWXCourse() {
// const { id, type, addLiveBasicInfo, addLiveClassInfo, addLiveIntroInfo, isEdit, loadintroduce } = this.state;
return
(
<
div
className=
'page
add-live-pag
e'
>
<
div
className=
'page
CreateWorkWXCours
e'
>
<
Breadcrumbs
navList=
{
type
==
'add'
?
'新建直播课'
:
'编辑直播课'
}
goBack=
{
handleGoBack
}
/>
<
div
className=
'box'
>
<
div
className=
'show-tips'
>
...
...
@@ -587,13 +550,10 @@ function CreateWorkWXCourse() {
<
div
className=
'class-info__wrap'
>
<
div
className=
'title'
>
上课信息
</
div
>
<
AddLiveClass
isEdit=
{
isEdit
}
pageType=
{
type
}
data=
{
{
...
addLiveClassInfo
,
id
}
}
onChange=
{
handleChangeClassInfo
}
/>
{
/* <AddLiveClass isEdit={isEdit} pageType={type} data={{ ...addLiveClassInfo, id }} onChange={handleChangeClassInfo} /> */
}
<
AddLiveClassInfoWorkWX
onChange=
{
onClassInfoChange
}
/>
</
div
>
<
div
className=
'intro-info__wrap'
>
<
div
className=
'title'
>
更多信息
</
div
>
<
AddLiveIntro
isEdit=
{
isEdit
}
data=
{
{
...
addLiveIntroInfo
,
loadintroduce
,
id
}
}
onChange=
{
handleChangeIntroInfo
}
/>
</
div
>
</
div
>
</
div
>
...
...
src/modules/course-manage/components/CreateWorkWXCourse.less
View file @
8bc4f351
.CreateWorkWXCourse {
.box {
margin-bottom: 52px !important;
}
.add-live-page__form {
margin-top: 16px;
.title {
font-size: 16px;
color: #333;
font-weight: 500;
line-height: 22px;
margin-bottom:8px;
}
.add-live__class-info {
margin-left: 14px;
.student {
margin-bottom: 16px;
}
}
.add-live__basic-info {
.course-name {
margin-left: 14px;
}
}
.add-live__intro-info {
margin-left: 50px;
}
.class-info__wrap{
margin-top: 32px;
}
.intro-info__wrap {
margin-top: 32px;
margin-bottom:74px;
}
.add-live__intro-info {
margin-left: 0;
padding-left: 16px;
.label {
width: 100px;
text-align: right;
}
}
.basic-info__wrap, .class-info__wrap, .intro-info__wrap {
.title {
position: relative;
padding-left: 14px;
&::before {
content: "";
position: absolute;
left: 0px;
top: 50%;
transform: translateY(-50%);
width: 4px;
height: 10px;
background: #2966FF;
}
}
}
}
.footer {
position: fixed;
left: 196px;
bottom: 0;
height: 58px;
width: ~'calc(100% - 218px)';
display: flex;
align-items: center;
justify-content: flex-end;
padding-right: 72px;
background: #fff;
border-top: 1px solid #E8E8E8;
z-index: 9999;
.ant-btn {
margin-left: 10px;
}
}
}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment