Vue Payment Gateway

A Vue.js payment gateway library to handle payments with ease.

Installation

To install the library, run the following command:

npm install @achyutlabsau/vue-payment-gateway

Plugin Initialization

To use the payment gateway, you need to initialize the plugin in your Vue app. Here’s an example of how to set it up:

import VuePaymentGateway from "@achyutlabsau/vue-payment-gateway";

app.use(VuePaymentGateway, {
  productName: "Pratham Respos", // Name of your product
  productVersion: "3.3.0", // Version of your product
  productVendorName: "Achyutlabs", // Name of the product vendor
  posId: "unique-pos-id", // Unique identifier for the POS system
  posRegisterId: "pos-register-id", // Unique identifier for the POS register
  posRegisterName: "register-name", // Name of the POS register
  posBusinessName: "business name", // Name of the business using the POS system
  tyroApiKey: "tyro-api-key", // API key for Tyro integration
  environment: "development", // Set environment to 'development' or 'production'
});

Note: Replace the placeholder values with the actual details of your POS system, product, and Tyro API key.

Using the Payment Gateway

This library supports multiple payment providers, such as Tyro, SmartPay, and Linkly. Here’s how to use them in your application.

Using Tyro

To use the Tyro payment gateway, import and initialize it as shown below:

import { useTyro } from "@achyutlabsau/vue-payment-gateway/tyro";

const tyro = useTyro();

// Example usage
await tyro.processPayment(amount, options);

Using SmartPay

To use the SmartPay payment gateway, import and initialize it as shown below:

import { useSmartPay } from "@achyutlabsau/vue-payment-gateway/smartpay";

const smartPay = useSmartPay();

// Example usage
await smartPay.processPayment(amount, options);

Using Linkly

To use the Linkly payment gateway, import and initialize it as shown below:

import { useLinkly } from "@achyutlabsau/vue-payment-gateway/linkly";

const linkly = useLinkly();

// Example usage
await linkly.processPayment(amount, options);

Payment Method API

Each payment provider (Tyro, SmartPay, Linkly) provides methods to process payments. Here are some of the most commonly used methods:

processPayment(amount: number, options?: object)

Processes a payment for the specified amount.

Parameters:

• amount: The amount to be charged.
• options: (Optional) Additional options for the payment.

cancelPayment()

Cancels an ongoing payment.

getStatus()

Gets the status of the current payment transaction.

Note: The methods may differ slightly between Tyro, SmartPay, and Linkly. Refer to the official documentation of each payment provider for more details.

Environment Configuration

The environment can be set to either development or production. Make sure to use development during testing and switch to production in a live environment to ensure security and proper tracking.

app.use(VuePaymentGateway, {
  ...
  environment: "production", // Set to 'production' in a live environment
});

Example Usage

Here’s a complete example of how you might use the payment gateway to process a payment with Tyro:

import { useTyro } from "@achyutlabsau/vue-payment-gateway/tyro";

const tyro = useTyro();

async function handlePayment() {
  try {
    const paymentResult = await tyro.processPayment(100, { currency: "USD" });
    console.log("Payment successful:", paymentResult);
  } catch (error) {
    console.error("Payment failed:", error);
  }
}

Troubleshooting

• Environment Issues: Make sure environment is set correctly (development or production).
• Invalid API Key: Ensure the Tyro API key is valid and correctly set in the configuration.
• Payment Processing Issues: Check if the payment provider's service is online and available.

Additional Resources

For more details and usage examples, refer to the official documentation or support channels provided by Achyutlabs.

With this guide, you should be able to set up and use the Vue Payment Gateway efficiently to handle payments with Tyro, SmartPay, and Linkly integrations.