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;