Skip to content

Latest commit

 

History

History
206 lines (161 loc) · 5.34 KB

CLAIMCENTER_INTERFACE.md

File metadata and controls

206 lines (161 loc) · 5.34 KB

ClaimCenter-Style Interface Implementation

What Was Created

A complete web-based interface that mimics Guidewire ClaimCenter's look and feel, making LiabilityIQ appear as a native part of the claims management system.

Key Components

1. HTML Generator (src/output/claimcenter_html_generator.py)

  • Generates self-contained HTML files with embedded CSS and JavaScript
  • ClaimCenter-style color scheme (blue/gray palette: #1e3a5f)
  • Professional tabbed interface
  • Responsive design
  • No external dependencies

2. Web Application (web_app.py)

  • Flask-based web server
  • Dashboard for viewing all claims
  • Interactive claim processing
  • Real-time dossier generation
  • RESTful API endpoints

3. Updated Dossier Generator

  • Now supports HTML output format (in addition to Markdown)
  • Seamlessly integrates with existing pipeline
  • Configuration-driven (set in config/config.yaml)

Visual Design

Color Scheme

  • Primary Blue: #1e3a5f (ClaimCenter standard)
  • Secondary Gray: #f8f9fa, #e9ecef
  • Status Colors:
    • High/Success: Green (#28a745)
    • Medium/Warning: Orange (#ffc107)
    • Low/Error: Red (#dc3545)

Components

  • Header: Gradient blue header with claim information
  • Tabs: Horizontal tab navigation matching ClaimCenter
  • Panels: White panels with gray headers
  • Tables: Professional data tables with hover effects
  • Badges: Color-coded severity/priority indicators
  • Score Visualizations: Circular readiness indicators and progress bars
  • Timeline: Vertical timeline with event markers

Interface Sections

1. Overview Tab

  • Large readiness score circle (color-coded)
  • Key metrics (Existence, Completeness, Quality)
  • Key findings summary
  • Executive summary

2. Readiness Index Tab

  • Detailed scoring dashboard table
  • Requirement-by-requirement breakdown
  • Visual progress bars for each score
  • Rationale and rule hits/misses

3. Consolidated Facts Tab

  • Incident details in card layout
  • Claimants, vehicles, drivers
  • Damage areas
  • Policy and registration information

4. Timeline Tab

  • Master timeline of events
  • Document creation dates
  • Visual timeline with markers

5. Gaps Tab

  • List of identified gaps
  • Severity badges
  • Required items
  • Evidence references

6. Conflicts Tab

  • Detected inconsistencies
  • Conflicting documents
  • Conflicting values displayed

7. Risks Tab

  • Risk indicators
  • Severity classification
  • Supporting evidence

8. Recommendations Tab

  • Prioritized action items
  • Templated outreach messages
  • Related gaps/conflicts/risks

9. Documents Tab

  • Document summaries table
  • Quick reference to all documents

Usage

Starting the Web Server

python web_app.py

Accessing the Interface

Open browser to: http://localhost:5000

Workflow

  1. Dashboard: View all available claims
  2. Generate: Create sample synthetic claims (if needed)
  3. Process: Click "Process" to analyze a claim
  4. View: Click "View Dossier" to see the full analysis
  5. Navigate: Use tabs to explore different aspects

Integration Options

Option 1: Standalone Web App

  • Run as separate service
  • Access via URL
  • Can be deployed to any web server

Option 2: Embed in ClaimCenter

  • Extract HTML/CSS/JS
  • Embed as custom screen/widget
  • Use ClaimCenter's theming system

Option 3: API Integration

  • Use Flask API endpoints
  • Integrate with ClaimCenter REST API
  • Real-time processing

Option 4: Export Static HTML

  • Generate HTML files
  • Store in ClaimCenter document repository
  • Link from claim screens

Technical Details

File Structure

src/output/
├── dossier_generator.py          # Main generator (supports HTML/Markdown)
└── claimcenter_html_generator.py # HTML-specific generator

web_app.py                         # Flask web application

Output Files

  • HTML dossiers: output/dossier_CLM-*.html
  • Self-contained (no external CSS/JS files)
  • Can be opened directly in browser
  • Can be embedded in iframes

Dependencies

  • Flask (web server)
  • All existing dependencies (pydantic, faker, etc.)

Customization Guide

Changing Colors

Edit _get_css() method in claimcenter_html_generator.py:

  • Primary: .cc-header background
  • Accent: .cc-tab.active border-color
  • Status colors: .readiness-circle.high/medium/low

Adding New Tabs

  1. Add tab button in _generate_tabs()
  2. Create _generate_*_tab() method
  3. Add tab content div in _generate_content()

Modifying Layout

  • Panel structure: Modify _generate_*_tab() methods
  • Grid layouts: Adjust CSS grid definitions
  • Tables: Customize .cc-table styles

Browser Compatibility

  • Chrome/Edge: Full support
  • Firefox: Full support
  • Safari: Full support
  • IE11: Limited (use modern browsers)

Performance

  • HTML files: ~50-100KB per dossier
  • Load time: <1 second
  • No external API calls
  • All processing server-side

Security Considerations

For production deployment:

  • Add authentication/authorization
  • Sanitize user inputs
  • Use HTTPS
  • Implement rate limiting
  • Add CSRF protection

Next Steps

  1. Styling Refinement: Match exact ClaimCenter CSS
  2. Interactive Features: Add filtering, sorting, search
  3. Export Options: PDF, Excel exports
  4. Real-time Updates: WebSocket support
  5. Mobile Responsive: Optimize for tablets/phones
  6. Accessibility: WCAG compliance
  7. Internationalization: Multi-language support