Merge branch 'badge_by_entity_type' into 'master'

Badge-thirdparty

See merge request Chill-Projet/chill-bundles!258

CHANGELOG.md

@@ -44,6 +44,9 @@ and this project adheres to
 * [activity] create work if a work with same social action is not associated to the activity
 * [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
+* [AddPersons] suggestions row are clickable, not only checkbox
 
 ### Test release 2021-11-19 - bis
 

CONVENTIONS.md

@@ -409,3 +409,4 @@ Créer un titre enlevable (avec une croix rouge cliquable, l'ancre a est vide)
     <a></a>
 </div>
 ```
+Les classes `cols` ou `inline` peuvent être ajoutées à côté de `list-suggest` pour modifier la disposition de la liste.

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/ConcernedGroups.vue

@@ -11,7 +11,7 @@
             </persons-bloc>
         </div>
         <div v-if="getContext === 'accompanyingCourse' && suggestedEntities.length > 0">
-            <ul class="list-suggest add-items">
+            <ul class="list-suggest add-items inline">
                 <li v-for="p in suggestedEntities" @click="addSuggestedEntity(p)">
                     <span>{{ p.text }}</span>
                 </li>

src/Bundle/ChillMainBundle/Resources/public/chill/scss/badge.scss

@@ -25,6 +25,15 @@ ul.list-suggest {
         text-align: start;
         margin-bottom: 3px;
     }
+    &.cols {
+        columns: 3;
+    }
+    &.inline {
+        li {
+            display: inline-block;
+            margin-right: 0.2em;
+        }
+    }
     &.add-items {
         li {
             cursor: pointer;
@@ -34,6 +43,9 @@ ul.list-suggest {
                 content: "\f067"; // fa-plus
                 color: var(--bs-success);
             }
+            & span:hover {
+                color: $chill-l-gray;
+            }
         }
     }
     &.remove-items {

src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/BadgeEntity.vue

@@ -0,0 +1,42 @@
+<template>
+
+    <span v-if="entity.type === 'person'" class="badge rounded-pill bg-person">
+        {{ $t('renderbox.person') }}
+    </span>
+
+    <span v-if="entity.type === 'thirdparty'" class="badge rounded-pill bg-thirdparty">
+
+        <template v-if="options.displayLong !== true">
+            {{ $t('renderbox.type.thirdparty')}}
+        </template>
+
+        <i class="fa fa-fw fa-user" v-if="entity.kind === 'child'"></i>
+        <i class="fa fa-fw fa-hospital-o" v-else-if="entity.kind === 'company'"></i>
+        <i class="fa fa-fw fa-user-md" v-else></i>
+
+        <template v-if="options.displayLong === true">
+            <span v-if="entity.kind === 'child'">{{ $t('tparty.child')}}</span>
+            <span v-else-if="entity.kind === 'company'">{{ $t('tparty.company')}}</span>
+            <span v-else>{{ $t('tparty.contact')}}</span>
+        </template>
+    </span>
+
+</template>
+
+<script>
+export default {
+    name: "BadgeEntity",
+    props: ['options', 'entity'],
+    i18n: {
+        messages: {
+            fr: {
+                tparty: {
+                    child: "Personne de contact",
+                    company: "Personne morale",
+                    contact: "Personne physique",
+                }
+            }
+        }
+    }
+}
+</script>

src/Bundle/ChillMainBundle/Resources/views/FilterOrder/base.html.twig

@@ -1,5 +1,5 @@
 {{ form_start(form) }}
-    <div class="chill_filter_order container">
+    <div class="chill_filter_order container my-4">
         <div class="row">
             {% if form.vars.has_search_box %}
               <div class="col-md-12">

src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss

@@ -162,6 +162,13 @@ div.activity-list {
 }
 
 /*
+* Specific badge rounded-pill
 */
-
+.badge {
+    &.bg-person {
+        //@extend .$chill-ll-gray;
+        background-color: $chill-ll-gray;
+        color: $chill-green;
+    }
+}
 

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated.vue

@@ -48,7 +48,7 @@
    </div>
 
    <div v-if="suggestedPersons.length > 0">
-      <ul class="list-suggest add-items">
+      <ul class="list-suggest add-items inline">
          <li v-for="p in suggestedPersons" :key="p.id" @click="addSuggestedPerson(p)">
              <span>{{ p.text }}</span>
           </li>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Referrer.vue

@@ -20,7 +20,7 @@
       </VueMultiselect>
 
       <template v-if="referrersSuggested.length > 0">
-         <ul class="list-suggest add-items">
+         <ul class="list-suggest add-items inline">
             <li v-for="u in referrersSuggested" @click="updateReferrer(u)">
                <span>
                   <user-render-box-badge :user="u"></user-render-box-badge>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Requestor.vue

@@ -134,7 +134,7 @@
    </div>
 
    <div v-if="accompanyingCourse.requestor === null && suggestedEntities.length > 0">
-      <ul class="list-suggest add-items">
+      <ul class="list-suggest add-items inline">
          <li v-for="p in suggestedEntities" :key="uniqueId(p)" @click="addSuggestedEntity(p)">
              <span>{{ p.text }}</span>
           </li>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources.vue

@@ -20,7 +20,7 @@
    </div>
 
    <div v-if="suggestedEntities.length > 0">
-      <ul class="list-suggest add-items">
+      <ul class="list-suggest add-items inline">
          <li v-for="p in suggestedEntities" :key="uniqueId(p)" @click="addSuggestedEntity(p)">
              <span>{{ p.text }}</span>
           </li>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources/ResourceItem.vue

@@ -2,33 +2,81 @@
    <person-render-box render="bloc"
       v-if="resource.resource.type === 'person'"
       :person="resource.resource"
-      :options="{ addInfo : true, addId : false, addEntity: true, addLink: false, addAltNames: true, addAge : false, hLevel : 3, isConfidential : true }"
+      :options="{
-      >
+         addInfo : true,
+         addId : false,
+         addEntity: true,
+         addLink: false,
+         addAltNames: true,
+         addAge : false,
+         hLevel : 3,
+         isConfidential : true
+      }">
       <template v-slot:record-actions>
          <ul class="record_actions">
-            <!--
+            <li>
-            <button-location v-if="hasCurrentHouseholdAddress" :person="resource.resource"></button-location>
+               <on-the-fly
-            -->
+                  :type="resource.resource.type"
-            <li><on-the-fly :type="resource.resource.type" :id="resource.resource.id" action="show"></on-the-fly></li>
+                  :id="resource.resource.id"
-            <li><on-the-fly :type="resource.resource.type" :id="resource.resource.id" action="edit" @saveFormOnTheFly="saveFormOnTheFly"></on-the-fly></li>
+                  action="show">
-            <li><button class="btn btn-sm btn-remove" :title="$t('action.remove')" @click.prevent="$emit('remove', resource)"></button></li>
+               </on-the-fly>
+            </li>
+            <li>
+               <on-the-fly
+                  :type="resource.resource.type"
+                  :id="resource.resource.id"
+                  action="edit"
+                  @saveFormOnTheFly="saveFormOnTheFly">
+               </on-the-fly>
+            </li>
+            <li>
+               <button
+                  class="btn btn-sm btn-remove"
+                  :title="$t('action.remove')"
+                  @click.prevent="$emit('remove', resource)">
+               </button>
+            </li>
          </ul>
       </template>
-
    </person-render-box>
+
    <third-party-render-box
       v-if="resource.resource.type === 'thirdparty'"
       :thirdparty="resource.resource"
-      :options="{ addLink : false, addId : false, addEntity: true, addInfo: false, hLevel: 3 }"
+      :options="{
-      >
+         addLink : false,
+         addId : false,
+         addEntity: true,
+         addInfo: false,
+         //addComment: true,
+         hLevel: 3
+      }">
       <template v-slot:record-actions>
          <ul class="record_actions">
-            <li><on-the-fly :type="resource.resource.type" :id="resource.resource.id" action="show"></on-the-fly></li>
+            <li>
-            <li><on-the-fly :type="resource.resource.type" :id="resource.resource.id" action="edit" @saveFormOnTheFly="saveFormOnTheFly"></on-the-fly></li>
+               <on-the-fly
-            <li><button class="btn btn-sm btn-remove" :title="$t('action.remove')" @click.prevent="$emit('remove', resource)"></button></li>
+                  :type="resource.resource.type"
+                  :id="resource.resource.id"
+                  action="show">
+               </on-the-fly>
+            </li>
+            <li>
+               <on-the-fly
+                  :type="resource.resource.type"
+                  :id="resource.resource.id"
+                  action="edit"
+                  @saveFormOnTheFly="saveFormOnTheFly">
+               </on-the-fly>
+            </li>
+            <li>
+               <button
+                  class="btn btn-sm btn-remove"
+                  :title="$t('action.remove')"
+                  @click.prevent="$emit('remove', resource)">
+               </button>
+            </li>
          </ul>
       </template>
-
    </third-party-render-box>
 </template>
 

src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdMembersEditor/App.vue

@@ -15,7 +15,12 @@
   <confirmation v-if="step === 'confirm'"></confirmation>
 
   <ul class="record_actions sticky-form-buttons">
-    <li class="cancel" v-if="step !== 'concerned' || hasReturnPath">
+    <li class="cancel" v-if="step !== 'concerned'">
+      <button class="btn btn-cancel" @click="goToPrevious">
+        {{ $t('household_members_editor.app.previous') }}
+      </button>
+    </li>
+    <li class="cancel" v-else-if="hasReturnPath">
       <button class="btn btn-cancel" @click="goToPrevious">
         {{ $t('household_members_editor.app.cancel') }}
       </button>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdMembersEditor/components/CurrentHousehold.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="flex-table" v-if="hasHousehold">
+  <div class="flex-table mb-5" v-if="hasHousehold">
     <div class="item-bloc">
       <household-render-box :household="fakeHouseholdWithConcerned"></household-render-box>
     </div>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdMembersEditor/js/i18n.js

@@ -51,6 +51,7 @@ const appMessages = {
        },
       app: {
        next: 'Suivant',
+       previous: 'Précédent',
        cancel: 'Annuler',
        save: 'Enregistrer',
         steps: {

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons/PersonSuggestion.vue

@@ -1,6 +1,7 @@
 <template>
    <div class="list-item" :class="{ checked: isChecked }">
 
+      <label>
          <div>
             <input
                v-bind:type="type"
@@ -24,6 +25,7 @@
             v-if="item.result.type === 'user'"
             v-bind:item="item">
          </suggestion-user>
+      </label>
 
    </div>
 </template>
@@ -78,6 +80,9 @@ export default {
             background-color: #ececec;
             border-bottom: 1px dotted #8b8b8b;
          }
+         label {
+            display: inline-flex;
+            width: 100%;
             div.container {
                & > input {
                   margin-right: 0.8em;
@@ -106,4 +111,5 @@ export default {
             }
          }
       }
+   }
 </style>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons/TypePerson.vue

@@ -1,6 +1,5 @@
 <template>
    <div class="container">
-   
       <span class="name">
          {{ item.result.text }}
       </span>
@@ -11,29 +10,30 @@
          {{ item.result.current_household_address.text }} -
          {{ item.result.current_household_address.postcode.name }}
       </span>
-      
    </div>
-   <div class="right_actions">
 
-      <span class="badge rounded-pill bg-secondary" :title="item.key">
+   <div class="right_actions">
-         {{ $t('item.type_person') }}
+      <badge-entity
-      </span>
+        :entity="item.result"
+        :options="{ displayLong: true }">
+      </badge-entity>
       <on-the-fly
          type="person"
          v-bind:id="item.result.id"
          action="show">
       </on-the-fly>
-      
    </div>
 </template>
 
 <script>
 import OnTheFly from 'ChillMainAssets/vuejs/OnTheFly/components/OnTheFly.vue';
+import BadgeEntity from 'ChillMainAssets/vuejs/_components/BadgeEntity.vue';
 
 export default {
    name: 'SuggestionPerson',
    components: {
      OnTheFly,
+     BadgeEntity
    },
    props: ['item'],
    computed: {

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons/TypeThirdParty.vue

@@ -17,33 +17,23 @@
         </span>
       </div>
     </div>
+
     <div class="right_actions">
-
+       <badge-entity
-     <span class="badge bg-thirdparty-child" v-if="item.result.kind == 'child'">
+         :entity="item.result"
-        {{ $t('thirdparty.child')}}
+         :options="{ displayLong: true }">
-     </span>
+       </badge-entity>
-      <span class="badge bg-thirdparty-company" v-else-if="item.result.kind == 'company'">
-       {{ $t('thirdparty.company')}}
-      </span>
-      <span class="badge bg-thirdparty-contact" v-else="item.result.kind == 'contact'">
-        {{ $t('thirdparty.contact')}}
-      </span>
-
-      <span class="badge rounded-pill bg-secondary" :title="item.key">
-         {{ $t('item.type_thirdparty') }}
-      </span>
-
        <on-the-fly
            type="thirdparty"
            v-bind:id="item.result.id"
            action="show">
        </on-the-fly>
-
     </div>
 </template>
 
 <script>
 import OnTheFly from 'ChillMainAssets/vuejs/OnTheFly/components/OnTheFly.vue';
+import BadgeEntity from 'ChillMainAssets/vuejs/_components/BadgeEntity.vue';
 
 const i18n = {
   messages: {
@@ -60,7 +50,8 @@ const i18n = {
 export default {
    name: 'SuggestionThirdParty',
    components: {
-      OnTheFly
+      OnTheFly,
+      BadgeEntity
    },
    props: ['item'],
    i18n,

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue

@@ -24,7 +24,11 @@
                    </span>
 
                    <span v-if="options.addId ==  true" class="id-number" :title="'n° ' + person.id">{{ person.id }}</span>
-                   <span v-if="options.addEntity ==  true" class="badge rounded-pill bg-secondary">{{ $t('renderbox.person') }}</span>
+
+                   <badge-entity v-if="options.addEntity === true"
+                      :entity="person"
+                      :options="{ displayLong: options.entityDisplayLong }">
+                   </badge-entity>
 
                 </div>
 
@@ -140,12 +144,14 @@
 import {dateToISO} from 'ChillMainAssets/chill/js/date.js';
 import AddressRenderBox from 'ChillMainAssets/vuejs/_components/Entity/AddressRenderBox.vue';
 import Confidential from 'ChillMainAssets/vuejs/_components/Confidential.vue';
+import BadgeEntity from 'ChillMainAssets/vuejs/_components/BadgeEntity.vue';
 
 export default {
     name: "PersonRenderBox",
     components: {
         AddressRenderBox,
-        Confidential
+        Confidential,
+        BadgeEntity
     },
     props: ['person', 'options', 'render', 'returnPath'],
     computed: {

src/Bundle/ChillPersonBundle/Resources/views/Household/members_editor.html.twig

@@ -4,7 +4,7 @@
 {% block title 'household.Edit household members'|trans  %}
 
 {% block content %}
-<div class="household-members">
+<div class="col-md-10 col-xxl household-members">
 
     <h1>{{ block('title') }}</h1>
     <div id="household_members_editor"></div>

src/Bundle/ChillThirdPartyBundle/Entity/ThirdParty.php

@@ -128,6 +128,7 @@ class ThirdParty implements TrackCreationInterface, TrackUpdateInterface
 
     /**
      * @ORM\Column(name="comment", type="text", nullable=true)
+     * @Groups({"read"})
      */
     private ?string $comment = null;
 

src/Bundle/ChillThirdPartyBundle/Resources/public/chill/chillthirdparty.scss

@@ -1,16 +1,23 @@
 @import 'ChillMainAssets/module/bootstrap/shared';
 
-.badge {
+/// Specific badge rounded-pill
-    &.bg-thirdparty-company {
+.badge.rounded-pill {
-        //@extend .bg-info;
+    &.bg-thirdparty {
-        background-color: $yellow;
+        //@extend .$chill-ll-gray;
-    }
+        background-color: $chill-ll-gray;
-    &.bg-thirdparty-child {
+        color: $chill-pink;
-        //@extend .bg-chill-blue;
+    }
-        background-color: $chill-blue;
+}
-    }
+
-    &.bg-thirdparty-contact {
+/// force first column width in list
-        //@extedn .bg-secondary;
+div.thirdparty-list {
-        background-color: $secondary;
+    div.flex-table {
+        div.item-bloc {
+            div.item-row {
+                div.item-col:first-child {
+                    flex-basis: 25%;
+                }
+            }
+        }
     }
 }

src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_components/Entity/ThirdPartyRenderBox.vue

@@ -10,27 +10,16 @@
                     <a v-if="this.options.addLink === true" href="#">
                         <span class="name">{{ thirdparty.text }}</span>
                     </a>
-                    <span class="name">{{ thirdparty.text }}</span>
+                    <span class="name" v-else>{{ thirdparty.text }}</span>
 
-                    <span class="badge bg-thirdparty-child" v-if="thirdparty.kind == 'child'">
+                    <span v-if="options.addId === true" class="id-number" :title="'n° ' + thirdparty.id">
-                        {{ $t('thirdparty.child')}}
+                        {{ thirdparty.id }}
-                    </span>
-                    <span class="badge bg-thirdparty-company" v-else-if="thirdparty.kind == 'company'">
-                       {{ $t('thirdparty.company')}}
-                    </span>
-                    <span class="badge bg-thirdparty-contact" v-else>
-                        {{ $t('thirdparty.contact')}}
                     </span>
 
-                    <span v-if="options.addId ==  true" class="id-number" :title="'n° ' + thirdparty.id">{{ thirdparty.id }}</span>
+                    <badge-entity v-if="options.addEntity === true"
-                    <span v-if="options.addEntity ==  true && thirdparty.type === 'thirdparty'" class="badge rounded-pill bg-secondary">{{ $t('renderbox.type.thirdparty') }}</span>
+                        :entity="thirdparty"
-
+                        :options="{ displayLong: options.entityDisplayLong }">
-                </div>
+                    </badge-entity>
-
-                <div v-if="hasParent">
-                    <span class="name tparty-parent">
-                        > {{ thirdparty.parent.text }}
-                    </span>
                 </div>
 
                 <p v-if="this.options.addInfo === true" class="moreinfo">
@@ -38,13 +27,38 @@
             </div>
         </div>
 
-
         <div class="item-col">
            <div class="float-button bottom">
               <div class="box">
                  <div class="action">
                     <slot name="record-actions"></slot>
                  </div>
+                 <ul class="list-content fa-ul">
+                     <li v-if="hasParent">
+                         <i class="fa fa-li fa-hand-o-right"></i>
+                         <b class="me-2">{{ $t('child_of') }}</b>
+                         <span class="chill-entity badge-thirdparty">{{ thirdparty.parent.text }}</span>
+                         <!-- console: [Vue warn]: Failed to resolve component: on-the-fly ...
+                             <on-the-fly type="thirdparty" action="show" :id="thirdparty.parent.id"
+                                 :buttonText="thirdparty.parent.text" :displayBadge="'true' === 'true'"
+                             ></on-the-fly>
+                         -->
+                     </li>
+                     <!-- TODO hasChildren
+                     <li v-if="hasChildren">
+                         <i class="fa fa-li fa-hand-o-right"></i>
+                         <b class="me-2">{{ $t('children') }}</b>
+                         <span v-for="child in thirdparty.activeChildren">
+                             <on-the-fly type="thirdparty"
+                                 action="show"
+                                 :id="child.id"
+                                 :buttonText="child.text"
+                                 displayBadge="'true' === 'true'">
+                             </on-the-fly>
+                         </span>
+                     </li>
+                     -->
+                 </ul>
                  <confidential v-if="thirdparty.contactDataAnonymous">
                     <template v-slot:confidential-content>
                         <ul class="list-content fa-ul">
@@ -77,6 +91,9 @@
                          <a :href="'mailto: ' + thirdparty.email">{{ thirdparty.email }}</a>
                      </li>
                  </ul>
+                  <div v-if="options.addComment && !thirdparty.contactDataAnonymous && thirdparty.comment">
+                      <blockquote class="chill-user-quote">{{ thirdparty.comment }}</blockquote>
+                  </div>
               </div>
            </div>
         </div>
@@ -91,25 +108,24 @@
 import AddressRenderBox from 'ChillMainAssets/vuejs/_components/Entity/AddressRenderBox.vue';
 import {dateToISO} from 'ChillMainAssets/chill/js/date.js';
 import Confidential from 'ChillMainAssets/vuejs/_components/Confidential.vue';
-
+import BadgeEntity from 'ChillMainAssets/vuejs/_components/BadgeEntity.vue';
-const i18n = {
+//import OnTheFly from 'ChillMainAssets/vuejs/OnTheFly/components/OnTheFly.vue';
-    messages: {
-        fr: {
-            tparty: {
-                contact: "Personne physique",
-                company: "Personne morale"
-            }
-        }
-    }
-};
 
 export default {
     name: "ThirdPartyRenderBox",
     components: {
         AddressRenderBox,
-        Confidential
+        Confidential,
+        BadgeEntity,
+        //OnTheFly
+    },
+    i18n: {
+        messages: {
+            fr: {
+                children: "Personnes de contact: ",
+                child_of: "Contact de: ",
+        }}
     },
-    i18n,
     props: ['thirdparty', 'options'],
     computed: {
         isMultiline: function() {
@@ -120,8 +136,13 @@ export default {
             }
         },
         hasParent() {
-            return !(this.$props.thirdparty.parent === null || this.$props.thirdparty.parent === undefined);
+            return !(this.thirdparty.parent === null || this.thirdparty.parent === undefined);
-        }
+        },
+        /* TODO need backend normalizer to serve children without circular reference
+        hasChildren() {
+            //console.log(this.thirdparty.activeChildren.length > 0)
+            return false
+        } */
     }
 }
 </script>

src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_components/OnTheFly/ThirdParty.vue

@@ -5,7 +5,8 @@
             :thirdparty="thirdparty"
             :options="{
                addInfo: true,
-               addEntity: false,
+               addEntity: true,
+               entityDisplayLong: true,
                addAltNames: true,
                addId: true,
                addLink: false,
@@ -13,6 +14,7 @@
                hLevel: 3,
                addCenter: true,
                addNoData: true,
+               addComment: true,
                isMultiline: true
             }"
          ></third-party-render-box>
@@ -24,7 +26,7 @@
            <div class="form-check">
                <input class="form-check-input mt-0" type="radio" v-model="kind" value="company" id="tpartyKindInstitution">
                <label for="tpartyKindInstitution" class="required">
-                   <span class="badge bg-thirdparty-company" style="padding-top: 0;">
+                   <span class="badge rounded-pill bg-thirdparty-company" style="padding-top: 0;">
                        {{ $t('tparty.company')}}
                    </span>
                </label>
@@ -32,7 +34,7 @@
            <div class="form-check">
                <input class="form-check-input mt-0" type="radio" v-model="kind" value="contact" id="tpartyKindContact">
                <label for="tpartyKindContact" class="required">
-                   <span class="badge bg-thirdparty-contact" style="padding-top: 0;">
+                   <span class="badge rounded-pill bg-thirdparty-contact" style="padding-top: 0;">
                        {{ $t('tparty.contact')}}
                    </span>
                </label>

src/Bundle/ChillThirdPartyBundle/Resources/views/Entity/thirdparty.html.twig

@@ -82,7 +82,19 @@
     <div class="item-row entity-bloc">
         <div class="item-col">
             {{ _self.label(thirdparty, options) }}
-             <span class="badge bg-thirdparty-{{ thirdparty.kind }}">{{ ('thirdparty.' ~ thirdparty.kind)|trans }}</span>
+            {% if thirdparty.kind == 'child' %}
+                <span class="badge rounded-pill bg-thirdparty">
+                    <i class="fa fa-fw fa-user"></i>{{ 'thirdparty.child'|trans }}
+                </span>
+            {% elseif thirdparty.kind == 'company' %}
+                <span class="badge rounded-pill bg-thirdparty">
+                    <i class="fa fa-fw fa-hospital-o"></i>{{ 'thirdparty.company'|trans }}
+                </span>
+            {% else %}
+                <span class="badge rounded-pill bg-thirdparty">
+                    <i class="fa fa-fw fa-user-md"></i>{{ 'thirdparty.contact'|trans }}
+                </span>
+            {% endif %}
         </div>
         <div class="item-col">
         {% if options['isConfidential'] %}
@@ -160,7 +172,9 @@
     </div>
     {% if options['showContacts'] and thirdparty.activeChildren|length > 0 %}
     <div class="item-row">
-        {{ 'thirdparty.Children'|trans }}&nbsp;:
+        <div class="item-col"></div>
+        <div class="item-col">
+            <h5 class="me-2">{{ 'thirdparty.Children'|trans ~ ': ' }}</h5>
             {% for c in thirdparty.activeChildren %}
                 {% include '@ChillMain/OnTheFly/_insert_vue_onthefly.html.twig' with {
                     targetEntity: { name: 'thirdparty', id: c.id },
@@ -170,10 +184,14 @@
                 } %}
             {% endfor %}
         </div>
+    </div>
     {% endif %}
+
     {% if options['showParent'] and thirdparty.isChild %}
         <div class="item-row">
-            {{ 'thirdparty.Contact of'|trans }}&nbsp;:
+            <div class="item-col"></div>
+            <div class="item-col">
+                <h5 class="me-2">{{ 'thirdparty.Contact of'|trans ~ ': ' }}</h5>
                 {% include '@ChillMain/OnTheFly/_insert_vue_onthefly.html.twig' with {
                     targetEntity: { name: 'thirdparty', id: thirdparty.parent.id },
                     action: 'show',
@@ -181,6 +199,7 @@
                     buttonText: thirdparty.parent|chill_entity_render_string
                 } %}
             </div>
+        </div>
     {% endif %}
 
 {%- endif -%}

src/Bundle/ChillThirdPartyBundle/Resources/views/ThirdParty/index.html.twig

@@ -6,6 +6,26 @@
 
 {% block content %}
     {% embed '@ChillMain/CRUD/_index.html.twig' %}
+
+        {% macro rowCustomButtons(tp) %}
+            {% if is_granted('CHILL_3PARTY_3PARTY_UPDATE', tp) %}
+                <li>
+                    <a href="{{ chill_path_add_return_path('chill_crud_3party_3party_edit',
+                        { 'id': (tp.isParent ? tp.id : tp.parent.id) }) }}"
+                       title="{{ 'Edit'|trans }}"
+                       class="btn btn-sm btn-update"></a>
+                </li>
+            {% endif %}
+            {% if is_granted('CHILL_3PARTY_3PARTY_SHOW', tp) %}
+                <li>
+                    <a href="{{ chill_path_add_return_path('chill_crud_3party_3party_view',
+                        { 'id': (tp.isParent ? tp.id : tp.parent.id) }) }}"
+                       title="{{ 'Show'|trans }}"
+                       class="btn btn-sm btn-show"></a>
+                </li>
+            {% endif %}
+        {% endmacro %}
+
         {% block index_header %}
             <h1>{{ 'List of third parties'|trans  }}</h1>
         {% endblock %}
@@ -13,37 +33,25 @@
         {% block table_entities %}
             <div class="thirdparty-list my-5">
                 <div class="row justify-content-center">
-                    <div>
 
-                        <label class="counter">
+                    <label class="counter text-end">
                         <span>{{ paginator.totalItems }}</span> {{ 'third parties'|trans }}
                     </label>
 
                     <div class="flex-table">
                         {% for tp in third_parties %}
                             <div class="item-bloc">
-                                    {{ tp|chill_entity_render_box({'render': 'bloc', 'addLink': false, 'showContacts': true, 'isConfidential': (tp.contactDataAnonymous ? true : false) }) }}
+                                {{ tp|chill_entity_render_box({
-                                    <div class="item-row separator">
+                                    'render': 'bloc',
-                                        <ul class="record_actions">
+                                    'showContacts': true,
-                                            {% if is_granted('CHILL_3PARTY_3PARTY_UPDATE', tp) %}
+                                    'addLink': true,
-                                                <li>
+                                    'customButtons': { 'replace': _self.rowCustomButtons(tp) },
-                                                    <a href="{{ chill_path_add_return_path('chill_crud_3party_3party_edit',
+                                    'isConfidential': (tp.contactDataAnonymous ? true : false)
-                                                        { 'id': (tp.isParent ? tp.id : tp.parent.id) }) }}" class="btn btn-sm btn-update"></a>
+                                }) }}
-                                                </li>
-                                            {% endif %}
-                                            {% if is_granted('CHILL_3PARTY_3PARTY_SHOW', tp) %}
-                                                <li>
-                                                    <a href="{{ chill_path_add_return_path('chill_crud_3party_3party_view',
-                                                        { 'id': (tp.isParent ? tp.id : tp.parent.id) }) }}" class="btn btn-sm btn-show"></a>
-                                                </li>
-                                            {% endif %}
-                                        </ul>
-
-                                    </div>
                             </div>
                         {% endfor %}
                     </div>
-                    </div>
+
                 </div>
             </div>
         {% endblock %}

src/Bundle/ChillThirdPartyBundle/Resources/views/ThirdParty/view.html.twig

@@ -12,7 +12,7 @@
             {% block crud_content_header %}
                 <h1>
                     {{ title_ }}
-                    <span class="badge bg-{{ thirdParty.active ? 'success' : 'danger' }}"
+                    <span class="badge bg-{{ thirdParty.active ? 'success' : 'danger' }} float-end"
                           title="{{ (thirdParty.active ? 'shown to users' : 'not shown to users')|trans }}">
                         {{ (thirdParty.active ? 'Active' : 'Inactive')|trans }}
                     </span>

src/Bundle/ChillThirdPartyBundle/Serializer/Normalizer/ThirdPartyNormalizer.php

@@ -45,6 +45,7 @@ class ThirdPartyNormalizer implements NormalizerAwareInterface, NormalizerInterf
             'parent' => $this->normalizer->normalize($thirdParty->getParent(), $format, $context),
             'civility' => $this->normalizer->normalize($thirdParty->getCivility(), $format, $context),
             'contactDataAnonymous' => $thirdParty->isContactDataAnonymous(),
+            'comment' => $thirdParty->getComment(),
         ];
     }