# @isa/remission/feature/remission-return-receipt-details

Feature component for displaying detailed view of a return receipt ("Warenbegleitschein") with items, actions, and completion workflows.

## Overview

The Remission Return Receipt Details feature provides a comprehensive view of a single return receipt including all items, receipt metadata, package information, and action buttons for managing the receipt. It integrates with return-receipt-actions components for deletion, continuation, and completion workflows.

## Features

- **Receipt Details Display** - Receipt number, creation date, status
- **Item List** - All items in the receipt with product information
- **Package Information** - Assigned package numbers
- **Action Buttons** - Delete, continue, complete actions
- **Empty State** - User-friendly empty receipt view
- **Loading States** - Skeleton loaders during data fetch
- **Resource-Based Data** - Efficient return data fetching
- **Navigation** - Back button to return to previous view
- **Eager Loading** - Preload 3 levels of related data

## Quick Start

```typescript
import { RemissionReturnReceiptDetailsComponent } from '@isa/remission/feature/remission-return-receipt-details';

// In routes
{
  path: 'receipt/:returnId/:receiptId',
  component: RemissionReturnReceiptDetailsComponent
}

// Usage
<a [routerLink]="['/receipt', returnId, receiptId]">View Receipt</a>
```

## Component API

### RemissionReturnReceiptDetailsComponent

Standalone component for receipt details view.

**Selector**: `remi-remission-return-receipt-details`

**Inputs** (from route params):
- `returnId`: number (required, coerced from string)
- `receiptId`: number (required, coerced from string)

**Computed Signals**:
```typescript
returnLoading = computed(() => returnResource.isLoading());
returnData = computed(() => returnResource.value());
receiptNumber = computed(() => getReceiptNumberFromReturn(returnData()));
receiptItems = computed(() => getReceiptItemsFromReturn(returnData()));
canRemoveItems = computed(() => !returnData().completed);
hasAssignedPackage = computed(() => getPackageNumbersFromReturn(returnData()) !== '');
```

## Resources

### ReturnResource

Fetches return with receipt data.

**Parameters**:
- `returnId`: number
- `eagerLoading`: number (levels to preload, default 3)

**Returns**: `Return` with nested receipts and items

## Usage Example

```typescript
import { Component } from '@angular/core';
import { RemissionReturnReceiptDetailsComponent } from '@isa/remission/feature/remission-return-receipt-details';

@Component({
  selector: 'app-receipt-page',
  imports: [RemissionReturnReceiptDetailsComponent],
  template: `
    <remi-remission-return-receipt-details
      [returnId]="returnId()"
      [receiptId]="receiptId()"
    ></remi-remission-return-receipt-details>
  `
})
export class ReceiptPageComponent {
  returnId = input.required<number>();
  receiptId = input.required<number>();
}
```

## Components

### RemissionReturnReceiptDetailsCardComponent

Card displaying receipt metadata.

### RemissionReturnReceiptDetailsItemComponent

Individual receipt item display.

### RemissionReturnReceiptActionsComponent

Action buttons (delete, continue) from shared library.

### RemissionReturnReceiptCompleteComponent

Complete button from shared library.

## Helper Functions

```typescript
// From @isa/remission/data-access
getReceiptNumberFromReturn(return: Return): string
getReceiptItemsFromReturn(return: Return): ReceiptItem[]
getPackageNumbersFromReturn(return: Return): string
```

## Empty State

**When Shown**: No return data or empty receipt

**Content**:
- Title: "Kein Warenbegleitschein vorhanden"
- Description: "Es wurde kein Warenbegleitschein gefunden."

## Testing

```bash
npx nx test remission-return-receipt-details --skip-nx-cache
```

## Dependencies

- `@angular/core` - Angular framework
- `@angular/common` - Location service
- `@isa/remission/data-access` - Return types, helper functions
- `@isa/remission/shared/return-receipt-actions` - Action components
- `@isa/ui/buttons` - Button components
- `@isa/ui/empty-state` - Empty state component
- `@isa/icons` - Icons

## License

Internal ISA Frontend library - not for external distribution.
