mirror of
https://bitbucket.org/studiotem/jandl-taskmanager-app.git
synced 2026-10-21 22:39:34 +00:00
Initial commit
This commit is contained in:
Matej Glasnák committed
commit
d76f4258f7
231 files changed
+27803
No files matched your search
@@ -0,0 +1,2 @@
|
||||
[] Nastav atributy pre automaticke ponukanie values do fieldov -> https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
|
||||
[] Pridaj toasty (napr vue-toast) a naintegruj to do toho nasho pluginu
|
||||
@@ -0,0 +1,76 @@
|
||||
.auth-card
|
||||
position: absolute
|
||||
top: 50%
|
||||
left: 50%
|
||||
transform: translate(-50%, -50%)
|
||||
border: 1px solid rgba(0, 0, 0, 0.1)
|
||||
border-radius: 16px
|
||||
padding: 30px
|
||||
width: 100%
|
||||
max-width: 486px
|
||||
margin: auto
|
||||
|
||||
img
|
||||
position: absolute
|
||||
right: 60px
|
||||
bottom: 188px
|
||||
cursor: pointer
|
||||
|
||||
.button
|
||||
color: white !important
|
||||
|
||||
.v-field
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0)
|
||||
|
||||
.error .v-field
|
||||
border-bottom: 1px solid red
|
||||
|
||||
@media screen and (max-width: 904px)
|
||||
.auth-card
|
||||
position: relative
|
||||
padding: 0
|
||||
border: none
|
||||
top: 0
|
||||
left: 0
|
||||
transform: translate(0, 0)
|
||||
|
||||
h1
|
||||
font-size: 19px
|
||||
|
||||
p
|
||||
font-size: 15px
|
||||
|
||||
.v-icon
|
||||
position: absolute !important
|
||||
right: 15px
|
||||
|
||||
.v-field--variant-solo
|
||||
box-shadow: none !important
|
||||
border: 1px solid rgba(0, 0, 0, .1) !important
|
||||
|
||||
.auth-card .error .v-field
|
||||
border: .5px solid red !important
|
||||
|
||||
.v-input__append
|
||||
margin: 0 !important
|
||||
|
||||
.v-icon
|
||||
position: absolute !important
|
||||
right: 45px
|
||||
|
||||
input::-webkit-outer-spin-button,
|
||||
input::-webkit-inner-spin-button
|
||||
-webkit-appearance: none
|
||||
|
||||
.error-message
|
||||
position: absolute
|
||||
top: 50%
|
||||
left: 30px
|
||||
color: red
|
||||
opacity: .8
|
||||
|
||||
.v-select .v-field--variant-solo
|
||||
border: none !important
|
||||
|
||||
.v-messages__message
|
||||
color: red !important
|
||||
@@ -0,0 +1,7 @@
|
||||
|
||||
export default {
|
||||
parseErrors(errors) {
|
||||
// @ts-ignore
|
||||
return Object.values(errors).map(error => error?.$message).join(', ')
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,47 @@
|
||||
<template>
|
||||
<v-form>
|
||||
<v-text-field v-model="form.email" variant="solo" bg-color="white" :hint="v$.form.email.$errors ? errorUtils.parseErrors(v$.form.email.$errors) : null" :class="{ error: v$.form.email.$errors.length }" class="mb-2" label="E-mail" autocomplete="off" />
|
||||
|
||||
<div class="d-flex flex-column">
|
||||
<v-btn class="button" color="#7F39FB" @click="submit()">Poslať kód</v-btn>
|
||||
</div>
|
||||
</v-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import useVuelidate from '@vuelidate/core'
|
||||
import { required, email } from '@vuelidate/validators'
|
||||
import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
errorUtils,
|
||||
v$: useVuelidate(),
|
||||
form: {},
|
||||
showPassword: false
|
||||
}
|
||||
},
|
||||
|
||||
validations() {
|
||||
return {
|
||||
form: {
|
||||
email: { required, email }
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
async submit() {
|
||||
if (!(await this.v$.$validate())) return
|
||||
|
||||
try {
|
||||
await this.$axios.post_data('v1/auth/forgot', this.form)
|
||||
this.$router.push({ name: 'Reset password' })
|
||||
} catch (error) {
|
||||
this.$toast.error(error.data.error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="auth-card">
|
||||
<h1>Zabudnuté heslo?</h1>
|
||||
<p class="mb-10">Na e-mail Vám odošleme overovací kód s inštrukciami, ako si obnoviť Vaše heslo</p>
|
||||
|
||||
<A-forgot-password-form />
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AForgotPasswordForm from './_components/a-forgot-password-form.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AForgotPasswordForm
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<v-form>
|
||||
<v-text-field v-model="form.email" label="E-mail" variant="solo" autocomplete="off" class="mb-2" bg-color="white" :hint="v$.form.email.$errors ? parseErrors(v$.form.email.$errors) : null" :class="{ error: v$.form.email.$errors.length }" />
|
||||
|
||||
<v-text-field v-model="form.password" :type="showPassword ? 'text' : 'password'" variant="solo" bg-color="white" class="mb-2" :counter="8" label="Heslo" autocomplete="off" :hint="v$.form.password.$errors ? errorUtils.parseErrors(v$.form.password.$errors) : null"
|
||||
:class="{ error: v$.form.password.$errors.length }" :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'" @click:append="showPassword = !showPassword" />
|
||||
|
||||
<div class="d-flex flex-column">
|
||||
<v-btn class="button" color="#7F39FB" @click="submit()">Prihlásiť sa</v-btn>
|
||||
<p class="mt-5 text-center forgot-password" @click="$router.push({ name: 'Forgot password' })">Zabudli ste heslo?</p>
|
||||
</div>
|
||||
</v-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import useVuelidate from '@vuelidate/core'
|
||||
import { required, email, minLength } from '@vuelidate/validators'
|
||||
import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
errorUtils,
|
||||
v$: useVuelidate(),
|
||||
form: {},
|
||||
showPassword: false
|
||||
}
|
||||
},
|
||||
|
||||
validations() {
|
||||
return {
|
||||
form: {
|
||||
email: {required, email },
|
||||
password: {required, minLength: minLength(8)}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
async submit() {
|
||||
if (!(await this.v$.$validate())) return console.log(this.v$)
|
||||
|
||||
try {
|
||||
await this.$axios.post_data('v1/auth/login', this.form)
|
||||
this.$router.push({ name: 'Ongoing tasks'})
|
||||
} catch (error) {
|
||||
this.$toast.error(error.data.error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="sass" scoped>
|
||||
.forgot-password:hover
|
||||
cursor: pointer
|
||||
</style>
|
||||
@@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="auth-card">
|
||||
<h1>Prihláste sa s vašim e-mailom</h1>
|
||||
<p class="mb-10">Nemáte vytvorený účet? <span class="highlight">Registrujte sa.</span></p>
|
||||
|
||||
<A-login-form />
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ALoginForm from './_components/a-login-form.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ALoginForm
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<v-form>
|
||||
<v-text-field v-model="form.code" label="Kód" bg-color="white" variant="solo" type="number" class="mb-2" :hint="v$.form.code.$errors ? errorUtils.parseErrors(v$.form.code.$errors) : null" :counter="6" :class="{ error: v$.form.code.$errors.length }" />
|
||||
|
||||
<v-text-field v-model="form.email" label="E-mail" bg-color="white" variant="solo" type="email" class="mb-2" :hint="v$.form.email.$errors ? errorUtils.parseErrors(v$.form.email.$errors) : null" :class="{ error: v$.form.email.$errors.length }" />
|
||||
|
||||
<v-text-field v-model="form.password" label="Heslo" bg-color="white" variant="solo" :type="showPassword ? 'text' : 'password'" class="mb-2" :hint="v$.form.password.$errors ? errorUtils.parseErrors(v$.form.password.$errors) : null" :class="{ error: v$.form.password.$errors.length }" :counter="8" :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'" @click:append="showPassword = !showPassword" />
|
||||
|
||||
<v-text-field v-model="form.password_confirmation" bg-color="white" variant="solo" label="Potvrdenie hesla" :type="showConfirmationPassword ? 'text' : 'password'" :counter="8" class="mb-2" :hint="v$.form.password_confirmation.$errors ? errorUtils.parseErrors(v$.form.password_confirmation.$errors) : null" :class="{ error: v$.form.password_confirmation.$errors.length }" :append-icon="showConfirmationPassword ? 'mdi-eye' : 'mdi-eye-off'" @click:append="showConfirmationPassword = !showConfirmationPassword" />
|
||||
|
||||
<div class="d-flex flex-column">
|
||||
<v-btn class="button" color="#7F39FB" @click="submit()">Zmeniť heslo</v-btn>
|
||||
</div>
|
||||
</v-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import useVuelidate from '@vuelidate/core'
|
||||
import { required, email, integer, minLength, maxLength, sameAs } from '@vuelidate/validators'
|
||||
import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
errorUtils,
|
||||
v$: useVuelidate(),
|
||||
form: {},
|
||||
showPassword: false,
|
||||
showConfirmationPassword: false
|
||||
}
|
||||
},
|
||||
|
||||
validations() {
|
||||
return {
|
||||
form: {
|
||||
code: { required, integer, minLength: minLength(6), maxLength: maxLength(6) },
|
||||
email: { required, email },
|
||||
password: { required, minLength: minLength(8) },
|
||||
password_confirmation: { required, minLength: minLength(8), sameAs: sameAs(this.form.password)}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
async submit() {
|
||||
if (!(await this.v$.$validate())) return console.log(this.v$)
|
||||
|
||||
try {
|
||||
await this.$axios.post_data('v1/auth/forgot', this.form)
|
||||
this.$router.push({ name: 'Reset password' })
|
||||
} catch (error) {
|
||||
this.$toast.error(error.data.error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="auth-card">
|
||||
<h1>Resetovať heslo</h1>
|
||||
<p class="mb-10">Overovací kód sme Vám odoslali na email. Môžete ho sem vložiť, alebo pokračovať pomocou odkazu v emaile.</p>
|
||||
|
||||
<A-reset-password-form />
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AResetPasswordForm from './_components/a-reset-password-form.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AResetPasswordForm
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in new issue
Block a user