344 lines
12 KiB
PHP
344 lines
12 KiB
PHP
@extends('layouts.admin_app')
|
|
@section('header')
|
|
@endsection
|
|
@section('content')
|
|
<!-- Layout Content -->
|
|
|
|
<!-- 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">
|
|
|
|
<!-- Login -->
|
|
<div class="card p-md-7 p-1">
|
|
<!-- 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>
|
|
<img src="{{asset('assets/img/logo/cafeg-logo.png')}}" width="50px" height="50px" alt="{{asset('img/logo/cafeg-logo.png')}}"> </img>
|
|
|
|
</span>
|
|
</span>
|
|
<span class="app-brand-text demo text-heading fw-semibold">
|
|
<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">
|
|
<h4 class="mb-1">卡菲姬個人資料</h4>
|
|
<p class="mb-5">Hi, <span class="text-ifno"> {{$data->name }} 管理者 </span> 歡迎你 ! ,請花幾分鐘完善資料</p>
|
|
|
|
<div class="card" id="editUser">
|
|
<div class="content">
|
|
<div class="body p-0">
|
|
<div class="text-center mb-6">
|
|
<h4 class="mb-2">編輯您的資訊</h4>
|
|
<p class="mb-6">更新用戶詳細資訊</p>
|
|
</div>
|
|
<form id="editUserForm" class="row g-5" >
|
|
<!-- 暱稱 -->
|
|
<div class="col-12">
|
|
<div class="form-floating form-floating-outline">
|
|
<input
|
|
readonly
|
|
type="text"
|
|
id="modalEditUserFirstName"
|
|
name="modalEditUserFirstName"
|
|
class="form-control"
|
|
value="{{$data->name}}"
|
|
placeholder="暱稱"
|
|
aria-label="暱稱"
|
|
/>
|
|
<label for="modalEditUserFirstName">暱稱</label>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Email -->
|
|
<div class="col-12">
|
|
<div class="form-floating form-floating-outline">
|
|
<input
|
|
type="email"
|
|
id="formValidationEmail"
|
|
class="form-control"
|
|
placeholder="john.doe@example.com"
|
|
aria-label="Email"
|
|
required
|
|
value="{{$data->email ?? ''}}"
|
|
|
|
/>
|
|
<label for="formValidationEmail">Email</label>
|
|
<div class="invalid-feedback">請輸入有效的 Email</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 密碼 -->
|
|
<div class="col-12">
|
|
<div class="form-password-toggle">
|
|
<div class="input-group input-group-merge">
|
|
<div class="form-floating form-floating-outline">
|
|
<input
|
|
type="password"
|
|
id="basic-default-password"
|
|
class="form-control"
|
|
placeholder="密碼"
|
|
aria-label="密碼"
|
|
value="{{$data->password ?? ''}}"
|
|
|
|
/>
|
|
<label for="basic-default-password">密碼</label>
|
|
<div class="invalid-feedback">請輸入有效密碼</div>
|
|
|
|
</div>
|
|
<span
|
|
class="input-group-text cursor-pointer"
|
|
id="basic-default-password3"
|
|
>
|
|
<i class="ri-eye-off-line"></i>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- 確認密碼 -->
|
|
<div class="col-12">
|
|
<div class="form-password-toggle">
|
|
<div class="input-group input-group-merge">
|
|
<div class="form-floating form-floating-outline">
|
|
<input
|
|
type="password"
|
|
id="formValidationConfirmPass"
|
|
name="formValidationConfirmPass"
|
|
class="form-control"
|
|
placeholder="確認密碼"
|
|
aria-label="確認密碼"
|
|
value=" "
|
|
|
|
/>
|
|
<label for="formValidationConfirmPass">確認密碼</label>
|
|
<div class="invalid-feedback">密碼與確認密碼不相符</div>
|
|
|
|
</div>
|
|
<span
|
|
class="input-group-text cursor-pointer"
|
|
id="multicol-confirm-password2"
|
|
>
|
|
<i class="ri-eye-off-line"></i>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 電話 -->
|
|
<div class="col-12">
|
|
<div class="input-group input-group-merge">
|
|
|
|
<div class="form-floating form-floating-outline">
|
|
<input
|
|
type="text"
|
|
id="modalEditUserPhone"
|
|
name="modalEditUserPhone"
|
|
class="form-control phone-number-mask"
|
|
value="{{$data->phone ?? ''}}"
|
|
placeholder="0920111222"
|
|
aria-label="電話"
|
|
/>
|
|
<label for="modalEditUserPhone">電話</label>
|
|
<div class="invalid-feedback">請輸入有效電話</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- 按鈕 -->
|
|
<div
|
|
class="col-12 text-center d-flex flex-wrap justify-content-center gap-4 row-gap-4"
|
|
|
|
>
|
|
<button type="submit" class="btn btn-primary">送出</button>
|
|
<button
|
|
type="reset"
|
|
class="btn btn-outline-secondary"
|
|
data-bs-dismiss="modal"
|
|
aria-label="Close"
|
|
>
|
|
取消
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
{{-- <p class="text-center">
|
|
<span>新的裝置?</span>
|
|
<a href="register-basic.html">
|
|
<span>創建新的帳號</span>
|
|
</a>
|
|
</p>
|
|
|
|
<div class="divider my-5">
|
|
<div class="divider-text">或</div>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-center gap-2">
|
|
|
|
<a href="{{route('admin.login.line')}}" class="btn btn-icon rounded-circle btn-text-line">
|
|
<i class="tf-icons ri-line-fill"></i>
|
|
</a>
|
|
|
|
|
|
|
|
|
|
<a href="javascript:;" class="btn btn-icon rounded-circle btn-text-google-plus">
|
|
<i class="tf-icons ri-google-fill"></i>
|
|
</a> --}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /Login -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--/ Content -->
|
|
|
|
<!--/ Layout Content -->
|
|
|
|
|
|
{{-- <div class="buy-now">
|
|
<a href="#" target="" class="btn btn-danger btn-buy-now">Buy Now</a>
|
|
</div> --}}
|
|
|
|
|
|
<!-- Include Scripts -->
|
|
<!-- $isFront is used to append the front layout scripts only on the front layout otherwise the variable will be blank -->
|
|
<!-- BEGIN: Vendor JS-->
|
|
{{-- <link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/jquery/jquery.js" /> --}}
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/js/helpers.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/popper/popper.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/js/bootstrap.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/node-waves/node-waves.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/perfect-scrollbar/perfect-scrollbar.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/hammer/hammer.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/typeahead-js/typeahead.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/js/menu.js" />
|
|
<script type="module" src="{{asset('assets')}}/vendor/libs/jquery/jquery.js"></script>
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/@form-validation/popular.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/js/helpers.js" />
|
|
<link rel="modulepreload" href="{{asset('assets')}}/vendor/libs/@form-validation/bootstrap5.js" />
|
|
{{-- <link rel="modulepreload" href="{{asset('assets')}}/index.js" /> --}}
|
|
{{-- <link rel="modulepreload" href="{{asset('assets')}}/auto.js" /> --}}
|
|
<script type="module" src="{{asset('assets')}}/vendor/libs/@form-validation/popular.js">
|
|
</script><script type="module" src="{{asset('assets')}}/vendor/libs/@form-validation/bootstrap5.js"></script>
|
|
<script type="module" src="{{asset('assets')}}/vendor/libs/@form-validation/auto-focus.js"></script>
|
|
<!-- END: Page Vendor JS-->
|
|
<!-- BEGIN: Theme JS-->
|
|
<link rel="modulepreload" href="{{asset('assets')}}/js/main.js" />
|
|
<script type="module" src="{{asset('assets')}}/js/main.js"></script>
|
|
<!-- END: Theme JS-->
|
|
<!-- Pricing Modal JS-->
|
|
<!-- END: Pricing Modal JS-->
|
|
<!-- BEGIN: Page JS-->
|
|
<link rel="modulepreload" href="{{asset('assets')}}/js/pages-auth.js" />
|
|
<script type="module" src="{{asset('assets')}}/js/pages-auth.js"></script>
|
|
<!-- END: Page JS-->
|
|
<script src="{{asset('assets')}}/js/form-validation.js"></script>
|
|
|
|
</body>
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
<script>
|
|
$(document).ready(function () {
|
|
$('#editUserForm').on('submit', function (e) {
|
|
e.preventDefault(); // 防止表單提交
|
|
|
|
let valid = true;
|
|
|
|
// Email 驗證
|
|
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
const emailInput = $('#formValidationEmail');
|
|
if (!emailRegex.test(emailInput.val())) {
|
|
valid = false;
|
|
emailInput.addClass('is-invalid');
|
|
} else {
|
|
emailInput.removeClass('is-invalid');
|
|
}
|
|
|
|
// 密碼長度驗證
|
|
const passwordInput = $('#basic-default-password');
|
|
//if (passwordInput.val().length < 6) {
|
|
// valid = false;
|
|
//passwordInput.addClass('is-invalid');
|
|
//} else {
|
|
// passwordInput.removeClass('is-invalid');
|
|
//}
|
|
|
|
// 確認密碼驗證
|
|
const confirmPasswordInput = $('#formValidationConfirmPass');
|
|
if (passwordInput.val() !== confirmPasswordInput.val()) {
|
|
valid = false;
|
|
confirmPasswordInput.addClass('is-invalid');
|
|
} else {
|
|
confirmPasswordInput.removeClass('is-invalid');
|
|
}
|
|
|
|
// 手機號碼驗證
|
|
const phoneRegex = /^09\d{8}$/;
|
|
const phoneInput = $('#modalEditUserPhone');
|
|
if (!phoneRegex.test(phoneInput.val())) {
|
|
valid = false;
|
|
phoneInput.addClass('is-invalid');
|
|
} else {
|
|
phoneInput.removeClass('is-invalid');
|
|
}
|
|
|
|
// 若通過所有驗證,發送 AJAX 請求
|
|
if (valid) {
|
|
const formData = {
|
|
email: emailInput.val(),
|
|
password: passwordInput.val(),
|
|
phone: phoneInput.val(),
|
|
};
|
|
|
|
$.ajax({
|
|
url: "{{ route('admin.profile.update') }}",
|
|
type: 'put',
|
|
data: formData,
|
|
headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
|
|
success: function (response) {
|
|
Swal.fire({
|
|
title: '成功'
|
|
, text: "{{ session('success') }}"
|
|
, icon: 'success'
|
|
, confirmButtonText: '确定'
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
// 跳轉到 admin.index 路由
|
|
window.location.href = "{{ route('admin.index') }}";
|
|
}
|
|
});
|
|
|
|
|
|
},
|
|
error: function (error) {
|
|
Swal.fire({
|
|
title: '失敗'
|
|
, text: "更新失敗"
|
|
, icon: 'error'
|
|
, confirmButtonText: '确定'
|
|
});
|
|
},
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
</script>
|
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
|
|
|
@endsection
|