improve project view table (#2441)
This commit is contained in:
@@ -28,3 +28,4 @@
|
||||
@import 'reporting';
|
||||
@import 'forms';
|
||||
@import 'modal';
|
||||
@import 'progressbar';
|
||||
|
||||
@@ -80,4 +80,8 @@ th.w-min,
|
||||
td.w-min {
|
||||
width: 1%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
table.dataTable thead > tr > th.hw-min {
|
||||
width: 1%;
|
||||
white-space: normal;
|
||||
}
|
||||
@@ -158,6 +158,7 @@ table.dataTable thead .sorting_desc_disabled:before {
|
||||
}
|
||||
|
||||
table.dataTable thead > tr > th {
|
||||
vertical-align: top;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
20
assets/sass/progressbar.scss
Normal file
20
assets/sass/progressbar.scss
Normal 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
1
public/build/app.186b6ae9.css
Normal file
File diff suppressed because one or more lines are too long
@@ -21,15 +21,19 @@
|
||||
{% endif %}
|
||||
|
||||
<div class="progress-group">
|
||||
<span class="progress-text">{{ title }}{% if percentReached >= 0 and subTitle is not empty %} – {{ percentReached|number_format(2) }}%{% endif %}</span>
|
||||
<span class="progress-number">
|
||||
{% if percentReached >= 0 and subTitle is empty %}
|
||||
{{ percentReached|number_format(2) }}%
|
||||
{% elseif subTitle is not empty %}
|
||||
{{ subTitle }}
|
||||
{% endif %}
|
||||
</span>
|
||||
|
||||
<div class="progress-title">
|
||||
<span class="progress-text">
|
||||
{{ title }}
|
||||
{% if percentReached >= 0 and subTitle is not empty %} – {{ percentReached|number_format(2) }}%{% endif %}
|
||||
</span>
|
||||
<span class="progress-number">
|
||||
{% if percentReached >= 0 and subTitle is empty %}
|
||||
{{ percentReached|number_format(2) }}%
|
||||
{% elseif subTitle is not empty %}
|
||||
{{ subTitle }}
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progress-bar {{ class }}" role="progressbar" aria-valuenow="{{ width }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ width }}%"></div>
|
||||
</div>
|
||||
|
||||
@@ -4,12 +4,12 @@
|
||||
{{ widgets.page_actions(event.actions) }}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro project(project, view, options) %}
|
||||
{% macro project(project, view) %}
|
||||
{% import "macros/widgets.html.twig" as widgets %}
|
||||
{% set event = actions(app.user, 'project', view, {'project': project}) %}
|
||||
{% if view == 'index' or view == 'custom' %}
|
||||
{{ widgets.table_actions(event.payload.actions) }}
|
||||
{{ widgets.table_actions(event.actions) }}
|
||||
{% else %}
|
||||
{{ widgets.page_actions(event.payload.actions) }}
|
||||
{{ widgets.page_actions(event.actions) }}
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
@@ -4,17 +4,18 @@
|
||||
{% block report_title %}{{ 'report_project_view'|trans({}, 'reporting') }}{% endblock %}
|
||||
|
||||
{% set columns = {
|
||||
'name': {'class': 'alwaysVisible w-min'},
|
||||
'today': {'class': 'text-nowrap text-center w-min', 'title': 'daterangepicker.today'|trans({}, 'daterangepicker')},
|
||||
'week': {'class': 'text-nowrap text-center w-min', 'title': 'agendaWeek'|trans},
|
||||
'month': {'class': 'text-nowrap text-center w-min', 'title': 'month'|trans},
|
||||
'durationTotal': {'class': 'hidden-md hidden-sm hidden-xs text-nowrap text-center w-min', 'title': 'label.total'|trans},
|
||||
'timeBudget': {'class': 'text-nowrap', 'title': 'label.timeBudget'|trans},
|
||||
'budget': {'class': 'text-nowrap', 'title': 'label.budget'|trans},
|
||||
'stateDuration': {'class': 'hidden-sm hidden-xs text-nowrap text-center w-min', 'title': 'label.not_exported'|trans},
|
||||
'stateMoney': {'class': 'hidden-sm hidden-xs text-nowrap text-center w-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},
|
||||
'name': {'class': 'alwaysVisible'},
|
||||
'today': {'class': 'hidden-md hidden-sm hidden-xs text-center hw-min', 'title': 'stats.durationToday'|trans},
|
||||
'week': {'class': 'hidden-md hidden-sm hidden-xs text-center hw-min', 'title': 'stats.durationWeek'|trans},
|
||||
'month': {'class': 'hidden-md hidden-sm hidden-xs text-center hw-min', 'title': 'stats.durationMonth'|trans},
|
||||
'durationTotal': {'class': 'text-center hw-min', 'title': 'stats.durationTotal'|trans},
|
||||
'timeBudget': {'class': 'hidden-xs', 'title': 'label.timeBudget'|trans},
|
||||
'budget': {'class': 'hidden-xs', 'title': 'label.budget'|trans},
|
||||
'stateDuration': {'class': 'hidden-sm hidden-xs text-center hw-min', 'title': 'label.not_exported'|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-center w-min', 'title': 'label.project_end'|trans},
|
||||
'comment': {'class': 'hidden-md hidden-sm hidden-xs hidden', 'title': 'label.comment'|trans},
|
||||
'actions': {'class': 'actions alwaysVisible'},
|
||||
} %}
|
||||
{% set tableName = 'project_view_reporting' %}
|
||||
|
||||
@@ -30,6 +31,7 @@
|
||||
{% import "macros/progressbar.html.twig" as progress %}
|
||||
{% import "macros/widgets.html.twig" as widgets %}
|
||||
{% 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_before %}
|
||||
{{ 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) %}
|
||||
{% if is_granted('budget', mapping.customer) %}
|
||||
<tr>
|
||||
<th colspan="11">{{ widgets.label_customer(mapping.customer) }}</th>
|
||||
<tr class="summary">
|
||||
<td colspan="11">{{ widgets.label_customer(mapping.customer) }}</td>
|
||||
</tr>
|
||||
{% for entry in mapping.projects|sort((a, b) => a.project.name <=> b.project.name) %}
|
||||
{% set project = entry.project %}
|
||||
{% set currency = project.customer.currency %}
|
||||
{% 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, 'today') }}">{{ entry.durationDay|duration }}</td>
|
||||
<td class="{{ tables.data_table_column_class(tableName, columns, 'week') }}">{{ entry.durationWeek|duration }}</td>
|
||||
@@ -94,6 +96,9 @@
|
||||
</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, 'actions') }}">
|
||||
{{ projectActions.project(project, 'custom') }}
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
Reference in New Issue
Block a user