27-----BBS论坛
BBS论坛(二十七)
27.首页帖子列表布局完成
(1)apps/models.py
把帖子跟用户关联起来
class PostModel(db.Model):
__tablename__ = 'post'
id = db.Column(db.Integer, primary_key=True, autoincrement=True)
title = db.Column(db.String(200), nullable=False)
content = db.Column(db.Text, nullable=False)
create_time = db.Column(db.DateTime, default=datetime.now)
board_id = db.Column(db.Integer, db.ForeignKey('board.id'))
board = db.relationship('BoardModel', backref='posts')
author_id = db.Column(db.String(50), db.ForeignKey('front_user.id'), nullable=False)
author = db.relationship('FrontUser', backref='posts')
把之前数据库里面的帖子都删了,migrate、upgrade后重新发表新帖子
(2)front/views.py
apost添加author
@bp.route('/apost/', methods=['POST', 'GET'])
@login_requried
def apost():
#.... post.author = g.front_user
#....
return restful.params_error(message=form.get_error())
index里面渲染所有的帖子给前端
@bp.route('/')
def index():
banners = BannerModel.query.order_by(BannerModel.priority.desc()).limit(4)
boards = BoardModel.query.all()
posts = PostModel.query.all()
context = {
'banners':banners,
'boards':boards,
'posts':posts,
}
return render_template('front/front_index.html',**context)
(4)front/front_index.html
<ul class="post-group-head">
<li class="active"><a href="#">最新</a></li>
<li><a href="#">精华帖子</a></li>
<li><a href="#">点赞最多</a></li>
<li><a href="#">评论最多</a></li>
</ul> <ul class="post-list-group">
{% for post in posts %}
<li>
<div class="author-avatar-group">
<img src="{{ post.author.avatar or url_for('static',filename='common/images/logo.jpg') }}" alt="">
</div> <div class="post-info-group">
<p class="post-title">{{ post.title }}</p>
<p class="post-info">
<span>作者:{{ post.author.username }}</span>
<span>发表时间:{{ post.create_time }}</span>
<span>评论:0</span>
<span>阅读数 :0</span>
</p>
</div>
</li>
{% endfor %}
</ul>
(5)front/css/front_index.css
*{
margin:;
padding:;
vertical-align: baseline;
} .post-group{
border: 1px solid #ddd;
margin-top: 20px;
overflow: hidden;
border-radius: 5px;
padding: 10px;
} .post-group-head{
overflow: hidden;
list-style: none;
} .post-group-head li{
float: left;
padding: 5px 10px;
} .post-group-head a{
color: #333;
} .post-group-head li.active{
background: #ccc;
} .post-list-group{
margin-top: 20px;
} .post-list-group li{
overflow: hidden;
padding-bottom: 20px;
} .author-avatar-group{
float: left;
} .author-avatar-group img{
width: 50px;
height: 50px;
border-radius: 50%;
} .post-info-group{
float: left;
margin-left: 10px;
border-bottom: 1px solid #e6e6e6;
width: 85%;
padding-bottom: 10px;
} .post-info-group .post-info{
margin-top: 10px;
font-size: 12px;
color: #8c8c8c;
} .post-info span{
margin-right: 10px;
}
- 27.首页帖子列表布局完成
27-----BBS论坛的更多相关文章
- Python之路,Day17 - 分分钟做个BBS论坛
Python之路,Day17 - 分分钟做个BBS论坛 本节内容: 项目:开发一个简单的BBS论坛 需求: 整体参考"抽屉新热榜" + "虎嗅网" 实现不同 ...
- Python之路【第十八篇】Django小项目简单BBS论坛部分内容知识点
开发一个简单的BBS论坛 项目需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可被 ...
- python 学习笔记二十 django项目bbs论坛
项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...
- python第一百三十天 ---简单的BBS论坛
简单的BBS论坛 实现功能 git仓库地址:https://github.com/uge3/BBS 1.整体参考“抽屉新热榜” + “博客园” 2.实现不同论坛版块 3.帖子列表展示 4.个人博客主页 ...
- Django小项目简单BBS论坛
开发一个简单的BBS论坛 项目需求: 1 整体参考"抽屉新热榜" + "虎嗅网" 2 实现不同论坛版块 3 帖子列表展示 4 帖子评论数.点赞数展示 5 在线用 ...
- Python开发一个简单的BBS论坛
项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...
- bbs论坛浏览器兼容性问题
一直都是在chrome上进行调试,今天终于把bbs论坛这个项目搭建完了,进入IE.Firefox看了看 吓哭了!!! 火狐 Edge chrome 特别是加了<!DOCTYPE html> ...
- 开源BBS论坛软件推荐
七款开源BBS论坛软件推荐(1) 本文介绍了七个开源的BBS论坛软件(在英文界一般叫做Forum).可能国内的朋友们比较熟悉Discuz!和PHPwind,但其实我们的选择还是很多的,而且下面介绍的这 ...
- LNMP环境搭建BBS论坛及伪静态
我们在mysql备份 LNMP环境中的数据库迁移为独立的服务器的基础上搭建BBS论坛: [root@bqh-117 ~]# mysql -uroot -p123456 Welcome to the ...
- Django项目 BBS论坛
BBS论坛 一.项目表分析 二.自定义form组件 三.注册功能 四.BBS论坛 登录功能
随机推荐
- Windows系统 安装 Qt 5.7.0
Windows系统 安装 Qt 5.7.0 我们的电脑系统:Windows 10 64位 Qt5 软件:Qt 5. 7. 0 下载 Qt 5.7.0 软件 在这个网站里面,下载:Qt 5.7.0 fo ...
- spoj1716 Can you answer these queries III
传送门 (分析见正睿2018.10.1笔记) 代码 #include<iostream> #include<cstdio> #include<cstring> #i ...
- Luogu 3292 [SCOI2016]幸运数字
BZOJ 4568. 感觉很板. 前置技能:线性基. 放一篇感觉讲的比较丰富的博客: 戳这里. 首先要求在一个序列中任意选点使得异或和最大,当然是想到线性基了. 把问题转换到树上,如果每次询 ...
- [转]MySQL时间与字符串相互转换
转至:https://www.cnblogs.com/wangyongwen/p/6265126.html 时间.字符串.时间戳之间的互相转换很常用,但是几乎每次使用时候都喜欢去搜索一下用法:本文整理 ...
- linux手动安装配置mysql5.6
1.准备工作 ①官网下载:https://dev.mysql.com/downloads/mysql/5.6.html#downloads 下载之后上传到服务器. ②创建linux组用户 groupa ...
- c# 创建XML文档,解析XML文档
1.静态函数 using System; using System.Collections.Generic; using System.Linq; using System.Text; using S ...
- kolla出现问题时的定位方式
前提,对官网问题的一个翻译 Troubleshooting Guide排障手册 1.Failures(失败) If Kolla fails, often it is caused by a CTRL- ...
- java 学习第二篇关系运算符和布尔值
关系运算符,顾名思义.用来看什么关系.(也就是用来比较) 看下表 JAVA 关系运算符 a=6,b=5 关系运算符 举例 值 解释 > a>b true a大于b < a<b ...
- 使用pycharm创建自己的第一个django项目
PyCharm是一种Python IDE,带有一整套可以帮助用户在使用Python语言开发时提高其效率的工具,比如调试.语法高亮.Project管理.代码跳转.智能提示.自动完成.单元测试.版本控制. ...
- 洛谷P4137 Rmq Problem / mex(莫队)
题目描述 有一个长度为n的数组{a1,a2,…,an}.m次询问,每次询问一个区间内最小没有出现过的自然数. 输入输出格式 输入格式: 第一行n,m. 第二行为n个数. 从第三行开始,每行一个询问l, ...