251 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			HTML
		
	
	
		
			Executable File
		
	
	
			
		
		
	
	
			251 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			HTML
		
	
	
		
			Executable File
		
	
	
| {% extends "mnfapp/base.html" %} {% load static %} {% block content %}
 | |
| <html>
 | |
| <head>
 | |
|     <meta charset="UTF-8" />
 | |
|     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 | |
|     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 | |
|     <title>Checkout</title>
 | |
|     <link rel="preconnect" href="https://fonts.gstatic.com" />
 | |
|     <link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400&display=swap" rel="stylesheet" />
 | |
|     <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400&display=swap" rel="stylesheet" />
 | |
| 
 | |
|     <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> -->
 | |
|     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
 | |
|     <!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> -->
 | |
|     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous" />
 | |
| 
 | |
|     <!-- font awesome -->
 | |
|     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous" />
 | |
| 
 | |
|     <!-- MDB -->
 | |
|     <link href="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/3.6.0/mdb.min.css" rel="stylesheet" />
 | |
| 
 | |
|     <style>
 | |
|         body {}
 | |
|         .checkout-container {
 | |
|             grid-template-columns: 100%;
 | |
|         }
 | |
|         
 | |
|         .m-div {
 | |
|             font-family:  Helvetica, "sans-serif";
 | |
|         }
 | |
|         
 | |
|         .checkout-content {
 | |
|             padding: 10px;
 | |
|             width: 70%;
 | |
|             height: auto;
 | |
|             border: solid black 1px;
 | |
|             background-color: rgb(233, 234, 243);
 | |
|             border-radius: 10px;
 | |
|             justify-content: center;
 | |
|         }
 | |
|         
 | |
|         .navs {
 | |
|             background-color: rgb(67, 72, 158);
 | |
|             color: #fff;
 | |
|             width: 100%;
 | |
|             text-align: center;
 | |
|         }
 | |
|         
 | |
|         .s-btn {
 | |
|             width: 200px;
 | |
|             height: 45px;
 | |
|             background-color: rgb(92, 95, 163);
 | |
|             color: #fff;
 | |
|             padding: 0.3em;
 | |
|             border: solid rgb(92, 95, 163) 1px;
 | |
|             border-radius: 20px;
 | |
|         }
 | |
|         
 | |
|         .s-btn:hover {
 | |
|             background-color: rgb(67, 72, 158);
 | |
|             color: white;
 | |
|         }
 | |
|         
 | |
|         .batn {
 | |
|             width: 50%;
 | |
|             height: 50px;
 | |
|             background-color: rgb(92, 95, 163);
 | |
|             color: #fff;
 | |
|             border: solid rgb(92, 95, 163) 1px;
 | |
|             border-radius: 20px;
 | |
|             font-size: 28px;
 | |
|             text-align: center;
 | |
|         }
 | |
|         
 | |
|         .batn:hover {
 | |
|             background-color: rgb(67, 72, 158);
 | |
|             color: white;
 | |
|         }
 | |
|         
 | |
|         .headerrr {
 | |
|             color: blue;
 | |
|             height: auto;
 | |
|             background-color: transparent;
 | |
|             border: 0;
 | |
|             text-decoration: none;
 | |
|         }
 | |
|         
 | |
|         .btnnn {
 | |
|             color: #ee3c4d;
 | |
|             cursor: pointer;
 | |
|         }
 | |
|         
 | |
|         .headerrr {
 | |
|             background-color: rgb(67, 72, 158);
 | |
|             width: 100%;
 | |
|             height: auto;
 | |
|             border-radius: 5px;
 | |
|             margin: 1px;
 | |
|         }
 | |
|         
 | |
|         #codee {
 | |
|             width: 215px;
 | |
|             height: 45px;
 | |
|             border-radius: 5px;
 | |
|             padding-left: 5px;
 | |
|             font-size: 16px;
 | |
|         }
 | |
|     </style>
 | |
|     
 | |
| 
 | |
| <body>
 | |
|     <div class="m-div">
 | |
|         <div class="container-fluid">
 | |
|             <div class="text-center">
 | |
|                 <h1 class="navs">
 | |
|                     Pricing Calculator
 | |
|                 </h1>
 | |
|             </div>
 | |
| 
 | |
|             <!-- <a class="btnnn" onclick="window.history.back();">
 | |
|             Back To Payment
 | |
|             </a> -->
 | |
|             <br />
 | |
|             <br>
 | |
| 
 | |
|             <div class="text-center">
 | |
| 
 | |
|                 <div class="checkout-container" style="display: flex; justify-content: CENTER">
 | |
|                     <div class="checkout-content">
 | |
| 
 | |
|                         <h2 class="font-weight-bold headerrr" style="color: white; text-align: center;">
 | |
|                             Order Summary
 | |
|                         </h2>
 | |
| 
 | |
| 
 | |
| 
 | |
|                         <div style="padding-left: 0.3em">
 | |
|                             <div class="row">
 | |
|                                 <div class="col-sm-6">
 | |
|                                     <h5 style="text-align: left; padding-top: 10px">
 | |
|                                         Amount
 | |
|                                     </h5> 
 | |
|                                     {% if isDiscount %}
 | |
|                                     <h5 style="text-align: left; padding-top: 10px">
 | |
|                                         Discount Amount
 | |
|                                     </h5> 
 | |
|                                     <h5 style="text-align: left; padding-top: 10px">
 | |
|                                         Final Amount
 | |
|                                     </h5>
 | |
|                                     {% endif %} 
 | |
|                                     {% if service %}
 | |
|                                     <h5 style="text-align: left; padding-top: 5px">
 | |
|                                         {{service}}
 | |
|                                     {%endif%}
 | |
|                                                                           
 | |
|                                 </div>
 | |
| 
 | |
| 
 | |
|                                 <div class="col-sm-6">
 | |
|                                     <h5 class="" style="padding-top: 10px">
 | |
|                                         $ {{amount}} USD = ₹ {{amtINR}} INR
 | |
|                                     </h5>
 | |
|                                     {% if isDiscount %}
 | |
|                                     <h5 class="" style="padding-top: 10px">
 | |
|                                         $ {{totalDiscount}} USD = ₹ {{totalDiscountINR}} INR
 | |
|                                     </h5>
 | |
|                                     <h5 class="" style="padding-top: 10px">
 | |
|                                         $ {{finalAmount}} USD = ₹ {{finalAmountINR}} INR
 | |
|                                     </h5>
 | |
|                                     {% endif %}
 | |
|                                 </div>
 | |
|                                 
 | |
|                                 <div class="col-sm-12">
 | |
|                                     <hr>
 | |
|                                 </div>
 | |
|                                 {% if message %}
 | |
|                                 {% for msg in message %}
 | |
|                                 <h6 style="color:red;text-align: left; padding-top: 10px;">
 | |
|                                     {{msg}}
 | |
|                                 </h6> 
 | |
|                                 {% endfor %}
 | |
|                                 
 | |
|                                 <div class="col-sm-12">
 | |
|                                     <hr>
 | |
|                                 </div>
 | |
|                                 {% endif %}
 | |
| 
 | |
|                                 <div class="col-sm-6" style="text-align: left; ">
 | |
|                                     <h5 for="" style="padding-top: 10px; font-size:14px;">
 | |
|                                         Have a promo code? Enter Here
 | |
|                                     </h5>
 | |
|                                     <form action="{% url 'promo'%}" onsubmit="return false;" method="post">
 | |
|                                        
 | |
|                                         {%csrf_token%}
 | |
|                                         <input type="hidden" name="subPlan" value="{{subPlan}}" />
 | |
|                                         <input type="hidden" name="pid" id="pid" value="{{pid}}" />
 | |
|                                         <input type="hidden" name="amount" value="{{amount}}" />
 | |
|                                         <input type="hidden" name="amtINR" id="pid" value="{{amtINR}}" />
 | |
| 
 | |
|                                         <input type="hidden" name="desc" id="pid" value="{{desc}}" /> {%if green%} {%else%}
 | |
|                                         <input type="text" name="code" id="codee" style="" placeholder="Promo Code" required />
 | |
|                                 </div>
 | |
| 
 | |
|                                 <div class="col-sm-6" style="padding-top:10px;">
 | |
|                                     <span><br></span>
 | |
|                                     <button class="s-btn font-weight-bold" style=" font-size: 15px; ">
 | |
|                                     <!--<button onclick="alert('Promo code invalid');"  class="s-btn font-weight-bold" style=" font-size: 15px; "> -->
 | |
|                                     Apply
 | |
|                                     </button>
 | |
|                                 </div>
 | |
| 
 | |
|                                 {%endif%}
 | |
|                                 </form>
 | |
|                                
 | |
|                               
 | |
|                             </div>
 | |
|                         </div>
 | |
|                         <br />
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </div>
 | |
|             <form action="{% url 'card_razorpay'%}" method="post" id='payment-form'>
 | |
|                 {%csrf_token%}
 | |
|                 <input type="hidden" name="payment_intent_id" value='{{pid}}'> {% if desc %}
 | |
|                 <input type="hidden" name="type" value='subscription'>
 | |
|                 <input type="hidden" name="giftId" value=''> {%endif%} {% if giftId %}
 | |
|                 <input type="hidden" name="type" value='gift'>
 | |
|                 <input type="hidden" name="giftId" value='{{giftId}}'> {%endif%}
 | |
|                 <input type="hidden" name="subPlan" value='{{subPlan}}'>
 | |
|                 <div id="card-element" style="margin-top: 4vh; display: grid; grid-template-columns: auto;">
 | |
| 
 | |
|             </form>
 | |
|             <div class="checkout-container text-center" style="justify-content: center">
 | |
|                 {% if checkurl %}
 | |
|                 <button class="batn " id="submit-button"><a href="{{serviceurl}}" style="color:white">{{serviceurl_name}}</a></button>
 | |
|                 {% else %}
 | |
|                 <button class="batn " id="submit-button"><a href="{% url serviceurl %}" style="color:white">{{serviceurl_name}}</a></button>
 | |
|                 {% endif %}
 | |
|             </div>
 | |
| 
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
| 
 | |
|     <br><br><br><br><br>
 | |
| </body>
 | |
| 
 | |
| </html>
 | |
| {%endblock%}
 |