diff --git a/CHANGELOG.md b/CHANGELOG.md
index f7cb2cbc8..e98d70eb6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -46,10 +46,13 @@ and this project adheres to
 * [visgraph] improve and fix bugs on vis-network relationship graph
 * [bugfix] posting of birth- and deathdate through api fixed.
 * [suggestions] improve suggestions lists
-* [badge-entity] design coherency between badge-person and 3 kinds of badge-thirdparty
+* [badge-entity] design coherency between pills badge-person and 3 kinds of badge-thirdparty
 * [AddPersons] suggestions row are clickable, not only checkbox
 * [activity] improve show/new/edit templates, fix SEE and SEE_DETAILS acl
-* [activity][calendar] concerned groups items are clickable with on-the-fly modal, create specific badge for TMS column
+* [badges] create specific badge for TMS, and make person/thirdparty badges clickable with on-the-fly modal in :
+  * concerned groups items (activity, calendar)
+  * accompanyingCourseWork lists
+  * accompanyingCourse lists
 
 ### Test release 2021-11-19 - bis
 
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingPeriod/_list.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingPeriod/_list.html.twig
index af8657e28..ebfbed604 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingPeriod/_list.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingPeriod/_list.html.twig
@@ -66,10 +66,22 @@
                                 <div class="wl-col title"><h3>{{ 'Requestor'|trans({'gender': null }) }}</h3></div>
                                 <div class="wl-col list">
                                     {% if accompanying_period.requestorPerson is not null %}
-                                        <span class="wl-item badge-person">{{ accompanying_period.requestorPerson|chill_entity_render_string }}</span>
+                                        <span class="wl-item">
+                                            {% include '@ChillMain/OnTheFly/_insert_vue_onthefly.html.twig' with {
+                                                action: 'show', displayBadge: true,
+                                                targetEntity: { name: 'person', id: accompanying_period.requestorPerson.id },
+                                                buttonText: accompanying_period.requestorPerson|chill_entity_render_string
+                                            } %}
+                                        </span>
                                     {% endif %}
                                     {% if accompanying_period.requestorThirdParty is not null %}
-                                        <span class="wl-item badge-thirdparty">{{ accompanying_period.requestorThirdParty|chill_entity_render_string }}</span>
+                                        <span class="wl-item">
+                                            {% include '@ChillMain/OnTheFly/_insert_vue_onthefly.html.twig' with {
+                                                action: 'show', displayBadge: true,
+                                                targetEntity: { name: 'thirdparty', id: accompanying_period.requestorThirdParty.id },
+                                                buttonText: accompanying_period.requestorThirdParty|chill_entity_render_string
+                                            } %}
+                                        </span>
                                     {% endif %}
                                 </div>
                             </div>
@@ -80,13 +92,12 @@
                                 <div class="wl-col title"><h3>{{ 'Participants'|trans }}</h3></div>
                                 <div class="wl-col list">
                                     {% for p in accompanying_period.getCurrentParticipations %}
-                                        <span class="wl-item badge-person">
-                                            <a href="{{ path('chill_person_accompanying_period_list', { person_id: p.person.id }) }}">
-                                                {{ p.person|chill_entity_render_string }}
-                                            </a>
-                                            {#  or in renderbox mode
-                                                {{ p.person|chill_entity_render_box({'render': 'label', 'addAltNames': false, 'addLink': true, 'hLevel': 5 }) }}
-                                            #}
+                                        <span class="wl-item">
+                                            {% include '@ChillMain/OnTheFly/_insert_vue_onthefly.html.twig' with {
+                                                action: 'show', displayBadge: true,
+                                                targetEntity: { name: 'person', id: p.person.id },
+                                                buttonText: p.person|chill_entity_render_string
+                                            } %}
                                         </span>
                                     {% endfor %}
                                 </div>