Documentos

Overview

A generic document CRUD screen, built on MeDocumentView as the chassis, MeHeader for top navigation, and MeButtonBar for toolbar actions. Unlike Transações — one page per screen — this template is a single component (mode: 'create' | 'edit' | 'read') driven entirely by data: every field is a DocumentField (a value renders as plain text, a type + config renders the matching input), grouped into DocumentFormSection/DocumentFormSubsection.

Create and edit share the exact same markup — only the initial payload differs (empty vs. already filled). Read renders the same fields as plain text. Every section is on the page at once: there is no step-by-step wizard, in any mode, and the section strip is an anchor strip rather than tabs, so nothing is ever hidden behind it. That strip is off by default and the previews below turn it on with sectionNav: a document knows whether it is long enough to want one, the chassis does not.

The previews below run on a neutral fixture, not on any real document type. That is deliberate: the chassis is what is being documented here, and a page that illustrated itself with one concrete document would quietly turn that document into the definition of the chassis.

Unlike a component or block, this is not meant to be reused as-is — it ships with static, mock data as a realistic starting point for building your own document-style screen. See Templates for what that distinction means.

Create

Edit

Read

Document types built on this chassis

Pré-Pedido is the first, grounded in a real extraction of the legacy ASP screens (WFPrePedFormalizacao.asp, verPrepedidoWF.asp) rather than invented field names. Its edit screen is a thin page over this chassis: everything specific to it, the section ids and labels, the read-mode rule, the supplier and address cards, is declared by the template, not by the chassis.

To eject a ready-made Pré-Pedido page instead of the chassis alone, use its own registry items, one per mode.

Ejecting

If this is the first thing you're ejecting into this project, do the one-time setup first.

npx shadcn-vue@latest add @mercadoeletronico/document

Each mode also ships as its own registry:page item, so you can eject a page already wired for the mode you are building:

npx shadcn-vue@latest add @mercadoeletronico/document-create
npx shadcn-vue@latest add @mercadoeletronico/document-edit
npx shadcn-vue@latest add @mercadoeletronico/document-read

Those land at ~/pages/document-<mode>.vue and are deliberately thin: each pins mode, supplies the document metadata and hands over a payload. The command at the top of this section ejects the chassis alone, as a registry:block under ~/components/document/, for when you would rather wire the modes yourself.