feat: introduce index layout skill for FULL_PAGE index/list tables
- Added a new skill for managing index and list table layouts in the ERP project, detailing layout and data contracts. - Updated project guidelines to reference the new index layout skill. - Introduced rules for page composition, column definitions, audit fields, action column width, and toolbar functionality. - Created utility functions for computing action column width and formatting audit fields, along with corresponding unit tests to ensure reliability. These changes enhance the application by providing a structured approach to index layouts, improving consistency and usability across the ERP project.
This commit is contained in:
@@ -27,6 +27,7 @@ Reference usage: `apps/showcase` (ui-components, forms, action-tools, shell-demo
|
||||
|
||||
Detail **content** layout (section stack, key-value grids, status blocks, tabs for many categories): follow `.agents/skills/detail-layout/SKILL.md` — layout/position only.
|
||||
Form **content** layout: follow `.agents/skills/form-layout/SKILL.md`.
|
||||
Index / list layout (toolbar, action column, audit columns): follow `.agents/skills/index-layout/SKILL.md`.
|
||||
Entities with `latitude` / `longitude`: follow `web-location-maps.mdc` — form must pick coords on `LocationMap`; detail must render `LocationMap`.
|
||||
|
||||
Every page header (`pageHeaderProps`) should include i18n `title`, `description`, `breadcrumbs`, and Lucide `icon` when useful.
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
---
|
||||
description: Index / list table contracts for FULL_PAGE modules (actions, audit columns, reload)
|
||||
globs: apps/web/src/apps/**/*.page.index.tsx,packages/ui/src/foundations/enterprise-module/components/data-table/**
|
||||
alwaysApply: false
|
||||
---
|
||||
|
||||
# Web Index Table
|
||||
|
||||
Index pages: `EnterpriseIndexPageProvider` + `EnterpriseDataTable`. Do not rebuild the toolbar or default columns. Full layout: `.agents/skills/index-layout/SKILL.md`.
|
||||
|
||||
## Module columnDefs
|
||||
|
||||
Business fields only. Do **not** redeclare action, status, or audit columns.
|
||||
|
||||
```tsx
|
||||
// GOOD
|
||||
<EnterpriseDataTable columnDefs={[{ field: 'code' }, { field: 'name' }]} filterConfig={filterConfig} />
|
||||
|
||||
// BAD — duplicates shared prefix/postfix
|
||||
columnDefs={[{ colId: 'action_column', width: 180 }, { field: 'created_at' }]}
|
||||
```
|
||||
|
||||
## Audit fields
|
||||
|
||||
Transformers map camelCase: `createdBy`, `createdAt`, `updatedBy`, `updatedAt`. The shared table postfix binds those names (with snake_case fallback). Do not emit `creator_name` / `created_at` in TrackGo transformers.
|
||||
|
||||
## Action column
|
||||
|
||||
Width is computed in `EnterpriseDataTable` from privileges (`flex: 0`, nowrap icons). Do not hard-code `width: 180` in module pages.
|
||||
|
||||
## Reload
|
||||
|
||||
Toolbar includes search, filter, and reload. Reload calls `gridApi.refreshServerSide({ purge: true })` — never `window.location.reload()`. i18n: `common:actions.reload`.
|
||||
Reference in New Issue
Block a user