Cup matches

static/js/api/root.js

@@ -19,6 +19,16 @@ const api = {
     });
   },
 
+  getCupMatches(cupId, callback) {
+    $.get(`/logic/api/v1/cup/${cupId}/`, (data, result) => {
+      if (result === 'success') {
+        callback(data);
+      } else {
+        console.log('ERROR: fetch cup matches');
+      }
+    });
+  },
+
   createStadionTime(stadionId, params, callback) {
     let selectedTimeStart = params.selectedTimeStart.split(':');
     let selectedTimeEnd = params.selectedTimeEnd.split(':');

static/js/components/pages/cupDetail.js

@@ -0,0 +1,57 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import api from '../../api/root';
+import { Spin } from 'antd';
+
+class App extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = { loading: true, matches: [], cupId: props.cupId };
+    this.loadMatches();
+  }
+
+  loadMatches() {
+    api.getCupMatches(this.state.cupId, (data) => {
+      setTimeout(() => this.setState(prevState => Object.assign({}, prevState, { loading: false, matches: data })), 2000);
+    });
+  }
+
+  render() {
+    if (this.state.loading) {
+      return (
+        <div className="row">
+          <div className="example">
+            <Spin size="large" />
+            <h4 style={{marginTop: '50px'}}> Загружаем матчи специально для вас!</h4>
+          </div>
+        </div>
+      )
+    }
+
+    return (
+      <div className="row">
+        { this.state.matches.map((matchPair) => {
+          return (
+            <div className="row matchPairItem">
+              <div className="MatchItem">
+                <div className="TeamName">
+                  {matchPair.first_match.home.name}
+                </div>
+                <div className="TeamName">
+                  {matchPair.first_match.away.name}
+                </div>
+              </div>
+            </div>
+          )
+        }) }
+      </div>
+    )
+  }
+}
+
+export const renderCupDetail = (id) => {
+  ReactDOM.render(
+    <App cupId={id}/>,
+    document.getElementById('current_cup'),
+  );
+};

static/js/main.js

@@ -4,6 +4,7 @@ import 'antd/dist/antd.css';
 import { renderSurvey } from './survey';
 import { renderStadionForm } from './components/pages/stadionReservation';
 import { renderProfileForm } from './components/pages/profile';
+import { renderCupDetail } from './components/pages/cupDetail';
 import { renderLoginForm } from './login';
 import store from './store';
 import Alert from 'react-s-alert';
@@ -30,6 +31,11 @@ $(document).ready(() => {
   if (window.location.pathname === '/survey') renderSurvey();
   if (window.location.pathname === '/logic/stadion/get/') renderStadionForm();
   if (window.location.pathname === '/login/') renderProfileForm();
+  if (window.location.pathname.match('/logic/cup/[0-1]+/')) {
+    const id = Number(window.location.pathname.split('/')[3]);
+    renderCupDetail(id);
+  }
+
   renderLoginForm();
 });
 

teamlogic/api/serializers.py

@@ -28,3 +28,19 @@ class TimeBoardSerializer(serializers.ModelSerializer):
     class Meta:
         model = models.TimeBoard
         fields = ('id', 'date', 'stadion', 'time1', 'time2', 'match')
+
+
+class MatchSerializer(serializers.ModelSerializer):
+    home = TeamSerializer(many=False, read_only=True)
+    away = TeamSerializer(many=False, read_only=True)
+    class Meta:
+        model = models.Match
+        fields = ('id', 'home_goal', 'away_goal', 'home', 'away')
+
+
+class CupDetailSerialiser(serializers.ModelSerializer):
+    first_match = MatchSerializer(many=False, read_only=True)
+    second_match = MatchSerializer(many=False, read_only=True)
+    class Meta:
+        model = models.MatchPair
+        fields = ('id', 'first_match', 'second_match', 'next_pair', 'only_one_match')

teamlogic/api/urls.py

@@ -15,4 +15,5 @@
     url(r'^api/v1/match/(?P<id>[0-9]+)', views.set_date, name='api_set_date'),
     url(r'^api/v1/stadion/(?P<id>[0-9]+)/times', views.stadion_times, name='api_stadion_times'),
     url(r'^api/v1/stadion', views.stadions, name='api_stadion'),
+    url(r'^api/v1/cup/(?P<id>[0-9]+)', views.cup_detail, name='cup_detail'),
 ]

teamlogic/api/views.py

@@ -325,3 +325,11 @@ def stadion_times(request, id):
 
     new_time.save()
     return Response({'status': 'ok'}, status=status.HTTP_201_CREATED)
+
+
+@api_view(['GET'])
+@permission_classes((permissions.AllowAny,))
+def cup_detail(request, id):
+    entities = models.MatchPair.objects.filter(cup_id=id)
+    serializer = serializers.CupDetailSerialiser(entities, many=True)
+    return Response(serializer.data)

teamlogic/models.py

@@ -149,7 +149,7 @@ class Match(models.Model):
     """
     Simple model of match.
     """
-    league = models.ForeignKey('Tournament', default=1, null=True)
+    league = models.ForeignKey('Tournament', default=1, **NULLABLE)
     home = models.ForeignKey(Team, related_name='+')
     away = models.ForeignKey(Team, related_name='+')
     home_goal = models.IntegerField(default=0)
@@ -429,6 +429,9 @@ def get_season(self):
     def __unicode__(self):
         return unicode("%s %s" % (self.name, self.get_season()))
 
+    def __str__(self):
+        return "%s %s" % (self.name, self.get_season())
+
     def get_absolute_url(self):
         return reverse("cup", args=(self.id,))
 
@@ -463,6 +466,10 @@ def __unicode__(self):
         return unicode('%s - %s' % (self.first_match.home.name,
                                     self.first_match.away.name))
 
+    def __str__(self):
+        return '%s - %s' % (self.first_match.home.name,
+                            self.first_match.away.name)
+
     def _getWinnerByPenalty(self):
         if not (self.first_penalty == 0 and self.second_penalty == 0):
             if self.first_penalty > self.second_penalty:

templates/teamlogic/cup.html

@@ -5,7 +5,19 @@
     <li><a href="{% url 'teamlogic_main' %}"> АДФС </a> <span class="divider"></span></li>
     <li><a href="{% url 'allcups' %}"> Кубки </a> <span class="divider"></span></li>
     <li><a href="#"> {{ cup }}  </a> <span class="divider"></span></li>
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/antd/2.13.9/antd.css" rel="stylesheet">
   </ul>
-
+  <style>
+      .example {
+      text-align: center;
+      background: rgba(0,0,0,0.05);
+      border-radius: 4px;
+      margin-bottom: 20px;
+      padding: 30px 50px;
+      margin: 20px 0;
+    }
+  </style>
   <h1> {{ cup }} </h1>
+  <div id="current_cup">
+  </div>
 {% endblock %}