.flex.h-full.w-full.relative.overflow-hidden
.left-col.flex.flex-col.items-center.justify-center
.logo-wrapper.absolute.left-12.top-12
img(:src="logoMark")
.login-panel.flex.flex-col.justify-center.gap-y-10
.flex.flex-col.gap-y-2
.text-welcome.flex.not-italic.font-bold.text-5xl Добро пожаловать!
.text-under.flex.not-italic.font-medium.text-base(
:style="{color: this.underTextColor}"
) Войдите в аккаунт, чтобы начать пользоваться сервисом «Астра».
.flex.flex-col.gap-y-5
base-input.font-medium(
:rule="[wrongData => !!wrongData]",
v-model="user.username",
placeholder="Введите ваш логин",
label="Логин"
outlined
)
base-input(
:rule="[wrongData => !!wrongData]",
v-model="user.password",
:type="changeType",
placeholder="Введите ваш пароль",
label="Пароль",
outlined
)
.flex.items-center.cursor-pointer
q-icon(
v-if="!wrongData && user.password"
:name="!isView ? 'visibility_off' : 'visibility'",
@click="changeView"
)
span.font-medium(:style="{color: this.redColor}", v-if="wrongData") Неверный логин или пароль
.flex.items-center.gap-x-8px
q-checkbox(@click="persist", v-model="isView", type="checkbox")
.flex.non-italic.font-medium.base Запомнить меня
base-button.font-semibold(:disabled="disabledButton", :size="48", @click="login") Войти в аккаунт
.absolute.left-12.bottom-12 2022 © Астра
.right-col.flex.items-center.justify-center.relative