callback.blade.php 2.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>操作提示</title>
  7. <style>
  8. body {
  9. margin: 0;
  10. padding: 0;
  11. height: 100vh;
  12. display: flex;
  13. justify-content: center;
  14. align-items: center;
  15. background: #f5f5f5;
  16. font-family: Arial, sans-serif;
  17. }
  18. .alert-box {
  19. background: white;
  20. padding: 2rem 3rem;
  21. border-radius: 8px;
  22. box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  23. position: relative;
  24. text-align: center;
  25. min-width: 300px;
  26. }
  27. .success { color: #4CAF50; }
  28. .error { color: #f44336; }
  29. .close-btn {
  30. position: absolute;
  31. top: 10px;
  32. right: 15px;
  33. background: none;
  34. border: none;
  35. font-size: 1.2rem;
  36. cursor: pointer;
  37. color: #666;
  38. }
  39. .icon {
  40. font-size: 2.5rem;
  41. margin-bottom: 1rem;
  42. }
  43. .message {
  44. font-size: 1.1rem;
  45. margin: 0.5rem 0;
  46. }
  47. </style>
  48. </head>
  49. <body>
  50. <div class="alert-box">
  51. <button class="close-btn" onclick="closeAlert()">×</button>
  52. {{-- <div class="icon"></div>--}}
  53. <div class="message"> </div>
  54. <div class="countdown">5秒后自动关闭</div>
  55. </div>
  56. <script>
  57. // 获取URL参数
  58. const params = new URLSearchParams(window.location.search);
  59. const status = '{{$status}}';
  60. const message = '{{$message}}';
  61. // 设置内容
  62. document.querySelector('.alert-box').classList.add(status);
  63. // document.querySelector('.icon').textContent = status === 'success' ? '✓' : '✕';
  64. document.querySelector('.message').textContent = message;
  65. // 倒计时显示
  66. let seconds = 5;
  67. const countdownElement = document.querySelector('.countdown');
  68. const timer = setInterval(() => {
  69. seconds--;
  70. countdownElement.textContent = `${seconds}秒后自动关闭`;
  71. if (seconds <= 0) clearInterval(timer);
  72. }, 1000);
  73. // 关闭函数
  74. function closeAlert() {
  75. window.history.length > 1 ? window.history.back() : window.close();
  76. }
  77. // 5秒自动关闭
  78. setTimeout(closeAlert, 5000);
  79. </script>
  80. </body>
  81. </html>