WIP Исправлены baseInputs на TheLogin
This commit is contained in:
@@ -104,7 +104,7 @@ export default {
|
|||||||
box-shadow: 1px 1px 8px rgba(37, 40, 80, 0.15)
|
box-shadow: 1px 1px 8px rgba(37, 40, 80, 0.15)
|
||||||
border-radius: 4px
|
border-radius: 4px
|
||||||
background-color: white
|
background-color: white
|
||||||
max-height: 140px
|
max-height: 142px
|
||||||
overflow-y: auto
|
overflow-y: auto
|
||||||
.placeholder
|
.placeholder
|
||||||
color: #090A15
|
color: #090A15
|
||||||
|
|||||||
@@ -2,13 +2,14 @@
|
|||||||
.flex.flex-col.gap-y-2
|
.flex.flex-col.gap-y-2
|
||||||
.label.font-semibold.text-sm.opacity-40(v-if="label") {{ label }}
|
.label.font-semibold.text-sm.opacity-40(v-if="label") {{ label }}
|
||||||
.input-wrapper.flex.gap-x-2.px-4.box-border.py-10px(
|
.input-wrapper.flex.gap-x-2.px-4.box-border.py-10px(
|
||||||
:class="{'border-none': borderNone}"
|
:class="{'border-none': borderNone, 'border-error': borderError }"
|
||||||
:style="{'background-color': disabled && 'var(--bg-disable-grey-color)'}"
|
:style="{'background-color': disabled && 'var(--bg-disable-grey-color)'}"
|
||||||
)
|
)
|
||||||
input.input.w-full.outline-0.not-italic(
|
input.input.w-full.outline-0.not-italic(
|
||||||
v-model="value",
|
v-model="value",
|
||||||
:placeholder="placeholder",
|
:placeholder="placeholder",
|
||||||
:disabled="disabled"
|
:disabled="disabled",
|
||||||
|
:type="type"
|
||||||
)
|
)
|
||||||
.slot(v-if="withIcon", :class="iconPosition")
|
.slot(v-if="withIcon", :class="iconPosition")
|
||||||
slot.cursor-pointer
|
slot.cursor-pointer
|
||||||
@@ -18,6 +19,9 @@
|
|||||||
export default {
|
export default {
|
||||||
name: "BaseInput",
|
name: "BaseInput",
|
||||||
props: {
|
props: {
|
||||||
|
type: {
|
||||||
|
derault: "text",
|
||||||
|
},
|
||||||
modelValue: String,
|
modelValue: String,
|
||||||
withIcon: {
|
withIcon: {
|
||||||
default: false,
|
default: false,
|
||||||
@@ -27,6 +31,7 @@ export default {
|
|||||||
},
|
},
|
||||||
placeholder: String,
|
placeholder: String,
|
||||||
borderNone: Boolean,
|
borderNone: Boolean,
|
||||||
|
borderError: Boolean,
|
||||||
disabled: Boolean,
|
disabled: Boolean,
|
||||||
label: String,
|
label: String,
|
||||||
},
|
},
|
||||||
@@ -58,6 +63,8 @@ export default {
|
|||||||
height: 40px
|
height: 40px
|
||||||
.border-none
|
.border-none
|
||||||
border: none
|
border: none
|
||||||
|
.border-error
|
||||||
|
border-color: var(--border-red-color)
|
||||||
.input
|
.input
|
||||||
background-color: inherit
|
background-color: inherit
|
||||||
&:disabled, &[disabled]
|
&:disabled, &[disabled]
|
||||||
|
|||||||
@@ -9,18 +9,16 @@
|
|||||||
.text-under.flex.not-italic.font-medium.text-base(
|
.text-under.flex.not-italic.font-medium.text-base(
|
||||||
:style="{color: this.underTextColor}") Войдите в аккаунт, чтобы начать пользоваться сервисом «Астра».
|
:style="{color: this.underTextColor}") Войдите в аккаунт, чтобы начать пользоваться сервисом «Астра».
|
||||||
.flex.flex-col.gap-y-5
|
.flex.flex-col.gap-y-5
|
||||||
.flex.flex-col.gap-y-6px
|
base-input.font-medium(
|
||||||
.flex.non-italic.font-semibold.text-xss Логин
|
:borderError="wrongData",
|
||||||
base-input.h-12.font-medium(
|
|
||||||
:style="{borderColor: wrongData ? this.redColor : ''}",
|
|
||||||
v-model="user.username",
|
v-model="user.username",
|
||||||
type="text",
|
placeholder="Введите ваш логин",
|
||||||
placeholder="Введите ваш логин"
|
label="Логин"
|
||||||
)
|
)
|
||||||
.flex.flex-col.gap-y-6px.relative
|
.flex.flex-col.gap-y-6px.relative
|
||||||
.flex.non-italic.font-semibold.text-xss Пароль
|
.flex.non-italic.font-semibold.text-sm.opacity-40 Пароль
|
||||||
base-input.h-12(
|
base-input(
|
||||||
:style="{borderColor: wrongData ? this.redColor : ''}",
|
:borderError="wrongData",
|
||||||
v-model="user.password",
|
v-model="user.password",
|
||||||
:type="changeType",
|
:type="changeType",
|
||||||
placeholder="Введите ваш пароль"
|
placeholder="Введите ваш пароль"
|
||||||
|
|||||||
@@ -2,12 +2,8 @@
|
|||||||
.wrapper-bar.flex.flex-col.gap-y-4
|
.wrapper-bar.flex.flex-col.gap-y-4
|
||||||
.flex.px-5.py-5.w-full.justify-around.gap-x-4
|
.flex.px-5.py-5.w-full.justify-around.gap-x-4
|
||||||
.time-wrapper.flex.justify-between
|
.time-wrapper.flex.justify-between
|
||||||
.flex.flex-col.items-center.py-14px.px-4.gap-y-14px
|
base-input-time.py-14px.px-4(v-model="times.start_time", label="Начало")
|
||||||
.text.text-smm Начало
|
base-input-time.py-14px.px-4(v-model="times.end_time", label="Конец")
|
||||||
base-input-time.select(v-model="times.start_time")
|
|
||||||
.flex.flex-col.items-center.py-14px.px-4.gap-y-14px
|
|
||||||
.text.span.text-smm Конец
|
|
||||||
base-input-time.select(v-model="times.end_time")
|
|
||||||
.status-wrapper.flex.flex-col
|
.status-wrapper.flex.flex-col
|
||||||
.flex.justify-center.items-center.h-10
|
.flex.justify-center.items-center.h-10
|
||||||
span.font-semibold Статусы
|
span.font-semibold Статусы
|
||||||
@@ -140,9 +136,4 @@ export default {
|
|||||||
.graph-template
|
.graph-template
|
||||||
width: 218px
|
width: 218px
|
||||||
height: 40px
|
height: 40px
|
||||||
|
|
||||||
.select
|
|
||||||
height: 40px
|
|
||||||
border: 1.5px solid var(--border-light-grey-color)
|
|
||||||
border-radius: 4px
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user