templates/Doc/States/payment.html.twig line 1

Open in your IDE?
  1. {% extends 'Layouts/Doc/default.html.twig' %}
  3. {% block title %}
  4.     {{ 'app.documentation.menu.architecture.drivers'|trans }}
  5. {% endblock %}
  6. {% block headerPageTitle %}
  7.     {{ 'app.documentation.menu.workflow.payments'|trans|upper }}
  8. {% endblock %}
  10. {% block body %}
  11.     <div class="card mb-12">
  12.         <div class="card-body flex-column p-5">
  13.             <div class="d-flex align-items-center h-lg-100px p-5 p-lg-15">
  14.                 <div class="row">
  15.                     <div class="col-md-12 pt-5 scroll-y">
  16.                         <div class="position-relative w-100 text-gray-800">
  17.                             <p><strong>Payment status: </strong>play a crucial role in the click and collect system, providing insights into the progress and outcome of payment transactions. These statuses help track the journey of a payment, from initiation to completion or cancellation. Understanding these payment statuses is essential for both customers and merchants to ensure a smooth and transparent payment experience. Here are some of the key payment statuses you may encounter:</p>
  18.                         </div>
  19.                     </div>
  20.                 </div>
  21.             </div>
  22.             <div class="d-flex flex-column">
  23.                 <div class="row table-responsive">
  24.                     <div class="col-12 offset-3">
  25.                         {% include 'Doc/Diagram/payment.html.twig' %}
  26.                     </div>
  27.                 </div>
  28.             </div>
  29.             <div class="d-flex align-items-center p-lg-15">
  30.                 <div class="row">
  31.                     <div class="col-md-12 pt-5 scroll-y">
  32.                         {% include 'Doc/States/states_constants_title.html.twig' %}
  33.                         <ul>
  34.                             <li>
  35.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.new} %}
  36.                                 <p>
  37.                                     <ul>
  38.                                         <li>The <strong>new</strong> payment status typically indicates that a payment transaction has been initiated or recorded in the system but is awaiting further processing or verification.</li>
  39.                                         <li>When a customer completes the checkout process and proceeds to payment, the payment information is <strong>captured by the system directly</strong>, otherwise via <strong>notification</strong> from our payment solutions <strong>webhooks</strong>.</li>
  40.                                         <li>At this stage, the payment status is marked as <strong>new</strong>, to signify that the transaction is <strong>awaiting for updated</strong> on the payement.</li>
  41.                                     </ul>
  42.                                 </p>
  43.                             </li>
  44.                             <li>
  45.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.requires_action} %}
  46.                                 <p>
  47.                                     <ul>
  48.                                         <li>When a payment transaction encounters certain conditions or requires additional verification such as <strong>3D Secure</strong>, the payment status may be set as <strong>Requires action</strong>.</li>
  49.                                         <li>This status signifies that there is an <strong>action needed</strong> on the customer end to proceed with the payment process.</li>
  50.                                     </ul>
  51.                                 </p>
  52.                             </li>
  53.                             <li>
  54.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.awaiting_payment} %}
  55.                                 <p>
  56.                                     In case of an offline payment and during the creation of an order payment, the status becomes <strong>awaiting payment</strong> waiting to pay for the order.
  57.                                 </p>
  58.                             </li>
  59.                             <li>
  60.                                 <div id="failed-section">{% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.failed} %}</div>
  61.                                 <p>
  62.                                     <ul>
  63.                                         <li>When a payment transaction <strong>fails</strong>, the payment status is set as <strong>failed</strong> to indicate that the payment could not be completed.</li>
  64.                                         <li>This status is typically triggered by various reasons, such as <strong>insufficient funds</strong>, <strong>invalid payment details</strong>, <strong>declined authorization</strong>, <strong>technical issues</strong>, or <strong>connectivity problems</strong>.</li>
  65.                                     </ul>
  66.                                 </p>
  67.                             </li>
  68.                             <li>
  69.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.processing} %}
  70.                                 <p>
  71.                                     <ul>
  72.                                         <li>When a customer submits the payment information, we usually recieve a <strong>pending</strong> event. In this stage the payment status is initially set as <strong>processing</strong>.</li>
  73.                                         <li>This status indicates that the payment transaction has been received and is <strong>being proccessed</strong> by the payment gateway or processor.</li>
  74.                                     </ul>
  75.                                 </p>
  76.                             </li>
  77.                             <li>
  78.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.partially_paid} %}
  79.                                 <p>
  80.                                     This status indicates that an order is partially paid, and is awaiting full payment.
  81.                                 </p>
  82.                             </li>
  83.                             <li>
  84.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.cancelled} %}
  85.                                 <p>
  86.                                     <ul>
  87.                                         <li>The <strong>cancelled</strong> payment status is assigned when a payment transaction is intentionally <strong>terminated</strong> or <strong>invalidated</strong> before <strong>completion</strong>.</li>
  88.                                         <li>This status signifies that the payment process has been <strong>discontinued</strong>, and the associated funds have not been <strong>transferred</strong> or <strong>captured</strong>.</li>
  89.                                     </ul>
  90.                                 </p>
  91.                             </li>
  92.                             <li>
  93.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.paid} %}
  94.                                 <p>
  95.                                     <ul>
  96.                                         <li>The <strong>paid</strong> payment status is assigned when the payment transaction has been <strong>successfully authorized</strong>, <strong>processed</strong>, and the funds <strong>have been captured</strong>.</li>
  97.                                         <li>It signifies that the payment has been <strong>successfully completed</strong>, and the associated funds have been transferred from the <strong>customer's account</strong> to the <strong>merchant's account</strong>.</li>
  98.                                     </ul>
  99.                                 </p>
  100.                             </li>
  101.                             <li>
  102.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.partially_refunded} %}
  103.                                 <p>
  104.                                     This status indicates that an order is partially refunded.
  105.                                 </p>
  106.                             </li>
  107.                             <li>
  108.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.refunded} %}
  109.                                 <p>
  110.                                     Indicates that the payment was refunded due to order <strong>cancellation</strong> or <strong>rejection</strong>.
  111.                                 </p>
  112.                             </li>
  113.                             <li>
  114.                                 {% include 'Doc/States/states_constants.html.twig' with {'state': paymentConstants.expired} %}
  115.                                 <p>
  116.                                     <ul>
  117.                                         <li>The </strong>expired</strong> payment status is assigned when a payment transaction <strong>has not been completed</strong> within a <strong>predefined timeframe</strong> or has surpassed its <strong>validity period</strong>.</li>
  118.                                         <li>This status signifies that the payment attempt has become <strong>invalid</strong> and cannot be processed further.</li>
  119.                                     </ul>
  120.                                 </p>
  121.                             </li>
  122.                         </ul>
  123.                     </div>
  124.                 </div>
  125.             </div>
  126.         </div>
  127.     </div>
  128. {% endblock %}