Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Base list template #5566

Merged
merged 5 commits into from
Oct 22, 2024
Merged

Base list template #5566

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
72257f5
Make some list pages use a common template
rowanseymour Oct 17, 2024
9d80e65
Merge branch 'main' into base_list_template
rowanseymour Oct 18, 2024
c70ffde
Use bsae list template for flows as well
rowanseymour Oct 18, 2024
c8d8342
Merge branch 'main' into base_list_template
rowanseymour Oct 22, 2024
4b97b7f
Use block for table
rowanseymour Oct 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
198 changes: 94 additions & 104 deletions templates/flows/flow_list.html
View file
Open in desktop
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
Open in desktop
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
Open in desktop
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
Loading