Skip to content

Commit

Permalink
feat: add kyc validation to recipient dashboard
Browse files Browse the repository at this point in the history
  • Loading branch information
RafaMelazzo committed May 6, 2024
1 parent aaf6153 commit b78b861
Show file tree
Hide file tree
Showing 8 changed files with 224 additions and 2 deletions.
64 changes: 64 additions & 0 deletions Block/Customer/Marketplace/Kyc.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
<?php
/**
* @author Open Source Team
* @copyright 2024 Pagar.me (https://pagar.me)
* @license https://pagar.me Copyright
*
* @link https://pagar.me
*/
declare(strict_types=1);

namespace Pagarme\Pagarme\Block\Customer\Marketplace;

use Magento\Customer\Model\Session;
use Magento\Framework\View\Element\Template;
use Magento\Framework\View\Element\Template\Context;
use Pagarme\Pagarme\Model\ResourceModel\Recipients\CollectionFactory;

class Kyc extends Template
{
/**
* @var Session
*/
protected $customerSession;

/**
* @var CollectionFactory
*/
protected $collectionFactory;

/**
* @param Context $context
* @param Session $customerSession
* @param CollectionFactory $collectionFactory
* @param array $data
*/
public function __construct(
Template\Context $context,
Session $customerSession,
CollectionFactory $collectionFactory,
array $data = [])
{
$this->customerSession = $customerSession;
$this->collectionFactory = $collectionFactory;
parent::__construct($context, $data);
}

public function getRecipient()
{
return $this->collectionFactory->create()->addFieldToFilter(
'external_id',
['eq' => $this->getCustomerId()]
)->getFirstItem();
}

/**
* Get customerid
*
* @return int
*/
public function getCustomerId()
{
return $this->customerSession->getCustomerId();
}
}
2 changes: 1 addition & 1 deletion Model/Api/Recipient.php
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,7 @@ public function createKycLink(string $id)
$kycLink = $this->recipientService->createKycLink($recipientModel->getPagarmeId());
$kycResponse = $this->kycLinkResponseFactory->create();
$kycResponse->setUrl($kycLink->url)
->setQrCode($kycLink->base64_qrcode);
->setQrCode('data:image/svg+xml;base64,' . $kycLink->base64_qrcode);
return $kycResponse;
}
}
5 changes: 5 additions & 0 deletions i18n/pt_BR.csv
Original file line number Diff line number Diff line change
Expand Up @@ -423,6 +423,7 @@
"Responsibility for chargebacks","Responsabilidade pelos chargebacks"
"Responsibility for receiving split remainder","Responsabilidade pelo recebimento do restante da divisão"
"Responsibility for receiving extras and discounts","Responsabilidade pelo recebimento de extras e descontos"
"Pagar.me Recipient","Recebedor Pagar.me"
"Marketplace main recipient","Recebedor Principal do Marketplace"
"<p>Pagar.me recipient id that represents your marketplace</p>","<p>ID do recebedor Pagar.me que representa seu marketplace</p>"
"View","Visualizar"
Expand All @@ -436,6 +437,10 @@
"Status updated!","Status atualizado!"
"<p>He can now sell, but remember to check his <b>status</b>. He can only withdraw his sales amounts once the status is <i>“active”</i></p>","<p>Ele já consegue vender, mas lembre-se de verificar o <b>status</b>. Ele só poderá sacar os valores de suas vendas quando o status estiver <i>“ativo”</i>.</p>"
"<p>He can now sell, but it is necessary to complete the security validation so that he can withdraw the sales amounts in the future.</p><p><span class='pagarme-alert-text'>Attention!</span> Keep up with the <b>status</b>. Once this is <i>“validation requested”</i>, a link will be made available for the seller to complete the process.</p>","<p>Ele já consegue vender, mas é necessário completar a validação de segurança para que ele consiga sacar os valores de venda no futuro.</p><p><span class='pagarme-alert-text'>Atenção!</span> Acompanhe o <b>status</b>. Assim que este for <i>“validação solicitada”</i>, um link será disponibilizado para que o vendedor faça o processo.</p>"
"You can now sell, but you must successfully complete our <b>security validation</b> to release your sales amounts.","Você já pode vender, mas é necessário completar nossa <b>validação de segurança</b> com sucesso para liberação dos valores de suas vendas."
"Start validation","Iniciar validação"
"Point the smartphone camera to read the QRCode.","Aponte a câmera do celular para ler o QRCode."
"Or use this %slink%s.","Ou utilize este %slink%s."
"An error occurred while saving the recipient.","Ocorreu um erro ao salvar o recebedor."
"Bank account holder name must be lower than 30 characters.","O nome do titular da conta bancária deve ter menos de 30 caracteres."
"Recipient not active.","Recebedor não está ativo."
Expand Down
20 changes: 20 additions & 0 deletions view/frontend/layout/marketplace_account_dashboard.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<?xml version="1.0"?>
<!--
/**
* @author Open Source Team
* @copyright 2024 Pagar.me (https://pagar.me)
* @license https://pagar.me Copyright
*
* @link https://pagar.me
*/
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="Pagarme_Pagarme/css/pagarme_kyc.css" />
</head>
<body>
<referenceContainer name="content">
<block class="Pagarme\Pagarme\Block\Customer\Marketplace\Kyc" name="pagarme_marketplace_kyc" template="customer/marketplace/kyc.phtml" before="marketplace_account_dashboard" cacheable="false"/>
</referenceContainer>
</body>
</page>
3 changes: 2 additions & 1 deletion view/frontend/requirejs-config.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ var config = {
},
map: {
'*': {
pixCheckoutSuccess: 'Pagarme_Pagarme/js/view/payment/checkout/success/pix'
pixCheckoutSuccess: 'Pagarme_Pagarme/js/view/payment/checkout/success/pix',
kyc: 'Pagarme_Pagarme/js/view/marketplace/kyc'
}
}
};
51 changes: 51 additions & 0 deletions view/frontend/templates/customer/marketplace/kyc.phtml
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
<?php
/**
* @var $block Kyc
*/

use Pagarme\Pagarme\Block\Customer\Marketplace\Kyc;

$recipientId = $block->getRecipient()->getId();

if (empty($recipientId)) {
return;
}

?>

<div class="wk-mp-design">
<div class="mp-widgets pagarme-kyc">
<div class="container">
<div class="pagarme-kyc-box">
<div class="pagarme-kyc-box-title">
<div class="p-5"><?= __('Pagar.me Recipient') ?></div>
</div>
<div class="pagarme-kyc-box-content">
<div class="p-5">
<p><?= __('You can now sell, but you must successfully complete our <b>security '
. 'validation</b> to release your sales amounts.') ?></p>
<button class="button" id="pagarme-kyc-start-validation">
<span><?= __('Start validation') ?></span>
</button>
</div>
</div>
</div>
</div>
</div>
</div>

<div id="modal-content">
<div class="modal-inner-content pagarme-kyc-modal">
<p><?= __('Point the smartphone camera to read the QRCode.') ?></p>
<p><img src="" alt="QRCode" id="pagarme-kyc-qrcode" /></p>
<p><?= sprintf(__('Or use this %slink%s.'), '<a id="pagarme-kyc-link" target="_blank" rel="noreferrer">', '</a>') ?></p>
</div>
</div>

<script type="text/x-magento-init">
{
"#pagarme-kyc-start-validation": {
"kyc": {"id": "<?= $recipientId ?>"}
}
}
</script>
37 changes: 37 additions & 0 deletions view/frontend/web/css/pagarme_kyc.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
.wk-mp-design .mp-widgets.pagarme-kyc {
width: 100%;
}

.pagarme-kyc .container {
padding-bottom: 15px;
}

.pagarme-kyc-box {
border:1px solid #ccc;
}

.pagarme-kyc-box-title {
border-bottom: 1px solid #ccc;
display: inline-block;
width: 100%;
}

.pagarme-kyc-box-content {
padding:5px;
}

.pagarme-kyc-box-content > div {
display: flex;
flex-direction: column;
align-items: center;
}

.pagarme-kyc-box-content > div button {
margin: 2.5rem;
}

.pagarme-kyc-modal {
display: none;
padding-top: 3rem;
text-align: center;
}
44 changes: 44 additions & 0 deletions view/frontend/web/js/view/marketplace/kyc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
define([
'Magento_Ui/js/modal/modal',
"mage/url",
'jquery',
'mage/translate',
'loader'
], function (modal, mageUrl, $) {
return function (config) {

$('#pagarme-kyc-start-validation').on('click', async function (){
const body = $('body');
try {
body.loader('show');
const url = mageUrl.build(`rest/V1/pagarme/marketplace/recipient/kyc/link/${config.id}`);
const response = await $.get(mageUrl.build(url));
body.loader('hide');
if (response) {
$('#pagarme-kyc-qrcode').attr('src', response.qr_code);
$('#pagarme-kyc-link').attr('href', response.url);
$('.pagarme-kyc-modal').show();

const options = {
responsive: true,
innerScroll: true,
// @todo: Using portuguese title for the translation did't work.
title: $.mage.__('Iniciar validação'),
buttons: [{
text: $.mage.__('Close'),
click: function () {
this.closeModal();
}
}]
};

const popup = modal(options, $('#modal-content'));
$('#modal-content').modal('openModal');
}
} catch (exception) {
body.loader('hide');
// this.mageAlert(exception?.responseJSON?.message, $.mage.__('Error!'));
}
});
};
});

0 comments on commit b78b861

Please sign in to comment.