当前位置: 首页 > news >正文

基于Django+MySQL的智慧校园系统

此项目基于Django + MySQL + HTML + CSS + JS + jQuery + bootstrap

实现的功能有

  • 学生管理
  • 部门管理
  • 代办清单管理
  • 校园论坛
  • 校园医疗服务
  • 校园看点
  • 校园生活助手
  • 常用功能入口

1. 一些注意点

1. 页面body会自动有一些边界距,处理方法:
<head><style>body{			<---margin:0;	<---}				<---</style>
</head>       
2. 当html中部分语句样式为float时,记得在最后一定清除
<body><div class="header"><div class="menu">菜单</div><div class="account">账户</div><!--有浮动一定记得最后的清除 --><div style="clear: both"></div>		<------- **</div>
</body>
3. 内容居中
  • 区域居中
.c1{width: 200px;			# 注意,*这里宽度必须指定*margin: 0 auto;			# 上下边距为0,左右自动居中
}
  • 文本居中
<div style="width: 2000px; text-align: center;">摩西摩西</div>
4. 如果想用别人的样式

在这里插入图片描述

5. 块级和行内标签
  • 块级
  • 行内
  • css样式:标签 -> display:inline-block

示例:行内&块级特性

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.c1{display: inline-block;height: 100px;width: 300px;border: 1px solid red;}</style>
</head>
<body><span class="c1">中国</span><span class="c1">联通</span><span class="c1">联通</span><span class="c1">联通</span>
</body>
</html>

示例:块级和行内标签的设置

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style></style>
</head>
<body><div style="display: inline;">中国</div><span style="display: block;">联通</span>
</body>
</html>

2.快速开发网站

pip install flask
from flask import Flaskapp = Flask(__name__)# 创建了网址 /show/info 和 函数index 的对应关系
# 以后用户在浏览器上访问 /show/info,网站自动执行 index
@app.route("/show/info")
def index():return "中国联通"if __name__ == '__main__':app.run()
  • Flask框架为了让咱们写标签方便,支持将字符串写入到文件里。

  •   from flask import Flask,render_templateapp = Flask(__name__)@app.route("/show/info")def index():# Flask内部会自动打开这个文件,并读取内容,将内容给用户返回。# 默认:去当前项目目录的templates文件夹中找。return render_template("index.html")if __name__ == '__main__':app.run()
    

3.浏览器能识别的标签

2.1 编码(head)

<meta charset="UTF-8">

2.2 标题

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>我的联通</title>
</head>
<body><h1>1级标题</h1><h2>2级标题</h2><h3>3级标题</h3><h4>4级标题</h4><h5>5级标题</h5><h6>6级标题</h6>
</body>
</html>

2.3 div和span

<div>内容</div><span>asdfa</span>
  • div,一个人占一整行。【块级标签】

    <!DOCTYPE html>
    <html lang="en">
    <head><meta charset="UTF-8"><title>我的联通</title>
    </head>
    <body><div>山东蓝翔</div><div>挖掘机哪家强</div>
    </body>
    </html>
    
  • span,自己多大占多少。【行内标签、内联标签】

    <!DOCTYPE html>
    <html lang="en">
    <head><meta charset="UTF-8"><title>我的联通</title>
    </head>
    <body><span>山东蓝翔</span><span>挖掘机哪家强</span>
    </body>
    </html>

    2.4.5 超链接

    跳转到其他网站
    <a href="http://www.chinaunicom.com.cn/about/about.html">点击跳转</a>
    
    跳转到自己网站其他的地址<a href="http://127.0.0.1:5000/get/news">点击跳转</a>
    <a href="/get/news">点击跳转</a>
    
    # 当前页面打开
    <a href="/get/news">点击跳转</a># 新的Tab页面打开
    <a href="/get/news" target="_blank">点击跳转</a>
    

    2.4.6 图片

    <img src="图片地址" />
    
    直接显示别人的图片地址(防盗链):
    <img src="https://pic4.zhimg.com/v2-b23f984c2aeaa7bed12e890b4338d499_720w.jpg" />
    
    <img src="自己图片的地址" />
    显示自己的图片:- 自己项目中创建:static目录,图片要放在static- 在页面上引入图片<img src="/static/wbq.png" />
    

    关于设置图片的高度和宽度

    <img src="图片地址" style="height:100px; width:200px;" />
    <img src="图片地址" style="height:10%; width:20%;" />
    

    小结

    • 学习的标签

      <h1></h1>
      <div></div>
      <span></span>
      <a></a>
      <img />
      
    • 划分

      - 块级标签<h1></h1><div></div>
      - 行内标签<span></span><a></a><img />
      
    • 嵌套

      <div><span>xxx</span><img /><a></a>
      </div>
      

2.4.7 列表

<ul><li>中国移动</li><li>中国联通</li><li>中国电信</li>
</ul>
<ol><li>中国移动</li><li>中国联通</li><li>中国电信</li>
</ol>

在这里插入图片描述

2.4.8 表格

<table><thead><tr>  <th>ID</th>  <th>姓名</th>   <th>年龄</th>  </tr></thead><tbody><tr>  <td>10</td>  <td>武沛齐</td>  <td>19</td>   </tr><tr>  <td>11</td>  <td>吴阳军</td>  <td>19</td>   </tr><tr>  <td>12</td>  <td>刘东</td>  <td>19</td>    </tr><tr>  <td>13</td>  <td>郭智</td>  <td>19</td>    </tr><tr>  <td>14</td>  <td>电摩</td>  <td>19</td>    </tr></tbody>
</table>

2.4.9 input系列(7个)

<input type="text" />
<input type="password">    
<input type="file"> <input type="radio" name="n1"><input type="radio" name="n1"><input type="checkbox">篮球
<input type="checkbox">足球
<input type="checkbox">乒乓球
<input type="checkbox">棒球<input type="button" value="提交">  -->普通的按钮
<input type="submit" value="提交">  -->提交表单

2.4.10 下拉框

<select><option>北京</option><option>上海</option><option>深圳</option>
</select><select multiple><option>北京</option><option>上海</option><option>深圳</option>
</select>

2.4.11 多行文本

<textarea></textarea>

2.4.12网络请求

  • 在浏览器的URL中写入地址,点击回车,访问。

    浏览器会发送数据过去,本质上发送的是字符串:
    "GET /explore http1.1\r\nhost:...\r\nuser-agent\r\n..\r\n\r\n"浏览器会发送数据过去,本质上发送的是字符串:
    "POST /explore http1.1\r\nhost:...\r\nuser-agent\r\n..\r\n\r\n数据库"
    
  • 浏览器向后端发送请求时

    • GET请求【URL方法 / 表单提交】

      • 现象:GET请求、跳转、向后台传入数据数据会拼接在URL上。

        https://www.sogou.com/web?query=安卓&age=19&name=xx
        

        注意:GET请求数据会在URL中体现。

    • POST请求【表单提交】

      • 现象:提交数据不在URL中而是在请求体中。

注意点:

.sub-header .logo a {margin-top: 22px;display: inline-block	<!-- 块级标签, a默认为行内标签,无法实现一行浮动 -->
}.sub-header .menu-list a{display: inline-block;padding: 0 10px;	<!-- 填补下内边距,使得鼠标在链接对应字体外一定距离也能点击跳转 -->color: #333;font-size: 16px;text-decoration: none;	<!-- 取消链接下默认的下划线 -->
}.sub-header .menu-list a:hover{		<!--- 鼠标移动到链接对应入口处变色 --->color: #ff6700;
}
  • a标签是行内标签,行内标签的高度、内外边距,默认无效。

  • 垂直方向居中

    • 本文 + line-height
    • 图片 + 边距
  • a标签默认有下划线。 - - - > text-decoration: none

  • 鼠标放上去之后hover

    .c1:hover{...
    }
    a:hover{}
    

登录验证

加密

首先导入下方代码用md5实现加密

from django.conf import settings
import hashlibdef md5(data_string):obj = hashlib.md5(settings.SECRET_KEY.encode('utf-8'))obj.update(data_string.encode('utf-8'))return obj.hexdigest()

在这里插入图片描述

登录 and 确认登录

from django import forms
from app01.utils.bootstrap import BootStrapModelForm
class AdmiModelnForm(BootStrapModelForm):confirm_password = forms.CharField(label="确认密码",widget=forms.PasswordInput())class Meta:model = models.Adminfields = ["username", 'password', 'confirm_password']widgets = {'password': forms.PasswordInput()}def clean_password(self):pwd = self.cleaned_data.get('password')return md5(pwd)def clean_confirm_password(self):pwd = self.cleaned_data.get('password')confirm = md5(self.cleaned_data.get('confirm_password'))if pwd != confirm:raise ValidationError("密码不一致,请重新输入")return confirm  # 这里返回要存入数据库的密码def admin_add(request):title = "新建管理员"if request.method == 'GET':form = AdmiModelnForm()return render(request, 'change.html', {'form': form, "title": title})form = AdmiModelnForm(request.POST)if form.is_valid():form.save()return redirect('/admin/list/')return render(request, 'change.html', {'form': form, "title": title})

检验之前是否登录过:

登录成功后:

  • cookie,随机字符串
  • session,用户信息

在其他需要登录才能访问的页面中,都需要加入:

def index(request):info = request.session.get("info")if not info:return redirect('/login/')...

目标:在18个视图函数前面统一加入判断。

info = request.session.get("info")
if not info:return redirect('/login/')

功能太多一个一个复制太繁琐,django自带封装的中间件可以用

图片验证码

效果如下:

在这里插入图片描述

逻辑如下:
import random
from PIL import Image, ImageDraw, ImageFont, ImageFilterdef check_code(width=120, height=30, char_length=5, font_file='Monaco.ttf', font_size=28):code = []img = Image.new(mode='RGB', size=(width, height), color=(255, 255, 255))draw = ImageDraw.Draw(img, mode='RGB')def rndChar():"""生成随机字母:return:"""# return str(random.randint(0, 9))return chr(random.randint(65, 90))def rndColor():"""生成随机颜色:return:"""return (random.randint(0, 255), random.randint(10, 255), random.randint(64, 255))# 写文字font = ImageFont.truetype(font_file, font_size)for i in range(char_length):char = rndChar()code.append(char)h = random.randint(0, 4)draw.text([i * width / char_length, h], char, font=font, fill=rndColor())# 写干扰点for i in range(40):draw.point([random.randint(0, width), random.randint(0, height)], fill=rndColor())# 写干扰圆圈for i in range(40):draw.point([random.randint(0, width), random.randint(0, height)], fill=rndColor())x = random.randint(0, width)y = random.randint(0, height)draw.arc((x, y, x + 4, y + 4), 0, 90, fill=rndColor())# 画干扰线for i in range(5):x1 = random.randint(0, width)y1 = random.randint(0, height)x2 = random.randint(0, width)y2 = random.randint(0, height)draw.line((x1, y1, x2, y2), fill=rndColor())img = img.filter(ImageFilter.EDGE_ENHANCE_MORE)return img, ''.join(code)
定义调用函数
def image_code(request):"""生成图片验证码"""# 调用pillow 函数, 生成图片img, code_str = check_code()print(code_str)# 写入到session中,以便于或许获取再次验证request.session['image_code'] = code_str# 给session设置60s超时request.session.set_expiry(60)stream = BytesIO()img.save(stream, 'png')return HttpResponse(stream.getvalue())

连着两天几乎一动不动的在电脑旁做系统,emm………

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述
想要源码可以关注下等待后续…

相关文章:

基于Django+MySQL的智慧校园系统

此项目基于Django MySQL HTML CSS JS jQuery bootstrap实现的功能有 学生管理部门管理代办清单管理校园论坛校园医疗服务校园看点校园生活助手常用功能入口 1. 一些注意点 1. 页面body会自动有一些边界距&#xff0c;处理方法&#xff1a; <head><style>b…...

Linux基础指令(一)

前言 Linux基础指令主要学习&#xff1a;对目录、文件、压缩包、匹配查找&#xff0c;权限等操作 第一次接触ubuntu需要知道的基本知识 sudo passwd root 先给root用户设置密码 su root 切换到root用户 su zhangsan …...

三极管十大品牌

三极管十大品牌-三极管品牌-晶体三极管哪个品牌好-Maigoo品牌榜...

需求记录(共享元素)

MainActivity1 列表展示&#xff0c;使用共享元素完成页面间的切换 package com.example.animactivity;import android.annotation.SuppressLint; import android.app.ActivityOptions; import android.content.Intent; import android.os.Build; import android.os.Bundle; i…...

.Net 使用 MongoDB

安装nuget包 MongoDB.Driver 简单代码 using MongoDB.Bson; using MongoDB.Driver; using System.Buffers; using System.Collections.Concurrent; using System.Diagnostics;namespace ConsoleApp4 {internal class Program{static void Main(string[] args){var client = ne…...

【TensorFlow深度学习】值函数估计:蒙特卡洛方法与TD学习

值函数估计&#xff1a;蒙特卡洛方法与TD学习 值函数估计&#xff1a;蒙特卡洛方法与TD学习的深度探索蒙特卡洛方法时序差分学习(TD)Python代码示例结论 值函数估计&#xff1a;蒙特卡洛方法与TD学习的深度探索 在强化学习的奇妙世界里&#xff0c;值函数估计扮演着至关重要的…...

成功解决ModuleNotFoundError: No module named ‘cv2’

成功解决ModuleNotFoundError: No module named ‘cv2’ &#x1f308; 欢迎莅临我的个人主页&#x1f448;这里是我深耕Python编程、机器学习和自然语言处理&#xff08;NLP&#xff09;领域&#xff0c;并乐于分享知识与经验的小天地&#xff01;&#x1f387; &#x1f393;…...

中国蚁剑 安装教程 2024年5月

2024/5/11 中国蚁剑 安装教程 一、下载中国蚁剑的加载器和核心源码&#xff08;两个都要用到&#xff09; github官方下载地址&#xff1a;https://github.com/AntSwordProject/ 参考文档&#xff1a;antSword/README_CN.md at master AntSwordProject/antSword GitHub 核…...

Golang-分离式加载器(传参)AES加密

目录 enc.go 生成: dec.go --执行dec.go...--上线 cs生成个c语言的shellcode. enc.go go run .\enc.go shellcode 生成: --key为公钥. --code为AES加密后的数据, ----此脚本每次运行key和code都会变化. package mainimport ("bytes""crypto/aes"&…...

速览三版HTTP的改进策略

HTTP&#xff08;Hypertext Transfer Protocol&#xff09;是互联网通信的基础协议&#xff0c;自从其第一个版本推出以来&#xff0c;经历了多个版本的改进&#xff0c;每个版本都针对之前的不足进行了优化和增强。以下是HTTP/1.1、HTTP/2和HTTP/3的主要改进总结&#xff1a; …...

window.open(“.html“,“_blank“) 执行是下载,并没有打开新窗口显示html

window.open() 方法在浏览器中打开一个新窗口或者新标签页。如果你的 .html 文件被下载而不是在新窗口中打开&#xff0c;那可能是因为服务器的响应头设置了 Content-Disposition: attachment&#xff0c;这会导致浏览器把响应的内容作为一个文件下载。 如果你有权限修改服务器…...

【QT5.14.2】编译MQTT库example的时候报No such file or directory

【QT5.14.2】编译MQTT库example的时候报No such file or directory 前几天导师让跑一下MQTT库&#xff0c;用的5.14.2版本的QT&#xff0c;于是就上网搜了一个教程&#xff1a;https://www.bilibili.com/video/BV1dH4y1e7hG/?spm_id_from333.337.search-card.all.click&v…...

【数据结构】前缀树(字典树)汇总

基础 {“a”,“abc”,“bac”,“bbc”,“ca” }的字典树如下图&#xff1a; 最主用的应用&#xff1a;一&#xff0c;字符串编码。二&#xff0c;位运算。 字符串编码 相比利用哈希映射编码&#xff0c;优点如下&#xff1a; 依次查询长度为n的字符串s的前缀时间复杂度是O(…...

Linux:基础开发工具

文章目录 Linux 软件包管理器 yum什么是软件包关于rzsz查看软件包安装软件卸载软件安装扩展源 Linux 编辑器 vimvim的基本概念正常/普通/命令模式(Normal mode)插入模式(Insert mode)底行模式(last line mode) vim的基本操作[命令模式]切换至[插入模式][插入模式]切换至[命令模…...

HarmonyOS NEXT Push接入

接入HarmonyOS NEXT Push 推送功能&#xff0c;相比于 Android 真的是简单太多。不再需要适配接入各个厂家的推送 SDK&#xff0c;真是舒服。 1.开通推送服务与配置Client ID 1.1 创建应用获取Client ID 按照官方文档来就可以了&#xff1a;https://developer.huawei.com/co…...

如何快速入门Element-UI:打造高效美观的前端界面

Element-UI 是一款基于 Vue.js 的开源组件库,提供了丰富的 UI 组件,可以帮助开发者快速构建美观、响应式的前端界面。本文将详细介绍如何快速入门 Element-UI,包括环境搭建、组件使用、样式定制及常见问题解决方法,帮助你高效地使用 Element-UI 进行前端开发。 一、环境搭…...

Langchain的向量存储 - Document示例代码里的疑问

文章目录 前言一、语句分析二、 举例解释三、 完整代码总结 前言 之前的代码里有下面这句话&#xff0c;可能有看不明白的读者。 vectors [embeddings.embed(doc.page_content) for doc in docs]今天一起来看下这句话。 一、语句分析 这句话实际上是一个列表推导式&#x…...

Docker 教程-介绍-2

快速了解docker有什么。 Docker简介 Docker 是一个开源的应用容器引擎&#xff0c;基于Go语言开发&#xff0c;并遵循Apache 2.0协议。它允许开发者将应用及其依赖包打包进一个可移植的容器中&#xff0c;这些容器可以发布到任何支持Docker的Linux或Windows机器上&#xff0c…...

【2024最新华为OD-C/D卷试题汇总】[支持在线评测] 伐木工(200分) - 三语言AC题解(Python/Java/Cpp)

🍭 大家好这里是清隆学长 ,一枚热爱算法的程序员 ✨ 本系列打算持续跟新华为OD-C/D卷的三语言AC题解 💻 ACM银牌🥈| 多次AK大厂笔试 | 编程一对一辅导 👏 感谢大家的订阅➕ 和 喜欢💗 📎在线评测链接 伐木工(200分) 🌍 评测功能需要订阅专栏后私信联系清隆解…...

UltraScale+系列模块化仪器,可以同时用作控制器、算法加速器和高速数字信号处理器

基于 XCZU7EG / XCZU4EG / XCZU2EG • 灵活的模块组合 • 易于嵌入的紧凑型外观结构 • 高性能的 ARM Cortex 处理器 • 成熟的 FPGA 可编程逻辑 &#xff0c;基于 IP 核的软件库 基于 Xilinx Zynq UltraScaleMPSoC 的 FPGA 技术&#xff0c;采用 Xilinx Zynq UltraScale&a…...

RestClient

什么是RestClient RestClient 是 Elasticsearch 官方提供的 Java 低级 REST 客户端&#xff0c;它允许HTTP与Elasticsearch 集群通信&#xff0c;而无需处理 JSON 序列化/反序列化等底层细节。它是 Elasticsearch Java API 客户端的基础。 RestClient 主要特点 轻量级&#xff…...

网络六边形受到攻击

大家读完觉得有帮助记得关注和点赞&#xff01;&#xff01;&#xff01; 抽象 现代智能交通系统 &#xff08;ITS&#xff09; 的一个关键要求是能够以安全、可靠和匿名的方式从互联车辆和移动设备收集地理参考数据。Nexagon 协议建立在 IETF 定位器/ID 分离协议 &#xff08;…...

盘古信息PCB行业解决方案:以全域场景重构,激活智造新未来

一、破局&#xff1a;PCB行业的时代之问 在数字经济蓬勃发展的浪潮中&#xff0c;PCB&#xff08;印制电路板&#xff09;作为 “电子产品之母”&#xff0c;其重要性愈发凸显。随着 5G、人工智能等新兴技术的加速渗透&#xff0c;PCB行业面临着前所未有的挑战与机遇。产品迭代…...

从零实现富文本编辑器#5-编辑器选区模型的状态结构表达

先前我们总结了浏览器选区模型的交互策略&#xff0c;并且实现了基本的选区操作&#xff0c;还调研了自绘选区的实现。那么相对的&#xff0c;我们还需要设计编辑器的选区表达&#xff0c;也可以称为模型选区。编辑器中应用变更时的操作范围&#xff0c;就是以模型选区为基准来…...

8k长序列建模,蛋白质语言模型Prot42仅利用目标蛋白序列即可生成高亲和力结合剂

蛋白质结合剂&#xff08;如抗体、抑制肽&#xff09;在疾病诊断、成像分析及靶向药物递送等关键场景中发挥着不可替代的作用。传统上&#xff0c;高特异性蛋白质结合剂的开发高度依赖噬菌体展示、定向进化等实验技术&#xff0c;但这类方法普遍面临资源消耗巨大、研发周期冗长…...

dedecms 织梦自定义表单留言增加ajax验证码功能

增加ajax功能模块&#xff0c;用户不点击提交按钮&#xff0c;只要输入框失去焦点&#xff0c;就会提前提示验证码是否正确。 一&#xff0c;模板上增加验证码 <input name"vdcode"id"vdcode" placeholder"请输入验证码" type"text&quo…...

高等数学(下)题型笔记(八)空间解析几何与向量代数

目录 0 前言 1 向量的点乘 1.1 基本公式 1.2 例题 2 向量的叉乘 2.1 基础知识 2.2 例题 3 空间平面方程 3.1 基础知识 3.2 例题 4 空间直线方程 4.1 基础知识 4.2 例题 5 旋转曲面及其方程 5.1 基础知识 5.2 例题 6 空间曲面的法线与切平面 6.1 基础知识 6.2…...

P3 QT项目----记事本(3.8)

3.8 记事本项目总结 项目源码 1.main.cpp #include "widget.h" #include <QApplication> int main(int argc, char *argv[]) {QApplication a(argc, argv);Widget w;w.show();return a.exec(); } 2.widget.cpp #include "widget.h" #include &q…...

【配置 YOLOX 用于按目录分类的图片数据集】

现在的图标点选越来越多&#xff0c;如何一步解决&#xff0c;采用 YOLOX 目标检测模式则可以轻松解决 要在 YOLOX 中使用按目录分类的图片数据集&#xff08;每个目录代表一个类别&#xff0c;目录下是该类别的所有图片&#xff09;&#xff0c;你需要进行以下配置步骤&#x…...

Linux --进程控制

本文从以下五个方面来初步认识进程控制&#xff1a; 目录 进程创建 进程终止 进程等待 进程替换 模拟实现一个微型shell 进程创建 在Linux系统中我们可以在一个进程使用系统调用fork()来创建子进程&#xff0c;创建出来的进程就是子进程&#xff0c;原来的进程为父进程。…...