迁移邮箱找回密码脚本

resources/views/password-forgot.blade.php

@@ -13,6 +13,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700;900&family=Noto+Serif+SC:wght@700;900&display=swap" rel="stylesheet">
+    @vite('resources/js/password-forgot.js')
     <style>
         :root {
             --bg: #0c0d0c;
@@ -202,7 +203,7 @@
 
             <div id="alert-box" class="alert" aria-live="polite"></div>
 
-            <form id="password-recovery-form">
+            <form id="password-recovery-form" data-password-email-url="{{ route('password.email') }}">
                 <label for="email">绑定邮箱</label>
                 <input
                     id="email"
@@ -232,68 +233,6 @@
         </section>
     </main>
 
-    <script>
-        const form = document.getElementById('password-recovery-form');
-        const submitButton = document.getElementById('submit-btn');
-        const alertBox = document.getElementById('alert-box');
-
-        function showAlert(message, type) {
-            alertBox.textContent = message;
-            alertBox.className = type === 'success' ? 'alert alert-success' : 'alert alert-error';
-            alertBox.style.display = 'block';
-        }
-
-        if (form) {
-            form.addEventListener('submit', function(event) {
-                event.preventDefault();
-
-                submitButton.disabled = true;
-                submitButton.innerText = '发送中...';
-                alertBox.style.display = 'none';
-
-                const data = Object.fromEntries(new FormData(form).entries());
-
-                fetch('{{ route('password.email') }}', {
-                    method: 'POST',
-                    credentials: 'same-origin',
-                    headers: {
-                        'Content-Type': 'application/json',
-                        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
-                        'Accept': 'application/json',
-                    },
-                    body: JSON.stringify(data),
-                })
-                    .then(function(response) {
-                        return response.json().then(function(body) {
-                            return {
-                                status: response.status,
-                                body: body,
-                            };
-                        });
-                    })
-                    .then(function(result) {
-                        if (result.status === 200 && result.body.status === 'success') {
-                            showAlert(result.body.message, 'success');
-                            form.reset();
-                            return;
-                        }
-
-                        const errorMessage =
-                            result.body.message ||
-                            (result.body.errors ? Object.values(result.body.errors)[0][0] : '邮件发送失败，请稍后重试。');
-
-                        showAlert(errorMessage, 'error');
-                    })
-                    .catch(function() {
-                        showAlert('网络或服务器异常，请稍后再试。', 'error');
-                    })
-                    .finally(function() {
-                        submitButton.disabled = false;
-                        submitButton.innerText = '发送重置邮件';
-                    });
-            });
-        }
-    </script>
 </body>
 
 </html>