我开发了一个没有角色列的用户表，现在我想在我的迁移表中添加角色列，该表包含admin或user，如果注册人员在前端UI页面中选择用户单选按钮btn，则角色应更新为用户，或者如果该人员选择管理员，则角色在我的迁移表中应更改为管理员[在poster中，还应如何根据角色传递角色，值应在我的数据库表中更改]请帮助我解决此问题
UsersMigration table
<?php
use IlluminateDatabaseMigrationsMigration;
use IlluminateDatabaseSchemaBlueprint;
use IlluminateSupportFacadesSchema;
class CreateUsersTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('users', function (Blueprint $table) {
$table->id();
$table->string('fullName');
$table->string('email')->unique();
$table->string('mobile')->unique();
$table->string('email_verified_at')->nullable();
$table->string('password');
$table->enum('role', ['user', 'admin'])->default('user'); //here
$table->rememberToken();
$table->timestamps();
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::dropIfExists('users');
}
}
UserRegisterController.php
<?php
namespace AppHttpControllers;
use IlluminateHttpRequest;
use AppModelsUser;
use JWTAuth;
use TymonJWTAuthExceptionsJWTException;
class UserController extends Controller
{
// AWS_USE_PATH_STYLE_ENDPOINT=false
public function __construct() {
$this->middleware('auth:api', ['except' => ['login', 'register']]);
}
public function register(Request $request)
{
$this->validate($request, [
'fullName'=>'required|string|between:3,15',
'email'=>'required|email|unique:users',
'password'=>'required|regex:/^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{6,}$/',
'mobile'=>'required|digits:10'
]);
$user = new User([
'fullName'=> $request->input('fullName'),
'email'=> $request->input('email'),
'password'=> bcrypt($request->input('password')),
'mobile'=>$request->input('mobile')
]);
$user->save();
return response()->json(['message'=>'Successfully Created user'],201);
}
}
我正在粘贴我的前端UI页面，它应该用vue.js编写Register.vue
<template>
<div class="main">
<div v-if="flag==true" class="container">
<img id="side-img" src="../assets/sideImg.png" alt="notFound" />
<p id="side-content">Online Book Shopping</p>
<div class="box">
<div class="headings">
<h5 class="signin" v-on:click="flip();" id="login" :class="{ active: isLogin }" @click="isLogin = true">Login</h5>
<h5 class="signup" id="signup" :class="{ active: !isLogin }" @click="isLogin = false">signup</h5>
</div>
<form ref="myForm" @submit.prevent="handlesubmit">
<div class="fullname">
<p>FullName</p>
<input type="name" id="name-input" class="namebox" required v-model="fullName" autocomplete="off" pattern="[A-Za-z]{3,12}">
</div>
<div class="username">
<p>EmailID</p>
<input type="email" id="Email-input" class="emailbox" autocomplete="off" required v-model="email" pattern="^[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,4}$">
</div>
<div class="password-section">
<p>Password</p>
<input :type="password_type" class="password" :class="{'password-visible': isPasswordVisible }" id="passField" v-model="password" pattern="^(?=.*[a-z])(?=.*[A-Z])(?=.*d)(?=.*[@$!%*?&])[A-Za-zd@$!%*?&]{6,}$" required>
<i class="bi bi-eye-slash" id="togglePassword" @click="togglePassword();"></i>
</div>
<div class="mobile">
<p>MobileNumber</p>
<input type="tel" class="telephone" autocomplete="off" v-model="mobile" id="tel" pattern="^d{10}$" required>
</div>
<div class="role-btns">
<input type="radio" id="user" name="user" vlaue="user" >
<label for="user" class="radio-label">User</label>
<input type="radio" id="admin" name="user" value="admin">
<label for="admin">Admin</label>
</div>
<button class="btn-section" id="btn" type="submit">Signup</button>
</form>
</div>
</div>
<Login v-if="flag==false" />
</div>
</template>
<script>
import service from '../service/User'
export default {
name: 'Register',
components: {
Login: () => import('./Login.vue')
},
data() {
return {
fullName: '',
email: '',
password: '',
mobile: '',
password_type: "password",
isLogin: false,
isPasswordVisible: false,
flag: true,
title: 'Online Book Shopping'
}
},
methods: {
flip() {
this.flag = !this.flag;
},
togglePassword() {
this.password_type = this.password_type === 'password' ? 'text' : 'password'
this.isPasswordVisible = !this.isPasswordVisible
},
handlesubmit() {
let userData = {
fullName: this.fullName,
email: this.email,
password: this.password,
mobile: this.mobile
}
service.userRegister(userData).then(response => {
if (response.status == 201) {
alert("user registered successfully");
this.$refs.myForm.reset();
this.$router.push('/login');
}
return response;
}).catch(error => {
alert("invalid credentials");
return error;
})
}
}
}
</script>
<style lang="scss" scoped>
@import "@/styles/Register.scss";
</style>
更改无线电名称
<div class="role-btns">
<input type="radio" id="user" name="role" vlaue="user" >
<label for="user" class="radio-label">User</label>
<input type="radio" id="admin" name="role" value="admin">
<label for="admin">Admin</label>
</div>
和控制器
$this->validate($request, [
'fullName'=>'required|string|between:3,15',
'email'=>'required|email|unique:users',
'password'=>'required|regex:/^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{6,}$/',
'mobile'=>'required|digits:10',
'role'=>'required|in:user,admin'
]);
$user = new User([
'fullName'=> $request->input('fullName'),
'email'=> $request->input('email'),
'password'=> bcrypt($request->input('password')),
'mobile'=>$request->input('mobile') ,
'role'=>$request->role ,
]);
$user->save();