官方社群在线客服官方频道防骗查询货币工具

BBS论坛(三十)

2025年01月14日 02:16:50
news.like.tgnews.like.tgnews.like.tgnews.like.tg

LIKE.TG | 发现全球营销软件&服务汇聚顶尖互联网营销和AI营销产品,提供一站式出海营销解决方案。唯一官网:www.like.tg

30.显示评论和添加评论功能完成

(1)apps/models.py

代码语言:javascript
复制
class CommentModel(db.Model): __tablename__='comment' id=db.Column(db.Integer,primary_key=True,autoincrement=True) content=db.Column(db.Text,nullable=False) create_time=db.Column(db.DateTime,default=datetime.now) post_id=db.Column(db.Integer,db.ForeignKey('post.id')) author_id = db.Column(db.String(50), db.ForeignKey('front_user.id'), nullable=False) post=db.relationship('PostModel',backref='comments') author=db.relationship('FrontUser',backref='comments')

生成到数据库

代码语言:javascript
复制
python manage.py migrate python manage.py upgrade

(2)front/forms.py

代码语言:javascript
复制
class AddCommentForm(BaseForm): content=StringField(validators=[InputRequired(message='请输入评论内容')]) post_id=IntegerField(validators=[InputRequired(message='请输入评论内容')])

(3)front/views.py

代码语言:javascript
复制
@bp.route('/acomment/',methods=['POST']) @login_requried def add_comment(): form=AddCommentForm(request.form) if form.validate(): content=form.content.data post_id=form.post_id.data post=PostModel.query.get(post_id) if post: comment=CommentModel(content=content) comment.post=post comment.author=g.front_user db.session.add(comment) db.session.commit() return restful.success() else: return restful.params_error(message='没有这个帖子') else: return restful.params_error(form.get_error())

(4)front/front_base.html

代码语言:javascript
复制
<span id="login-tag" data-is-login="1"></span>

(5)front/front_pdetail.html

代码语言:javascript
复制
{% extends 'front/front_base.html' %} {% from 'common/_macros.html' import static %} {% block title %} {{ post.title }} {% endblock %} {% block head %} <script src="{{ static('ueditor/ueditor.config.js') }}"></script> <script src="{{ static('ueditor/ueditor.all.min.js') }}"></script> <script src="{{ static('front/js/front_pdetail.js') }}"></script> <link rel="stylesheet" href="{{ static('front/css/front_pdetail.css') }}"> {% endblock %} {% block body %} <div class="lg-container"> <div class="post-container"> <h2>{{ post.title }}</h2> <p class="post-info-group"> <span>发表时间:{{ post.create_time }}</span> <span>作者:{{ post.author.username }}</span> <span>版块:{{ post.board.name }}</span> <span>阅读数:{{ post.read_count }}</span> <span>评论数:0</span> </p> <article class="post-content" id="post-content" data-id="{{ post.id }}"> {{ post.content|safe }} </article> </div> <div class="comment-group"> <h4>评论列表:</h4> <ul class="comment-list-group"> {% for comment in post.comments %} <li> <div class="avatar-group"> <img src="{{ comment.author.avatar or static('common/images/logo.jpg') }}" alt=""> </div> <div class="comment-content"> <p class="author-info"> <span>{{ comment.author.username }}</span> <span>{{ comment.create_time }}</span> </p> <p class="comment-txt"> {{ comment.content|safe }} </p> </div> </li> {% endfor %} </ul> </div> <div class="add-comment-group"> <h3>添加评论</h3> <script id="editor" style="height:100px;" type="text/plain"></script> <div class="add_comment_btn"> <button class="btn btn-primary" id='comment-btn'>发表评论</button> </div> </div> </div> <div class="sm-container"></div> {% endblock %}

(6)front/css/front_pdetail.css

代码语言:javascript
复制
.comment-group{ border:1px solid #e8e8e8; margin-top: 20px; padding: 10px; } .add-comment-group{ border:1px solid #e8e8e8; margin-top: 20px; } .add_comment_btn{ text-align: right; margin: 10px; } .add-comment-group h3{ margin: 10px; } .comment-list-group li{ overflow:hidden; border-bottom:1px solid #e8e8e8; } .avatar-group{ float:left; } .avatar-group img{ width: 50px; height: 50px; border-radius: 50%; } .comment-content{ float: left; margin-left: 20px; } .comment-content .author-info{ font-size: 12px; color:#8c8c8c; } .author-info span{ margin-right:10px; } .comment-content .comment-txt{ margin-top: 10px; }

(7)front/front_pdetail.js

代码语言:javascript
复制
$(function(){ var ue=UE.getEditor('editor',{ 'serverUrl':'/ueditor/upload/', "toolbars": [ [ 'undo', //撤销 'redo', //重做 'bold', //加粗 'italic', //斜体 'blockquote', //引用 'selectall', //全选 'fontfamily', //字体 'fontsize', //字号 'simpleupload', //单图上传 'emotion' //表情 ] ] }); window.ue=ue; }); $(function(){ $('#comment-btn').on('click',function(event){ event.preventDefault(); var login_tag=$('#login-tag').attr('data-is-login'); if (! login_tag){ window.location='/signin/' }else{ var content=window.ue.getContent(); var post_id=$('#post-content').attr('data-id'); zlajax.post({ 'url':'/acomment/' , 'data':{ 'content':content, 'post_id':post_id }, 'success':function(data){ if(data['code']==200){ zlalert.alertSuccessToast(msg='评论发表成功'); window.location.reload(); }else{ zlalert.alertInfo(data['message']); } } }); } }) ; });

LIKE.TG汇集全球营销软件&服务,助力出海企业营销增长。提供最新的“私域营销获客”“跨境电商”“全球客服”“金融支持”“web3”等一手资讯新闻。

点击【联系客服】 🎁 免费领 1G 住宅代理IP/proxy, 即刻体验 WhatsApp、LINE、Telegram、Twitter、ZALO、Instagram、signal等获客系统,社媒账号购买 & 粉丝引流自助服务或关注【LIKE.TG出海指南频道】【LIKE.TG生态链-全球资源互联社区】连接全球出海营销资源。

本文由LIKE.TG编辑部转载自互联网并编辑,如有侵权影响,请联系官方客服,将为您妥善处理。

This article is republished from public internet and edited by the LIKE.TG editorial department. If there is any infringement, please contact our official customer service for proper handling.


Server deployment全球论坛人工智能论坛全球峰会发展论坛战略论坛开放论坛程序员论坛互联网峰会科技峰会
加入like.tg生态圈,即可获利、结识全球供应商、拥抱全球软件生态圈加入like.tg平台,即可获利、结识全球供应商、拥抱全球营销软件生态圈加入like.tg生态资源圈,即可获利、结识全球供应商、拥抱全球软件生态圈
全球峰会
加入like.tg生态圈,即可获利、结识全球供应商、拥抱全球软件生态圈加入like.tg平台,即可获利、结识全球供应商、拥抱全球营销软件生态圈加入like.tg生态资源圈,即可获利、结识全球供应商、拥抱全球软件生态圈