Django Layui table数据表格de实现

• 1、Django创建项目及配置
• • 1、创建项目及App
  • 2、注册App
  • 3、数据模型
  • • 3-1、创建模板类
    • 3-2、数据迁移
  • 4、创建路由
  • • 4-1、项目路由
    • 4-2、App路由
  • 5、视图
  • 6、模板

(env) D:My Project>django-admin startprojeck sku   # 创建项目
(env) D:My Project>django-admin startapp shopping  # 创建app

1、找到项目目录下的settings.py文件
2、并添加 ‘shopping’ 如下图

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'shopping',  # 注册我们的App
]

App目录下models.py

from django.db import models
class Sku(models.Model):
    sku_name = models.CharField(max_length=256)
    sku_short_name = models.CharField(max_length=256)
    sku_desc = models.TextField()
    sku_size = models.CharField(max_length=256)
    sku_color = models.CharField(max_length=256)
    sku_qty = models.CharField(max_length=256)

(env) D:My Projectsku>python manage.py makemigrations
(env) D:My Projectsku>python manage.py migrate

项目目录下urls.py

from django.contrib import admin
from django.urls import path, include
from . import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('shopping/', include("shopping.urls")),
]

App目录下urls.py

from django.urls import path
from . import views
urlpatterns = [
    path('shopping/', views.shopping),
    path('sku_table/', views.sku_table),
    path('sku_index/', views.sku_index),
]

App目录下views.py

from django.shortcuts import render, redirect
from django.db import transaction
from rest_framework import serializers
from django.core.paginator import Paginator
from django.http import JsonResponse, HttpResponseForbidden
from .models import Sku

def pager(sku_objs, current_page=1, number_of_page=5):
    paginator = Paginator(sku_objs, number_of_page)
    page_objs = paginator.page(current_page)
    current_page_num = page_objs.number  # 获取当前页码
    page_range = [i for i in range(max(current_page_num - 2, 1), min(current_page_num + 2, paginator.num_pages) + 1)]
    context = {'objs': page_objs.object_list,
               'page_objs': page_objs,
               'page_range': page_range,
               'count': paginator.count
               }
    # page_objs：； -->分页的总详情（一共多少页，一页多少sku）
    # page_objs.object_list： , , ,
    # , ]> -->当前页的详情（这样页中的sku）
    # paginator.count： 7 --> sku总数
    return context
    
class SkuSerializer(serializers.ModelSerializer):
    sku_name = serializers.models.CharField()
    sku_short_name = serializers.models.CharField()
    sku_desc = serializers.models.CharField()
    sku_size = serializers.models.CharField()
    sku_color = serializers.models.CharField()
    sku_qty = serializers.models.CharField()

    class Meta:
        model = Sku  # 模型名称
        fields = '__all__'  # 序列化这个模型的所有字段

def sku_index(request):
    if request.method == 'GET':
        return render(request, 'sku.html')

    else:
        db_save_id = transaction.savepoint()
        sku_name = request.POST.get('sku_name')
        sku_short_name = request.POST.get('sku_short_name')
        sku_desc = request.POST.get('sku_desc')
        sku_size = request.POST.get('sku_size')
        sku_color = request.POST.get('sku_color')
        sku_qty = request.POST.get('sku_qty')
        if not sku_name:
            return HttpResponseForbidden("SKU names cannot be NULL")
        content = {
            'sku_name': sku_name,
            'sku_short_name': sku_short_name,
            'sku_desc': sku_desc,
            'sku_size': sku_size,
            'sku_color': sku_color,
            'sku_qty': sku_qty,
        }
        try:
            Sku.objects.update_or_create(**content)
            transaction.savepoint_commit(db_save_id)
        except Exception:
            transaction.savepoint_rollback(db_save_id)
            return HttpResponseForbidden("System error")
        return redirect('/shopping/shopping/')

def sku_table(request):
    current_page = request.GET.get('page', 1)
    sku_objs = Sku.objects.all().order_by('id')
    content = pager(sku_objs, current_page=current_page, number_of_page=5)
    sku_detail_list = []
    for v in content['objs']:
        sku_detail_list.append(SkuSerializer(v).data)  # many=True
    data = {
        'code': 0,
        'msg': 'Success',
        'count': content['count'],
        'data': sku_detail_list
    }
    # data： {'code': 0, 'msg': 'Success', 'count': 7, 'data': [{},..., {}]}
    return JsonResponse(data)

def shopping(request):
    return render(request, 'shopping.html')

base.html 基类模板

{% load static %}


    
    
    
    
    
    
    
    
    {% block links %} {% endblock links %}


{% block cboby %}
{% endblock cboby %}

{% block scripts %}
{% endblock scripts %}

sku.html

{% extends 'base.html' %}
{% load static %}
{% block title %}SKU详情{% endblock title %}
{% block cboby %}

    {% csrf_token %}
	

		产品名称:
		

			
		
	
	

		产品编号:
		

			
		
	
	

		产品介绍:
		

			
		
	
	

		产品规格:
		

			
		
	
	

		产品色彩:
		

			
		
	
	

		产品数量:
		

			
		
	
	

	    

			立即提交
			重置
	    
  

{% endblock cboby %}
{% block scripts %}
	
{% endblock scripts %}

shipping.html (这里使用include)

{% extends 'base.html' %}
{% load static %}
{% block title %}Shipping{% endblock title %}
{% block cboby %}
    添加产品
	{% include 'sku_table.html' %}
{% endblock cboby %}

sku_table.html

{% load static %}