Add qualité in personsuggestion

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

@@ -1,13 +1,14 @@
 <template>
     <div class="container tpartycontainer">
       <div class="tparty-identification">
+        <span v-if="item.result.profession" class="profession">{{ item.result.profession.name.fr }}</span>
         <span class="name">
-           {{ item.result.text }}&nbsp;
+            {{ item.result.text }}&nbsp;
         </span>
         <span class="location">
           <template v-if="hasAddress">
-           {{ getAddress.text }} -
-           {{ getAddress.postcode.name }}
+            {{ getAddress.text }} -
+            {{ getAddress.postcode.name }}
           </template>
         </span>
       </div>
@@ -19,15 +20,15 @@
     </div>
 
     <div class="right_actions">
-       <badge-entity
-         :entity="item.result"
-         :options="{ displayLong: true }">
-       </badge-entity>
-       <on-the-fly
-           type="thirdparty"
-           v-bind:id="item.result.id"
-           action="show">
-       </on-the-fly>
+      <badge-entity
+        :entity="item.result"
+        :options="{ displayLong: true }">
+      </badge-entity>
+      <on-the-fly
+          type="thirdparty"
+          v-bind:id="item.result.id"
+          action="show">
+      </on-the-fly>
     </div>
 </template>
 
@@ -48,54 +49,59 @@ const i18n = {
 };
 
 export default {
-   name: 'SuggestionThirdParty',
-   components: {
-      OnTheFly,
-      BadgeEntity
-   },
-   props: ['item'],
-   i18n,
-   computed: {
-     hasAddress() {
-       if (this.$props.item.result.address !== null) {
-         return true;
-       }
-       if (this.$props.item.result.parent !== null) {
-         this.$props.item.result.parent.address !== null;
-       }
-     },
-     hasParent() {
-       return this.$props.item.result.parent !== null;
-     },
-     getAddress() {
-       if (this.$props.item.result.address !== null) {
-         return this.$props.item.result.address;
-       }
-       if (this.$props.item.result.parent.address !== null) {
-         return this.$props.item.result.parent.address;
-       }
+  name: 'SuggestionThirdParty',
+  components: {
+    OnTheFly,
+    BadgeEntity
+  },
+  props: ['item'],
+  i18n,
+  computed: {
+    hasAddress() {
+      if (this.$props.item.result.address !== null) {
+        return true;
+      }
+      if (this.$props.item.result.parent !== null) {
+        this.$props.item.result.parent.address !== null;
+      }
+    },
+    hasParent() {
+      return this.$props.item.result.parent !== null;
+    },
+    getAddress() {
+      if (this.$props.item.result.address !== null) {
+        return this.$props.item.result.address;
+      }
+      if (this.$props.item.result.parent.address !== null) {
+        return this.$props.item.result.parent.address;
+      }
 
-       return null;
-     }
-   }
+      return null;
+    },
+  }
 }
 </script>
 
 <style lang="scss" scoped>
 .tpartycontainer {
- .tpartyparent {
-    .name {
-      font-weight: bold;
-      font-variant: all-small-caps;
+  .tpartyparent {
+      .name {
+        font-weight: bold;
+        font-variant: all-small-caps;
+      }
+  }
+  .tparty-identification {
+    span:not(.name) {
+      margin-left: 0.5em;
+      opacity: 0.5;
+      font-size: 90%;
+      font-style: italic;
     }
- }
- .tparty-identification {
-   span:not(.name) {
-     margin-left: 0.5em;
-     opacity: 0.5;
-     font-size: 90%;
-     font-style: italic;
-   }
- }
+    .profession {
+      font-weight: 800;
+      color: black;
+      font-style: normal;
+    }
+  }
 }
 </style>