From 1b03ecd905b25e0f858fe11cc1527e8ebd017c77 Mon Sep 17 00:00:00 2001
From: Simon Vieille <simon@deblan.fr>
Date: Sun, 30 Mar 2025 14:12:42 +0200
Subject: [PATCH] feat(saving_account): add columns

---
 frontend/js/lib/renderers.js                  |  2 +-
 frontend/js/views/saving_account/ListView.vue | 17 +++++++++++++++++
 frontend/js/views/transaction/ShowView.vue    |  2 +-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/frontend/js/lib/renderers.js b/frontend/js/lib/renderers.js
index 3c78c80..9e7a973 100644
--- a/frontend/js/lib/renderers.js
+++ b/frontend/js/lib/renderers.js
@@ -24,7 +24,7 @@ const renderDateTime = (value) => {
 
 const renderCategory = (item) => {
   if (item !== null) {
-    return `<span class="badge" style="background: ${item.color}">&nbsp;</span> ${item.label}`
+    return `<span class="fa-solid fa-square" style="color: ${item.color}" b>&nbsp;</span> ${item.label}`
   }
 }
 
diff --git a/frontend/js/views/saving_account/ListView.vue b/frontend/js/views/saving_account/ListView.vue
index 7fd335d..38422f7 100644
--- a/frontend/js/views/saving_account/ListView.vue
+++ b/frontend/js/views/saving_account/ListView.vue
@@ -48,6 +48,7 @@ import DataList from '../../components/crud/DataList.vue'
 import { ref, onMounted, watch } from 'vue'
 import { getStorage, saveStorage } from '../../lib/storage'
 import { createRequestOptions } from '../../lib/request'
+import { renderEuro, renderLabelWithSum } from '../../lib/renderers'
 import { useRouter } from 'vue-router'
 
 const endpoint = `/api/saving_account`
@@ -114,6 +115,22 @@ const fields = [
     key: 'label',
     label: 'Libellé',
   },
+  {
+    key: 'blocked_amount',
+    renderLabel: (rows) => renderLabelWithSum('Montant bloqué', rows, 'blocked_amount'),
+    width: '200px',
+    thClasses: ['text-end'],
+    tdClasses: ['text-end'],
+    render: (item) => renderEuro(item.blocked_amount),
+  },
+  {
+    key: 'released_amount',
+    renderLabel: (rows) => renderLabelWithSum('Montant débloqué', rows, 'released_amount'),
+    width: '200px',
+    thClasses: ['text-end'],
+    tdClasses: ['text-end'],
+    render: (item) => renderEuro(item.released_amount),
+  },
 ]
 
 onMounted(() => {
diff --git a/frontend/js/views/transaction/ShowView.vue b/frontend/js/views/transaction/ShowView.vue
index 497aba1..17d9d12 100644
--- a/frontend/js/views/transaction/ShowView.vue
+++ b/frontend/js/views/transaction/ShowView.vue
@@ -94,7 +94,7 @@
 </template>
 
 <script setup>
-import { BTableSimple, BTr, BTh, BTd, BModal, BFormSelect, BFormGroup, BButton, BRow, BCol } from 'bootstrap-vue-next'
+import { BTableSimple, BTr, BTh, BTd, BModal, BFormSelect, BButton, BRow, BCol } from 'bootstrap-vue-next'
 import { renderDate, renderCategory } from '../../lib/renderers'
 import { createRequestOptions } from '../../lib/request'
 import { onMounted, ref, watch } from 'vue'