<!DOCTYPE html>

<!-- beautify ignore:start -->


<html lang="en" class="light-style  layout-wide dark customizer-hide" dir="ltr" data-theme="theme-bordered" data-assets-path="../../assets/" data-template="vertical-menu-template-bordered" data-style="light">

  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>忘記密碼</title>


    <meta name="description" content="Materialize – is the most developer friendly &amp; highly customizable Admin Dashboard Template." />
    <meta name="keywords" content="cafeg coffee">
    <!-- Canonical SEO -->


    <!-- ? PROD Only: Google Tag Manager (Default ThemeSelection: GTM-5DDHKGP, PixInvent: GTM-5J3LMKC) -->
    <script>
        (function(w, d, s, l, i) {
            w[l] = w[l] || [];
            w[l].push({
                'gtm.start': new Date().getTime(),
                event: 'gtm.js'
            });
            var f = d.getElementsByTagName(s)[0],
                j = d.createElement(s),
                dl = l != 'dataLayer' ? '&l=' + l : '';
            j.async = true;
            j.src =
                'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
            f.parentNode.insertBefore(j, f);
        })(window, document, 'script', 'dataLayer', 'GTM-5J3LMKC');
    </script>
    <!-- End Google Tag Manager -->

    <!-- Favicon -->
    <link rel="icon" type="image/x-icon" href="../../assets/img/favicon/favicon.ico" />

    <!-- Fonts -->
    <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=Inter:wght@300;400;500;600;700&ampdisplay=swap" rel="stylesheet">

    <!-- Icons -->
    <link rel="stylesheet" href="{{ asset('assets/vendor') }}/fonts/remixicon/remixicon.css" />
    <link rel="stylesheet" href="{{ asset('assets/vendor') }}/fonts/flag-icons.css" />

    <!-- Menu waves for no-customizer fix -->
    <link rel="stylesheet" href="{{ asset('assets/vendor') }}/libs/node-waves/node-waves.css" />

    <!-- Core CSS -->
    <link rel="stylesheet" href="{{ asset('assets/vendor') }}/css/rtl/core.css" class="template-customizer-core-css" />
    <link rel="stylesheet" href="{{ asset('assets/vendor') }}/css/rtl/theme-bordered.css" class="template-customizer-theme-css" />
    <link rel="stylesheet" href="../../assets/css/demo.css" />

    <!-- Vendors CSS -->
    <link rel="stylesheet" href="{{ asset('assets/vendor') }}/libs/perfect-scrollbar/perfect-scrollbar.css" />
    <link rel="stylesheet" href="{{ asset('assets/vendor') }}/libs/typeahead-js/typeahead.css" />
    <!-- Vendor -->
<link rel="stylesheet" href="{{ asset('assets/vendor') }}/libs/@form-validation/form-validation.css" />

    <!-- Page CSS -->
    <!-- Page -->
<link rel="stylesheet" href="{{ asset('assets/vendor') }}/css/pages/page-auth.css">

    <!-- Helpers -->
    <script src="{{ asset('assets/vendor') }}/js/helpers.js"></script>
    <!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
    <!--? Template customizer: To hide customizer set displayCustomizer value false in config.js.  -->
    <script src="{{ asset('assets/vendor') }}/js/template-customizer.js"></script>
    <!--? Config:  Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file.  -->
    <script src="../../assets/js/config.js"></script>

</head>

<body>


  <!-- ?PROD Only: Google Tag Manager (noscript) (Default ThemeSelection: GTM-5DDHKGP, PixInvent: GTM-5J3LMKC) -->
  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5J3LMKC" height="0" width="0" style="display: none; visibility: hidden"></iframe></noscript>
  <!-- End Google Tag Manager (noscript) -->

  <!-- Content -->

<div class="position-relative">
  <div class="authentication-wrapper authentication-basic container-p-y p-4 p-sm-0">
    <div class="authentication-inner py-6">

      <!-- Logo -->
      <div class="app-brand justify-content-center mt-5">
        <a href="#" class="app-brand-link gap-2">
            <span class="app-brand-logo demo">
                <span class="app-brand-text demo text-heading fw-semibold">
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img style="margin-left: 5%" src="{{ asset('assets/img/logo/cafeg-logo-1.png') }}"  width="45%" height="45%" alt="{{ asset('img/logo/cafeg-logo.png') }}"> </img>
                </span>

            </span>
            <span class="app-brand-text demo text-heading fw-semibold">
                &nbsp; &nbsp; <img src="{{ asset('assets/img/logo/cafeg-logo-h.png') }}" width="120px" height="50px" alt="{{ asset('img/logo/cafeg-logo.png') }}"> </img>

            </span>
        </a>
    </div>
        <!-- /Logo -->
        <div class="card-body mt-1" style="padding-top:5%">
          <h4 class="mb-1">忘記密碼? 🔒</h4>
          <p class="mb-5">輸入您的電子郵件地址，我們將向您發送重設密碼的說明</p>
          <form id="formAuthentication" class="mb-5"  >
            @csrf
            <div class="form-floating form-floating-outline mb-5">
              <input type="text" class="form-control" id="email" name="email" placeholder="輸入您的電子郵件" autofocus>
              <label>電子郵件</label>
            </div>
            <button class="btn btn-primary d-grid w-100"   id="confirm">發送連結</button>
          </form>
          <div class="text-center">
            <a href="{{ route('login') }}" class="d-flex align-items-center justify-content-center">
              <i class="ri-arrow-left-s-line scaleX-n1-rtl ri-20px me-1_5"></i>
             回到登入
            </a>
          </div>
        </div>
      </div>
      <!-- /Forgot Password -->
      <img alt="mask" src="../../assets/img/illustrations/auth-basic-forgot-password-mask-light.png" class="authentication-image d-none d-lg-block" data-app-light-img="illustrations/auth-basic-forgot-password-mask-light.png" data-app-dark-img="illustrations/auth-basic-forgot-password-mask-dark.png" />
    </div>
  </div>
</div>

<!-- / Content -->






  <!-- Core JS -->
  <!-- build:js assets/vendor/js/core.js -->
  <script src="{{ asset('assets/vendor') }}/libs/jquery/jquery.js"></script>
  <script src="{{ asset('assets/vendor') }}/libs/popper/popper.js"></script>
  <script src="{{ asset('assets/vendor') }}/js/bootstrap.js"></script>
  <script src="{{ asset('assets/vendor') }}/libs/node-waves/node-waves.js"></script>
  <script src="{{ asset('assets/vendor') }}/libs/perfect-scrollbar/perfect-scrollbar.js"></script>
  <script src="{{ asset('assets/vendor') }}/libs/hammer/hammer.js"></script>
  <script src="{{ asset('assets/vendor') }}/libs/i18n/i18n.js"></script>
  <script src="{{ asset('assets/vendor') }}/libs/typeahead-js/typeahead.js"></script>
  <script src="{{ asset('assets/vendor') }}/js/menu.js"></script>

  <!-- endbuild -->

  <!-- Vendors JS -->
  <script src="{{ asset('assets/vendor') }}/libs/@form-validation/popular.js"></script>
<script src="{{ asset('assets/vendor') }}/libs/@form-validation/bootstrap5.js"></script>
<script src="{{ asset('assets/vendor') }}/libs/@form-validation/auto-focus.js"></script>

  <!-- Main JS -->
  <script src="{{ asset('assets/') }}/js/main.js"></script>


  <!-- Page JS -->
  <script src="{{ asset('assets/') }}/js/pages-auth.js"></script>

</body>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

</html>

<!-- beautify ignore:end -->

<script>
    $("#confirm").on('click', function(event) {
        event.preventDefault(); // 阻止表单提交

        var email = $("#email").val();
        if (!email) {
            Swal.fire({
                title: '錯誤',
                text: "請輸入電子郵件",
                icon: 'warning',
                confirmButtonText: '确定'
            });
            return;
        }

        // 顯示 Loading 畫面
        Swal.fire({
            title: '請稍候',
            text: '正在處理中...',
            icon: 'info',
            allowOutsideClick: false, // 防止用戶關閉
            showConfirmButton: false, // 隱藏按鈕
            didOpen: () => {
                Swal.showLoading(); // 顯示 loading 動畫
            }
        });

        $.ajax({
            type: "post",
            url: "{{ route('email.password.post') }}",
            data: {
                email: email
            },
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            dataType: "json",
            success: function(response) {
                Swal.close(); // 隱藏 Loading 畫面

                if (response.status == 'success') {
                    Swal.fire({
                        title: '成功',
                        text: "重新設定密碼連結已發送",
                        icon: 'success',
                        confirmButtonText: '确定'
                    });
                } else {
                    Swal.fire({
                        title: '失敗',
                        text: "未找到有效的帳號",
                        icon: 'error',
                        confirmButtonText: '确定'
                    });
                }
            },
            error: function(xhr, status, error) {
                Swal.close(); // 隱藏 Loading 畫面

                if (xhr.status == 404) {
                    Swal.fire({
                        title: '錯誤',
                        text: "未找到有效帳號",
                        icon: 'error',
                        confirmButtonText: '确定'
                    });
                } else {
                    Swal.fire({
                        title: '錯誤',
                        text: "伺服器發生錯誤，請稍後再試",
                        icon: 'error',
                        confirmButtonText: '确定'
                    });
                }
            }
        });
    });
</script>

