improved look and feel for toolbar in data tables

added tool links to data tables
This commit is contained in:
Kevin Papst
2018-01-05 20:27:02 +01:00
parent a7bee68b0b
commit 6b9fed69f1
9 changed files with 214 additions and 229 deletions

View File

@@ -6,40 +6,40 @@
{% block page_subtitle %}{{ 'admin_activity.subtitle'|trans }} {{ 'subtitle.amount'|trans({'%count%': entries.count}) }}{% endblock %}
{% block main %}
{% if entries.count > 0 %}
{{ tables.data_table_header({
'label.id': 'hidden-xs',
'label.name': '',
'label.project': '',
'label.customer': '',
'label.comment': 'hidden-xs',
'label.visible': '',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td class="hidden-xs">{{ entry.id }}</td>
<td>{{ entry.name }}</td>
<td>
<a href="{{ path('admin_project_edit', {'id' : entry.project.id}) }}">{{ widgets.label_project(entry.project) }}</a>
</td>
<td>
<a href="{{ path('admin_customer_edit', {'id' : entry.project.customer.id}) }}">{{ widgets.label_customer(entry.project.customer) }}</a>
</td>
<td class="hidden-xs">{{ entry.comment }}</td>
<td>{{ widgets.label_visible(entry.visible) }}</td>
<td>
{{ widgets.button_group({
'edit': path('admin_activity_edit', {'id': entry.id}),
'trash': '#'
}) }}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'admin_activity_paginated') }}
{% else %}
{% if entries.count == 0 %}
{{ widgets.callout('warning', 'error.no_entries_found') }}
{% endif %}
{{ tables.data_table_header({
'label.id': 'hidden-xs',
'label.name': '',
'label.project': '',
'label.customer': '',
'label.comment': 'hidden-xs',
'label.visible': '',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td class="hidden-xs">{{ entry.id }}</td>
<td>{{ entry.name }}</td>
<td>
<a href="{{ path('admin_project_edit', {'id' : entry.project.id}) }}">{{ widgets.label_project(entry.project) }}</a>
</td>
<td>
<a href="{{ path('admin_customer_edit', {'id' : entry.project.customer.id}) }}">{{ widgets.label_customer(entry.project.customer) }}</a>
</td>
<td class="hidden-xs">{{ entry.comment }}</td>
<td>{{ widgets.label_visible(entry.visible) }}</td>
<td>
{{ widgets.button_group({
'edit': path('admin_activity_edit', {'id': entry.id}),
'trash': '#'
}) }}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'admin_activity_paginated') }}
{% endblock %}

View File

@@ -6,44 +6,44 @@
{% block page_subtitle %}{{ 'admin_customer.subtitle'|trans }} {{ 'subtitle.amount'|trans({'%count%': entries.count}) }}{% endblock %}
{% block main %}
{# Available fields: vat; contact; address; country; phone; fax; mobile; mail; homepage; timezone; #}
{% if entries.count > 0 %}
{{ tables.data_table_header({
'label.id': 'hidden-xs',
'label.name': '',
'label.project': '',
'label.comment': 'hidden-xs',
'label.country': 'hidden-xs',
'label.currency': 'hidden-xs',
'label.visible': '',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td class="hidden-xs">{{ entry.id }}</td>
<td>{{ entry.name }} {% if entry.company is not empty %}({{ entry.company }}){% endif %}</td>
<td>
{% for project in entry.projects %}
<a href="{{ path('admin_project_edit', {'id' : project.id}) }}">{{ widgets.label_project(project) }}</a>
{% endfor %}
</td>
<td class="hidden-xs">{{ entry.comment }}</td>
<td class="hidden-xs">{{ entry.country|country }}</td>
<td class="hidden-xs">{{ entry.currency }} {{ entry.currency|currency }}</td>
<td>{{ widgets.label_visible(entry.visible) }}</td>
<td>
{{ widgets.button_group({
'edit': path('admin_customer_edit', {'id': entry.id}),
'trash': '#'
}) }}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'admin_customer_paginated') }}
{% else %}
{% if entries.count == 0 %}
{{ widgets.callout('warning', 'error.no_entries_found') }}
{% endif %}
{# Available fields: vat; contact; address; country; phone; fax; mobile; mail; homepage; timezone; #}
{{ tables.data_table_header({
'label.id': 'hidden-xs',
'label.name': '',
'label.project': '',
'label.comment': 'hidden-xs',
'label.country': 'hidden-xs',
'label.currency': 'hidden-xs',
'label.visible': '',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td class="hidden-xs">{{ entry.id }}</td>
<td>{{ entry.name }} {% if entry.company is not empty %}({{ entry.company }}){% endif %}</td>
<td>
{% for project in entry.projects %}
<a href="{{ path('admin_project_edit', {'id' : project.id}) }}">{{ widgets.label_project(project) }}</a>
{% endfor %}
</td>
<td class="hidden-xs">{{ entry.comment }}</td>
<td class="hidden-xs">{{ entry.country|country }}</td>
<td class="hidden-xs">{{ entry.currency }} {{ entry.currency|currency }}</td>
<td>{{ widgets.label_visible(entry.visible) }}</td>
<td>
{{ widgets.button_group({
'edit': path('admin_customer_edit', {'id': entry.id}),
'trash': '#'
}) }}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'admin_customer_paginated') }}
{% endblock %}

View File

@@ -6,40 +6,40 @@
{% block page_subtitle %}{{ 'admin_project.subtitle'|trans }} {{ 'subtitle.amount'|trans({'%count%': entries.count}) }}{% endblock %}
{% block main %}
{% if entries.count > 0 %}
{{ tables.data_table_header({
'label.id': 'hidden-xs',
'label.name': '',
'label.customer': '',
'label.comment': 'hidden-xs hidden-sm',
'label.activity': 'hidden-xs hidden-sm',
'label.budget': 'hidden-xs',
'label.visible': '',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td class="hidden-xs">{{ entry.id }}</td>
<td>{{ entry.name }}</td>
<td>
<a href="{{ path('admin_customer_edit', {'id' : entry.customer.id}) }}">{{ widgets.label_customer(entry.customer) }}</a>
</td>
<td class="hidden-xs hidden-sm">{{ entry.comment }}</td>
<td class="hidden-xs hidden-sm">{{ widgets.badge_counter(entry.activities.count) }}</td>
<td class="hidden-xs">{{ entry.budget|money(entry.customer.currency) }}</td>
<td>{{ widgets.label_visible(entry.visible) }}</td>
<td>
{{ widgets.button_group({
'edit': path('admin_project_edit', {'id': entry.id}),
'trash': '#'
}) }}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'admin_project_paginated') }}
{% else %}
{% if entries.count == 0 %}
{{ widgets.callout('warning', 'error.no_entries_found') }}
{% endif %}
{{ tables.data_table_header({
'label.id': 'hidden-xs',
'label.name': '',
'label.customer': '',
'label.comment': 'hidden-xs hidden-sm',
'label.activity': 'hidden-xs hidden-sm',
'label.budget': 'hidden-xs',
'label.visible': '',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td class="hidden-xs">{{ entry.id }}</td>
<td>{{ entry.name }}</td>
<td>
<a href="{{ path('admin_customer_edit', {'id' : entry.customer.id}) }}">{{ widgets.label_customer(entry.customer) }}</a>
</td>
<td class="hidden-xs hidden-sm">{{ entry.comment }}</td>
<td class="hidden-xs hidden-sm">{{ widgets.badge_counter(entry.activities.count) }}</td>
<td class="hidden-xs">{{ entry.budget|money(entry.customer.currency) }}</td>
<td>{{ widgets.label_visible(entry.visible) }}</td>
<td>
{{ widgets.button_group({
'edit': path('admin_project_edit', {'id': entry.id}),
'trash': '#'
}) }}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'admin_project_paginated') }}
{% endblock %}

View File

@@ -1,56 +1,52 @@
{% extends 'base.html.twig' %}
{% import "macros/widgets.html.twig" as widgets %}
{% import "macros/datatables.html.twig" as datatables %}
{% import "macros/datatables.html.twig" as tables %}
{% block page_title %}{{ 'admin_timesheet.title'|trans }}{% endblock %}
{% block page_subtitle %}{{ 'admin_timesheet.subtitle'|trans }}{% endblock %}
{% block javascript_imports %}<script src="{{ asset('js/timesheet.js') }}"></script>{% endblock %}
{% block main %}
{% if toolbarForm %}
{{ include('default/_toolbar_form.html.twig', {'form': toolbarForm}) }}
{% endif %}
{% if entries.count > 0 %}
{{ datatables.data_table_header({
'label.date': '',
'label.starttime': 'hidden-xs',
'label.endtime': 'hidden-xs',
'label.duration': '',
'label.rate': '',
'label.username': 'hidden-xs',
'label.description': 'hidden-xs hidden-sm',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td>{{ entry.begin|date(kimai_context.date_1) }}</td>
<td class="hidden-xs">{{ entry.begin|date("H:i") }}</td>
{% if entry.end %}
<td class="hidden-xs">{{ entry.end|date("H:i") }}</td>
<td>{{ entry.duration|duration }}</td>
<td>{{ entry.rate|money(entry.activity.project.customer.currency) }}</td>
{% else %}
<td class="hidden-xs">&dash;</td>
<td>&dash;</td>
<td>&dash;</td>
{% endif %}
<td class="hidden-xs"><a href="{{ path('profile'|route_alias, {'username' : entry.user.username}) }}">{{ entry.user.username }}</a></td>
<td class="hidden-xs hidden-sm">{{ entry.description }}</td>
<td>
{% if entry.end %}
{{ widgets.button_group({'edit': '#', 'trash': '#'}) }}
{% else %}
{{ widgets.button_group({'stop': path('admin_timesheet_stop', {'id' : entry.id}), 'edit': '#', 'trash': '#'}) }}
{% endif %}
</td>
</tr>
{% endfor %}
{{ datatables.data_table_footer(entries, 'admin_timesheet_paginated') }}
{% else %}
{% if entries.count == 0 %}
{{ widgets.callout('warning', 'error.no_entries_found') }}
{% endif %}
{{ tables.data_table_header({
'label.date': '',
'label.starttime': 'hidden-xs',
'label.endtime': 'hidden-xs',
'label.duration': '',
'label.rate': '',
'label.username': 'hidden-xs',
'label.description': 'hidden-xs hidden-sm',
'label.actions': '',
}, toolbarForm) }}
{% for entry in entries %}
<tr>
<td>{{ entry.begin|date(kimai_context.date_1) }}</td>
<td class="hidden-xs">{{ entry.begin|date("H:i") }}</td>
{% if entry.end %}
<td class="hidden-xs">{{ entry.end|date("H:i") }}</td>
<td>{{ entry.duration|duration }}</td>
<td>{{ entry.rate|money(entry.activity.project.customer.currency) }}</td>
{% else %}
<td class="hidden-xs">&dash;</td>
<td>&dash;</td>
<td>&dash;</td>
{% endif %}
<td class="hidden-xs"><a href="{{ path('profile'|route_alias, {'username' : entry.user.username}) }}">{{ entry.user.username }}</a></td>
<td class="hidden-xs hidden-sm">{{ entry.description }}</td>
<td>
{% if entry.end %}
{{ widgets.button_group({'edit': '#', 'trash': '#'}) }}
{% else %}
{{ widgets.button_group({'stop': path('admin_timesheet_stop', {'id' : entry.id}), 'edit': '#', 'trash': '#'}) }}
{% endif %}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'admin_timesheet_paginated') }}
{% endblock %}

View File

@@ -1,55 +1,51 @@
{% extends 'base.html.twig' %}
{% import "macros/widgets.html.twig" as widgets %}
{% import "macros/datatables.html.twig" as datatables %}
{% import "macros/datatables.html.twig" as tables %}
{% block page_title %}{{ 'timesheet.title'|trans }}{% endblock %}
{% block page_subtitle %}{{ 'timesheet.subtitle'|trans }}{% endblock %}
{% block javascript_imports %}<script src="{{ asset('js/timesheet.js') }}"></script>{% endblock %}
{% block main %}
{% if toolbarForm %}
{{ include('default/_toolbar_form.html.twig', {'form': toolbarForm}) }}
{% endif %}
{% if entries.count > 0 %}
{{ datatables.data_table_header({
'label.date': '',
'label.starttime': '',
'label.endtime': '',
'label.duration': 'hidden-xs',
'label.rate': 'hidden-xs',
'label.activity': 'hidden-xs hidden-sm',
'label.description': 'hidden-xs hidden-sm',
'label.actions': '',
}) }}
{% for entry in entries %}
<tr>
<td>{{ entry.begin|date(kimai_context.date_1) }}</td>
<td>{{ entry.begin|date("H:i") }}</td>
{% if entry.end %}
<td>{{ entry.end|date("H:i") }}</td>
<td class="hidden-xs">{{ entry.duration|duration }}</td>
<td class="hidden-xs">{{ entry.rate|money(entry.activity.project.customer.currency) }}</td>
{% else %}
<td>&dash;</td>
<td class="hidden-xs"><i>{{ entry.duration|duration }}</i></td>
<td class="hidden-xs">&dash;</td>
{% endif %}
<td class="hidden-xs hidden-sm">{{ entry.activity.name }}</td>
<td class="hidden-xs hidden-sm">{{ entry.description }}</td>
<td>
{% if entry.end %}
{{ widgets.button_group({'repeat': '#', 'edit': path('timesheet_edit', {'id' : entry.id, 'page': page}), 'trash': '#'}) }}
{% else %}
{{ widgets.button_group({'stop': path('timesheet_stop', {'id' : entry.id}), 'edit': path('timesheet_edit', {'id' : entry.id, 'page': page}), 'trash': '#'}) }}
{% endif %}
</td>
</tr>
{% endfor %}
{{ datatables.data_table_footer(entries, 'timesheet_paginated') }}
{% else %}
{% if entries.count == 0 %}
{{ widgets.callout('warning', 'error.no_entries_found') }}
{% endif %}
{{ tables.data_table_header({
'label.date': '',
'label.starttime': '',
'label.endtime': '',
'label.duration': 'hidden-xs',
'label.rate': 'hidden-xs',
'label.activity': 'hidden-xs hidden-sm',
'label.description': 'hidden-xs hidden-sm',
'label.actions': '',
}, toolbarForm) }}
{% for entry in entries %}
<tr>
<td>{{ entry.begin|date(kimai_context.date_1) }}</td>
<td>{{ entry.begin|date("H:i") }}</td>
{% if entry.end %}
<td>{{ entry.end|date("H:i") }}</td>
<td class="hidden-xs">{{ entry.duration|duration }}</td>
<td class="hidden-xs">{{ entry.rate|money(entry.activity.project.customer.currency) }}</td>
{% else %}
<td>&dash;</td>
<td class="hidden-xs"><i>{{ entry.duration|duration }}</i></td>
<td class="hidden-xs">&dash;</td>
{% endif %}
<td class="hidden-xs hidden-sm">{{ entry.activity.name }}</td>
<td class="hidden-xs hidden-sm">{{ entry.description }}</td>
<td>
{% if entry.end %}
{{ widgets.button_group({'repeat': '#', 'edit': path('timesheet_edit', {'id' : entry.id, 'page': page}), 'trash': '#'}) }}
{% else %}
{{ widgets.button_group({'stop': path('timesheet_stop', {'id' : entry.id}), 'edit': path('timesheet_edit', {'id' : entry.id, 'page': page}), 'trash': '#'}) }}
{% endif %}
</td>
</tr>
{% endfor %}
{{ tables.data_table_footer(entries, 'timesheet_paginated') }}
{% endblock %}