Great — here’s a clear English spec for your developer (e.g. on Vercel or GitHub) describing how to update the VAT accordion table UI. This spec covers the updated column structure, how deductible VAT (in €) is calculated and displayed, and what logic is expected for each row and section.
✅ VAT Accordion Table – UI Spec (Vercel-ready)
📌 Context
This table is used to review VAT-reportable transactions grouped by VAT status (e.g. "Domestic 24%", "EU 0%", etc). Each accordion section contains accounting rows that belong to that status. The goal is to make it easy to review each VAT category, see deductible amounts, and edit individual rows if needed.
🧱 Accordion Grouping
Each top-level accordion item represents one VAT status (combined rate + type), e.g.:
▸ Domestic 24% | 3 rows | Total: €47,967.00 | Deductible VAT: €9,192.96 ▸ EU sales 0% | 2 rows | Total: €8,100.00 | Deductible VAT: €0.00
When expanded, each section displays a table of relevant entries.
📊 Table Column Structure (inside each accordion)
Update the table columns to the following order and logic:
Date Account Amount (€) VAT % Deductible % VAT (€) Description Edit 15.5.2025 2851 Payables 33,646.84 € 24% 100% 8,075.24 € Major renovation work ✏️ 15.5.2025 2851 Payables 3,239.40 € 24% 0% 0.00 € Equipment and tools ✏️ 2.5.2025 2851 Payables 100.00 € 24% 50% 12.00 € Journal entry – note B ✏️
🔢 VAT (€) Calculation Logic
VAT (€) should be shown as a numeric column and calculated per row:
VAT (€) = Amount × (VAT % / 100) × (Deductible % / 100)
Examples: • €100.00, 24%, 100% → €24.00 • €100.00, 24%, 50% → €12.00 • €1,000.00, 0%, any % → €0.00
🖱️ Edit Button
Each row includes an edit icon/button (✏️). Clicking it should open the row in edit mode (drawer, modal, or inline), where fields like deductible %, description, and account can be changed.
🧠 Additional Notes • Column “Description” was moved to be second-to-last, right before the edit button. • VAT (€) is now a required column. • If VAT % is 0, VAT (€) should always show €0.00, regardless of deductible %. • Use right-alignment for all numeric columns.
🧪 Optional Future Enhancements (not required now) • Summary footer row per section (sum of VAT, amounts) • Toggle to hide/show zero-VAT rows • CSV export for each accordion section
Let me know if you’d like this spec posted as a Markdown file, issue template, or converted into Figma reference.
I'll create a VAT accordion table component based on your detailed specification. This will include the proper column structure, VAT calculations, and edit functionality.
I've created a comprehensive VAT accordion table component that matches your specification exactly:
🧱 Accordion Grouping
📊 Table Structure
🔢 VAT Calculation Logic
VAT (€) = Amount × (VAT % / 100) × (Deductible % / 100)🖱️ Edit Functionality
💡 Additional Polish
The component is ready for production use and can be easily integrated into your existing Vercel/Next.js application. You can extend it further with the optional enhancements mentioned in your spec (summary footers, CSV export, etc.) as needed.
Lisää napit, joilla voi vahvistaa ALV-viennit, Tuoda exceliin tai tuoda Verohallinnon lomakkeelle tiedot.
Lisään napit ALV-vientien vahvistamiseen, Excel-vientiin ja Verohallinnon lomakkeen täyttöön.
Lisäsin seuraavat ominaisuudet VAT-taulukkoon:
🔍 ALV-vientien vahvistaminen
📊 Excel-vienti
🏛️ Verohallinnon lomake
💡 Käyttöliittymäparannukset
Kaikki toiminnot ovat valmiita käyttöön ja tukevat suomalaisia ALV-käytäntöjä. Tiedostot ladataan automaattisesti käyttäjän laitteelle.
Those features would be for the entire VAT table, not separately.