- Implement new breadcrumb component with proper routing handling
- Update header to use new breadcrumb component
- Optimize nuxt config for SPA with router and rendering settings
Extract division form configuration and tree logic from entry.vue component into a shared entry.ts file. This improves code organization and reusability while maintaining the same functionality.
- Implement list view with pagination and search functionality
- Create form for adding subspecialist entries
- Add configuration for subspecialist data validation and dropdown options
- Create new PaginationView component to standardize pagination display
- Update multiple list components to use the new PaginationView
- Make paginationMeta prop required in list components
- Implement installation-unit mapping and filtering logic
- Update entry form to handle installation selection and unit filtering
- Add installation and unit dropdowns with combobox components
Move URL parameter construction logic from multiple list components to a shared transform function in usePaginatedList. This improves code reuse and maintainability while keeping the same functionality.
Standardize query parameter names to match backend expectations ('page-number' and 'page-size' instead of 'page' and 'pageSize'). Update related schema and default params accordingly.
feat(division): update division list components and add mock api
- Replace patient API endpoint with division mock endpoint
- Simplify table columns and headers for division list
- Add mock API endpoint for division list with tree/flat format
feat(select-tree): add collapsible tree select component with lazy loading
Implement a tree select component with collapsible sections and lazy loading of child items. Includes:
- Collapsible component wrappers for Vue
- Command component wrappers for combobox functionality
- Tree select item component with loading states
- Example implementation in dev page
todo:
- scroll on overflow
- long text truncate possibly with tooltip
- more than > 5 depth of child
- mutate the children lazy
- integration backend for search based text and return keys
feat(select-tree): add command-item component for tree selection
adjust hover bg-accent (remove state on-highlighted at styling) to avoid conflict on global component
refactor(select-tree): extract TreeItem interface to shared type file
Move TreeItem interface to a dedicated type file for better code organization and reusability. Update components to import the interface and add styling improvements to the tree-select component.
adjust text size for tree to sm
refactor(select-tree): rename tree-select-item to leaf and improve component
- Rename component to better reflect its purpose as a leaf node
- Improve UI with better spacing and hover states
- Simplify toggle logic using v-model
- Add checkmark icon for selected items
checkpoint
wip
- Update device and material pages to use Content prefixed components instead of Flow
- Add new content components for device and material list/entry functionality
- Maintain same functionality while improving component naming consistency
Add new content components for unit, division, and installation with list views, entry forms, and validation schemas. Replace Flow*List components with Content*List components in org-src pages. Includes pagination, search functionality, and CRUD operations for each entity type.
- Remove duplicate schema.query.ts files from unit, division, and installation components
- Create new usePaginatedList composable to centralize pagination logic
- Update list.vue components to use the new composable
- Maintain same functionality while reducing code duplication
- Add schema validation and default query params for unit management
- Create list view with pagination, search, and delete functionality
- Implement form entry with validation for creating/editing units
- Replace placeholder content with functional unit list component
- Remove unused unit add page and update page titles
- Consolidate pagination info display logic in pagination component
- Remove duplicate computed properties from list components
- Improve pagination layout with better spacing and responsiveness
- Add skeleton loading support to data tables
feat(form): add accessibility improvements to form components
- Add labelFor prop to Label component for better form element association
- Enhance Combobox with ARIA attributes for better screen reader support
- Update form fields with proper IDs and label associations
feat(pagination): adjust button width based on page number length
Add dynamic button sizing for pagination items to accommodate different digit lengths (1-99, 100-999, 1000+). This improves visual consistency when displaying varying page numbers.
feat(modal): add reusable dialog component and refactor division form
- Create new Dialog.vue component with configurable size and outside click prevention
- Replace inline dialog implementation in division list with new Dialog component
- Fix formatting in entry-form.vue
feat(data-table): add click handling for action cells
Implement handleActionCellClick function to manage click events on action cells, triggering dropdown buttons when clicked outside interactive elements. Add cursor-pointer class and click handler to action cells for better UX.
refactor(custom-ui): centralize action event strings in types
Replace hardcoded action event strings with constants from types.ts to improve maintainability and reduce potential typos
feat(confirmation): add reusable confirmation modal components
- Implement base confirmation.vue component with customizable props
- Create record-specific record-confirmation.vue for data operations
- Add comprehensive README.md documentation for usage
- Integrate confirmation flow in division list component
refactor(components): move dialog component to base directory and update imports
The dialog component was moved from custom-ui/modal to base/modal to better reflect its shared usage across the application. All import paths referencing the old location have been updated accordingly.
refactor(select): reorganize imports and adjust conditional formatting
- Reorder imports in Select.vue for better organization
- Adjust logical operator formatting in SelectContent.vue for consistency
- Move form logic from list component to dedicated entry-form component
- Implement proper form submission and cancellation handlers
- Add type safety with DivisionFormData interface
- Improve form validation using vee-validate
- Refresh data after successful form submission
Add size prop configuration to action components in data table to allow consistent sizing. Update dropdown action component to accept size prop with default value.
- Implement dialog form with validation schema for division creation
- Add combobox component for parent division selection
- Include form submission handling with reset and error states
- a11y
- Add schema validation for query parameters
- Create pagination component with type definitions
- Implement division list view with search functionality
- Add data table configuration for division listing
- Handle pagination state and URL synchronization
- Replace generic 'any' types with specific type imports for better type safety
- Add optional chaining for funcComponent to prevent potential runtime errors
- Update funcHtml and funcParsed to include rowIndex parameter in callbacks
- Create new installation entry form component with validation
- Add installation list and add pages with basic routing
- Implement custom select component for encounter class selection
- Update SelectTrigger styling for better icon positioning
- Create new unit list and add pages under org-src feature
- Implement unit entry form with validation using zod
- Update error types to support readonly path property
- Refactor field component to use shared error type
- Create new division list and add pages
- Implement form validation using zod and error handling
- Add useFormErrors composable for form error management
- Update division entry form with validation support
- Add error styling in main.css
Implement a combobox component with search functionality and item selection. The component supports displaying item labels with optional codes, maintains selected item state, and provides customizable placeholders. Items are sorted with selected items first followed by alphabetical order.
- Replace reka-ui imports with radix-vue in Button component
- Update pagination components to use direct radix-vue icons
- Simplify button variants styling and adjust size variants
- Remove unused data-slot attribute from Button component
- Add container borders and padding for better visual hierarchy
- Standardize table cell borders across components
- Reset query params to defaults when changing resource type
- Clear data on fetch error to prevent stale data display
- Translate "No data available" to Indonesian
- Add schema.query.ts for query validation with zod
- Move constants to const.ts for better organization
- Refactor list.vue to use new query schema and constants
- Add empty state handling to data-table.vue
- Implement loading state management across patient, doctor and satusehat lists
- Add skeleton loading UI for data tables during data fetching
- Refactor loading state variable naming for consistency
- Make search nav optional in header component
- Update icon sizing in header for better responsiveness
- Implement url search params query state at satusehat
- Add new API endpoint for fetching SatuSehat data with filtering capabilities
- Implement client-side data fetching with status, resource type, date range and search filters
- Add pagination support with server-side pagination handling
- Improve UI with loading states and pagination controls
- Implement search component with lucide-vue-next icon
- Create card summary component for displaying summary data
- Add date picker component with range selection functionality
- Update list configuration and styling
- Reorganize package.json structure
- Implement badge components for patient and status display
- Create list component with configurable table columns
- Add entry form for new patient registration
- Integrate with existing SatuSehat service flow
- Add type casting for route.meta.title in index.vue
- Update tailwind css path in components.json
- Remove unused imports and simplify dashboard component
Implement a new status badge component to visually indicate patient status (active/inactive) in the patient list. The badge uses different colors based on status code and is integrated into the list configuration.
- Replace ambiguous `object` types with more specific type definitions
- Separate HTML rendering from plain text interpolation for better security
- Simplify template logic by removing nested ternary operations
Replace hardcoded status text with a reusable status badge component to improve consistency and maintainability. Remove console.log statement and adjust column widths in the list configuration.
Add new SatuSehat integration feature including:
- Page components for list, add, edit, and detail views
- Service status component and type definitions
- Summary card component updates for string metrics
- RBAC permissions configuration for SatuSehat routes
- Replace inline cards with `PubBaseSummaryCard`
- Add `isLoading.summary` and mock `getPatientSummary()` ⏳
- Render skeleton while loading; show data when ready ✅
- Update icons and remove `cn` 🧹
- Call `getPatientSummary()` and `getPatientList()` on mount 🚀
Khafid Prayoga