Skip to content

C
CO-OP Search
Commit 9c2c7bdb authored by Kittisak Maneewong's avatar Kittisak Maneewong
Browse files
Options

update login register logout

parent 43fdcc12
Hide whitespace changes
Inline Side-by-side
Showing with 111 additions and 26 deletions
public/js/app.js
View file @ 9c2c7bdb
This source diff could not be displayed because it is too large. You can view the blob instead.
resources/js/components/Dialog.vue
View file @ 9c2c7bdb
......@@ -24,8 +24,11 @@ export default {
updated () {
if (this.dialog && this.show) {
this.show = false
this.$parent.$refs.login.resetValidation()
this.$parent.$data.clickLogin = false
if (this.$parent.$refs.login) {
this.$parent.$refs.login.resetValidation()
} else {
this.$parent.$refs.register.resetValidation()
}
} else if (!this.dialog) {
this.show = true
}
......
resources/js/components/Toolbar.vue
View file @ 9c2c7bdb
......@@ -22,7 +22,7 @@
<v-flex xs12 sm10 offset-sm1>
<v-toolbar flat color="white" > <!--v-if="page == 'app'"-->
<v-toolbar-title>
<img src="../../../public/img/banner.png" class="my-2" width="150">
<router-link to="/"><img src="../../../public/img/banner.png" class="my-2" width="150"></router-link>
</v-toolbar-title>
<v-spacer></v-spacer>
<v-btn v-if="!responsive" flat color="black" class="mx-0 px-0">
......
resources/js/store.js
View file @ 9c2c7bdb
......@@ -20,7 +20,8 @@ export default new Vuex.Store({
color: null,
text: null
},
loading: false
loading: false,
error: null
},
mutations: {
setJwt (state, payload) {
......@@ -40,6 +41,9 @@ export default new Vuex.Store({
},
setLoading (state, payload) {
state.loading = payload
},
setError (state, payload) {
state.error = payload
}
},
actions: {
......@@ -68,28 +72,43 @@ export default new Vuex.Store({
})
.catch(err => {
commit('setLoading', false)
if (err.response.data.error === 'invalid_credentials') {
commit('setError', 'ชื่อผู้ใช้หรือรหัสผ่านไม่ถูกต้อง')
setTimeout(() => {
commit('setError', null)
}, 4000);
}
console.log(err.response)
reject(err.response)
})
})
},
register ({commit}, payload) {
commit('setLoading2', true)
return new Promise((resolve, reject) => {
commit('setLoading', true)
axios.post('api/auth/register', payload)
.then(res => {
commit('setLoading', false)
commit('setSnackbar', {
show: true,
color: 'success',
text: 'ลงทะเบียนสำเร็จ!'
})
commit('setDialog', false)
console.log(res)
commit('setError', null)
resolve(res)
})
.catch(err => {
commit('setLoading', false)
console.log(err.response)
if (err.response.data == '{"email":["The email has already been taken."]}') {
this.$store.commit('setError', 'error')
commit('setError', 'อีเมลล์นี้ถูกใช้งานเเล้ว')
setTimeout(() => {
commit('setError', null)
}, 4000);
}
reject(err.response)
})
commit('setLoading2', false)
})
},
logout ({commit}) {
......@@ -145,6 +164,9 @@ export default new Vuex.Store({
},
getLoading (state) {
return state.loading
},
getError (state) {
return state.error
}
}
});
resources/js/views/Account.vue
View file @ 9c2c7bdb
......@@ -151,7 +151,7 @@ export default {
},
rules: {
required: v => !!v || 'จำเป็นต้องกรอก',
min: v => v.length > 7 || 'รหัสผ่านต้องมี 8 ตัวขึ้นไป',
min: v => v.length || 'รหัสผ่านต้องมี 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,
......
resources/js/views/Login.vue
View file @ 9c2c7bdb
......@@ -14,13 +14,6 @@
<v-container grid-list-md text-xs-center>
<v-layout row wrap>
<v-flex>
<!-- <v-alert
:value="true"
color="error"
outline
>
This is a error alert.
</v-alert> -->
<v-form @submit.prevent="login()" ref="login">
<v-text-field
label="อีเมล"
......@@ -41,6 +34,13 @@
required
></v-text-field>
<p class="text-xs-right"><router-link to="/" class="body-2 font-weight-medium">ลืมรหัสผ่าน?</router-link></p>
<p><v-alert
:value="!!error"
color="error"
outline
>
{{ error }}
</v-alert></p>
<v-btn color="deep-orange darken-4" large dark block type="submit">เข้าสู่ระบบ</v-btn>
</v-form>
<div class="my-3"><span class="font-weight-bold">หรือ</span></div>
......@@ -100,6 +100,9 @@ export default {
computed: {
loading () {
return this.$store.getters.getLoading
},
error () {
return this.$store.getters.getError
}
},
methods: {
......
resources/js/views/Register.vue
View file @ 9c2c7bdb
......@@ -21,13 +21,14 @@
>
This is a error alert.
</v-alert> -->
<v-form @submit.prevent="login()" ref="login">
<v-form @submit.prevent="register()" ref="register">
<v-layout row wrap>
<v-flex sm6 xs12>
<v-text-field
label="ชื่อ"
color="deep-orange darken-4"
clearable
v-model="registerData.first_name"
:rules="[rules.required, rules.space]"
required
class="fix-size"
></v-text-field>
......@@ -36,7 +37,8 @@
<v-text-field
label="นามสกุล"
color="deep-orange darken-4"
clearable
v-model="registerData.last_name"
:rules="[rules.required, rules.space]"
required
class="fix-size"
></v-text-field>
......@@ -45,22 +47,40 @@
<v-text-field
label="อีเมล"
color="deep-orange darken-4"
clearable
v-model="registerData.email"
:rules="[rules.required, rules.email]"
required
class="fix-size"
></v-text-field>
<v-text-field
label="รหัสผ่าน"
color="deep-orange darken-4"
v-model="registerData.password"
:rules="[rules.required, rules.min]"
:append-icon="showPassword ? 'visibility' : 'visibility_off'"
@click:append="showPassword = !showPassword"
:type="showPassword ? 'text' : 'password'"
required
class="fix-size"
></v-text-field>
<v-text-field
label="ยืนยันรหัสผ่าน"
color="deep-orange darken-4"
v-model="registerData.password_confirmation"
:rules="[rules.required, rules.min, pwdMatch]"
:append-icon="showPasswordConfirm ? 'visibility' : 'visibility_off'"
@click:append="showPasswordConfirm = !showPasswordConfirm"
:type="showPasswordConfirm ? 'text' : 'password'"
required
class="fix-size"
></v-text-field>
<p><v-alert
:value="!!error"
color="error"
outline
>
{{ error }}
</v-alert></p>
<v-btn color="deep-orange darken-4 my-4" block dark large type="submit">สมัครสมาชิก</v-btn>
</v-form>
</v-flex>
......@@ -70,6 +90,26 @@
</v-layout>
</v-card>
</Dialog>
<v-dialog
v-model="loading"
hide-overlay
persistent
width="300"
>
<v-card
color="deep-orange darken-4"
dark
>
<v-card-text>
กำลังลงทะเบียน
<v-progress-linear
indeterminate
color="white"
class="mb-0"
></v-progress-linear>
</v-card-text>
</v-card>
</v-dialog>
</div>
</template>
......@@ -81,24 +121,41 @@ export default {
},
data () {
return {
loginData: {
email_users: '',
registerData: {
first_name: '',
last_name: '',
email: '',
password: '',
password_confirmation: '',
role: 1
},
showPassword: false,
showPasswordConfirm: false,
rules: {
required: v => !!v || 'จำเป็นต้องกรอก',
min: v => v.length > 7 || 'รหัสผ่านต้องมี 8 ตัวขึ้นไป',
space: v => !(/ /.test(v)) || 'ห้ามเว้นวรรค',
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) || 'รูปแบบอีเมลล์ไม่ถูกต้อง'
}
}
},
computed: {
pwdMatch () {
return (this.registerData.password === this.registerData.password_confirmation) || 'รหัสผ่านไม่ตรงกัน'
},
error () {
return this.$store.getters.getError
},
loading () {
return this.$store.getters.getLoading
}
},
methods: {
login () {
if(this.$refs.login.validate()) {
this.$store.dispatch('login', this.loginData)
register () {
if(this.$refs.register.validate()) {
this.$store.dispatch('register', this.registerData)
.then(res => {
this.$refs.login.reset()
this.$refs.register.reset()
})
}
}
......
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