diff --git a/apps/web/src/views/ImportView.vue b/apps/web/src/views/ImportView.vue
index 8adc5fb..fb311b9 100644
--- a/apps/web/src/views/ImportView.vue
+++ b/apps/web/src/views/ImportView.vue
@@ -62,6 +62,9 @@ async function doPreview() {
const newCount = computed(() => store.rows.filter((r) => !r.is_duplicate).length)
const dupCount = computed(() => store.rows.filter((r) => r.is_duplicate).length)
+const newTotal = computed(() =>
+ store.rows.filter((r) => !r.is_duplicate).reduce((s, r) => s + r.amount, 0)
+)
function fmt(amount: number) {
return amount.toLocaleString('pt-BR', { style: 'currency', currency: 'BRL' })
@@ -225,6 +228,10 @@ function fmt(amount: number) {
+
+ TOTAL A IMPORTAR
+ {{ fmt(newTotal) }}
+
@@ -348,6 +355,28 @@ function fmt(amount: number) {
.fc-import-status--new { background: rgba(57,255,122,.15); color: var(--fc-green); }
.fc-import-status--dup { background: rgba(255,216,77,.15); color: var(--fc-gold); }
+.fc-import-total {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ gap: var(--fc-space-3);
+ padding: var(--fc-space-3) var(--fc-space-2) 0;
+ border-top: 1px solid var(--fc-panel-edge);
+ margin-top: var(--fc-space-2);
+}
+
+.fc-import-total__label {
+ font-size: 10px;
+ color: var(--fc-text-dim);
+ letter-spacing: .08em;
+}
+
+.fc-import-total__value {
+ font-size: 15px;
+ color: var(--fc-accent-2);
+ font-weight: 600;
+}
+
.fc-import-cat-select {
font-size: 10px;
padding: 2px 4px;