forked from verdnatura/salix-front
Merge pull request 'Se hace corrección en el desplegable' (#9) from features/ms_19_desplegable_detalle_2 into dev
Reviewed-on: hyervoni/salix-front-mindshore#9
This commit is contained in:
commit
2755e3c20e
|
|
@ -83,6 +83,7 @@ const options = [
|
|||
</QTooltip>
|
||||
</QBtn>
|
||||
</RouterLink>
|
||||
|
||||
<RouterLink :to="{ name: `${module}Summary`, params: { id: entity.id } }">
|
||||
<QBtn
|
||||
class="link"
|
||||
|
|
@ -93,31 +94,21 @@ const options = [
|
|||
round
|
||||
size="md"
|
||||
>
|
||||
<QMenu auto-close>
|
||||
<QList dense v-for="option in options" :key="option">
|
||||
<QItem v-ripple clickable>
|
||||
{{ option }}
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
<QTooltip>
|
||||
{{ t('components.cardDescriptor.summary') }}
|
||||
</QTooltip>
|
||||
</QBtn>
|
||||
</RouterLink>
|
||||
|
||||
<QBtn
|
||||
color="white"
|
||||
dense
|
||||
flat
|
||||
icon="more_vert"
|
||||
round
|
||||
size="md"
|
||||
v-if="slots.menu"
|
||||
>
|
||||
<QBtn color="white" dense flat icon="more_vert" round size="md">
|
||||
<QTooltip>
|
||||
{{ t('components.cardDescriptor.moreOptions') }}
|
||||
</QTooltip>
|
||||
<QMenu>
|
||||
<QList>
|
||||
<slot name="menu" :entity="entity" />
|
||||
<QList dense v-for="option in options" :key="option">
|
||||
<QItem v-ripple clickable>
|
||||
{{ option }}
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
</QBtn>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,35 @@
|
|||
<script setup>
|
||||
import { ref, watch } from 'vue';
|
||||
|
||||
const $props = defineProps({
|
||||
id: { type: Number, default: null },
|
||||
isSelected: { type: Boolean, default: false },
|
||||
title: { type: String, default: null },
|
||||
});
|
||||
const checkSelect = ref(false);
|
||||
|
||||
watch(
|
||||
() => $props.isSelected,
|
||||
(value, prevValue) => {
|
||||
checkSelect.value = value;
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QCard class="card q-mb-md cursor-pointer q-hoverable bg-white-7 q-pa-lg">
|
||||
<div>
|
||||
<slot name="title">
|
||||
<div class="flex justify-between">
|
||||
<div class="flex">
|
||||
<div class="title text-primary text-weight-bold text-h5">
|
||||
{{ $props.title ?? `#${$props.id}` }}
|
||||
{{ $props.title }}
|
||||
</div>
|
||||
<div class="q_chip">
|
||||
<QChip outline color="grey" size="sm">ID: 12345</QChip>
|
||||
<QChip outline color="grey" size="sm">
|
||||
ID: {{ $props.id }}
|
||||
</QChip>
|
||||
</div>
|
||||
<QCheckbox v-model="checkSelect" />
|
||||
</div>
|
||||
</slot>
|
||||
<div class="card-list-body">
|
||||
|
|
@ -36,12 +50,6 @@ const $props = defineProps({
|
|||
margin-right: 25px;
|
||||
}
|
||||
|
||||
.q_chip {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.card-list-body {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { onMounted, onUnmounted } from 'vue';
|
||||
import { onMounted, onUnmounted, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useQuasar } from 'quasar';
|
||||
|
|
@ -12,10 +12,11 @@ import InvoiceOutFilter from './InvoiceOutFilter.vue';
|
|||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import CardList2 from 'src/components/ui/CardList2.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const router = useRouter();
|
||||
const quasar = useQuasar();
|
||||
const { t } = useI18n();
|
||||
const manageCheckboxes = ref(false);
|
||||
const quasar = useQuasar();
|
||||
const router = useRouter();
|
||||
const stateStore = useStateStore();
|
||||
|
||||
onMounted(() => (stateStore.rightDrawer = true));
|
||||
onUnmounted(() => (stateStore.rightDrawer = false));
|
||||
|
|
@ -38,19 +39,19 @@ function viewSummary(id) {
|
|||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="InvoiceOutList"
|
||||
:label="t('Search invoice')"
|
||||
:info="t('You can search by invoice reference')"
|
||||
:label="t('Search invoice')"
|
||||
data-key="InvoiceOutList"
|
||||
/>
|
||||
</Teleport>
|
||||
<Teleport to="#actions-append">
|
||||
<div class="row q-gutter-x-sm">
|
||||
<QBtn
|
||||
flat
|
||||
@click="stateStore.toggleRightDrawer()"
|
||||
round
|
||||
dense
|
||||
flat
|
||||
icon="menu"
|
||||
round
|
||||
>
|
||||
<QTooltip bottom anchor="bottom right">
|
||||
{{ t('globals.collapseMenu') }}
|
||||
|
|
@ -67,17 +68,23 @@ function viewSummary(id) {
|
|||
<QPage class="column items-center q-pa-md">
|
||||
<div class="card-list">
|
||||
<VnPaginate
|
||||
data-key="InvoiceOutList"
|
||||
url="InvoiceOuts/filter"
|
||||
order="issued DESC, id DESC"
|
||||
auto-load
|
||||
data-key="InvoiceOutList"
|
||||
order="issued DESC, id DESC"
|
||||
url="InvoiceOuts/filter"
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<div class="flex justify-around q-mb-md">
|
||||
<QCheckbox label="Marcar todo" v-model="manageCheckboxes" />
|
||||
<QBtn label="Descargar" color="primary" type="submit" />
|
||||
</div>
|
||||
<CardList2
|
||||
v-for="row of rows"
|
||||
:id="row.id"
|
||||
:isSelected="manageCheckboxes"
|
||||
:key="row.id"
|
||||
:title="row.ref"
|
||||
@click="navigate(row.id)"
|
||||
v-for="row of rows"
|
||||
>
|
||||
<template #list-items>
|
||||
<VnLv label="ID" :value="row.id" />
|
||||
|
|
|
|||
Loading…
Reference in New Issue