BZ易风

导航

 

提交订单页面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 %}

 

posted on 2019-10-17 10:28  BZ易风  阅读(352)  评论(0编辑  收藏  举报