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

Se cambia nombre y se implementa en todos los componentes

This commit is contained in:
carlosfonseca 2023-11-30 11:37:42 -05:00
parent babaf47653
commit 820ebe00af
13 changed files with 65 additions and 167 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
src/components/ui/CardList.vue
View File

@ -1,83 +0,0 @@
<script setup>
const $props = defineProps({
id: { type: Number, default: null },
title: { type: String, default: null },
});
</script>
<template>
<QCard class="card q-mb-md cursor-pointer q-hoverable bg-white-7 q-pa-lg">
<div>
<slot name="title">
<div class="title text-primary text-weight-bold text-h5">
{{ $props.title ?? `#${$props.id}` }}
</div>
</slot>
<div class="card-list-body row">
<div class="list-items row flex-wrap-wrap q-mt-md">
<slot name="list-items" />
</div>
<div class="actions column justify-center">
<slot name="actions" />
</div>
</div>
</div>
</QCard>
</template>
<style lang="scss">
.card-list-body {
.vn-label-value {
display: flex;
justify-content: flex-start;
gap: 2%;
width: 50%;
.label {
width: 30%;
color: var(--vn-label);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.value {
width: 60%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.actions {
.q-btn {
width: 30px;
}
.q-icon {
color: $primary;
font-size: 25px;
}
}
}
@media (max-width: $breakpoint-xs) {
.card-list-body {
.vn-label-value {
width: 100%;
}
}
}
</style>
<style lang="scss" scoped>
.card {
transition: background-color 0.2s;
}
.card:hover {
background-color: var(--vn-gray);
}
.list-items {
width: 90%;
}
@media (max-width: $breakpoint-xs) {
.list-items {
width: 85%;
}
}
</style>

6
src/i18n/en/index.js
View File

@ -655,9 +655,9 @@ export default {
logOut: 'Log Out', logOut: 'Log Out',
}, },
smartCard: { smartCard: {
openCard: 'View card', openCard: 'View',
openSummary: 'Open summary', openSummary: 'Summary',
viewDescription: 'View description', viewDescription: 'Description',
}, },
cardDescriptor: { cardDescriptor: {
mainList: 'Main list', mainList: 'Main list',

2
src/i18n/es/index.js
View File

@ -659,7 +659,7 @@ export default {
smartCard: { smartCard: {
openCard: 'Ficha', openCard: 'Ficha',
openSummary: 'Detalles', openSummary: 'Detalles',
viewDescription: 'Ver descripción', viewDescription: 'Descripción',
}, },
cardDescriptor: { cardDescriptor: {
mainList: 'Listado principal', mainList: 'Listado principal',

42
src/pages/Claim/ClaimList.vue
View File

@ -79,13 +79,13 @@ function viewSummary(id) {
> >
<template #body="{ rows }"> <template #body="{ rows }">
<CardList <CardList
v-for="row of rows" :id="row.id"
:key="row.id" :key="row.id"
:title="row.clientName" :title="row.clientName"
@click="navigate(row.id)" @click="navigate(row.id)"
v-for="row of rows"
> >
<template #list-items> <template #list-items>
<VnLv label="ID" :value="row.id" />
<VnLv <VnLv
:label="t('claim.list.customer')" :label="t('claim.list.customer')"
:value="row.clientName" :value="row.clientName"
@ -100,11 +100,7 @@ function viewSummary(id) {
/> />
<VnLv :label="t('claim.list.state')"> <VnLv :label="t('claim.list.state')">
<template #value> <template #value>
<QBadge <QBadge :color="stateColor(row.stateCode)" dense>
:color="stateColor(row.stateCode)"
class="q-ma-none"
dense
>
{{ row.stateDescription }} {{ row.stateDescription }}
</QBadge> </QBadge>
</template> </template>
@ -112,26 +108,26 @@ function viewSummary(id) {
</template> </template>
<template #actions> <template #actions>
<QBtn <QBtn
flat :label="t('components.smartCard.openCard')"
icon="arrow_circle_right"
@click.stop="navigate(row.id)" @click.stop="navigate(row.id)"
color="white"
outline
/>
<QBtn
:label="t('components.smartCard.viewDescription')"
@click.stop
color="white"
outline
style="margin-top: 15px"
> >
<QTooltip>
{{ t('components.smartCard.openCard') }}
</QTooltip>
</QBtn>
<QBtn flat icon="preview" @click.stop="viewSummary(row.id)">
<QTooltip>
{{ t('components.smartCard.openSummary') }}
</QTooltip>
</QBtn>
<QBtn flat icon="vn:client" @click.stop>
<QTooltip>
{{ t('components.smartCard.viewDescription') }}
</QTooltip>
<CustomerDescriptorProxy :id="row.clientFk" /> <CustomerDescriptorProxy :id="row.clientFk" />
</QBtn> </QBtn>
<QBtn
:label="t('components.smartCard.openSummary')"
@click.stop="viewSummary(row.id)"
color="primary"
style="margin-top: 15px"
/>
</template> </template>
</CardList> </CardList>
</template> </template>

24
src/pages/Customer/CustomerList.vue
View File

@ -81,25 +81,17 @@ function viewSummary(id) {
</template> </template>
<template #actions> <template #actions>
<QBtn <QBtn
flat :label="t('components.smartCard.openCard')"
color="primary"
icon="arrow_circle_right"
@click.stop="navigate(row.id)" @click.stop="navigate(row.id)"
> color="white"
<QTooltip> outline
{{ t('components.smartCard.openCard') }} />
</QTooltip>
</QBtn>
<QBtn <QBtn
flat :label="t('components.smartCard.openSummary')"
color="grey-7"
icon="preview"
@click.stop="viewSummary(row.id)" @click.stop="viewSummary(row.id)"
> color="primary"
<QTooltip> style="margin-top: 15px"
{{ t('components.smartCard.openSummary') }} />
</QTooltip>
</QBtn>
</template> </template>
</CardList> </CardList>
</template> </template>

7
src/pages/InvoiceOut/InvoiceOutList.vue
View File

@ -10,7 +10,7 @@ import { toDate, toCurrency } from 'src/filters/index';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue'; import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import InvoiceOutFilter from './InvoiceOutFilter.vue'; import InvoiceOutFilter from './InvoiceOutFilter.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import CardList2 from 'src/components/ui/CardList2.vue'; import CardList from 'src/components/ui/CardList.vue';
const { t } = useI18n(); const { t } = useI18n();
const arrayElements = ref([]); const arrayElements = ref([]);
@ -177,7 +177,7 @@ const downloadCsv = (rows) => {
@click="downloadCsv(rows)" @click="downloadCsv(rows)"
/> />
</div> </div>
<CardList2 <CardList
:addElement="addElement" :addElement="addElement"
:element="row" :element="row"
:id="row.id" :id="row.id"
@ -189,7 +189,6 @@ const downloadCsv = (rows) => {
v-for="row of rows" v-for="row of rows"
> >
<template #list-items> <template #list-items>
<VnLv label="ID" :value="row.id" />
<VnLv <VnLv
:label="t('invoiceOut.list.shortIssued')" :label="t('invoiceOut.list.shortIssued')"
:title-label="t('invoiceOut.list.issued')" :title-label="t('invoiceOut.list.issued')"
@ -234,7 +233,7 @@ const downloadCsv = (rows) => {
type="submit" type="submit"
/> />
</template> </template>
</CardList2> </CardList>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>

8
src/pages/Shelving/ShelvingList.vue
View File

@ -3,7 +3,7 @@ import VnPaginate from 'components/ui/VnPaginate.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { onMounted, onUnmounted } from 'vue'; import { onMounted, onUnmounted } from 'vue';
import CardList2 from 'components/ui/CardList2.vue'; import CardList from 'components/ui/CardList.vue';
import VnLv from 'components/ui/VnLv.vue'; import VnLv from 'components/ui/VnLv.vue';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
@ -71,7 +71,7 @@ function viewSummary(id) {
auto-load auto-load
> >
<template #body="{ rows }"> <template #body="{ rows }">
<CardList2 <CardList
v-for="row of rows" v-for="row of rows"
:key="row.id" :key="row.id"
:id="row.id" :id="row.id"
@ -96,17 +96,15 @@ function viewSummary(id) {
@click.stop="navigate(row.id)" @click.stop="navigate(row.id)"
color="white" color="white"
outline outline
type="reset"
/> />
<QBtn <QBtn
:label="t('components.smartCard.openSummary')" :label="t('components.smartCard.openSummary')"
@click.stop="viewSummary(row.id)" @click.stop="viewSummary(row.id)"
color="primary" color="primary"
style="margin-top: 15px" style="margin-top: 15px"
type="submit"
/> />
</template> </template>
</CardList2> </CardList>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>

6
src/pages/Supplier/SupplierList.vue
View File

@ -4,7 +4,7 @@ import { useStateStore } from 'stores/useStateStore';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue'; import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import CardList2 from 'src/components/ui/CardList2.vue'; import CardList from 'src/components/ui/CardList.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import SupplierSummaryDialog from './Card/SupplierSummaryDialog.vue'; import SupplierSummaryDialog from './Card/SupplierSummaryDialog.vue';
@ -47,7 +47,7 @@ const viewSummary = (id) => {
<div class="card-list"> <div class="card-list">
<VnPaginate data-key="SuppliersList" url="Suppliers/filter" auto-load> <VnPaginate data-key="SuppliersList" url="Suppliers/filter" auto-load>
<template #body="{ rows }"> <template #body="{ rows }">
<CardList2 <CardList
v-for="row of rows" v-for="row of rows"
:key="row.id" :key="row.id"
:title="row.socialName" :title="row.socialName"
@ -82,7 +82,7 @@ const viewSummary = (id) => {
color="primary" color="primary"
/> />
</template> </template>
</CardList2> </CardList>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>

10
src/pages/Ticket/TicketList.vue
View File

@ -120,11 +120,11 @@ function viewSummary(id) {
/> />
</template> </template>
<template #actions> <template #actions>
<QBtn flat icon="preview" @click.stop="viewSummary(row.id)"> <QBtn
<QTooltip> :label="t('components.smartCard.openSummary')"
{{ t('components.smartCard.openSummary') }} @click.stop="viewSummary(row.id)"
</QTooltip> color="primary"
</QBtn> />
</template> </template>
</CardList> </CardList>
</template> </template>

6
src/pages/Travel/TravelList.vue
View File

@ -5,7 +5,7 @@ import { toDate } from 'src/filters/index';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import CardList2 from 'src/components/ui/CardList2.vue'; import CardList from 'src/components/ui/CardList.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import TravelSummaryDialog from './Card/TravelSummaryDialog.vue'; import TravelSummaryDialog from './Card/TravelSummaryDialog.vue';
import { useTravelStore } from 'src/stores/travel.js'; import { useTravelStore } from 'src/stores/travel.js';
@ -62,7 +62,7 @@ onMounted(async () => {
order="shipped DESC, landed DESC" order="shipped DESC, landed DESC"
> >
<template #body="{ rows }"> <template #body="{ rows }">
<CardList2 <CardList
v-for="row of rows" v-for="row of rows"
:key="row.id" :key="row.id"
:title="row.ref" :title="row.ref"
@ -119,7 +119,7 @@ onMounted(async () => {
type="submit" type="submit"
/> />
</template> </template>
</CardList2> </CardList>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>

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

@ -5,7 +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'; import CardList from 'components/ui/CardList.vue';
import VnLv from 'components/ui/VnLv.vue'; import VnLv from 'components/ui/VnLv.vue';
const quasar = useQuasar(); const quasar = useQuasar();
@ -50,7 +50,7 @@ async function remove(row) {
auto-load auto-load
> >
<template #body="{ rows }"> <template #body="{ rows }">
<CardList2 <CardList
v-for="row of rows" v-for="row of rows"
:key="row.id" :key="row.id"
:title="(row.name || '').toString()" :title="(row.name || '').toString()"
@ -66,7 +66,6 @@ async function remove(row) {
@click.stop="navigate(row.id)" @click.stop="navigate(row.id)"
color="white" color="white"
outline outline
type="submit"
/> />
<QBtn <QBtn
:label="t('wagon.list.remove')" :label="t('wagon.list.remove')"
@ -75,7 +74,7 @@ async function remove(row) {
style="margin-top: 15px" style="margin-top: 15px"
/> />
</template> </template>
</CardList2> </CardList>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>

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

@ -5,7 +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'; import CardList from 'components/ui/CardList.vue';
import VnLv from 'components/ui/VnLv.vue'; import VnLv from 'components/ui/VnLv.vue';
const quasar = useQuasar(); const quasar = useQuasar();
@ -57,7 +57,7 @@ async function remove(row) {
auto-load auto-load
> >
<template #body="{ rows }"> <template #body="{ rows }">
<CardList2 <CardList
v-for="row of rows" v-for="row of rows"
:key="row.id" :key="row.id"
:title="(row.label || '').toString()" :title="(row.label || '').toString()"
@ -83,7 +83,6 @@ async function remove(row) {
@click.stop="navigate(row.id)" @click.stop="navigate(row.id)"
color="white" color="white"
outline outline
type="submit"
/> />
<QBtn <QBtn
:label="t('wagon.list.remove')" :label="t('wagon.list.remove')"
@ -92,7 +91,7 @@ async function remove(row) {
style="margin-top: 15px" style="margin-top: 15px"
/> />
</template> </template>
</CardList2> </CardList>
</template> </template>
</VnPaginate> </VnPaginate>
</div> </div>

22
src/pages/Worker/WorkerList.vue
View File

@ -85,19 +85,17 @@ function viewSummary(id) {
</template> </template>
<template #actions> <template #actions>
<QBtn <QBtn
flat :label="t('components.smartCard.openCard')"
icon="arrow_circle_right"
@click.stop="navigate(row.id)" @click.stop="navigate(row.id)"
> color="white"
<QTooltip> outline
{{ t('components.smartCard.openCard') }} />
</QTooltip> <QBtn
</QBtn> :label="t('components.smartCard.openSummary')"
<QBtn flat icon="preview" @click.stop="viewSummary(row.id)"> @click.stop="viewSummary(row.id)"
<QTooltip> color="primary"
{{ t('components.smartCard.openSummary') }} style="margin-top: 15px"
</QTooltip> />
</QBtn>
</template> </template>
</CardList> </CardList>
</template> </template>