Store List
Overview
The Store List
component displays a list of all stores/locations from the Carpose backend. It shows a loading indicator while fetching data and then renders each store using the Store Item component.
Installation
The component is part of the Carpose application and requires no separate installation.
Usage
To use the Store List component in a standard HTML page:
<div
data-carpose-component="store-list"
data-api-key="your-api-key"
></div>
Configuration Attributes
The component reads configuration from data attributes on the provided element:
data-carpose-component
string
-
Identifies the component type, must be set to "store-list"
data-api-key
string
-
API key for authentication with the Carpose backend services. Required for data fetching.
Features
Displays a list of all store locations
Shows a loading indicator while data is being fetched
Responsive layout that adapts to different screen sizes
Each store is displayed with its details (name, address, contact information)
Example
<div
data-carpose-component="store-list"
data-api-key="your-api-key"
></div>
Behavior
Data Loading:
On initialization, the component fetches store data from the API using the provided API key.
While data is loading, a loading screen is displayed.
Once data is loaded, the list of stores is rendered.
Store Display:
Each store is displayed using the Store Item component.
Stores are displayed in the order returned by the API.
Each store item typically includes the store name, address, contact information, and possibly an image.
Integration with Other Components
The Store List component works well with other Carpose components:
Car Search: Filter vehicles by specific store locations
Employee List: View employees at specific store locations
Last updated