Django实现学员管理系统

本文实例为大家分享了Django实现学员管理系统的具体代码，供大家参考，具体内容如下

要求：实现数据的增删改查功能，并同步至数据库中。此项目实现了前端以及后端的结合。

（1） 先在settings里配置static（存放的是css样式、js代码、以及imgs），可以加在文件末尾

STATIC_URL = '/static/'
STATICFILES_DIRS = [
 os.path.join(BASE_DIR, 'static')
]

（2） 首先，新建一个django项目，在项目下的urls.py文件里，配置跳转路由，跳转到首页

urls.py

from django.conf.urls import url, include
from django.contrib import admin

urlpatterns = [
 url(r'^admin/', admin.site.urls),
 url(r'^student/', include('student.urls'))
]

（3） 通过python manage.py startapp student命令创建一个student的app（不要忘记在settings中配置一下），并在models.py下执行mysql操作，在这里我们就直接在数据库里手动创建表，不再使用sql语句创建表了

models.py

import pymysql
# Create your models here.

# 管理数据库
class DBManager(object):

 @classmethod
 def open_sql(cls):
  conn = pymysql.connect(
   host='127.0.0.1',
   port=3306,
   db='students',
   user='root',
   password='123456',
   use_unicode=True,
   charset='utf8'
  )
  DBManager.conn = conn
  DBManager.cursor = conn.cursor()

 @classmethod
 def close_sql(cls):
  DBManager.conn.commit()
  DBManager.cursor.close()
  DBManager.conn.close()

# 数据模型类
class StudnetModel(object):

 def __init__(self, s_id, s_name, s_phone):
  self.s_id = s_id
  self.s_name = s_name
  self.s_phone = s_phone
  self.table = 'students'

 def save(self):
  """
  保存数据模型到数据库
  :return: False 表示数据已存在 True表示保存数据成功
  """
  DBManager.open_sql()
  # 如果s_id已存在，说明学号已存在
  sql = f'SELECT * FROM students WHERE s_id={self.s_id}'
  if DBManager.cursor.execute(sql) > 0:
   # 数据已存在，插入失败
   return False
  else:
   # 插入数据
   sql = 'INSERT INTO students(s_id,s_name,s_phone)VALUES(%s,%s,%s)'
   DBManager.cursor.execute(sql,(self.s_id, self.s_name, self.s_phone))
   DBManager.close_sql()
   return True

 @classmethod
 def delete(cls, s_id):
  """
  根据s_id删除数据
  :param s_id: 要删除数据的id
  :return: False表示该数据不存在 True删除成功
  """
  DBManager.open_sql()

  # 删除的sql语句
  sql = f'DELETE FROM students WHERE s_id={s_id}'
  DBManager.cursor.execute(sql)

  # rowcount 执行sql语句 影响的数据条数
  if DBManager.cursor.rowcount > 0:
   DBManager.close_sql()

   return True
  else:
   return False

 @classmethod
 def object_with_id(cls, s_id):

  DBManager.open_sql()
  sql = f'SELECT * FROM students WHERE s_id={s_id}'
  DBManager.cursor.execute(sql)
  # 取出拿到的数据
  result = DBManager.cursor.fetchone()
  DBManager.close_sql()
  if result:
   # 返回StudentModel对象
   return cls(result[0], result[1], result[2], )

 def modify(self):

  DBManager.open_sql()

  sql = f"UPDATE students SET s_name='{self.s_name}' , s_phone='{self.s_phone}' WHERE s_id={self.s_id}"

  DBManager.cursor.execute(sql)
  if DBManager.cursor.rowcount > 0:
   DBManager.close_sql()
   return True
  else:
   return False

 @classmethod
 def objects(cls):
  # 只要调用该函数，返回数据库中所有的数据
  DBManager.open_sql()
  sql = 'SELECT * FROM students'
  DBManager.cursor.execute(sql)
  # 取出查询的所有数据,results是一个大元组
  results = DBManager.cursor.fetchall()
  # 将results中每一个小元组转换为StudentModel对象
  students = map(lambda t:cls(t[0], t[1], t[2]), results)
  # 关闭数据库
  DBManager.close_sql()

  return students

if __name__ == '__main__':

 StudnetModel.objects()

（4） 接下来在自己新建的app下，再手动创建一个urls.py文件，用来配置具体路由，并在views.py文件里实现视图函数（存放具体的增删改查功能的函数）

student/urls.py

from django.conf.urls import url
from .views import *

urlpatterns = [
 url(r'^$', student_index, name='stu_index'),
 url(r'^modify/(?P<s_id>\d+)/$', student_modify, name='modify'),
 url(r'^addstu/$', student_add, name='addstu'),
 url(r'^delstu/(?P<s_id>\d+)/$', student_del, name='delstu'),
]

student/views.py

from django.shortcuts import render, redirect
from django.http import HttpResponse

from .models import StudnetModel
# Create your views here.

def student_index(reqeust):

 # 取出数据库中所有的数据
 students = StudnetModel.objects()

 return render(reqeust, 'index.html', {'students': students})

def student_add(request):

 if request.method == 'POST':

  # 取出数据
  s_id = request.POST.get('id', None)
  s_name = request.POST.get('name', None)
  s_phone = request.POST.get('phone', None)

  if s_id and s_name and s_phone:
   try:
    int(s_id)
   except Exception as e:
    return HttpResponse('id必须是纯数字！')
   # 创建数据模型对象
   stu = StudnetModel(s_id, s_name, s_phone)
   # 保存数据
   if stu.save():
    # 重定向到首页
    return redirect('/student')
   else:
    # 返回提示信息
    return HttpResponse('该学号已存在！')
  else:
   return HttpResponse('添加信息不能为空！')
 else:
  # 其他访问方式，重定向到主页
  return redirect('/student')

def student_del(request, s_id):

 if request.method == 'GET':
  # MTV设计模式
  # 根据id判断是否存在

  if StudnetModel.delete(s_id):
   # 删除成功
   return redirect('/student')
  else:
   # 删除数据不存在
   return HttpResponse('要删除的数据不存在！')

def student_modify(request, s_id):

 if request.method == 'GET':

  # 根据s_id 查询这个id对应的信息
  stu = StudnetModel.object_with_id(s_id)
  if stu:
   return render(request, 'modify.html', {'stu': stu})
  else:

   return HttpResponse('要修改的学员id不存在！！')
 elif request.method == 'POST':

  # 取出修改后的参数
  s_name = request.POST.get('name')
  s_phone = request.POST.get('phone')
  stu = StudnetModel(s_id, s_name, s_phone)
  if stu.modify():

   return redirect('/student')
  else:

   return HttpResponse('修改失败，请稍后重试！')

（5） 最后就是在html代码中实现路由跳转，实现功能

首页html，index.html

{% load static %}
<!DOCTYPE html>
<html lang="zh-CN">

<head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
 <meta name="author" content="bais">
 <title></title>
 <link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
 <style>
  .navbar {
   border-radius: 0px;
   margin-bottom: 0;
  }

  .titleContent {
   background-color: #eeeeee;
  }

  .mToolbar {
   padding-top: 10px;
   padding-bottom: 10px;
  }

  .container-fluid {
   padding-left: 8vw;
  }

  @media (max-width:768px) {
   .container-fluid {
    padding-left: 15px;
   }
  }

  .form-horizontal .control-label{
   text-align: left;
  }
 </style>
</head>

<body>

 <!--
  导航
 -->
 <nav class="navbar navbar-inverse" role="navigation">
  <div class="container-fluid">
   <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#example-navbar-collapse">
   <span class="sr-only">切换导航</span>
   <span class="icon-bar"></span>
   <span class="icon-bar"></span>
   <span class="icon-bar"></span>
  </button>
    <a class="navbar-brand" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >学员管理系统</a>
   </div>
   <div class="collapse navbar-collapse" id="example-navbar-collapse">
    <ul class="nav navbar-nav">
     <li class=""><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >首页</a></li>
     <li class="active"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >学员</a></li>

    </ul>

    <ul class="nav navbar-nav navbar-right">
     <li>
      <a href="#"></span> XXX<b class="caret"></b></a>
     </li>
     <li>
      <a href="#"></span> 退出</a>
     </li>
    </ul>

   </div>
  </div>
 </nav>
 <!--
  标题
 -->
 <div class="container-fluid titleContent">
  <h1>学员查询及管理</h1>
 </div>
 <!--
  工具栏部分 按钮
 -->
 <div class="container-fluid mToolbar">
  <button type="button" class="btn btn-success" data-toggle="modal" data-target="#myModal">添加</button>

 </div>

 <!--
  模态框：搜索按钮绑定的模态框
 -->
 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
   <div class="modal-content">
    <div class="modal-header">
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
     <h4 class="modal-title" id="myModalLabel">搜索条件</h4>
    </div>
    <div class="modal-body">
     <!--
      添加模态框中的表单
     -->

     <form class="form-horizontal" role="form" action="{% url 'addstu' %}" method="post">
      <div class="form-group">
       <label for="firstname" class="col-sm-2 control-label">姓名</label>
       <div class="col-sm-4">
        <input type="text" class="form-control" id="firstname" name="name" placeholder="学员姓名">
       </div>
      </div>
      <div class="form-group">
       <label for="lastname" class="col-sm-2 control-label">学号</label>
       <div class="col-sm-4">
        <input type="text" class="form-control" id="lastname" name="id" placeholder="学员学号">
       </div>
      </div>
      {% csrf_token %}
      <div class="form-group">
       <label for="lastname" class="col-sm-2 control-label">电话</label>
       <div class="col-sm-7">
        <input type="text" class="form-control" id="lastname" name="phone" placeholder="电话号码">
       </div>
      </div>

      <div class="modal-footer">
     <button type="submit" class="btn btn-success">提交</button>
    </div>

     </form>

    </div>

   </div>
   <!-- /.modal-content -->
  </div>
  <!-- /.modal -->
 </div>

 <!--
  表格
 -->
 <div class="container-fluid">
  <div class="table-responsive ">
   <table class="table table-bordered table-condensed">
    <thead>
     <tr class="active">
      <th>姓名</th>
      <th>学号</th>
      <th>电话</th>
      <th>编辑</th>
      <th>删除</th>
      <tbody>
       {% for stu in students %}
       <tr>
        <td>{{ stu.s_name }}</td>
        <td>{{ stu.s_id }}</td>
        <td>{{ stu.s_phone }}</td>

        <td><a href="{% url 'modify' stu.s_id %}" rel="external nofollow" ><span class="glyphicon glyphicon-edit"></span></a></td>

        <td><a href="{% url 'delstu' stu.s_id %}" rel="external nofollow" ><span class="glyphicon glyphicon-remove"></span></a></td>
       </tr>
       {% endfor %}
      </tbody>
     </tr>
    </thead>
   </table>
  </div>
 </div>

 <script src="{% static 'js/jquery-3.1.1.js' %}"></script>
 <script src="{% static 'js/bootstrap.min.js' %}"></script>
</body>

</html>

增加 / 修改学员页面，modif.html

 <!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>修改学员信息-{{ stu.s_name }}</title>
 <link rel="stylesheet" href="style.css" >
 <style>
 .smart-green {
 margin-left: auto;
 margin-right: auto;
 max-width: 500px;
 background: #F8F8F8;
 padding: 30px 30px 20px 30px;
 font: 12px Arial, Helvetica, sans-serif;
 color: #666;
 border-radius: 5px;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 }

 .smart-green h1 {
 font: 24px "Trebuchet MS", Arial, Helvetica, sans-serif;
 padding: 20px 0px 20px 40px;
 display: block;
 margin: -30px -30px 10px -30px;
 color: #FFF;
 background: #9DC45F;
 text-shadow: 1px 1px 1px #949494;
 border-radius: 5px 5px 0px 0px;
 -webkit-border-radius: 5px 5px 0px 0px;
 -moz-border-radius: 5px 5px 0px 0px;
 border-bottom: 1px solid #89AF4C;
 }

 .smart-green h1 > span {
 display: block;
 font-size: 11px;
 color: #FFF;
 }

 .smart-green label {
 display: block;
 margin: 0px 0px 5px;
 }

 .smart-green label > span {
 float: left;
 margin-top: 10px;
 color: #5E5E5E;
 }

 .smart-green input[type="text"], .smart-green input[type="email"], .smart-green textarea, .smart-green select {
 color: #555;
 height: 30px;
 line-height: 15px;
 width: 100%;
 padding: 0px 0px 0px 10px;
 margin-top: 2px;
 border: 1px solid #E5E5E5;
 background: #FBFBFB;
 outline: 0;
 -webkit-box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
 box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
 font: normal 14px/14px Arial, Helvetica, sans-serif;
 }

 .smart-green textarea {
 height: 100px;
 padding-top: 10px;
 }

 .smart-green .button {
 background-color: #9DC45F;
 border-radius: 5px;
 -webkit-border-radius: 5px;
 -moz-border-border-radius: 5px;
 border: none;
 padding: 10px 25px 10px 25px;
 color: #FFF;
 text-shadow: 1px 1px 1px #949494;
 }

 .smart-green .button:hover {
 background-color: #80A24A;
 }

 .error-msg{
 color: red;
 margin-top: 10px;
 }
 .success-msg{
 color: #80A24A;
 margin-top: 10px;
 margin-bottom: 10px;
 }
 </style>
</head>
<body>
<form action="{% url 'modify' stu.s_id %}" method="post" class="smart-green">
 {% csrf_token %}
 <h1>修改学员信息-{{ stu.s_name }}
  <span>请输入修改后的信息.</span>
 </h1>
 <label>
  <span>姓名 :</span>
  <input id="name" type="text" name="name" class="error" placeholder="请输入修改后姓名" value="{{ stu.s_name }}">
  <div class="error-msg"></div>
 </label>

 <label>
  <span>电话 :</span>
  <input id="email" type="text" value="{{ stu.s_phone }}" name="phone" placeholder="请输入修改后的电话"/>
  <div class="error-msg"></div>
 </label>
 <label>
  <span> </span>
  <input type="submit" class="button" value="提交"/>
 </label>

</form>

</body>
</html>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。