影视列表和详情实现

影视列表

影视列表逻辑

# index.py
@index_page.route("/")
def index():
    req = request.values
    order_by_f = str(req['order']) if ('order' in req and req['order']) else 'lastest'
    page = 1
    if 'p' in req and req['p']:
        page = int(req['p'])

    query = Movie.query

    page_params = {
        'total_count': query.count(),
        "page_size": 30,
        'page': page,
        'url': "/?"
    }

    pages = iPagenation(page_params)

    # 0 - 30,30 - 60 ,60 - 90
    offset = (page - 1) * page_params['page_size']
    limit = page * page_params['page_size']

    if order_by_f == 'hot':
        query = query.order_by(Movie.view_counter.desc(), Movie.id.desc())
    else:
        query = query.order_by(Movie.pub_date.desc(), Movie.id.desc())

    list_movie = query[offset:limit]
    return ops_render( "index.html", { "data":list_movie,"pages":pages })
# Helper.py
def iPagenation(params):
    total_count = int(params['total_count'])
    page_size = int(params['page_size'])
    page = int(params['page'])

    total_pages = math.ceil(total_count / page_size)
    total_pages = total_pages if total_pages >0 else 1

    is_prev = 0 if page <= 1 else 1
    is_next = 0 if page >= total_pages else 1

    pages = {
        'current':page,
        'total_pages':total_pages,
        'total':total_count,
        'page_size':page_size,
        'is_next':is_next,
        'is_prev':is_prev,
        'range':range(1,total_pages+1),
        'url': params['url']
    }

    return pages

影视列表前端

# index.html
{% extends "common/layout.html" %}
{% block content %}
<div class="row">
    <div class="col-lg-12">
        排序: <a href="{{ buildUrl('/?order=lastest') }}" class="btn btn-link">最新</a> <a href="{{ buildUrl('/?order=hot') }}" class="btn btn-link">热门</a>
    </div>
</div>
<div class="row" style="margin:10px 0 ;">
    {% if data %}
    {% for item in data %}
    <div class="col-md-2">
        <a  class="thumbnail" href="{{ '%s?id=%s' | format( buildUrl('/info'),item.id) }}">
            <img style="width: 100%;height:260px; " src="{{ item.cover_pic | safe }}">
            <div class="caption">
                <h3 style="overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:1;">
                    {{ item.name | safe }}</h3>
                <p>{{ item.source | safe }} | {{ item.pub_date.strftime("%Y-%m-%d") | safe }}</p>
            </div>
        </a>
    </div>
    {% endfor %}
    {% endif %}
</div>
{% include 'common/pagenation.html' %}
{% endblock %}
#pagenation.html
<div class="row">
    <div class="col-md-12">
        <span class="pagination_count" style="line-height: 84px;"> 共有{{pages.total}}条记录 | 每页{{pages.page_size}}条</span>
        <ul class="pagination pull-right">
            {% if pages.is_prev == 1 %}
            <li>
                <a href="{{ pages.url }}&p={{ pages.current - 1 }}" aria-label="Previous">
                    <span aria-hidden="true">上一页</span>
                </a>
            </li>
            {% endif %}
            {% for idx in pages.range %}
            <li {% if pages.current == idx %} class="active" {% endif %}  ><a  href="{{ pages.url }}&p={{idx}}">{{idx}}</a></li>
            {% endfor %}
            {% if pages.is_next == 1 %}
            <li>
                <a href="{{ pages.url }}&p={{pages.current + 1}}" aria-label="Next">
                    <span aria-hidden="true">下一页</span>
                </a>
            </li>
            {% endif%}
        </ul>
    </div>
</div>

详情实现

详情实现逻辑

#index.py

@index_page.route("/info")
def info():
    req = request.values
    id = int( req['id'] )  if ( 'id' in req and req['id'] ) else 0
    if id < 1 :
        return redirect( UrlManager.buildUrl("/") )

    info = Movie.query.filter_by( id = id).first()
    if not info:
        return redirect(UrlManager.buildUrl("/"))

    '''
    更新阅读数量
    '''
    info.view_counter += 1
    db.session.add( info )
    db.session.commit()
    '''
    获取推荐
    '''
    recommend_list = Movie.query.order_by( func.rand() ).limit( 4 )
    return ops_render("info.html",{ "info":info,"recommend_list":recommend_list })

详情实现前端

#info.html
{% extends "common/layout.html" %}
{% block content %}
<div class="row">
    <div class="page-header">
        <h1>{{ info.name | safe }} <a class="pull-right" href="{{buildUrl('/')}}">返回列表</a></h1>
    </div>
    <div class="row">
        <div class="col-lg-4">
            <img class="img-thumbnail" src="{{ info.cover_pic | safe }}">
        </div>
        <div class="col-lg-8">
            <div class="panel panel-default">
                <div class="panel-body">
                    <p>更新:{{ info.pub_date | safe }}</p>
                    <p>类型:{{ info.classify | safe }}</p>
                    <p>主演:{{ info.actor | safe }}</p>
                    <p>{{ info.desc | safe }}</p>
                    <p>下载地址:{{ info.magnet_url | safe }}</p>
                    <p>原地址:<a target="_blank" href="{{ info.url | safe }}">{{ info.url | safe }}</a></p>
                </div>

                <!-- List group -->
                <ul class="list-group">
                    <li class="list-group-item">随机推荐</li>
                    <li class="list-group-item">
                        <div class="row">
                            {% for item in recommend_list %}
                            <div class="col-lg-3">
                                <a class="thumbnail" href="{{ '%s?id=%s' | format( buildUrl('/movie/info'),item.id) }}">
                                    <img style="width: 100%;height:150px; "
                                         src="{{ item.cover_pic | safe }}">
                                    <div class="caption">
                                        <h3 style="overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:1;">
                                            {{ item.name | safe }}</h3>
                                    </div>
                                </a>
                            </div>
                            {% endfor %}
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
{% endblock %}