DEV prompt for Full-Stack Product Management System Architect

As a Full-Stack Architect, design and implement a comprehensive Product Management System. Provide full, production-ready code for both backend and frontend components, along with a deployment configuration.

Core Functionality:
CRUD operations for products, each with a name, price, category, and an optional image upload.

1. Technologies & Architecture:
- Backend: FastAPI (Python), SQLAlchemy, PostgreSQL, Pydantic, Pillow.
- Frontend: Vue 3, Pinia, PrimeVue, Vuelidate (for client-side validation).
- Deployment: Docker Compose (for PostgreSQL + application services).

2. Backend Requirements (FastAPI, SQLAlchemy, PostgreSQL):
- Data Models:
- Product: id, name (unique with category), price, category, image_path (nullable string), version (for optimistic locking).
- AuditLog: id, action (e.g., 'CREATE', 'UPDATE', 'DELETE'), product_id, timestamp.
- Validation: Pydantic for request and response schemas.
- Database Constraints:
- Implement a composite unique constraint on (name, category) for products.
- Handle IntegrityError gracefully, returning a custom HTTP 409 Conflict response with an informative message.
- Transactions:
- Ensure product creation is an ACID transaction: create the product AND log the action in AuditLog table.
- If either operation fails, both must be rolled back.
- Optimistic Locking:
- Include a version field in the Product table (e.g., an integer).
- On update, verify the provided version matches the current database version. If not, return HTTP 409 Conflict.
- Increment the version on successful updates.
- File Upload:
- Accept images (JPEG/PNG) up to 5MB.
- Resize uploaded images to 800x800 pixels using Pillow.
- Store resized images on disk (e.g., in a static/images directory).
- Save the image's relative path in the Product.image_path field.

3. Frontend Requirements (Vue 3, Pinia, PrimeVue):
- Components:
- Develop a reusable ProductForm.vue component for creating and editing products.
- Validation: Implement client-side validation within ProductForm.vue using Vuelidate or a similar library.
- State Management:
- Use a Pinia store (ProductStore.js) to manage product state and handle all API interactions (fetching, creating, updating, deleting).
- User Experience:
- Display a preview of the image selected for upload.
- Gracefully handle HTTP 409 Conflict responses from optimistic locking: re-fetch the latest product data and notify the user about the conflict.

4. Code Structure & Output:
Provide complete, runnable code for the following files:
- backend/app/models.py (SQLAlchemy models)
- backend/app/schemas.py (Pydantic schemas)
- backend/app/routers/products.py (FastAPI routes)
- backend/app/services/file_service.py (Image handling logic)
- frontend/src/stores/ProductStore.js (Pinia store)
- frontend/src/components/ProductForm.vue
- frontend/src/views/ProductList.vue (Main product listing view)
- docker-compose.yml (Configuring PostgreSQL, FastAPI app, and Vue app)

5. Testing & Explanation:
Describe in detail how you would test and verify:
- The transactional rollback mechanism for product creation/audit log.
- The optimistic locking mechanism for concurrent product updates.