Django實現簡單的圖書管理系統
目錄css
今天寫的這個圖書管理系統，但是培養用Django思惟寫項目的開始 。html
Django寫圖書管理系統
目標要求：前端
- 分別展現出出版社頁面，書籍頁面和做者頁面
- 一個出版社能夠出版多本書籍（一對多）
- 一個做者能夠寫多本書，一本書也可有多個做者（多對多）
功能截圖
建立Django項目
開始項目
在終端下寫入以下指令python
Django-admin startproject library cd library python3 manage.py startapp app01
以上操做你也能夠在Pycharm上進行，徹底沒有問題mysql
建立數據庫，本身建立叫 library的數據庫名，配置改掉jquery
配置文件
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'app01.apps.App01Config'
]
# 'django.middleware.csrf.CsrfViewMiddleware',
'DIRS': [os.path.join(BASE_DIR,'templates')],
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'library',
'USER':'root',
'PASSWORD':'123',
'HOST':'192.168.32.130',
'CHARTSET':'utf8',
}
}
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR,'static')
]
創建路由關係
在用戶經過連接訪問你的網站的時候，對於用戶來講這是一個連接地址，對於程序來時實際上是一個函數，經過這個函數才找到數據庫中的對象，對象的方法和整個的前端頁面git
文件路徑：和settings同目錄下github
"""library URL Configuration
The `urlpatterns` list routes URLs to views. For more information please see:
https://docs.djangoproject.com/en/1.11/topics/http/urls/
Examples:
Function views
1. Add an import: from my_app import views
2. Add a URL to urlpatterns: url(r'^$', views.home, name='home')
Class-based views
1. Add an import: from other_app.views import Home
2. Add a URL to urlpatterns: url(r'^$', Home.as_view(), name='home')
Including another URLconf
1. Import the include() function: from django.conf.urls import url, include
2. Add a URL to urlpatterns: url(r'^blog/', include('blog.urls'))
"""
from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^$',views.login), # 默認匹配的
# 登陸/註冊
url(r'^login/',views.login),
url(r'^register/',views.register),
# 出版社列表
url(r'^publisher_list',views.publisher_list),
url(r'^add_publisher/',views.add_publisher),
url(r'^edit_publisher/',views.edit_publisher),
url(r'^del_publisher/',views.del_publisher),
# 圖書列表
url(r'^book_list/',views.book_list),
url(r'^add_book/',views.add_book),
url(r'^edit_book/',views.edit_book),
url(r'^del_book/',views.del_book),
# 做者列表
url(r'^author_list/',views.author_list),
url(r'^add_author/',views.add_author),
url(r'^edit_author/',views.edit_author),
url(r'^del_author/',views.del_author),
]
開始寫Django項目
找到app01這個文件夾，也就是項目應用的主文件夾下面有modes.py 文件，這個文件就是咱們用來存放類和對象的文件，這裏須要用到ORM（對象關係映射）sql
from django.db import models
# Create your models here.
# 用戶信息
class User(models.Model):
username = models.CharField(max_length=64)
password = models.CharField(max_length=64)
# 出版社表
class Publisher(models.Model):
name = models.CharField(max_length=254)
# 圖書表 圖書屬於一個出版社，一個出版社能夠有多本書，一對多的關係
class Book(models.Model):
name = models.CharField(max_length=64)
publisher = models.ForeignKey(to=Publisher) # 在django中建立外鍵
# 做者表
class Author(models.Model):
name = models.CharField(max_length=64)
# 一個做者能夠對應多本書，一本書能夠有多個做者，多對多
# 在數據庫中 自動建立第四張表 ：author_book
book = models.ManyToManyField(to=Book)
編寫核心邏輯函數
一樣是app01文件夾下的views.py這個文件，上面的urls.py文件中的函數都是從這個文件中引入的，這個文件是最主要的文件數據庫
from django.shortcuts import render,HttpResponse,redirect
from app01 import models
# Create your views here.
user_info = False
# 註冊
def register(request):
if request.method == "POST":
username = request.POST.get("username")
password = request.POST.get("password")
models.User.objects.create(username=username,password=password)
return redirect('/login/')
return render(request,'register.html')
# 登陸
def login(request):
login_status = ''
global user_info
if request.method == 'POST':
username = request.POST.get("username")
password = request.POST.get("password")
user_obj = models.User.objects.filter(username=username)
if not user_obj:
return HttpResponse('沒有此用戶')
if password == user_obj[0].password:
user_info = True
return redirect('/book_list/')
else:
return HttpResponse('密碼錯誤')
return render(request,'login.html')
# 出版社視圖函數
def publisher_list(request):
if not user_info:
return redirect('/login/')
# 查詢所有的記錄
publisher_list = models.Publisher.objects.all()
# 渲染到前端頁面
return render(request,"publisher_list.html",{'publisher_list':publisher_list})
# 新增出版社
def add_publisher(request):
if not user_info:
return redirect('/login/')
if request.method == "POST":
publisher_name = request.POST.get('publisher_name')
models.Publisher.objects.create(name=publisher_name)
return redirect('/publisher_list/')
return render(request,'add_publisher.html')
# 編輯出版社
def edit_publisher(request):
if not user_info:
return redirect('/login/')
id = request.GET.get("id")
plisher_obj = models.Publisher.objects.filter(id=id)
if request.method == "POST":
publisher_name = request.POST.get("publisher_name")
models.Publisher.objects.filter(id=id).update(name=publisher_name)
return redirect('/publisher_list/')
return render(request,'edit_publisher.html',{"plisher_obj":plisher_obj[0]})
# 刪除出版社
def del_publisher(request):
id = request.GET.get("id")
models.Publisher.objects.filter(id=id).delete()
return redirect('/publisher_list/')
# 圖書列表
def book_list(request):
if not user_info:
return redirect('/login/')
book_list = models.Book.objects.all()
return render(request,'book_list.html',{"book_list":book_list})
# 新增圖書
def add_book(request):
if not user_info:
return redirect('/login/')
publisher_list = models.Publisher.objects.all()
# author_list = models.Author.objects.all()
author_list = models.Author.objects.all()
if request.method == "POST":
book_name = request.POST.get("book_name")
publisher_id = request.POST.get("publisher_id")
# author_id = request.POST.get("author_id")
models.Book.objects.create(name=book_name,publisher_id=publisher_id)
# book_obj = models.Book.objects.first()
# print(book_obj)
return redirect('/book_list/')
return render(request,'add_book.html',{"publisher_list":publisher_list,"author_list":author_list})
# 編輯圖書
def edit_book(request):
if not user_info:
return redirect('/login/')
book_id = request.GET.get("book_id")
book_obj = models.Book.objects.filter(id=book_id)
# book_name = book_obj[0].name
publisher_list = models.Publisher.objects.all()
if request.method == "POST":
book_name = request.POST.get("book_name")
publisher_id = request.POST.get("publisher_id")
models.Book.objects.filter(id=book_id).update(name=book_name,publisher_id=publisher_id)
return redirect('/book_list/')
return render(request,'edit_book.html',{"book_obj":book_obj[0],"publisher_list":publisher_list})
# 刪除圖書
def del_book(request):
if not user_info:
return redirect('/login/')
book_id = request.GET.get("book_id")
models.Book.objects.filter(id=book_id).delete()
return redirect('/book_list/')
# 做者列表
def author_list(request):
if not user_info:
return redirect('/login/')
author_list = models.Author.objects.all()
return render(request,'author_list.html',{"author_list":author_list})
# 新增做者
def add_author(request):
if not user_info:
return redirect('/login/')
# book_list = models.Book.objects.all()
if request.method == "POST":
author_name = request.POST.get("author_name")
models.Author.objects.create(name=author_name)
return redirect('/author_list/')
return render(request,'add_author.html')
# 編輯做者
def edit_author(request):
if not user_info:
return redirect('/login/')
author_id = request.GET.get("author_id")
author_obj = models.Author.objects.filter(id=author_id)
book_list = models.Book.objects.all()
if request.method == "POST":
author_name = request.POST.get("author_name")
book_id = request.POST.getlist("book_id")
author_obj[0].name = author_name
author_obj[0].book.set(book_id)
author_obj[0].save()
# models.Author.objects.filter(id=author_id).update(name=author_name)
return redirect('/author_list/')
return render(request,'edit_author.html',{"author_obj":author_obj[0],"book_list":book_list})
# 刪除做者
def del_author(request):
if not user_info:
return redirect('/login/')
author_id = request.GET.get("author_id")
models.Author.objects.filter(id=author_id).delete()
return redirect('/author_list/')
寫前端頁面
前端頁面基本上是一直在重複的頁面，注意幾個與後端創建鏈接的地方
add_author.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">添加做者信息
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post" class="form-horizontal">
<p>
做者：<input type="text" class="form-control" name="author_name" placeholder="做者">
</p>
<br>
<p>
<input type="submit" value="提交" class="btn-success btn">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
add_book.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">添加圖書
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post" class="form-horizontal">
<p>
圖書名稱：<input type="text" class="form-control" name="book_name" placeholder="圖書名稱">
</p>
<p>
所屬出版社：
<select name="publisher_id" class="form-control">
<option value="--請選擇出版社--" selected="selected">--請選擇出版社--</option>
{% for publisher in publisher_list %}
<option value="{{ publisher.id }}">{{ publisher.name }}</option>
{% endfor %}
</select>
</p>
<p>
做者：
<select name="author_id" class="form-control">
<option value="--請選擇做者--" selected="selected">--請選擇做者--</option>
{% for author in author_list %}
<option value="{{ author.id }}">{{ author.name }}</option>
{% endfor %}
</select>
</p>
<br>
<p>
<input type="submit" value="提交" class="btn-success btn">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
add_publisher.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">添加出版社
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post" class="form-horizontal">
<p>
出版社名稱：<input type="text" class="form-control" name="publisher_name" placeholder="出版社名稱">
</p>
<p>
<input type="submit" value="提交" class="btn-success btn">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
author_list.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">圖書管理系統-做者列表
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<!--搜索按鈕-->
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="exampleInputAmount">搜索</label>
<div class="input-group">
<input type="text" class="form-control" id="exampleInputAmount" placeholder="搜索">
</div>
</div>
<button type="submit" class="btn btn-primary">搜索</button>
<!--新增按鈕-->
<a href="/add_author/" class="btn btn-success pull-right">新增</a>
</form>
<br>
<table class="table-hover table-bordered table-striped table">
<thead>
<tr>
<th>序號</th>
<th>做者</th>
<th>著做</th>
<th>操做</th>
</tr>
</thead>
<tbody>
{% for author in author_list %}
<tr>
<td>{{ author.id }}</td>
<td>{{ author.name }}</td>
<td>{% for book in author.book.all %}
{% if forloop.last %}
《{{ book.name }}》
{% else %}
《{{ book.name }}》
{% endif %}
{% empty %}
暫無著做
{% endfor %}
</td>
<td class="text-center">
<a href="/edit_author/?author_id={{ author.id }}" class="btn btn-primary">編輯</a>
<a href="/del_author/?author_id={{ author.id }}" class="btn btn-danger" onclick="return confirm('是否確認刪除')">刪除</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{# 分頁開始#}
<nav aria-label="Page navigation" class="text-center">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
{# 分頁結束#}
</div>
</div>
</div>
</div>
</div>
</body>
</html>
book_list.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">圖書管理系統-圖書列表
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<!--搜索按鈕-->
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="exampleInputAmount">搜索</label>
<div class="input-group">
<input type="text" class="form-control" id="exampleInputAmount" placeholder="搜索">
</div>
</div>
<button type="submit" class="btn btn-primary">搜索</button>
<!--新增按鈕-->
<a href="/add_book/" class="btn btn-success pull-right">新增</a>
</form>
<br>
<table class="table-hover table-bordered table-striped table">
<thead>
<tr>
<th>序號</th>
<th>書名</th>
<th>出版社</th>
{# <th>做者</th>#}
<th>操做</th>
</tr>
</thead>
<tbody>
{% for book in book_list %}
<tr>
<td>{{ book.id }}</td>
<td>{{ book.name }}</td>
<td>{{ book.publisher.name }}</td>
{# <td>{{ book.author.name }}</td>#}
<td class="text-center">
<a href="/edit_book/?book_id={{ book.id }}" class="btn btn-primary">編輯</a>
<a href="/del_book/?book_id={{ book.id }}" class="btn btn-danger" onclick="return confirm('是否確認刪除')">刪除</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{# 分頁開始#}
<nav aria-label="Page navigation" class="text-center">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
{# 分頁結束#}
</div>
</div>
</div>
</div>
</div>
</body>
</html>
edit_author.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">編輯做者信息
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post" class="form-horizontal">
<p>
做者：<input type="text" class="form-control" name="author_name" value="{{ author_obj.name }}">
</p>
<p>
著做：
<select name="book_id" class="form-control" multiple>
{% for book in book_list %}
{% if book in author_obj.book.all %}
<option value="{{ book.id }}" selected="selected">{{ book.name }}</option>
{% else %}
<option value="{{ book.id }}">{{ book.name }}</option>
{% endif %}
{% endfor %}
</select>
</p>
<p>
<input type="submit" value="提交" class="btn-success btn">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
edit_book.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">編輯圖書信息
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post" class="form-horizontal">
<p>
圖書名稱：<input type="text" class="form-control" name="book_name" value="{{ book_obj.name }}">
</p>
<p>
所屬出版社：
<select name="publisher_id" class="form-control">
<option value="--請選擇出版社--">--請選擇出版社--</option>
{% for publisher in publisher_list %}
{% if publisher == book_obj.publisher %}
<option value="{{ publisher.id }}" selected="selected">{{ publisher.name }}</option>
{% else %}
<option value="{{ publisher.id }}">{{ publisher.name }}</option>
{% endif %}
{% endfor %}
</select>
</p>
<p>
<input type="submit" value="提交" class="btn-success btn">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
edit_publisher.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">編輯出版社
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post" class="form-horizontal">
<p>
出版社名稱：<input type="text" class="form-control" name="publisher_name" value="{{ plisher_obj.name }}">
</p>
<p>
<input type="submit" value="提交" class="btn-success btn">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">請先登陸，歡迎登陸！
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post">
<p>
用戶名：<input type="text" name="username" placeholder="用戶名" class="form-control">
</p>
<p>
密碼：<input type="password" name="password" placeholder="密碼" class="form-control">
</p>
<div class="pull-left">
<input type="submit" value="提交" class="btn btn-primary">
</div>
<p class="pull-right">沒有帳號？<a href="/register/">當即註冊</a></p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
publisher_list.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">圖書管理系統-出版社列表
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<!--搜索按鈕-->
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="exampleInputAmount">搜索</label>
<div class="input-group">
<input type="text" class="form-control" id="exampleInputAmount" placeholder="搜索">
</div>
</div>
<button type="submit" class="btn btn-primary">搜索</button>
<!--新增按鈕-->
<a href="/add_publisher/" class="btn btn-success pull-right">新增</a>
</form>
<br>
<table class="table-hover table-bordered table-striped table">
<thead>
<tr>
<th>序號</th>
<th>出版社</th>
<th>操做</th>
</tr>
</thead>
<tbody>
{% for publisher in publisher_list %}
<tr>
<td>{{ publisher.id }}</td>
<td>{{ publisher.name }}</td>
<td class="text-center">
<a href="/edit_publisher/?id={{ publisher.id }}" class="btn btn-primary">編輯</a>
<a href="/del_publisher/?id={{ publisher.id }}" class="btn btn-danger" onclick="return confirm('是否確認刪除')">刪除</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{# 分頁開始#}
<nav aria-label="Page navigation" class="text-center">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
{# 分頁結束#}
</div>
</div>
</div>
</div>
</div>
</body>
</html>
register.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#導航條#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/book_list/">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/publisher_list/">出版社列表</a></li>
<li><a href="/author_list/">做者列表</a></li>
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="/login/">登陸 / 註冊</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">歡迎註冊！
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<form action="" method="post">
<p>
用戶名：<input type="text" name="username" placeholder="用戶名" class="form-control">
</p>
<p>
密碼：<input type="password" name="password" placeholder="密碼" class="form-control">
</p>
<p>
確認密碼：<input type="password" name="password" placeholder="密碼" class="form-control">
</p>
<p>
<input type="submit" value="提交" class="btn btn-primary">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
源碼
源碼已經上傳至github：https://github.com/bongmu/library.git
相關文章
- 1. 練習：Django實現簡單的圖書管理系統
- 2. 基於django實現簡易版的圖書管理系統
- 3. Django圖書管理系統
- 4. Django（圖書管理系統）
- 5. Django -- 圖書管理系統
- 6. Django——圖書管理系統
- 7. JAVA簡單的圖書管理系統
- 8. JAVAWEB---簡單的圖書管理系統
- 9. 簡單的圖書管理系統
- 10. 用Servlet實現簡單的圖書管理系統
- 更多相關文章...
- • 系統定義的TypeHandler - MyBatis教程
- • 現實生活中的 XML - XML 教程
- • Docker容器實戰(七) - 容器眼光下的文件系統
- • ☆基於Java Instrument的Agent實現
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
相關文章
- 1. 練習：Django實現簡單的圖書管理系統
- 2. 基於django實現簡易版的圖書管理系統
- 3. Django圖書管理系統
- 4. Django（圖書管理系統）
- 5. Django -- 圖書管理系統
- 6. Django——圖書管理系統
- 7. JAVA簡單的圖書管理系統
- 8. JAVAWEB---簡單的圖書管理系統
- 9. 簡單的圖書管理系統
- 10. 用Servlet實現簡單的圖書管理系統