forked from Gitlink/forgeplus-react
修改glcc报名逻辑
This commit is contained in:
何童崇
parent
01cc3eae3f
commit
95328d2c60
|
|
@ -0,0 +1,117 @@
|
|||
/* eslint-disable react/jsx-no-duplicate-props */
|
||||
import React, { useState } from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import { Modal, Button } from 'antd';
|
||||
import './index.scss';
|
||||
|
||||
InitModal.defaultProps = {
|
||||
okText: '确认', //确定按钮的文字
|
||||
cancelText: '取消', //取消按钮的文字
|
||||
className: '', //
|
||||
inputId: 'copyText', //要复制的文本的ID
|
||||
};
|
||||
|
||||
// 使用函数调用删除组件
|
||||
export default function DelModal(props) {
|
||||
renderModal({ ...props, type: 'delete' })
|
||||
}
|
||||
|
||||
// 使用函数调用选择模态框组件
|
||||
export function Confirm(props) {
|
||||
renderModal({ ...props, type: 'confirm' })
|
||||
}
|
||||
|
||||
function renderModal(props) {
|
||||
const { type, afterClose } = props;
|
||||
const div = document.createElement('div');
|
||||
document.body.appendChild(div);
|
||||
|
||||
function destroy() {
|
||||
afterClose && afterClose();
|
||||
const unmountResult = ReactDOM.unmountComponentAtNode(div);
|
||||
if (unmountResult && div.parentNode) {
|
||||
div.parentNode.removeChild(div);
|
||||
}
|
||||
}
|
||||
|
||||
function modalType(type) {
|
||||
if (type === 'delete') {
|
||||
return <InitModal
|
||||
title="删除"
|
||||
contentTitle="确定要删除吗？"
|
||||
okText="确认删除"
|
||||
{...props}
|
||||
|
||||
afterClose={destroy}
|
||||
contentTitle={<React.Fragment>
|
||||
<i className="red-circle iconfont icon-shanchu_tc_icon mr3"></i>
|
||||
{props.contentTitle}
|
||||
</React.Fragment>}
|
||||
/>
|
||||
} else if (type === 'confirm') {
|
||||
return <InitModal title="选择" afterClose={destroy} {...props} />
|
||||
} else {
|
||||
return <InitModal title="选择" afterClose={destroy} {...props} />
|
||||
}
|
||||
}
|
||||
|
||||
function render() {
|
||||
setTimeout(() => {
|
||||
ReactDOM.render(
|
||||
modalType(type),
|
||||
div,
|
||||
);
|
||||
});
|
||||
}
|
||||
render();
|
||||
}
|
||||
|
||||
// 选择模态框组件
|
||||
function InitModal({
|
||||
onCancel,
|
||||
onOk,
|
||||
title,
|
||||
contentTitle,
|
||||
content,
|
||||
okText,
|
||||
cancelText,
|
||||
afterClose,
|
||||
className,
|
||||
}) {
|
||||
|
||||
const [visible, setVisible] = useState(true);
|
||||
|
||||
function onCancelModal() {
|
||||
setVisible(false);
|
||||
onCancel && onCancel()
|
||||
}
|
||||
|
||||
function onSuccess() {
|
||||
setVisible(false);
|
||||
onOk && onOk();
|
||||
}
|
||||
|
||||
return (
|
||||
<Modal
|
||||
visible={visible}
|
||||
onCancel={onCancelModal}
|
||||
afterClose={afterClose}
|
||||
title={title}
|
||||
className={`myself-modal ${className}`}
|
||||
centered
|
||||
footer={[
|
||||
<Button type="default" key="back" onClick={onCancelModal}>
|
||||
{cancelText}
|
||||
</Button>,
|
||||
<Button className="foot-submit" key="submit" onClick={onSuccess}>
|
||||
{okText}
|
||||
</Button>,
|
||||
]}
|
||||
>
|
||||
<div>
|
||||
{contentTitle && <p className="content-title">{contentTitle}</p>}
|
||||
<p className="content-descibe">{content}</p>
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
.myself-modal {
|
||||
.ant-modal-header {
|
||||
padding: 9px 24px;
|
||||
background: #f8f8f8;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.ant-modal-title {
|
||||
text-align: left;
|
||||
}
|
||||
.ant-modal-close {
|
||||
top: 0px !important;
|
||||
}
|
||||
.ant-modal-close-x {
|
||||
font-size: 24px;
|
||||
}
|
||||
.ant-modal-body {
|
||||
text-align: center;
|
||||
}
|
||||
.content-title {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 2rem 0 1rem !important;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
letter-spacing: 0;
|
||||
line-height: 29px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.red-circle {
|
||||
align-self: flex-start;
|
||||
color: #ca0002;
|
||||
font-size: 1.5rem !important;
|
||||
}
|
||||
.content-descibe {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
line-height: 33px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.ant-modal-footer {
|
||||
padding: 2rem 0;
|
||||
text-align: center;
|
||||
border: 0;
|
||||
.ant-btn {
|
||||
width: 6rem;
|
||||
}
|
||||
}
|
||||
.foot-submit {
|
||||
margin-left: 3rem;
|
||||
color: #df0002;
|
||||
&:hover {
|
||||
border-color: #df0002;
|
||||
}
|
||||
}
|
||||
.ant-btn-default:hover,
|
||||
.ant-btn-default:active,
|
||||
.ant-btn-default:focus {
|
||||
background: #f3f4f6;
|
||||
color: #333;
|
||||
border-color: #d0d0d0;
|
||||
}
|
||||
}
|
||||
|
|
@ -126,7 +126,8 @@ export default Form.create()(({ form, history, showNotification, projectDetail,
|
|||
}
|
||||
|
||||
function goBack() {
|
||||
history.push(`/${owner}/${projectsId}/wiki`);
|
||||
// history.push(`/${owner}/${projectsId}/wiki`);
|
||||
history.go(-1);
|
||||
}
|
||||
|
||||
function changeModal(e) {
|
||||
|
|
|
|||
|
|
@ -4,8 +4,9 @@ import { getUploadActionUrl, getUrl, appendFileSizeToUploadFileAll } from 'educo
|
|||
import { locData } from '../../forge/Utils/locData';
|
||||
import { getStudentApplyInfo, taskList, studentApply, studentApplyEdit } from '../api';
|
||||
import TextArea from 'antd/lib/input/TextArea';
|
||||
import {Confirm} from '../../components/ModalFun';
|
||||
import { httpUrl } from '../fetch';
|
||||
import banner from "../img/banner.png";
|
||||
// import banner from "../img/banner.png";
|
||||
import studentSvg from "../img/student.png";
|
||||
import './index.scss';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
|
@ -34,12 +35,13 @@ function Apply(props) {
|
|||
const [imageUrl, setImageUrl] = useState(undefined);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [reload, setReload] = useState();
|
||||
const [locked, setLocked] = useState(false);
|
||||
const [locked, setLocked] = useState(true);
|
||||
const [userApplyInfo, setUserApplyInfo] = useState(undefined);
|
||||
const [editable, setEditable] = useState(isStudentApplyDate);
|
||||
const [files, setFiles] = useState([]);
|
||||
const [files1, setFiles1] = useState([]);
|
||||
const [files2, setFiles2] = useState([]);
|
||||
console.log( new Date());
|
||||
console.log('isStudentApplyDate:' + isStudentApplyDate)
|
||||
const initTask = {
|
||||
taskId,
|
||||
|
|
@ -110,7 +112,7 @@ function Apply(props) {
|
|||
applyInfo['memo' + i] = item.memo;
|
||||
applyInfo['taskId' + i] = item.taskId;
|
||||
applyInfo['memoAttachmentId' + i] = item.memoAttachmentId;
|
||||
if (item.locked) {
|
||||
if (item.locked && item.passStatus) {
|
||||
lockedCurrent = item.locked;
|
||||
}
|
||||
if (i == 0) {
|
||||
|
|
@ -150,11 +152,15 @@ function Apply(props) {
|
|||
// });
|
||||
}
|
||||
setMyTaskList(initTaskList);
|
||||
setLocked(lockedCurrent);
|
||||
|
||||
// let idArr= data.registrationStudentTaskList.map(i=>{return i.id});
|
||||
// if(idArr.length===3){lockedCurrent=true;}
|
||||
// setLocked(lockedCurrent);
|
||||
// 如果未被锁定，且小于3条报名数据，且课题id与当前id不一致，那么新增一条默认数据
|
||||
let taskIdArr=data.registrationStudentTaskList.map(i=>{return i.taskId});
|
||||
if (!lockedCurrent && data.registrationStudentTaskList.length < 3 && !taskIdArr.includes(taskId)) {
|
||||
addTask(data.registrationStudentTaskList);
|
||||
setLocked(false);
|
||||
}
|
||||
} else {
|
||||
// 先增加数据再给选择框赋默认值，否则不生效
|
||||
|
|
@ -192,57 +198,65 @@ function Apply(props) {
|
|||
|
||||
// 学生报名夏令营
|
||||
function handleSubmit(e) {
|
||||
|
||||
e.preventDefault();
|
||||
validateFieldsAndScroll((err, values) => {
|
||||
if (!err) {
|
||||
setLoading(true);
|
||||
// if (myTaskList.length === 2) {
|
||||
// if (values.enrollFirst == 1) {
|
||||
// myTaskList[1].enrollFirst = true;
|
||||
// myTaskList[0].enrollFirst = false;
|
||||
// } else {
|
||||
// myTaskList[1].enrollFirst = false;
|
||||
// myTaskList[0].enrollFirst = true;
|
||||
// }
|
||||
// }
|
||||
const params = {
|
||||
grade: values.grade,
|
||||
location: Array.isArray(values.location) && values.location.join(),
|
||||
mail: values.mail,
|
||||
phone: values.phone,
|
||||
proveAttachmentId: values.proveAttachmentId.file ? values.proveAttachmentId.file.response.id : userApplyInfo.proveAttachmentId,
|
||||
school: values.school,
|
||||
profession: values.profession,
|
||||
studentName: values.studentName,
|
||||
userId: current_user.user_id,
|
||||
registrationStudentTaskList: myTaskList
|
||||
}
|
||||
|
||||
|
||||
if (userApplyInfo) {
|
||||
params.id = userApplyInfo.id;
|
||||
studentApplyEdit(params).then(response => {
|
||||
if (response && response.message === "success") {
|
||||
showNotification("修改信息成功");
|
||||
setStudentInfoReset(Math.random());
|
||||
setReload(Math.random());
|
||||
setLoading(false);
|
||||
history.push(`/glcc/subjects`)
|
||||
Confirm({
|
||||
title:'提示',
|
||||
content:'提交后将不允许修改报名信息，确认提交？',
|
||||
onOk:()=>{
|
||||
validateFieldsAndScroll((err, values) => {
|
||||
if (!err) {
|
||||
setLoading(true);
|
||||
// if (myTaskList.length === 2) {
|
||||
// if (values.enrollFirst == 1) {
|
||||
// myTaskList[1].enrollFirst = true;
|
||||
// myTaskList[0].enrollFirst = false;
|
||||
// } else {
|
||||
// myTaskList[1].enrollFirst = false;
|
||||
// myTaskList[0].enrollFirst = true;
|
||||
// }
|
||||
// }
|
||||
const params = {
|
||||
grade: values.grade,
|
||||
location: Array.isArray(values.location) && values.location.join(),
|
||||
mail: values.mail,
|
||||
phone: values.phone,
|
||||
proveAttachmentId: values.proveAttachmentId.file ? values.proveAttachmentId.file.response.id : userApplyInfo.proveAttachmentId,
|
||||
school: values.school,
|
||||
profession: values.profession,
|
||||
studentName: values.studentName,
|
||||
userId: current_user.user_id,
|
||||
registrationStudentTaskList: myTaskList
|
||||
}
|
||||
});
|
||||
} else {
|
||||
studentApply(params).then(response => {
|
||||
if (response && response.message === "success") {
|
||||
showNotification("报名成功");
|
||||
setStudentInfoReset(Math.random());
|
||||
setReload(Math.random());
|
||||
setLoading(false);
|
||||
history.push(`/glcc/subjects`)
|
||||
|
||||
|
||||
if (userApplyInfo) {
|
||||
params.id = userApplyInfo.id;
|
||||
studentApplyEdit(params).then(response => {
|
||||
if (response && response.message === "success") {
|
||||
showNotification("修改信息成功");
|
||||
setStudentInfoReset(Math.random());
|
||||
setReload(Math.random());
|
||||
setLoading(false);
|
||||
history.push(`/glcc/subjects`)
|
||||
}
|
||||
});
|
||||
} else {
|
||||
studentApply(params).then(response => {
|
||||
if (response && response.message === "success") {
|
||||
showNotification("报名成功");
|
||||
setStudentInfoReset(Math.random());
|
||||
setReload(Math.random());
|
||||
setLoading(false);
|
||||
history.push(`/glcc/subjects`)
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
const helper = useCallback(
|
||||
|
|
@ -439,7 +453,7 @@ function Apply(props) {
|
|||
'',
|
||||
'grade',
|
||||
[],
|
||||
<Select placeholder="请选择所在年级" disabled={editable ? false : true} className={editable ? "" : "disabledInput"} dropdownClassName="glcc_select">
|
||||
<Select placeholder="请选择所在年级" className={"disabledInput"} disabled dropdownClassName="glcc_select">
|
||||
{gradeList.map(item => { return <Option value={item.name} key={item.id}>{item.name}</Option> })}
|
||||
</Select>
|
||||
)}
|
||||
|
|
@ -528,7 +542,7 @@ function Apply(props) {
|
|||
6、提示：文本框表达内容有限，建议您提供内容的pdf或url链接方式展示更精彩的陈述"
|
||||
onBlur={(e) => { verify("memo" + i); changeTaskItem("memo", e.currentTarget.value, i) }}
|
||||
rows={7}
|
||||
className={editable ? "memoText disabledInput" : "memoText disabledInput"}
|
||||
className={!(isStudentApplyDate && !item.id) ? "memoText disabledInput" : "memoText"}
|
||||
disabled={!(isStudentApplyDate && !item.id)} />
|
||||
)}</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue