forked from Gitlink/forgeplus-react
增加新的定制化竞赛
This commit is contained in:
parent
7e52648994
commit
174cf56a8c
|
|
@ -33,8 +33,8 @@ export function initAxiosInterceptors(props) {
|
|||
initOnlineOfflineListener();
|
||||
|
||||
// var proxy = "http://192.168.1.40:3000";
|
||||
var proxy = "http://111.8.36.180:8000";
|
||||
// var proxy = "http://117.50.100.12:49999";
|
||||
// var proxy = "http://111.8.36.180:8000";
|
||||
var proxy = "http://117.50.100.12:49999";
|
||||
// var proxy = "https://www.osredm.com";
|
||||
|
||||
//响应前的设置
|
||||
|
|
|
|||
|
|
@ -246,9 +246,9 @@ const Competition = (props) => {
|
|||
{competitionId === 'qz2022' && <li className={active === "statistics" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/${competitionId}/statistics` }}>数据统计</Link>
|
||||
</li>}
|
||||
<li className={active === "chat" ? "active" : ""}>
|
||||
{competitionId!== 'JQTJ' &&<li className={active === "chat" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/${competitionId}/chat` }}>交流互动</Link>
|
||||
</li>
|
||||
</li>}
|
||||
<li className={active === "contact" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/${competitionId}/contact` }}>联系我们</Link>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import React, {useState, useCallback} from "react";
|
||||
import Qz2022 from './qz2022';
|
||||
import Ccks from './ccks';
|
||||
import Jqtj from './jqtj';
|
||||
import './index.scss';
|
||||
import '../index.scss';
|
||||
|
||||
|
|
@ -9,6 +10,6 @@ export default (props)=>{
|
|||
const { competitionId } = match.params;
|
||||
|
||||
return(
|
||||
competitionId=="qz2022"? <Qz2022 {...props} />:<Ccks {...props} />
|
||||
competitionId=="qz2022"? <Qz2022 {...props} />:competitionId=="zstp2022"? <Ccks {...props} />:<Jqtj {...props} />
|
||||
)
|
||||
}
|
||||
|
|
@ -336,3 +336,10 @@
|
|||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.jqtj{
|
||||
.download{
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,530 @@
|
|||
import React, { useState, useCallback } from "react";
|
||||
import {
|
||||
Input,
|
||||
Button,
|
||||
Form,
|
||||
message,
|
||||
Modal,
|
||||
Upload,
|
||||
Icon,
|
||||
Tooltip,
|
||||
} from "antd";
|
||||
import { appendFileSizeToUploadFileAll, getUploadActionUrl } from "educoder";
|
||||
import { enrollCompetition, enrollUpdate, updateTemplate } from "../api";
|
||||
import { current_main_site_url } from "../fetch";
|
||||
import EditTable from "../editTable";
|
||||
import apply_top from "../image/apply_top.png";
|
||||
import apply_down from "../image/apply_down.png";
|
||||
import apply_input from "../image/apply_input.png";
|
||||
import apply_success from "../image/apply_success.png";
|
||||
import apply_check from "../image/apply_check.png";
|
||||
|
||||
import { useEffect } from "react";
|
||||
|
||||
export default Form.create()((props) => {
|
||||
const {
|
||||
form,
|
||||
qzDetail,
|
||||
enrollStatus,
|
||||
setReload,
|
||||
current_user,
|
||||
history,
|
||||
match,
|
||||
} = props;
|
||||
const { competitionId } = match.params;
|
||||
|
||||
const { getFieldDecorator, validateFields, setFieldsValue } = form;
|
||||
const [members, setMembers] = useState([]);
|
||||
const [errorMessage, setErrorMessage] = useState(undefined);
|
||||
const [sourceBy, setSourceBy] = useState(1);
|
||||
const [visible, setVisible] = useState(false);
|
||||
// 上传文件时 按钮loading效果
|
||||
const [files, setFiles] = useState([]);
|
||||
useEffect(() => {
|
||||
const applyStatus = qzDetail
|
||||
? Date.parse(new Date()) < Date.parse(new Date(qzDetail.enroll_date))
|
||||
: true;
|
||||
if ((current_user && !current_user.login) || (!applyStatus && (enrollStatus && enrollStatus.status < 2))) {
|
||||
history.push(`/competition/${competitionId}`);
|
||||
}
|
||||
if (
|
||||
enrollStatus &&
|
||||
enrollStatus.enroll_status &&
|
||||
enrollStatus.status === 0
|
||||
) {
|
||||
setMembers(enrollStatus.enroll_info.members);
|
||||
setSourceBy(enrollStatus.enroll_info.subject_source_type);
|
||||
setFieldsValue(enrollStatus.enroll_info);
|
||||
}
|
||||
if (
|
||||
enrollStatus &&
|
||||
enrollStatus.enroll_info &&
|
||||
enrollStatus.enroll_info.enroll_template
|
||||
) {
|
||||
setFiles([
|
||||
{
|
||||
...enrollStatus.enroll_info.enroll_template,
|
||||
uid: "rc-upload-" + enrollStatus.enroll_info.enroll_template.id,
|
||||
name: enrollStatus.enroll_info.enroll_template.title,
|
||||
response: { id: enrollStatus.enroll_info.enroll_template.id },
|
||||
},
|
||||
]);
|
||||
setFieldsValue({
|
||||
enroll_template_id: enrollStatus.enroll_info.enroll_template.id,
|
||||
});
|
||||
}
|
||||
}, [current_user, enrollStatus]);
|
||||
|
||||
// form表单公共处理函数
|
||||
const helper = useCallback(
|
||||
(label, name, rules, widget, extra, className) => (
|
||||
<Form.Item label={label} extra={extra} className={className}>
|
||||
{getFieldDecorator(name, { rules, validateFirst: true })(widget)}
|
||||
</Form.Item>
|
||||
),
|
||||
[]
|
||||
);
|
||||
|
||||
// 当用户输入结束时 检验用户输入是否符合规范
|
||||
function verify(dataIndex) {
|
||||
validateFields([dataIndex], (error, values) => {
|
||||
if (error && error[dataIndex]) {
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 检查用户填写信息
|
||||
function checkInfo() {
|
||||
if (!files.length) {
|
||||
setFieldsValue({ enroll_template_id: '' })
|
||||
}
|
||||
setErrorMessage(undefined);
|
||||
// 检查用户输入的成员属性是否完全
|
||||
if (members.length > 0) {
|
||||
let all = 0;
|
||||
const len = 3;
|
||||
// 用户输入的长度是否满足要求
|
||||
let sizes = 0;
|
||||
members.map((item) => {
|
||||
const valuesLen = Object.values(item);
|
||||
const nullMap = valuesLen.filter((i) => {
|
||||
return i.length === 0;
|
||||
}).length;
|
||||
if (
|
||||
valuesLen.length === len && nullMap === 0
|
||||
) {
|
||||
// 通过的情况
|
||||
all += 1;
|
||||
}
|
||||
valuesLen.filter((i) => {
|
||||
return i.length > 32;
|
||||
}).length > 0 && (sizes += 1);
|
||||
});
|
||||
if (members.length !== all) {
|
||||
setErrorMessage("成员信息未填写完成");
|
||||
return;
|
||||
}
|
||||
if (sizes > 0) {
|
||||
setErrorMessage("成员信息填写不规范");
|
||||
return;
|
||||
}
|
||||
}
|
||||
validateFields((error, values) => {
|
||||
if (error) {
|
||||
return;
|
||||
} else {
|
||||
setVisible(true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//提交报名信息
|
||||
function applySubmit() {
|
||||
validateFields((error, values) => {
|
||||
if (error) {
|
||||
return;
|
||||
} else {
|
||||
// 用户输入正确 报名该竞赛
|
||||
const params = {
|
||||
...values,
|
||||
members,
|
||||
subject_source_type: sourceBy,
|
||||
enroll_template_id: files[0]&&files[0].response&&files[0].response.id ||22,
|
||||
};
|
||||
// enrollStatus.enroll_status判断用户是首次提交资料还是修改资料
|
||||
if (enrollStatus && !enrollStatus.enroll_status) {
|
||||
enrollCompetition(params, competitionId).then((response) => {
|
||||
if (response && response.data.message === "success") {
|
||||
setReload(Math.random());
|
||||
message.success("报名成功");
|
||||
} else {
|
||||
message.error(response.data.message);
|
||||
}
|
||||
setVisible(false);
|
||||
});
|
||||
} else {
|
||||
enrollUpdate(params, competitionId).then((response) => {
|
||||
if (response && response.data.message === "success") {
|
||||
setReload(Math.random());
|
||||
message.success("资料修改成功");
|
||||
} else {
|
||||
message.error(response.data.message);
|
||||
}
|
||||
setVisible(false);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function handleChange(info) {
|
||||
if (
|
||||
info.file.status === "uploading" ||
|
||||
info.file.status === "done" ||
|
||||
info.file.status === "removed"
|
||||
) {
|
||||
setFiles(appendFileSizeToUploadFileAll(info.fileList).slice(-1));
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// 支持文件下载
|
||||
function download(file) {
|
||||
const fileId = file.id || file.response.id;
|
||||
window.open(`${current_main_site_url}/api/attachments/${fileId}`);
|
||||
}
|
||||
|
||||
// 进行文件大小检查
|
||||
function beforeUpload(file) {
|
||||
const isLt100M = file.size / 1024 / 1024 < 10;
|
||||
const isType = file.type === "image/png" || file.type === "image/jpg" || file.type === "image/jpeg" || file.name.endsWith(".zip") || file.name.endsWith(".rar");
|
||||
if (!isType) {
|
||||
message.error("只能上传指定类型文件");
|
||||
}
|
||||
if (!isLt100M) {
|
||||
message.error("文件大小必须小于10MB");
|
||||
}
|
||||
|
||||
return isLt100M && isType;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="qz_main ccks jqtj">
|
||||
<div className="step">
|
||||
<img src={apply_top} className="step_icon" alt="" />
|
||||
<div className="border_dashed"></div>
|
||||
<div className="img_span">
|
||||
<img src={apply_input} className="step_icon_svg" alt="" />
|
||||
<span
|
||||
className={`${enrollStatus &&
|
||||
(!enrollStatus.enroll_status || enrollStatus.status === 0) &&
|
||||
"active"
|
||||
}`}
|
||||
>
|
||||
个人信息
|
||||
</span>
|
||||
</div>
|
||||
<div className="border_dashed"></div>
|
||||
<div className="img_span">
|
||||
<img src={apply_check} className="step_icon_svg" alt="" />
|
||||
<span
|
||||
className={`${enrollStatus && enrollStatus.status === 1 && "active"
|
||||
}`}
|
||||
>
|
||||
报名审核中
|
||||
</span>
|
||||
</div>
|
||||
<div className="border_dashed"></div>
|
||||
<div className="img_span">
|
||||
<img src={apply_success} className="step_icon_svg" alt="" />
|
||||
<span
|
||||
className={`${enrollStatus && enrollStatus.status === 2 && "active"
|
||||
}`}
|
||||
>
|
||||
报名成功
|
||||
</span>
|
||||
</div>
|
||||
<div className="border_dashed"></div>
|
||||
<img src={apply_down} className="step_icon" alt="" />
|
||||
</div>
|
||||
|
||||
{enrollStatus && enrollStatus.enroll_info && enrollStatus.status === 0 && (
|
||||
<div className="ccks_info info_error">
|
||||
<i className="iconfont icon-shanchudiao mr10"></i>
|
||||
您的报名暂未通过审核，请重新提交报名信息，谢谢！
|
||||
</div>
|
||||
)}
|
||||
{enrollStatus && enrollStatus.status === 1 && (
|
||||
<div className="ccks_info info_wait">
|
||||
<i className="iconfont icon-shijianicon mr10"></i>
|
||||
您的报名信息正在审核中，请耐心等待
|
||||
</div>
|
||||
)}
|
||||
{enrollStatus && enrollStatus.enroll_info && (enrollStatus.enroll_info.status === 2 || enrollStatus.enroll_info.status === 3) && (
|
||||
<div className="ccks_info info_success">
|
||||
<i className="iconfont icon-xiaoxilingdang mr10"></i>
|
||||
您已报名成功，请下载离线训练包
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="apply_information mb60">
|
||||
<div className="info_head">
|
||||
{!(enrollStatus && enrollStatus.enroll_status) && "填写"}报名信息
|
||||
</div>
|
||||
{/* 单位证明单 */}
|
||||
{enrollStatus &&
|
||||
(!enrollStatus.enroll_status || enrollStatus.status === 0) && (
|
||||
<Form className="info_form">
|
||||
{helper(
|
||||
"参赛单位",
|
||||
"org_name",
|
||||
[
|
||||
{ required: true, message: "请正确输入参赛单位" },
|
||||
{ max: 200, message: "超出限制长度200位字符，请重新编辑" },
|
||||
],
|
||||
<Input
|
||||
placeholder="请输入参赛单位"
|
||||
onBlur={() => {
|
||||
verify("org_name");
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{helper(
|
||||
"参赛队长姓名",
|
||||
"leader",
|
||||
[
|
||||
{ required: true, message: "请正确输入参赛队长姓名" },
|
||||
{ max: 32, message: "超出限制长度32位字符，请重新编辑" },
|
||||
],
|
||||
<Input
|
||||
placeholder="请输入参赛队长姓名"
|
||||
onBlur={() => {
|
||||
verify("leader");
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{helper(
|
||||
"参赛队长电话",
|
||||
"phone",
|
||||
[
|
||||
{ required: true, message: "请正确输入参赛队长电话" },
|
||||
{ max: 14, message: "超出限制长度14位字符，请重新编辑" },
|
||||
{
|
||||
pattern:
|
||||
/(^(\d{3,4}-)?\d{7,8})$|([1][3,4,5,6,7,8,9][0-9]{9})/,
|
||||
message: "请正确输入参赛队长电话",
|
||||
},
|
||||
],
|
||||
<Input
|
||||
placeholder="请输入参赛队长电话"
|
||||
onBlur={() => {
|
||||
verify("phone");
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{helper(
|
||||
"队长邮箱地址",
|
||||
"mail",
|
||||
[
|
||||
{ type: "email", message: "请输入正确的邮箱地址" },
|
||||
{ required: true, message: "请输入邮箱地址" },
|
||||
{ max: 50, message: "超出限制长度50位字符，请重新编辑" },
|
||||
],
|
||||
<Input
|
||||
placeholder="请输入邮箱地址"
|
||||
onBlur={() => {
|
||||
verify("mail");
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
{helper(
|
||||
"队长单位证明",
|
||||
"enroll_template_id",
|
||||
[{ required: true, message: "请上传队长单位证明" }],
|
||||
<Upload
|
||||
accept=".jpg,.png,.jpeg,.zip,.rar"
|
||||
action={getUploadActionUrl}
|
||||
fileList={files}
|
||||
onChange={handleChange}
|
||||
onDownload={download}
|
||||
beforeUpload={beforeUpload}
|
||||
showUploadList={{
|
||||
showDownloadIcon: true,
|
||||
downloadIcon: <i className="iconfont icon-xiazai-icon"></i>,
|
||||
showRemoveIcon: false,
|
||||
}}
|
||||
className="uploadBox"
|
||||
>
|
||||
<Button className="upload">
|
||||
<Icon type="upload" />
|
||||
上传
|
||||
</Button>
|
||||
<div className="tips mt10">
|
||||
1、请上传加盖单位公章照片证明，文件名称命名为：“集群突击”群体智能开放挑战赛_参赛队名称_报名申请表
|
||||
<br />
|
||||
2、文件大小必须小于10MB
|
||||
<br />
|
||||
3、文件类型仅支持jpg、png、jpeg、zip、rar格式
|
||||
</div>
|
||||
</Upload>,
|
||||
'',
|
||||
"upload_form"
|
||||
)}
|
||||
|
||||
<div className="edit_table">
|
||||
{/* <p className="mt10">成员 : </p> */}
|
||||
|
||||
{qzDetail && (
|
||||
<EditTable
|
||||
members={
|
||||
enrollStatus && enrollStatus.enroll_status
|
||||
? enrollStatus.enroll_info.members
|
||||
: [{ key: "0" }]
|
||||
}
|
||||
setMembers={setMembers}
|
||||
isLocal={qzDetail.is_local}
|
||||
/>
|
||||
)}
|
||||
<p className="error_message">{errorMessage}</p>
|
||||
</div>
|
||||
</Form>
|
||||
)}
|
||||
{/* 已报名，报名信息 */}
|
||||
{enrollStatus &&
|
||||
enrollStatus.enroll_status &&
|
||||
enrollStatus.status !== 0 && (
|
||||
<div>
|
||||
<div className="info ">
|
||||
<div>
|
||||
<span>参赛单位 : </span>
|
||||
<Tooltip
|
||||
title={enrollStatus && enrollStatus.enroll_info.org_name}
|
||||
placement="topLeft"
|
||||
>
|
||||
{enrollStatus && enrollStatus.enroll_info.org_name}
|
||||
</Tooltip>
|
||||
</div>
|
||||
<div className="info-right">
|
||||
<span>参赛队长姓名 : </span>
|
||||
<Tooltip
|
||||
title={enrollStatus && enrollStatus.enroll_info.leader}
|
||||
placement="topLeft"
|
||||
>
|
||||
{enrollStatus && enrollStatus.enroll_info.leader}
|
||||
</Tooltip>
|
||||
</div>
|
||||
<div>
|
||||
<span>参赛队长电话 : </span>
|
||||
<Tooltip
|
||||
title={enrollStatus && enrollStatus.enroll_info.phone}
|
||||
placement="topLeft"
|
||||
>
|
||||
{enrollStatus && enrollStatus.enroll_info.phone}
|
||||
</Tooltip>
|
||||
</div>
|
||||
<div className={`info-right }`}>
|
||||
<span>队长邮箱地址 : </span>
|
||||
<Tooltip
|
||||
title={enrollStatus && enrollStatus.enroll_info.mail}
|
||||
>
|
||||
{enrollStatus && enrollStatus.enroll_info.mail}
|
||||
</Tooltip>
|
||||
</div>
|
||||
|
||||
|
||||
<div className={`info-right }`}>
|
||||
<span>队长单位证明 : </span>
|
||||
{enrollStatus && enrollStatus.enroll_info.enroll_template && (
|
||||
<a
|
||||
href={
|
||||
current_main_site_url +
|
||||
enrollStatus.enroll_info.enroll_template.url
|
||||
}
|
||||
className="ml10 mb30 download btn_text"
|
||||
>
|
||||
{enrollStatus.enroll_info.enroll_template.title}
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{enrollStatus && enrollStatus.enroll_info.members.length ? <div className={`info-right `}>
|
||||
<span>成员 : </span>
|
||||
<Tooltip
|
||||
title={
|
||||
enrollStatus &&
|
||||
enrollStatus.enroll_info.members &&
|
||||
enrollStatus.enroll_info.members.map((item) => {
|
||||
return item.real_name;
|
||||
}).join('，')
|
||||
}
|
||||
placement="topLeft"
|
||||
>
|
||||
{enrollStatus &&
|
||||
enrollStatus.enroll_info.members &&
|
||||
enrollStatus.enroll_info.members.map((item) => {
|
||||
return item.real_name
|
||||
}).join('，')}
|
||||
</Tooltip>
|
||||
</div> : ''}
|
||||
</div>
|
||||
|
||||
{enrollStatus && enrollStatus.enroll_info && (enrollStatus.enroll_info.status == 2 || enrollStatus.enroll_info.status == 3) && qzDetail && qzDetail.enroll_template && (
|
||||
<div className="download_box">
|
||||
<a
|
||||
href={
|
||||
qzDetail && (qzDetail.enroll_template.indexOf('http') > -1 ? qzDetail.enroll_template :
|
||||
current_main_site_url +
|
||||
(qzDetail && qzDetail.enroll_template))
|
||||
}
|
||||
>
|
||||
<Button className=" download ml20">
|
||||
<Icon type="download" /> 下载离线训练包
|
||||
{/* <span className="btn_text">
|
||||
{
|
||||
qzDetail && (qzDetail.enroll_template.indexOf('http') > -1 ? qzDetail.enroll_template :
|
||||
current_main_site_url +
|
||||
(qzDetail && qzDetail.enroll_template))
|
||||
}
|
||||
</span> */}
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{enrollStatus &&
|
||||
(!enrollStatus.enroll_status || enrollStatus.status === 0) &&
|
||||
(
|
||||
<div className="apply_but">
|
||||
<Button type="primary" className="submit_info" onClick={checkInfo}>
|
||||
提交资料
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
<Modal
|
||||
title="提示"
|
||||
visible={visible}
|
||||
onOk={applySubmit}
|
||||
onCancel={() => {
|
||||
setVisible(false);
|
||||
}}
|
||||
centered
|
||||
wrapClassName="applyInfoCon"
|
||||
cancelText=""
|
||||
>
|
||||
<div className="tips mb10">
|
||||
<i
|
||||
className="iconfont icon-shanchu_tc_icon1 font-24 mr10"
|
||||
style={{ color: "#ffa13a" }}
|
||||
></i>
|
||||
<span className="tipTitle font-16">确定提交报名信息</span>
|
||||
</div>
|
||||
<span>提交后报名信息将无法修改!</span>
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -1,6 +1,8 @@
|
|||
import React, {useState, useCallback} from "react";
|
||||
import Qz2022 from './qz2022';
|
||||
import Ccks from './ccks';
|
||||
import Jqtj from './jqtj';
|
||||
|
||||
import './index.scss';
|
||||
import '../index.scss';
|
||||
|
||||
|
|
@ -9,6 +11,6 @@ export default (props)=>{
|
|||
const { competitionId } = match.params;
|
||||
|
||||
return(
|
||||
competitionId=="qz2022"? <Qz2022 {...props} />:<Ccks {...props} />
|
||||
competitionId=="qz2022"? <Qz2022 {...props} />:competitionId=="zstp2022"? <Ccks {...props} />:<Jqtj {...props} />
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,303 @@
|
|||
import React, { useState, useMemo, useEffect, Fragment } from "react";
|
||||
import { Base64 } from 'js-base64';
|
||||
import { Select, Button, Tooltip, Input, Popconfirm, message } from 'antd';
|
||||
import { current_main_site_url } from '../fetch';
|
||||
import PaginationTable from "../../components/paginationTable";
|
||||
|
||||
import { getEnrollList, getProList, updateEnroll } from "../api.js";
|
||||
const Option = Select.Option;
|
||||
const { Search } = Input;
|
||||
|
||||
function Introduce({ history: { location: { pathname } }, qzDetail, match }) {
|
||||
const { competitionId } = match.params;
|
||||
// 报名列表和作品列表到指向此处，type做区分，0报名，1作品
|
||||
const [type, setType] = useState(pathname.substring(pathname.lastIndexOf('/') + 1, pathname.lenght));
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [curPage, setCurPage] = useState(1);
|
||||
const [dataList, setDataList] = useState([]);
|
||||
const [total, setTotal] = useState(0);
|
||||
const [status, setStatus] = useState('');
|
||||
const [keyword, setKeyword] = useState(undefined);
|
||||
const [reload, setReload] = useState(undefined);
|
||||
const [searchValue, setSearchValue] = useState(undefined);
|
||||
|
||||
useEffect(() => {
|
||||
setKeyword(undefined);
|
||||
setSearchValue(undefined);
|
||||
setCurPage(1);
|
||||
setType(pathname.substring(pathname.lastIndexOf('/') + 1, pathname.lenght));
|
||||
}, [pathname]);
|
||||
|
||||
useEffect(() => {
|
||||
setLoading(true);
|
||||
const params = {
|
||||
page: curPage,
|
||||
limit: 10,
|
||||
keyword,
|
||||
status
|
||||
}
|
||||
if (type === "applys") {
|
||||
// 报名列表
|
||||
getEnrollList(params, competitionId).then(response => {
|
||||
if (response && response.status === 200) {
|
||||
setTotal(response.data.count);
|
||||
setDataList(response.data.data);
|
||||
}
|
||||
}).finally(() => {
|
||||
setLoading(false);
|
||||
})
|
||||
} else {
|
||||
// 提交作品列表
|
||||
delete params.status;
|
||||
getProList(params, competitionId).then(response => {
|
||||
if (response && response.status === 200) {
|
||||
setTotal(response.data.count);
|
||||
setDataList(response.data.data);
|
||||
}
|
||||
}).finally(() => {
|
||||
setLoading(false);
|
||||
})
|
||||
}
|
||||
}, [type, curPage, keyword, status, reload])
|
||||
|
||||
// 改变用户的报名信息
|
||||
function reject(userId, index) {
|
||||
const params = {
|
||||
user_id: userId,
|
||||
status: index
|
||||
}
|
||||
updateEnroll(params, competitionId).then(response => {
|
||||
if (response && response.status === 200) {
|
||||
setReload(Math.random());
|
||||
message.success("操作成功");
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
let columns_apply = useMemo(() => {
|
||||
return [
|
||||
{
|
||||
title: '参赛单位',
|
||||
dataIndex: 'org_name',
|
||||
align: 'center',
|
||||
render: (text, record) => {
|
||||
return <Tooltip title={text} placement="topLeft">{text}</Tooltip>;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '参赛队长姓名',
|
||||
dataIndex: 'leader',
|
||||
key: 'leader',
|
||||
},
|
||||
{
|
||||
title: '参赛队长电话',
|
||||
dataIndex: 'phone',
|
||||
key: 'phone',
|
||||
},
|
||||
{
|
||||
title: '队长邮箱地址',
|
||||
dataIndex: 'mail',
|
||||
render: (text, record) => {
|
||||
return <Tooltip title={text} placement="topLeft">{text}</Tooltip>;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '成员',
|
||||
dataIndex: 'members',
|
||||
render: (text, record) => {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '单位证明',
|
||||
dataIndex: 'enroll_template',
|
||||
render: (text, record) => {
|
||||
return text ? <Tooltip title={text.title} placement="topLeft"><a href={current_main_site_url + text.url} className="attachments_a">{text.title}</a></Tooltip> : '--';
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: "status",
|
||||
align: "center",
|
||||
render: (text, record) => {
|
||||
|
||||
return <Fragment>
|
||||
{text === 0 && <Button size="small" disabled>已驳回</Button>}
|
||||
{(text === 1 || text === 2) && <Popconfirm
|
||||
title="您确定驳回此用户的报名信息？"
|
||||
icon={<i className="iconfont icon-shanchu_tc_icon mr3 font-15" style={{ float: 'left', color: "red" }}></i>}
|
||||
onConfirm={() => { reject(record.user_id, 0) }}
|
||||
><Button size="small" className="mr5">驳回</Button></Popconfirm>}
|
||||
{text === 1 && <Button type="primary" size="small" onClick={() => { reject(record.user_id, 2) }}>通过</Button>}
|
||||
{text === 2 && <Button type="link" size="small" >已通过</Button>}
|
||||
{text === 3 && <Button size="small" disabled>已通过</Button>}
|
||||
</Fragment>
|
||||
}
|
||||
}
|
||||
];
|
||||
}, [qzDetail]);
|
||||
|
||||
const columns_production = useMemo(() => {
|
||||
return [
|
||||
{
|
||||
title: '参赛单位',
|
||||
dataIndex: 'org_name',
|
||||
render: (text, record) => {
|
||||
return <Tooltip title={text} placement="topLeft">{text}</Tooltip>;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '参赛队长姓名',
|
||||
dataIndex: 'leader',
|
||||
},
|
||||
{
|
||||
title: '参赛队长电话',
|
||||
dataIndex: 'phone',
|
||||
key: 'phone',
|
||||
},
|
||||
{
|
||||
title: '队长邮箱地址',
|
||||
dataIndex: 'mail',
|
||||
render: (text, record) => {
|
||||
return <Tooltip title={text} placement="topLeft">{text}</Tooltip>;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '作品',
|
||||
dataIndex: 'attachments',
|
||||
render: (text, record) => {
|
||||
return <Tooltip title={text[0] && text[0].title} placement="topLeft"><a href={current_main_site_url + (text[0] && text[0].url)} className="attachments_a">{text[0] && text[0].title}</a></Tooltip>;
|
||||
}
|
||||
},
|
||||
// {
|
||||
// title: '操作',
|
||||
// dataIndex: "status",
|
||||
// align: "center",
|
||||
// render: (text, record) => {
|
||||
// return text === 1 ? <Button size="small" disabled>已驳回</Button> : <Popconfirm
|
||||
// title="您确定驳回此用户的作品信息？"
|
||||
// icon={<i className="iconfont icon-shanchu_tc_icon mr3 font-15" style={{ float: 'left', color: "red" }}></i>}
|
||||
// onConfirm={() => { reject(record.user_id, 2) }}
|
||||
// ><Button size="small">驳回</Button></Popconfirm>
|
||||
// }
|
||||
// }
|
||||
];
|
||||
}, [qzDetail]);
|
||||
|
||||
// 如果是内网环境，则增加部分字段
|
||||
if (qzDetail && qzDetail.is_local && columns_apply[2].title !== "职务") {
|
||||
// 职务、JXJXJX、课题来源
|
||||
columns_apply.splice(2, 0, {
|
||||
title: '职务',
|
||||
dataIndex: 'org_job',
|
||||
key: 'org_job',
|
||||
},
|
||||
{
|
||||
title: Base64.decode('5Yab6KGU'),
|
||||
dataIndex: 'org_rank',
|
||||
key: 'org_rank',
|
||||
});
|
||||
columns_apply.splice(7, 0,
|
||||
{
|
||||
title: '课题来源',
|
||||
dataIndex: 'subject_source_type',
|
||||
render: (text, record) => {
|
||||
return text === 0 ? "自主提报" : record.subject_source_name || '--';
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const expandRow = (record) => {
|
||||
return <div className="expandRowManage">
|
||||
<div className="row">
|
||||
<div className="index">序号</div>
|
||||
<div>姓名</div>
|
||||
<div>单位</div>
|
||||
<div>职务</div>
|
||||
<div>军衔</div>
|
||||
</div>
|
||||
{record.members && record.members.map((item, index) => {
|
||||
return <div className="row" key={item.id}>
|
||||
<div className="index">{index + 1}</div>
|
||||
<div>{item.real_name}</div>
|
||||
<div>{item.org_name}</div>
|
||||
<div>{item.org_job}</div>
|
||||
<div>{item.org_rank}</div>
|
||||
</div>
|
||||
})}
|
||||
</div>
|
||||
}
|
||||
// 外网环境下 赛队成员无职务、JXJXJX属性
|
||||
const expandRowWai = (record) => {
|
||||
return <div className="expandRowManage expandRowLess">
|
||||
<div className="row">
|
||||
<div className="index">序号</div>
|
||||
<div>姓名</div>
|
||||
<div>单位</div>
|
||||
</div>
|
||||
{record.members && record.members.map((item, index) => {
|
||||
return <div className="row">
|
||||
<div className="index">{index + 1}</div>
|
||||
<div>{item.real_name}</div>
|
||||
<div>{item.org_name}</div>
|
||||
</div>
|
||||
})}
|
||||
</div>
|
||||
}
|
||||
|
||||
const customExpandIcon = (props) => {
|
||||
if (props.record.members && props.record.members.length > 0) {
|
||||
if (props.expanded) {
|
||||
return <a style={{ color: 'black', marginRight: 8 }} onClick={e => {
|
||||
props.onExpand(props.record, e);
|
||||
}}>查看成员<i className="iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu- font-12 ml5"></i></a>
|
||||
} else {
|
||||
return <a style={{ color: 'black', marginRight: 8 }} onClick={e => {
|
||||
props.onExpand(props.record, e);
|
||||
}}>查看成员<i className="iconfont icon-jiantou9 font-12 ml5"></i></a>
|
||||
}
|
||||
} else {
|
||||
return <span style={{ color: 'gray' }}>查看成员</span>
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="qz_management">
|
||||
|
||||
<div className="qz_manage_head">{type === "applys" ? "报名" : "作品"}列表</div>
|
||||
|
||||
<div className="search">
|
||||
<div className="font-14">
|
||||
<Search placeholder={`输入单位/姓名/电话进行搜索`} value={searchValue} onChange={(e) => { setSearchValue(e.target.value) }} onSearch={value => { setCurPage(1); setKeyword(value) }} allowClear enterButton style={{ width: 300, marginRight: "30px" }} />
|
||||
{type === "applys"&&<Fragment><span>审核状态: </span>
|
||||
<Select value={status} style={{ width: 150 }} onChange={(value) => { setCurPage(1); setStatus(value) }}>
|
||||
<Option value=''>所有状态</Option>
|
||||
<Option value='0'>已驳回</Option>
|
||||
<Option value='1'>待审核</Option>
|
||||
<Option value='2'>已通过</Option>
|
||||
</Select></Fragment>}
|
||||
</div>
|
||||
<div>
|
||||
{type === "applys" && <a href={current_main_site_url + `/api/competition_infos/${competitionId}/enroll_template.zip`}><Button className="but_2e5 ml10">导出单位证明</Button></a>}
|
||||
{type === "production" && <a href={current_main_site_url + `/api/competition_infos/${competitionId}/enroll_list.zip?upload=true`}><Button className="but_2e5 ml10">导出作品文件</Button></a>}
|
||||
<a href={current_main_site_url + `/api/competition_infos/${competitionId}/enroll_list.xlsx${type === "applys" ? '' : "?upload=true"}`}><Button className="but_2e5 ml10">导出{type === "applys" ? '报名信息' : '作品信息'}</Button></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<PaginationTable
|
||||
className="qzManageTable"
|
||||
loading={loading}
|
||||
dataSource={dataList}
|
||||
columns={type === "applys" ? columns_apply : columns_production}
|
||||
total={total}
|
||||
setCurPage={(page) => setCurPage(page)}
|
||||
current={curPage}
|
||||
expandedRowRender={qzDetail && qzDetail.is_local ? expandRow : expandRowWai}
|
||||
expandIconColumnIndex={type === "applys" ? qzDetail && qzDetail.is_local ? 7 : 4 : 20}
|
||||
expandIconAsCell={false}
|
||||
expandIcon={customExpandIcon}
|
||||
pageSize={10} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Introduce;
|
||||
Loading…
Reference in New Issue