django-用户中心订单页面

提交订单页面place_order.html，创建订单成功后跳转到用户订单页面

{% block bottomfiles %}
    <script type="text/javascript" src="{% static 'js/jquery-1.12.4.min.js' %}"></script>
    <script type="text/javascript">
        $('#order_btn').click(function() {
            // 获取用户选择的地址id, 支付方式, 要购买的商品id字符串
            addr_id = $('input[name="addr_id"]:checked').val()  // 获取地址
            pay_method = $('input[name="pay_style"]:checked').val()  // 获取支付方式
            sku_ids = $(this).attr('sku_ids')  // 获取商品id拼接的字符串
            csrf = $('input[name="csrfmiddlewaretoken"]').val()
            // alert(addr_id+":"+pay_method+':'+sku_ids)
            // 组织参数
            params = {'addr_id':addr_id, 'pay_method':pay_method, 'sku_ids':sku_ids,
                        'csrfmiddlewaretoken':csrf}
            // 发起ajax post请求，访问/order/commit, 传递的参数: addr_id pay_method, sku_ids
            $.post('/order/commit', params, function (data) {
                if (data.res == 5){
                    // 创建成功
                    //alert('创建成功')
                    localStorage.setItem('order_finish',2);

                    $('.popup_con').fadeIn('fast', function() {

                        setTimeout(function(){
                            $('.popup_con').fadeOut('fast',function(){
                                window.location.href = '/user/order/1';  //跳转到用户订单页
                            });
                        },3000)

            });
                }
                else{
                    alert(data.errmsg)
                }
            })

{#            localStorage.setItem('order_finish',2);#}
{##}
{#            $('.popup_con').fadeIn('fast', function() {#}
{##}
{#                setTimeout(function(){#}
{#                    $('.popup_con').fadeOut('fast',function(){#}
{#                        window.location.href = 'index.html';#}
{#                    });    #}
{#                },3000)#}
{##}
{#            });#}
        });
    </script>
{% endblock bottomfiles %}

用户订单得试图函数user/views.py

# 用户订单中心
# /user/order
from django.core.paginator import Paginator  # 分页
class UserOrderView(LoginRequiredMinxin, View):
    def get(self, request, page):
        '''显示用户信息页面'''
        # 获取用户信息
        user = request.user
        # 获取用户所有订单的信息
        orders = OrderInfo.objects.filter(user=user).order_by('-create_time', '-order_id')
        # 遍历每一个订单信息
        for order in orders:
            order_skus = OrderGoods.objects.filter(order_id=order.order_id)
            # 遍历订单中的商品信息
            for order_sku in order_skus:
                # 计算小计
                amount = order_sku.price * order_sku.count
                # 动态给order_skus增加小计amount 保存订单小计
                order_sku.amount = amount

            # 动态给order添加商品信息
            order.order_skus = order_skus
            # 动态给order添加支付信息
            order.status_name = OrderInfo.ORDER_STATUS[order.order_status]

        # 分页 Paginator(数据, 每页显示几条内容)
        paginator = Paginator(orders, 1)
        # 获取页码
        try:
            page = int(page)
        except Exception as e:
            page = 1
        # 获取第page页的内容
        order_page = paginator.page(page)

        # todo: 进行页码的控制，页面上最多显示5个页码
        # 1.总页数小于5页，页面上显示所有页码
        # 2.如果当前页是前3页，显示1-5页
        # 3.如果当前页是后3页，显示后5页
        # 4.其他情况，显示当前页的前2页，当前页，当前页的后2页
        num_pages = paginator.num_pages
        if num_pages < 5:
            pages = range(1, num_pages + 1)
        elif page <= 3:
            pages = range(1, 6)
        elif num_pages - page <= 2:
            pages = range(num_pages - 4, num_pages + 1)
        else:
            pages = range(page - 2, page + 3)

        # 组织上下文
        context = {'order_page': order_page,
                   'pages': pages,
                   'page': 'order'}

        return render(request, 'user_center_order.html', context)

用户订单静态页面user_center_order.html

{% extends 'layout/base_user_center.html' %}
{% load staticfiles %}
{% block right_content %}
<div class="right_content clearfix">
                <h3 class="common_title2">全部订单</h3>

                {% for order in order_page %}
                <ul class="order_list_th w978 clearfix">
                    <li class="col01">{{ order.create_time }}</li>
                    <li class="col02">订单号：{{ order.order_id }}</li>
                    <li class="col02 stress">{{ order.status_name }}</li>
                </ul>

                <table class="order_list_table w980">
                    <tbody>
                        <tr>
                            <td width="55%">
                                {% for order_sku in order.order_skus %}
                                <ul class="order_goods_list clearfix">
                                    <li class="col01"><img src="{{ order_sku.sku.image.url }}"></li>
                                    <li class="col02">{{ order_sku.sku.name }}<em>{{ order_sku.price }}/{{ order_sku.sku.unite }}</em></li>
                                    <li class="col03">{{ order_sku.count }}</li>
                                    <li class="col04">{{ order_sku.amount }}元</li>
                                </ul>
                                {% endfor %}
                            </td>
                            <td width="15%">{{ order.total_price | add:order.transit_price }}元(含运费{{ order.transit_price }}元)</td>
                            <td width="15%">{{ order.status_name }}</td>
                            <td width="15%"><a href="#" class="oper_btn">去付款</a></td>
                        </tr>
                    </tbody>
                </table>
                {% endfor %}

                <div class="pagenation">
                    {% if order_page.has_previous %} {# 查询是否有前一页 #}
                        <a href="{% url 'user:order' order_page.previous_page_number %}"><上一页</a>
                    {% endif %}
                    {% for pindex in pages %}
                        {% if pindex == order_page.number %}
                            <a href="{% url 'user:order' pindex %}" class="active">{{ pindex }}</a>
                        {% else %}
                            <a href="{% url 'user:order' pindex %}">{{ pindex }}</a>
                        {% endif %}
                    {% endfor %}
                    {% if order_page.has_next %}
                        <a href="{% url 'user:order' order_page.next_page_number %}">下一页></a>
                    {% endif %}
                </div>
        </div>
{% endblock right_content %}