Files
barg-restuarant/pages/admin/login.vue
T
hamid.zarghami1@gmail.com e644edbd65 transfer project in github
2024-05-12 15:29:27 +03:30

140 lines
4.4 KiB
Vue

<template>
<CRow class="justify-content-center">
<CCol lg="5">
<CCardGroup>
<CCard class="p-4">
<CCardBody>
<CForm @submit.prevent="doLogin">
<h1 class="text-muted text-center mb-5">پنل مدیریت کافه رستوران برگ</h1>
<CInput
:class="validation.username ? 'err' : null"
placeholder="نام کاربری"
:description="validation.username ? validation.username.msg : null"
autocomplete="username email"
v-model="login.username"
>
<template #prepend-content>
<CIcon name="cil-user"/>
</template>
</CInput>
<div class="butt">
<CInput
:class="validation.password ? 'err' : null"
placeholder="کلمه عبور"
:type="passwordState"
:description="validation.password ? validation.password.msg : null"
autocomplete="curent-password"
v-model="login.password"
>
<template #prepend-content>
<CIcon name="cil-lock-locked"/>
</template>
</CInput>
<i @click="showPass = !showPass" class="far fa-eye"></i>
</div>
<CInputCheckbox label="مرا به خاطر بسپار" @update:checked="val => login.remember_me = val"/>
<p class="text-muted mt-3" style="font-size: 11px;">*درصورتی که گزینه "مرا به خاطر بسپار" را فعال نکنید بعد از 1 ساعت باید دوباره وارد سیستم شوید.</p>
<CRow>
<CCol col="12" class="text-right mt-2">
<CButton color="primary" type="submit" class="px-4">ورود</CButton>
</CCol>
<!-- <CCol col="6" class="text-right">-->
<!-- <CButton color="link" class="px-0">Forgot password?</CButton>-->
<!-- <CButton color="link" class="d-lg-none">Register now!</CButton>-->
<!-- </CCol>-->
</CRow>
</CForm>
</CCardBody>
</CCard>
<!-- <CCard-->
<!-- color="primary"-->
<!-- text-color="white"-->
<!-- class="text-center py-5 d-md-down-none"-->
<!-- body-wrapper>-->
<!-- <CCardBody>-->
<!-- <h2>Sign up</h2>-->
<!-- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>-->
<!-- <CButton-->
<!-- color="light"-->
<!-- variant="outline"-->
<!-- size="lg"-->
<!-- >-->
<!-- Register Now!-->
<!-- </CButton>-->
<!-- </CCardBody>-->
<!-- </CCard>-->
</CCardGroup>
</CCol>
</CRow>
</template>
<script>
export default {
data() {
return {
showPass: false,
login: {
username: '',
password: '',
remember_me: false
},
validation: {}
}
},
computed: {
passwordState() {
return this.showPass ? "text" : "password"
},
branchId(){
return this.$store?.state?.admin?.branchId
}
},
methods: {
doLogin() {
this.validation = {}
this?.$auth?.logout()
this.$auth.loginWith('local', {
data: this.login
})
.then(response => {
window.location.replace(`/admin`)
})
.catch(err => {
if (err?.response?.status === 422) this.validation = err?.response?.data?.validation
else console.log(err?.message)
})
}
},
layout: 'admin-auth'
}
</script>
<style lang="scss">
.butt {
position: relative;
i {
position: absolute;
left: 7px;
top: 11px;
z-index: 3;
cursor: pointer;
color: rgba(#000, 0.5);
-webkit-transition: 0.2s;
-moz-transition: 0.2s;
-ms-transition: 0.2s;
-o-transition: 0.2s;
transition: 0.2s;
&:hover {
color: #000;
}
}
}
</style>