ジャンゴ15ショッピングモールプロジェクト
1、合計金額
エフェクトのスクリーンショット
1.1、HTML
1.2、ビュー
すべてのショッピングカートでは、この方法では、ステータスの変更が追加されます
1.3、JS
そこJS、イベントが発生したクリックの合計金額に相当する値を設定することを忘れないでください
2、シングルクリック
スパンに単一元のタグの単一機能の前に書き込み、増加のID = make_order
2.1、注文を発生させる（JSがイベントをクリック）
$("#make_order").click(function () {
// 商品判断选中状态
var select_list = [];
var unselect_list = [];
$(".confirm").each(function () {
var $confirm = $(this);
var cartid = $confirm.parents("li").attr("cartid");
if ($confirm.find("span").find("span").html().trim()) {
select_list.push(cartid);
} else {
unselect_list.push(cartid);
}
});
// 如果选中状态的商品为0，直接返回
if(select_list.length===0){
return
}
$.getJSON("/axf/makeorder/",function (data) {
console.log(data);
})
});
2.2、サーバ（ルーティング、ミドルウェア）へ戻ります
ルートは、
ミドルウェアに登録しました
2.3、次モデル（models.py）を作成
models.py
# 订单
class Order(models.Model):
O_user = models.ForeignKey(AXFUser, on_delete=models.CASCADE)
O_price = models.FloatField(default=0)
O_time = models.DateTimeField(auto_now=True)
O_status = models.IntegerField(default=ORDER_STATUS_NOT_PAY)
O_note = models.CharField(max_length=255)
class Meta:
db_table = 'axf_order'
# 订单里的商品（OrderGoods对Order是多对1，一个订单里面可以有多个商品）
class OrderGoods(models.Model):
O_user = models.ForeignKey(Order, on_delete=models.CASCADE)
O_goods = models.ForeignKey(Goods,on_delete=models.CASCADE)
O_goods_num = models.IntegerField(default=1)
class Meta:
db_table = 'axf_ordergoods'
#生成迁移文件：
python manage.py makemigrations
#执行迁移文件：
python manage.py migrate
成功を作成します
2.4、ビュー（views.py）
def make_order(request):
# 获取选中状态的商品
carts = Cart.objects.filter(C_user=request.user).filter(C_is_select=True)
# 创建订单存入数据
order = Order()
order.O_user = request.user
order.O_price = get_total_price()
order.save()
# 循环 存入商品信息
for cart_obj in carts:
ordergoods = OrderGoods()
# ordergoods.O_user里存的是订单号
ordergoods.O_user = order
# 商品数量
ordergoods.O_goods_num = cart_obj.C_goods_num
# 商品
ordergoods.O_goods=cart_obj.C_goods
ordergoods.save()
cart_obj.delete()
data = {
"status": 200,
# 把订单id传到前端
"order_id":order.id
}
return JsonResponse(data=data)
3、注文の詳細にジャンプの後にシングルクリック
イベントをクリックしcart.js
4、注文ページ
4.1、HTML
{% extends "bese_order.html" %}
{% load static %}
{% block ext_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'axf/order/css/order_detail.css' %}">
{% endblock %}
{% block content %}
<div id="order_detail" class="container">
<h6>订单编号： {{ order.id }} </h6>
<ul>
{# 查所有订单内商品的内容 ： 被关联的对象.字段名_set.all #}
{% for ordergoods in order.ordergoods_set.all %}
<li class="menuList">
<a href="#">
<img src="{{ ordergoods.O_goods.productimg }}" alt="{{ ordergoods.O_goods.productlongname }}">
<p class="longname">{{ ordergoods.O_goods.productlongname }}</p>
<p class="presentPrice">{{ ordergoods.O_goods.price }}</p>
</a>
<section>
<span class="num">{{ ordergoods.O_goods_num }}</span>
</section>
</li>
{% endfor %}
</ul>
{# 总价 #}
<h1 id="total">总价：<span id="total_price">{{ order.O_price }}</span></h1>
<button id="alipay" class="btn btn-success btn-block">支付</button>
</div>
{% endblock %}
4.2、ビュー
# 订单详情
def order_detail(request):
# request:orderid（订单的id）、AXFUser（中间件传递）
order_id = request.GET.get("orderid")
order = Order.objects.get(pk=order_id)
print(order)
data = {
"title": "订单详情",
# 这里的order包含 单个订单的全部信息
"order": order,
}
return render(request, "order/order_detail.html",context=data)
4.3ルーティング
ミドルウェアに登録した覚えが
5、鉱山保留中の支払いページ、インバウンド
5.1、支払い、転送されるデータを受信すると（図）ペンディング
5.1、下付きスタイル（HTML、CSS）
#badge1{
left: 1.8rem;
top: 5.8rem;
}
#badge2{
left: 4.2rem;
top: 5.8rem;
}
.badge {
background: red;
color: white;
position: absolute;
font-size: 0.35rem;
min-width: 0.5rem;
padding: 0.1rem 0.1rem;
border-radius: 1rem;
}
