zoukankan      html  css  js  c++  java
  • 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 %}
  • 相关阅读:
    cogs 826. Feb11] GF打dota
    cogs 133. [USACO Mar08] 牛跑步 A*k短路算法
    luogu cogs 1437. [NOIP2013]转圈游戏
    RESTful
    中间件
    回顾基础知识,类,fbv,cbv
    Vue
    ES6的一些说明
    小试牛刀2
    小试牛刀
  • 原文地址:https://www.cnblogs.com/yifengs/p/11690447.html
Copyright © 2011-2022 走看看