diff --git a/public/react/src/modules/courses/busyWork/NewWork.js b/public/react/src/modules/courses/busyWork/NewWork.js index 2aa8e4742..4af4532dd 100644 --- a/public/react/src/modules/courses/busyWork/NewWork.js +++ b/public/react/src/modules/courses/busyWork/NewWork.js @@ -3,11 +3,11 @@ import { Input, InputNumber, Form, Button, Checkbox, Upload, Icon, message, Moda import axios from 'axios' import '../css/busyWork.css' import '../css/Courses.css' -import { WordsBtn, getUrl, ConditionToolTip, appendFileSizeToUploadFile, appendFileSizeToUploadFileAll } from 'educoder' -import TPMMDEditor from '../../tpm/challengesnew/TPMMDEditor'; +import { WordsBtn, getUrl, ConditionToolTip } from 'educoder' + import CBreadcrumb from '../common/CBreadcrumb' +import NewWorkForm from './NewWorkForm' -const confirm = Modal.confirm; const $ = window.$ const MAX_TITLE_LENGTH = 60; class NewWork extends Component{ @@ -17,15 +17,6 @@ class NewWork extends Component{ this.answerMdRef = React.createRef(); this.state={ - title_value:"", - title_num: 0, - contentFileList: [], - answerFileList: [], - workLoaded: false, - base_on_project: true, - category: {}, - min_num: 2, - max_num: 10, } } componentDidMount () { @@ -50,7 +41,6 @@ class NewWork extends Component{ course_id: data.course_id, course_name: data.course_name, category: data.category, - }) } }) @@ -65,129 +55,29 @@ class NewWork extends Component{ .then((response) => { if (response.data.name) { const data = response.data; - - const contentFileList = data.attachments.map(item => { - return { - id: item.id, - uid: item.id, - name: appendFileSizeToUploadFile(item), - url: item.url, - filesize: item.filesize, - status: 'done' - } - }) - const answerFileList = data.ref_attachments.map(item => { - return { - id: item.id, - uid: item.id, - name: appendFileSizeToUploadFile(item), - url: item.url, - filesize: item.filesize, - status: 'done' - } - }) - - this.setState({ - ...data, - // course_id: data.course_id, - // course_name: data.course_name, - // category: data.category, - title_num: parseInt(data.name.length), - workLoaded: true, - init_min_num: data.min_num, - init_max_num: data.max_num, - // description: data.description, - reference_answer: data.reference_answer, - contentFileList, - answerFileList, - }, () => { - setTimeout(() => { - this.contentMdRef.current.setValue(data.description || '') - this.answerMdRef.current.setValue(data.reference_answer || '') - - }, 2000) - - this.props.form.setFieldsValue({ - title: data.name, - description: data.description || '', - reference_answer: data.reference_answer || '', - }); - + data.isEdit = true; + this.setState({ + category: data.category, + course_id: data.course_id, + course_name: data.course_name, }) - + this.newWorkFormRef.initValue(data); } }) .catch(function (error) { console.log(error); }); } - - // 输入title - changeTitle=(e)=>{ - console.log(e.target.value.length); - this.setState({ - title_num: parseInt(e.target.value.length) - }) - } - handleSubmit = () => { - const courseId = this.state.course_id || this.props.match.params.coursesId ; - - this.props.form.validateFieldsAndScroll((err, values) => { - console.log(values) - const mdContnet = this.contentMdRef.current.getValue().trim(); - console.log(mdContnet) - values.description = mdContnet; - // return; - - {/* max={has_commit ? init_min_num : null } */} - {/* min={has_commit ? init_max_num : (min_num == undefined ? 2 : min_num + 1) } */} - // 已有提交作品，人数范围只能扩大 - const { has_commit, max_num, init_max_num, min_num, init_min_num } = this.state; - if (has_commit) { - if (max_num < init_max_num || min_num > init_min_num) { - this.props.showNotification(`已有提交作品，人数范围只能扩大(原设置为：${init_min_num} - ${init_max_num})`) - return; - } - } - - // const errKeys = Object.keys(err); // || errKeys.length == 1 && errKeys[0] == 'content' && mdContnet - if (!err) { - if (this.isEdit) { - this.doEdit(courseId, values) - } else { - this.doNew(courseId, values) - } - - } else { - $("html").animate({ scrollTop: $('html').scrollTop() - 100 }) - } - }) + onCancel = () => { + this.props.toListPage(this.props.match.params, category.category_id) } - doEdit = (courseId, values) => { + + doEdit = (params) => { const workId = this.props.match.params.workId const newUrl = `/homework_commons/${workId}.json` - let attachment_ids = this.state.contentFileList.map(item => { - return item.response ? item.response.id : item.id - }) - let reference_attachment_ids = this.state.answerFileList.map(item => { - return item.response ? item.response.id : item.id - }) - - const { min_num, max_num, base_on_project, category } = this.state const isGroup = this.props.isGroup() - axios.put(newUrl, { - type: isGroup ? 3 : 1, - name: values.title, - description: values.description, - reference_answer: values.reference_answer, - attachment_ids, - reference_attachment_ids, - - min_num, - max_num, - base_on_project - }) + axios.put(newUrl, params) .then((response) => { if (response.data.status == 0) { this.props.showNotification('保存成功') @@ -198,30 +88,11 @@ class NewWork extends Component{ console.log(error); }); } - doNew = (courseId, values) => { + doNew = (params) => { + const courseId = this.props.match.params.coursesId ; const newUrl = `/courses/${courseId}/homework_commons.json` - let attachment_ids = this.state.contentFileList.map(item => { - return item.response ? item.response.id : item.id - }) - let reference_attachment_ids = this.state.answerFileList.map(item => { - return item.response ? item.response.id : item.id - }) - const isGroup = this.props.isGroup() - const { min_num, max_num, base_on_project, category } = this.state - - axios.post(newUrl, { - type: isGroup ? 3 : 1, - name: values.title, - description: values.description, - reference_answer: values.reference_answer, - attachment_ids, - reference_attachment_ids, - - min_num, - max_num, - base_on_project - }) + axios.post(newUrl, params) .then((response) => { if (response.data.status == 0) { this.props.showNotification('保存成功') @@ -232,147 +103,26 @@ class NewWork extends Component{ console.log(error); }); } - - handleContentUploadChange = (info) => { - let contentFileList = info.fileList; - this.setState({ contentFileList: appendFileSizeToUploadFileAll(contentFileList) }); - } - handleAnswerUploadChange = (info) => { - let answerFileList = info.fileList; - this.setState({ answerFileList: appendFileSizeToUploadFileAll(answerFileList) }); - } - onAttachmentRemove = (file, stateName) => { - if(file.response!=undefined){ - this.props.confirm({ - content: '是否确认删除?', - - onOk: () => { - this.deleteAttachment(file, stateName) - }, - onCancel() { - console.log('Cancel'); - }, - }); - - - return false; - } - - } - deleteAttachment = (file, stateName) => { - // 初次上传不能直接取uid - const url = `/attachments/${file.response ? file.response.id : file.uid}.json` - axios.delete(url, { - }) - .then((response) => { - if (response.data) { - const { status } = response.data; - if (status == 0) { - console.log('--- success') - - this.setState((state) => { - const index = state[stateName].indexOf(file); - const newFileList = state[stateName].slice(); - newFileList.splice(index, 1); - return { - [stateName]: newFileList, - }; - }); - } - } - }) - .catch(function (error) { - console.log(error); - }); - } - max_num_change = (val) => { - if (val < 2) { - this.setState({ - max_num: 2, - }) - return; - } - const { min_num } = this.state; - this.setState({ - max_num: val, - min_num: val <= min_num ? val - 1 : min_num - }) - } - min_num_change = (val) => { - this.setState({ min_num: val }) - } - base_on_project_change = () => { - this.setState({ base_on_project: !this.state.base_on_project }) - } render(){ let {typeId,coursesId,pageType}=this.props.match.params; - const { getFieldDecorator } = this.props.form; + const isGroup = this.props.isGroup() const moduleName = !isGroup? "普通作业":"分组作业"; const moduleEngName = this.props.getModuleName() let{ - title_value, contentFileList, answerFileList, max_num, min_num, base_on_project, - init_max_num, init_min_num, - title_num, course_name, category, has_commit, has_project + category }=this.state const { current_user } = this.props - const courseId = this.state.course_id || this.props.match.params.coursesId ; + const courseId = this.props.match.params.coursesId ; const isEdit = this.isEdit; - if ((isEdit == undefined || isEdit) && !this.state.workLoaded) { - return '' - } - const uploadProps = { - width: 600, - fileList: contentFileList, - multiple: true, - // https://github.com/ant-design/ant-design/issues/15505 - // showUploadList={false}，然后外部拿到 fileList 数组自行渲染列表。 - // showUploadList: false, - action: `${getUrl()}/api/attachments.json`, - onChange: this.handleContentUploadChange, - onRemove: (file) => this.onAttachmentRemove(file, 'contentFileList'), - beforeUpload: (file) => { - console.log('beforeUpload', file.name); - const isLt150M = file.size / 1024 / 1024 < 150; - if (!isLt150M) { - message.error('文件大小必须小于150MB!'); - } - return isLt150M; - }, - }; - const answerUploadProps = { - width: 600, - fileList: answerFileList, - multiple: true, - // https://github.com/ant-design/ant-design/issues/15505 - // showUploadList={false}，然后外部拿到 fileList 数组自行渲染列表。 - // showUploadList: false, - action: `${getUrl()}/api/attachments.json`, - onChange: this.handleAnswerUploadChange, - onRemove: (file) => this.onAttachmentRemove(file, 'answerFileList'), - beforeUpload: (file) => { - console.log('beforeUpload', file.name); - const isLt150M = file.size / 1024 / 1024 < 150; - if (!isLt150M) { - message.error('文件大小必须小于150MB!'); - } - return isLt150M; - }, - }; - + return(
- {/*

- {course_name} - > - {typeId==1 ?"普通作业":"分组作业"} - > - {pageType==="new"?"新建":"编辑"} -

*/} +

- {/* onSubmit={this.handleSubmit} */} - -
- - {getFieldDecorator('title', { - rules: [{ - required: true, message: '请输入标题' - }], - })( - - )} - - - - - { - {getFieldDecorator('description', { - rules: [{ - required: true, message: '请输入作业内容和要求' - }], - })( - - )} - } - - - (单个文件150M以内) - - - - { isGroup && - - {getFieldDecorator('personNum', { - rules: [{ - required: false - // required: true, message: '请输入最小人数和最大人数' - }], - })( -
-

- - {/* max={has_commit ? init_min_num : null } */} - - - - ~ - {/* min={has_commit ? init_max_num : (min_num == undefined ? 2 : min_num + 1) } */} - - - - -

-

- - 基于项目实施 - - - -

-
- )} - - } - - {getFieldDecorator('reference_answer', { - rules: [{ - required: false - }], - })( - - )} - - - (单个文件150M以内) - - - - - - + {this.newWorkFormRef = ref}} + {...this.props} + onCancel={this.onCancel} + doNew={this.doNew} + doEdit={this.doEdit} + >
) } } -const WrappedBoardsNew = Form.create({ name: 'NewWork' })(NewWork); -export default WrappedBoardsNew; \ No newline at end of file +export default NewWork; \ No newline at end of file diff --git a/public/react/src/modules/courses/busyWork/NewWorkForm.js b/public/react/src/modules/courses/busyWork/NewWorkForm.js index c4f6c4eed..5b6d94a69 100644 --- a/public/react/src/modules/courses/busyWork/NewWorkForm.js +++ b/public/react/src/modules/courses/busyWork/NewWorkForm.js @@ -10,6 +10,11 @@ import CBreadcrumb from '../common/CBreadcrumb' const confirm = Modal.confirm; const $ = window.$ const MAX_TITLE_LENGTH = 60; + +/** + 需要注意的props + isGroup +*/ class NewWorkForm extends Component{ constructor(props){ super(props); @@ -250,8 +255,6 @@ class NewWorkForm extends Component{ let {typeId,coursesId,pageType}=this.props.match.params; const { getFieldDecorator } = this.props.form; const isGroup = this.props.isGroup() - const moduleName = !isGroup? "普通作业":"分组作业"; - const moduleEngName = this.props.getModuleName() let{ title_value, contentFileList, answerFileList, max_num, min_num, base_on_project, init_max_num, init_min_num, @@ -453,7 +456,7 @@ class NewWorkForm extends Component{
{/* htmlType="submit" */} - this.props.toListPage(this.props.match.params, category.category_id)}>取消 + this.props.onCancel()}>取消
diff --git a/public/react/src/modules/user/usersInfo/banks/BanksIndex.js b/public/react/src/modules/user/usersInfo/banks/BanksIndex.js index 58100c41a..6b636dca2 100644 --- a/public/react/src/modules/user/usersInfo/banks/BanksIndex.js +++ b/public/react/src/modules/user/usersInfo/banks/BanksIndex.js @@ -30,6 +30,10 @@ const GtopicBanksEdit = Loadable({ loader: () => import('./GtopicBanksEdit'), loading: Loading, }) +const HomeworkBanksEdit = Loadable({ + loader: () => import('./HomeworkBanksEdit'), + loading: Loading, +}) class BanksIndex extends Component{ constructor(props){ @@ -75,7 +79,13 @@ class BanksIndex extends Component{

- + { + return () + } + }> + { diff --git a/public/react/src/modules/user/usersInfo/banks/HomeworkBanksEdit.js b/public/react/src/modules/user/usersInfo/banks/HomeworkBanksEdit.js new file mode 100644 index 000000000..c94e8d740 --- /dev/null +++ b/public/react/src/modules/user/usersInfo/banks/HomeworkBanksEdit.js @@ -0,0 +1,100 @@ +import React, { Component } from 'react'; +import axios from 'axios' + + +import NewWorkForm from '../../../courses/busyWork/NewWorkForm' + +class HomeworkBanksEdit extends Component { + constructor(props){ + super(props); + this.state = { + isPublic: undefined, + isGroup: false + } + } + componentDidMount = () =>{ + let workId = this.props.match.params.workId; + + this.initData(workId); + } + + initData = (workId) =>{ + let url = `/homework_banks/${workId}.json`; + axios.get(url).then((result)=>{ + if(result){ + const crumbData={ + title:'编辑', + is_public:result && result.data && result.data.is_public, + crumbArray:[ + {to:`/banks/homework/${workId}/edit`,content:'详情'}, + {content:'编辑'} + ] + } + this.props.initPublic(crumbData); + result.data.isEdit = true; + result.data.ref_attachments = result.data.reference_attachments + this.setState({ isGroup: result.data.min_num || result.data.max_num }) + this.newWorkFormRef.initValue(result.data); + } + }).catch((error)=>{ + console.log(error) + }) + } + + + doNew = () => { + } + doEdit = (params) => { + const workId = this.props.match.params.workId + const newUrl = `/homework_banks/${workId}.json` + + // const isGroup = this.props.isGroup() + axios.put(newUrl, params) + .then((response) => { + if (response.data.status == 0) { + this.props.showNotification('保存成功') + this.toWorkDetail() + } + }) + .catch(function (error) { + console.log(error); + }); + } + toWorkDetail = () => { + this.props.history.push(`/banks/homework/${this.props.match.params.workId}`) + } + onCancel = () => { + this.toWorkDetail() + } + isGroup = () => { + return this.state.isGroup; + } + render(){ + let { bankId } = this.props.match.params + const common = { + onCancel:this.onCancel, + isGroup: this.isGroup, + doNew: this.doNew, + doEdit: this.doEdit, + } + return( +
+ + this.newWorkFormRef = ref} + topicId={bankId} + > +
+ ) + } +} +export default HomeworkBanksEdit; \ No newline at end of file