Awesome

UNOFFICIAL Culqi payment gateway library made to use with Angular by lperezp.dev

Demo

Ver Demo

☀️ License

MIT

🖥 Environment Support

• Angular ^18.0.0

📦 Installation

Adding ngx-culqi to your project is as simple as running one command:

npm i ngx-culqi

🔨 Usage

import { ICulqiOptions, IOrderCulqiResponse, NgxCulqiService } from 'ngx-culqi';

@Component({...})
export class YourComponent {
  constructor(private ngxCulqiService: NgxCulqiService) {}

  paymentCulqi(): void {
    const order = {
      "amount": 1000,
      "currency_code": "",
      "description": "",
      "order_number": 00001,
      "client_details": {
        "first_name": "",
        "last_name": "",
        "email": "",
        "phone_number": ""
      },
      "expiration_date": (Math.floor(Date.now() / 1000) + 86400),
      "confirm": false
    };

    this.ngxCulqiService.generateOrder(order).subscribe((response: Partial<IOrderCulqiResponse>) => {
      const culqiSettings = {
        title: order.description,
        currency: 'PEN',
        amount: order.amount,
        order: response.id,
        xculqirsaid: environment.xculqirsaid,
        rsapublickey: environment.rsapublickey
      };

      const culqiOptions: ICulqiOptions = { style: this.styleCulqi };
      this.ngxCulqiService.generateToken(culqiSettings, culqiOptions);
    });
  }
}

Inside ngOnInit add the following script:

    ngOnInit(): void {
    this.ngxCulqiService.loadScriptCulqi(environment.tokenCulqi, environment.apiKeyCulqi);
    this.ngxCulqiService.tokenCreated$.subscribe(value => {
      if (value) {
        this.showToken(value);
        this.ngxCulqiService.closeCulqi();
      }
    });

    this.ngxCulqiService.orderCreated$.subscribe(value => {
      if (value) {
        this.showOrder(value);
      }
    });
  }

Check Culqi documentation for more information

🔗 Links

• Culqi
• Culqi Docs

🤝 Contributing

I welcome all contributions. Please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as GitHub issues.

🎉 Author

• Luis Eduardo

Love ngx-culqi? Give our repo a star :star: :arrow_up:.