@extends('backend.layouts.app')

@section('content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <ol class="breadcrumb">
        <li><a href="#"><svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
          <g clip-path="url(#clip0_664_24080)">
          <path d="M7.5 13.5L10.5 13.5" stroke="#007AFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
          <path d="M1.76354 9.91009C1.49878 8.18718 1.3664 7.32573 1.69212 6.56203C2.01785 5.79834 2.74052 5.27582 4.18585 4.2308L5.26574 3.45C7.06372 2.15 7.96271 1.5 9 1.5C10.0373 1.5 10.9363 2.15 12.7343 3.45L13.8141 4.2308C15.2595 5.27582 15.9821 5.79834 16.3079 6.56203C16.6336 7.32573 16.5012 8.18718 16.2365 9.91009L16.0107 11.3793C15.6353 13.8217 15.4477 15.0429 14.5717 15.7714C13.6958 16.5 12.4152 16.5 9.85411 16.5H8.14589C5.58475 16.5 4.30418 16.5 3.42825 15.7714C2.55232 15.0429 2.36465 13.8217 1.98932 11.3793L1.76354 9.91009Z" stroke="#007AFF" stroke-width="1.5" stroke-linejoin="round"/>
          </g>
          <defs>
          <clipPath id="clip0_664_24080">
          <rect width="18" height="18" fill="white"/>
          </clipPath>
          </defs>
          </svg></a></li>
        
        <li class="active">Dashboard</li>
      </ol>
      <div class="d-flex justify-content-between align-items-center flex-wrap">
        <h1>{{$title}}</h1>
        
      </div>
      
    </section>
    <!-- Main content -->
    <section class="content pt-0">

      <div class="border-top pt-3 mt-4">
        <div class="row">
          <div class="col-md-6 border-end pe-md-4 mobile-border-none">
            <div class="d-flex justify-content-between align-items-center   mb-2 flex-wrap">
              <div class="fs-20 text-black">Total Customers: <span class="fw-bold">{{$total_customers}}</span></div>
            </div>
            <div class="row">
              <div class="col-md-6 mb-4 col-lg-6 mb-3 mb-md-0">
                <div class="border-0 p-3 card-inactive d-flex flex-row rounded-4 align-items-center">
                  <div class="">
                    <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <circle cx="26" cy="26" r="26" fill="#8E8E93"/>
                      <mask id="path-2-inside-1_656_19847" fill="white">
                      <path d="M29.5899 35.66C29.3999 35.66 29.2099 35.59 29.0599 35.44C28.7699 35.15 28.7699 34.67 29.0599 34.38L31.8799 31.56C32.1699 31.27 32.6499 31.27 32.9399 31.56C33.2299 31.85 33.2299 32.33 32.9399 32.62L30.1199 35.44C29.9699 35.59 29.7799 35.66 29.5899 35.66Z"/>
                      </mask>
                      <path d="M29.5899 35.66C29.3999 35.66 29.2099 35.59 29.0599 35.44C28.7699 35.15 28.7699 34.67 29.0599 34.38L31.8799 31.56C32.1699 31.27 32.6499 31.27 32.9399 31.56C33.2299 31.85 33.2299 32.33 32.9399 32.62L30.1199 35.44C29.9699 35.59 29.7799 35.66 29.5899 35.66Z" fill="white"/>
                      <path d="M29.0599 34.38L30.2897 35.6098L30.2897 35.6098L29.0599 34.38ZM31.8799 31.56L30.6502 30.3303L30.6502 30.3303L31.8799 31.56ZM29.5899 35.66V33.9209C29.8363 33.9209 30.0963 34.0169 30.2897 34.2103L29.0599 35.44L27.8302 36.6698C28.3235 37.1631 28.9636 37.3992 29.5899 37.3992V35.66ZM29.0599 35.44L30.2897 34.2103C30.6788 34.5995 30.6788 35.2206 30.2897 35.6098L29.0599 34.38L27.8302 33.1503C26.861 34.1195 26.861 35.7006 27.8302 36.6698L29.0599 35.44ZM29.0599 34.38L30.2897 35.6098L33.1097 32.7898L31.8799 31.56L30.6502 30.3303L27.8302 33.1503L29.0599 34.38ZM31.8799 31.56L33.1097 32.7898C32.7205 33.179 32.0993 33.179 31.7102 32.7898L32.9399 31.56L34.1697 30.3303C33.2005 29.3611 31.6193 29.3611 30.6502 30.3303L31.8799 31.56ZM32.9399 31.56L31.7102 32.7898C31.321 32.4006 31.321 31.7795 31.7102 31.3903L32.9399 32.62L34.1697 33.8498C35.1388 32.8806 35.1388 31.2995 34.1697 30.3303L32.9399 31.56ZM32.9399 32.62L31.7102 31.3903L28.8902 34.2103L30.1199 35.44L31.3497 36.6698L34.1697 33.8498L32.9399 32.62ZM30.1199 35.44L28.8902 34.2103C29.0835 34.0169 29.3436 33.9209 29.5899 33.9209V35.66V37.3992C30.2163 37.3992 30.8563 37.1631 31.3497 36.6698L30.1199 35.44Z" fill="white" mask="url(#path-2-inside-1_656_19847)"/>
                      <path d="M32.4099 35.66C32.2199 35.66 32.0299 35.59 31.8799 35.44L29.0599 32.62C28.7699 32.33 28.7699 31.85 29.0599 31.56C29.3499 31.27 29.8299 31.27 30.1199 31.56L32.9399 34.38C33.2299 34.67 33.2299 35.15 32.9399 35.44C32.7899 35.59 32.5999 35.66 32.4099 35.66Z" fill="white"/>
                      <path d="M26.1599 25.62C26.1299 25.62 26.1099 25.62 26.0799 25.62C26.0299 25.61 25.9599 25.61 25.8999 25.62C22.9999 25.53 20.8099 23.25 20.8099 20.44C20.8099 17.58 23.1399 15.25 25.9999 15.25C28.8599 15.25 31.1899 17.58 31.1899 20.44C31.1799 23.25 28.9799 25.53 26.1899 25.62C26.1799 25.62 26.1699 25.62 26.1599 25.62ZM25.9999 16.75C23.9699 16.75 22.3099 18.41 22.3099 20.44C22.3099 22.44 23.8699 24.05 25.8599 24.12C25.9199 24.11 26.0499 24.11 26.1799 24.12C28.1399 24.03 29.6799 22.42 29.6899 20.44C29.6899 18.41 28.0299 16.75 25.9999 16.75Z" fill="white"/>
                      <path d="M25.9999 36.5601C23.9599 36.5601 22.0299 36.0301 20.5699 35.0501C19.1799 34.1201 18.4199 32.8501 18.4199 31.4801C18.4199 30.1101 19.1899 28.8501 20.5699 27.9301C23.5599 25.9301 28.4199 25.9301 31.4099 27.9301C31.7499 28.1601 31.8499 28.6301 31.6199 28.9701C31.3899 29.3201 30.9199 29.4101 30.5799 29.1801C28.0899 27.5201 23.8899 27.5201 21.3999 29.1801C20.4399 29.8201 19.9199 30.6301 19.9199 31.4801C19.9199 32.3301 20.4499 33.1601 21.3999 33.8001C22.6099 34.6101 24.2399 35.0501 25.9899 35.0501C26.3999 35.0501 26.7399 35.3901 26.7399 35.8001C26.7399 36.2101 26.4099 36.5601 25.9999 36.5601Z" fill="white"/>
                      </svg>
                      
                  </div>
                  <div class="ps-3">
                    <div class="fs-14 fw-semibold card-inactive-text">Inactive</div>
                    <div class="fs-24 fw-semibold text-black">{{$inactive_customers}}</div>
                  </div>
      
                </div>
              </div>
              <div class="col-md-6 mb-4 col-lg-6 mb-3 mb-md-0">
                <div class="border-0 p-3 card-completed d-flex flex-row rounded-4 align-items-center">
                  <div class="">
                    <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <circle cx="26" cy="26" r="26" fill="#34C759"/>
                      <mask id="path-2-inside-1_656_19861" fill="white">
                      <path d="M29.9601 35.32C29.7701 35.32 29.5801 35.25 29.4301 35.1L27.9101 33.58C27.6201 33.29 27.6201 32.81 27.9101 32.52C28.2001 32.23 28.6801 32.23 28.9701 32.52L29.9601 33.51L32.4701 31C32.7601 30.71 33.2401 30.71 33.5301 31C33.8201 31.29 33.8201 31.77 33.5301 32.06L30.4901 35.1C30.3401 35.25 30.1501 35.32 29.9601 35.32Z"/>
                      </mask>
                      <path d="M29.9601 35.32C29.7701 35.32 29.5801 35.25 29.4301 35.1L27.9101 33.58C27.6201 33.29 27.6201 32.81 27.9101 32.52C28.2001 32.23 28.6801 32.23 28.9701 32.52L29.9601 33.51L32.4701 31C32.7601 30.71 33.2401 30.71 33.5301 31C33.8201 31.29 33.8201 31.77 33.5301 32.06L30.4901 35.1C30.3401 35.25 30.1501 35.32 29.9601 35.32Z" fill="white"/>
                      <path d="M29.4301 35.1L28.2004 36.3297H28.2004L29.4301 35.1ZM27.9101 33.58L29.1399 32.3502L29.1399 32.3502L27.9101 33.58ZM29.9601 33.51L28.7304 34.7397L29.9601 35.9695L31.1899 34.7397L29.9601 33.51ZM32.4701 31L31.2404 29.7702L31.2404 29.7702L32.4701 31ZM29.9601 35.32V33.5808C30.2065 33.5808 30.4665 33.6769 30.6599 33.8702L29.4301 35.1L28.2004 36.3297C28.6937 36.8231 29.3338 37.0591 29.9601 37.0591V35.32ZM29.4301 35.1L30.6599 33.8702L29.1399 32.3502L27.9101 33.58L26.6804 34.8097L28.2004 36.3297L29.4301 35.1ZM27.9101 33.58L29.1399 32.3502C29.5291 32.7394 29.5291 33.3605 29.1399 33.7497L27.9101 32.52L26.6804 31.2902C25.7112 32.2594 25.7112 33.8405 26.6804 34.8097L27.9101 33.58ZM27.9101 32.52L29.1399 33.7497C28.7507 34.1389 28.1295 34.1389 27.7404 33.7497L28.9701 32.52L30.1999 31.2902C29.2307 30.321 27.6495 30.321 26.6804 31.2902L27.9101 32.52ZM28.9701 32.52L27.7404 33.7497L28.7304 34.7397L29.9601 33.51L31.1899 32.2802L30.1999 31.2902L28.9701 32.52ZM29.9601 33.51L31.1899 34.7397L33.6999 32.2297L32.4701 31L31.2404 29.7702L28.7304 32.2802L29.9601 33.51ZM32.4701 31L33.6999 32.2297C33.3107 32.6189 32.6895 32.6189 32.3004 32.2297L33.5301 31L34.7599 29.7702C33.7907 28.801 32.2095 28.801 31.2404 29.7702L32.4701 31ZM33.5301 31L32.3004 32.2297C31.9112 31.8405 31.9112 31.2194 32.3004 30.8302L33.5301 32.06L34.7599 33.2897C35.7291 32.3205 35.7291 30.7394 34.7599 29.7702L33.5301 31ZM33.5301 32.06L32.3004 30.8302L29.2604 33.8702L30.4901 35.1L31.7199 36.3297L34.7599 33.2897L33.5301 32.06ZM30.4901 35.1L29.2604 33.8702C29.4537 33.6769 29.7138 33.5808 29.9601 33.5808V35.32V37.0591C30.5865 37.0591 31.2265 36.8231 31.7199 36.3297L30.4901 35.1Z" fill="white" mask="url(#path-2-inside-1_656_19861)"/>
                      <path d="M26.1602 25.62C26.1302 25.62 26.1102 25.62 26.0802 25.62C26.0302 25.61 25.9602 25.61 25.9002 25.62C23.0002 25.53 20.8102 23.25 20.8102 20.44C20.8002 19.06 21.3402 17.76 22.3202 16.78C23.3002 15.8 24.6002 15.25 25.9902 15.25C28.8502 15.25 31.1802 17.58 31.1802 20.44C31.1802 23.25 28.9902 25.52 26.1902 25.62C26.1802 25.62 26.1702 25.62 26.1602 25.62ZM25.9902 16.75C25.0002 16.75 24.0802 17.14 23.3802 17.83C22.6902 18.53 22.3102 19.45 22.3102 20.43C22.3102 22.43 23.8702 24.05 25.8602 24.11C25.9202 24.1 26.0502 24.1 26.1802 24.11C28.1502 24.02 29.6802 22.41 29.6802 20.43C29.6802 18.41 28.0202 16.75 25.9902 16.75Z" fill="white"/>
                      <path d="M25.9902 36.5601C23.9502 36.5601 22.0202 36.0301 20.5602 35.0501C19.1702 34.1201 18.4102 32.8501 18.4102 31.4801C18.4102 30.1101 19.1802 28.8501 20.5602 27.9301C23.5502 25.9301 28.4102 25.9301 31.4002 27.9301C31.7402 28.1601 31.8402 28.6301 31.6102 28.9701C31.3802 29.3201 30.9102 29.4101 30.5702 29.1801C28.0802 27.5201 23.8802 27.5201 21.3902 29.1801C20.4302 29.8201 19.9102 30.6301 19.9102 31.4801C19.9102 32.3301 20.4302 33.1601 21.3902 33.8001C22.6002 34.6101 24.2302 35.0501 25.9802 35.0501C26.3902 35.0501 26.7302 35.3901 26.7302 35.8001C26.7302 36.2101 26.4002 36.5601 25.9902 36.5601Z" fill="white"/>
                      </svg>
                      
      
                  </div>
                  <div class="ps-3">
                    <div class="fs-14 fw-semibold card-completed-text">Active</div>
                    <div class="fs-24 fw-semibold text-black">{{$active_customers}}</div>
                  </div>
      
                </div>
              </div>
            </div>
          </div>
          <div class="col-md-6 ps-md-4">

            <div class="d-flex justify-content-between align-items-center   mb-2 flex-wrap">
              <div class="fs-20 text-black">Total Licenses: <span class="fw-bold">{{$total_licenses}}</span></div>
            </div>
            <div class="row">
              <div class="col-md-6 mb-4 col-lg-6 mb-3 mb-md-0">
                <div class="border-0 p-3 card-inactive d-flex flex-row rounded-4 align-items-center">
                  <div class="">
                    <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <circle cx="26" cy="26" r="26" fill="#8E8E93"/>
                      <mask id="path-2-inside-1_664_21059" fill="white">
                      <path d="M26 36.75C20.07 36.75 15.25 31.93 15.25 26C15.25 20.07 20.07 15.25 26 15.25C31.93 15.25 36.75 20.07 36.75 26C36.75 31.93 31.93 36.75 26 36.75ZM26 16.75C20.9 16.75 16.75 20.9 16.75 26C16.75 31.1 20.9 35.25 26 35.25C31.1 35.25 35.25 31.1 35.25 26C35.25 20.9 31.1 16.75 26 16.75Z"/>
                      </mask>
                      <path d="M26 36.75C20.07 36.75 15.25 31.93 15.25 26C15.25 20.07 20.07 15.25 26 15.25C31.93 15.25 36.75 20.07 36.75 26C36.75 31.93 31.93 36.75 26 36.75ZM26 16.75C20.9 16.75 16.75 20.9 16.75 26C16.75 31.1 20.9 35.25 26 35.25C31.1 35.25 35.25 31.1 35.25 26C35.25 20.9 31.1 16.75 26 16.75Z" fill="white"/>
                      <path d="M26 36.75V35.0109C21.0305 35.0109 16.9891 30.9695 16.9891 26H15.25H13.5109C13.5109 32.8905 19.1095 38.4891 26 38.4891V36.75ZM15.25 26H16.9891C16.9891 21.0305 21.0305 16.9891 26 16.9891V15.25V13.5109C19.1095 13.5109 13.5109 19.1095 13.5109 26H15.25ZM26 15.25V16.9891C30.9695 16.9891 35.0109 21.0305 35.0109 26H36.75H38.4891C38.4891 19.1095 32.8905 13.5109 26 13.5109V15.25ZM36.75 26H35.0109C35.0109 30.9695 30.9695 35.0109 26 35.0109V36.75V38.4891C32.8905 38.4891 38.4891 32.8905 38.4891 26H36.75ZM26 16.75V15.0109C19.9395 15.0109 15.0109 19.9395 15.0109 26H16.75H18.4891C18.4891 21.8605 21.8605 18.4891 26 18.4891V16.75ZM16.75 26H15.0109C15.0109 32.0605 19.9395 36.9891 26 36.9891V35.25V33.5109C21.8605 33.5109 18.4891 30.1395 18.4891 26H16.75ZM26 35.25V36.9891C32.0605 36.9891 36.9891 32.0605 36.9891 26H35.25H33.5109C33.5109 30.1395 30.1395 33.5109 26 33.5109V35.25ZM35.25 26H36.9891C36.9891 19.9395 32.0605 15.0109 26 15.0109V16.75V18.4891C30.1395 18.4891 33.5109 21.8605 33.5109 26H35.25Z" fill="white" mask="url(#path-2-inside-1_664_21059)"/>
                      <path d="M23.17 29.58C22.98 29.58 22.79 29.51 22.64 29.36C22.35 29.07 22.35 28.59 22.64 28.3L28.3 22.64C28.59 22.35 29.07 22.35 29.36 22.64C29.65 22.93 29.65 23.41 29.36 23.7L23.7 29.36C23.56 29.51 23.36 29.58 23.17 29.58Z" fill="white"/>
                      <path d="M28.83 29.58C28.64 29.58 28.45 29.51 28.3 29.36L22.64 23.7C22.35 23.41 22.35 22.93 22.64 22.64C22.93 22.35 23.41 22.35 23.7 22.64L29.36 28.3C29.65 28.59 29.65 29.07 29.36 29.36C29.21 29.51 29.02 29.58 28.83 29.58Z" fill="white"/>
                      </svg>
                      

                  </div>
                  <div class="ps-3">
                    <div class="fs-14 fw-semibold card-inactive-text">Inactive</div>
                    <div class="fs-24 fw-semibold text-black">{{$inactive_licenses}}</div>
                  </div>

                </div>
              </div>
              <div class="col-md-6 mb-4 col-lg-6 mb-3 mb-md-0">
                <div class="border-0 p-3 card-completed d-flex flex-row rounded-4 align-items-center">
                  <div class="">
                    <svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <circle cx="26" cy="26" r="26" fill="#34C759"/>
                      <mask id="path-2-inside-1_664_21066" fill="white">
                      <path d="M26 36.75C20.07 36.75 15.25 31.93 15.25 26C15.25 20.07 20.07 15.25 26 15.25C31.93 15.25 36.75 20.07 36.75 26C36.75 31.93 31.93 36.75 26 36.75ZM26 16.75C20.9 16.75 16.75 20.9 16.75 26C16.75 31.1 20.9 35.25 26 35.25C31.1 35.25 35.25 31.1 35.25 26C35.25 20.9 31.1 16.75 26 16.75Z"/>
                      </mask>
                      <path d="M26 36.75C20.07 36.75 15.25 31.93 15.25 26C15.25 20.07 20.07 15.25 26 15.25C31.93 15.25 36.75 20.07 36.75 26C36.75 31.93 31.93 36.75 26 36.75ZM26 16.75C20.9 16.75 16.75 20.9 16.75 26C16.75 31.1 20.9 35.25 26 35.25C31.1 35.25 35.25 31.1 35.25 26C35.25 20.9 31.1 16.75 26 16.75Z" fill="white"/>
                      <path d="M26 36.75V35.0109C21.0305 35.0109 16.9891 30.9695 16.9891 26H15.25H13.5109C13.5109 32.8905 19.1095 38.4891 26 38.4891V36.75ZM15.25 26H16.9891C16.9891 21.0305 21.0305 16.9891 26 16.9891V15.25V13.5109C19.1095 13.5109 13.5109 19.1095 13.5109 26H15.25ZM26 15.25V16.9891C30.9695 16.9891 35.0109 21.0305 35.0109 26H36.75H38.4891C38.4891 19.1095 32.8905 13.5109 26 13.5109V15.25ZM36.75 26H35.0109C35.0109 30.9695 30.9695 35.0109 26 35.0109V36.75V38.4891C32.8905 38.4891 38.4891 32.8905 38.4891 26H36.75ZM26 16.75V15.0109C19.9395 15.0109 15.0109 19.9395 15.0109 26H16.75H18.4891C18.4891 21.8605 21.8605 18.4891 26 18.4891V16.75ZM16.75 26H15.0109C15.0109 32.0605 19.9395 36.9891 26 36.9891V35.25V33.5109C21.8605 33.5109 18.4891 30.1395 18.4891 26H16.75ZM26 35.25V36.9891C32.0605 36.9891 36.9891 32.0605 36.9891 26H35.25H33.5109C33.5109 30.1395 30.1395 33.5109 26 33.5109V35.25ZM35.25 26H36.9891C36.9891 19.9395 32.0605 15.0109 26 15.0109V16.75V18.4891C30.1395 18.4891 33.5109 21.8605 33.5109 26H35.25Z" fill="white" mask="url(#path-2-inside-1_664_21066)"/>
                      <path d="M24.5799 29.58C24.3799 29.58 24.1899 29.5 24.0499 29.36L21.2199 26.53C20.9299 26.24 20.9299 25.76 21.2199 25.47C21.5099 25.18 21.9899 25.18 22.2799 25.47L24.5799 27.77L29.7199 22.63C30.0099 22.34 30.4899 22.34 30.7799 22.63C31.0699 22.92 31.0699 23.4 30.7799 23.69L25.1099 29.36C24.9699 29.5 24.7799 29.58 24.5799 29.58Z" fill="white"/>
                      </svg>
                      

                  </div>
                  <div class="ps-3">
                    <div class="fs-14 fw-semibold card-completed-text">Active</div>
                    <div class="fs-24 fw-semibold text-black">{{$active_licenses}}</div>
                  </div>

                </div>
              </div>
            </div>
          </div>
        </div>
      </div>


    </section>
    <!-- /.content -->
  <script type="text/javascript">
  $(document).ready(function() {
    $.fn.dataTable.ext.errMode = () => alert('{{__("messages.datatable-error-message")}}');
    var table = $('#tbl-users').DataTable({
      info: true,
      searching: true,
      //ajax: '../server_side/scripts/server_processing.php',
      pageLength: 10,
      paging: false, // disables pagination
      pagingType: "full_numbers",
      dom: 'frt<"bottom"ipl><"clear">'
    });
    $('#tbl-users_filter input[type="search"]').attr('placeholder', 'Search');

    $('#tbl-users_filter').append(`
    <select id="roleFilter" class="form-control max-w-200">
      <option value="">Status</option>
      <option value="Admin">Admin</option>
      <option value="User">User</option>
      <option value="Guest">Guest</option>
    </select>
  `);

  // Filter on change
  $('#roleFilter').on('change', function () {
    let selected = $(this).val();
    table.column(1).search(selected).draw(); // column index 1 = "Role"
  });

  var table = $('#tbl-issue-reported').DataTable({
       info: true,
       searching: false,
       ordering: false, // disables default sorting
       //ajax: '../server_side/scripts/server_processing.php',
       paging: false, // disables pagination
       dom: 'frt<"bottom"ipl><"clear">'
     });
    
    $('#tbl-issue-reported_filter').append(`
        <div class="d-flex justify-content-end jobs-right-filter">
            <div class="custom-width-200 position-relative">
                <input type="text" class="form-control date-picker" id="calendar">
                <span class="position-absolute date-picker-icon">
                    <em class="iconsax icon-292D32 fs-20" icon-name="calendar-1"></em>

                </span>
            </div>
        </div>
    `);
  });

  
  

  // function to show auto login popup with update link
  $(document).on('click', '.auto-login-link', function() {

    let id = $(this).attr('data-id');

    $.ajax({
      headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
      },
      type: 'POST',
      
      dataType: "html",
      data: {
        id: id
      },
      success: function(response) {
        $('#autologin').modal('show');
        $(".model-content-autologin").html(response);
      },
      beforeSend: function() {}
    });
  });

  $(document).on('click', '.copy-to-clipboard', function() {
    var copyText = document.getElementById("autologin_url_field");
    $("#autologin_url_field").focus();
    copyText.select();
    copyText.setSelectionRange(0, 99999);
    document.execCommand("copy");
  });
</script>
    <script type="text/javascript">
    $(document).ready(function() {
      $('#calendar').datepicker();
    }); 
</script>
@endsection