mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-12 13:24:25 +00:00
list activity flex-table design
This commit is contained in:
parent
31468aeae0
commit
c1ba892811
@ -33,3 +33,64 @@ div.flex-bloc.concerned-groups {
|
|||||||
flex-basis: 33%; //3 blocs
|
flex-basis: 33%; //3 blocs
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// exceptions for flex-table in list-records
|
||||||
|
div.flex-table.list-records {
|
||||||
|
div.item-bloc {
|
||||||
|
div.item-row.main {
|
||||||
|
div.item-col {
|
||||||
|
&:first-child {
|
||||||
|
flex-basis: 27%;
|
||||||
|
}
|
||||||
|
ul.list-content {
|
||||||
|
li.social-issues, li.social-actions {
|
||||||
|
.badge-primary {
|
||||||
|
font-variant: small-caps;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 88%;
|
||||||
|
margin-bottom: 0.2em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
li.social-issues .badge-primary {
|
||||||
|
background-color: var(--chill-orange);
|
||||||
|
}
|
||||||
|
li.social-actions .badge-primary {
|
||||||
|
background-color: var(--chill-green);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
div.item-row.details {
|
||||||
|
flex-direction: row;
|
||||||
|
& > div.item-col {
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-self: center;
|
||||||
|
&:nth-child(1) {
|
||||||
|
flex-grow: 1; flex-shrink: 0; flex-basis: 30%;
|
||||||
|
}
|
||||||
|
&:nth-child(2) {
|
||||||
|
flex-grow: 0; flex-shrink: 1; flex-basis: 70%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
div.concerned-groups {
|
||||||
|
font-size: 85%;
|
||||||
|
h4 {
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ul.list-content {
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 1em;
|
||||||
|
margin: 0 0;
|
||||||
|
li {
|
||||||
|
margin-bottom: 0.2em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
div.duration {
|
||||||
|
font-size: smaller;
|
||||||
|
padding-left: 1em;
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -46,14 +46,27 @@
|
|||||||
] %}
|
] %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div class="flex-bloc concerned-groups {{ context }}">
|
{% set level1 = (with_display == 'bloc') ? context ~ ' flex-bloc ' : '' %}
|
||||||
|
{% set level2 = (with_display == 'bloc') ? 'item-bloc ' : '' %}
|
||||||
|
{% set level3 = (with_display == 'bloc') ? 'item-row ' : '' %}
|
||||||
|
{% set level4 = (with_display == 'bloc') ? 'item-col ' : '' %}
|
||||||
|
|
||||||
|
<div class="{{ level1 }}concerned-groups">
|
||||||
|
|
||||||
{% for bloc in blocs %}
|
{% for bloc in blocs %}
|
||||||
<div class="item-bloc">
|
<div class="{{ level2 }}">
|
||||||
<div class="item-row">
|
<div class="{{ level3 }}">
|
||||||
<div class="item-col">
|
<div class="{{ level4 }}">
|
||||||
<h4>{{ bloc.title }}</h4>
|
|
||||||
|
{% if with_display == 'bloc' or bloc.items|length > 0 %}
|
||||||
|
<h4>{{ bloc.title }}</h4>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% if with_display == 'bloc' %}
|
||||||
</div>
|
</div>
|
||||||
<div class="item-col">
|
<div class="{{ level4 }}">
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<ul class="list-content">
|
<ul class="list-content">
|
||||||
{% for item in bloc.items %}
|
{% for item in bloc.items %}
|
||||||
<li>
|
<li>
|
||||||
@ -69,4 +82,5 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -16,7 +16,9 @@
|
|||||||
<a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'accompanying_period_id': accompanying_course_id}) }}" class="sc-button bt-create button-small"></a>
|
<a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'accompanying_period_id': accompanying_course_id}) }}" class="sc-button bt-create button-small"></a>
|
||||||
</p>
|
</p>
|
||||||
{% else %}
|
{% else %}
|
||||||
<table class="records_list">
|
|
||||||
|
<div class="flex-table list-records {{ context }}">
|
||||||
|
<!--
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th class="chill-red">{{'Date' | trans }}</th>
|
<th class="chill-red">{{'Date' | trans }}</th>
|
||||||
@ -26,48 +28,149 @@
|
|||||||
<th> </th>
|
<th> </th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
-->
|
||||||
{% for activity in activities %}
|
{% for activity in activities %}
|
||||||
<tr>
|
<div class="item-bloc">
|
||||||
<td>{% if activity.date %}{{ activity.date|format_date('long') }}{% endif %}</td>
|
<div class="item-row main">
|
||||||
<td>{{ activity.durationTime|date('H:i') }}</td>
|
<div class="item-col">
|
||||||
<td>
|
|
||||||
|
{% if activity.date %}
|
||||||
|
<h3>{{ activity.date|format_date('long') }}</h3>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<div class="duration">
|
||||||
|
<p>
|
||||||
|
<i class="fa fa-fw fa-hourglass-end"></i>
|
||||||
|
{{ activity.durationTime|date('H:i') }}
|
||||||
|
</p>
|
||||||
|
|
||||||
|
{% if activity.travelTime %}
|
||||||
|
<p>
|
||||||
|
<i class="fa fa-fw fa-car"></i>
|
||||||
|
{{ activity.travelTime|date('H:i') }}
|
||||||
|
</p>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="item-col">
|
||||||
|
<ul class="list-content">
|
||||||
|
|
||||||
|
{% if activity.user %}
|
||||||
|
<li>
|
||||||
|
<b>{{ 'by'|trans }}{{ activity.user.usernameCanonical }}</b>
|
||||||
|
</li>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<li>
|
||||||
|
<b>{{ activity.type.name | localize_translatable_string }}</b>
|
||||||
|
|
||||||
|
{% if activity.attendee is not null %}
|
||||||
|
{% if activity.attendee %}
|
||||||
|
{{ '→ ' ~ 'present'|trans|capitalize }}
|
||||||
|
{% else %}
|
||||||
|
{{ '→ ' ~ 'not present'|trans|capitalize }}
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
<b>{{ 'location'|trans ~ ': ' }}</b>
|
||||||
|
Domicile de l'usager
|
||||||
|
{#
|
||||||
|
{% if activity.location %}{{ activity.location }}{% endif %}
|
||||||
|
#}
|
||||||
|
</li>
|
||||||
|
|
||||||
|
{%- if activity.reasons is defined -%}
|
||||||
|
<li>
|
||||||
|
{%- if activity.reasons is empty -%}
|
||||||
|
<span class="chill-no-data-statement">{{ 'No reason associated'|trans }}</span>
|
||||||
|
{%- else -%}
|
||||||
|
{% for r in activity.reasons %}
|
||||||
|
{{ r|chill_entity_render_box }}
|
||||||
|
{% endfor %}
|
||||||
|
{%- endif -%}
|
||||||
|
</li>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{%- if activity.socialIssues is defined -%}
|
||||||
|
<li class="social-issues">
|
||||||
|
{%- if activity.socialIssues is empty -%}
|
||||||
|
<span class="chill-no-data-statement">{{ 'No social issues associated'|trans }}</span>
|
||||||
|
{%- else -%}
|
||||||
|
{% for r in activity.socialIssues %}
|
||||||
|
<span class="badge badge-primary">
|
||||||
|
{% if r.parent %}
|
||||||
|
{{ r.parent.title|localize_translatable_string ~ ' > ' }}
|
||||||
|
{% endif %}
|
||||||
|
{{ r.title|localize_translatable_string }}
|
||||||
|
</span>
|
||||||
|
{% endfor %}
|
||||||
|
{%- endif -%}
|
||||||
|
</li>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{%- if activity.socialActions is defined -%}
|
||||||
|
<li class="social-actions">
|
||||||
|
{%- if activity.socialActions is empty -%}
|
||||||
|
<span class="chill-no-data-statement">{{ 'No social actions associated'|trans }}</span>
|
||||||
|
{%- else -%}
|
||||||
|
{% for r in activity.socialActions %}
|
||||||
|
<span class="badge badge-primary">{{ r.title|localize_translatable_string }}</span>
|
||||||
|
{% endfor %}
|
||||||
|
{%- endif -%}
|
||||||
|
</li>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
<ul class="record_actions">
|
||||||
|
<li>
|
||||||
|
<a href="{{ path('chill_activity_activity_show', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="sc-button bt-show "></a>
|
||||||
|
</li>
|
||||||
|
{# TOOD
|
||||||
|
{% if is_granted('CHILL_ACTIVITY_UPDATE', activity) %}
|
||||||
|
#}
|
||||||
|
<li>
|
||||||
|
<a href="{{ path('chill_activity_activity_edit', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="sc-button bt-update "></a>
|
||||||
|
</li>
|
||||||
|
{# TOOD
|
||||||
|
{% endif %}
|
||||||
|
{% if is_granted('CHILL_ACTIVITY_DELETE', activity) %}
|
||||||
|
#}
|
||||||
|
<li>
|
||||||
|
<a href="{{ path('chill_activity_activity_delete', { 'id': activity.id, 'person_id' : person_id, 'accompanying_period_id': accompanying_course_id } ) }}" class="sc-button bt-delete "></a>
|
||||||
|
</li>
|
||||||
|
{#
|
||||||
|
{% endif %}
|
||||||
|
#}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{%
|
||||||
|
if activity.comment.comment is not empty
|
||||||
|
or activity.persons|length > 0
|
||||||
|
or activity.thirdParties|length > 0
|
||||||
|
or activity.users|length > 0
|
||||||
|
%}
|
||||||
|
<div class="item-row details">
|
||||||
|
<div class="item-col">
|
||||||
|
{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {'context': context, 'with_display': 'row', 'entity': activity } %}
|
||||||
|
</div>
|
||||||
|
|
||||||
{% if activity.comment.comment is not empty %}
|
{% if activity.comment.comment is not empty %}
|
||||||
{{ activity.comment|chill_entity_render_box( { 'limit_lines': 3, 'metadata': false } ) }}
|
<div class="item-col comment">
|
||||||
|
{{ activity.comment|chill_entity_render_box( { 'limit_lines': 3, 'metadata': false } ) }}
|
||||||
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{%- if activity.reasons is empty -%}
|
</div>
|
||||||
{{ 'No reason associated'|trans }}
|
{% endif %}
|
||||||
{%- else -%}
|
|
||||||
{% for r in activity.reasons %}{{ r|chill_entity_render_box }} {% endfor %}
|
</div>
|
||||||
{%- endif -%}
|
|
||||||
</td>
|
|
||||||
<td>{{ activity.type.name | localize_translatable_string }}</td>
|
|
||||||
<td>
|
|
||||||
<ul class="record_actions">
|
|
||||||
<li>
|
|
||||||
<a href="{{ path('chill_activity_activity_show', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="sc-button bt-show "></a>
|
|
||||||
</li>
|
|
||||||
{# TOOD
|
|
||||||
{% if is_granted('CHILL_ACTIVITY_UPDATE', activity) %}
|
|
||||||
#}
|
|
||||||
<li>
|
|
||||||
<a href="{{ path('chill_activity_activity_edit', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="sc-button bt-update "></a>
|
|
||||||
</li>
|
|
||||||
{# TOOD
|
|
||||||
{% endif %}
|
|
||||||
{% if is_granted('CHILL_ACTIVITY_DELETE', activity) %}
|
|
||||||
#}
|
|
||||||
<li>
|
|
||||||
<a href="{{ path('chill_activity_activity_delete', { 'id': activity.id, 'person_id' : person_id, 'accompanying_period_id': accompanying_course_id } ) }}" class="sc-button bt-delete "></a>
|
|
||||||
</li>
|
|
||||||
{#
|
|
||||||
{% endif %}
|
|
||||||
#}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</tbody>
|
</div>
|
||||||
</table>
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<ul class="record_actions">
|
<ul class="record_actions">
|
||||||
@ -77,3 +180,4 @@
|
|||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
{{ dump()}}
|
||||||
|
|||||||
@ -5,5 +5,5 @@
|
|||||||
{% block title %}{{ 'Activity list' |trans }}{% endblock title %}
|
{% block title %}{{ 'Activity list' |trans }}{% endblock title %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
{% include 'ChillActivityBundle:Activity:list.html.twig' %}
|
{% include 'ChillActivityBundle:Activity:list.html.twig' with {'context': 'accompanyingCourse'} %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|||||||
@ -21,5 +21,5 @@
|
|||||||
{% block title %}{{ 'Activity list' |trans }}{% endblock title %}
|
{% block title %}{{ 'Activity list' |trans }}{% endblock title %}
|
||||||
|
|
||||||
{% block personcontent %}
|
{% block personcontent %}
|
||||||
{% include 'ChillActivityBundle:Activity:list.html.twig' %}
|
{% include 'ChillActivityBundle:Activity:list.html.twig' with {'context': 'person'} %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|||||||
@ -10,7 +10,7 @@
|
|||||||
</dl>
|
</dl>
|
||||||
|
|
||||||
<h2 class="chill-red">{{ 'Concerned groups'|trans }}</h2>
|
<h2 class="chill-red">{{ 'Concerned groups'|trans }}</h2>
|
||||||
{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {'context': context } %}
|
{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {'context': context, 'with_display': 'bloc' } %}
|
||||||
|
|
||||||
<h2 class="chill-red">{{ 'Activity data'|trans }}</h2>
|
<h2 class="chill-red">{{ 'Activity data'|trans }}</h2>
|
||||||
<dl class="chill_view_data">
|
<dl class="chill_view_data">
|
||||||
|
|||||||
@ -24,6 +24,8 @@ Update activity: Modifier l'activité
|
|||||||
Scope: Cercle
|
Scope: Cercle
|
||||||
Activity data: Données de l'activité
|
Activity data: Données de l'activité
|
||||||
No reason associated: Aucun sujet
|
No reason associated: Aucun sujet
|
||||||
|
No social issues associated: Aucune problématique sociale
|
||||||
|
No social actions associated: Aucune action d'accompagnement
|
||||||
There isn't any activities.: Aucune activité enregistrée.
|
There isn't any activities.: Aucune activité enregistrée.
|
||||||
type_name: type de l'activité
|
type_name: type de l'activité
|
||||||
person_firstname: prénom
|
person_firstname: prénom
|
||||||
@ -39,6 +41,8 @@ Emergency: Urgent
|
|||||||
Sent received: Envoyer / Recevoir
|
Sent received: Envoyer / Recevoir
|
||||||
Sent: Envoyer
|
Sent: Envoyer
|
||||||
Received: Recevoir
|
Received: Recevoir
|
||||||
|
by: 'Par '
|
||||||
|
location: Lieu
|
||||||
|
|
||||||
|
|
||||||
#forms
|
#forms
|
||||||
|
|||||||
@ -75,6 +75,6 @@ export default {
|
|||||||
<style src="vue-multiselect/dist/vue-multiselect.css"></style>
|
<style src="vue-multiselect/dist/vue-multiselect.css"></style>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
span.multiselect__tag {
|
span.multiselect__tag {
|
||||||
background: #e2793d;
|
background: var(--chill-orange);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user