bug fix && add third wish && add warning when choosing time

src/components/ChooseTime.js

@@ -1,16 +1,6 @@
 import React from "react";
 import axios from "axios";
-import {
-  Button,
-  Form,
-  Spin,
-  message,
-  Checkbox,
-  Alert,
-  BackTop,
-  Layout,
-  Card,
-} from "antd";
+import {Button,Form,Spin,message,Checkbox,Alert,BackTop,Layout,Card,List,notification} from "antd";
 import "antd/dist/antd.css";
 import { confirmAlert } from "react-confirm-alert";
 import "react-confirm-alert/src/react-confirm-alert.css";
@@ -35,7 +25,7 @@ class TimePicker extends React.Component {
     const validateFieldsAndScroll = this.props.form.validateFieldsAndScroll;
     confirmAlert({
       title: "提交面试时间",
-      message: "点击 Yes 进行提交。",
+      message: "请核实无误后谨慎提交。",
       buttons: [
         {
           label: "Yes",
@@ -133,9 +123,13 @@ class TimePicker extends React.Component {
     if (result.data.status === "success") {
       result.data.data.firstWish = Wishes[result.data.data.firstWish - 1];
       result.data.data.secondWish = Wishes[result.data.data.secondWish - 1];
+      result.data.data.thirdWish = Wishes[result.data.data.thirdWish - 1];
       this.setState({
         info: result.data.data,
       });
+      if(this.state.info.times.length !== 0){
+        message.warning("你已选择过面试时间！重复提交面试时间可能导致场次排错，请谨慎重复提交！",0)
+      }
     } else {
       message.error("获取个人信息失败，请稍后重试");
       this.props.history.push("/");
@@ -305,7 +299,7 @@ class TimePicker extends React.Component {
               />
             )}
           </Form.Item>
-
+          <br></br>
           <Button
             icon="copy"
             style={{ display: "block", margin: "0 auto" }}
@@ -327,24 +321,51 @@ class TimePicker extends React.Component {
           </Spin>
         </div>
       );
-    } else {
-      return this.state.info ? (
+    } else if(this.state.info){
+      return( this.state.info.times.length !== 0 ?
+        <Alert
+          message="你已经选择过面试时间！"
+          description={
+            <div >
+              <p>重复提交面试时间可能导致场次排错，请谨慎重复提交，点击右上角关闭警告以继续</p>
+              <List
+                size="small"
+                header={<div>已选择的时间</div>}
+                bordered
+                dataSource={this.state.info.times}
+                renderItem={item => <List.Item>{item}</List.Item>}
+              />
+            </div>
+            }
+          type="warning"
+          showIcon
+          closable
+          style={{ height: "700px", textAlign: "center"}}
+          afterClose = {()=>{
+            const info = Object.assign({},this.state.info,{times: []});
+            this.setState({info:info})  
+            } 
+          }
+        />:
         <div>
-          <Card title="个人信息">
-            <Card type="inner" title="姓名">
-              <h3>{this.state.info.name}</h3>
+            <Card title="个人信息">
+              <Card type="inner" title="姓名">
+                <h3>{this.state.info.name}</h3>
+              </Card>
+              <Card type="inner" title="学号">
+                <h3>{this.state.info.id_student}</h3>
+              </Card>
+              <Card type="inner" title="第一志愿">
+                <h3>{this.state.info.firstWish}</h3>
+              </Card>
+              <Card type="inner" title="第二志愿">
+                <h3>{this.state.info.secondWish}</h3>
+              </Card>
+              <Card type="inner" title="第三志愿">
+                <h3>{this.state.info.thirdWish}</h3>
+              </Card>          
             </Card>
-            <Card type="inner" title="学号">
-              <h3>{this.state.info.id_student}</h3>
-            </Card>
-            <Card type="inner" title="第一志愿">
-              <h3>{this.state.info.firstWish}</h3>
-            </Card>
-            <Card type="inner" title="第二志愿">
-              <h3>{this.state.info.secondWish}</h3>
-            </Card>
-          </Card>
-          <p></p>
+          <br></br>
           <Button
             style={{ display: "block", margin: "0 auto" }}
             type="primary"
@@ -358,7 +379,8 @@ class TimePicker extends React.Component {
             确认个人信息
           </Button>
         </div>
-      ) : (
+      )}else{
+        return(
         <div>
           <Spin size="large" tip="Loading...">
             <Alert

src/components/Sheet.js

@@ -13,6 +13,7 @@ class NewForm extends React.Component {
   }
   loadLocalStorage = () => {
     const values = JSON.parse(localStorage.getItem("formCache") || "{}");
+    this.props.setID(values.id_student)
     this.props.form.setFieldsValue(values);
   };
   saveLocalStorage = () => {
@@ -88,6 +89,24 @@ class NewForm extends React.Component {
     });
   };
 
+   validator =  (rule, value, callback) => {
+      try{
+        const form = this.props.form
+        var firstWish = value
+        var secondWish = form.getFieldValue('secondWish')
+        var thirdWish = form.getFieldValue('thirdWish')
+        if(firstWish === undefined ||secondWish === undefined ||thirdWish === undefined){
+          throw("请完整填写三个志愿")
+        }
+        if(firstWish === secondWish||firstWish === thirdWish ||secondWish === thirdWish){
+          throw("三个志愿不能重复")
+        }
+      }catch(err){
+       callback(err)
+      }
+      callback()
+    }
+    
   render() {
     const formItemLayout = {
       labelCol: {
@@ -217,13 +236,16 @@ class NewForm extends React.Component {
           })(<Input />)}
         </Form.Item>
 
-        <Form.Item label="第一志愿（两志愿请不要重复选择）">
+        <Form.Item label="第一志愿（三个志愿请不要重复选择）">
           {getFieldDecorator("firstWish", {
             rules: [
               {
                 required: true,
                 message: "请选择第一志愿",
               },
+              {
+                validator: this.validator
+              }
             ],
           })(
             <Radio.Group name="firstWish" size="medium">
@@ -236,16 +258,47 @@ class NewForm extends React.Component {
           )}
         </Form.Item>
 
-        <Form.Item label="第二志愿（两志愿请不要重复选择）">
+        <Form.Item label="第二志愿（三个志愿请不要重复选择）">
           {getFieldDecorator("secondWish", {
             rules: [
               {
                 required: true,
-                message: "请选择第二志愿",
+                message: "请选择第二志愿"
               },
+              { validator: (rule, value, callback) => {
+                this.props.form.validateFields(['firstWish'], { force: true });
+                callback()
+                } 
+              }
             ],
           })(
-            <Radio.Group name="secondWish" size="medium">
+            <Radio.Group name="secondWish" size="medium" 
+            >
+              <Radio.Button value={1}>电脑部</Radio.Button>
+              <Radio.Button value={2}>电器部</Radio.Button>
+              <Radio.Button value={3}>文宣部</Radio.Button>
+              <Radio.Button value={4}>人资部</Radio.Button>
+              <Radio.Button value={5}>财外部</Radio.Button>
+            </Radio.Group>
+          )}
+        </Form.Item>
+
+        <Form.Item label="第三志愿（三个志愿请不要重复选择）">
+          {getFieldDecorator("thirdWish", {
+            rules: [
+              {
+                required: true,
+                message: "请选择第三志愿",
+              },
+              { validator: (rule, value, callback) => {
+                this.props.form.validateFields(['firstWish'], { force: true })
+                callback()
+                } 
+              }
+            ],
+          })(
+            <Radio.Group name="thirdWish" size="medium"            
+            > 
               <Radio.Button value={1}>电脑部</Radio.Button>
               <Radio.Button value={2}>电器部</Radio.Button>
               <Radio.Button value={3}>文宣部</Radio.Button>
@@ -293,6 +346,16 @@ class NewForm extends React.Component {
           })(<Input.TextArea autosize={{ minRows: 2, maxRows: 8 }} />)}
         </Form.Item>
 
+        <Form.Item label="简述你选择第三志愿的原因">
+          {getFieldDecorator("thirdReason", {
+            rules: [
+              {
+                required: true,
+                message: "请填入你选择志愿的原因",
+              },
+            ],
+          })(<Input.TextArea autosize={{ minRows: 2, maxRows: 8 }} />)}
+        </Form.Item>
         <Form.Item label="简单介绍一下你的特长">
           {getFieldDecorator("question1", {
             rules: [