jjsm01/kimai2
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

improve project view table (#2441)

Browse Source
This commit is contained in:
Kevin Papst
2021-03-16 15:59:31 +01:00
committed by GitHub
parent 16e8e8a5e5
commit 954ba7c937
8 changed files with 61 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
assets/sass/app.scss
View File

@@ -28,3 +28,4 @@
@import 'reporting'; @import 'reporting';
@import 'forms'; @import 'forms';
@import 'modal'; @import 'modal';
@import 'progressbar';

4
assets/sass/content.scss
View File

@@ -80,4 +80,8 @@ th.w-min,
td.w-min { td.w-min {
width: 1%; width: 1%;
white-space: nowrap; white-space: nowrap;
}
table.dataTable thead > tr > th.hw-min {
width: 1%;
white-space: normal;
} }

1
assets/sass/datatable.scss
View File

@@ -158,6 +158,7 @@ table.dataTable thead .sorting_desc_disabled:before {
} }
table.dataTable thead > tr > th { table.dataTable thead > tr > th {
vertical-align: top;
white-space: nowrap; white-space: nowrap;
} }

20
assets/sass/progressbar.scss Normal file
View File

@@ -0,0 +1,20 @@
/*
make sure that the progressbar title does not wrap and does not need to be embedded in a container with white-space: nowrap
used for example in the project-overview report
*/
.progress-group {
.progress-title {
width: 100%;
white-space: nowrap;
.progress-text {
display: inline-block;
width: 1%;
}
.progress-number {
display: inline-block;
width: 98%;
text-align: right;
float: none;
}
}
}

1
public/build/app.186b6ae9.css Normal file
View File

File diff suppressed because one or more lines are too long

22
templates/macros/progressbar.html.twig
View File

@@ -21,15 +21,19 @@
{% endif %} {% endif %}
<div class="progress-group"> <div class="progress-group">
<span class="progress-text">{{ title }}{% if percentReached >= 0 and subTitle is not empty %} &ndash; {{ percentReached|number_format(2) }}%{% endif %}</span> <div class="progress-title">
<span class="progress-number"> <span class="progress-text">
{% if percentReached >= 0 and subTitle is empty %} {{ title }}
{{ percentReached|number_format(2) }}% {% if percentReached >= 0 and subTitle is not empty %} &ndash; {{ percentReached|number_format(2) }}%{% endif %}
{% elseif subTitle is not empty %} </span>
{{ subTitle }} <span class="progress-number">
{% endif %} {% if percentReached >= 0 and subTitle is empty %}
</span> {{ percentReached|number_format(2) }}%
{% elseif subTitle is not empty %}
{{ subTitle }}
{% endif %}
</span>
</div>
<div class="progress"> <div class="progress">
<div class="progress-bar {{ class }}" role="progressbar" aria-valuenow="{{ width }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ width }}%"></div> <div class="progress-bar {{ class }}" role="progressbar" aria-valuenow="{{ width }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ width }}%"></div>
</div> </div>

6
templates/project/actions.html.twig
View File

@@ -4,12 +4,12 @@
{{ widgets.page_actions(event.actions) }} {{ widgets.page_actions(event.actions) }}
{% endmacro %} {% endmacro %}
{% macro project(project, view, options) %} {% macro project(project, view) %}
{% import "macros/widgets.html.twig" as widgets %} {% import "macros/widgets.html.twig" as widgets %}
{% set event = actions(app.user, 'project', view, {'project': project}) %} {% set event = actions(app.user, 'project', view, {'project': project}) %}
{% if view == 'index' or view == 'custom' %} {% if view == 'index' or view == 'custom' %}
{{ widgets.table_actions(event.payload.actions) }} {{ widgets.table_actions(event.actions) }}
{% else %} {% else %}
{{ widgets.page_actions(event.payload.actions) }} {{ widgets.page_actions(event.actions) }}
{% endif %} {% endif %}
{% endmacro %} {% endmacro %}

31
templates/reporting/project_view.html.twig
View File

@@ -4,17 +4,18 @@
{% block report_title %}{{ 'report_project_view'|trans({}, 'reporting') }}{% endblock %} {% block report_title %}{{ 'report_project_view'|trans({}, 'reporting') }}{% endblock %}
{% set columns = { {% set columns = {
'name': {'class': 'alwaysVisible w-min'}, 'name': {'class': 'alwaysVisible'},
'today': {'class': 'text-nowrap text-center w-min', 'title': 'daterangepicker.today'|trans({}, 'daterangepicker')}, 'today': {'class': 'hidden-md hidden-sm hidden-xs text-center hw-min', 'title': 'stats.durationToday'|trans},
'week': {'class': 'text-nowrap text-center w-min', 'title': 'agendaWeek'|trans}, 'week': {'class': 'hidden-md hidden-sm hidden-xs text-center hw-min', 'title': 'stats.durationWeek'|trans},
'month': {'class': 'text-nowrap text-center w-min', 'title': 'month'|trans}, 'month': {'class': 'hidden-md hidden-sm hidden-xs text-center hw-min', 'title': 'stats.durationMonth'|trans},
'durationTotal': {'class': 'hidden-md hidden-sm hidden-xs text-nowrap text-center w-min', 'title': 'label.total'|trans}, 'durationTotal': {'class': 'text-center hw-min', 'title': 'stats.durationTotal'|trans},
'timeBudget': {'class': 'text-nowrap', 'title': 'label.timeBudget'|trans}, 'timeBudget': {'class': 'hidden-xs', 'title': 'label.timeBudget'|trans},
'budget': {'class': 'text-nowrap', 'title': 'label.budget'|trans}, 'budget': {'class': 'hidden-xs', 'title': 'label.budget'|trans},
'stateDuration': {'class': 'hidden-sm hidden-xs text-nowrap text-center w-min', 'title': 'label.not_exported'|trans}, 'stateDuration': {'class': 'hidden-sm hidden-xs text-center hw-min', 'title': 'label.not_exported'|trans},
'stateMoney': {'class': 'hidden-sm hidden-xs text-nowrap text-center w-min', 'title': 'label.not_invoiced'|trans}, 'stateMoney': {'class': 'hidden-sm hidden-xs text-center hw-min', 'title': 'label.not_invoiced'|trans},
'projectEnd': {'class': 'hidden-md hidden-sm hidden-xs hidden text-nowrap text-center w-min', 'title': 'label.project_end'|trans}, 'projectEnd': {'class': 'hidden-md hidden-sm hidden-xs hidden text-center w-min', 'title': 'label.project_end'|trans},
'comment': {'class': 'hidden-md hidden-sm hidden-xs hidden', 'title': 'label.comment'|trans}, 'comment': {'class': 'hidden-md hidden-sm hidden-xs hidden', 'title': 'label.comment'|trans},
'actions': {'class': 'actions alwaysVisible'},
} %} } %}
{% set tableName = 'project_view_reporting' %} {% set tableName = 'project_view_reporting' %}
@@ -30,6 +31,7 @@
{% import "macros/progressbar.html.twig" as progress %} {% import "macros/progressbar.html.twig" as progress %}
{% import "macros/widgets.html.twig" as widgets %} {% import "macros/widgets.html.twig" as widgets %}
{% import "macros/datatables.html.twig" as tables %} {% import "macros/datatables.html.twig" as tables %}
{% import "project/actions.html.twig" as projectActions %}
{% block box_body_class %}project-view-reporting-box {% if hasData %}no-padding{% endif %} table-responsive{% endblock %} {% block box_body_class %}project-view-reporting-box {% if hasData %}no-padding{% endif %} table-responsive{% endblock %}
{% block box_before %} {% block box_before %}
{{ form_start(form, {'attr': {'class': 'form-inline form-reporting', 'id': 'project-view-form'}}) }} {{ form_start(form, {'attr': {'class': 'form-inline form-reporting', 'id': 'project-view-form'}}) }}
@@ -51,14 +53,14 @@
{% for id, mapping in entries|sort((a, b) => a.customer.name <=> b.customer.name) %} {% for id, mapping in entries|sort((a, b) => a.customer.name <=> b.customer.name) %}
{% if is_granted('budget', mapping.customer) %} {% if is_granted('budget', mapping.customer) %}
<tr> <tr class="summary">
<th colspan="11">{{ widgets.label_customer(mapping.customer) }}</th> <td colspan="11">{{ widgets.label_customer(mapping.customer) }}</td>
</tr> </tr>
{% for entry in mapping.projects|sort((a, b) => a.project.name <=> b.project.name) %} {% for entry in mapping.projects|sort((a, b) => a.project.name <=> b.project.name) %}
{% set project = entry.project %} {% set project = entry.project %}
{% set currency = project.customer.currency %} {% set currency = project.customer.currency %}
{% if is_granted('budget', project) %} {% if is_granted('budget', project) %}
<tr{% if is_granted('view', project) %} class="alternative-link open-edit" data-href="{{ path('project_details', {'id': project.id}) }}"{% endif %}> <tr>
<td class="{{ tables.data_table_column_class(tableName, columns, 'name') }}">{{ widgets.label_project(project) }}</td> <td class="{{ tables.data_table_column_class(tableName, columns, 'name') }}">{{ widgets.label_project(project) }}</td>
<td class="{{ tables.data_table_column_class(tableName, columns, 'today') }}">{{ entry.durationDay|duration }}</td> <td class="{{ tables.data_table_column_class(tableName, columns, 'today') }}">{{ entry.durationDay|duration }}</td>
<td class="{{ tables.data_table_column_class(tableName, columns, 'week') }}">{{ entry.durationWeek|duration }}</td> <td class="{{ tables.data_table_column_class(tableName, columns, 'week') }}">{{ entry.durationWeek|duration }}</td>
@@ -94,6 +96,9 @@
</td> </td>
<td class="{{ tables.data_table_column_class(tableName, columns, 'projectEnd') }}">{% if project.end is not null %}{{ project.end|date_short }}{% endif %}</td> <td class="{{ tables.data_table_column_class(tableName, columns, 'projectEnd') }}">{% if project.end is not null %}{{ project.end|date_short }}{% endif %}</td>
<td class="{{ tables.data_table_column_class(tableName, columns, 'comment') }}">{{ project.comment }}</td> <td class="{{ tables.data_table_column_class(tableName, columns, 'comment') }}">{{ project.comment }}</td>
<td class="{{ tables.data_table_column_class(tableName, columns, 'actions') }}">
{{ projectActions.project(project, 'custom') }}
</td>
</tr> </tr>
{% endif %} {% endif %}
{% endfor %} {% endfor %}