templates/coach/account/overview.html.twig line 1

Open in your IDE?
  1. {% extends 'admin/baseAdmin.html.twig' %}
  2. {% block page_title %}Overview Coaches{% endblock %}
  3. {% block breadcump_main %}Coache{% endblock %}
  4. {% block breadcump_subtitle %}Overview{% endblock %}
  5. {% block menu_left_sidebar %}
  6.     {% include 'include/menu/menuCoach.html.twig' with { menu_active_event : '2'} %}
  7. {% endblock %}
  8. {% block stylesheets %}
  9.     <link href="{{ asset('admin/libs/select2/css/select2.min.css') }}" rel="stylesheet" type="text/css">
  10.     <link href="{{ asset('admin/css/tailwind.min.css') }}" rel="stylesheet" type="text/css">
  11.     <link href="{{ asset('admin/css/tailwind2.css') }}" rel="stylesheet" type="text/css">
  13. {% endblock %}
  14. {% block title %}{{"Generale"|trans }}{% endblock %}
  15. {% block content %}
  16.                 <div class="row">
  17.                     <div class="col-xl-4">
  18.                         <div class="card overflow-hidden">
  19.                             <div class="bg-primary bg-soft">
  20.                                 <div class="row">
  21.                                     <div class="col-7">
  22.                                         <div class="text-primary p-3">
  23.                                             <h5 class="text-primary">Content de vous revoir !</h5>
  24.                                             <p>{{ coach.lastname ~ ' ' ~ coach.firstname }}</p>
  25.                                         </div>
  26.                                     </div>
  27.                                     <div class="col-5 align-self-end">
  28.                                         <img src="{{ asset('admin/images/profile-img.png') }}" alt="" class="img-fluid">
  29.                                     </div>
  30.                                 </div>
  31.                             </div>
  32.                             <div class="card-body pt-0">
  33.                                 <div class="row">
  34.                                     <div class="col-sm-4">
  35.                                         <div class="avatar-md profile-user-wid mb-4">
  36.                                             <img src="{{ asset(''~coach.image) }}" alt="" class="img-thumbnail rounded-circle">
  37.                                         </div>
  38.                                         <h5 class="font-size-15 text-truncate">{{ coach.lastname ~ ' ' ~ coach.firstname }}</h5>
  39.                                         <p class="text-muted mb-0 text-truncate">Coach</p>
  40.                                     </div>
  42.                                     <div class="col-sm-8">
  43.                                         <div class="pt-4">
  45.                                             <div class="row">
  46.                                                 <div class="col-6">
  47.                                                     <h5 class="font-size-15">{{ coach.experiences|length }}</h5>
  48.                                                     <p class="text-muted mb-0">Experiences</p>
  49.                                                 </div>
  50.                                                 <div class="col-6">
  51.                                                     <h5 class="font-size-15">{{ coach.bookings|length }}</h5>
  52.                                                     <p class="text-muted mb-0">Reservations</p>
  53.                                                 </div>
  54.                                             </div>
  55.                                             <div class="mt-4">
  56.                                                 <a href="{{ path('coach_profile') }}" class="btn btn-primary waves-effect waves-light btn-sm">View Profile <i class="mdi mdi-arrow-right ms-1"></i></a>
  57.                                             </div>
  58.                                         </div>
  59.                                     </div>
  60.                                 </div>
  61.                             </div>
  62.                         </div>
  63.                         <div class="card">
  64.                             <div class="card-body">
  65.                                 <h4 class="card-title mb-4">Monthly Earning</h4>
  66.                                 <div class="row">
  67.                                     <div class="col-sm-6">
  68.                                         <p class="text-muted">This month</p>
  69.                                         <h3>$34,252</h3>
  70.                                         <p class="text-muted"><span class="text-success me-2"> 12% <i class="mdi mdi-arrow-up"></i> </span> From previous period</p>
  72.                                         <div class="mt-4">
  73.                                             <a href="javascript: void(0);" class="btn btn-primary waves-effect waves-light btn-sm">View More <i class="mdi mdi-arrow-right ms-1"></i></a>
  74.                                         </div>
  75.                                     </div>
  76.                                     <div class="col-sm-6">
  77.                                         <div class="mt-4 mt-sm-0">
  78.                                             <div id="radialBar-chart" class="apex-charts"></div>
  79.                                         </div>
  80.                                     </div>
  81.                                 </div>
  82.                                 <p class="text-muted mb-0">We craft digital, graphic and dimensional thinking.</p>
  83.                             </div>
  84.                         </div>
  85.                     </div>
  88.                     <div class="col-xl-4">
  89.                         <div class="card">
  90.                             <div class="card-body">
  91.                                 <h4 class="card-title mb-5">Experiences</h4>
  92.                                 <ul class="verti-timeline list-unstyled">
  94.                                     {% for experience in coach.experiences %}
  95.                                     <li class="event-list active">
  96.                                         <div class="event-timeline-dot">
  97.                                             <i class="bx bxs-right-arrow-circle font-size-18 bx-fade-right"></i>
  98.                                         </div>
  99.                                         <div class="d-flex">
  100.                                             <div class="flex-shrink-0 me-3">
  101.                                                 <h5 class="font-size-14">{{ experience.title }} <i class="bx bx-right-arrow-alt font-size-16 text-primary align-middle ms-2"></i></h5>
  102.                                             </div>
  103.                                             <div class="flex-grow-1">
  104.                                                 <div>
  105.                                                     {{ experience.description|slice(0, 10) ~ '...' }}
  106.                                                 </div>
  107.                                             </div>
  108.                                         </div>
  109.                                     </li>
  110.                                     {% endfor %}
  112.                                 </ul>
  113.                                 <div class="text-center mt-4"><a href="{{ path('coach_experiences_list') }}" class="btn btn-primary waves-effect waves-light btn-sm">View More <i class="mdi mdi-arrow-right ms-1"></i></a></div>
  114.                             </div>
  115.                         </div>
  116.                     </div>
  119.                     <div class="col-xl-4">
  120.                         <div class="card">
  121.                             <div class="card-body">
  122.                                 <h4 class="card-title mb-4">Social Source</h4>
  123.                                 <div class="text-center">
  124.                                     <h5 class="card-title mb-1">Share your profile</h5>
  125.                                     <p class="text-muted small mb-4">
  126.                                         Now that your agency is created, go ahead and share it to start generating leads.
  127.                                     </p>
  128.                                     <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https://larkon-mileage.com"
  129.                                          alt="QR Code"
  130.                                          class="img-fluid mb-4 mx-auto"
  131.                                          style="max-width: 150px;" />
  132.                                 </div>
  133.                                 <div class="row mt-4">
  134.                                     <div class="col-4">
  135.                                         <div class="social-source text-center mt-3">
  136.                                             <div class="avatar-xs mx-auto mb-3">
  137.                                                         <span class="avatar-title rounded-circle bg-primary font-size-16">
  138.                                                                 <i class="mdi mdi-facebook text-white"></i>
  139.                                                             </span>
  140.                                             </div>
  141.                                             <h5 class="font-size-15">Facebook</h5>
  142.                                             <p class="text-muted mb-0">125 sales</p>
  143.                                         </div>
  144.                                     </div>
  145.                                     <div class="col-4">
  146.                                         <div class="social-source text-center mt-3">
  147.                                             <div class="avatar-xs mx-auto mb-3">
  148.                                                         <span class="avatar-title rounded-circle bg-info font-size-16">
  149.                                                                 <i class="mdi mdi-twitter text-white"></i>
  150.                                                             </span>
  151.                                             </div>
  152.                                             <h5 class="font-size-15">Twitter</h5>
  153.                                             <p class="text-muted mb-0">112 sales</p>
  154.                                         </div>
  155.                                     </div>
  156.                                     <div class="col-4">
  157.                                         <div class="social-source text-center mt-3">
  158.                                             <div class="avatar-xs mx-auto mb-3">
  159.                                                         <span class="avatar-title rounded-circle bg-pink font-size-16">
  160.                                                                 <i class="mdi mdi-instagram text-white"></i>
  161.                                                             </span>
  162.                                             </div>
  163.                                             <h5 class="font-size-15">Instagram</h5>
  164.                                             <p class="text-muted mb-0">104 sales</p>
  165.                                         </div>
  166.                                     </div>
  167.                                 </div>
  169.                             </div>
  170.                         </div>
  171.                     </div>
  173.                 </div>
  174.                 <!-- end row -->
  177.                 <div class="row">
  178.                     <div class="col-lg-12">
  179.                         <div class="card">
  180.                             <div class="card-body">
  181.                                 <h4 class="card-title mb-4">Mes Reservations</h4>
  182.                                 <div class="table-responsive">
  183.                                     <table class="table align-middle table-nowrap mb-0">
  184.                                         <thead class="table-light">
  185.                                         <tr>
  186.                                             <th style="width: 20px;">
  187.                                                 <div class="form-check font-size-16 align-middle">
  188.                                                     <input class="form-check-input" type="checkbox" id="transactionCheck01">
  189.                                                     <label class="form-check-label" for="transactionCheck01"></label>
  190.                                                 </div>
  191.                                             </th>
  192.                                             <th class="align-middle">Reservation ID</th>
  193.                                             <th class="align-middle">Experience ID</th>
  194.                                             <th class="align-middle">Customer ID</th>
  195.                                             <th class="align-middle">Reference</th>
  196.                                             <th class="align-middle">Total</th>
  197.                                             <th class="align-middle">Duration</th>
  198.                                             <th class="align-middle">Date start</th>
  199.                                         </tr>
  200.                                         </thead>
  201.                                         <tbody>
  202.                                         {% for booking in coach.bookings %}
  203.                                         <tr>
  204.                                             <td>
  205.                                                 <div class="form-check font-size-16">
  206.                                                     <input class="form-check-input" type="checkbox" id="transactionCheck07">
  207.                                                     <label class="form-check-label" for="transactionCheck07"></label>
  208.                                                 </div>
  209.                                             </td>
  210.                                             <td><a href="javascript: void(0);" class="text-body fw-bold">#SK2545</a> </td>
  211.                                             <td>{{ booking.id }}</td>
  212.                                             <td>
  213.                                                 {{ booking.experience.title }}
  214.                                             </td>
  215.                                             <td>
  216.                                                 {{ booking.customer.lastname ~ ' ' ~ booking.customer.firstname }}
  217.                                             </td>
  218.                                             <td>
  219.                                                 {{ booking.reference }}
  220.                                             </td>
  221.                                             <td>
  222.                                                 {{ booking.total ~ ' ' ~ booking.currency }}
  223.                                             </td>
  224.                                             <td>
  225.                                                 <i class="fab fa-cc-paypal me-1"></i> {{ booking.paymentType }}
  226.                                             </td>
  227.                                             <td>
  228.                                                 <!-- Button trigger modal -->
  229.                                                 <button type="button" class="btn btn-primary btn-sm btn-rounded waves-effect waves-light" data-bs-toggle="modal" data-bs-target=".transaction-detailModal">
  230.                                                     View Details
  231.                                                 </button>
  232.                                             </td>
  233.                                         </tr>
  234.                                         {% endfor %}
  235.                                         </tbody>
  236.                                     </table>
  237.                                 </div>
  238.                                 <!-- end table-responsive -->
  239.                             </div>
  240.                         </div>
  241.                     </div>
  242.                 </div>
  245.         <footer class="footer">
  246.             <div class="container-fluid">
  247.                 <div class="row">
  248.                     <div class="col-sm-6">
  249.                         <script>document.write(new Date().getFullYear())</script> © Skote.
  250.                     </div>
  251.                     <div class="col-sm-6">
  252.                         <div class="text-sm-end d-none d-sm-block">
  253.                             Design & Develop by Themesbrand
  254.                         </div>
  255.                     </div>
  256.                 </div>
  257.             </div>
  258.         </footer>
  259.     <!-- end main content-->
  261. {% endblock %}
  262. {% block javascripts %}
  264.     <script src="{{ asset('admin/js/app.js')}}"></script>
  266. {% endblock %}