#6. 아직 글을 작성하지 않았을 때 보여줄 화면만들기

할일이 아직 하나도 없다면 어떻게 해야할까

할일 리스트에 아직 어떠한 할일도 적혀있지 않다면, 어떻게 해야할까? 별도의 백엔드로직을 구성할 필요없이, index.html에서 템플릿언어의 조건문을 사용해서 위와 같은 화면을 구성할 수 있다.

 

{% extends 'base.html' %}

<!-- 헤드부분 -->
{% block head %}
<title>Task Master</title>
{% endblock %}

<!-- 바디부분 -->
{% block body %}
<div class="content">
    <h1>도대체 무엇을 해야하나</h1>

    //로직부분에서 index.html과 같이 렌더링한 tasks에 대한 조건문
    //tasks에 아직 어떠한 할일도 담겨있지 않을 때 보여줄 화면
    {% if tasks|length < 1 %}
    <h4>할 일이 없습니다. 오늘은 제발 일 좀 하세요.</h4>
    
    //tasks에 할일이 하나라도 담겨있다면 보여줄 화면
    {% else %}

    <table>
        <tr>
            <th>할일</th>
            <th>저장한 시간</th>
            <th>수정/삭제</th>
        </tr>
        {% for task in tasks %}
            <tr>
                <td>{{ task.content }}</td>
                <td>{{ task.date_created.date() }}</td>
                <td>
                    <a href="/update/{{task.id}}">Update</a>
                    <br>
                    <a href="/delete/{{task.id}}">Delete</a>
                </td>
            </tr>
        {% endfor %}
    </table>
    
    //조건문 끝
    {% endif %}

    <form action="/" method="POST">
        <input type="text" name="content" id="content">
        <input type="submit" Value="Add Task">
    </form>

</div>
{% endblock %}

템플릿언어의 조건문을 사용해 구현하면 된다. index.html과 같이 렌더링한 tasks를 체크한 뒤 tasks의 데이터에 따라 보여줄 화면을 다르게 구성하는 것이다. 참고로 tasks는 app.py에서 로직 구성시 만든 변수이다.

 

@app.route('/', methods=['POST', 'GET'])
def index():
    if request.method == 'POST':
        task_content = request.form['content']
        new_task = Todo(content=task_content)
        try:
            db.session.add(new_task)
            db.session.commit()
            return redirect('/')
        except:
            return 'There was an issue adding your task'
    else:
    	//바로 이 변수가 조건문의 기준으로 사용된다
        tasks = Todo.query.order_by(Todo.date_created).all()
        return render_template('index.html', tasks=tasks)