首页列表显示全部问答,完成问答详情页布局

 

  1. 首页列表显示全部问答:
    1. 将数据库查询结果传递到前端页面 Question.query.all()
    2. 前端页面循环显示整个列表。
    3. 问答排序
  2. 完成问答详情页布局:
    1. 包含问答的全部信息
    2. 评论区
    3. 以往评论列表显示区。
  3. 在首页点击问答标题,链接到相应详情页。
@app.route('/base2')
def base2():
    context={
       'question':Question.query.all()
    }
    return render_template('base2.html',**context)

@app.route('/detail/')
def detail():
    return render_template("detail.html")
 {% for foo in question%}

        <div id="header" style="background-color: antiquewhite;width:400px "><h2 align="center" style="margin-bottom:0;">评论大杂烩</h2></div>
        <div id="content" style="background-color: beige;height:150px;width:400px;float: left;">

        <div class="listbox">
        <ul class="alist">
            <li id='001' class="list">
                <span class="glyphicon glyphicon-leaf" aria-hidden="true"></span>
                <a href="#">NAME:{{ foo.author.username }}</a><br>
                <a href="#">TITLE:{{ foo.title }}</a><br>
                <a href="#">COMMENT:{{ foo.detail }}</a>
                <span class="badge" style="margin-left: 60%">{{ foo.create_time }}</span>
                <p style="margin-left: 25%"></p>
            </li>
        </ul>
        </div></div>
            <div id="footer" style="background-color: bisque;clear: both;text-align: center;width:400px "><i>版权 @Doublewhere</i></div></div>

    {% endfor %}
{% extends 'base.html' %}
{% block title %}DETAIL{% endblock  %}
{% block head %}

{% endblock  %}
{% block main %}


<div id="question-feedback" style="width:400px ">
        <div id="header" style="background-color: antiquewhite; "><h2 align="center" style="margin-bottom:0;"> 详细评论 </h2></div>
        <form id="content" style="background-color: beige;height:200px;width:400px;float: left;">

         <form action="{{ url_for('question') }}" method="post" >

   <div class="question-control">

       <div><label for="question">评论标题:</label><br></div>

       <div><label for="questionDetail">问答:</label><br>
            <textarea class="form-control" rows="6" id="questionDetail" placeholder="请输入详细问答"
                      style="height: 120px;width: 320px" name="detail"></textarea>
       </div>

        <div class="submit-button" >
        <button type="submit" style="float:left" id="submit-button">提交</button>
        </div>

                <div id="footer" style="background-color: bisque;clear: both;text-align: center;"><i>版权 @Doublewhere</i></div>


</div></form>

        </form></div>

{% endblock %}

 

posted @ 2017-12-05 18:04  杜丽晖  阅读(161)  评论(0编辑  收藏  举报