- Header: Replace date with oil price dropdown showing all pricing tiers
(regular, same day, prime, emergency) and service pricing
- Footer: Add search shortcuts reference (@, !, #, $)
- Home page complete redesign:
- Animated stat cards (today's deliveries, week gallons, deliveries, revenue)
- 28-day delivery trend chart using Chart.js
- Mini map showing today's delivery routes with Leaflet
- Quick actions grid for common tasks
- Town distribution visualization with progress bars
- Gradient styling and fade-in animations
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Major Changes:
- Migrate components from Options API to Composition API with <script setup>
- Add centralized service layer (serviceService, deliveryService, adminService)
- Implement new reusable components (EnhancedButton, EnhancedModal, StatCard, etc.)
- Add theme store for consistent theming across application
- Improve ServiceCalendar with federal holidays and better styling
- Refactor customer profile and tank estimation components
- Update all delivery and payment pages to use centralized services
- Add utility functions for formatting and validation
- Update Dockerfiles for better environment configuration
- Enhance Tailwind config with custom design tokens
UI Improvements:
- Modern, premium design with glassmorphism effects
- Improved form layouts with FloatingInput components
- Better loading states and empty states
- Enhanced modals and tables with consistent styling
- Responsive design improvements across all pages
Technical Improvements:
- Strict TypeScript types throughout
- Better error handling and validation
- Removed deprecated api.js in favor of TypeScript services
- Improved code organization and maintainability
- Replaced all direct axios imports with service layer calls across 8 customer files
- Migrated core pages: home.vue, create.vue, edit.vue
- Migrated profile pages: profile.vue (1100+ lines), TankEstimation.vue
- Migrated supporting pages: ServicePlanEdit.vue, tank/edit.vue, list.vue
Services integrated:
- customerService: CRUD, descriptions, tank info, automatic status
- authService: authentication and Authorize.net account management
- paymentService: credit cards, transactions, payment authorization
- deliveryService: delivery records and automatic delivery data
- serviceService: service calls, parts, and service plans
- adminService: statistics, social comments, and reports
- queryService: dropdown data (customer types, states)
Type safety improvements:
- Updated paymentService.ts with accurate AxiosResponse types
- Fixed response unwrapping to match api.ts interceptor behavior
- Resolved all TypeScript errors in customer domain (0 errors)
Benefits:
- Consistent authentication via centralized interceptors
- Standardized error handling across all API calls
- Improved type safety with proper TypeScript interfaces
- Single source of truth for API endpoints
- Better testability through mockable services
Verified with vue-tsc --noEmit - all customer domain files pass type checking
- Add local AxiosResponse/AxiosError interfaces to models.ts as workaround
for bundler moduleResolution issues with axios types
- Update 7 payment Vue files to import axios types from local models
- Convert axios.get<T>() generic calls to typed .then() response callbacks
- Fix type narrowing in getTypeColor(), getEmployeeTypeName() functions
- Add Number() conversion for tank_size arithmetic in auto preauth
- Use 'as unknown as' for Delivery to DeliveryFormData type assertions
- Fix incorrect import paths for sidebar/footer in delivery/create.vue
Production build (npm run build) now completes successfully.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
