ngx-st-sap-bp 18.0.0 → 18.0.2

package/README.md

@@ -1,11 +1,592 @@
 # NgxStSapBp
 
-This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.2.0.
+Angular components for managing SAP Business Partners (BP) with full CRUD operations.
 
-## Code scaffolding
+## Table of Contents
+- [Overview](#overview)
+- [Installation](#installation)
+- [Components](#components)
+- [Models](#models)
+- [Services](#services)
+- [Examples](#examples)
 
-Run `ng generate component component-name --project ngx-st-sap-bp` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ngx-st-sap-bp`.
-> Note: Don't forget to add `--project ngx-st-sap-bp` or else it will be added to the default project in your `angular.json` file. 
+---
+
+## Overview
+
+The `ngx-st-sap-bp` library provides a complete suite of components for managing SAP Business Partners including:
+- Business Partner list with search and pagination
+- Create new Business Partners
+- Edit existing Business Partners
+- View Business Partner details
+- Manage addresses (ship-to and bill-to)
+- Manage contact persons
+- Support for both Customer and Vendor types
+
+---
+
+## Installation
+
+```bash
+npm install ngx-st-sap-bp
+```
+
+Import the module in your application:
+
+```typescript
+import { NgxStSapBpModule } from 'ngx-st-sap-bp';
+
+@NgModule({
+  imports: [
+    NgxStSapBpModule
+  ]
+})
+export class AppModule { }
+```
+
+---
+
+## Components
+
+### SapBpList
+
+Displays a searchable, paginated list of Business Partners.
+
+#### Selector
+```html
+<ngx-st-sap-bp-list></ngx-st-sap-bp-list>
+```
+
+#### Inputs
+
+##### `onlyView`
+- **Type:** `boolean`
+- **Default:** `false`
+- **Description:** When true, hides action buttons (edit/delete).
+- **Example:**
+  ```typescript
+  [onlyView]="true"
+  ```
+
+##### `userSettings` (required)
+- **Type:** `SapBpUserSettings`
+- **Description:** User permissions and settings for BP operations.
+- **Example:**
+  ```typescript
+  [userSettings]="bpSettings"
+  
+  bpSettings: SapBpUserSettings = {
+    canCreate: true,
+    canEdit: true,
+    canDelete: true,
+    defaultCountry: 'US'
+  };
+  ```
+
+#### Features
+- Search by card code or name
+- Pagination with configurable page size
+- Shows active/inactive status
+- Displays address information
+- Edit and delete actions
+- Persistent page size in localStorage
+
+#### Example
+
+```html
+<ngx-st-sap-bp-list
+  [userSettings]="userSettings"
+  [onlyView]="false">
+</ngx-st-sap-bp-list>
+```
+
+---
+
+### SapBpCreate
+
+Form component for creating new Business Partners.
+
+#### Selector
+```html
+<ngx-st-sap-bp-create></ngx-st-sap-bp-create>
+```
+
+#### Features
+- Complete BP creation form
+- Customer and Vendor type selection
+- Address management
+- Contact person management
+- Validation
+- Tax configuration
+
+#### Example
+
+```html
+<ngx-st-sap-bp-create
+  (created)="onBpCreated($event)">
+</ngx-st-sap-bp-create>
+```
+
+```typescript
+onBpCreated(bp: SapBpModel): void {
+  this.router.navigate(['/bp', bp.cardCode]);
+}
+```
+
+---
+
+### SapBpEdit
+
+Form component for editing existing Business Partners.
+
+#### Selector
+```html
+<ngx-st-sap-bp-edit></ngx-st-sap-bp-edit>
+```
+
+#### Features
+- Edit all BP fields
+- Update addresses
+- Update contact persons
+- Activate/deactivate BP
+- Validation
+
+#### Example
+
+```html
+<ngx-st-sap-bp-edit
+  [cardCode]="selectedBpCode"
+  (updated)="onBpUpdated($event)">
+</ngx-st-sap-bp-edit>
+```
+
+---
+
+### SapBpDetails
+
+Read-only view of Business Partner details.
+
+#### Selector
+```html
+<ngx-st-sap-bp-details></ngx-st-sap-bp-details>
+```
+
+#### Features
+- Display all BP information
+- Show addresses
+- Show contact persons
+- Export/print functionality
+
+#### Example
+
+```html
+<ngx-st-sap-bp-details
+  [cardCode]="bpCode">
+</ngx-st-sap-bp-details>
+```
+
+---
+
+### SapBpListAddress
+
+List and manage Business Partner addresses.
+
+#### Selector
+```html
+<ngx-st-sap-bp-list-address></ngx-st-sap-bp-list-address>
+```
+
+#### Features
+- Display ship-to addresses
+- Display bill-to addresses
+- Add new addresses
+- Edit existing addresses
+- Delete addresses
+- Set default address
+
+---
+
+### SapBpCreateAddress
+
+Dialog component for creating new addresses.
+
+#### Selector
+Used as a dialog component via MatDialog.
+
+#### Features
+- Address type selection (ship-to/bill-to)
+- Complete address form
+- Country/state selection
+- Address validation
+
+---
+
+### SapBpDetailsAddress
+
+View address details in read-only mode.
+
+#### Selector
+```html
+<ngx-st-sap-bp-details-address></ngx-st-sap-bp-details-address>
+```
+
+---
+
+### SapBpListContactPerson
+
+List and manage contact persons for a Business Partner.
+
+#### Selector
+```html
+<ngx-st-sap-bp-list-contact-person></ngx-st-sap-bp-list-contact-person>
+```
+
+#### Features
+- Display all contact persons
+- Add new contacts
+- Edit existing contacts
+- Delete contacts
+- Primary contact designation
+
+---
+
+### SapBpCreateContactPerson
+
+Dialog component for creating contact persons.
+
+#### Features
+- Name and title
+- Email and phone
+- Position
+- Primary contact flag
+
+---
+
+### SapBpDetailsContactPerson
+
+View contact person details.
+
+---
+
+## Models
+
+### SapBpModel
+
+Main Business Partner model:
+
+```typescript
+interface SapBpModel {
+  cardCode: string;              // Unique identifier
+  cardName: string;              // BP name
+  cardType: 'C' | 'S';          // Customer or Supplier
+  active: 'Y' | 'N';            // Active status
+  cardForeignName: string;       // Foreign name
+  groupCode: number;             // BP group
+  currency: string;              // Default currency
+  phone1: string;                // Primary phone
+  phone2: string;                // Secondary phone
+  fax: string;                   // Fax number
+  emailAddress: string;          // Email
+  website: string;               // Website URL
+  remarks: string;               // Notes/remarks
+  
+  // Address lists
+  billToAddresses: SapBpAddressModel[];
+  shipToAddresses: SapBpAddressModel[];
+  
+  // Contact persons
+  contactPersons: SapBpContactPersonModel[];
+  
+  // Tax & financial
+  taxId: string;                 // Tax ID number
+  taxType: BpTaxTypeEnum;        // Tax type
+  paymentTerms: number;          // Payment terms code
+  priceList: number;             // Price list ID
+  
+  // Sales
+  salesEmployee: number;         // Sales person code
+  territory: number;             // Territory code
+  
+  // Additional
+  industry: number;              // Industry code
+  sicCode: string;               // SIC classification
+}
+```
+
+### SapBpAddressModel
+
+```typescript
+interface SapBpAddressModel {
+  addressName: string;           // Address identifier
+  street: string;                // Street address
+  city: string;                  // City
+  county: string;                // County
+  country: string;               // Country code
+  state: string;                 // State code
+  zipCode: string;               // Postal code
+  addressType: 'B' | 'S';       // Bill-to or Ship-to
+  
+  // Contact at address
+  contactPerson: string;
+  phone1: string;
+  phone2: string;
+  fax: string;
+  email: string;
+}
+```
+
+### SapBpContactPersonModel
+
+```typescript
+interface SapBpContactPersonModel {
+  cardCode: string;              // BP code
+  name: string;                  // Contact name
+  position: string;              // Job title/position
+  phone1: string;                // Primary phone
+  phone2: string;                // Secondary phone
+  mobilePhone: string;           // Mobile number
+  fax: string;                   // Fax number
+  email: string;                 // Email address
+  remarks: string;               // Notes
+  isPrimary: boolean;            // Primary contact flag
+}
+```
+
+### SapBpUserSettings
+
+```typescript
+interface SapBpUserSettings {
+  canCreate: boolean;            // Can create new BPs
+  canEdit: boolean;              // Can edit BPs
+  canDelete: boolean;            // Can delete BPs
+  defaultCountry: string;        // Default country code
+  defaultCurrency: string;       // Default currency
+  defaultPaymentTerms: number;   // Default payment terms
+  defaultPriceList: number;      // Default price list
+}
+```
+
+---
+
+## Services
+
+### SapBpService
+
+Main service for Business Partner operations.
+
+#### Methods
+
+##### `getList(page: number, pageSize: number, code?: string, name?: string): Observable<SapBpListResponse>`
+Get paginated list of Business Partners.
+
+##### `getById(cardCode: string): Observable<SapBpModel>`
+Get single Business Partner by code.
+
+##### `create(bp: SapBpCreateModel): Observable<SapBpModel>`
+Create new Business Partner.
+
+##### `update(cardCode: string, bp: SapBpEditModel): Observable<SapBpModel>`
+Update existing Business Partner.
+
+##### `delete(cardCode: string): Observable<void>`
+Delete Business Partner.
+
+##### `getAddresses(cardCode: string): Observable<SapBpAddressModel[]>`
+Get all addresses for a BP.
+
+##### `createAddress(cardCode: string, address: SapBpAddressModel): Observable<void>`
+Add new address to BP.
+
+##### `getContactPersons(cardCode: string): Observable<SapBpContactPersonModel[]>`
+Get all contact persons for a BP.
+
+##### `createContactPerson(cardCode: string, contact: SapBpContactPersonModel): Observable<void>`
+Add new contact person to BP.
+
+---
+
+### SapBpHelperService
+
+Helper service for dropdown data.
+
+#### Methods
+
+##### `getCountries(): Observable<SapBpAddrCountryModel[]>`
+Get list of countries.
+
+##### `getStates(countryCode: string): Observable<SapBpAddrStateModel[]>`
+Get states for a country.
+
+##### `getPaymentTerms(): Observable<SapBpPaymentTermsModel[]>`
+Get payment terms list.
+
+##### `getPriceLists(): Observable<SapBpPricelistModel[]>`
+Get price lists.
+
+##### `getSalesEmployees(): Observable<SapBpSalesEmployeeModel[]>`
+Get sales employees.
+
+##### `getTerritories(): Observable<SapBpTerritoryModel[]>`
+Get territories.
+
+---
+
+## Examples
+
+### Basic Business Partner List
+
+```html
+<mat-card>
+  <mat-card-header>
+    <mat-card-title>Business Partners</mat-card-title>
+  </mat-card-header>
+  <mat-card-content>
+    <ngx-st-sap-bp-list
+      [userSettings]="userSettings">
+    </ngx-st-sap-bp-list>
+  </mat-card-content>
+</mat-card>
+```
+
+```typescript
+export class BpListComponent {
+  userSettings: SapBpUserSettings = {
+    canCreate: true,
+    canEdit: true,
+    canDelete: true,
+    defaultCountry: 'US',
+    defaultCurrency: 'USD',
+    defaultPaymentTerms: 1,
+    defaultPriceList: 1
+  };
+}
+```
+
+### Create New Business Partner
+
+```html
+<mat-dialog-content>
+  <ngx-st-sap-bp-create
+    (created)="onCreated($event)"
+    (cancelled)="onCancelled()">
+  </ngx-st-sap-bp-create>
+</mat-dialog-content>
+```
+
+```typescript
+export class CreateBpDialogComponent {
+  constructor(
+    private dialogRef: MatDialogRef<CreateBpDialogComponent>,
+    private snackBar: MatSnackBar
+  ) {}
+
+  onCreated(bp: SapBpModel): void {
+    this.snackBar.open(`Business Partner ${bp.cardCode} created successfully`, 'Close');
+    this.dialogRef.close(bp);
+  }
+
+  onCancelled(): void {
+    this.dialogRef.close();
+  }
+}
+```
+
+### Edit Business Partner
+
+```html
+<div class="edit-bp-container">
+  <h2>Edit Business Partner: {{ cardCode }}</h2>
+  
+  <ngx-st-sap-bp-edit
+    [cardCode]="cardCode"
+    (updated)="onUpdated($event)"
+    (cancelled)="goBack()">
+  </ngx-st-sap-bp-edit>
+</div>
+```
+
+```typescript
+export class EditBpComponent implements OnInit {
+  cardCode: string;
+
+  constructor(
+    private route: ActivatedRoute,
+    private router: Router,
+    private snackBar: MatSnackBar
+  ) {}
+
+  ngOnInit() {
+    this.cardCode = this.route.snapshot.params['code'];
+  }
+
+  onUpdated(bp: SapBpModel): void {
+    this.snackBar.open('Business Partner updated successfully', 'Close');
+    this.router.navigate(['/bp', bp.cardCode]);
+  }
+
+  goBack(): void {
+    this.router.navigate(['/bp']);
+  }
+}
+```
+
+### Business Partner Details with Tabs
+
+```html
+<mat-card>
+  <mat-card-header>
+    <mat-card-title>{{ bp?.cardName }}</mat-card-title>
+    <mat-card-subtitle>Code: {{ bp?.cardCode }}</mat-card-subtitle>
+  </mat-card-header>
+  
+  <mat-card-content>
+    <mat-tab-group>
+      <mat-tab label="Details">
+        <ngx-st-sap-bp-details
+          [cardCode]="cardCode">
+        </ngx-st-sap-bp-details>
+      </mat-tab>
+      
+      <mat-tab label="Addresses">
+        <ngx-st-sap-bp-list-address
+          [cardCode]="cardCode">
+        </ngx-st-sap-bp-list-address>
+      </mat-tab>
+      
+      <mat-tab label="Contacts">
+        <ngx-st-sap-bp-list-contact-person
+          [cardCode]="cardCode">
+        </ngx-st-sap-bp-list-contact-person>
+      </mat-tab>
+    </mat-tab-group>
+  </mat-card-content>
+  
+  <mat-card-actions>
+    <button mat-button (click)="edit()">Edit</button>
+    <button mat-button color="warn" (click)="delete()">Delete</button>
+  </mat-card-actions>
+</mat-card>
+```
+
+### Read-Only View
+
+```html
+<ngx-st-sap-bp-list
+  [onlyView]="true"
+  [userSettings]="viewOnlySettings">
+</ngx-st-sap-bp-list>
+```
+
+```typescript
+viewOnlySettings: SapBpUserSettings = {
+  canCreate: false,
+  canEdit: false,
+  canDelete: false,
+  defaultCountry: 'US'
+};
+```
+
+---
 
 ## Build
 
@@ -15,10 +596,3 @@ Run `ng build ngx-st-sap-bp` to build the project. The build artifacts will be s
 
 After building your library with `ng build ngx-st-sap-bp`, go to the dist folder `cd dist/ngx-st-sap-bp` and run `npm publish`.
 
-## Running unit tests
-
-Run `ng test ngx-st-sap-bp` to execute the unit tests via [Karma](https://karma-runner.github.io).
-
-## Further help
-
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.