forked from verdnatura/salix-front
feat(app.scss): vn-horizontal flex direction column refs #6118
This commit is contained in:
parent
9dd69dbcb7
commit
edf6de2510
|
@ -1,12 +0,0 @@
|
||||||
<template>
|
|
||||||
<div id="row">
|
|
||||||
<slot></slot>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<style lang="scss" scopped>
|
|
||||||
@media screen and (max-width: 800px) {
|
|
||||||
#row {
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -39,3 +39,11 @@ body.body--dark {
|
||||||
--vn-gray: #313131;
|
--vn-gray: #313131;
|
||||||
--vn-label: #a8a8a8;
|
--vn-label: #a8a8a8;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html [vn-horizontal],
|
||||||
|
vn-horizontal,
|
||||||
|
.vn-horizontal {
|
||||||
|
@media screen and (max-width: 800px) {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -6,7 +6,6 @@ import { useI18n } from 'vue-i18n';
|
||||||
import { useSession } from 'src/composables/useSession';
|
import { useSession } from 'src/composables/useSession';
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'components/FetchData.vue';
|
||||||
import FormModel from 'components/FormModel.vue';
|
import FormModel from 'components/FormModel.vue';
|
||||||
import VnRow from 'components/ui/VnRow.vue';
|
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
@ -100,7 +99,7 @@ const statesFilter = {
|
||||||
model="claim"
|
model="claim"
|
||||||
>
|
>
|
||||||
<template #form="{ data, validate, filter }">
|
<template #form="{ data, validate, filter }">
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QInput
|
<QInput
|
||||||
v-model="data.client.name"
|
v-model="data.client.name"
|
||||||
|
@ -137,8 +136,8 @@ const statesFilter = {
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</QInput>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QSelect
|
<QSelect
|
||||||
v-model="data.workerFk"
|
v-model="data.workerFk"
|
||||||
|
@ -184,8 +183,8 @@ const statesFilter = {
|
||||||
>
|
>
|
||||||
</QSelect>
|
</QSelect>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QInput
|
<QInput
|
||||||
v-model.number="data.packages"
|
v-model.number="data.packages"
|
||||||
|
@ -201,15 +200,15 @@ const statesFilter = {
|
||||||
:rules="validate('claim.rma')"
|
:rules="validate('claim.rma')"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QCheckbox
|
<QCheckbox
|
||||||
v-model="data.hasToPickUp"
|
v-model="data.hasToPickUp"
|
||||||
:label="t('claim.basicData.picked')"
|
:label="t('claim.basicData.picked')"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
</template>
|
</template>
|
||||||
</FormModel>
|
</FormModel>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -6,7 +6,7 @@ import { useI18n } from 'vue-i18n';
|
||||||
import { useSession } from 'src/composables/useSession';
|
import { useSession } from 'src/composables/useSession';
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'components/FetchData.vue';
|
||||||
import FormModel from 'components/FormModel.vue';
|
import FormModel from 'components/FormModel.vue';
|
||||||
import VnRow from 'components/ui/VnRow.vue';
|
import vn-horizontal from 'components/ui/vn-horizontal.vue';
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
@ -62,7 +62,7 @@ const filterOptions = {
|
||||||
<div class="column items-center">
|
<div class="column items-center">
|
||||||
<FormModel :url="`Clients/${route.params.id}`" model="customer">
|
<FormModel :url="`Clients/${route.params.id}`" model="customer">
|
||||||
<template #form="{ data, validate, filter }">
|
<template #form="{ data, validate, filter }">
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QInput
|
<QInput
|
||||||
v-model="data.socialName"
|
v-model="data.socialName"
|
||||||
|
@ -84,8 +84,8 @@ const filterOptions = {
|
||||||
:input-debounce="0"
|
:input-debounce="0"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QInput
|
<QInput
|
||||||
v-model="data.contact"
|
v-model="data.contact"
|
||||||
|
@ -103,8 +103,8 @@ const filterOptions = {
|
||||||
clearable
|
clearable
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QInput
|
<QInput
|
||||||
v-model="data.phone"
|
v-model="data.phone"
|
||||||
|
@ -121,8 +121,8 @@ const filterOptions = {
|
||||||
clearable
|
clearable
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
<VnRow class="row q-gutter-md q-mb-md">
|
<vn-horizontal class="row q-gutter-md q-mb-md">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<QSelect
|
<QSelect
|
||||||
v-model="data.salesPersonFk"
|
v-model="data.salesPersonFk"
|
||||||
|
@ -163,7 +163,7 @@ const filterOptions = {
|
||||||
:input-debounce="0"
|
:input-debounce="0"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</VnRow>
|
</vn-horizontal>
|
||||||
</template>
|
</template>
|
||||||
</FormModel>
|
</FormModel>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue