BBS論壇（二十七）

27.首頁(yè)帖子列表布局完成

（1）apps/models.py

把帖子跟用戶關(guān)聯(lián)起來(lái)

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')

把之前數(shù)據(jù)庫(kù)里面的帖子都刪了，migrate、upgrade后重新發(fā)表新帖子

（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="#">點(diǎn)贊最多</a></li><li><a href="#">評(píng)論最多</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>發(fā)表時(shí)間:{{ post.create_time }}</span><span>評(píng)論:0</span><span>閱讀數(shù) :0</span></p></div></li>{% endfor %}</ul>

（5）front/css/front_index.css

*{margin: 0;padding:0;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.首頁(yè)帖子列表布局完成

轉(zhuǎn)載于:https://www.cnblogs.com/edeny/p/10021189.html

總結(jié)

以上是生活随笔為你收集整理的27-----BBS论坛的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。