如何用Django建立一个后台CRM系统01
创建Django程序
django-admin startproject crm1
首先创建项目的一部分分支 accounts
django manage.py startapp accounts
account拥有三个页面 Home，Products ，Customer 在views输入函数
def home(request): return render(request, 'accounts/home.html') def products(request): return render(request, 'accounts/products.html') def customer(request): return render(request, 'accounts/customer.html')
在crm1目录下面的urls.py连接account目录下面的urls.py -目的是防止项目相同的url相撞
from django.urls import path,include urlpatterns = [ patn('admin/',admin,site.urls), path(' ',include('/accounts/urls')) ]
在urls.py编写三部分的url
from django.urls import path from . import views urlpatterns = [ path('',views.home), path('products',views.products), path('customer', views.customer), path('images',views.images), ]
在accounts里面创建templates目录存入html模板
首先写一个main.html导入bootstrap组件（link 和js连接）
- 其中{% include 'accounts/xxxx.html'%}是导入xxxx模板
-{%extend 'xxx.html'%} 继承 {%block content %} {%endblock%}
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- 最新版本的 Bootstrap 核心 CSS 文件 --> {#<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">#} <!-- 可选的 Bootstrap 主题文件（一般不用引入） --> {#<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">#} <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <link rel="stylesheet" href="/static/css/main.css"> <style> </style> </head> <body> {% include 'accounts/Navbar.html' %} {% block content %} {% endblock %} <hr> <h4>our footer</h4> </body> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script> {#<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>#} {#<jsp:include flush="true" page="/webpage/inc/incTop.jsp"></jsp:include>#} </html>
再分别创建home.html customer.html products.html Navtar.html(导航条)
-----------------------HOME-------------------------------------------- {% extends 'accounts/main.html' %} {% block content %} {% include 'accounts/status.html' %} <br> <div class="row"> <div class="col-md-5"> <h5>CUSTOMERS:</h5> <hr> <div class="card card-body"> <a class="btn btn-primary btn-sm btn-block" href="">Create Customer</a> <table class="table table-sm"> <tr> <th></th> <th>Customer</th> <th>Orders</th> </tr> </table> </div> </div> <div class="col-md-7"> <h5>LAST 5 ORDERS</h5> <hr> <div class="card card-body"> <a class="btn btn-primary btn-sm btn-block" href="">Create Order</a> <table class="table table-sm"> <tr> <th>Product</th> <th>Date Orderd</th> <th>Status</th> <th>Update</th> <th>Remove</th> </tr> </table> </div> </div> </div> {% endblock %}
--------------------------------------CUSTOMER---------------------- {% extends 'accounts/main.html' %} {% block content %} <br> <div class="row"> <div class="col-md"> <div class="card card-body"> <h5>Customer:</h5> <hr> <a class="btn btn-outline-info btn-sm btn-block" href="">Update Customer</a> <a class="btn btn-outline-danger btn-sm btn-block" href="">Delete Customer</a> </div> </div> <div class="col-md"> <div class="card card-body"> <h5>Contact Information</h5> <hr> <p>Email: </p> <p>Phone: </p> </div> </div> <div class="col-md"> <div class="card card-body"> <h5>Total Orders</h5> <hr> <h1 style="text-align: center;padding: 10px"></h1> </div> </div> </div> <br> <div class="row"> <div class="col"> <div class="card card-body"> <form method="get"> <button class="btn btn-primary" type="submit">Search</button> </form> </div> </div> </div> <br> <div class="row"> <div class="col-md"> <div class="card card-body"> <table class="table table-sm"> <tr> <th>Product</th> <th>Category</th> <th>Date Orderd</th> <th>Status</th> <th>Update</th> <th>Remove</th> </tr> </table> </div> </div> </div> {% endblock %}
--------------------------PRODUCTS------------------- {% extends 'accounts/main.html' %} {% block content %} <br> <div class="row"> <div class="col-md"> <div class="card card-header"> <h5>Products</h5> </div> <div class="card card-body"> <table > <tr> <th>Products</th> <th>Category</th> <th>Price</th> </tr> </table> </div> </div> </div> {% endblock %}
------------------------NAVTAR---------------------- <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> <img src="/static/images/678.png" style="border-radius: 50%;width: 48px;height: 48px;" > <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item active"> <a class="nav-link" href="#">Dashboard</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Products</a> </li> </ul> </div> </nav>
关于静态库需要在setting.py设置路径 再创建static目录 分别有CSS，JS，IMAGES
STATIC_URL = '/static/' MEDIA_URL = '/images/' STATICFILES_DIRS = [ os.path.join(BASE_DIR,'static') ]
CSS样式
#logo { } body { background-color: #ebeff5; } #total-orders { background-color: #4cb4c7; } #orders-delivered { background-color: #7abecc; } #orders-pending { background-color: #7CD1C0; }
对数据库进行操作使用django原生的datebase' sqllite3
Terminal输入 python manage.py creatsuperuser 输入用户名密码 127.0.0.1:8000/admin进入页面
在models.py创建数据库
-外键 一对多 多对多
-choices 多项式 建立类似STATUS元组 最近加上属性
-date_reated 记录创建时间 auto_now_add = True
-每行对象不能为空 即NULL=True
-def __str__(self) 目的是为了在admin页面显示出具体项目名称
from django.db import models # Create your models here. class Tag(models.Model): name = models.CharField(max_length=200,null=True) def __str__(self): return self.name class Customer(models.Model): name = models.CharField(max_length=200,null=True) phone = models.CharField(max_length=200,null=True) email = models.CharField(max_length=200,null=True) date_created = models.DateTimeField(auto_now_add=True, null=True) def __str__(self): return self.name class Products(models.Model): CATEGORY = ( ('Indoor','Indoor'), ('Outdoor','Outdoor') ) name = models.CharField(max_length=200,null=True) price = models.FloatField(max_length=200,null=True) category = models.CharField(max_length=200,null=True,choices=CATEGORY) description = models.CharField(max_length=200,null=True,blank=True) date_created = models.DateTimeField(auto_now_add=True, null=True) # many2many tags = models.ManyToManyField(Tag) def __str__(self): return self.name class Order(models.Model): STATUS = ( ('Pending','Pending'), ('Out for delivery','Out for delivery'), ('Delivered','Delivered'), ) # one2many customer = models.ForeignKey(Customer,null=True,on_delete=models.SET_NULL) product = models.ForeignKey(Products,null=True,on_delete=models.SET_NULL) status =models.CharField(max_length=200, null=True, choices=STATUS) date_created = models.DateTimeField(auto_now_add=True,null=True)
每次对数据库进行操作 ，都需要进行两步TIminal操作
python manage.py makemigrations -这一步目的是缓存入accounts里面的migrations
python manage.py migrate -传入数据库
在admin.py写入函数 才能看到项目
from django.contrib import admin # Register your models here. from .models import * admin.site.register(Customer) admin.site.register(Products) admin.site.register(Order) admin.site.register(Tag)
