The last column of our report will feature the list of followers, with the avatars. We will use the media-list Bootstrap component and a loop through the followers to render each one of them:
<!-- Render followers -->
<ul class="media-list">
<t t-foreach="o.message_follower_ids" t-as="f">
<li t-if="f.partner_id.image_small"
class="media-left">
<img class="media-object"
t-att-src="'data:image/png;base64,%s' %
f.partner_id.image_small"
style="max-height: 24px;" />
<span class="media-body"
t-field="f.partner_id.name" />
</li>
</t>
</ul>
The content of binary fields is provided in a base64 representation. The <img> element can directly accept this type of data for the src attribute. Thus we can use the t-att-src QWeb directive to dynamically generate each of the images.