首頁列表顯示所有問答，完成問答詳情頁佈局。

時間 2019-12-08

標籤首頁列表顯示所有問答完成詳情佈局简体版

原文原文鏈接

首頁列表顯示所有問答：
1. 將數據庫查詢結果傳遞到前端頁面 Question.query.all()
2. 前端頁面循環顯示整個列表。
3. 問答排序
完成問答詳情頁佈局：
1. 包含問答的所有信息
2. 評論區
3. 以往評論列表顯示區。
在首頁點擊問答標題，連接到相應詳情頁。

index.pycss

import config
from flask import Flask, render_template, url_for, redirect, request,session
from flask_sqlalchemy import SQLAlchemy
from functools import wraps
from datetime import datetime

app = Flask(__name__)
app.config.from_object(config)
db = SQLAlchemy(app)


class User(db.Model):
    __tablename__ = 'user'
    id = db.Column(db.Integer, primary_key=True, autoincrement=True)
    username = db.Column(db.String(20), nullable=False)
    password = db.Column(db.String(20), nullable=False)
    nickname = db.Column(db.String(20))

class Question(db.Model):
    __tablename__='question'
    id=db.Column(db.Integer,primary_key=True,autoincrement=True)
    title=db.Column(db.String(100),nullable=False)
    detail=db.Column(db.Text,nullable=False)
    creat_time=db.Column(db.DateTime,default=datetime.now)
    author_id=db.Column(db.Integer,db.ForeignKey('user.id'))
    author=db.relationship('User',backref=db.backref('question'))



#db.create_all()

@app.route('/')
def shouye():
    context={
        'question':Question.query.all()
    }
    return render_template('shouye.html',**context)
@app.route('/pinglun')
def pinglun():
    return render_template('pinglun.html')

@app.route('/zhuce',methods=['GET','POST'])
def zhuce():
    if request.method == 'GET':
        return render_template('zhuce.html')
    else:
        username = request.form.get('username')
        password = request.form.get('password')
        nickname = request.form.get('nickname')
        user1 = User.query.filter(User.username == username).first()
    if user1:
        return 'username existed'
    else:
        user1 = User(username=username, password=password, nickname=nickname)
        db.session.add(user1)
        db.session.commit()
        return redirect(url_for('denglu'))



@app.route('/denglu',methods=['GET','POST'])
def denglu():
    if request.method == 'GET':
        return render_template('denglu.html')
    else:
        username = request.form.get('username')
        password = request.form.get('password')
        user=User.query.filter(User.username == username).first()
    if user:
        if user.password == password:
            session['user'] = username
            session.permanent = True
            return redirect(url_for('shouye'))
        else:
            return 'password error'
    else:
        return 'username is not existed'



@app.route('/logout/')
def logout():
    session.clear()
    return redirect(url_for('shouye'))



def log(func):
    @wraps(func)
    def wrapper(*args,**kwargs):
        if session.get('user'):
            return  func(*args,**kwargs)
        else:
            return render_template('denglu.html')
    return wrapper




@app.route('/neirong',methods=['GET','POST'])
@log
def fankui():
    if request.method=='GET':
        return render_template('fankui.html')
    else:
        title=request.form.get('title')
        detail=request.form.get('detail')
        author_id=User.query.filter(User.username==session.get('user')).first().id
        question=Question(title=title,detail=detail,author_id=author_id)
        db.session.add(question)
        db.session.commit()
        return redirect(url_for('shouye'))


@app.context_processor
def mycontext():
    usern=session.get('user')
    if usern:
        return {'username':usern}
    else:
        return {}



if __name__ == '__main__':
    app.run(debug='True')

shouye.htmlhtml

<!DOCTYPE html>
<html lang="en">
<head>
    {% extends "text.html" %}
    <meta charset="UTF-8">
    <link href="https://cdn.bootcss.com/bootstrap/4.0.0-beta/css/bootstrap.css" rel="stylesheet">
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
    <title>首頁</title>
</head>
<body>
{% block shouye %}

<form class="">
<ul class="list-group list-group-item-light p-3 border border-secondary rounded-top" style="margin-top: 6.2% ; margin-left: 25%;width: 50%; ">
{% for foo in question %}
  <li class="list-group-item rounded m-1" style="height: 10ch">
    <span>
        <a href="{{ url_for('pinglun') }}">{{ foo.author.username }}</a>
        <span class="">{{ foo.creat_time }}</span><br>
        <a href="#">{{ foo.title }}</a>

        <p>{{ foo.detail }}</p>
    </span>
  </li>
    {% endfor %}
</ul>
</form>
{% endblock %}
</body>
</html>

pinglun.html前端

<!DOCTYPE html>
<html lang="en">
<head>
    {% extends "text.html" %}
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="https://cdn.bootcss.com/bootstrap/4.0.0-beta/css/bootstrap.css" rel="stylesheet">
</head>
<body>

{% block pinglun %}
<div class="card" style="width: 65rem;height: 50rem;margin-top:2% ; margin-left: 25%;">
  <h2 class="card-header">title</h2>
  <div class="card-body">
      <h4 class="card-title">username  <small>create_time</small></h4>
      <hr>
      <h5>detaile</h5>
      <hr>
      <div style="width: 50rem;margin-left: 10%;margin-top: 3%">
    <textarea  name="detail" class="form-control"  rows="10" placeholder="請寫下評論" ></textarea><br>
            <button type="submit" class="btn btn-outline-primary" >提交評論</button>
        </div>
  </div>

<div class="" style="width:58rem;margin-left: 4%;height: 20rem  ">
    <div>

    <a href="#" >username</a>
    <small>creat_time</small>
    <p class="">評論</p><br>
    </div>
 <hr>
    <div>

    <a href="#" >username</a>
    <small>creat_time</small>

    <p class="">評論</p>
    </div>
</div>
</div>


{% endblock %}

</body>
</html>

實驗截圖sql

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。