From 2ccc99639544173a687511da3531a4015b1009ab Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 21 Jan 2021 19:28:53 +0100 Subject: [PATCH] paypal integration --- .env | 11 ++++ api/{cart_place.php => cart_get.php} | 5 +- components/breadcrumb/breadcrumb.html | 3 ++ components/checkout/checkout.html | 5 +- components/checkout/checkout.js | 56 ++++++++++++++++++--- components/sectionHeader/sectionHeader.html | 1 + components/thankyou/thankyou.html | 18 +++++++ components/thankyou/thankyou.js | 5 ++ components/thankyou/thankyou.scss | 12 +++++ pages/index.ejs | 2 + pages/thankyou.ejs | 2 + src/js/index.js | 55 +++++++++++++++++++- src/scss/main.scss | 1 + 13 files changed, 162 insertions(+), 14 deletions(-) rename api/{cart_place.php => cart_get.php} (85%) create mode 100644 components/thankyou/thankyou.html create mode 100644 components/thankyou/thankyou.js create mode 100644 components/thankyou/thankyou.scss create mode 100644 pages/thankyou.ejs diff --git a/.env b/.env index 650d812..d0b018d 100644 --- a/.env +++ b/.env @@ -1,2 +1,13 @@ API_URL=http://iolovolio.local/api SITE_URL=http://iolovolio.local + +PP_ACCOUNT=dslaky-seller@gmail.com +PP_CLIENTID=AfnGR9VCjtBF_M0TemwikSG7q0sIm0mE4maIWw9vhiT1-X7vd9ONTvf-D3mEw1AaG9t2CWjoNbHIltI8 +PP_SECRET=ENR4dvs4Y4836E-rDGUUMRIY6QEsCzOLsy16yoIBUrDpyt-Jfqi9PwNzBIDeKUpTuTbZUxQBvIe44jC0 + +PP_RETURN=http://iolovolio.local/thankyou +PP_AUTH_URL=https://api-m.sandbox.paypal.com/v1/oauth2/token +PP_ORDER_URL=https://api-m.sandbox.paypal.com/v2/checkout/orders + +#dslaky-buyer@gmail.com dslakyPwd +#dslaky-facilitator@gmail.com dslakyPwd diff --git a/api/cart_place.php b/api/cart_get.php similarity index 85% rename from api/cart_place.php rename to api/cart_get.php index c962d7b..928f2f5 100644 --- a/api/cart_place.php +++ b/api/cart_get.php @@ -12,14 +12,11 @@ header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers $databaseService = new DatabaseService(); $conn = $databaseService->getConnection(); -$body = $_POST['body']; - http_response_code(200); echo json_encode( array( "status" => 200, - "cart" => array_values($_SESSION['CART']), - "shipping" => $body + "cart" => array_values($_SESSION['CART']) )); ?> diff --git a/components/breadcrumb/breadcrumb.html b/components/breadcrumb/breadcrumb.html index 950f68f..931bf5c 100644 --- a/components/breadcrumb/breadcrumb.html +++ b/components/breadcrumb/breadcrumb.html @@ -22,6 +22,9 @@ case 'checkout': $levels[0] = array('checkout', '/checkout'); break; + case 'thankyou': + $levels[0] = array('thankyou', '/'); + break; case 'due-cucchiai-di-salute': $levels[0] = array('raccontare', '/raccontare'); diff --git a/components/checkout/checkout.html b/components/checkout/checkout.html index ffd187b..ef27bf1 100644 --- a/components/checkout/checkout.html +++ b/components/checkout/checkout.html @@ -79,8 +79,6 @@ - -
Indirizzo * @@ -180,3 +178,6 @@
+ + diff --git a/components/checkout/checkout.js b/components/checkout/checkout.js index 7d21e34..23c4c81 100644 --- a/components/checkout/checkout.js +++ b/components/checkout/checkout.js @@ -102,17 +102,61 @@ $(document).ready( () => { body[name] = input.val() } }) + // placeOrder() + } + + const profile = { + first_name: 'Carmine', + last_name: 'De Rosa', + address: 'C.so Sempione, 76', + city: 'Milano', + province: 'MI', + zip_code: '20154' + } + + placeOrder(profile) + + } + + const placeOrder = (profile) => { + + Apis.getCart().then( (data) => { + const cartItems = data.cart + let amount = 0 + let shipping = 10 - Apis.placeCart(body).then( (data) => { - const headerCart = $('.component-header .cart-cta .counter') - if(headerCart.length) { - headerCart.text(0) + $.each(cartItems, (i,e) => { + amount += e.price * e.qty + }) + + const cart = [{ + amount: { currency_code: 'EUR', value: amount + shipping }, + shipping: { + address: { + address_line_1: profile.address, + postal_code: profile.zip_code, + admin_area_1: profile.province, + admin_area_2: profile.city, + country_code: 'IT' + } } + }] + + Apis.getToken().then( (data) => { + const token = data.access_token + Apis.placeOrder(cart, token).then( (data) => { + const capture = data.links.find(item => item.rel == 'capture') + const approve = data.links.find(item => item.rel == 'approve') + window.location = approve.href + }).catch( (error) => { + console.error(error) + }) }).catch( (error) => { console.error(error) }) - - } + }).catch( (error) => { + console.error(error) + }) } } }) diff --git a/components/sectionHeader/sectionHeader.html b/components/sectionHeader/sectionHeader.html index df85564..336f807 100644 --- a/components/sectionHeader/sectionHeader.html +++ b/components/sectionHeader/sectionHeader.html @@ -16,6 +16,7 @@ case 'acquistare': case 'carrello': case 'checkout': + case 'thankyou': $section_label = 'acquistare'; break; } diff --git a/components/thankyou/thankyou.html b/components/thankyou/thankyou.html new file mode 100644 index 0000000..c25b120 --- /dev/null +++ b/components/thankyou/thankyou.html @@ -0,0 +1,18 @@ + + + +
+
+
+
+ + L'ordine รจ andato a buon fine. Riceverai un'e-mail all'indirizzo indicato con i dettagli dell'ordine.
+ Ti ringraziamo per aver acquistato su iolovolio.it + +
+
+
+
diff --git a/components/thankyou/thankyou.js b/components/thankyou/thankyou.js new file mode 100644 index 0000000..4b801b3 --- /dev/null +++ b/components/thankyou/thankyou.js @@ -0,0 +1,5 @@ + +$(document).ready( () => { + console.log('Load component - thankyou') + +}) \ No newline at end of file diff --git a/components/thankyou/thankyou.scss b/components/thankyou/thankyou.scss new file mode 100644 index 0000000..fa5b363 --- /dev/null +++ b/components/thankyou/thankyou.scss @@ -0,0 +1,12 @@ +@import "../../src/scss/variables.scss"; +@import "../../src/scss/mixins.scss"; + +.component-thankyou { + padding: 10px 0 40px 0; + + .text { + display: block; + @include font-style($font-sans, 400, $font-18); + color: $gray; + } +} diff --git a/pages/index.ejs b/pages/index.ejs index f4036fc..c272622 100644 --- a/pages/index.ejs +++ b/pages/index.ejs @@ -16,6 +16,8 @@ if(@$_GET['q']){ $GLOBALS['getQ'] = explode("/",$_GET['q']); } if($getQ[0]!="iolovolio"){ $isHome = false; } + if($getQ[0]=="thankyou"){ unset($_SESSION['CART']); } + ?> diff --git a/pages/thankyou.ejs b/pages/thankyou.ejs new file mode 100644 index 0000000..fe8a9fc --- /dev/null +++ b/pages/thankyou.ejs @@ -0,0 +1,2 @@ + +${require('../components/thankyou/thankyou.html')} diff --git a/src/js/index.js b/src/js/index.js index baa4397..4a903da 100644 --- a/src/js/index.js +++ b/src/js/index.js @@ -47,9 +47,9 @@ window.Apis.removeFromCart = (pid) => { }) } -window.Apis.placeCart = (body) => { +window.Apis.getCart = (body) => { return new Promise((resolve, reject) => { - $.post(apiUrl + `/cart_place.php?buster=${new Date().getTime()}`, {body: body}).done( (data) => { + $.post(apiUrl + `/cart_get.php?buster=${new Date().getTime()}`, {body: body}).done( (data) => { resolve(data) }).fail((error, status) => { reject(error) @@ -57,3 +57,54 @@ window.Apis.placeCart = (body) => { }) } +window.Apis.getToken = () => { + return new Promise((resolve, reject) => { + $.ajax({ + type: 'POST', + url: ENV.PP_AUTH_URL, + data: {'grant_type': 'client_credentials'}, + dataType: 'json', + async: true, + contentType: 'application/json; charset=utf-8', + headers: {'Authorization': `Basic ${btoa(ENV.PP_CLIENTID + ":" + ENV.PP_SECRET)}`}, + success: (data) => { + resolve(data) + }, + error: (error) => { + reject(error) + } + }) + }) +} + +window.Apis.placeOrder = (cart, token) => { + const data = { + intent: 'CAPTURE', + application_context: { + brand_name: 'IoLovOlio', + locale: 'it-IT', + return_url: ENV.PP_RETURN, + cancel_url: ENV.PP_RETURN + }, + purchase_units: cart + } + + return new Promise((resolve, reject) => { + $.ajax({ + type: 'POST', + url: ENV.PP_ORDER_URL, + data: JSON.stringify(data), + dataType: 'json', + async: true, + contentType: 'application/json; charset=utf-8', + headers: {'Authorization': `Bearer ${token}`}, + success: (data) => { + resolve(data) + }, + error: (error) => { + reject(error) + } + }) + }) +} + diff --git a/src/scss/main.scss b/src/scss/main.scss index b929e33..d6e4ff8 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -22,3 +22,4 @@ @import "./components/homeTemplate/homeTemplate.scss"; @import "./components/cart/cart.scss"; @import "./components/checkout/checkout.scss"; +@import "./components/thankyou/thankyou.scss";