Django NBA Web开发 - Step 13 球员名单

前面球队页面的内容基本做完了，接下来准备做球员信息的页面。
中间一段时间在看爬虫，想通过做一个简单爬虫去爬取所有球员信息，以做到实时更新，后来看了一半暂时先放弃了，一个是球员的变动不会太频繁，不会像比赛信息那样日常有更新，另外一个球员总数也就这点，而且目前是做练习，没必要和实际一模一样，所以就去下载了个2019年的球员csv文件导入进数据库.

1: 创建球员模型

class Player(models.Model):

    player_id = models.AutoField('球员序号',primary_key=True)
    first_name = models.CharField('名',max_length=50)
    last_name = models.CharField('姓',max_length=50)
    position = models.CharField('位置',max_length=30)
    height = models.CharField('身高',max_length=30)
    weight = models.CharField('体重',max_length=30)
    team = models.CharField('球队',max_length=30)
    university = models.CharField('大学',max_length=50)

    def __str__(self):
        return self.first_name+' '+self.last_name

我在这里并没有设置外键，因为我在后面的views函数里直接将Team模型的队名和Player模型里面的球队字段做判断了。

2: 添加url

app_name='team'
urlpatterns=[
            ......
            path('roster/<int:team_id>',team_roster,name='team_roster'),

3: 设置views函数

def team_roster(request,team_id):
    team_name = Team.objects.get(team_id=team_id).team_english_name  
    roster = Player.objects.filter(team=team_name)
    print(team_name)
    return render(request,'team_roster.html',locals())

上面设置变量时，我已经通过team_name和roster比较是否相同来建立连接了
PS: 这一步的前提是，Team模型里的球队名和Player里面的球队名是一模一样的

我们来看一下效果图，效果还没调整，数据暂时没问题

更新球队页面链接 单个球队阵容

4: 添加球员总览页面

单个球队页面做好了，还需要加一个所有球员的总览的页面

还是先添加一下views函数

from django.core.paginator import Paginator

def all_players(request):
    players = Player.objects.all().order_by('first_name')
    paginator = Paginator(players,15)
    page = request.GET.get('page')
    pages = paginator.get_page(page)
    return render(request,'players.html',locals())

为了避免一整页显示几百个球员，我选择对球员总数进行分页显示，每页显示15个

增加一个URL

app_name='team'
urlpatterns=[
            .........
            path('all_players',all_players,name='all_players'),
]

5: 前端渲染

来将前端页面设置一下
首先是单个球队的球员页面

<div class="container">
<table>
    <tr class="container-fluid">
        <th class="col">Frist Name</th>
        <th class="col">Last Name</th>
        <th class="col">Position</th>
        <th class="col">Weight</th>
        <th class="col">Height</th>
        <th class="col">Team</th>
        <th class="col">University</th>
    </tr>

    {% for player in roster %}
    <tr class="container-fluid">
        <td class="col">{{player.first_name}}</td>
        <td class="col">{{player.last_name}}</td>
        <td class="col">{{player.position}}</td>
        <td class="col">{{player.weight}}</td>
        <td class="col">{{player.height}}</td>
        <td class="col">{{player.team}}</td>
        <td class="col">{{player.university}}</td>
    </tr>
    {% endfor %}
</table>
</div>

之后再渲染一下所有球员的总的页面显示，带分页功能的

    <div class="container">
            {% for p in pages %}
            <ul>{{p}}</ul>
            {% endfor %}

        {% if pages.has_previous %}
            <a href="?page=1">&laquo;first</a>
            <a href="?page={{pages.previous_page_number}}">previous</a>
        {% endif %}
            <span>Page {{pages.number}}of{{pages.paginator.num_pages}}</span>
        {% if pages.has_next %}
            <a href="?page={{ pages.next_page_number }}">next</a>
            <a href="?page={{ pages.paginator.num_pages }}">last &raquo;</a>
        {% endif %}
    </div>

来看一下效果图

球员总览

球员的添加至此基本功能做完，后期再加入每个球员的头像和详细数据及其他分析等功能.