Commit 919023ab authored by Kittisak Maneewong's avatar Kittisak Maneewong

make login

parent 0d4c785a
...@@ -20,7 +20,8 @@ class AuthController extends Controller ...@@ -20,7 +20,8 @@ class AuthController extends Controller
{ {
if ($request->json()->get('role') == 1) { if ($request->json()->get('role') == 1) {
$validator = Validator::make($request->json()->all() , [ $validator = Validator::make($request->json()->all() , [
'name' => 'required|string|max:255', 'first_name' => 'required|string|max:255',
'last_name' => 'required|string|max:255',
'email' => 'required|string|email|max:255|unique:users,email_users', 'email' => 'required|string|email|max:255|unique:users,email_users',
'password' => 'required|string|min:8|confirmed', 'password' => 'required|string|min:8|confirmed',
]); ]);
...@@ -30,7 +31,7 @@ class AuthController extends Controller ...@@ -30,7 +31,7 @@ class AuthController extends Controller
} }
$user = User::create([ $user = User::create([
'name' => $request->json()->get('name'), 'name' => $request->json()->get('first_name')." ".$request->json()->get('last_name'),
'password' => Hash::make($request->json()->get('password')), 'password' => Hash::make($request->json()->get('password')),
'email_users' => $request->json()->get('email'), 'email_users' => $request->json()->get('email'),
]); ]);
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn small="" dark color="deep-orange darken-4" class="elevation-0" @click="$router.push('/employer/login')">สำหรับผู้ประกอบการ</v-btn> <v-btn small="" dark color="deep-orange darken-4" class="elevation-0" @click="$router.push('/employer/login')">สำหรับผู้ประกอบการ</v-btn>
<v-divider inset vertical></v-divider> <v-divider inset vertical></v-divider>
<v-btn round small outline color="deep-orange darken-4"> <v-btn round small outline color="deep-orange darken-4" @click="$router.push('/account')">
<v-icon>person</v-icon> เข้าสู่ระบบ / สมัครสมาชิก <v-icon>person</v-icon> เข้าสู่ระบบ / สมัครสมาชิก
</v-btn> </v-btn>
</v-toolbar> </v-toolbar>
......
import Vue from 'vue'; import Vue from 'vue';
import Vuex from 'vuex'; import Vuex from 'vuex';
import router from './route';
Vue.use(Vuex); Vue.use(Vuex);
export default new Vuex.Store({ export default new Vuex.Store({
state: { state: {
message: 'Kittisak Maneewong' message: 'Kittisak Maneewong',
jwt: localStorage.getItem('access_token') || null,
jwt_employer: localStorage.getItem('access_token_employer') || null,
loading1: false,
loading2: false,
error: null
}, },
mutations: { mutations: {
setJwt (state, payload) {
state.jwt = payload
},
setJwtEmployer (state, payload) {
state.jwt_employer = payload
},
setLoading1 (state, payload) {
state.loading1 = payload
},
setLoading2 (state, payload) {
state.loading2 = payload
},
setError (state, payload) {
state.error = payload
}
}, },
actions: { actions: {
login ({commit}, payload) {
return new Promise((resolve, reject) => {
axios.post('api/auth/login', payload)
.then(res => {
if (payload.role == 1) {
localStorage.setItem('access_token', res.data.token)
commit('setJwt', res.data.token)
router.push('/')
} else {
localStorage.setItem('access_token_employer', res.data.token)
commit('setJwtEmployer', res.data.token)
}
console.log(res)
resolve(res)
})
.catch(err => {
console.log(err.response)
reject(err.response)
})
})
},
register ({commit}, payload) {
commit('setLoading2', true)
return new Promise((resolve, rejeect) => {
axios.post('api/auth/register', payload)
.then(res => {
console.log(res)
commit('setError', null)
resolve(res)
})
.catch(err => {
console.log(err.response)
if (err.response.data == '{"email":["The email has already been taken."]}') {
this.$store.commit('setError', 'error')
}
rejeect(err.response)
})
commit('setLoading2', false)
})
}
}, },
getters: { getters: {
welcome (state) { welcome (state) {
return state.message; return state.message
},
getJwt (state) {
return state.jwt
},
getJwtEmployer (state) {
return state.jwt_employer;
},
getLoading1 (state) {
return state.loading1
},
getLoading2 (state) {
return state.loading2
},
getError (state) {
return state.error
} }
} }
}); });
...@@ -6,23 +6,33 @@ ...@@ -6,23 +6,33 @@
<div class="text-sm-left mb-4"> <div class="text-sm-left mb-4">
<span class="headline font-weight-bold">เข้าสู่ระบบ</span> <span class="headline font-weight-bold">เข้าสู่ระบบ</span>
</div> </div>
<v-form @submit.prevent="login()"> <v-form @submit.prevent="login()" v-model="formLogin" ref="login">
<v-text-field <v-text-field
label="อีเมล" label="อีเมล"
prepend-inner-icon="email" :rules="[rules.required]"
color="primary" color="primary"
class="fix-size red--text" class="fix-size red--text"
type="email" type="email"
v-model="loginData.email" v-model="loginData.email_users"
></v-text-field> ></v-text-field>
<v-text-field <v-text-field
label="รหัสผ่าน" label="รหัสผ่าน"
type="password"
color="primary" color="primary"
prepend-inner-icon="lock" :rules="[rules.required]"
:append-icon="showPasswordLogin ? 'visibility' : 'visibility_off'"
@click:append="showPasswordLogin = !showPasswordLogin"
v-model="loginData.password" v-model="loginData.password"
:type="showPasswordLogin ? 'text' : 'password'"
></v-text-field> ></v-text-field>
<p class="text-xs-right"><router-link to="/" class="body-2 font-weight-medium">ลืมรหัสผ่าน?</router-link></p> <p class="text-xs-right"><router-link to="/" class="body-2 font-weight-medium">ลืมรหัสผ่าน?</router-link></p>
<v-alert
:value="loginError"
color="error"
icon="warning"
outline
>
อีเมลหรือรหัสผ่านไม่ถูกต้อง!
</v-alert>
<v-btn color="blue" large dark block type="submit">เข้าสู่ระบบ</v-btn> <v-btn color="blue" large dark block type="submit">เข้าสู่ระบบ</v-btn>
</v-form> </v-form>
<div class="my-3"><span class="font-weight-bold">หรือ</span></div> <div class="my-3"><span class="font-weight-bold">หรือ</span></div>
...@@ -38,12 +48,13 @@ ...@@ -38,12 +48,13 @@
<div class="text-sm-left mb-4"> <div class="text-sm-left mb-4">
<span class="headline font-weight-bold">สมัครสมาชิก</span> <span class="headline font-weight-bold">สมัครสมาชิก</span>
</div> </div>
<v-form @submit.prevent="register()"> <v-form @submit.prevent="register()" ref="register" v-model="formRegister">
<v-layout row wrap> <v-layout row wrap>
<v-flex sm6 xs12> <v-flex sm6 xs12>
<v-text-field <v-text-field
label="ชื่อ" label="ชื่อ"
v-model="registerData.first_name" v-model="registerData.first_name"
:rules="[rules.required]"
clearable clearable
required required
class="fix-size" class="fix-size"
...@@ -53,6 +64,7 @@ ...@@ -53,6 +64,7 @@
<v-text-field <v-text-field
label="นามสกุล" label="นามสกุล"
v-model="registerData.last_name" v-model="registerData.last_name"
:rules="[rules.required]"
clearable clearable
required required
class="fix-size" class="fix-size"
...@@ -62,6 +74,7 @@ ...@@ -62,6 +74,7 @@
<v-text-field <v-text-field
label="อีเมล" label="อีเมล"
v-model="registerData.email" v-model="registerData.email"
:rules="clickRegister ? [rules.required, rules.email] : [rules.required]"
clearable clearable
required required
class="fix-size" class="fix-size"
...@@ -69,24 +82,54 @@ ...@@ -69,24 +82,54 @@
<v-text-field <v-text-field
label="รหัสผ่าน" label="รหัสผ่าน"
v-model="registerData.password" v-model="registerData.password"
:rules="clickRegister ? [rules.required, rules.min] : [rules.required]"
:append-icon="showPassword ? 'visibility' : 'visibility_off'"
@click:append="showPassword = !showPassword"
clearable clearable
type="password" :type="showPassword ? 'text' : 'password'"
hint="รหัสผ่านต้องมี 8 ตัวขึ้นไป"
required required
class="fix-size" class="fix-size"
></v-text-field> ></v-text-field>
<v-text-field <v-text-field
label="ยืนยันรหัสผ่าน" label="ยืนยันรหัสผ่าน"
v-model="registerData.password_confirmation" v-model="registerData.password_confirmation"
:rules="clickRegister ? [rules.required, rules.min, pwdMatch] : [rules.required]"
:append-icon="showPasswordConfirm ? 'visibility' : 'visibility_off'"
@click:append="showPasswordConfirm = !showPasswordConfirm"
clearable clearable
type="password" hint="รหัสผ่านต้องมี 8 ตัวขึ้นไป"
:type="showPasswordConfirm ? 'text' : 'password'"
required required
class="fix-size" class="fix-size"
></v-text-field> ></v-text-field>
<v-btn color="red accent-3 my-4" block dark large type="submit">สมัครสมาชิก</v-btn> <v-alert
:value="error"
color="error"
icon="warning"
outline
>
อีเมลนี้ถูกใช้งานเเล้ว
</v-alert>
<v-btn color="red accent-3 my-4" block dark large type="submit" :loading="loading2">สมัครสมาชิก</v-btn>
</v-form> </v-form>
</v-flex> </v-flex>
</v-layout> </v-layout>
</v-container> </v-container>
<v-snackbar
v-model="snackbar"
color="success"
:timeout="6000"
>
ลงทะเบียนสำเร็จ!
<v-btn
dark
flat
@click="snackbar = false"
>
ปิด
</v-btn>
</v-snackbar>
</div> </div>
</template> </template>
...@@ -95,8 +138,9 @@ export default { ...@@ -95,8 +138,9 @@ export default {
data () { data () {
return { return {
loginData: { loginData: {
email: '', email_users: '',
password: '' password: '',
role: 1
}, },
registerData: { registerData: {
first_name: '', first_name: '',
...@@ -104,59 +148,78 @@ export default { ...@@ -104,59 +148,78 @@ export default {
email: '', email: '',
password: '', password: '',
password_confirmation: '' password_confirmation: ''
},
rules: {
required: v => !!v || 'จำเป็นต้องกรอก',
min: v => v.length > 7 || 'รหัสผ่านต้องมี 8 ตัวขึ้นไป',
email: v => /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(v) || 'รูปแบบอีเมลล์ไม่ถูกต้อง'
},
showPassword: false,
showPasswordConfirm: false,
showPasswordLogin: false,
clickRegister: false,
snackbar: false,
formRegister: false,
formLogin: false,
loginError: false
} }
},
computed: {
pwdMatch () {
return (this.registerData.password === this.registerData.password_confirmation) || 'รหัสผ่านไม่ตรง'
},
loading2 () {
return this.$store.getters.getLoading2
},
error () {
return this.$store.getters.getError
} }
}, },
methods: { methods: {
login () { login () {
axios.post('api/auth/login', this.loginData) this.$refs.login.validate()
.then((res) => { if(this.formLogin) {
console.log(res) this.$store.dispatch('login', this.loginData)
this.$router.push('/') .catch(err => {
}) console.log(err)
.catch((err) => { this.loginError = true
console.log(err.response)
}) })
}
}, },
register () { register () {
axios.post('api/auth/register', { this.clickRegister = true
name: this.registerData.first_name + ' ' + this.registerData.last_name, this.$refs.register.validate()
if(this.formRegister) {
this.$store.dispatch('register', {
first_name: this.registerData.first_name,
last_name: this.registerData.last_name,
email: this.registerData.email, email: this.registerData.email,
password: this.registerData.password, password: this.registerData.password,
password_confirmation: this.registerData.password_confirmation password_confirmation: this.registerData.password_confirmation,
role: 1
}) })
.then((res) => { .then(res => {
this.$router.push('/account'); this.snackbar = true
this.registerData = { this.registerData= {
first_name: '', first_name: '',
last_name: '', last_name: '',
email: '', email: '',
password: '', password: '',
password_confirmation: '' password_confirmation: ''
} }
console.log(res) this.clickRegister = false
}) this.$refs.register.resetValidation()
.catch((err) => {
console.log(err.response)
}) })
} }
}, }
mounted () {
axios.get('api/user')
.then((res) => {
console.log(res.body)
})
.catch((err) => {
console.log(err.response)
})
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.fix-size { // .fix-size {
height: 50px; // height: 50px;
} // }
</style> </style>
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<v-btn color="brown darken-2" large dark block type="submit">เข้าสู่ระบบ</v-btn> <v-btn color="brown darken-2" large dark block type="submit">เข้าสู่ระบบ</v-btn>
</v-form> </v-form>
<v-layout row wrap justify-center class="my-2"> <v-layout row wrap justify-center class="my-2">
<span class="body-2 font-weight-medium">ยังไม่มีบัญชีผู้ใช้? <a href="#">สมัครสมาชิก</a></span> <span class="body-2 font-weight-medium">ยังไม่มีบัญชีผู้ใช้? <router-link to="/employer/register" href="#">สมัครสมาชิก</router-link></span>
</v-layout> </v-layout>
</v-flex> </v-flex>
......
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
<v-btn color="brown darken-2 my-3" dark type="submit">สมัครสมาชิก</v-btn> <v-btn color="brown darken-2 my-3" dark type="submit">สมัครสมาชิก</v-btn>
</v-layout> </v-layout>
<v-layout row wrap justify-center> <v-layout row wrap justify-center>
<span class="body-2 font-weight-medium">มีบัญชีผู้ใช้แล้ว? <a href="#">เข้าสู่ระบบ</a></span> <span class="body-2 font-weight-medium">มีบัญชีผู้ใช้แล้ว? <router-link to="/employer/login">เข้าสู่ระบบ</router-link></span>
</v-layout> </v-layout>
</v-form> </v-form>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment