自学python(7):发布会管理模块的实现

一、前端页面使用Django-bootstrap3

Django-bootstrap3项目是将Bootstrap3集成到Django中,为Django的一个应用提供。好处是在Django中使用Bootstrap会变得更加方便。
Django-bootstrap3在PyPI仓库的地址:https://pypi.python.org/pypi/django-bootstrap3
安装完成后,在 .../ex_sign/settings.py 文件中添加“bootstrap3”应用。

settings.py 

# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'sign',
    'bootstrap3',
]

二、发布会管理

完成发布会管理列表与发布会名称搜索功能的开发。

  1. 发布会列表
    1.1.打开 .../sign/views.py 文件,修改 event_manage()视图函数。
from sign.models import Event, Guest # 导入Model中的Event类

......
@login_required
def event_manage(request):
    event_list = Event.objects.all() # 通过Event.objects.all()查询所有发布会对象(数据)
    username = request.session.get('user', '')
    return render(request, 'event_manage.html', {"user":username, "events":event_list}) # 通过render()方法附加在 event_manage.html 页面返回给客户端。

1.2 打开并编写 .../templaes/event_manage.html 页面。

event_manage.html 
<html>
<head>
    {% load bootstrap3 %}
    {% bootstrap_css %}
    {% bootstrap_javascript %}
    <title>Event Manage Page</title>
</head>
<body role="document">
    <!-- 导航栏 -->
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <a class="navbar-brand" href="/event_manage">Guest Manage System</a>
            </div>
            <div id="navbar" class="collapse navbar-collapse">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="#">发布会</a></li>
                    <li><a href="/guest_manage/">嘉宾</a></li>
                    <li><a href="/sign_index/">签到</a></li>
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">{{user}}</a></li>
                    <li><a href="/logout/">退出</a></li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- 发布会搜索表单 -->
    <div class="page-header" style="padding-top: 60px;">
        <div id="navbar" class="navbar-collapse collapse">
            <form class="navbar-form" method="get" action="/search_name/" />
                <div class="form-group">
                    <input name="name" type="text" placeholder="名称" class="form-control">
                </div>
                <button type="submit" class="btn btn-sucess">搜索</button>
                 {% csrf_token %}
            </form>
        </div>
    </div>

    <!-- 发布会列表 -->
    <div class="row" style="padding-top:80px;">
        <div class="col-md-6">
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>id</th>
                        <th>名称</th>
                        <th>状态</th>
                        <th>地址</th>
                        <th>时间</th>
                        <th>签到</th>
                    </tr>
                </thead>
                <tbody>
                    {% for event in events %}
                    <tr>
                        <td>{{ event.id }}</td>
                        <td>{{ event.name }}</td>
                        <td>{{ event.status }}</td>
                        <td>{{ event.address }}</td>
                        <td>{{ event.start_time }}</td>
                        <td><a href="/sign_index/{{event.id}}/" target="{{event.id}}_blank">sign</a></td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</body>
</html>

{% load bootstrap3 %}
{% bootstrap_css %}
{% bootstrap_javascript %}
加载 bootstrap3 应用、CSS和 JavaScript 文件。
{% %} 为 Django 模板语言的标记。
{{ }} 为 Django 的模板语言标签,用于定义显示变量。

Django 模板语言有Python 语言并非一样。for循环语句需要有对应的 endfor 来表示语句的结束;同样,if分支语句也需要有endif来表示语句的结束。


发布会管理页面
  1. 搜索功能


    发布会名称查询

    注:method="get"为 HTTP请求方式;action="/search_name" 搜索请求路径;name="name" 搜索输入框的 name 属性值。通过GET方法接收搜索关键字,并通过模糊查询,匹配发布会name字段,然后把匹配到的发布会列表返回给客户端。

三、嘉宾管理

  1. 嘉宾列表
guest_manage.html
<html>
<head>
    {% load bootstrap3 %}
    {% bootstrap_css %}
    {% bootstrap_javascript %}
    <title>Guest Manage Page</title>
</head>
<body role="document">
    <!-- 导航栏 -->
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <a class="navbar-brand" href="/guest_manage">Guest Manage System</a>
            </div>
            <div id="navbar" class="collapse navbar-collapse">
                <ul class="nav navbar-nav">
                    <li><a href="/event_manage/">发布会</a></li>
                    <li class="active"><a href="#">嘉宾</a></li>
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">{{user}}</a></li>
                    <li><a href="/logout/">退出</a></li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- 嘉宾搜索表单 -->
    <div class="page-header" style="padding-top: 60px;">
        <div id="navbar" class="navbar-collapse collapse">
            <form class="navbar-form" method="get" action="/search_guest_name/" />
                <div class="form-group">
                    <input name="realname" type="text" placeholder="名称" class="form-control">
                </div>
                <button type="submit" class="btn btn-sucess">搜索</button>
            </form>
        </div>
    </div>

    <!-- 嘉宾列表 -->
    <div class="row" style="padding-top:80px;">
        <div class="col-md-6">
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>id</th>
                        <th>名称</th>
                        <th>手机</th>
                        <th>Email</th>
                        <th>签到</th>
                        <th>发布会</th>
                    </tr>
                </thead>
                <tbody>
                    {% for guest in guests %}
                    <tr>
                        <td>{{ guest.id }}</td>
                        <td>{{ guest.realname }}</td>
                        <td>{{ guest.phone }}</td>
                        <td>{{ guest.email }}</td>
                        <td>{{ guest.sign }}</td>
                        <td>{{ guest.event }}</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>

    <!-- 列表分页器 -->
    <div class="pagination">
        <span class="step-links">
            {% if guests.has_previous %}
                <a href="?page={{guests.previous_page_number}}">上一页</a>
            {% endif %}
                <span class="current">
                    Page {{guests.number}} of {{guests.paginator.num_pages}}
                </span>
            {% if guests.has_next %}
                <a href="?page={{guests.next_page_number}}">下一页</a>
            {% endif %}
        </span>
    </div>
</body>
</html>

urls.py
    url(r'^guest_manage/$', views.guest_manage),

  1. 分页功能


    嘉宾管理分页功能
views.py

@login_required
def guest_manage(request):
    username=request.session.get('user', '')
    guest_list=Guest.objects.all()
    paginator=Paginator(guest_list, 2)
    page = request.GET.get('page')
    try:
        contacts = paginator.page(page)
    except PageNotAnInteger:
        # 如果page不是整数, 取第一页面数据
        contacts = paginator.page(1)
    except EmptyPage:
        # 如果page不在范围, 取最后一页
        contacts = paginator.page(paginator,num_pages)
    return render(request, "guest_manage.html", {"user":username, "guests": contacts})

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。