用django 寫個用戶管理頁面

 

1. 新建一個app01

python manage.py startapp app01


1 # 在 project 在外層 urls 的配置:

from django.contrib import admin
from django.urls import path
from django.conf.urls import url,include
#from . import views
from app01 import views


urlpatterns = [
    url(r'^admin/', admin.site.urls),
    # 訪問 cmdb 時候匹配到 app01 的url
    url(r'^cmdb/', include("app01.urls")),
    url(r'^monitor/', include("app02.urls")),
]


2 # 配置settings.py 文件

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    #'django.middleware.csrf.CsrfViewMiddleware',  #註釋這樣,用來解決跨域問題
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

# 配置數據庫連接
DATABASES = {
    'default': {
        #'ENGINE': 'django.db.backends.sqlite3',
        #'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
        'ENGINE': 'django.db.backends.mysql',    # 數據庫引擎
        'NAME': 'project2', # 數據庫名稱
        'HOST': '192.168.0.90', # 數據庫地址,本機 ip 地址 127.0.0.1
        'PORT': 3306, # 端口
        'USER': 'cs',  # 數據庫用戶名
        'PASSWORD': 'cs123',
        'OPTIONS': {
            'isolation_level': "repeatable read",
        },
    }
}

# 配置靜態文件位置

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



3 #  project 的 __init__.py  修改mysql 信息 

import  pymysql

pymysql.install_as_MySQLdb()

 

2. 編寫app01 的models 文件

from django.db import models

# Create your models here.

class  UserGroup (models.Model):
    uid = models.AutoField(primary_key=True)
    caption = models.CharField(max_length=32,unique=True)
    ctime = models.DateTimeField(auto_now_add=True, null=True)
    uptime = models.DateTimeField(auto_now=True, null=True)
   

class UserInfo (models.Model):
    username = models.CharField(max_length=32)
    password = models.CharField(max_length=32)


# 會在 mysql 裏面生成這兩張表

 3 . 編寫app01 的 views.py 文件

     實現通過頁面查詢查詢、刪除、修改功能

from django.shortcuts import render,HttpResponse,redirect
from django.views import View
from app01 import models
#class Home(View):


def detail(request, nid):
    detail_info = USER_DICT[nid]
    #obj = models.UserInfo.objects.filter(id=nid).first()
     
    return render(request, 'detail.html', {'obj': detail_info})

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

def user_info(request):
    if request.method == "GET":
        user_list = models.UserInfo.objects.all()

        #group_list = models.UserGroup.objects.all()

        return render(request, 'user_info.html', {'user_list': user_list})
    elif request.method == 'POST':
        u = request.POST.get('user')
        p = request.POST.get('pwd')
        models.UserInfo.objects.create(username=u, password=p)
        return redirect('/cmdb/user_info/')

def user_detail(request, nid):
    obj = models.UserInfo.objects.filter(id=nid).first()
    
    return render(request, 'user_detail.html', {'obj': obj})

def user_del(request, nid):
    models.UserInfo.objects.filter(id=nid).delete()
    return redirect('/cmdb/user_info/')

def user_edit(request, nid):
    if request.method == "GET":
        obj = models.UserInfo.objects.filter(id=nid).first()
        return render(request, 'user_edit.html',{'obj': obj})
    elif request.method == "POST":
        nid = request.POST.get('id')
        u = request.POST.get('username')
        p = request.POST.get('password')
        models.UserInfo.objects.filter(id=nid).update(username=u,password=p)
        return redirect('/cmdb/user_info/')



  

4. 編寫html 頁面

  4.1  user_info.html 

 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
body{
margin: 0;
}
.menu{
display: block;
padding: 5px;
">darkgreen;

}
</style>
</head>
<body>
<div style="height: 48px;">black;color: white">
userinfo
</div>
<div>
<div style="position: absolute;top:48px;bottom: 0;left: 0;width: 200px;">lightblue;">
<a class="menu" href="/cmdb/user_info/">用戶管理</a>
<a class="menu" href="/cmdb/user_group/">用戶組管理</a>
</div>
<div style="position:absolute;top:48px;left: 210px;bottom: 0;right: 0;overflow: auto">

<h3>添加用戶</h3>
<form method="POST" action="/cmdb/user_info/">
<input type="text" name="user" />
<input type="text" name="pwd" />

<select name="group_id">
{% for item in group_list %}
<option value="{{ item.uid }}">{{ item.caption }}</option>
{% endfor %}
</select>

<input type="submit" value="添加"/>
</form>

<h3>用戶列表</h3>
<ul>
{% for row in user_list %}
<li>
<a href="/cmdb/userdetail-{{ row.id }}/">{{ row.username }}</a> |
<span> {{ row.user_group.caption }} </span>
<a href="/cmdb/userdel-{{ row.id }}/">刪除</a> |
<a href="/cmdb/useredit-{{ row.id }}/">編輯</a>
</li>
{% endfor %}
</ul>
</div>

</div>

</body>
</html>

 4.2 用戶編輯 user_edit.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            margin: 0;
        }
        .menu{
            display: block;
            padding: 5px;

        }
    </style>
</head>
<body>
    <div style="height: 48px;background-color: black;color: white">
        用戶編輯
    </div>
    <div>
        <div style="position: absolute;top:48px;bottom: 0;left: 0;width: 200px;background-color: brown;">
            <a class="menu" href="/cmdb/user_info/">用戶管理</a>
            <a class="menu" href="/cmdb/user_group/">用戶組管理</a>
        </div>
        <div style="position:absolute;top:48px;left: 210px;bottom: 0;right: 0;overflow: auto">

            <h1>編輯用戶</h1>
            <form method="post" action="/cmdb/useredit-{{ obj.id }}/">
                <input style="display: none" type="text" name="id" value="{{ obj.id }}" />
                <input type="text" name="username" value="{{ obj.username }}" />
                <input type="text" name="password" value="{{ obj.password }}"/>
                <input type="submit" value="提交" />
            </form>
        </div>

    </div>

</body>
</html>

  4.3  用戶詳細信息 user_detail.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            margin: 0;
        }
        .menu{
            display: block;
            padding: 5px;

        }
    </style>
</head>
<body>
    <div style="height: 48px;background-color: black;color: white">
        user-detail
    </div>
    <div>
        <div style="position: absolute;top:48px;bottom: 0;left: 0;width: 200px;background-color: brown;">
            <a class="menu" href="/cmdb/user_info/">用戶管理</a>
            <a class="menu" href="/cmdb/user_group/">用戶組管理</a>
        </div>
        <div style="position:absolute;top:48px;left: 210px;bottom: 0;right: 0;overflow: auto">

            <h1>用戶詳細信息</h1>

            <h5>{{ obj.id }}</h5>
            <h5>{{ obj.name }}</h5>
            <h5>{{ obj.password }}</h5>

        </div>

    </div>

  

5.  效果驗證

 點擊刪除 會把用戶刪除 ,點擊用戶名字 顯示 用戶的id 和密碼信息

 

 編輯

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章