后台找回密码功能

This commit is contained in:
TL 2022-07-14 16:00:06 +08:00
parent b9ad5d7c10
commit ded3518819
4 changed files with 150 additions and 8 deletions

View File

@ -23,7 +23,7 @@ class ForgottenController
*/
public function index()
{
return view('account/forgotten');
return view('admin::pages.user.forgotten');
}
/**

View File

@ -1,6 +1,7 @@
<?php
use Beike\Admin\Http\Controllers;
use Beike\Admin\Http\Controllers\ForgottenController;
use Illuminate\Support\Facades\Route;
$adminName = admin_name();
@ -11,6 +12,10 @@ Route::prefix($adminName)
Route::get('login', [Controllers\LoginController::class, 'show'])->name('login.show');
Route::post('login', [Controllers\LoginController::class, 'store'])->name('login.store');
Route::get('forgotten', [ForgottenController::class, 'index'])->name('forgotten.index');
Route::post('forgotten/send_code', [ForgottenController::class, 'sendVerifyCode'])->name('forgotten.send_code');
Route::post('forgotten/password', [ForgottenController::class, 'changePassword'])->name('forgotten.password');
Route::middleware('admin_auth:' . \Beike\Models\AdminUser::AUTH_GUARD)
->group(function () {
Route::get('/', [Controllers\HomeController::class, 'index'])->name('home.index');
@ -53,9 +58,5 @@ Route::prefix($adminName)
Route::get('logout', [Controllers\LogoutController::class, 'index'])->name('logout.index');
Route::get('forgotten', [\Beike\Admin\Http\Controllers\ForgottenController::class, 'index'])->name('forgotten.index');
Route::post('forgotten/send_code', [\Beike\Admin\Http\Controllers\ForgottenController::class, 'sendVerifyCode'])->name('forgotten.send_code');
Route::post('forgotten/password', [\Beike\Admin\Http\Controllers\ForgottenController::class, 'changePassword'])->name('forgotten.password');
});
});

View File

@ -23,10 +23,9 @@ class UserService
/**
* 发送验证码通过$type方式type为email或telephone
* @param $email
* @param $type
* @return void
*/
public static function sendVerifyCodeForForgotten($email, $type) {
public static function sendVerifyCodeForForgotten($email) {
$code = str_pad(mt_rand(10, 999999), 6, '0', STR_PAD_LEFT);
VerifyCodeRepo::deleteByAccount($email);
@ -37,7 +36,7 @@ class UserService
Log::info("找回密码验证码:{$code}");
Notification::verifyCode($code, "您的验证码是%s,该验证码仅用于找回密码。", $type);
Notification::verifyCode($code, "您的验证码是%s,该验证码仅用于找回密码。", 'email');
}
/**

View File

@ -0,0 +1,142 @@
@extends('layout.master')
@section('body-class', 'page-forgotten')
@push('header')
<script src="{{ asset('vendor/vue/2.6.14/vue.js') }}"></script>
<script src="{{ asset('vendor/element-ui/2.15.6/js.js') }}"></script>
<link rel="stylesheet" href="{{ asset('vendor/element-ui/2.15.6/css.css') }}">
@endpush
@section('content')
<div class="container" id="page-forgotten" v-cloak>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Library</li>
</ol>
</nav>
{{-- <div class="hero-content pb-5 text-center"><h1 class="hero-heading">找回密码</h1></div> --}}
<div class="row my-5 justify-content-md-center">
<div class="col-lg-5 col-xxl-4">
<div class="card">
<el-form ref="form" :model="form" :rules="rules">
<div class="card-body p-0">
<h4 class="fw-bold">请根据提示找回您的密码</h4>
<p class="text-muted" v-if="!isCode">请输入邮箱地址获取验证码</p>
<p class="text-muted" v-else>请输入新密码</p>
<el-form-item label="邮箱" prop="email" v-if="!isCode">
<el-input v-model="form.email" placeholder="邮箱地址"></el-input>
</el-form-item>
<el-form-item label="验证码" prop="code" class="mb-3" v-if="isCode">
<el-input v-model="form.code" placeholder="密码"></el-input>
</el-form-item>
<el-form-item label="密码" prop="password" class="mb-3" v-if="isCode">
<el-input type="password" v-model="form.password" placeholder="密码"></el-input>
</el-form-item>
<el-form-item label="确认密码" prop="password_confirmation" v-if="isCode">
<el-input type="password" v-model="form.password_confirmation" placeholder="确认密码"></el-input>
</el-form-item>
<div class="mt-5 mb-3 d-flex justify-content-between">
<button type="button" @click="submitForm('form')" class="btn w-50 btn-dark">@{{ !isCode ? '发送验证码' : '提交' }}</button>
</div>
<a href="javascript:void(0)" v-if="isCode" @click="isCode = false" class="text-muted">返回上一步</a>
</div>
</el-form>
</div>
</div>
</div>
</div>
@endsection
@push('add-scripts')
<script>
var validatePass = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入密码'));
} else {
if (value !== '') {
app.$refs.form.validateField('password_confirmation');
}
callback();
}
};
var validatePass2 = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入确认密码'));
} else if (value !== app.form.password) {
callback(new Error('两次输入密码不一致!'));
} else {
callback();
}
};
let app = new Vue({
el: '#page-forgotten',
data: {
form: {
email: '',
code: '',
password: '',
password_confirmation: '',
},
isCode: false,
rules: {
email: [
{required: true, message: '请输入邮箱', trigger: 'blur'},
{type: 'email', message: '请输入正确邮箱地址', trigger: 'blur'},
],
code: [
{required: true, message: '请输入验证码', trigger: 'blur'}
],
password: [
{required: true, validator: validatePass, trigger: 'blur'}
],
password_confirmation: [
{required: true, validator: validatePass2, trigger: 'blur'}
]
},
},
beforeMount () {
},
methods: {
submitForm(form) {
let _data = this.form, url = '{{ admin_name() }}/forgotten/password'
if (!this.isCode) {
url = '{{ admin_name() }}/forgotten/send_code'
}
this.$refs[form].validate((valid) => {
if (!valid) {
// layer.msg('请检查表单是否填写正确', () => {})
return;
}
$http.post(url, this.form).then((res) => {
this.$message.success(res.message);
this.$refs[form].clearValidate();
if (this.isCode) {
location = "{{ admin_route('login.show') }}"
}
this.isCode = true
})
});
}
}
})
</script>
@endpush