参赛报名

src/military/qz2022/api.js

@@ -1,21 +1,13 @@
-import fetch,{main_web_site_url} from './fetch';
+import fetch,{main_web_site_url, current_main_site_url} from './fetch';
 import { notification } from 'antd';
 
-// 专家列表查询
+// 用户参与启智2022状态
-export async function expertList(params) {
+export async function userCompetitionStatus(id) {
   let res = await fetch({
-    url: '/api/experts/',
+    url: `${current_main_site_url}/api/competition_infos/${id}/enroll_status.json`,
-    method: 'get',
+    method: 'get'
-    params,
   });
-  if (res.data) {
+  return res;
-    return res.data;
-  } else {
-    notification.open({
-      message: "提示",
-      description: res.message || '请求错误',
-    });
-  }
 }
 
 //删除专家

src/military/qz2022/apply/index.jsx

@@ -3,10 +3,13 @@ import { Input, Select, Button, Form, DatePicker, Table, Pagination, Upload, Mod
 import {competitionArea, competitionType} from '../static.js';
 import { Link } from "react-router-dom";
 import { formatDuring } from 'educoder';
+import {userCompetitionStatus} from '../api';
 import EditTable from "../editTable";
 import apply_top from "../image/apply_top.png";
 import apply_down from "../image/apply_down.png";
 import apply_one_active from "../image/apply_one_active.png";
+import apply_one from "../image/apply_one.png";
+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";
 
@@ -16,7 +19,8 @@ const Option = Select.Option;
 
 export default Form.create()(({ match, history, showNotification, form, current_user }) => {
   const { getFieldDecorator, validateFields, setFieldsValue } = form;
-  const [applyStatue, setApplyState] = useState();
+  const [applyStatue, setApplyState] = useState(undefined);
+
   // form表单公共处理函数
   const helper = useCallback(
     (label, name, rules, widget) => (
@@ -28,7 +32,12 @@ export default Form.create()(({ match, history, showNotification, form, current_
   );
 
   useEffect(() => {
-    
+    // 获取用户是否报名启智2022
+    userCompetitionStatus('qz2022').then(response=>{
+      if(response && response.message === "success"){
+        setApplyState(response.data.enroll_status);
+      }
+    })
   }, []);
 
   return (
@@ -37,20 +46,20 @@ export default Form.create()(({ match, history, showNotification, form, current_
         <span className="left_tit">&nbsp;&nbsp;报名</span>
         <img src={apply_top} className="step_icon"/>
         <div className="border_dashed"></div>
-        <img src={apply_one_active} className="step_icon"/>
+        <img src={applyStatue ? apply_one : apply_one_active} className="step_icon"/>
         <div className="border_dashed"></div>
-        <img src={apply_two} className="step_icon"/>
+        <img src={applyStatue ? apply_two_active : apply_two} className="step_icon"/>
         <div className="border_dashed"></div>
         <img src={apply_down} className="step_icon"/>
       </div>
-      <div className="apply_tip font-15">
+      {!applyStatue && <div className="apply_tip font-15">
         <img src={apply_notice} className="apply_notice"/>
         请认真核对报名信息，务必与线下报名表信息一致！
-      </div>
+      </div>}
-      <div className="apply_information mb30">
+      <div className="apply_information mb60">
-        <div className="info_head">填写报名信息</div>
+        <div className="info_head">{!applyStatue && '填写'}报名信息</div>
         {/* 报名表单 */}
-        <Form className="info_form">
+        {!applyStatue && <Form className="info_form">
           {helper('参赛单位',
             'expertName',
             [{ required: true, message: "参赛单位不能为空" },
@@ -79,14 +88,14 @@ export default Form.create()(({ match, history, showNotification, form, current_
             'expertName',
             [{ required: true, message: "军衔不能为空" }],
             <Select placeholder="请选择赛区">
-              {competitionArea.map(item=> {return <Option value={item.value}>{item.title}</Option>})}
+              {competitionArea.map(item=> {return <Option value={item.value} key={item.value}>{item.title}</Option>})}
             </Select>
           )}
           {helper('赛项',
             'expertName',
             [{ required: true, message: "军衔不能为空" }],
             <Select placeholder="请选择赛项">
-              {competitionType.map(item=> {return <Option value={item.value}>{item.title}</Option>})}
+              {competitionType.map(item=> {return <Option value={item.value} key={item.value}>{item.title}</Option>})}
             </Select>
           )}
           <div className="class_from">
@@ -108,8 +117,28 @@ export default Form.create()(({ match, history, showNotification, form, current_
             {/*  */}
             <EditTable/>
           </div>
-        </Form>
+        </Form>}
+        {/* 已报名，报名信息 */}
+        {applyStatue && <div className="info">
+          <div><span>参赛单位 : </span></div>  
+          <div className="info-right"><span>参赛团队负责人姓名 : </span></div>  
+          <div><span>职务 : </span></div>  
+          <div className="info-right"><span>军衔 : </span></div>  
+          <div><span>赛区 : </span></div>  
+          <div className="info-right"><span>赛项 : </span></div>  
+          <div><span>课题来源 : </span></div>  
+          <div className="info-right"><span>成员 : </span></div>  
+          <div><span>电话 : </span></div>  
+        </div>}
       </div>
+      {!applyStatue && <div className="apply_but">
+        <Button type="primary" className="submit_info">
+          提交资料
+        </Button>
+        <Button className="add_member cancel_submit ml20">
+          取消
+        </Button>
+      </div>}
     </div>
   )
 })

src/military/qz2022/apply/index.scss

@@ -29,16 +29,16 @@
     }
 }
 .apply_information{
-    // padding: 0 0 30px 30px;
     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 0 30px;
+        padding: 8px 0 30px 30px;
         .ant-form-item{
             display: inline-block;
             width: 33%;
@@ -48,24 +48,71 @@
             display: inline;
         }
     }
+    .info{
+        border: 0.5px solid rgba(153, 153, 153, 0.3);
+        margin: 20px 70px 30px 25px;
+        div{
+            display: inline-block;
+            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-left: 40px;
+            line-height: 44px;
+        }
+        .info-right{
+            border-right: none;
+        }
+        & div:last-child{
+            border-right: none;
+            border-bottom: none;
+        }
+    }
     .apply_team{
         color: red;
         .add_member{
+            padding: 0 12px;
             margin: 10px 0 20px;
             border-radius:4px;
         }
+        .member_info{
+            padding-right: 240px;
+        }
         .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: 3px 16px;
+            padding: 12px 16px;
-            text-align: center;
+            text-align: left;
         }
         .ant-table-thead > tr > th:first-child, .ant-table-tbody > tr > td:first-child{
-            padding: 3px 16px 3px 55px;
+            padding-left: 55px;
+        }
+        .apply_delete{
+            width: 16px;
+            margin-bottom: 12px;
+            &:hover{cursor: pointer;}
         }
     }
 }
+.apply_but{
+    padding-bottom: 60px;
+    text-align: center;
+    .cancel_submit, .submit_info{
+        padding: 0 18px;
+        height: 36px;
+    }
+    .cancel_submit{
+        padding: 0 30px;
+    }
+}

src/military/qz2022/editTable/index.jsx

@@ -1,6 +1,7 @@
 import React, { useState, useCallback, useMemo, useEffect } from "react";
 import { Table, Input, Button, Popconfirm, Form } from 'antd';
 import './index.scss';
+import apply_delete from "../image/apply_delete.png";
 
 const EditableContext = React.createContext();
 
@@ -72,13 +73,12 @@ class EditableTable extends React.Component {
         title: '姓名',
         dataIndex: 'name',
         editable: true,
-        align:'left'
       },
       {
         title: '单位',
-        width: '30%',
         dataIndex: 'age',
         editable: true,
+        width: '30%',
       },
       {
         title: '职务',
@@ -93,10 +93,11 @@ class EditableTable extends React.Component {
       {
         title: '操作',
         dataIndex: 'operation',
+        width: '10%',
         render: (text, record) =>
           this.state.dataSource.length >= 1 ? (
             <Popconfirm title="确定删除此成员?" onConfirm={() => this.handleDelete(record.key)}>
-              <a>删除</a>
+              <img src={apply_delete} className="apply_delete"/>
             </Popconfirm>
           ) : null,
       },

src/military/qz2022/fetch.js

@@ -7,4 +7,5 @@ let actionUrl = settings && settings.api_urls && settings.api_urls.task ? settin
 const service = javaFetch(actionUrl);
 export const httpUrl = actionUrl;
 export const main_web_site_url = settings && settings.main_web_site_url;
+export const current_main_site_url = settings && settings.current_main_site_url;
 export default service;

src/military/qz2022/index.scss

@@ -36,7 +36,7 @@
   .qzCont{
     min-height: 35vh;
     border-radius:4px;
-    box-shadow:0px 3px 12px #ecf0ff;
+    // box-shadow:0px 3px 12px #ecf0ff;
   }
 }
 .qz_manage{