maybe change form?

alkatorapi/views.py

@@ -190,13 +190,21 @@ def change_racer(request):
             return HttpResponse('{"reason":"Jméno je povinné!"}', status=400, content_type='application/json')
         if not request.POST['last_name']:
             return HttpResponse('{"reason":"Přijmení je povinné!"}', status=400, content_type='application/json')
+        try:
+            dat = datetime.strptime(request.POST['date_of_birth'], "%Y-%m-%d").date()
+            if dat > date(2006, 10, 5):
+                return HttpResponse('{"reason":"Je potřeba mít 18 let v den závodu!"}', status=400, content_type='application/json')
+            elif dat < date(1924, 10, 5):
+                return HttpResponse('{"reason":"Opravdu vám je 100 let?"}', status=400, content_type='application/json')
+        except:
+            return HttpResponse('{"reason":"Špatný formát datu narození!"}', status=400, content_type='application/json')
         racer = Racer.objects.get(request.POST['invoice_id'])
         racer.first_name = request.POST['first_name']
         racer.last_name = request.POST['last_name']
         racer.email = request.POST['email']
         racer.phone = request.POST['phone']
         racer.team = request.POST['team']
-        racer.date_of_birth = request.POST['date_of_birth']
+        racer.date_of_birth = dat
         racer.save()
         return HttpResponse('{"success":"Úspěšně uloženo."}', content_type='application/json')
     except MultiValueDictKeyError:

frontend/src/scripts/index.js

@@ -19,6 +19,8 @@ class Main extends Component {
             status_text: "",
             status: "",
             faq: false,
+            racer: {},
+            showRacerModalWindow: false,
             results: [],
             gallery_open: undefined,
             page: window.location.hash,
@@ -65,6 +67,12 @@ class Main extends Component {
     onHashChange(event){
         this.setState({page: window.location.hash, gallery_open: undefined})
     }
+    editRacer = (racer) => {
+        this.setState({
+            racer: racer,
+            showRacerModalWindow: true,
+        })
+    }
     onSubmit(event){
         event.preventDefault();
         let form = document.getElementById("form");
@@ -223,7 +231,7 @@ class Main extends Component {
                         <td>{racer.date_of_birth}</td>
                         <td>{racer.phone}</td>
                         <td>{racer.paid?"Zaplatil":"Nezaplatil"}</td>
-                        <td><button type="button" class="btn btn-light" onClick={(e) => {console.log("změnit :" + racer.invoice_id)}}>Změnit</button></td>
+                        <td><button type="button" class="btn btn-light" onClick={(e) => {this.editRacer(racer.invoice_id)}}>Změnit</button></td>
                     </tr>)}
 
                 </tbody>
@@ -349,8 +357,43 @@ class Main extends Component {
     }
     {this.state.page == "" &&
     <div>
-        {this.state.faq &&
+        {(this.state.faq || this.state.showRacerModalWindow) &&
             <div class="shadow"></div>}
+        {this.state.showRacerModalWindow &&
+            <div class="faq" onClick={(e) => this.setState({showRacerModalWindow: false})}>
+                <div class="container" onClick={(e) => e.stopPropagation()}>
+                    <form id="form" class="container" action="/api/register_racer" onSubmit={(e) => this.onSubmit(e)}>
+                        <h1>Registrace Závodníka</h1>
+                        <input type="hidden" name="invoice_id" value={this.state.racer.invoice_id} />
+                        <div class="mb-3">
+                            <label for="first_name" class="form-label">Jméno</label>
+                            <input type="text" class="form-control" id="first_name" name="first_name" value={this.state.racer.first_name} />
+                        </div>
+                        <div class="mb-3">
+                            <label for="last_name" class="form-label">Přijmení</label>
+                            <input type="text" class="form-control" id="last_name" name="last_name"  value={this.state.racer.last_name}/>
+                        </div>
+                        <div class="mb-3">
+                            <label for="email" class="form-label">Emailová adresa (volitelné)</label>
+                            <input type="email" class="form-control" id="email" name="email"  value={this.state.racer.email}/>
+                        </div>
+                        <div class="mb-3">
+                            <label for="date_of_birth" class="form-label">Datum narození</label>
+                            <input type="date" class="form-control" id="date_of_birth" name="date_of_birth" max={new Date().toJSON().slice(0, 10)}  value={this.state.racer.date_of_birth}/>
+                        </div>
+                        <div class="mb-3">
+                            <label for="phone" class="form-label">Telefonní číslo (volitelné)</label>
+                            <input type="text" class="form-control" id="phone" name="phone"  value={this.state.racer.phone}/>
+                        </div>
+                        <div class="mb-3">
+                            <label for="phone" class="form-label">Team (volitelné)</label>
+                            <input type="text" class="form-control" id="team" name="team"  value={this.state.racer.team}/>
+                        </div>
+                        <button type="submit" class="btn btn-primary">Registrovat a zaplatit</button>
+                    </form>
+                </div>
+            </div>
+        }
         {this.state.faq &&
             <div class="faq" onClick={(e) => this.togglefaq()}>
                 <div class="container" onClick={(e) => e.stopPropagation()}>