Django 16 shopping mall project (pending payment orders showed that after the payment order status)

1, pending order list

Click to be paid to jump to the pending order list and display

1.1, click to jump (js click event)

Click mine page to be paid , jump to the pending order list page

1.2 jump url (routing, middleware)

Page list of pending order routing, middleware

1.3, data transfer (View)

List of payment orders to be delivered

# mine页面待付款 到 订单列表
def order_not_pay(request):
    orders=Order.objects.filter(O_user=request.user)
    data={
        'title': "订单列表",
        'orders': orders,
    }
    return render(request,'order/order_not_pay.html',context=data)

1.4, show (pending order list page html)

Displayed pending order list

{% extends "bese_order.html" %}
{% load static %}

{% block ext_css %}
    {{ block.super }}
    {#    <link rel="stylesheet" href="{% static 'axf/order/css/order_not_pay.css' %}">#}
{% endblock %}
{% block ext_js %}
    {{ block.super }}
        <script type="text/javascript" src="{% static 'axf/order/js/order_not_pay.js' %}"></script>
{% endblock %}

{% block content %}
    <div id="order_not_pay" class="container">
        <ol>{% for order in orders %}
            <li>
                <ul class="order" orderid="{{ order.id }}">
                    <h6>订单编号：{{ order.id }}</h6>
                    {% for ordergoods in order.ordergoods_set.all %}
                        <li>
                            <img src="{{ ordergoods.O_goods.productimg }}"
                                 alt="{{ ordergoods.O_goods.productlongname }}">
                        </li>
                    {% endfor %}
                </ul>
            </li>
        {% endfor %}</ol>

    </div>
{% endblock %}

2. Select the order to pay

2.1, jump to the payment page (js click event)

2.2, click the payment (to be paid from the state to become Inbound)

HTML

JS (click to jump)

Click payment routing

route resolution to view

def payed(request):
    order_id= request.GET.get("orderid")
    order = Order.objects.get(pk=order_id)
    order.O_status = ORDER_STATUS_NOT_SEND
    order.save()
    data={
        'status':200,
    }
    return JsonResponse(data=data)

2.3, page screenshot

3, pending order list page style perfect

'axf / order / css / order_not_pay.css '
now all the codes css

.menuList {
    border-bottom: 0.04rem solid lightgray;
    position: relative;
    margin: 0.3rem 0 0 0;
}


.menuList > a {
    width: 84%;
    display: inline-block;
    font-size: 0.4rem;
    line-height: 1rem;

}
/*图片*/
.menuList > a > img {
    width: 13%;
    height: 100%;
    float: left;
}

/*商品名*/
.name{
    width: 40%;
    padding-left: 6% ;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    /*去除a标签的连接蓝色属性 text-decoration设置文本修饰属性*/
    text-decoration: none;
    color: #333;
}
/*价格*/
.presentPrice {
    width: 30%;
    padding-left: 6% ;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: red;
}
/*数量*/
.num{
    float: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #7a3cff;
}

.num:before {
    content: "x";
}

.presentPrice:before {
    content: "￥";
}

#total {
    margin: 0.3rem 0;
    text-align: center;
    font-size: 0.4rem;
}

#total_price {
    color: red;
}

#total_price:before {
    content: "￥";
}

h6 {
    color: #3c763d;
}

.container > ol > li {
    margin-bottom: 0.6rem;
    border: solid 2px lightgray;
}

.order_list {
    margin: 0 0.5rem 0.5rem 0.5rem;
}
.order>button{
    margin-top: 0.5rem;
}

order_not_pay.html
Currently this html code for all

{% extends "bese_order.html" %}
{% load static %}

{% block ext_css %}
    {{ block.super }}
    <link rel="stylesheet" href="{% static 'axf/order/css/order_not_pay.css' %}">
{% endblock %}
{% block ext_js %}
    {{ block.super }}
    <script type="text/javascript" src="{% static 'axf/order/js/order_not_pay.js' %}"></script>
{% endblock %}

{% block content %}
    <div id="order_not_pay" class="container">
        <ol>
            {% for order in orders %}
                <h6>订单编号：{{ order.id }}</h6>
                <li>
                    <ul class="order_list">

                        {% for ordergoods in order.ordergoods_set.all %}
                            <li class="menuList">
                                <a href="#">
                                    <img src="{{ ordergoods.O_goods.productimg }}"
                                         alt="{{ ordergoods.O_goods.productname }}">
                                    <span class="name">
                                        {{ ordergoods.O_goods.productname }}
                                        </span>
                                    <span class="presentPrice">
                                        {{ ordergoods.O_goods.price }}
                                        </span>
                                    <span class="num">
                                        {{ ordergoods.O_goods_num }}
                                        </span>
                                </a>
                            </li>
                        {% endfor %}
                        <span orderid="{{ order.id }}" class="order">
                            <button class="btn btn-success btn-block">去支付</button>
                        </span>
                    </ul>
                </li>

            {% endfor %}
        </ol>

    </div>
{% endblock %}

Results page

4, the total price format

Two decimal places: