npm package: @mohitjee/paypal
Description: A brief description of your package
Author: Your Name
Latest version: 1.1.1

# Paypal

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.2.0.

## Code scaffolding

Run `ng generate component component-name --project paypal` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project paypal`.
> Note: Don't forget to add `--project paypal` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build paypal` to build the project. The build artifacts will be stored in the `dist/` directory.



[PayPal Developer link](https://developer.paypal.com/home/)




![Image Description](![alt text](image.png))

![alt text](image-1.png)




### Configuration

- **Option 1:** You can  import in AppComponent  .

  Example:
  ```typescript

  import { NgModule } from '@angular/core';
  import { AppComponent } from './app.component'; 
  import { PaypalModule } from '@mohitjee/paypal';
  import { PaypalComponent } from '@mohitjee/paypal';
  
  @NgModule({
      declarations: [AppComponent],
      imports: [   
        PaypalModule
      ],
      bootstrap: [AppComponent],
      providers:[PaypalComponent]

  })
  export class AppModule { }


### Configuration

- **Option 2:** You can import in AppComponent.

  Example:
  ```typescript
  import { Component } from '@angular/core';
  import { FormBuilder, FormGroup, Validators } from '@angular/forms';

  import { PaypalComponent } from '@mohitjee/paypal';
  import { PaypalService } from '@mohitjee/paypal';

  @Component({
    selector: 'app-demo',
    templateUrl: './demo.component.html',
    styleUrls: ['./demo.component.css']
  })
  export class LandingPageCoffeeComponent {
    paypalComponent: PaypalComponent;
  

    constructor(public router: Router, private fb: FormBuilder, private paypalService: PaypalService) {
      this.paypalComponent = new PaypalComponent(this.fb, this.paypalService);
    }


  }




## example
```javascript
 get_Access_token() {
    this.paypalComponent.Access_token().then((response) => {
      console.log('Response:', response);
      this.token=response.token.access_token     

    }).catch((error) => {
      console.error('Error:', error);
    });
  }


  create_order_now(token:any) {
    console.log(token)
    this.paypalComponent.create_order(token).then((response) => {    
      this.order=response.orderss.id   
      console.log('Response:', response);
    }).catch((error) => {
      console.error('Error:', error);
    });
  }

    get_order_details(Access_token:any,order_id:any) {
  
    this.paypalComponent.order_details(Access_token,order_id).then((response) => {
      console.log('Response:', response);
      this.orderall=response.order
    }).catch((error) => {
      console.error('Error:', error);
    });
  }


    capturePayments(order_id:any,access_token:any) {
    this.paypalComponent.capturePayment(order_id,access_tokenS).then((response) => {
      console.log('Response:', response);
      this.capturedetails=response.capturedetails
    }).catch((error) => {
      console.error('Error:', error);
    });
  }
```

## Example

```html
<h1>>>>>>>>>>>>>>>>>>>>> get_Access_token html >>>>>>>>>>>>>>>>>><h1>

  <form [formGroup]="paypalComponent.form1" (ngSubmit)="get_Access_token()">
    <div class="modal-body">
      <div class="contaner">
        <div class="row">
                 
            <div class="col-md-12">
            <label class="required">Client ID	</label>
            <input class="form-control input" formControlName="Username">
            <div class="text-error"
            *ngIf="paypalComponent.form1.controls['Username'].errors?.['required'] && paypalComponent.show">
            This field is required.
        </div>
          </div>
          
          <div class="col-md-12">
            <label class="required">Secret</label>
            <input class="form-control input" formControlName="Password" 
              placeholder="Enter Total Members">
              <div class="text-error"
              *ngIf="paypalComponent.form1.controls['Password'].errors?.['required'] && paypalComponent.show">
              This field is required.
          </div>
          </div>
        </div>
      </div>
    </div>
    <div class="modal-footer">
      <div class="col-md-12 modal-footer-button">
        <button type="submit" class="btn btn-primary mr-3">Login</button>
      </div>
    </div>
  </form>



<h1>>>>>>>>>>>>>>>>>>>>> create_order html >>>>>>>>>>>>>>>>>><h1>
   <form [formGroup]="paypalComponent.form2" (ngSubmit)="create_order_now(token)">
      <div class="modal-body">
        <div class="contaner">
          <div class="row">
            <div class="col-md-12">
              <label class="required">Name</label>
              <input class="form-control input" formControlName="name">
              <div class="text-error"
              *ngIf="paypalComponent.form2.controls['name'].errors?.['required'] && paypalComponent.showerror">
              This field is required.
            </div>
            </div>
            <div class="col-md-12">
              <label class="required">Description</label>
              <input class="form-control input" formControlName="description" placeholder="Enter Total Members">
              <div class="text-error"
              *ngIf="paypalComponent.form2.controls['description'].errors?.['required'] && paypalComponent.showerror">
              This field is required.
            </div>
            </div>
            <div class="col-md-12">
              <label class="required">Quantity</label>
              <input type="number" class="form-control input" formControlName="quantity" placeholder="Enter Total Members">
              <div class="text-error"
              *ngIf="paypalComponent.form2.controls['quantity'].errors?.['required'] && paypalComponent.showerror">
              This field is required.
            </div>
            </div>
            <div class="col-md-12">
              <label class="required">Currency code</label>
              <input class="form-control input" formControlName="currency_code" placeholder="Enter Total Members">
              <div class="text-error"
              *ngIf="paypalComponent.form2.controls['currency_code'].errors?.['required'] && paypalComponent.showerror">
              This field is required.
           </div>
            </div>
            <div class="col-md-12">
              <label class="required">value</label>
              <input type="number" class="form-control input" formControlName="value" placeholder="Enter Total Members">
              <div class="text-error"
              *ngIf="paypalComponent.form2.controls['value'].errors?.['required'] && paypalComponent.showerror">
              This field is required.
           </div>
             </div>     
            <div class="col-md-12">
              <label class="required">Return Url</label>
              <input class="form-control input" formControlName="return_url" placeholder="Enter Return Url">
              <div class="text-error" *ngIf="paypalComponent.form2.controls['return_url'].errors?.['required'] && paypalComponent.showerror">
                This field is required.
              </div>
              <div class="text-error" *ngIf="paypalComponent.form2.controls['return_url'].errors?.['pattern'] && paypalComponent.showerror">
                Please enter a valid URL.
              </div>
            </div>  
            <div class="col-md-12">
              <label class="required">Cancel Url</label>
              <input class="form-control input" formControlName="cancel_url" placeholder="Enter Cancel Url">
              <div class="text-error"
              *ngIf="paypalComponent.form2.controls['cancel_url'].errors?.['required'] && paypalComponent.showerror">
              This field is required.
           </div>
           <div class="text-error" *ngIf="paypalComponent.form2.controls['cancel_url'].errors?.['pattern'] && paypalComponent.showerror">
            Please enter a valid URL.
          </div>
            </div>    
             </div>
        </div>
      </div>
      <div class="modal-footer">
        <div class="col-md-12 modal-footer-button">
          <button type="submit" class="btn btn-primary mr-3">Orders Now</button>
        </div>
      </div>
    </form>



<h1>>>>>>>> get_order_details && within  Capture Payment html >>>>>>>>>>>>>>>>>><h1>

    <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <div>
          <h2>Order Details</h2>
          <table class="table">
            <thead>
              <tr>
                <th>ID</th>
                <th>Intent</th>
                <th>Status</th>
                <th>Amount</th>
                <th>Created Time</th>
          
                <th>Capture Payment</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td>{{ orderall?.id }}</td>
                <td>{{ orderall?.intent }}</td>
                <td>{{ orderall?.status }}</td>
                <td>{{ orderall?.purchase_units?.[0]?.amount?.value }} {{ orderall?.purchase_units?.[0]?.amount?.currency_code }}</td>
                <td>{{ orderall?.create_time }}</td>
        
        
        
                <td>
                  <button class="btn btn-primary" (click)="capturePayments(orderall.id,tokenS)">Capture Payment</button>
                </td>
        
              </tr>
            </tbody>
          </table>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

```





## Running unit tests

Run `ng test paypal` 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.