maintenance.blade.php 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. @extends('_layout')
  2. @section('title', '维护 | Maintenance')
  3. @section('layout_css')
  4. <link href="/assets/css/examples/maintenance.min.css" type="text/css" rel="stylesheet">
  5. @endsection
  6. @section('layout_content')
  7. <!--[if lt IE 8]> <p class="browserupgrade">您正在使用 <strong>过时/老旧</strong> 的浏览器。 为了您的使用体验,请
  8. <a href="http://browsehappy.com/" target="_blank">升级您的浏览器</a> <br/>You are using an <strong>outdated</strong>
  9. browser. Please
  10. <a href="http://browsehappy.com/" target="_blank">upgrade your browser</a> to improve your experience.</p>
  11. <![endif]-->
  12. <!-- Page -->
  13. <div class="page vertical-align text-center" data-animsition-in="fade-in" data-animsition-out="fade-out">>
  14. <div class="page-content vertical-align-middle">
  15. <i class="icon wb-settings icon-spin page-maintenance-icon" aria-hidden="true"></i>
  16. <h2>维护建设中</h2>
  17. {!! $message !!}
  18. <footer class="page-copyright">
  19. <p id="countdown"></p>
  20. </footer>
  21. </div>
  22. </div>
  23. <!-- End Page -->
  24. @endsection
  25. @section('layout_javascript')
  26. <script>
  27. // 每秒更新计时器
  28. const countDownDate = new Date("{{$time}}").getTime();
  29. const x = setInterval(function() {
  30. const distance = countDownDate - new Date().getTime();
  31. const days = Math.floor(distance / 86400000);
  32. const hours = Math.floor(distance % 86400000 / 3600000);
  33. const minutes = Math.floor(distance % 3600000 / 60000);
  34. const seconds = Math.floor(distance % 60000 / 1000);
  35. document.getElementById('countdown').innerHTML = '<h2>' + days + ' <span> 天 </span>: ' + hours +
  36. ' <span>时</span>: ' + minutes + ' <span>分 </span>: ' + seconds + '<span> 秒</span> </h2>';
  37. if (distance <= 0) {
  38. clearInterval(x);
  39. document.getElementById('countdown').remove();
  40. }
  41. }, 1000);
  42. </script>
  43. @endsection