Jump to content
Kellison Ruan

MOSTRAR PAYPAL NO CHECKOUT DO APP IONIC

Recommended Posts

Olá galera, Boa tarde!

Estou com um probleminha em Ionic que está quebrando muito minha cabeça por dias.

Método de pagamento do paypal aparece em meu site, mas não aparece no app ionic, o que será? Já tentei de tudo. Esse app faz comunicação via API do Woocommerce, e lá está habilitado a forma de pagamento com PayPal, porém só não aparece no app, já que na página de checkout no meu site, aparece.

 

Segue o código da página de checkout do app:

 

import { Component, Inject } from '@angular/core';
import { NavController, NavParams, AlertController, Loading, LoadingController, ToastController, App } from 'ionic-angular';
import { PlacedPage } from '../placed/placed';
import { PaymentGateway } from "../../models/payment-gateway.models";
import { Constants } from "../../models/constants.models";

import { WordpressClient } from '../../providers/wordpress-client.service';
import { Global } from '../../providers/global';
import { Subscription } from "rxjs/Subscription";
import { CartItem } from "../../models/cart-item.models";
import { OrderRequest } from "../../models/order-request.models";
import { Address } from "../../models/address.models";
import { ShippingLine } from "../../models/shipping-line.models";
import { UserResponse } from "../../models/user-response.models";
import { OrderResponse } from "../../models/order-response.models";
import { Currency } from "../../models/currency.models";
import { InAppBrowser, InAppBrowserOptions } from '@ionic-native/in-app-browser';
import { sha512 } from 'js-sha512';
import { APP_CONFIG, AppConfig } from '../../app/app.config';
import { OrderUpdateRequest } from '../../models/order-update-request.models';
import { Coupon } from '../../models/coupon.models';
import { HomePage } from '../home/home';
import { TranslateService } from '@ngx-translate/core';
import { Helper } from '../../models/helper.models';
import { ShippingMethod } from '../../models/shipping-method.models';
import { PayPal, PayPalPayment, PayPalConfiguration, PayPalPaymentDetails } from '@ionic-native/paypal';

@Component({
	selector: 'page-payment',
	templateUrl: 'payment.html',
	providers: [WordpressClient]
})

export class PaymentPage {
	private loading: Loading;
	private loadingShown: Boolean = false;
	private placedPagePushed: Boolean = false;
	private paymentDone: Boolean = false;
	private paymentFailAlerted: Boolean = false;

	private subscriptions: Array<Subscription> = [];
	private paymentGateways = new Array<PaymentGateway>();
	private cartItems: Array<CartItem>;
	private selectedPaymentGateway;
	private selectedAddress: Address;
	private orderRequest: OrderRequest;
	private orderId = -1;
	private user: UserResponse;
	private totalItems = 0;
	private total = 0;
	private couponApplied = false;
	private pickupTime = 0;
	private deliveryTime = 0;
	private shippingChargeGlobal: number;

	constructor(@Inject(APP_CONFIG) private config: AppConfig, public translate: TranslateService, private iab: InAppBrowser, private toastCtrl: ToastController, public navCtrl: NavController, private navParams: NavParams, private service: WordpressClient, private loadingCtrl: LoadingController, private alertCtrl: AlertController, public appCtrl: App) {
		this.cartItems = this.navParams.get('cart');
		this.totalItems = this.navParams.get('totalItems');
		this.total = this.navParams.get('total');
		this.shippingChargeGlobal = this.navParams.get('shippingChargeGlobal');

		let paymentGateways = JSON.parse(window.localStorage.getItem(Constants.PAYMENT_GATEWAYS));
		this.selectedAddress = JSON.parse(window.localStorage.getItem(Constants.SELECTED_ADDRESS));


		if (paymentGateways != null) {
			for (let pg of paymentGateways) {
				if (pg.enabled && this.paymentImplemented(pg.id)) {
					this.paymentGateways.push(pg);
				}
			}
		}
	}

	ionViewWillLeave() {
		this.subscriptions.forEach((subscription: Subscription) => {
			subscription.unsubscribe();
		});
		this.dismissLoading();
	}

	paymentImplemented(id) {
		return id === "pumcp" || id === "payuindia" || id === "cod";
	}

	paymentMethod(paymentGateway) {
		this.selectedPaymentGateway = paymentGateway;
	}

	placedPage() {
		if (this.selectedPaymentGateway == null) {
			this.translate.get('field_error_payment_method').subscribe(value => {
				this.showToast(value);
			});
		} else {
			this.orderRequest = new OrderRequest();
			this.orderRequest.payment_method = this.selectedPaymentGateway.id ? this.selectedPaymentGateway.id : "cod";
			this.orderRequest.payment_method_title = this.selectedPaymentGateway.title ? this.selectedPaymentGateway.title : "cod";
			this.orderRequest.set_paid = false;
			this.orderRequest.billing = this.selectedAddress;
			this.orderRequest.shipping = this.selectedAddress;
			this.user = JSON.parse(window.localStorage.getItem(Constants.USER_KEY));
			this.orderRequest.customer_id = String(this.user.id);

			let selectedShippingMethod: ShippingMethod = JSON.parse(window.localStorage.getItem(Constants.SELECTED_SHIPPING_METHOD));
			if (selectedShippingMethod) {
				let shippingTotal = 0;
				for (let ci of this.cartItems) {
					if (!ci.product.shipping_cost_use_global && ci.product.shipping_cost != 1)
						shippingTotal = shippingTotal + ci.product.shipping_cost;
				}
				if (this.shippingChargeGlobal != -1) {
					shippingTotal = shippingTotal + this.shippingChargeGlobal;
				}
				this.orderRequest.shipping_lines = new Array<ShippingLine>();
				this.orderRequest.shipping_lines.push(new ShippingLine(selectedShippingMethod.method_id, selectedShippingMethod.method_title, String(shippingTotal)));
			}

			this.orderRequest.line_items = this.cartItems;
			for (let item of this.orderRequest.line_items) {
				item.product = null;
			}

			this.translate.get('order_creating').subscribe(value => {
				this.presentLoading(value);
			});
			let coupon: Coupon = JSON.parse(window.localStorage.getItem(Constants.SELECTED_COUPON));
			let subscription: Subscription = this.service.createOrder(window.localStorage.getItem(Constants.ADMIN_API_KEY), this.orderRequest).subscribe(data => {
				this.orderId = data.id;
				if (coupon) {
					this.applyCoupon(coupon);
				} else {
					this.orderPlaced();
				}
			}, err => {
				console.log(err);
				this.dismissLoading();
				let orderId = Helper.extractOrderIdFromError(err);
				if (orderId != -1) {
					this.orderId = orderId;
					if (coupon) {
						this.applyCoupon(coupon);
					} else {
						this.orderPlaced();
					}
				} else {
					this.translate.get('order_failed').subscribe(value => {
						this.showToast(value);
					});
					this.appCtrl.getRootNav().setRoot(HomePage);
				}
			});
			this.subscriptions.push(subscription);
		}
	}

	applyCoupon(coupon) {
		let couponSubs: Subscription = this.service.applyCouponCode(window.localStorage.getItem(Constants.ADMIN_API_KEY), String(this.orderId), coupon.code).subscribe(data => {
			this.couponApplied = true;
			window.localStorage.removeItem(Constants.SELECTED_COUPON);
			this.translate.get('confirm_order_coupon_applied').subscribe(value => {
				this.showToast(value);
			});
			this.orderPlaced();
		}, err => {
			console.log(err);
			this.dismissLoading();
		});
		this.subscriptions.push(couponSubs);
	}

	orderPlaced() {
		this.dismissLoading();
		if (this.selectedPaymentGateway.id && this.selectedPaymentGateway.id === "cod") {
			this.clearCart();
			this.navCtrl.setRoot(PlacedPage);
		} else if (this.selectedPaymentGateway.id === "pumcp" || this.selectedPaymentGateway.id === "payuindia") {
			this.initPayUMoney();
		} else {
			this.translate.get('order_placed_cod').subscribe(value => {
				this.showToast(value);
			});
			this.clearCart();
			this.navCtrl.setRoot(PlacedPage);
		}
	}

	initPayUMoney() {
		let name = this.user.first_name && this.user.first_name.length ? this.user.first_name : this.user.username;
		let mobile = this.user.username;
		let email = this.user.email;
		let bookingId = String(Math.floor(Math.random() * (99 - 10 + 1) + 10)) + this.orderId;
		let productinfo = this.orderId;
		let salt = this.config.payuSalt;
		let key = this.config.payuKey;
		let amt = this.couponApplied ? this.total : this.totalItems;
		let string = key + '|' + bookingId + '|' + amt + '|' + productinfo + '|' + name + '|' + email + '|||||||||||' + salt;
		let encrypttext = sha512(string);

		//let url = "payumoney/payuBiz.html?amt=" + amt + "&name=" + name + "&mobileNo=" + mobile + "&email=" + email + "&bookingId=" + bookingId + "&productinfo=" + productinfo + "&salt=" + salt + "&key=" + key;
		let url = "payumoney/payuBiz.html?amt=" + amt + "&name=" + name + "&mobileNo=" + mobile + "&email=" + email + "&bookingId=" + bookingId + "&productinfo=" + productinfo + "&hash=" + encrypttext + "&salt=" + salt + "&key=" + key;

		let options: InAppBrowserOptions = {
			location: 'yes',
			clearcache: 'yes',
			zoom: 'yes',
			toolbar: 'no',
			closebuttoncaption: 'back'
		};
		const browser: any = this.iab.create(url, '_blank', options);
		browser.on('loadstop').subscribe(event => {
			browser.executeScript({
				file: "payumoney/payumoneyPaymentGateway.js"
			});

			if (event.url == "http://localhost/success.php") {
				this.paymentSuccess();
				browser.close();
			}
			if (event.url == "http://localhost/failure.php") {
				this.paymentFailure();
				browser.close();
			}
		});
		browser.on('exit').subscribe(event => {
			if (!this.paymentDone && !this.paymentFailAlerted) {
				this.paymentFailure();
			}
		});
		browser.on('loaderror').subscribe(event => {
			this.showToast('something_went_wrong');
		});
	}

	paymentFailure() {
		this.paymentFailAlerted = true;
		let subscription: Subscription = this.service.updateOrder(window.localStorage.getItem(Constants.ADMIN_API_KEY), String(this.orderId), new OrderUpdateRequest('cancelled')).subscribe(data => {
		}, err => {
			console.log(err);
		});
		this.subscriptions.push(subscription);


		this.translate.get(['payment_fail_title', 'payment_fail_message', 'ok']).subscribe(res => {
			let alert = this.alertCtrl.create({
				title: res.payment_fail_title,
				message: res.payment_fail_message,
				buttons: [{
					text: res.ok,
					role: 'cancel',
					handler: () => {
						this.done();
						console.log('Okay clicked');
					}
				}]
			});
			alert.present();
		});
	}

	paymentSuccess() {
		this.paymentDone = true;
		this.clearCart();
		this.translate.get('just_a_moment').subscribe(value => {
			this.presentLoading(value);
		});
		let subscription: Subscription = this.service.updateOrder(window.localStorage.getItem(Constants.ADMIN_API_KEY), String(this.orderId), { set_paid: true }).subscribe(data => {
			this.done();
		}, err => {
			this.done();
			this.paymentSuccess();
			console.log(err);
		});
		this.subscriptions.push(subscription);
	}

	done() {
		if (!this.placedPagePushed) {
			this.placedPagePushed = true;
			this.dismissLoading();
			this.appCtrl.getRootNav().setRoot(this.paymentFailAlerted ? HomePage : PlacedPage);
		}
	}

	private presentLoading(message: string) {
		this.loading = this.loadingCtrl.create({
			content: message
		});

		this.loading.onDidDismiss(() => { });

		this.loading.present();
		this.loadingShown = true;
	}

	private dismissLoading() {
		if (this.loadingShown) {
			this.loadingShown = false;
			this.loading.dismiss();
		}
	}

	private presentErrorAlert(msg: string) {
		let alert = this.alertCtrl.create({
			title: 'Error',
			subTitle: msg,
			buttons: ['OK']
		});
		alert.present();
	}

	showToast(message: string) {
		let toast = this.toastCtrl.create({
			message: message,
			duration: 3000,
			position: 'bottom'
		});
		toast.onDidDismiss(() => {
			console.log('Dismissed toast');
		});
		toast.present();
	}

	clearCart() {
		let cartItems = new Array<CartItem>();
		window.localStorage.setItem('cartItems', JSON.stringify(cartItems));
	}
}

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By pashaa
      Como podem ver a google não aceita mais a SDK da unity ads por motivos da empresa
      Então resolvi remover toda a SDK do meu código. Libs,linhas de comando, tudo. e mesmo assim ainda ela acusa que tenho a sdk dentro do meu app
      Já tenho mais ou menos 1 ano programando em android e nunca tinha visto algo sobre ou esse erro persistir já que tirei tudo de dentro do app
      A minha dúvida é, onde estou errando? Onde deixei alguma coisa sobre essa sdk?Que inclusive coloquei pra teste a uns 5 meses atrás e até tinha esquecido dela kk
      Peço que me ajudem dando sugestões de como remover por completo pois eu praticamente reverti o processo de adicionar a SDK e todo tipo de linha relacionada a unity.ads
       

    • By Fernando Rafael
      Bom dia, estou baixando arquivos que estão em uma hospedagem própria para serem acessados por um aplicativo que estou desenvolvendo (consigo fazer normalmente utilizando os comandos citado mais a baixo), porém os arquivos ficam salvos na pasta padrão de DOWNLOADS do Android, minha intenção não é ficar acumulando estes arquivos no aparelho, ou esperar que o usuário exclua manualmente, gostaria em salva-los em uma pasta interna do aplicativo para que seja possível excluir automaticamente pelo próprio aplicativo, já tentei como alternativa excluir esses arquivos da pasta DOWNLOADS, mas não consegui...
       
      Segue o código que estou usando para baixar os arquivos, queria adaptar para baixar direto na pasta interna do aplicativo, ou como alternativa caso isso não seja possível, conseguir excluir esses arquivos da pasta DOWNLOADS do Android...
       
      String url = "https://www.site.com/arquivo.pdf"; //Arquivo que vou baixar DownloadManager.Request request = new DownloadManager.Request(Uri.parse(url)); request.setDescription("Alguma descrição"); request.setTitle("Algum titulo"); //A notificação de conslusão só esta disponível a partir da API 11 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) { request.allowScanningByMediaScanner(); request.setNotificationVisibility(DownloadManager.Request.VISIBILITY_VISIBLE_NOTIFY_COMPLETED); } //Salvando o arquivo no diretório de Downloads request.setDestinationInExternalPublicDir(Environment.DIRECTORY_DOWNLOADS, "arquivo.pdf"); DownloadManager manager = (DownloadManager) getSystemService(DOWNLOAD_SERVICE); manager.enqueue(request);  
    • By Fernando Rafael
      Bom dia, alguém poderia me ajudar com esse problema? 
       
      Estou fazendo um aplicativo bem simples em que sua única função será criar uma pasta no celular (em local acessível pelo gerenciador de arquivos do usuário), e posteriormente copiar arquivos de outro local ou rede e colocar nesta pasta.
       
      Fiz algumas pesquisas, mas por incrível que pareça não encontrei algo que tenha funcionando. Também tenho dúvidas sobre qual seria o equivalente ao "C:/" do Android.
    • By yoHDF
      Boa noite/bom dia/boa tarde.
       
      Meu nome é yoH ( nickname ), estou procurando pessoas que tenham interesse em desenvolver um jogo.. bom não vou dar muitos detalhes aqui, mas caso tenham interesse podem entrar em contato comigo através do Discord.. bom.. estou procurando pessoas que tenham vontade de fazer, mesmo que não tenham nenhuma experiência tenham vontade de aprender, e a participar do projeto..
      obrigado pela atenção gente!
       
       
      DIscord - yoH#4185
       
    • By Alessandro Bodão
      Eai pessoal!
       
      Estou trabalhando em um site WordPress do qual foi me passado a versão demo de um tema (Ample).
       
      O problema é o seguinte: Parece não existir nenhum lugar onde eu tenha acesso pra editar todos os textos e conteúdos (Ex: Os textos padrões do tema parecem ser inacessíveis).
       
      Já fucei praticamente todo o wp-admin e os demais painéis e nada... Já tentei baixar o plugin  Elementor pra ver se me facilitava nisso e nada... Já tentei ver se conseguia achar esses conteúdos e editar pelo código das páginas php do tema e nada. Não sei mais o que fazer, por gentileza peço ajuda.
       
      Tema: https://themegrilldemos.com/ample/
      Site: https://onecv.com.br/
       

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.