# Invoice Layout Troubleshooting Guide

## Issue
Invoice is not showing logo and QR code from backend settings.

## Diagnostic Tool
I've created a diagnostic page to help identify the issue:

**URL Format:** `http://127.0.0.1:8001/sells/{transaction_id}/diagnostic`

**Example:** After making a sale, if the transaction ID is 123, visit:
```
http://127.0.0.1:8001/sells/123/diagnostic
```

This page will show you:
- Transaction status (must be "final" for QR code to show)
- Invoice layout settings (logo, QR code enabled/disabled)
- Logo file existence check
- QR code fields configuration
- Detailed diagnostic information

## Common Issues and Solutions

### 1. Logo Not Showing

**Possible Causes:**
- "Show Logo" is disabled in invoice layout settings
- Logo file doesn't exist in the correct folder
- Logo file path is incorrect

**Solution:**
1. Go to: Settings → Invoice Layouts
2. Edit your invoice layout
3. Enable "Show Logo" checkbox
4. Upload a logo image (it will be saved to `public/uploads/invoice_logos/`)
5. Save the settings

### 2. QR Code Not Showing

**Possible Causes:**
- "Show QR Code" is disabled in invoice layout settings
- QR Code Fields are not configured
- Transaction status is not "final"

**Solution:**
1. Go to: Settings → Invoice Layouts
2. Edit your invoice layout
3. Enable "Show QR Code" checkbox
4. Select fields to include in QR code:
   - invoice_no (Invoice Number)
   - total_amount (Total Amount)
   - customer_name (Customer Name)
   - invoice_datetime (Invoice Date/Time)
   - business_name (Business Name)
   - tax_1 (Tax Number)
   - etc.
5. Save the settings

**Note:** QR code only generates for transactions with status = "final"

### 3. Invoice Design Not Showing

**Possible Causes:**
- Invoice layout design field is not set
- Design template file doesn't exist

**Solution:**
1. Go to: Settings → Invoice Layouts
2. Edit your invoice layout
3. Select a design template:
   - classic (default)
   - modern
   - elegant
   - detailed
   - slim
   - english-arabic (requires PHP intl extension)
4. Save the settings

### 4. Print Receipt on Invoice Setting

**Location:** Settings → Business Locations → Edit Location

This setting controls whether invoices are automatically printed from POS screen.
- If disabled, invoices won't auto-print from POS
- Direct print requests (like from POS Pro) bypass this check

## Step-by-Step Configuration

### Configure Invoice Layout:

1. **Navigate to Invoice Layouts:**
   - Go to: Settings → Invoice Layouts
   - Click "Edit" on your invoice layout (or create new one)

2. **Enable Logo:**
   - Check "Show Logo" checkbox
   - Click "Choose File" and upload your logo
   - Recommended size: 200x100 pixels (PNG or JPG)

3. **Enable QR Code:**
   - Check "Show QR Code" checkbox
   - Select fields to include in QR code (at least 2-3 fields recommended):
     - ✓ invoice_no
     - ✓ total_amount
     - ✓ customer_name
     - ✓ invoice_datetime

4. **Select Design:**
   - Choose a design template (classic, modern, elegant, etc.)
   - Preview the design if available

5. **Save Settings:**
   - Click "Save" button
   - Settings will be applied to new invoices

### Assign Invoice Layout to Location:

1. **Navigate to Business Locations:**
   - Go to: Settings → Business Locations
   - Click "Edit" on your location

2. **Select Invoice Layout:**
   - Find "Invoice Layout" dropdown
   - Select the invoice layout you configured above

3. **Enable Print Receipt:**
   - Check "Print Receipt on Invoice" checkbox
   - This enables invoice printing from POS

4. **Save Settings:**
   - Click "Save" button

## Testing

After configuration:

1. **Make a test sale** from POS Pro
2. **Check the invoice** that opens in new window
3. **Verify:**
   - Logo appears at top
   - QR code appears at bottom
   - Design matches selected template

If issues persist:

1. **Run diagnostic:** Visit `/sells/{transaction_id}/diagnostic`
2. **Check the diagnostic report** for specific issues
3. **Follow the recommendations** in the diagnostic report

## Debug Mode

You can also use debug mode to see raw receipt details:

**URL:** `http://127.0.0.1:8001/sells/{transaction_id}/print?debug=1`

This will show:
- All receipt_details fields
- Logo path and existence
- QR code text and fields
- Complete JSON data

## File Locations

- **Logo files:** `public/uploads/invoice_logos/`
- **Invoice templates:** `resources/views/sale_pos/receipts/`
- **Invoice layouts table:** Database table `invoice_layouts`

## Important Notes

1. **Transaction Status:** QR codes only generate for transactions with status = "final"
2. **File Permissions:** Ensure `public/uploads/invoice_logos/` folder is writable
3. **PHP intl Extension:** Required for "english-arabic" design template
4. **Logo Format:** PNG, JPG, or GIF (PNG recommended for transparency)
5. **QR Code Fields:** Must select at least one field for QR code to generate

## Need Help?

If you're still experiencing issues:

1. Run the diagnostic tool: `/sells/{transaction_id}/diagnostic`
2. Check Laravel logs: `storage/logs/laravel.log`
3. Verify invoice layout settings in database
4. Ensure logo file exists in correct folder
5. Check transaction status is "final"
