wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

Update Wagon List styles

This commit is contained in:
Kevin Martinez 2023-11-28 23:06:30 -03:00
parent ce4f7d79ed
commit 36028afa37
3 changed files with 64 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/pages/Wagon/Type/WagonTypeCreate.vue
View File

@ -248,7 +248,7 @@ function exceedMaxHeight(pos) {
:rules="[(val) => !!val || t('wagon.warnings.nameNotEmpty')]" :rules="[(val) => !!val || t('wagon.warnings.nameNotEmpty')]"
/> />
<QCheckbox class="q-mb-sm" v-model="divisible" label="Divisible" /> <QCheckbox class="q-mb-sm" v-model="divisible" label="Divisible" />
<div class="wagon-tray q-mx-xl" v-for="tray in wagon" :key="tray.id"> <div class="wagon-tray q-mx-lg" v-for="tray in wagon" :key="tray.id">
<div class="position"> <div class="position">
<QInput <QInput
autofocus autofocus
@ -374,7 +374,7 @@ function exceedMaxHeight(pos) {
display: flex; display: flex;
height: 6rem; height: 6rem;
.position { .position {
width: 15%; width: 20%;
border-right: 1rem solid gray; border-right: 1rem solid gray;
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;

60
src/pages/Wagon/Type/WagonTypeList.vue
View File

@ -5,6 +5,7 @@ import VnPaginate from 'src/components/ui/VnPaginate.vue';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import CardList2 from "components/ui/CardList2.vue";
const quasar = useQuasar(); const quasar = useQuasar();
const arrayData = useArrayData('WagonTypeList'); const arrayData = useArrayData('WagonTypeList');
@ -48,43 +49,28 @@ async function remove(row) {
auto-load auto-load
> >
<template #body="{ rows }"> <template #body="{ rows }">
<QCard class="card q-mb-md" v-for="row of rows" :key="row.id"> <CardList2
<QItem v-for="row of rows"
class="q-pa-none items-start cursor-pointer q-hoverable" :key="row.id"
v-ripple :title="(row.name || '').toString()"
clickable :id="row.id"
> @click="navigate(row.id)">
<QItemSection class="q-pa-md" @click="navigate(row.id)"> <template #actions>
<div class="text-h6">{{ row.name }}</div> <QBtn
<QItem-label caption>#{{ row.id }}</QItem-label> :label="t('components.smartCard.openCard')"
</QItemSection> @click.stop="navigate(row.id)"
<QSeparator vertical /> color="primary"
<QCardActions vertical class="justify-between"> type="submit"
<QBtn />
flat <QBtn
round :label="t('wagon.list.remove')"
color="primary" @click.stop="remove(row)"
icon="arrow_circle_right" color="primary"
@click="navigate(row.id)" flat
> style="margin-top: 15px"
<QTooltip> />
{{ t('components.smartCard.openCard') }} </template>
</QTooltip> </CardList2>
</QBtn>
<QBtn
flat
round
color="primary"
icon="delete"
@click="remove(row)"
>
<QTooltip>
{{ t('wagon.list.remove') }}
</QTooltip>
</QBtn>
</QCardActions>
</QItem>
</QCard>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>

102
src/pages/Wagon/WagonList.vue
View File

@ -5,6 +5,8 @@ import VnPaginate from 'src/components/ui/VnPaginate.vue';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import CardList2 from 'components/ui/CardList2.vue';
import VnLv from 'components/ui/VnLv.vue';
const quasar = useQuasar(); const quasar = useQuasar();
const arrayData = useArrayData('WagonList'); const arrayData = useArrayData('WagonList');
@ -55,69 +57,43 @@ async function remove(row) {
auto-load auto-load
> >
<template #body="{ rows }"> <template #body="{ rows }">
<QCard class="card q-mb-md" v-for="row of rows" :key="row.id"> <CardList2
<QItem v-for="row of rows"
class="q-pa-none items-start cursor-pointer q-hoverable" :key="row.id"
v-ripple :title="(row.label || '').toString()"
clickable :id="row.id"
> @click="navigate(row.id)">
<QItemSection class="q-pa-md" @click="navigate(row.id)"> <template #list-items>
<div class="text-h6">{{ row.label }}</div> <VnLv
<QItemLabel caption>#{{ row.id }}</QItemLabel> :label="t('wagon.list.plate')"
<QList> :title-label="t('wagon.list.plate')"
<QItem class="q-pa-none"> :value="row.plate"
<QItemSection> />
<QItemLabel caption> <VnLv
{{ t('wagon.list.plate') }} :label="t('wagon.list.volume')"
</QItemLabel> :value="row?.volume"
<QItemLabel>{{ row.plate }}</QItemLabel> />
</QItemSection> <VnLv
</QItem> :label="t('wagon.list.type')"
<QItem class="q-pa-none"> :value="row?.type?.name"
<QItemSection> />
<QItemLabel caption> </template>
{{ t('wagon.list.volume') }} <template #actions>
</QItemLabel> <QBtn
<QItemLabel>{{ row.volume }}</QItemLabel> :label="t('components.smartCard.openCard')"
</QItemSection> @click.stop="navigate(row.id)"
</QItem> color="primary"
<QItem class="q-pa-none"> type="submit"
<QItemSection> />
<QItemLabel caption> <QBtn
{{ t('wagon.list.type') }} :label="t('wagon.list.remove')"
</QItemLabel> @click.stop="remove(row)"
<QItemLabel>{{ row.type.name }}</QItemLabel> color="primary"
</QItemSection> flat
</QItem> style="margin-top: 15px"
</QList> />
</QItemSection> </template>
<QSeparator vertical /> </CardList2>
<QCardActions vertical class="justify-between">
<QBtn
flat
round
color="primary"
icon="arrow_circle_right"
@click="navigate(row.id)"
>
<QTooltip>
{{ t('components.smartCard.openCard') }}
</QTooltip>
</QBtn>
<QBtn
flat
round
color="primary"
icon="delete"
@click="remove(row)"
>
<QTooltip>
{{ t('wagon.list.remove') }}
</QTooltip>
</QBtn>
</QCardActions>
</QItem>
</QCard>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>