forked from verdnatura/salix-front
Se cambia visualmente el componente que controla las descargas
This commit is contained in:
carlosfonseca
parent
1e3406b5fa
commit
9f3fe3665b
|
|
@ -28,7 +28,7 @@ const selectedItem = (item) => {
|
|||
<div>
|
||||
<slot name="title">
|
||||
<div class="flex justify-between">
|
||||
<div class="flex">
|
||||
<div class="flex items-center">
|
||||
<div class="title text-primary text-weight-bold text-h5">
|
||||
{{ $props.title }}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -45,6 +45,8 @@ const setManageCheckboxes = (downloadType) => {
|
|||
};
|
||||
|
||||
const addElement = (element) => {
|
||||
showSelect.value = false;
|
||||
manageCheckboxes.value = false;
|
||||
if (arrayElements.value.length >= 0) {
|
||||
const index = arrayElements.value.findIndex((item) => item.id === element.id);
|
||||
if (index >= 0) {
|
||||
|
|
@ -124,8 +126,7 @@ const downloadCsv = (rows) => {
|
|||
<InvoiceOutFilter data-key="InvoiceOutList" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<div class="card-list">
|
||||
<QPage>
|
||||
<VnPaginate
|
||||
auto-load
|
||||
data-key="InvoiceOutList"
|
||||
|
|
@ -133,50 +134,61 @@ const downloadCsv = (rows) => {
|
|||
url="InvoiceOuts/filter"
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<div class="flex justify-around q-mb-md">
|
||||
<div>
|
||||
<QToolbar class="bg-vn-dark justify-end">
|
||||
<div id="st-actions">
|
||||
<QBtn
|
||||
@click="downloadCsv(rows)"
|
||||
class="q-mr-xl"
|
||||
color="primary"
|
||||
:disable="!manageCheckboxes && arrayElements.length < 1"
|
||||
:label="t('download')"
|
||||
v-if="!showSelect"
|
||||
/>
|
||||
<QBtnDropdown
|
||||
class="q-mr-xl"
|
||||
color="primary"
|
||||
:disable="!manageCheckboxes && arrayElements.length < 1"
|
||||
:label="t('download')"
|
||||
v-else
|
||||
>
|
||||
<Qlist>
|
||||
<QItem clickable v-close-popup @click="downloadCsv(rows)">
|
||||
<QItemSection>
|
||||
<QItemLabel>
|
||||
{{
|
||||
t('allRows', {
|
||||
numberRows: t(rows.length),
|
||||
})
|
||||
}}
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
|
||||
<QItem clickable v-close-popup @click="downloadCsv(rows)">
|
||||
<QItemSection>
|
||||
<QItemLabel>
|
||||
{{
|
||||
t('selectRows', {
|
||||
numberRows: t(rows.length),
|
||||
})
|
||||
}}
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</Qlist>
|
||||
</QBtnDropdown>
|
||||
|
||||
<QCheckbox
|
||||
label="Marcar todo"
|
||||
left-label
|
||||
:label="t('markAll')"
|
||||
v-model="manageCheckboxes"
|
||||
@click="setShowSelect"
|
||||
/>
|
||||
|
||||
<QBtn
|
||||
:disable="!manageCheckboxes"
|
||||
class="q-ml-md"
|
||||
dense
|
||||
flat
|
||||
icon="cloud_download"
|
||||
round
|
||||
:class="{ dark_icon: !manageCheckboxes }"
|
||||
>
|
||||
<QMenu>
|
||||
<QList padding dense>
|
||||
<QItem
|
||||
@click="setManageCheckboxes('all')"
|
||||
clickable
|
||||
v-ripple
|
||||
>
|
||||
Todo {{ rows.length }} filas(s)
|
||||
</QItem>
|
||||
<QItem
|
||||
@click="setManageCheckboxes('partial')"
|
||||
clickable
|
||||
v-ripple
|
||||
>
|
||||
Seleccionar las {{ rows.length }} filas(s)
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
</QBtn>
|
||||
</div>
|
||||
<QBtn
|
||||
label="Descargar"
|
||||
color="primary"
|
||||
type="submit"
|
||||
@click="downloadCsv(rows)"
|
||||
class="q-mr-md"
|
||||
/>
|
||||
</div>
|
||||
</QToolbar>
|
||||
<div class="flex flex-center q-pa-md">
|
||||
<div class="card-list">
|
||||
<CardList
|
||||
:add-element="addElement"
|
||||
:element="row"
|
||||
|
|
@ -234,9 +246,10 @@ const downloadCsv = (rows) => {
|
|||
/>
|
||||
</template>
|
||||
</CardList>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</div>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
|
|
@ -245,10 +258,6 @@ const downloadCsv = (rows) => {
|
|||
width: 100%;
|
||||
max-width: 60em;
|
||||
}
|
||||
|
||||
.dark_icon {
|
||||
color: #121212;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
|
|
@ -257,10 +266,17 @@ en:
|
|||
fileDenied: Browser denied file download...
|
||||
fileAllowed: Successful download of CSV file
|
||||
youCanSearchByInvoiceReference: You can search by invoice reference
|
||||
|
||||
download: Download
|
||||
selectRows: Select all { numberRows } row(s)
|
||||
allRows: All { numberRows } row(s)
|
||||
markAll: Mark all
|
||||
es:
|
||||
searchInvoice: Buscar factura emitida
|
||||
fileDenied: El navegador denegó la descarga de archivos...
|
||||
fileAllowed: Descarga exitosa de archivo CSV
|
||||
youCanSearchByInvoiceReference: Puedes buscar por referencia de la factura
|
||||
download: Descargar
|
||||
selectRows: Seleccionar las { numberRows } filas(s)
|
||||
allRows: Todo { numberRows } filas(s)
|
||||
markAll: Marcar todo
|
||||
</i18n>
|
||||
|
|
|
|||
Loading…
Reference in New Issue