Refactor exercise & person into template partials

This commit is contained in:
Peter Stockings
2022-11-21 23:57:13 +11:00
parent 13135792d8
commit 042d3517b6
4 changed files with 78 additions and 152 deletions

View File

@@ -0,0 +1,33 @@
<tr>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
{% if is_edit|default(false, true) == false %}
{{ name }}
{% else %}
<input
class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
type="text" name="name" value="{{ name }}">
{% endif %}
</td>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
{% if is_edit|default(false, true) == false %}
<a hx-get="{{ url_for('get_exercise_edit_form', exercise_id=exercise_id) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Edit
</a>
<a hx-delete="{{ url_for('delete_exercise', exercise_id=exercise_id) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Remove
</a>
{% else %}
<a hx-put="{{ url_for('update_exercise', exercise_id=exercise_id) }}" hx-include="closest tr"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Update
</a>
<a hx-get="{{ url_for('get_exercise', exercise_id=exercise_id) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Cancel
</a>
{% endif %}
</td>
</tr>

View File

@@ -0,0 +1,33 @@
<tr>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
{% if is_edit|default(false, true) == false %}
{{ name }}
{% else %}
<input
class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
type="text" name="name" value="{{ name }}">
{% endif %}
</td>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
{% if is_edit|default(false, true) == false %}
<a hx-get="{{ url_for('get_person_edit_form', person_id=person_id) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Edit
</a>
<a hx-delete="{{ url_for('delete_person', person_id=person_id) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Remove
</a>
{% else %}
<a hx-put="{{ url_for('update_person_name', person_id=person_id) }}" hx-include="closest tr"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Update
</a>
<a hx-get="{{ url_for('get_person_name', person_id=person_id) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Cancel
</a>
{% endif %}
</td>
</tr>

View File

@@ -29,21 +29,8 @@
<tbody class="bg-white" id="new-person" hx-target="closest tr"
hx-swap="outerHTML swap:0.5s">
{% for p in people %}
<tr>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
{{ p['Name'] }}
</td>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
<a hx-get="{{ url_for('get_person_edit_form', person_id=p['PersonId']) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Edit
</a>
<a hx-delete="{{ url_for('delete_person', person_id=p['PersonId']) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Remove
</a>
</td>
</tr>
{{ render_partial('partials/person.html', person_id=p['PersonId'],
name=p['Name'])}}
{% endfor %}
</tbody>
</table>
@@ -107,21 +94,8 @@
<tbody class="bg-white" id="new-exercise" hx-target="closest tr"
hx-swap="outerHTML swap:0.5s">
{% for e in exercises %}
<tr>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
{{ e['Name'] }}
</td>
<td class="p-4 whitespace-nowrap text-sm font-semibold text-gray-900">
<a hx-get="{{ url_for('get_exercise_edit_form', exercise_id=e['ExerciseId']) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Edit
</a>
<a hx-delete="{{ url_for('delete_exercise', exercise_id=e['ExerciseId']) }}"
class="text-sm font-medium text-cyan-600 hover:bg-gray-100 rounded-lg inline-flex items-center p-2 cursor-pointer">
Remove
</a>
</td>
</tr>
{{ render_partial('partials/exercise.html', exercise_id=e['ExerciseId'],
name=e['Name'])}}
{% endfor %}
</tbody>
</table>