Prettier task edit UI
This commit is contained in:
parent
5a26aa65ab
commit
24119b91ac
2 changed files with 89 additions and 74 deletions
|
@ -3,8 +3,7 @@
|
||||||
<form action="" name="add_task" method="post">
|
<form action="" name="add_task" method="post">
|
||||||
{% csrf_token %}
|
{% csrf_token %}
|
||||||
|
|
||||||
|
<div id="AddEditTask" class="mt-3">
|
||||||
<div id="AddEditTask" class="collapse mt-3">
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="id_title" name="title">Task</label>
|
<label for="id_title" name="title">Task</label>
|
||||||
<input type="text" class="form-control" id="id_title" name="title" required placeholder="Task title"
|
<input type="text" class="form-control" id="id_title" name="title" required placeholder="Task title"
|
||||||
|
@ -33,12 +32,15 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="id_notify">Notify</label>
|
<div class="form-check">
|
||||||
<input type="checkbox" checked="checked" class="form-control" id="id_notify" name="notify" aria-describedby="inputNotifyHelp"
|
<input class="form-check-input" type="checkbox" aria-describedby="inputNotifyHelp" checked="checked" id="id_notify">
|
||||||
value="{{ form.notify.text }}">
|
<label class="form-check-label" for="id_notify">
|
||||||
<small id="inputNotifyHelp" class="form-text text-muted">
|
Notify
|
||||||
Email notifications will only be sent if task is assigned to someone other than yourself.
|
</label>
|
||||||
</small>
|
<small id="inputNotifyHelp" class="form-text text-muted">
|
||||||
|
Email notifications will only be sent if task is assigned to someone other than yourself.
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<input type="hidden" name="priority"
|
<input type="hidden" name="priority"
|
||||||
|
|
|
@ -19,49 +19,46 @@
|
||||||
|
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="row">
|
<div class="card-deck">
|
||||||
<div class="col-sm-8">
|
<div class="card col-sm-8">
|
||||||
<h3 class="card-title">{{ task.title }}</h3>
|
<div class="card-body">
|
||||||
{% if task.note %}
|
<h3 class="card-title">{{ task.title }}</h3>
|
||||||
<p class="card-text">{{ task.note|safe|urlize|linebreaks }}</p>
|
{% if task.note %}
|
||||||
{% endif %}
|
<div class="card-text">{{ task.note|safe|urlize|linebreaks }}</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-sm-4">
|
<div class="card col-sm-4 p-0">
|
||||||
<div class="mb-2">
|
<ul class="list-group list-group-flush">
|
||||||
|
<li class="list-group-item">
|
||||||
<button
|
<button
|
||||||
class="btn btn-sm btn-primary"
|
class="btn btn-sm btn-primary"
|
||||||
id="EditTaskButton"
|
id="EditTaskButton"
|
||||||
type="button"
|
type="button"
|
||||||
data-toggle="collapse"
|
data-toggle="collapse"
|
||||||
data-target="#AddEditTask"
|
data-target="#TaskEdit">
|
||||||
>
|
|
||||||
Edit Task
|
Edit Task
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<form method="post" action="{% url "todo:task_toggle_done" task.id %}" role="form" style="display:inline;">
|
<form method="post" action="{% url "todo:task_toggle_done" task.id %}" role="form" class="d-inline">
|
||||||
{% csrf_token %}
|
{% csrf_token %}
|
||||||
<div style="display:inline;">
|
<div style="display:inline;">
|
||||||
<button class="btn btn-info btn-sm" type="submit" name="toggle_done">
|
<button class="btn btn-info btn-sm" type="submit" name="toggle_done">
|
||||||
{% if task.completed %} Mark Not Done {% else %} Mark Done {% endif %}
|
{% if task.completed %} Mark Not Done {% else %} Mark Done {% endif %}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<form method="post" action="{% url "todo:delete_task" task.id %}" role="form" style="display:inline;">
|
|
||||||
{% csrf_token %}
|
|
||||||
<div style="display:inline;">
|
|
||||||
<button class="btn btn-danger btn-sm" type="submit" name="submit_delete">
|
|
||||||
Delete
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="list-group">
|
|
||||||
|
|
||||||
|
<form method="post" action="{% url "todo:delete_task" task.id %}" role="form" class="d-inline">
|
||||||
|
{% csrf_token %}
|
||||||
|
<div style="display:inline;">
|
||||||
|
<button class="btn btn-danger btn-sm" type="submit" name="submit_delete">
|
||||||
|
Delete
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</li>
|
||||||
<li class="list-group-item">
|
<li class="list-group-item">
|
||||||
<strong>Assigned to:</strong>
|
<strong>Assigned to:</strong>
|
||||||
{% if task.assigned_to %} {{ task.assigned_to.get_full_name }} {% else %} Anyone {% endif %}
|
{% if task.assigned_to %} {{ task.assigned_to.get_full_name }} {% else %} Anyone {% endif %}
|
||||||
|
@ -89,51 +86,67 @@
|
||||||
{{ task.task_list }}
|
{{ task.task_list }}
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="list-group-item">
|
|
||||||
<form action="" method="post">
|
|
||||||
{% csrf_token %}
|
|
||||||
{% for field in merge_form.visible_fields %}
|
|
||||||
<p>
|
|
||||||
{{ field.errors }}
|
|
||||||
{{ field }}
|
|
||||||
</p>
|
|
||||||
{% endfor %}
|
|
||||||
<input class="btn btn-sm btn-primary" type="submit" name="merge_task_into" value="Merge task">
|
|
||||||
</form>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="TaskEdit">
|
<div id="TaskEdit" class="collapse">
|
||||||
{# Task edit / new task form #}
|
{# Task edit / new task form #}
|
||||||
{% include 'todo/include/task_edit.html' %}
|
{% include 'todo/include/task_edit.html' %}
|
||||||
|
<form action="" method="post">
|
||||||
|
<div class="card border-danger">
|
||||||
|
<div class="card-header">Merge task</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="">
|
||||||
|
<p>Merging is a destructive operation. This task will not exist anymore, and comments will be moved to the target task.</p>
|
||||||
|
{% csrf_token %}
|
||||||
|
{% for field in merge_form.visible_fields %}
|
||||||
|
<p>
|
||||||
|
{{ field.errors }}
|
||||||
|
{{ field }}
|
||||||
|
</p>
|
||||||
|
{% endfor %}
|
||||||
|
<input class="d-inline btn btn-sm btn-outline-danger" type="submit" name="merge_task_into" value="Merge">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-3">
|
||||||
<h5>Add comment</h5>
|
<h5>Add comment</h5>
|
||||||
<form action="" method="post">
|
<form action="" method="post">
|
||||||
{% csrf_token %}
|
{% csrf_token %}
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<textarea class="form-control" name="comment-body" rows="3"></textarea>
|
<textarea class="form-control" name="comment-body" rows="3"></textarea>
|
||||||
</div>
|
</div>
|
||||||
<input class="btn btn-sm btn-primary" type="submit" name="add_comment" value="Add Comment">
|
<input class="btn btn-sm btn-primary" type="submit" name="add_comment" value="Add Comment">
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="task_comments mt-4">
|
<div class="task_comments mt-4">
|
||||||
{% if comment_list %}
|
{% if comment_list %}
|
||||||
<h5>Comments on this task</h5>
|
<h5>Comments on this task</h5>
|
||||||
{% for comment in comment_list %}
|
{% for comment in comment_list %}
|
||||||
<p>
|
<div class="mb-3 card">
|
||||||
<strong>{{ comment.author_text }},
|
<div class="card-header">
|
||||||
|
<div class="float-left">
|
||||||
|
{% if comment.email_message_id %}
|
||||||
|
<span class="badge badge-warning">email</span>
|
||||||
|
{% endif %}
|
||||||
|
{{ comment.author_text }}
|
||||||
|
</div>
|
||||||
|
<span class="float-right d-inline-block text-muted">
|
||||||
{{ comment.date|date:"F d Y P" }}
|
{{ comment.date|date:"F d Y P" }}
|
||||||
</strong>
|
</span>
|
||||||
</p>
|
</div>
|
||||||
{{ comment.body|safe|urlize|linebreaks }}
|
<div class="text-monospace card-body">
|
||||||
|
{{ comment.body|safe|urlize|linebreaks }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% else %}
|
{% else %}
|
||||||
<h5>No comments (yet).</h5>
|
<h5>No comments (yet).</h5>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue