templates/order/partials/tk_profil.html.twig line 1

Open in your IDE?
  1. <div class="row">
  2.     <div class="col-lg-6 offset-lg-3" ng-controller="TkProfileController">
  3.         <div class="select__offer px-3 py-3 mb-4" ng-if="currentStep === 'igSelectProfile'">
  4.             <h2 class="text-center">Get Started</h2>
  5.             <form name="orderSelect" ng-submit="goToCheckout(true)" id="enter-profile-anshore">
  6.                 <div class="mb-3 mt-3">
  7.                     <label for="username" class="form-label">Enter username</label>
  8.                     <div class="package-container">
  9.                         <input type="text" class="form-control ps-5" id="username" placeholder="TikTok username" ng-model="profile.username" ng-class="{'is-invalid': validation.username.length > 0}">
  10.                         <i class="fab fa-{{ current_service.SocialNetwork | lower }}"></i>
  11.                         <p *ng-if="validation.username.length > 0" class="text-danger">
  12.                             [{validation.username[0]}]
  13.                         </p>
  14.                     </div>
  15.                 </div>
  16.                 <div class="mb-3">
  17.                     <label for="package" class="form-label">Select package</label>
  18.                     <div class="package-container">
  19.                         <select class="form-control ps-5" id="package" ng-model="order.IDService" ng-change="onOfferChange()">
  20.                             <option ng-repeat="item in current_sub_service.offers" ng-value="item.IDService">[{(item.Offer + ' - ' + item.Quantity + ' ' + current_sub_service.Text)}]</option>
  21.                         </select>
  22.                         <i class="{{ icons[current_sub_service.Text] }}"></i>
  23.                     </div>
  24.                 </div>
  25.                 <button type="submit" class="btn btn-primary btn-lg d-block w-100" ng-disabled="loading" ng-class="{'loading': loading}">
  26.                     <span ng-show="loading">Please wait [{countdown | number:2}]</span>
  27.                     <span ng-show="!loading">Continue</span>
  28.                 </button>
  29.             </form>
  30.         </div>
  31.         <div ng-if="currentStep === 'igCheckout'">
  32.             <div class="select__offer px-3 py-3 mb-3" id="checkout-anshore">
  33.                 <div class="d-flex" style="justify-content: space-between;">
  34.                     <h3 class"mb-0">Order summary</h3>
  35.                 </div>
  36.                 <hr />
  37.                 <div class="d-flex gap-3">
  38.                     <div class="img-profile-container">
  39.                         <div class="img-profile-preview" style="background-image: url([{profile.profile_pic_url}]); background-size: cover;"></div>
  40.                     </div>
  41.                     <div class="summary">
  42.                         <p class="username mb-2">
  43.                             [{profile.username}] 
  44.                             <span class="float-end" style="font-size: 12px;color: var(--bs-indigo);text-decoration: underline; cursor: pointer"  ng-click="goToSelectProfile()">Change</span>
  45.                         </p>
  46.                         <p class="package mb-0 d-flex">
  47.                             <span style="flex: 1;text-align: start;line-height: 18px;font-size: 13px;">Followers<br /><b>[{profile.follower_count | megaNumber}]</b></span>
  48.                             <span style="flex: 1;text-align: center;line-height: 18px;font-size: 13px;">Following<br /><b>[{profile.following_count | megaNumber}]</b></span>
  49.                             <span style="flex: 1;text-align: end;line-height: 18px;font-size: 13px;">Medias<br /><b>[{profile.media_count | megaNumber}]</b></span>
  50.                         </p>
  51.                     </div>
  52.                 </div>
  53.                 <hr />
  54.                 <div class="d-flex d-row gap-3 mt-4 align-items-center">
  55.                     <span><i class="{{ icons[current_sub_service.Text] }}"></i></span>
  56.                     <span style="flex: auto;font-size: 16px;font-weight: bold;line-height: 18px;">
  57.                         [{current_offer.Quantity}] [{current_sub_service.Text}]
  58.                         <br />
  59.                         <em style="font-size: 13px;font-weight: normal;">[{current_offer.Quantity}] [{current_sub_service.Text}] / 1 profile</em>
  60.                     </span>
  61.                     <span style="font-size: 20px;font-weight: bold;">
  62.                         <sub style="bottom: -2px;margin-right: 5px;color: red;" class="text-decoration-line-through">
  63.                             [{truncateToTwoDecimals(current_offer.Price * (1 + (current_offer.Discount / 100)))}]
  64.                         </sub> 
  65.                         {{get_currency()}}[{current_offer.Price}]
  66.                     </span>
  67.                 </div>
  68.                 <div class="d-block w-100 mt-3">
  69.                     <p class="bg-primary text-white px-2 rounded">[{ order.links[0] }]</p>
  70.                 </div>
  71.                 <hr />
  72.                 {# <div class="input-group mb-3">
  73.                     <input type="text" class="form-control" placeholder="Enter coupon code" aria-describedby="basic-addon2">
  74.                     <span class="input-group-text" id="basic-addon2">Apply</span>
  75.                 </div> #}
  76.                 <div class="d-flex" style="justify-content: space-between;">
  77.                     <h3 class"mb-0">Total to pay</h3>
  78.                     <b class="h3 mb-0">{{get_currency()}}[{current_offer.Price}]</b>
  79.                 </div>
  80.             </div>
  81.             <div class="select__offer px-3 py-3 mb-3">
  82.                 <h2 class="text-center">Checkout</h2>
  83.                 <div class="mb-3">
  84.                     <label for="email" class="form-label">Enter your e-mail to receive the confirmation order</label>
  85.                     <input type="text" class="form-control" id="email" placeholder="Enter your email" required ng-model="order.email" ng-class="{'is-invalid': validation.email.length > 0}">
  86.                     <p *ng-if="validation.email.length > 0" class="text-danger">
  87.                         [{validation.email[0]}]
  88.                     </p>
  89.                 </div>
  90.                 {# <div class="form-check mb-3">
  91.                     <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
  92.                     <label class="form-check-label" for="flexCheckDefault">
  93.                         Send me special promotions and discounts
  94.                     </label>
  95.                 </div> #}
  96.                 <div class="mb-3">
  97.                     {# <button class="btn btn-lg btn-primary d-block w-100" ng-click="proceedToCheckout()">Pay {{get_currency()}}[{current_offer.Price}]</button> #}
  98.                     <button class="btn btn-primary btn-lg d-block w-100" ng-click="proceedToCheckout()" ng-disabled="submitting" ng-class="{'loading': submitting}">
  99.                         <span ng-show="submitting">Please wait while submitting your order</span>
  100.                         <span ng-show="!submitting">Pay {{get_currency()}}[{current_offer.Price}]</span>
  101.                     </button>
  102.                 </div>
  103.                 <div class="text-center">
  104.                     <p>
  105.                         By completing your order, you agree to the <a href="/terms/terms" target="_blank">terms of services</a> 
  106.                         and <a href="/terms/privacy" target="_blank">privacy policy</a>.
  107.                     </p>
  108.                             
  109.                     <p>
  110.                         <strong>All pricing is in {{get_currency()}}.</strong> If paying with a different currency, the billed amount is 
  111.                         subject to exchange rates and additional fees.
  112.                     </p>
  113.                 </div>
  114.             </div>
  115.         </div>
  116.     </div>
  117. </div>