ccks改造

src/App.js

@@ -71,7 +71,7 @@ const Expert = Loadable({
 })
 // 启智2022 （为此竞赛定制化页面以及内容）
 const Competition = Loadable({
-	loader: () => import('./military/qz2022'),
+	loader: () => import('./military/competition'),
 	loading: Loading,
 })
 //403页面

src/managements/competition/editTable/index.jsx

@@ -4,7 +4,7 @@ import { Base64 } from 'js-base64';
 import AddMember from '../../../forge/Component/AddMember';
 
 import './index.scss';
-import apply_delete from "../../../military/qz2022/image/apply_delete.png";
+import apply_delete from "../../../military/competition/image/apply_delete.png";
 import axios from "axios";
 import { getImageUrl } from "educoder";
 const { Option } = AutoComplete;

src/military/competition.js

@@ -7,62 +7,62 @@ import { TPMIndexHOC } from "../modules/tpm/TPMIndexHOC";
 import Loadable from "react-loadable";
 import Loading from "../Loading";
 import { ImageLayerOfCommentHOC } from "../modules/page/layers/ImageLayerOfCommentHOC";
-import './qz2022/index.scss';
+import './competition/index.scss';
 import { Menu, Popover, Spin } from "antd";
-import InfoModal from './qz2022/components/infoModal';
-import banner from './qz2022/image/banner.jpg';
-import banner_local from './qz2022/image/banner_local.jpg';
-import logo from './qz2022/image/logo.png';
-import { getQz2022, userCompetitionStatus } from "./qz2022/api";
-import { paths } from "./qz2022/static";
+import InfoModal from './competition/components/infoModal';
+import banner from './competition/image/banner.jpg';
+import banner_local from './competition/image/banner_local.jpg';
+import logo from './competition/image/logo.png';
+import { getQz2022, userCompetitionStatus } from "./competition/api";
+// import { paths } from "./competition/static";
 import Login from './components/login';
 
 const Introduce = Loadable({
-  loader: () => import('./qz2022/introduce'),
+  loader: () => import('./competition/introduce'),
   loading: Loading,
 })
 const ManageEdit = Loadable({
-  loader: () => import('./qz2022/components/manageEdit'),
+  loader: () => import('./competition/components/manageEdit'),
   loading: Loading,
 })
 const Fingerpost = Loadable({
-  loader: () => import('./qz2022/fingerpost'),
+  loader: () => import('./competition/fingerpost'),
   loading: Loading,
 })
 const Notice = Loadable({
-  loader: () => import('./qz2022/notice'),
+  loader: () => import('./competition/notice'),
   loading: Loading,
 })
 const NoticeDetail = Loadable({
-  loader: () => import('./qz2022/notice/detail.jsx'),
+  loader: () => import('./competition/notice/detail.jsx'),
   loading: Loading,
 })
 const NoticeEdit = Loadable({
-  loader: () => import('./qz2022/notice/addNotice.jsx'),
+  loader: () => import('./competition/notice/addNotice.jsx'),
   loading: Loading,
 })
 const Apply = Loadable({
-  loader: () => import('./qz2022/apply'),
+  loader: () => import('./competition/apply'),
   loading: Loading,
 })
 const Refer = Loadable({
-  loader: () => import('./qz2022/refer'),
+  loader: () => import('./competition/refer'),
   loading: Loading,
 })
 const Chat = Loadable({
-  loader: () => import('./qz2022/chat'),
+  loader: () => import('./competition/chat'),
   loading: Loading,
 });
 const Contact = Loadable({
-  loader: () => import('./qz2022/contact'),
+  loader: () => import('./competition/contact'),
   loading: Loading,
 });
 const Statistics = Loadable({
-  loader: () => import('./qz2022/statistics'),
+  loader: () => import('./competition/statistics'),
   loading: Loading,
 })
 const Management = Loadable({
-  loader: () => import('./qz2022/management'),
+  loader: () => import('./competition/management'),
   loading: Loading,
 })
 
@@ -106,7 +106,7 @@ const Qz2022 = (props) => {
 
 
   function scrollListener() {
-    let qz2022Top = document.querySelector('.qz2022').offsetTop;
+    let qz2022Top = document.querySelector('.competition').offsetTop;
     let top = document.documentElement.scrollTop;
     if (!fixedTop && top > qz2022Top - 20) {
       setFixedTop('fixed-top');
@@ -149,6 +149,8 @@ const Qz2022 = (props) => {
       props.showNotification("您还未报名竞赛!");
     } else if (enrollStatus && enrollStatus.status === 0) {
       props.showNotification("报名信息被管理员驳回!");
+    } else if (competitionId=='ccks'&& enrollStatus && enrollStatus.status === 1) {
+      props.showNotification("您的报名信息未通过审核!");
     } else {
       !referStatus ? props.showNotification(!referEnd ? `竞赛尚未开始提交作品，提交作品开始时间为:${qzDetail && qzDetail.enroll_date.substring(0, 10)}` : "比赛已结束") : "";
     }
@@ -163,18 +165,21 @@ const Qz2022 = (props) => {
       {/* banner图+选项 */}
       <img src={banner_url || (is_local ? banner_local : banner)} className="qz_banner" alt="" />
       {pathname.indexOf("qz2022") && <InfoModal />}
-      <div className="qz2022">
-        <div className={`qz2022-top ${fixedTop}`}>
-          {paths.indexOf(active) !== -1 && <ul className="qz2022Menu mt20 qz_main">
+      <div className="competition">
+        <div className={`competition-top ${fixedTop}`}>
+          {/* {paths.indexOf(active) !== -1 && */}
+          <ul className="qz2022Menu mt20 qz_main">
             <li>
               <a href="/"><img src={logo} alt="" style={{ width: 120 }} /></a>
             </li>
-            <li className={active === competitionId || active === "introduce" ? "active" : ""}>
+            {competitionId === 'qz2022' && <li className={active === competitionId || active === "introduce" ? "active" : ""}>
               <Link to={{ pathname: `/competition/${competitionId}/introduce` }}>首页</Link>
-            </li>
-            <li className={active === "fingerpost" ? "active" : ""}>
+            </li>}
+            {competitionId === 'qz2022' ? <li className={active === "fingerpost" ? "active" : ""} >
               <Link to={{ pathname: `/competition/${competitionId}/fingerpost` }}>赛事指南</Link>
-            </li>
+            </li> : <li className={active === competitionId || active === "fingerpost" ? "active" : ""} >
+              <Link to={{ pathname: `/competition/${competitionId}/fingerpost` }}>大赛简介</Link>
+            </li>}
             <li className={active === "notice" ? "active" : ""}>
               <Link to={{ pathname: `/competition/${competitionId}/notice` }}>通知公告</Link>
             </li>
@@ -182,18 +187,16 @@ const Qz2022 = (props) => {
             <li className={active === "apply" ? "active" : ""}>
               <Link to={{ pathname: applyStatus && current_user && current_user.login ? `/competition/${competitionId}/apply` : '' }} onClick={() => { current_user && current_user.login ? !applyStatus && props.showNotification("报名时间已截止") : props.showLoginDialog() }}>参赛报名</Link>
             </li>
-            <li className={active === "refer" ? "active" : ""}>
+            {competitionId === 'qz2022' ? <li className={active === "refer" ? "active" : ""}>
               <Link to={{ pathname: referStatus && !referEnd && current_user && current_user.login && enrollStatus && enrollStatus.enroll_status ? `/competition/${competitionId}/refer` : '' }} onClick={goToRefer}>提案提交</Link>
-            </li>
-            {/* <li className={active === "apply" ? "active" : ""}>
-            <Link to={{ pathname: `/competition/${competitionId}/apply`}}>参赛报名</Link>
-          </li> */}
-            {/* <li className={active === "refer" ? "active" : ""}>
-            <Link to={{ pathname: `/competition/${competitionId}/refer`}}>提案提交</Link>
-          </li> */}
-            <li className={active === "statistics" ? "active" : ""}>
+            </li> :
+              <li className={active === "refer" ? "active" : ""}>
+                <Link to={{ pathname: referStatus && !referEnd && current_user && current_user.login && enrollStatus && enrollStatus.status==2 ? `/competition/${competitionId}/refer` : '' }} onClick={goToRefer}>提案提交</Link>
+              </li>}
+
+            {competitionId === 'qz2022' && <li className={active === "statistics" ? "active" : ""}>
               <Link to={{ pathname: `/competition/${competitionId}/statistics` }}>数据统计</Link>
-            </li>
+            </li>}
             <li className={active === "chat" ? "active" : ""}>
               <Link to={{ pathname: `/competition/${competitionId}/chat` }}>交流互动</Link>
             </li>
@@ -205,8 +208,11 @@ const Qz2022 = (props) => {
                 <a>后台管理</a>
               </Popover>
             </li>}
-          </ul>}
-          {paths.indexOf(active) !== -1 && <div className="menu_border mt20 qz_main"></div>}
+          </ul>
+          {/* } */}
+          {/* {paths.indexOf(active) !== -1 &&  */}
+          <div className="menu_border mt20 qz_main"></div>
+          {/* } */}
         </div>
         <Spin spinning={false} wrapperClassName="spinstyle qzCont" tip="正在同步镜像" size="large">
           <Switch {...props}>
@@ -297,7 +303,7 @@ const Qz2022 = (props) => {
             {/* 大赛介绍 */}
             <Route path="/competition/:competitionId"
               render={
-                () => (<Introduce {...props} qzDetail={qzDetail} />)
+                () => (competitionId=='qz2022'? <Introduce {...props} qzDetail={qzDetail} /> :<Fingerpost {...props} qzDetail={qzDetail} />)
               }
             ></Route>
           </Switch>

src/military/competition/api.js

@@ -71,11 +71,11 @@ export async function updateQz2022(data,competitionId){
 }
 
 // 修改竞赛报名状态
-export async function updateEnroll(data){
-  return axios.post(`/competition_infos/qz2022/enroll_status_update.json`,data);
+export async function updateEnroll(data,competitionId){
+  return axios.post(`/competition_infos/${competitionId}/enroll_status_update.json`,data);
 }
 
 // 报名表扫描件上传
-export async function updateTemplate(data){
-  return axios.post(`/competition_infos/qz2022/upload_enroll_template.json`,data);
+export async function updateTemplate(data,competitionId){
+  return axios.post(`/competition_infos/${competitionId}/upload_enroll_template.json`,data);
 }

src/military/competition/apply/ccks.jsx

@@ -0,0 +1,462 @@
+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_notice from "../image/apply_notice.png";
+import apply_input from "../image/apply_input.svg";
+import apply_success from "../image/apply_success.svg";
+import apply_check from "../image/apply_check.svg";
+
+
+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 [loading, setLoading] = useState(false);
+  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) {
+      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) => (
+      <Form.Item label={label} extra={extra}>
+        {getFieldDecorator(name, { rules, validateFirst: true })(widget)}
+      </Form.Item>
+    ),
+    []
+  );
+
+  // 当用户输入结束时 检验用户输入是否符合规范
+  function verify(dataIndex) {
+    validateFields([dataIndex], (error, values) => {
+      if (error && error[dataIndex]) {
+        return;
+      }
+    });
+  }
+
+  // 检查用户填写信息
+  function checkInfo() {
+    setErrorMessage(undefined);
+    // 检查用户输入的成员属性是否完全
+    if (members.length > 0) {
+      let all = 0;
+      const len = qzDetail && qzDetail.is_local ? 5 : 3;
+      // 用户输入的长度是否满足要求
+      let sizes = 0;
+      members.map((item) => {
+        const valuesLen = Object.values(item);
+        const nullMap = valuesLen.filter((i) => {
+          return i.length === 0;
+        }).length;
+        if (
+          nullMap === valuesLen.length - 1 ||
+          (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].response.id,
+        };
+        // 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 errorSource(rule, value, callback) {
+    if (sourceBy === 1 && !value) {
+      // 计划支持 必须输入课题名称
+      callback("请正确输入项目名称");
+    } else {
+      callback();
+    }
+  }
+
+  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;
+    if (!isLt100M) {
+      message.error("文件大小必须小于10MB");
+    }
+    return isLt100M;
+  }
+
+
+  return (
+    <div className="qz_main ccks">
+      <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.status === 2 && <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、请上传加盖单位公章照片证明，图片名称命名为“CCKS2022图谱构建技术评测_参赛队名称_报名”
+                    2、文件大小必须小于10MB
+                  </div>
+                </Upload>
+              )}
+
+              <div className="edit_table">
+                <p className="mt10">成员 : </p>
+                <p className="error_message">{errorMessage}</p>
+                {qzDetail && (
+                  <EditTable
+                    members={
+                      enrollStatus && enrollStatus.enroll_status
+                        ? enrollStatus.enroll_info.members
+                        : [{ key: "0" }]
+                    }
+                    setMembers={setMembers}
+                    isLocal={qzDetail.is_local}
+                  />
+                )}
+              </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>
+
+              </div>
+
+              {enrollStatus && enrollStatus.enroll_info.status == 2 && <div className="download_box">
+                <a href={
+                  current_main_site_url +
+                  (qzDetail && qzDetail.enroll_template)
+                }
+                >
+                  <Button className=" download ml20">
+                    <Icon type='download' /> 下载数据集：
+                    <span className="btn_text">{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>
+  );
+});

src/military/competition/apply/index.jsx

@@ -0,0 +1,14 @@
+import React, {useState, useCallback} from "react";
+import Qz2022 from './qz2022';
+import Ccks from './ccks';
+import './index.scss';
+import '../index.scss';
+
+export default (props)=>{
+  const {match} = props;
+  const { competitionId } = match.params;
+  
+  return(
+    competitionId=="qz2022"? <Qz2022 {...props} />:<Ccks {...props} />
+  )
+}

src/military/competition/apply/index.scss

@@ -0,0 +1,332 @@
+.step {
+  display: flex;
+  align-items: center;
+  margin: 30px 0 40px;
+  .left_tit {
+    height: 20px;
+    line-height: 19px;
+    margin-right: 120px;
+    border-left: 4px solid #2e5bfe;
+  }
+  .step_icon {
+    width: 34px;
+  }
+  .border_dashed {
+    width: 225px;
+    margin: 0 12px;
+    border-bottom: 1px dashed #bac1c9;
+  }
+  .img_span {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-top: 25px;
+  }
+}
+.apply_tip {
+  background-color: #fff5eb;
+  border: 1px solid #ffa13a;
+  padding: 10px 0 10px 20px;
+  color: #ffa13a;
+  margin-bottom: 20px;
+  .apply_notice {
+    width: 16px;
+    margin-right: 10px;
+  }
+}
+.apply_information {
+  background-color: #ffffff;
+  border-radius: 4px;
+  box-shadow: 0px 3px 12px #ecf0ff;
+  padding-bottom: 1px;
+  .info_head {
+    border-bottom: 1px solid #eee;
+    padding: 12px 30px;
+  }
+  .info_form {
+    padding: 8px 0 30px 30px;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    .ant-form-item {
+      display: inline-block;
+      width: 38%;
+      margin-right: 100px;
+      margin-bottom: 0px;
+      .ant-input:hover {
+        border-color: #2e5bfe;
+      }
+    }
+    .class_from {
+      position: relative;
+      display: inline-block;
+      width: 46.5%;
+    }
+    .class_from .ant-form-item {
+      width: 71%;
+    }
+    .class_from > .ant-radio-group {
+      position: absolute;
+      left: 36%;
+      top: 10px;
+    }
+    .class_from > span {
+      position: absolute;
+      left: 0%;
+      top: 10px;
+    }
+    .class_from .ant-form-item-children {
+      top: 38px;
+    }
+    .class_from .ant-form-explain {
+      position: absolute;
+      top: 78px;
+    }
+  }
+  .info {
+    border: 0.5px solid rgba(153, 153, 153, 0.3);
+    margin: 20px 70px 30px 25px;
+    div {
+      display: inline-block;
+      width: 50%;
+      border-right: 1px solid rgba(153, 153, 153, 0.3);
+      border-bottom: 1px solid rgba(153, 153, 153, 0.3);
+      height: 44px;
+      padding: 0 10px 0 40px;
+      line-height: 44px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+    .ellipsis_div {
+      width: 100%;
+    }
+    .info_bottom {
+      border-bottom: none;
+    }
+    .info-right {
+      border-right: none;
+    }
+    & div:last-child {
+      border-right: none;
+      border-bottom: none;
+    }
+  }
+  .action_box {
+    padding-left: 2rem;
+    display: flex;
+    .tips {
+      font-size: 14px;
+      color: gray;
+    }
+    .text_red {
+      color: red;
+    }
+    .download {
+      color: #2e5bfe;
+      &:hover {
+        color: #2e5bfe;
+        opacity: 0.85;
+      }
+    }
+    .uploadBox {
+      border: 1px solid rgba(153, 153, 153, 0.3);
+      margin-left: 15px;
+      padding: 12px;
+      width: 51vw;
+      border-radius: 4px;
+      .ant-upload-list-item-name {
+        color: #2e5bfe;
+      }
+    }
+  }
+  .upload_box {
+    display: flex;
+    margin-top: 20px;
+    padding: 0;
+  }
+  .submit {
+    margin: 1rem 0 2rem 9rem !important;
+    padding: 0 25px;
+  }
+  .edit_table {
+    width: 100%;
+  }
+  .apply_team {
+    color: red;
+    .add_member {
+      padding: 0 12px;
+      margin: 10px 0 20px;
+      border-radius: 4px;
+    }
+    .member_info {
+      padding-right: 160px;
+    }
+    .member_info .ant-table {
+      margin-top: 20px;
+      .ant-form-item {
+        width: 76%;
+        margin: 0 0 10px 0;
+        position: relative;
+      }
+      .ant-form-item .has-error .ant-form-explain {
+        font-size: 12px;
+        position: absolute;
+      }
+    }
+    .ant-table-thead > tr > th,
+    .ant-table-tbody > tr > td {
+      padding: 12px 16px;
+      text-align: left;
+    }
+    .ant-table-thead > tr > th:first-child,
+    .ant-table-tbody > tr > td:first-child {
+      padding-left: 55px;
+    }
+    .apply_delete {
+      width: 16px;
+      margin-bottom: 12px;
+      &:hover {
+        cursor: pointer;
+      }
+    }
+  }
+  .error_message {
+    color: #f5222d;
+  }
+}
+.apply_but {
+  padding-bottom: 60px;
+  text-align: center;
+  .download,
+  .submit_info {
+    padding: 0 18px;
+    height: 36px;
+  }
+  .download {
+    padding: 0 10px;
+  }
+}
+.applyInfoCon .ant-modal-content {
+  .ant-modal-header {
+    padding: 10px 24px;
+    background-color: #eef1ff;
+    border-bottom: none;
+  }
+  .ant-modal-close {
+    top: 1px !important;
+  }
+  .ant-modal-close-x {
+    font-size: 20px;
+  }
+  .ant-modal-title {
+    font-weight: normal !important;
+    text-align: left;
+  }
+  .ant-modal-body {
+    padding: 50px 50px 40px;
+    text-align: center;
+    .tipTitle {
+      color: #181818;
+    }
+  }
+  .tips {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .ant-modal-footer {
+    border-top: none;
+    text-align: center;
+    padding-bottom: 40px;
+  }
+}
+
+.step_circle {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 34px;
+  height: 34px;
+  border-radius: 50%;
+  border: 1px solid #bbb;
+
+  .step_circle_small {
+    width: 24px;
+    height: 24px;
+    border-radius: 50%;
+    background-color: #bbb;
+    color: #fff;
+    text-align: center;
+    line-height: 25px;
+    font-size: 12px;
+    transform: scale(0.7);
+  }
+
+  &.active {
+    border-color: #4154f1;
+    .step_circle_small {
+      background-color: #4154f1;
+    }
+  }
+}
+
+.ccks {
+  .step {
+    justify-content: center;
+  }
+  .step .border_dashed {
+    width: 150px;
+  }
+ 
+  .step .active {
+    font-weight: 700;
+    color: #2e5bfe;
+  }
+  .apply_information .info {
+    border: 0;
+  }
+  .apply_information .info div {
+    border: 0;
+  }
+  .download_box {
+    margin: 0 0 20px 40px;
+  }
+  .download {
+    width: 90%;
+    text-align: left;
+  }
+  .btn_text {
+    color: #2e5bfe;
+    &:hover{
+        opacity: .85;
+    }
+  }
+  .ccks_info{
+    height: 45px;
+    line-height: 42px;
+    margin-bottom: 20px;
+    padding:0 20px;
+    font-size: 15px;  
+    
+    .iconfont{
+        position: relative;
+        top:1px;
+    }
+  }
+  .info_error{
+    color:#ff3838;
+    background-color: #ffefef;
+    border: 1px solid #ff3838;
+  }
+  .info_success {
+    color: #33ab4f;
+    background-color: rgba(238, 255, 242, 0.3);
+    border: 1px solid rgba(101, 174, 118, 0.83);
+  }
+  .info_wait{
+    color:#4154f1;
+    background-color: #edf2ff;
+    border: 1px solid #4154f1;
+  }
+}

src/military/competition/apply/qz2022.jsx

@@ -1,4 +1,4 @@
-import React, {useState, useCallback} from "react";
+import React, {useState, useCallback ,useEffect} from "react";
 import { Input, Select, Button, Form, message, Radio, Modal, Upload, Icon, Tooltip } from 'antd';
 import { appendFileSizeToUploadFileAll, getUploadActionUrl } from 'educoder';
 import { Base64 } from 'js-base64';
@@ -13,8 +13,6 @@ import apply_two_active from "../image/apply_two_active.png";
 import apply_two from "../image/apply_two.png";
 import apply_notice from "../image/apply_notice.png";
 
-import './index.scss';
-import { useEffect } from "react";
 const Option = Select.Option;
 
 export default Form.create()((props) => {

src/military/competition/chat/ccks.jsx

@@ -0,0 +1,40 @@
+import React from "react";
+import chatBanner from '../image/ccks_talk.jpg';
+import chat1 from '../image/chat1.png';
+import chat2 from '../image/chat2.png';
+import chat3 from '../image/chat3.png';
+
+function Chat({ isLocal }) {
+
+  return (
+    <div className="chat-bg ">
+      <div className="chat qz_main clearfix">
+        <img className="chat-left " src={chatBanner} alt=""></img>
+        <div className="chat-words">
+          <div className="chat-tit">交流互动</div>
+          <div className="chat-content">
+            <p>集萃群智体会</p>
+            <p>与论坛成员交流比赛经验，分享参赛心得</p>
+            <p>汇聚赛事资讯</p>
+            <p>助您第一时间解读竞赛动态，把握赛事脉搏</p>
+          </div>
+        </div>
+      </div>
+      <div className="links qz_main">
+        <div onClick={() => { window.open('https://fc.osredm.com/forums/theme/111') }}>
+          <img src={chat1} alt=""></img>
+          <div>赛事咨询</div>
+        </div>
+        <div onClick={() => { window.open('https://fc.osredm.com/forums/theme/112') }}>
+          <img src={chat2} alt=""></img>
+          <div>交流互动</div>
+        </div>
+        <div onClick={() => { window.open('https://fc.osredm.com/forums/theme/113') }}>
+          <img src={chat3} alt=""></img>
+          <div>经验分享</div>
+        </div>
+      </div>
+    </div>
+  )
+}
+export default Chat;

src/military/competition/chat/index.jsx

@@ -0,0 +1,14 @@
+import React, {useState, useCallback} from "react";
+import Qz2022 from './qz2022';
+import Ccks from './ccks';
+import './index.scss';
+import '../index.scss';
+
+export default (props)=>{
+  const {match} = props;
+  const { competitionId } = match.params;
+  
+  return(
+    competitionId=="qz2022"? <Qz2022 {...props} />:<Ccks {...props} />
+  )
+}

src/military/competition/chat/index.scss

@@ -84,4 +84,5 @@
   .iconPlay1 {
     height: 100%;
   }
-}
+}
+

src/military/competition/chat/qz2022.jsx

@@ -3,8 +3,6 @@ import chatBanner from '../image/chat_banner.png';
 import chat1 from '../image/chat1.png';
 import chat2 from '../image/chat2.png';
 import chat3 from '../image/chat3.png';
-import './index.scss';
-import '../../index.scss';
 
 function Chat({ isLocal }) {
 

src/military/competition/contact/index.jsx

@@ -6,9 +6,9 @@ import { Button } from "antd";
 import './index.scss';
 import '../../index.scss';
 
-function Contact({ aboutUs, qzDetail, current_user,match }) {
+function Contact({ aboutUs, qzDetail, current_user, match }) {
   const manageEdit = (qzDetail && qzDetail.is_manager) || (current_user && current_user.admin);
-  const is_local= qzDetail &&qzDetail.is_local;
+  const is_local = qzDetail && qzDetail.is_local;
   const { competitionId } = match.params;
 
   return (
@@ -17,7 +17,7 @@ function Contact({ aboutUs, qzDetail, current_user,match }) {
         <Link to={`/competition/${competitionId}/contact/edit`}><Button><i className="iconfont icon-a-bianji11 font-13 mr5"></i>编辑</Button></Link>
       </div>}
       <div className="contact qz_main">
-          { !is_local&&<img className="contact-png" src={contactPng} alt=""></img>}
+        {!is_local && competitionId == "qz2022" && <img className="contact-png" src={contactPng} alt=""></img>}
         <div className="contact-words">
           <RenderHtml value={aboutUs} className="contact-content" />
         </div>

src/military/competition/image/apply_check.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="42" height="42" viewBox="0 0 42 42"><defs><style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:url(#b);}.d{fill:rgba(0,49,212,0.41);}.e{fill:#fff;}.f{fill:url(#c);}</style><clipPath id="a"><rect class="a" width="42" height="42" transform="translate(946 610)"/></clipPath><linearGradient id="b" x1="0.267" y1="0.065" x2="0.5" y2="1" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#2e5bfe"/><stop offset="1" stop-color="#113dd9"/></linearGradient><linearGradient id="c" x2="1" y2="1" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#fff"/><stop offset="0.61" stop-color="#2c59fb"/><stop offset="1" stop-color="#fff"/></linearGradient></defs><g class="b" transform="translate(-946 -610)"><g transform="translate(7412.5 -19618.551)"><rect class="c" width="24" height="24" rx="2" transform="translate(-6464 20232)"/><g transform="translate(49.32 -243.77)"><g transform="translate(-6507.093 20481.98)"><g transform="translate(0 0)"><path class="d" d="M21.957.32a2.972,2.972,0,0,1,2.97,2.964V15.136a9.076,9.076,0,0,0-5.445,1.8l.006-.072a.742.742,0,0,0-.744-.742H6.4a.742.742,0,1,0,0,1.484H18.682a9.128,9.128,0,0,0-2.3,3.452H6.4a.743.743,0,1,0,0,1.486h9.569a9.078,9.078,0,0,0,1.841,7.4H3.19A2.972,2.972,0,0,1,.22,26.989V9.709A1.456,1.456,0,0,1,1.706,8.226H6.632A1.454,1.454,0,0,0,8.116,6.74V1.806A1.486,1.486,0,0,1,9.6.32ZM18.746,11.185h-7.9a.742.742,0,0,0,0,1.484h7.9a.742.742,0,1,0,0-1.484ZM5.908.962c.393-.395.692-.249.692.3V5.3A1.454,1.454,0,0,1,5.114,6.788h-3.8c-.544,0-.692-.345-.347-.742Z" transform="translate(-0.22 -0.32)"/><path class="e" d="M9.6.17H21.957a3.127,3.127,0,0,1,3.12,3.113v12h-.165a8.984,8.984,0,0,0-5.34,1.773l-.092.069h0A9.911,9.911,0,0,0,17.243,20.7a11.343,11.343,0,0,0,.7,9.189l.106.216H3.19A3.128,3.128,0,0,1,.07,26.989V9.709A1.612,1.612,0,0,1,.541,8.545a1.6,1.6,0,0,1,1.168-.469H6.662a1.3,1.3,0,0,0,.923-.383,1.31,1.31,0,0,0,.381-.95V1.806A1.638,1.638,0,0,1,9.6.17ZM24.776,14.987V3.284A2.827,2.827,0,0,0,21.957.47H9.6A1.337,1.337,0,0,0,8.266,1.806V6.74A1.609,1.609,0,0,1,7.8,7.905a1.593,1.593,0,0,1-1.168.47H1.675a1.3,1.3,0,0,0-.923.382,1.312,1.312,0,0,0-.383.949V26.989A2.827,2.827,0,0,0,3.19,29.8H17.57a11.319,11.319,0,0,1,.375-11.2,9.918,9.918,0,0,1,.967-1.31,2.6,2.6,0,0,1,.482-.469A9.288,9.288,0,0,1,24.776,14.987ZM6.308.588c.1,0,.442.048.442.669V5.3A1.609,1.609,0,0,1,6.28,6.468a1.593,1.593,0,0,1-1.17.469h-3.8c-.437,0-.591-.194-.643-.31s-.1-.357.183-.681l.006-.006L5.8.858A.754.754,0,0,1,6.308.588ZM5.146,6.638a1.3,1.3,0,0,0,.922-.382,1.31,1.31,0,0,0,.382-.951V1.257c0-.184-.044-.369-.142-.369-.035,0-.132.017-.294.18L1.076,6.147C.955,6.288.9,6.421.942,6.5s.177.134.371.134H5.146Z" transform="translate(-0.219 -0.32)"/><path class="d" d="M580.264,549.268a6.839,6.839,0,1,1-6.839,6.839A6.839,6.839,0,0,1,580.264,549.268Z" transform="translate(-555.558 -532.156)"/><path class="f" d="M580.264,549.168a6.939,6.939,0,1,1-6.939,6.939A6.947,6.947,0,0,1,580.264,549.168Zm0,13.677a6.739,6.739,0,1,0-6.739-6.739A6.746,6.746,0,0,0,580.264,562.845Z" transform="translate(-555.558 -532.156)"/></g></g><g transform="translate(-6483.547 20503.99)"><rect class="e" width="1.25" height="3.5" rx="0.625" transform="translate(0)"/><rect class="e" width="1.25" height="3.75" rx="0.625" transform="translate(3.75 2.5) rotate(90)"/></g></g></g></g></svg>

src/military/competition/image/apply_input.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="42" height="42" viewBox="0 0 42 42"><defs><style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:url(#b);}.d{fill:rgba(0,49,212,0.41);}.e{fill:url(#c);}.f{fill:#fff;}</style><clipPath id="a"><rect class="a" width="42" height="42" transform="translate(725 610)"/></clipPath><linearGradient id="b" x1="0.267" y1="0.065" x2="0.5" y2="1" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#2e5bfe"/><stop offset="1" stop-color="#113dd9"/></linearGradient><linearGradient id="c" x2="1" y2="1" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#fff"/><stop offset="0.61" stop-color="#2c59fb"/><stop offset="1" stop-color="#fff"/></linearGradient></defs><g class="b" transform="translate(-725 -610)"><g transform="translate(7408.5 -19665.449)"><circle class="c" cx="13" cy="13" r="13" transform="translate(-6680 20279)"/><g transform="translate(-47.855 -130.178)"><rect class="d" width="25.089" height="27.998" rx="2" transform="translate(-6625.242 20416.734)"/><path class="e" d="M1.356.227A1.226,1.226,0,0,0,.2,1.513V26.485a1.226,1.226,0,0,0,1.153,1.286H23.733a1.226,1.226,0,0,0,1.153-1.286V1.513A1.226,1.226,0,0,0,23.733.227H1.356m0-.227H23.733a1.441,1.441,0,0,1,1.356,1.513V26.485A1.441,1.441,0,0,1,23.733,28H1.356A1.441,1.441,0,0,1,0,26.485V1.513A1.441,1.441,0,0,1,1.356,0Z" transform="translate(-6625.242 20416.734)"/><g transform="translate(-6622.852 20423.803)"><rect class="f" width="9.493" height="2.034" transform="translate(0.678 4.747)"/><rect class="f" width="18.987" height="2.034" transform="translate(0.678 8.815)"/></g><path class="f" d="M44.885,3.2c2.221,0,2.2,1.375,2.2,1.375a.2.2,0,0,1-.2.226h-4a.194.194,0,0,1-.2-.226S42.664,3.2,44.885,3.2Zm0-3.2h1.4V1.4a1.4,1.4,0,1,1-1.4-1.4Z" transform="translate(-6664.856 20421.424)"/></g></g></g></svg>

src/military/competition/image/apply_success.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="42" height="42" viewBox="0 0 42 42"><defs><style>.a,.f{fill:none;}.b{clip-path:url(#a);}.c{fill:url(#b);}.d{fill:rgba(0,49,212,0.41);}.e{fill:#fff;}.f{stroke:#fff;stroke-width:0.4px;}.g{fill:url(#c);}</style><clipPath id="a"><rect class="a" width="42" height="42" transform="translate(1162 611)"/></clipPath><linearGradient id="b" x1="0.267" y1="0.065" x2="0.5" y2="1" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#2e5bfe"/><stop offset="1" stop-color="#113dd9"/></linearGradient><linearGradient id="c" x2="1" y2="1" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#fff"/><stop offset="0.61" stop-color="#2c59fb"/><stop offset="1" stop-color="#fff"/></linearGradient></defs><g class="b" transform="translate(-1162 -611)"><g transform="translate(7651.945 -19853.734)"><rect class="c" width="24" height="24" rx="2" transform="translate(-6486.437 20467.186)"/><g transform="translate(0 -1)"><g transform="translate(1052.641 115.234)"><g transform="translate(-7532 20359.262)"><path class="d" d="M54.2,60.154a8.245,8.245,0,0,1,8.245-8.245,8.344,8.344,0,0,1,1.761.192V39.754a2.1,2.1,0,0,0-1.963-2.208H41.9a2.1,2.1,0,0,0-1.963,2.208V65.127A2.1,2.1,0,0,0,41.9,67.335H58.4a8.239,8.239,0,0,1-4.2-7.181ZM45.468,44.313H56.8a1.064,1.064,0,0,1,0,2.128H45.468a1.064,1.064,0,0,1,0-2.128Zm4.718,11.873H45.468a1.064,1.064,0,1,1,0-2.128h4.718a1.064,1.064,0,0,1,0,2.128Zm-4.718-4.873a1.064,1.064,0,1,1,0-2.128h8.25a1.064,1.064,0,1,1,0,2.128Z" transform="translate(-39.936 -37.546)"/><path class="d" d="M547.245,541.013a6.915,6.915,0,1,0,6.915,6.915A6.915,6.915,0,0,0,547.245,541.013Z" transform="translate(-524.734 -525.321)"/></g><path class="e" d="M334.78,338.531l-3.039,3.039a.761.761,0,0,1-1.15-.086l-1.649-1.649a.764.764,0,1,1,1.076-1.076l1.191,1.191,2.495-2.495a.761.761,0,0,1,1.076,1.076Z" transform="translate(-7841 20042.543)"/></g><path class="f" d="M54.2,60.154a8.245,8.245,0,0,1,8.245-8.245,8.344,8.344,0,0,1,1.761.192V39.754a2.1,2.1,0,0,0-1.963-2.208H41.9a2.1,2.1,0,0,0-1.963,2.208V65.127A2.1,2.1,0,0,0,41.9,67.335H58.4a8.239,8.239,0,0,1-4.2-7.181Z" transform="translate(-6519.295 20436.949)"/></g><path class="g" d="M547.245,540.913a6.936,6.936,0,1,1-7.015,6.936A6.984,6.984,0,0,1,547.245,540.913Zm0,13.672a6.736,6.736,0,1,0-6.815-6.736A6.784,6.784,0,0,0,547.245,554.585Z" transform="translate(-7004.093 19948.217)"/></g></g></svg>

src/military/competition/index.scss

@@ -15,9 +15,9 @@
 .qz_banner {
   width: 100%;
 }
-.qz2022 {
+.competition {
   font-size: 1rem;
-  .qz2022-top {
+  .competition-top {
     width: 100%;
 
     &.fixed-top {

src/military/competition/management/ccks.jsx

@@ -0,0 +1,290 @@
+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 { getQzEnrollList, getQzProList, 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") {
+      // 报名列表
+      getQzEnrollList(params, competitionId).then(response => {
+        if (response && response.status === 200) {
+          setTotal(response.data.count);
+          setDataList(response.data.data);
+        }
+      }).finally(() => {
+        setLoading(false);
+      })
+    } else {
+      // 提交作品列表
+      getQzProList(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',
+      },
+      {
+        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>}
+          </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: 'mail'
+      },
+      {
+        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">
+      <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">ccks{type === "applys" ? "报名" : "作品"}列表</div>
+
+      <div className="search">
+        <div className="font-14">
+          <Search placeholder={`输入单位/负责人${type === "applys" ? "/电话" : ""}进行搜索`} value={searchValue} onChange={(e) => { setSearchValue(e.target.value) }} onSearch={value => { setCurPage(1); setKeyword(value) }} allowClear enterButton style={{ width: 300, marginRight: "30px" }} />
+          <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>
+        </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;

src/military/competition/management/index.jsx

@@ -0,0 +1,14 @@
+import React, {useState, useCallback} from "react";
+import Qz2022 from './qz2022';
+import Ccks from './ccks';
+import './index.scss';
+import '../index.scss';
+
+export default (props)=>{
+  const {match} = props;
+  const { competitionId } = match.params;
+  
+  return(
+    competitionId=="qz2022"? <Qz2022 {...props} />:<Ccks {...props} />
+  )
+}

src/military/competition/management/qz2022.jsx

@@ -4,8 +4,7 @@ import {Select, Button, Tooltip, Input, Popconfirm, message } from 'antd';
 import {current_main_site_url} from '../fetch';
 import PaginationTable from "../../components/paginationTable";
 
-import './index.scss';
-import '../index.scss';
+
 import { getQzEnrollList, getQzProList, updateEnroll } from "../api.js";
 const Option = Select.Option;
 const {Search} = Input;

src/military/qz2022/apply/index.scss

@@ -1,217 +0,0 @@
-.step{
-    display: flex;
-    align-items: center;
-    margin: 30px 0 40px;
-    .left_tit{
-        height: 20px;
-        line-height: 19px;
-        margin-right: 120px;
-        border-left: 4px solid #2e5bfe;
-    }
-    .step_icon{
-        width: 34px;
-    }
-    .border_dashed{
-        width: 225px;
-        margin: 0 12px;
-        border-bottom: 1px dashed #bac1c9;
-    }
-    .img_span{
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        margin-top: 25px;
-    }
-}
-.apply_tip{
-    background-color:#fff5eb;
-    border:1px solid #ffa13a;
-    padding: 10px 0 10px 20px;
-    color:#ffa13a;
-    margin-bottom: 20px;
-    .apply_notice{
-        width: 16px;
-        margin-right: 10px;
-    }
-}
-.apply_information{
-    background-color:#ffffff;
-    border-radius:4px;
-    box-shadow:0px 3px 12px #ecf0ff;
-    padding-bottom: 1px;
-    .info_head{
-        border-bottom: 1px solid #eee;
-        padding: 12px 30px;
-    }
-    .info_form{
-        padding: 8px 0 30px 30px;
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-between;
-        .ant-form-item{
-            display: inline-block;
-            width: 38%;
-            margin-right: 100px;
-            margin-bottom: 0px;
-            .ant-input:hover{border-color:#2e5bfe;}
-        }
-        .class_from{
-            position: relative;
-            display: inline-block;
-            width: 46.5%;
-        }
-        .class_from .ant-form-item{
-            width: 71%;
-        }
-        .class_from>.ant-radio-group{
-            position: absolute;
-            left: 36%;
-            top: 10px;
-        }
-        .class_from>span{
-            position: absolute;
-            left: 0%;
-            top: 10px;
-        }
-        .class_from .ant-form-item-children{
-            top: 38px;
-        }
-        .class_from .ant-form-explain{
-            position: absolute;
-            top: 78px;
-        }
-    }
-    .info{
-        border: 0.5px solid rgba(153, 153, 153, 0.3);
-        margin: 20px 70px 30px 25px;
-        div{
-            display: inline-block;
-            width: 50%;
-            border-right: 1px solid rgba(153, 153, 153, 0.3);
-            border-bottom: 1px solid rgba(153, 153, 153, 0.3);
-            height: 44px;
-            padding: 0 10px 0 40px;
-            line-height: 44px;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-        }
-        .ellipsis_div{width: 100%;}
-        .info_bottom{border-bottom: none;}
-        .info-right{border-right: none;}
-        & div:last-child{
-            border-right: none;
-            border-bottom: none;
-        }
-    }
-    .action_box{
-        padding-left: 2rem;
-        display: flex;
-        .tips{
-            font-size: 14px;
-            color: gray;
-        }
-        .text_red{
-            color: red;
-        }
-        .download{
-            color: #2e5bfe;
-            &:hover{
-                color: #2e5bfe;
-                opacity: 0.85;
-            }
-        }
-        .uploadBox{
-            border: 1px solid rgba(153, 153, 153, 0.3);
-            margin-left: 15px;
-            padding: 12px;
-            width: 51vw;
-            border-radius: 4px;
-            .ant-upload-list-item-name{color: #2e5bfe;}
-        }
-    }
-    .submit{
-        margin: 1rem 0 2rem 9rem !important;
-        padding: 0 25px;
-    }
-    .edit_table{
-        width: 100%;
-    }
-    .apply_team{
-        color: red;
-        .add_member{
-            padding: 0 12px;
-            margin: 10px 0 20px;
-            border-radius:4px;
-        }
-        .member_info{
-            padding-right: 160px;
-        }
-        .member_info .ant-table{
-            margin-top: 20px;
-            .ant-form-item{
-                width: 76%;
-                margin: 0 0 10px 0;
-                position: relative;
-            }
-            .ant-form-item .has-error .ant-form-explain{
-                font-size: 12px;
-                position: absolute;
-            }
-        }
-        .ant-table-thead > tr > th, .ant-table-tbody > tr > td{
-            padding: 12px 16px;
-            text-align: left;
-        }
-        .ant-table-thead > tr > th:first-child, .ant-table-tbody > tr > td:first-child{
-            padding-left: 55px;
-        }
-        .apply_delete{
-            width: 16px;
-            margin-bottom: 12px;
-            &:hover{cursor: pointer;}
-        }
-    }
-    .error_message{
-        color: #f5222d;
-    }
-}
-.apply_but{
-    padding-bottom: 60px;
-    text-align: center;
-    .download, .submit_info{
-        padding: 0 18px;
-        height: 36px;
-    }
-    .download{
-        padding: 0 10px;
-    }
-}
-.applyInfoCon .ant-modal-content{
-    .ant-modal-header{
-        padding: 10px 24px;
-        background-color: #eef1ff;
-        border-bottom:none;
-    }
-    .ant-modal-close{top: 1px !important;}
-    .ant-modal-close-x{font-size: 20px;}
-    .ant-modal-title{
-        font-weight: normal !important;
-        text-align: left;
-    }
-    .ant-modal-body{
-        padding: 50px 50px 40px;;
-        text-align: center;
-        .tipTitle{color: #181818;}
-    }
-    .tips{
-        display: flex;
-        justify-content: center;
-        align-items: center;
-    }
-    .ant-modal-footer{
-        border-top: none;
-        text-align: center;
-        padding-bottom: 40px;
-    }
-}