Skip to content

X
xiaomai-cloud-class-web
Commit 0ee021f5 by guomingpang
Options

Merge branch 'dev' of… 

Merge branch 'dev' of ssh://xmgit.ixm5.cn:10022/xiaomai-cloud-class/xiaomai-cloud-class-web into dev
parents 0fcfcd6a b6f5662e
Showing with 283 additions and 410 deletions
src/modules/college-manage/modal/SetEmployeeModal.jsx
......@@ -77,7 +77,7 @@ export default class SetEmployeeModal extends React.Component {
))}
</div>
<div className="detail-box">
<div className="title">员工身份：</div>
<div className="title">员工角色：</div>
<RadioGroup
value={roleCode}
onChange={(e) => {
......
src/modules/course-manage/offline-course/AddOfflineCourse.jsx
......@@ -2,47 +2,46 @@
* @Author: 吴文洁
* @Date: 2020-08-05 10:07:47
* @LastEditors: yuananting
* @LastEditTime: 2021-07-15 12:04:00
* @LastEditTime: 2021-07-27 15:09:00
* @Description: 线下课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
import React from 'react'
import { Button, Input, Radio, message, Modal, Select, Switch, TimePicker, InputNumber, Tooltip } from 'antd'
import $ from 'jquery'
import React from 'react';
import { Button, Input, Radio, message, Modal, TreeSelect, Select, Switch, TimePicker, InputNumber, Tooltip } from 'antd';
import $ from 'jquery';
import { RangePicker, CourseCatalogSelect } from '@/modules/common'
import ShowTips from '@/components/ShowTips'
import Breadcrumbs from '@/components/Breadcrumbs'
import SelectStudent from '../modal/select-student'
import SelectPrepareFileModal from '../../prepare-lesson/modal/SelectPrepareFileModal'
import PreviewOfflineModal from './modal/PreviewOfflineModal'
import StoreService from '@/domains/store-domain/storeService'
import Service from '@/common/js/service'
import { randomString } from '@/domains/basic-domain/utils'
import User from '@/common/js/user'
import _ from 'underscore'
import moment from 'moment'
import Upload from '@/core/upload'
import GraphicsEditor from '../components/GraphicsEditor'
import MultipleDatePicker from '@/components/MultipleDatePicker'
import './AddOfflineCourse.less'
import Bus from '@/core/bus'
import { RangePicker, CourseCatalogSelect} from '@/modules/common';
import ShowTips from '@/components/ShowTips';
import Breadcrumbs from '@/components/Breadcrumbs';
import SelectPrepareFileModal from '../../prepare-lesson/modal/SelectPrepareFileModal';
import PreviewOfflineModal from './modal/PreviewOfflineModal';
import StoreService from '@/domains/store-domain/storeService';
import Service from '@/common/js/service';
import { randomString } from '@/domains/basic-domain/utils';
import User from '@/common/js/user';
import _ from 'underscore';
import moment from 'moment';
import Upload from '@/core/upload';
import GraphicsEditor from '../components/GraphicsEditor';
import MultipleDatePicker from '@/components/MultipleDatePicker';
import ImgClipModal from '@/components/ImgClipModal';
import './AddOfflineCourse.less';
import Bus from '@/core/bus';
const { Option } = Select
const defaultCoverUrl = 'https://image.xiaomaiketang.com/xm/pxbWKsYA87.png'
let cutFlag = false
const { Option } = Select;
const defaultCoverUrl = 'https://image.xiaomaiketang.com/xm/pxbWKsYA87.png';
const unitList = [
{ key: 'HOUR', value: '小时' },
{ key: 'MINUTE', value: '分钟' },
]
];
class AddOfflineCourse extends React.Component {
constructor(props) {
super(props)
super(props);
const courseId = getParameterByName('id')
const pageType = getParameterByName('type')
const courseId = window.getParameterByName('id');
const pageType = window.getParameterByName('type');
this.state = {
courseId, // 线下课ID,编辑的时候从URL上带过来
......@@ -88,77 +87,76 @@ class AddOfflineCourse extends React.Component {
isEditDisablie: false,
startTime: new Date().getTime() + 300000, // 批量开始时分
endTime: new Date().getTime() + 300000, // 批量结束时分
}
};
}
componentWillMount() {
const { courseId, pageType } = this.state
this.getCourseCatalogList()
this.getTeacherList()
const { courseId, pageType } = this.state;
this.getCourseCatalogList();
this.getTeacherList();
if (pageType === 'edit') {
this.handleFetchScheudleDetail(courseId)
this.handleFetchScheudleDetail(courseId);
}
Bus.bind('editorLimit', (editorTextLength) => {
this.setState({
editorTextLength,
})
})
});
});
}
initBus = () => {
Bus.bind('offlineEditorImage', this.uploadImage)
}
Bus.bind('offlineEditorImage', this.uploadImage);
};
removeBus = () => {
Bus.unbind('offlineEditorImage', this.uploadImage)
}
Bus.unbind('offlineEditorImage', this.uploadImage);
};
uploadImage = () => {
this.setState({ showSelectImageModal: true })
}
this.setState({ showSelectImageModal: true });
};
//获取分类列表
getCourseCatalogList = () => {
Service.Hades('public/hades/queryCategoryTree', { source: 0, tenantId: User.getStoreId(), count: false, userId: User.getUserId() }).then((res) => {
const { categoryList = [] } = res.result
const { categoryList = [] } = res.result;
this.setState({
categoryList,
courseCatalogList: this.renderTreeNodes(categoryList),
})
})
}
});
});
};
renderTreeNodes = (data) => {
let newTreeData = data.map((item) => {
item.title = item.categoryName
item.value = item.id
item.key = item.id
item.title = item.categoryName;
item.value = item.id;
item.key = item.id;
if (item.sonCategoryList) {
item.children = this.renderTreeNodes(item.sonCategoryList)
item.children = this.renderTreeNodes(item.sonCategoryList);
}
return item
})
return newTreeData
}
return item;
});
return newTreeData;
};
checkDetail = (courseId) => {
return Service.Hades('public/hades/getOfflineCourseDetail', {
courseId,
}).then((res) => {
const { courseState } = res.result
return courseState === 'UN_START'
})
}
const { courseState } = res.result;
return courseState === 'UN_START';
});
};
// 获取线下课详情
handleFetchScheudleDetail = (courseId) => {
return Service.Hades('public/hades/getOfflineCourseDetail', {
courseId,
}).then((res) => {
const { result = {} } = res || {}
const { result = {} } = res || {};
const {
courseName,
courseState,
categoryId,
offlinePlace,
whetherVisitorsJoin,
......@@ -185,29 +183,29 @@ class AddOfflineCourse extends React.Component {
signInType,
signOutType,
whetherHaveApply,
} = result
let coverId
let coverUrl = this.state.coverUrl
let hasIntro = false
} = result;
let coverId;
let coverUrl = this.state.coverUrl;
let hasIntro = false;
courseMediaVOS.map((item) => {
switch (item.contentType) {
case 'COVER':
coverId = item.mediaContent
coverUrl = item.mediaUrl
break
coverId = item.mediaContent;
coverUrl = item.mediaUrl;
break;
case 'SCHEDULE':
this.getTextDetail('courseMedia', item.mediaUrl)
break
this.getTextDetail('courseMedia', item.mediaUrl);
break;
case 'INTRO':
hasIntro = true
this.getTextDetail('introduce', item.mediaUrl)
break
hasIntro = true;
this.getTextDetail('introduce', item.mediaUrl);
break;
default:
break
break;
}
return item
})
return item;
});
this.setState({
loadintroduce: !hasIntro,
coverId,
......@@ -239,9 +237,9 @@ class AddOfflineCourse extends React.Component {
signInType,
signOutType,
isEditDisablie: whetherHaveApply === 'YES',
})
})
}
});
});
};
getTextDetail = (key, url) => {
$.ajax({
......@@ -250,13 +248,13 @@ class AddOfflineCourse extends React.Component {
url,
contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
success: (res) => {
this.setState({ [key]: res, [`load${key}`]: true })
this.setState({ [key]: res, [`load${key}`]: true });
},
})
}
});
};
handleGoBack = () => {
const { coverId, videoName, videoDuration, courseName, categoryId, whetherVisitorsJoin } = this.state
const { coverId, videoName, videoDuration, courseName, categoryId, whetherVisitorsJoin } = this.state;
if (videoName || videoDuration || categoryId || courseName || coverId || whetherVisitorsJoin !== whetherVisitorsJoin) {
Modal.confirm({
title: '确认要返回吗?',
......@@ -267,15 +265,15 @@ class AddOfflineCourse extends React.Component {
onOk: () => {
window.RCHistory.push({
pathname: `/offline-course`,
})
});
},
})
});
} else {
window.RCHistory.push({
pathname: `/offline-course`,
})
});
}
}
};
// 显示预览弹窗
handleShowPreviewModal = () => {
......@@ -301,7 +299,7 @@ class AddOfflineCourse extends React.Component {
signOutStartTimeUnit,
signOutEndTimeNum,
signOutEndTimeUnit,
} = this.state
} = this.state;
const data = {
coverUrl,
......@@ -325,96 +323,27 @@ class AddOfflineCourse extends React.Component {
signOutStartTimeUnit,
signOutEndTimeNum,
signOutEndTimeUnit,
}
};
const previewOfflineModal = (
<PreviewOfflineModal
data={data}
close={() => {
this.setState({
previewOfflineModal: null,
})
});
}}
/>
)
);
this.setState({ previewOfflineModal })
}
this.setState({ previewOfflineModal });
};
handleSelectCover = (file) => {
this.uploadCoverImage(file)
}
//上传图片
uploadCoverImage = (imageFile) => {
const { folderName } = imageFile
const fileName = window.random_string(16) + folderName.slice(folderName.lastIndexOf('.'))
const self = this
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector('#headPicModal')
const options = {
size: [500, 282],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: 'transparent',
},
done: function (dataUrl) {
clearTimeout(self.timer)
self.timer = setTimeout(() => {
if (self.state.rotate != this.rotate() || self.state.scale != this.scale()) {
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl)
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale(),
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl)
self.setState({
cutImageBlob,
dataUrl,
})
setTimeout(() => {
cutFlag = false
}, 2000)
},
fail: (failInfo) => {
message.error('图片上传失败了，请重新上传')
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true,
})
}, 100)
},
}
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip('#headPicModal', options)
_photoclip.load(imgUrl)
this.setState({
photoclip: _photoclip,
})
} else {
this.state.photoclip.clear()
this.state.photoclip.load(imgUrl)
}
}, 200)
}
)
}
this.setState({
visible: true,
imageFile: file
});
};
//获取resourceId
getSignature = (blob, fileName) => {
......@@ -426,29 +355,18 @@ class AddOfflineCourse extends React.Component {
visible: false,
},
() => this.updateCover()
)
})
}
);
});
};
updateCover = () => {
const { coverClicpPath, coverId } = this.state
const { coverClicpPath, coverId } = this.state;
this.setState({
showSelectCoverModal: false,
coverUrl: coverClicpPath,
coverId: coverId,
})
}
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(',')[1])
const ab = new ArrayBuffer(bytes.length)
const ia = new Uint8Array(ab)
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i)
}
return new Blob([ab], { type: 'image/png' })
}
});
};
preSubmit = () => {
//过期判断
......@@ -457,16 +375,16 @@ class AddOfflineCourse extends React.Component {
title: '服务已到期',
content: '当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买',
okText: '我知道了',
})
return
});
return;
}
const { courseId } = this.state
const { courseId } = this.state;
if (courseId) {
this.checkDetail(courseId).then((bool) => (bool ? this.handleSubmit() : message.warning('课程已开始，无法继续编辑')))
this.checkDetail(courseId).then((bool) => (bool ? this.handleSubmit() : message.warning('课程已开始，无法继续编辑')));
} else {
this.handleSubmit()
this.handleSubmit();
}
}
};
// 保存
handleSubmit = () => {
......@@ -501,22 +419,22 @@ class AddOfflineCourse extends React.Component {
signOutEndTimeUnit,
// isMore,
editorTextLength,
} = this.state
} = this.state;
let coverObj = {
contentType: 'COVER',
mediaContent: coverId,
mediaType: 'PICTURE',
mediaUrl: coverUrl,
}
let scheduleMediaRequests = []
};
let scheduleMediaRequests = [];
if (coverId) {
scheduleMediaRequests = [coverObj]
scheduleMediaRequests = [coverObj];
}
// 编辑且使用默认图时不传
if (pageType === 'edit' && coverUrl === defaultCoverUrl) {
scheduleMediaRequests = []
scheduleMediaRequests = [];
}
const commonParams = {
categoryId,
......@@ -535,33 +453,33 @@ class AddOfflineCourse extends React.Component {
calendarTime,
editorTextLength,
// isMore,
}
};
if (whetherSetApply === 'YES') {
commonParams.startTimeApply = startTimeApply
commonParams.endTimeApply = endTimeApply
commonParams.quota = quota
commonParams.startTimeApply = startTimeApply;
commonParams.endTimeApply = endTimeApply;
commonParams.quota = quota;
}
if (whetherSetSignIn === 'YES') {
commonParams.signInType = signInType
commonParams.signInTimeNum = signInTimeNum
commonParams.signInTimeUnit = signInTimeUnit
commonParams.signInType = signInType;
commonParams.signInTimeNum = signInTimeNum;
commonParams.signInTimeUnit = signInTimeUnit;
}
if (whetherSetSignOut === 'YES') {
commonParams.signOutType = signOutType
commonParams.signOutType = signOutType;
if (commonParams.signOutType === 'START_LATER') {
commonParams.signOutStartTimeNum = signOutStartTimeNum
commonParams.signOutStartTimeUnit = signOutStartTimeUnit
commonParams.signOutStartTimeNum = signOutStartTimeNum;
commonParams.signOutStartTimeUnit = signOutStartTimeUnit;
}
commonParams.signOutEndTimeNum = signOutEndTimeNum
commonParams.signOutEndTimeUnit = signOutEndTimeUnit
commonParams.signOutEndTimeNum = signOutEndTimeNum;
commonParams.signOutEndTimeUnit = signOutEndTimeUnit;
}
// 校验必填字段:课程名称, 课程线下
this.handleValidate(commonParams).then((res) => {
if (!res) return
if (!res) return;
Upload.uploadTextToOSS(
introduce,
`${randomString()}.txt`,
......@@ -571,181 +489,182 @@ class AddOfflineCourse extends React.Component {
pageType,
commonParams,
introduceId,
})
});
},
() => message.warning('上传课程简介失败')
)
})
}
);
});
};
submitRemote = (data) => {
const { courseId, pageType, commonParams, introduceId } = data
commonParams.introduceId = introduceId
const { courseId, pageType, commonParams, introduceId } = data;
commonParams.introduceId = introduceId;
if (pageType === 'add') {
Service.Hades('public/hades/createOfflineCourse', commonParams).then((res) => {
if (!res) return
message.success('新建成功')
if (!res) return;
message.success('新建成功');
window.RCHistory.push({
pathname: `/offline-course`,
})
})
});
});
} else {
const editParams = {
courseId: courseId,
...commonParams,
}
};
Service.Hades('public/hades/updateOfflineCourse', editParams).then((res) => {
if (!res) return
message.success('保存成功')
if (!res) return;
message.success('保存成功');
window.RCHistory.push({
pathname: `/offline-course`,
})
})
});
});
}
}
};
handleValidate = (data) => {
return new Promise((resolve) => {
if (!data.courseName) {
message.warning('请输入课程名称')
resolve(false)
message.warning('请输入课程名称');
resolve(false);
} else if (!data.categoryId) {
message.warning('请选择课程分类')
resolve(false)
message.warning('请选择课程分类');
resolve(false);
} else if (!data.offlinePlace) {
message.warning('请输入上课地点')
resolve(false)
message.warning('请输入上课地点');
resolve(false);
} else if (!data.teacherId) {
message.warning('请选择讲师')
resolve(false)
message.warning('请选择讲师');
resolve(false);
} else if (_.isEmpty(data.calendarTime)) {
message.warning('请选择上课日期')
resolve(false)
message.warning('请选择上课日期');
resolve(false);
} else if (!data.startTime || !data.endTime) {
message.warning('请选择上课时间')
resolve(false)
message.warning('请选择上课时间');
resolve(false);
} else if (moment(moment(data.calendarTime[0]).format('YYYY-MM-DD') + moment(data.startTime).format(' HH:mm')).valueOf() < Date.now()) {
message.warning('上课时间不能早于现在')
resolve(false)
message.warning('上课时间不能早于现在');
resolve(false);
} else if (data.startTime >= data.endTime) {
message.warning('上课结束时间不能早于上课开始时间')
resolve(false)
message.warning('上课结束时间不能早于上课开始时间');
resolve(false);
} else if (data.whetherSetApply === 'YES' && !data.startTimeApply) {
message.warning('请选择报名时间')
resolve(false)
message.warning('请选择报名时间');
resolve(false);
} else if (data.whetherSetApply === 'YES' && data.startTimeApply >= data.endTimeApply) {
message.warning('报名结束时间需大于报名开始时间')
resolve(false)
message.warning('报名结束时间需大于报名开始时间');
resolve(false);
} else if (
data.whetherSetApply === 'YES' &&
data.endTimeApply > moment(moment(data.calendarTime[0]).format('YYYY-MM-DD') + moment(data.endTime).format(' HH:mm:ss')).valueOf()
) {
message.warning('报名结束时间需小于上课开始时间')
resolve(false)
message.warning('报名结束时间需小于上课开始时间');
resolve(false);
} else if (data.whetherSetSignIn === 'YES' && !data.signInTimeNum) {
message.warning('请输入签到时间')
resolve(false)
message.warning('请输入签到时间');
resolve(false);
} else if (data.whetherSetSignOut === 'YES' && ((data.signOutType === 'START_LATER' && !data.signOutStartTimeNum) || !data.signOutEndTimeNum)) {
message.warning('请输入签退时间')
resolve(false)
message.warning('请输入签退时间');
resolve(false);
} else if (data.editorTextLength > 1000) {
message.warning('课程简介超过字数限定')
resolve(false)
message.warning('课程简介超过字数限定');
resolve(false);
} else {
resolve(true)
resolve(true);
}
})
}
});
};
// 使用默认封面图
handleResetCoverUrl = () => {
const { coverUrl } = this.state
const isDefaultCover = coverUrl === defaultCoverUrl
const { coverUrl } = this.state;
const isDefaultCover = coverUrl === defaultCoverUrl;
// 如果已经是默认图的话，不做任何任何处理
if (isDefaultCover) return
message.success('已替换为默认图')
this.setState({ coverUrl: defaultCoverUrl })
}
if (isDefaultCover) return;
message.success('已替换为默认图');
this.setState({ coverUrl: defaultCoverUrl });
};
// 滑动加载更多讲师列表
handleScrollTeacherList = (e) => {
const { hasNext } = this.state
const container = e.target
const { hasNext } = this.state;
const container = e.target;
//判定元素是否滚动到底部
const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop
const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop;
if (scrollToBottom && hasNext) {
const { teacherQuery } = this.state
let _teacherQuery = teacherQuery
_teacherQuery.current = _teacherQuery.current + 1
const { teacherQuery } = this.state;
let _teacherQuery = teacherQuery;
_teacherQuery.current = _teacherQuery.current + 1;
this.setState(
{
teacherQuery: { ..._teacherQuery },
},
() => {
this.getTeacherList(_teacherQuery.current)
this.getTeacherList(_teacherQuery.current);
}
)
);
}
}
};
getTeacherList(current = 1, selectList) {
const { teacherQuery, teacherList } = this.state
const { teacherQuery, teacherList } = this.state;
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
const { result = {} } = res;
const { records = [], hasNext } = result;
const list = current > 1 ? teacherList.concat(records) : records;
this.setState({
hasNext,
teacherList: list,
teacherQuery: { ..._query },
})
})
});
});
}
changeIntro = (value, textLength) => {
// const isMore = textLength > 1000;
// if (isMore) {
// message.warning('内容过长，不能超过1000字');
// }
this.setState({ introduce: value })
}
changeIntro = (value) => {
this.setState({ introduce: value });
};
selectMultiDate = (calendarTime) => {
const dateList = _.sortBy(calendarTime)
const dateList = _.sortBy(calendarTime);
this.setState({
calendarTime: dateList,
})
}
});
};
handleChangeDates = (dates) => {
const data = {}
const data = {};
if (_.isEmpty(dates)) {
data.startTimeApply = undefined
data.endTimeApply = undefined
data.startTimeApply = undefined;
data.endTimeApply = undefined;
} else {
data.startTimeApply = dates[0].valueOf()
data.endTimeApply = dates[1].startOf('minute').valueOf() + 59000
data.startTimeApply = dates[0].valueOf();
data.endTimeApply = dates[1].startOf('minute').valueOf() + 59000;
}
this.setState(data)
}
this.setState(data);
};
whetherVisitorsJoinChange = () => {
const { whetherSetApply } =this.state;
if(whetherSetApply === 'NO'){
message.warning('关闭报名无法获取手机号!')
return
}
if (this.state.whetherVisitorsJoin === 'NO') {
this.setState({ whetherVisitorsJoin: 'YES' })
this.setState({ whetherVisitorsJoin: 'YES' });
} else {
this.setState({ whetherVisitorsJoin: 'NO' })
this.setState({ whetherVisitorsJoin: 'NO' });
}
}
};
handleChangeCatalogList = (value, label) => {
this.setState({ categoryId: value, categoryName: label[0] })
}
this.setState({ categoryId: value, categoryName: label[0] });
};
render() {
const {
......@@ -755,14 +674,11 @@ class AddOfflineCourse extends React.Component {
coverUrl,
introduce,
categoryId,
categoryList,
courseCatalogList,
whetherVisitorsJoin,
loadintroduce,
showSelectCoverModal,
visible,
hasImgReady,
cutImageBlob,
teacherId,
teacherList,
calendarTime,
......@@ -786,8 +702,9 @@ class AddOfflineCourse extends React.Component {
quota,
offlinePlace,
isEditDisablie,
} = this.state
const isDefaultCover = coverUrl === defaultCoverUrl
imageFile,
} = this.state;
const isDefaultCover = coverUrl === defaultCoverUrl;
return (
<div className='page add-offline-course-page'>
<Breadcrumbs navList={pageType === 'add' ? '新建线下课' : '编辑线下课'} goBack={this.handleGoBack} />
......@@ -810,7 +727,7 @@ class AddOfflineCourse extends React.Component {
maxLength={40}
style={{ width: 240 }}
onChange={(e) => {
this.setState({ courseName: e.target.value })
this.setState({ courseName: e.target.value });
}}
/>
</div>
......@@ -823,7 +740,7 @@ class AddOfflineCourse extends React.Component {
onClick={() => {
this.setState({
showSelectCoverModal: true,
})
});
}}>
上传图片
</Button>
......@@ -873,7 +790,7 @@ class AddOfflineCourse extends React.Component {
style={{ width: 240 }}
placeholder='请输入上课地点（40字以内）'
onChange={(e) => {
this.setState({ offlinePlace: e.target.value })
this.setState({ offlinePlace: e.target.value });
}}
/>
</div>
......@@ -897,22 +814,22 @@ class AddOfflineCourse extends React.Component {
}
onChange={(value, option) => {
if (option) {
this.setState({ teacherId: value, teacherName: option.children })
this.setState({ teacherId: value, teacherName: option.children });
} else {
this.setState({ teacherId: value, teacherName: '' })
this.setState({ teacherId: value, teacherName: '' });
}
}}
onSearch={(value) => {
let _teacherQuery = { ...this.state.teacherQuery }
_teacherQuery.nickName = value
let _teacherQuery = { ...this.state.teacherQuery };
_teacherQuery.nickName = value;
this.setState(
{
teacherQuery: _teacherQuery,
},
() => {
this.getTeacherList()
this.getTeacherList();
}
)
);
}}
onClear={(value) => {
this.setState(
......@@ -924,27 +841,20 @@ class AddOfflineCourse extends React.Component {
},
},
() => {
this.getTeacherList()
this.getTeacherList();
}
)
);
}}
getPopupContainer={() => document.getElementById('teacher')}>
{_.map(teacherList, (item, index) => {
{_.map(teacherList, (item) => {
return (
<Option value={item.id} key={item.id}>
{item.nickName}
</Option>
)
);
})}
</Select>
</div>
<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='introduce'>
<span className='label'>课程简介：</span>
<div className='content'>
......@@ -959,7 +869,7 @@ class AddOfflineCourse extends React.Component {
content: introduce,
}}
onChange={(val) => {
this.changeIntro(val)
this.changeIntro(val);
}}
/>
)}
......@@ -977,7 +887,7 @@ class AddOfflineCourse extends React.Component {
</span>
<div>
<div className='select-day'>
已选 <span className='mark-day'>{isLongArr(calendarTime) ? calendarTime.length : 0}</span> 天
已选 <span className='mark-day'>{window.isLongArr(calendarTime) ? calendarTime.length : 0}</span> 天
</div>
<MultipleDatePicker disabled={isEditDisablie} selectDateList={calendarTime} onSelect={this.selectMultiDate} canSelectTodayBefore={false} />
</div>
......@@ -996,7 +906,7 @@ class AddOfflineCourse extends React.Component {
showNow={false}
style={{ width: 100, minWidth: 100 }}
onSelect={(time) => {
this.setState({ startTime: time })
this.setState({ startTime: time });
}}
getPopupContainer={() => document.getElementById('hour')}
/>
......@@ -1010,7 +920,7 @@ class AddOfflineCourse extends React.Component {
showNow={false}
style={{ width: 100, minWidth: 100 }}
onSelect={(time) => {
this.setState({ endTime: time })
this.setState({ endTime: time });
}}
getPopupContainer={() => document.getElementById('hour')}
/>
......@@ -1023,7 +933,7 @@ class AddOfflineCourse extends React.Component {
style={{ display: 'inline-block' }}
value={offlineCourseType}
onChange={(e) => {
this.setState({ offlineCourseType: e.target.value })
this.setState({ offlineCourseType: e.target.value });
}}
className='mt5'
disabled={isEditDisablie}>
......@@ -1048,8 +958,8 @@ class AddOfflineCourse extends React.Component {
startTimeApply: undefined,
endTimeApply: undefined,
quota: null,
whetherVisitorsJoin: value ? whetherVisitorsJoin : 'YES',
})
whetherVisitorsJoin: value ? whetherVisitorsJoin : 'YES'
});
}}
/>
<span className='switch-tip'>开启后可设置课程报名时间，获取报名数据</span>
......@@ -1064,10 +974,10 @@ class AddOfflineCourse extends React.Component {
value={startTimeApply ? [moment(startTimeApply), moment(endTimeApply)] : null}
format={'YYYY-MM-DD HH:mm'}
onChange={(dates) => {
this.handleChangeDates(dates)
this.handleChangeDates(dates);
}}
renderExtraFooter={() =>
calendarTime[0] ? (
renderExtraFooter={() => (
<If condition={calendarTime[0]}>
<div style={{ position: 'absolute', bottom: 8, cursor: 'pointer' }}>
<span
onClick={() =>
......@@ -1127,8 +1037,8 @@ class AddOfflineCourse extends React.Component {
上课前3天
</span>
</div>
) : null
}
</If>
)}
/>
</div>
)}
......@@ -1151,7 +1061,7 @@ class AddOfflineCourse extends React.Component {
style={{ margin: '0 4px', width: 90 }}
disabled={oldQuta < 0}
onChange={(value) => {
this.setState({ quota: value })
this.setState({ quota: value });
}}
/>
<span className='switch-label'>人</span>
......@@ -1160,6 +1070,13 @@ class AddOfflineCourse extends React.Component {
)}
</div>
</div>
<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='course-catalog'>
<span className='label'>考勤签到：</span>
<div className='switch-box'>
......@@ -1172,7 +1089,7 @@ class AddOfflineCourse extends React.Component {
signInType: 'START_AGO',
signInTimeNum: null,
signInTimeUnit: 'MINUTE',
})
});
}}
/>
<span className='switch-tip'>开启后可设置获取签到考勤数据</span>
......@@ -1184,7 +1101,7 @@ class AddOfflineCourse extends React.Component {
style={{ display: 'inline-block' }}
value={signInType}
onChange={(e) => {
this.setState({ signInType: e.target.value })
this.setState({ signInType: e.target.value });
}}
className='mt5'>
<Radio value='START_AGO' className='mr-16'>
......@@ -1206,18 +1123,18 @@ class AddOfflineCourse extends React.Component {
precision={0}
style={{ margin: '0 4px', width: 90 }}
onChange={(value) => {
this.setState({ signInTimeNum: value })
this.setState({ signInTimeNum: value });
}}
/>
<Select
style={{ width: 72, marginRight: 4 }}
value={signInTimeUnit}
onChange={(value) => {
const data = { signInTimeUnit: value }
const data = { signInTimeUnit: value };
if (value === 'HOUR' && signInTimeNum > 24) {
data.signInTimeNum = 24
data.signInTimeNum = 24;
}
this.setState(data)
this.setState(data);
}}>
{unitList.map((item) => (
<Option value={item.key} key={item.key}>
......@@ -1244,7 +1161,7 @@ class AddOfflineCourse extends React.Component {
signOutStartTimeUnit: 'MINUTE',
signOutEndTimeNum: null,
signOutEndTimeUnit: 'MINUTE',
})
});
}}
/>
<span className='switch-tip'>开启后可设置获取签退考勤数据</span>
......@@ -1256,7 +1173,7 @@ class AddOfflineCourse extends React.Component {
style={{ display: 'inline-block' }}
value={signOutType}
onChange={(e) => {
this.setState({ signOutType: e.target.value })
this.setState({ signOutType: e.target.value });
}}
className='mt5'>
<Radio value='START_LATER' className='mr-16'>
......@@ -1279,7 +1196,7 @@ class AddOfflineCourse extends React.Component {
precision={0}
style={{ margin: '0 4px', width: 90 }}
onChange={(value) => {
this.setState({ signOutStartTimeNum: value })
this.setState({ signOutStartTimeNum: value });
}}
/>
)}
......@@ -1288,11 +1205,11 @@ class AddOfflineCourse extends React.Component {
style={{ width: 72, marginRight: 4 }}
value={signOutStartTimeUnit}
onChange={(value) => {
const data = { signOutStartTimeUnit: value }
const data = { signOutStartTimeUnit: value };
if (value === 'HOUR' && signOutStartTimeNum > 24) {
data.signOutStartTimeNum = 24
data.signOutStartTimeNum = 24;
}
this.setState(data)
this.setState(data);
}}>
{unitList.map((item) => (
<Option value={item.key} key={item.key}>
......@@ -1309,18 +1226,18 @@ class AddOfflineCourse extends React.Component {
precision={0}
style={{ margin: '0 4px', width: 90 }}
onChange={(value) => {
this.setState({ signOutEndTimeNum: value })
this.setState({ signOutEndTimeNum: value });
}}
/>
<Select
style={{ width: 72, marginRight: 4 }}
value={signOutEndTimeUnit}
onChange={(value) => {
const data = { signOutEndTimeUnit: value }
const data = { signOutEndTimeUnit: value };
if (value === 'HOUR' && signOutEndTimeNum > 24) {
data.signOutEndTimeNum = 24
data.signOutEndTimeNum = 24;
}
this.setState(data)
this.setState(data);
}}>
{unitList.map((item) => (
<Option value={item.key} key={item.key}>
......@@ -1355,70 +1272,25 @@ class AddOfflineCourse extends React.Component {
tooltip='支持文件类型：jpg、jpeg、png'
isOpen={showSelectCoverModal}
onClose={() => {
this.setState({ showSelectCoverModal: false })
this.setState({ showSelectCoverModal: false });
}}
onSelect={this.handleSelectCover}
/>
)}
<Modal
title='设置图片'
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className='icon iconfont modal-close-icon'>&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false })
}}
zIndex={10001}
footer={[
<Button
key='back'
onClick={() => {
this.setState({ visible: false })
}}>
重新上传
</Button>,
<Button
key='submit'
type='primary'
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true
this.refs.hiddenBtn.click()
}
this.getSignature(cutImageBlob)
}}>
确定
</Button>,
]}>
<div className='clip-box'>
<div
id='headPicModal'
ref='headPicModal'
style={{
width: '500px',
height: '430px',
marginBottom: 0,
}}></div>
<div id='clipBtn' style={{ display: 'none' }} ref='hiddenBtn'></div>
<div className='preview-img'>
<div className='title'>效果预览</div>
<div id='preview-url-box' style={{ width: 500, height: 282 }}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt='' />
</div>
<div className='tip-box'>
<div className='tip'>温馨提示</div>
<div className='tip'>①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className='tip'>②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{visible && (
<ImgClipModal
visible={visible}
imgUrl={imageFile.ossUrl}
onConfirm={this.getSignature}
onClose={() => {
this.setState({ visible: false });
}}
/>
)}
{this.state.previewOfflineModal}
</div>
)
);
}
}
export default AddOfflineCourse
export default AddOfflineCourse;
src/modules/teach-tool/components/CourseCategorySiderTree.less
......@@ -40,6 +40,7 @@
color: #666666;
width: 234px;
overflow-x: scroll;
overflow-y: hidden;
.anticon {
color: #999999;
}
......
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