项目简介：
sysinfo 使用 Django 框架和 psutil 开发的一个中文版 Linux 服务器信息查看应用，可查看的信息包括系统、CPU、内存、硬盘、进程、网络、登录用户等，同时可查看并导出部分数据的图表。
项目地址：
https://gitee.com/sdsnzy/sys-info
1. 创建项目
1）创建项目：sysInfo
2）创建app：host
python manage.py startapp host
3）添加app到主配置文件并修改相应设置：
INSTALLED_APPS = [
'host',
]
LANGUAGE_CODE = 'zh-hans' # 修改语言
TIME_ZONE = 'Asia/Shanghai' # 修改时区
4）生成数据库表：
python manage.py makemigrations # 生成数据库迁移脚本（每次修改了数据库必备操作）
python manage.py migrate # 将迁移脚本写入数据库并创建数据库表
5）创建超级用户：
python manage.py createsuperuser
6）运行测试：这里设置端口为9999
python manage.py runserver 9999
访问：localhost:9999/admin
2. git 初始化
1）初始化git仓库管理：
git init
2）安装插件 .ignore，并生成python上传git项目需要忽略内容的文件 .gitignore
安装插件并忽略指定内容教程：https://blog.csdn.net/weixin_46069582/article/details/114595118
结果如下：
3）保存项目过程
git add * # 将本地增删改查的文件全部添加到暂存区
git commit -m "git 初始化" # 添加到本地仓库
git log # 查看提交日志
准备 README.md ：
1.导入此项目需要的包（最后完成时导入）
pip freeze > requirements.txt
2.创建 README.md
上传到gitee仓库：
1.在gitee中新建仓库sysInfo
2.关联仓库
git remote add origin https://gitee.com/sdsnzy/sys-info.git
3.首次上传
git push --set-upstream origin master -f
4.上传
git push
3. 项目基本架构
| 路由 | 视图函数 | 前端模板 |
|---|---|---|
| views.index | index.html | |
| user/ | views.user | user.html |
| cpu/ | views.cpu | cpu.html |
| memory/ | views.memory | memory.html |
| disk/ | views.disk | disk.html |
| network/ | views.network | network.html |
| process/ | views.process | process.html |
在cpu的信息展示时，包含三个界面
- cpu文字信息：cpu.html
- cpu折线图：cpu-line.html
- cpu扇形图：cpu-pie.html
4. 搭建项目框架
4.1 路由配置
1）主路由：sysInfo/urls.py
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('',include('host.urls')),
]
2）子路由：host/urls.py
from django.urls import path
from host.views import *
urlpatterns = [
path('', index, name='index'),
path('user/', user, name='user'),
path('cpu/', cpu, name='cpu'),
path('cpu/<str:chart>/', cpu, name='cpu'), # cpu信息的图形界面
path('memory/', memory, name='memory'),
path('disk/', disk, name='disk'),
path('network/', network, name='network'),
path('process/', process, name='process')
]
4.2 视图函数框架
host/views.py
from django.shortcuts import render
def index(request):
return render(request, 'host/index.html', locals())
def user(request):
return render(request, 'host/user.html', locals())
def cpu(request):
return render(request, 'host/cpu.html', locals())
def memory(request):
return render(request, 'host/memory.html', locals())
def disk(request):
return render(request, 'host/disk.html', locals())
def network(request):
return render(request, 'host/network.html', locals())
def process(request):
return render(request, 'host/process.html', locals())
4.3 前端框架
1）在 static 目录中，写入了静态文件：css框架、jQuery
2）添加静态文件到主配置：sysInfo/settings.py
STATICFILES_DIRS=[
BASE_DIR / "static",
]
3）创建前端界面文件框架（在 templates/host 目录下）
| html文件 | 描述 |
|---|---|
| base.html | 由于多界面的导航栏等大体较为相似，所以创建一个基本模板，不用重复造轮子 |
| index.html | 显示首页信息 |
| user.html | 显示用户信息 |
| cpu.html | 显示cpu信息 |
| memory.html | 显示内存信息 |
| disk.html | 显示磁盘信息 |
| network.html | 显示网络信息 |
| process.html | 显示进程 |
4.4 base框架模板
templates/host/base.html
<!DOCTYPE html>
<html {% block html_attribs %}{% endblock html_attribs %}>
<head>
{% block head %}
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %} {% endblock title %}</title>
<link rel="stylesheet" type="text/css" href="/static/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="/static/css/my-style.css">
<script src="/static/js/jquery-3.1.1.min.js"></script>
<!-- 在线cdn获取echarts工具-->
<script src="https://lib.baomitu.com/echarts/5.0.2/echarts.min.js"></script>
{% endblock head %}
</head>
<body>
<div class="sysinfo">
<div class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/">Sys Info</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">系统</a></li>
<li><a href="/cpu/">CPU</a></li>
<li><a href="/memory/">内存</a></li>
<li><a href="/disk/">硬盘</a></li>
<li><a href="/network/">网络</a></li>
<li><a href="/process/">进程</a></li>
<li><a href="/user/">用户</a></li>
</ul>
</div>
</div>
</div>
<div class="container">
{% block content %}{% endblock %}
</div>
</div>
</body>
</html>
4.5 自定义过滤器框架
自定义过滤器Django官方：https://docs.djangoproject.com/zh-hans/3.1/howto/custom-template-tags/
新建文件：host/templatetags/filter.py，将过滤器存放在此文件下
from django import template
from datetime import datetime
register = template.Library()