from django.db import models
# Create your models here.
from django.db import models
from django.contrib.auth.models import AbstractUser
# 使用了django原生的user表
class UserInfo(AbstractUser):
tel = models.CharField(max_length=32)
# 会议室表
class Room(models.Model):
"""
会议室表
"""
caption = models.CharField(max_length=32) # 会议室名称
num = models.IntegerField() # 容纳人数
def __str__(self):
return self.caption
# 预定信息
class Book(models.Model):
"""
会议室预定信息
"""
user = models.ForeignKey('UserInfo', on_delete=models.CASCADE) # 预定的人
room = models.ForeignKey('Room', on_delete=models.CASCADE) # 预定的房间
date = models.DateField() # 预定会议室时间
# 这里只是定义了一个元祖而已
time_choices = (
(1, '8:00'),
(2, '9:00'),
(3, '10:00'),
(4, '11:00'),
(5, '12:00'),
(6, '13:00'),
(7, '14:00'),
(8, '15:00'),
(9, '16:00'),
(10, '17:00'),
(11, '18:00'),
(12, '19:00'),
(13, '20:00'),
)
time_id = models.IntegerField(choices=time_choices)
class Meta:
# 联合唯一不能重复,限制了不能一个时间出现2次预定
unique_together = (
('room', 'date', 'time_id'),
)
def __str__(self):
return str(self.user) + "预定了" + str(self.room)
from django.shortcuts import render, HttpResponse, redirect
from app01 import models
from django.contrib import auth
import datetime
import json
# Create your views here.
def login(request):
if request.method == "POST":
user = request.POST.get("user")
pwd = request.POST.get("pwd")
print(user, pwd)
user = auth.authenticate(username=user, password=pwd)
print(user)
if user:
auth.login(request, user) # request.user 将user的值注册到session中
return redirect("/index/")
return render(request, "login.html")
def index(request):
# 取到当前日期
date = datetime.datetime.now().date()
# 接受前端post数据更新数据库
if request.method == "POST":
Book_add = json.loads(request.POST.get("Book_add"))
Book_del = json.loads(request.POST.get("Book_del"))
# 定义一个返回前端的字典
book_stadus = {"stadus": 0, "msg": ""}
# 删除数据
if Book_del:
print(Book_del)
for k, v in Book_del.items():
for time_id in v:
models.Book.objects.filter(room_id=k, time_id=time_id).delete()
book_stadus['stadus'] = 1
book_stadus['msg'] = "取消成功预定成功"
# 添加数据库
if Book_add:
for k, v in Book_add.items():
for time_id in v:
add_book = models.Book.objects.create(user_id=request.user.pk, date=date, room_id=k,
time_id=time_id)
book_stadus['stadus'] = 2
book_stadus['msg'] = "添加预定成功"
return HttpResponse(json.dumps(book_stadus))
time_choices = models.Book.time_choices
room_list = models.Room.objects.all()
# 取到当前时间的值
book_list = models.Book.objects.filter(date=date)
# 在前端模板系统页面所实现的功能有限，后端好一些
htmls = ""
# 取到了所有的会议室和数量
# [<Room: 301 会议室>, <Room: 302会议室>, <Room: 303会议室>, <Room: 304会议室>, <Room: 305会议室>, <Room: 306会议室>]
for room in room_list:
htmls += "<tr><td>{}({})</td>".format(room.caption, room.num)
# 1~13点的选择
for time_choice in time_choices:
flag = False
# 找到今天已经预定的房间的pk值
for book in book_list:
if book.room.pk == room.pk and book.time_id == time_choice[0]:
# 意味着这个单元格已经被预定了
flag = True
break
if flag:
if request.user.pk == book.user.pk:
htmls += "<td class='active click_event users' room_id={} time_id={}>{}</td>".format(room.pk,
time_choice[
0],
book.user.username)
else:
htmls += "<td class='another_active ' room_id={} time_id={}>{}</td>".format(room.pk,
time_choice[0],
book.user.username)
else:
# 每一个方格上都让他有自己的id值
htmls += "<td class='click_event ' room_id={} time_id={}></td>".format(room.pk, time_choice[0])
htmls += "</tr>"
return render(request, "index.html", locals())
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--配置手机端适应-->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!--配置css文件 核心CSS样式压缩文件-->
<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/font-awesome-4.7.0/css/font-awesome.css">
<!--配置jQuery-->
<script src="/static/bootstrap/jQuery.js"></script>
<!--配置 核心Boot script JS压缩文件-->
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
<style>
.active {
{#优先级问题#} background-color: orange !important;
}
.another_active {
background-color: #2b669a;
color: white;
}
#msg {
position: relative;
top: 0px;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-13 col-md-offset-0">
<h3>会议室预定系统({{ date|date:"Y-m-d " }})</h3>
<table class="table table-bordered table table-striped">
<thead>
<tr>
<th>会议室/时间</th>
{% for time in time_choices %}
<th>{{ time.1 }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{{ htmls|safe }} <!--需要在后端做-->
</tbody>
</table>
<span id="msg" class="pull-right"></span>
<div>
<button id="updata_meeting" type="submit" class="btn btn-success pull-right">确认提交</button>
</div>
</div>
</div>
</div>
{% csrf_token %}
</body>
<script>
//获取选中会议室的数据(最难)
var POST_DATA = {
// 定义了一个添加的列表和一个删除的列表
"ADD_room": {},
"DEL_room": {},
};
// 给每个时间格子绑定点击事件
$(".click_event").on("click", function () {
// 在点击的一瞬间
var room_id = $(this).attr("room_id");
var time_id = $(this).attr("time_id");
{#alert($(this).hasClass('active'));#}
//点击后将添加颜色
if ($(this).hasClass('active')) {
$(this).removeClass('active');
$(this).text('');
// 如果点击取消的值是当前登录用户已经选择的会议室
if ($(this).hasClass('users')) {
if (POST_DATA.DEL_room[room_id]) {
POST_DATA.DEL_room[room_id].push(time_id)
}
else {
// time_id必须定义一个列表 方便点击push放值
POST_DATA.DEL_room[room_id] = [time_id];
}
}
else {
POST_DATA.ADD_room[room_id].pop(time_id);
//如果当前的列表为空，我就把key也删除
if (POST_DATA.ADD_room[room_id].length === 0) {
delete POST_DATA.ADD_room[room_id]
}
}
}
else {
if ($(this).hasClass('users')) {
$(this).addClass('active');
$(this).text('{{ request.user }}');
//应为他已经是选择好的，所以把他删除了
delete POST_DATA.DEL_room[room_id]
}
else {
$(this).addClass('active');
$(this).text('{{ request.user }}');
if (POST_DATA.ADD_room[room_id]) {
POST_DATA.ADD_room[room_id].push(time_id)
}
else {
// time_id必须定义一个列表 方便点击push放值
POST_DATA.ADD_room[room_id] = [time_id];
}
}
}
});
//向后端发送数据
$("#updata_meeting").on("click", function () {
$.ajax({
url: "/index/",
type: "POST",
data: {
//当时对象的时候一点要记得json一下在发送过去
'csrfmiddlewaretoken': $("input[name='csrfmiddlewaretoken']").val(),
"Book_add": JSON.stringify(POST_DATA.ADD_room),
"Book_del": JSON.stringify(POST_DATA.DEL_room),
},
success: function (arg) {
arg = JSON.parse(arg);
if (arg.stadus == 2) {
$("#msg").text(arg.msg);
$("#msg").css('color', 'hotpink');
var t1 = window.setTimeout(function () {
$("#msg").text("");
}, 2000)
}
else {
$("#msg").text(arg.msg);
$("#msg").css('color', 'red');
var t1 = window.setTimeout(function () {
$("#msg").text("");
}, 2000)
}
$("#msg").text(arg.msg);
$("#msg").css('color', 'red');
var t1 = window.setTimeout(function () {
location.reload();
}, 3000)
}
});
//清空POST_DATA列表
//获取选中会议室的数据(最难)
POST_DATA = {
// 定义了一个添加的列表和一个删除的列表
"ADD_room": {},
"DEL_room": {},
}
})
</script>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--配置手机端适应-->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!--配置css文件 核心CSS样式压缩文件-->
<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/font-awesome-4.7.0/css/font-awesome.css">
<!--配置jQuery-->
<script src="/static/bootstrap/jQuery.js"></script>
<!--配置 核心Boot script JS压缩文件-->
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
<style>
.top_move{
margin-top: 100px;
}
</style>
</head>
<body>
<div class="container top_move">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<form action="/login/" method="post">
{% csrf_token %}
<p >
用户名: <input type="text" class="form-control" name="user">
</p>
<p >
密码: <input type="password" class="form-control" name="pwd">
</p>
<button type="submd" class="btn btn-success">提交</button>
</form>
</div>
</div>
</div>
</body>
</html>
