Skip to content

Commit

Permalink
Merge pull request #5566 from nyaruka/base_list_template
Browse files Browse the repository at this point in the history 
Base list template
  • Loading branch information
@rowanseymour
rowanseymour authored Oct 22, 2024
2 parents 903601f + 4b97b7f commit 5f87874
Show file tree
Hide file tree
Showing 6 changed files with 305 additions and 339 deletions.
198 changes: 94 additions & 104 deletions templates/flows/flow_list.html
View file
Original file line number Diff line number Diff line change
@@ -1,112 +1,102 @@
{% extends "smartmin/list.html" %}
{% extends "orgs/base/list.html" %}
{% load smartmin temba i18n humanize %}

{% block content %}
{% if org_perms.flows.flow_results %}
<temba-modax header="{% trans "Export Results" %}" id="export-results">
</temba-modax>
{% endif %}
{% if org_perms.flows.flowlabel_create %}
<temba-modax header="{% trans "Create Label" %}"
endpoint="{% url 'flows.flowlabel_create' %}"
-temba-loaded="handleCreateLabelModalLoaded"
-temba-submitted="handleCreateLabelModalSubmitted"
id="create-label-modal">
</temba-modax>
{% endif %}
<form method="get" action="{{ request.path }}" id="search-form">
<temba-textinput placeholder="{% trans "Search" %}" name="search" value="{{ search }}" class="w-full">
</temba-textinput>
<input type="submit" class="hide">
</form>
<div class="mt-4 shadow rounded-lg rounded-bl-none rounded-br-none bg-white">{% include "includes/short_pagination.html" %}</div>
<div class="flex-grow overflow-y-auto shadow">
<table class="relative list object-list lined selectable scrolled">
{% if object_list %}
<thead>
<tr>
{% if org_perms.flows.flow_update %}<th></th>{% endif %}
<th></th>
<th style="text-align:right" class="whitespace-nowrap">Runs / Completion</th>
</tr>
</thead>
{% endif %}
<tbody>
{% for object in object_list %}
<tr onclick="handleRowClicked(event)"
data-uuid="{{ object.uuid }}"
data-object-id="{{ object.id }}"
href="{% url 'flows.flow_editor' object.uuid %}"
class="object-row select-row">
{% if org_perms.flows.flow_update %}
<td onclick="checkInner(event);" style="width:0px" class="checkbox object-row-checkbox">
<temba-checkbox onclick="handleRowSelection(this)">
</temba-checkbox>
</td>
{% endif %}
<td>
<div class="flex items-center">
<div class="flex-grow">
<div style="max-width:80%" class="flex whitespace-nowrap flex-grow items-center">
<div class="flex items-center text-gray-600">
{% if object.flow_type == 'V' %}
<temba-icon name="flow_ivr" class="mr-2">
</temba-icon>
{% elif object.flow_type == 'S' %}
<temba-icon name="flow_surveyor" class="mr-2">
</temba-icon>
{% elif object.flow_type == 'B' %}
<temba-icon name="flow_background" class="mr-2">
</temba-icon>
{% endif %}
</div>
<div class="name truncate flex-grow">{{ object.name }}</div>
{% block pre-table %}
<temba-modax header="{% trans "Export Results" %}" id="export-results">
</temba-modax>
<temba-modax header="{% trans "New Label" %}"
endpoint="{% url 'flows.flowlabel_create' %}"
-temba-loaded="handleCreateLabelModalLoaded"
-temba-submitted="handleCreateLabelModalSubmitted"
id="create-label-modal">
</temba-modax>
{% endblock pre-table %}
{% block table %}
<table class="relative list object-list lined selectable scrolled">
{% if object_list %}
<thead>
<tr>
{% if org_perms.flows.flow_update %}<th></th>{% endif %}
<th></th>
<th style="text-align:right" class="whitespace-nowrap">Runs / Completion</th>
</tr>
</thead>
{% endif %}
<tbody>
{% for object in object_list %}
<tr onclick="handleRowClicked(event)"
data-uuid="{{ object.uuid }}"
data-object-id="{{ object.id }}"
href="{% url 'flows.flow_editor' object.uuid %}"
class="object-row select-row">
{% if org_perms.flows.flow_update %}
<td onclick="checkInner(event);" style="width:0px" class="checkbox object-row-checkbox">
<temba-checkbox onclick="handleRowSelection(this)">
</temba-checkbox>
</td>
{% endif %}
<td>
<div class="flex items-center">
<div class="flex-grow">
<div style="max-width:80%" class="flex whitespace-nowrap flex-grow items-center">
<div class="flex items-center text-gray-600">
{% if object.flow_type == 'V' %}
<temba-icon name="flow_ivr" class="mr-2">
</temba-icon>
{% elif object.flow_type == 'S' %}
<temba-icon name="flow_surveyor" class="mr-2">
</temba-icon>
{% elif object.flow_type == 'B' %}
<temba-icon name="flow_background" class="mr-2">
</temba-icon>
{% endif %}
</div>
</div>
<div class="whitespace-no-break flex items-center ml-2 justify-end flex-wrap">
{% for label in object.labels.all %}
<a href="{% url 'flows.flow_filter' label.uuid %}" onclick="goto(event, this)">
<temba-label data-id="{{ label.id }}" icon="label" clickable class="mx-1 my-1">
{{ label.name }}
</temba-label>
</a>
{% endfor %}
<div class="name truncate flex-grow">{{ object.name }}</div>
</div>
</div>
</td>
<td>
{% if not object.is_archived %}
<div class="whitespace-no-break flex items-center justify-end">
{% if object.has_issues %}
<div>
<temba-tip position="top" text="{{ _("Has issues") |escapejs }}" slot="toggle">
<temba-icon name="issue" class="mr-2" clickable="true">
</temba-icon>
</temba-tip>
</div>
{% endif %}
{% if object.run_stats.total %}
<div onclick="goto(event)"
href="{% url "flows.flow_results" object.uuid %}"
class="linked mr-2 whitespace-nowrap">{{ object.run_stats.total|intcomma }}</div>
/
<div onclick="goto(event)"
href="{% url "flows.flow_results" object.uuid %}"
class="text-center linked mx-2 whitespace-nowrap">{{ object.run_stats.completion }}%</div>
{% endif %}
</div>
{% endif %}
</td>
</tr>
{% empty %}
<tr class="empty_list">
<td colspan="99" class="text-center">{% trans "No flows" %}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock content %}
<div class="whitespace-no-break flex items-center ml-2 justify-end flex-wrap">
{% for label in object.labels.all %}
<a href="{% url 'flows.flow_filter' label.uuid %}" onclick="goto(event, this)">
<temba-label data-id="{{ label.id }}" icon="label" clickable class="mx-1 my-1">
{{ label.name }}
</temba-label>
</a>
{% endfor %}
</div>
</div>
</td>
<td>
{% if not object.is_archived %}
<div class="whitespace-no-break flex items-center justify-end">
{% if object.has_issues %}
<div>
<temba-tip position="top" text="{{ _("Has issues") |escapejs }}" slot="toggle">
<temba-icon name="issue" class="mr-2" clickable="true">
</temba-icon>
</temba-tip>
</div>
{% endif %}
{% if object.run_stats.total %}
<div onclick="goto(event)"
href="{% url "flows.flow_results" object.uuid %}"
class="linked mr-2 whitespace-nowrap">{{ object.run_stats.total|intcomma }}</div>
/
<div onclick="goto(event)"
href="{% url "flows.flow_results" object.uuid %}"
class="text-center linked mx-2 whitespace-nowrap">{{ object.run_stats.completion }}%</div>
{% endif %}
</div>
{% endif %}
</td>
</tr>
{% empty %}
<tr class="empty_list">
<td colspan="99" class="text-center">{% trans "No flows" %}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endblock table %}
{% block extra-script %}
{{ block.super }}
<script type="text/javascript">
Expand Down
118 changes: 53 additions & 65 deletions templates/globals/global_list.html
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,13 @@
{% extends "smartmin/list.html" %}
{% extends "orgs/base/list.html" %}
{% load smartmin temba i18n humanize %}

{% block content %}
{% block pre-table %}
<temba-modax header="{{ _("Update Global") |escapejs }}" -temba-redirected="refreshGlobals" id="update-global">
</temba-modax>
<temba-modax header="{{ _("Delete Global") |escapejs }}" -temba-redirected="refreshGlobals" id="delete-global">
</temba-modax>
<temba-modax header="{{ _("Usages") |escapejs }}" id="usages-global">
</temba-modax>
<div class="mb-4">
{% blocktrans trimmed %}
Globals are variables you can use across all of your flows but
Expand All @@ -10,67 +16,53 @@
might change later.
{% endblocktrans %}
</div>
{% block pre-table %}
<temba-modax header="{{ _("Update Global") |escapejs }}" -temba-redirected="refreshGlobals" id="update-global">
</temba-modax>
<temba-modax header="{{ _("Delete Global") |escapejs }}" -temba-redirected="refreshGlobals" id="delete-global">
</temba-modax>
<temba-modax header="{{ _("Usages") |escapejs }}" id="usages-global">
</temba-modax>
{% endblock pre-table %}
<form method="get" action="{{ request.path }}" id="search-form">
<temba-textinput placeholder="{% trans "Search" %}" name="search" value="{{ search }}" class="w-full">
</temba-textinput>
<input type="submit" class="hide">
</form>
<div class="mt-4 shadow rounded-lg rounded-bl-none rounded-br-none bg-white">{% include "includes/short_pagination.html" %}</div>
<div class="flex-grow overflow-y-auto shadow">
<table class="list lined scrolled">
<tbody>
{% for obj in object_list %}
<tr onclick="showUpdateGlobalModal({{ obj.id }})" class="hover-linked update">
<td style="min-width: 50px">{{ obj.name }}</td>
<td style="font-family: monospace; font-size: 12px;">@globals.{{ obj.key }}</td>
<td>
<div class="break-all">{{ obj.value|truncatechars:25 }}</div>
</td>
<td class="w-12">
<div class="flex text-center">
{% with usage_count=obj.usage_count %}
{% if usage_count %}
<div onclick="event.stopPropagation(); showGlobalUsagesModal('{{ obj.uuid }}');" class="uses">
<div class="lbl linked">
{% blocktrans trimmed count counter=usage_count %}
{{ counter }} use
{% plural %}
{{ counter }} uses
{% endblocktrans %}
</div>
{% endblock pre-table %}
{% block table %}
<table class="list lined scrolled">
<tbody>
{% for obj in object_list %}
<tr onclick="showUpdateGlobalModal({{ obj.id }})" class="hover-linked update">
<td style="min-width: 50px">{{ obj.name }}</td>
<td style="font-family: monospace; font-size: 12px;">@globals.{{ obj.key }}</td>
<td>
<div class="break-all">{{ obj.value|truncatechars:25 }}</div>
</td>
<td class="w-12">
<div class="flex text-center">
{% with usage_count=obj.usage_count %}
{% if usage_count %}
<div onclick="event.stopPropagation(); showGlobalUsagesModal('{{ obj.uuid }}');" class="uses">
<div class="lbl linked">
{% blocktrans trimmed count counter=usage_count %}
{{ counter }} use
{% plural %}
{{ counter }} uses
{% endblocktrans %}
</div>
{% endif %}
{% endwith %}
</div>
{% endif %}
{% endwith %}
</div>
</td>
<td class="w-10">
{% if org_perms.globals.global_delete %}
<div style="visibility:hidden"
onclick="event.stopPropagation(); showDeleteGlobalModal('{{ obj.uuid }}');"
class="pl-2 pt-1 delete-link linked text-gray-400">
<temba-icon name="delete_small">
</temba-icon>
</div>
</td>
<td class="w-10">
{% if org_perms.globals.global_delete %}
<div style="visibility:hidden"
onclick="event.stopPropagation(); showDeleteGlobalModal('{{ obj.uuid }}');"
class="pl-2 pt-1 delete-link linked text-gray-400">
<temba-icon name="delete_small">
</temba-icon>
</div>
{% endif %}
</td>
</tr>
{% empty %}
<tr class="empty_list">
<td colspan="99" class="text-center">{% trans "No globals" %}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock content %}
{% endif %}
</td>
</tr>
{% empty %}
<tr class="empty_list">
<td colspan="99" class="text-center">{% trans "No globals" %}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endblock table %}
{% block extra-script %}
{{ block.super }}
<script>
Expand All @@ -96,10 +88,6 @@
{% block extra-style %}
{{ block.super }}
<style type="text/css">
tr:hover .delete-link {
visibility: visible !important;
}

td.dependencies {
text-align: right;
white-space: nowrap;
Expand Down
27 changes: 27 additions & 0 deletions templates/orgs/base/list.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
{% extends "smartmin/list.html" %}
{% load i18n %}

{% block content %}
{% block pre-table %}
{% endblock pre-table %}
{% if view.search_fields %}
<form method="get" action="{{ request.path }}" id="search-form">
<temba-textinput placeholder="{% trans "Search" %}" name="search" value="{{ search }}" class="w-full">
</temba-textinput>
<input type="submit" class="hide">
</form>
{% endif %}
<div class="mt-4 shadow rounded-lg rounded-bl-none rounded-br-none bg-white">{% include "includes/short_pagination.html" %}</div>
<div class="flex-grow overflow-y-auto shadow">
{% block table %}
{% endblock table %}
</div>
{% endblock content %}
{% block extra-style %}
{{ block.super }}
<style type="text/css">
tr:hover .delete-link {
visibility: visible !important;
}
</style>
{% endblock extra-style %}
Loading

0 comments on commit 5f87874

Please sign in to comment.