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

feat: refs #6900 use VnTable & sort filter fields

This commit is contained in:
Jorge Penadés 2024-08-08 10:12:54 +02:00
parent bc62dc9a89
commit dc5142c20a
8 changed files with 205 additions and 167 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/VnTable/VnColumn.vue
View File

@ -151,7 +151,7 @@ const col = computed(() => {
};
}
if (
(newColumn.name.startsWith('is') || newColumn.name.startsWith('has')) &&
(/^is[A-Z]/.test(newColumn.name) || /^has[A-Z]/.test(newColumn.name)) &&
newColumn.component == null
)
newColumn.component = 'checkbox';

1
src/i18n/locale/en.yml
View File

@ -262,6 +262,7 @@ globals:
unsavedPopup:
title: Unsaved changes will be lost
subtitle: Are you sure exit without saving?
createInvoiceIn: Create invoice in
errors:
statusUnauthorized: Access denied
statusInternalServerError: An internal server error has ocurred

2
src/i18n/locale/es.yml
View File

@ -264,6 +264,8 @@ globals:
unsavedPopup:
title: Los cambios que no haya guardado se perderán
subtitle: ¿Seguro que quiere salir sin guardar?
createInvoiceIn: Crear factura recibida
errors:
statusUnauthorized: Acceso denegado
statusInternalServerError: Ha ocurrido un error interno del servidor

17
src/pages/InvoiceIn/InvoiceInCreate.vue
View File

@ -26,8 +26,7 @@ const newInvoiceIn = reactive({
companyFk: user.value.companyFk || null,
issued: Date.vnNew(),
});
const suppliersOptions = ref([]);
const companiesOptions = ref([]);
const companies = ref([]);
const redirectToInvoiceInBasicData = (__, { id }) => {
router.push({ name: 'InvoiceInBasicData', params: { id } });
@ -35,19 +34,12 @@ const redirectToInvoiceInBasicData = (__, { id }) => {
</script>
<template>
<FetchData
url="Suppliers"
:filter="{ fields: ['id', 'nickname'] }"
order="nickname"
@on-fetch="(data) => (suppliersOptions = data)"
auto-load
/>
<FetchData
ref="companiesRef"
url="Companies"
:filter="{ fields: ['id', 'code'] }"
order="code"
@on-fetch="(data) => (companiesOptions = data)"
@on-fetch="(data) => (companies = data)"
auto-load
/>
<template v-if="stateStore.isHeaderMounted()">
@ -69,9 +61,10 @@ const redirectToInvoiceInBasicData = (__, { id }) => {
<template #form="{ data, validate }">
<VnRow>
<VnSelect
url="Suppliers"
:fields="['id', 'nickname']"
:label="t('Supplier')"
v-model="data.supplierFk"
:options="suppliersOptions"
option-value="id"
option-label="nickname"
hide-selected
@ -98,7 +91,7 @@ const redirectToInvoiceInBasicData = (__, { id }) => {
<VnSelect
:label="t('Company')"
v-model="data.companyFk"
:options="companiesOptions"
:options="companies"
option-value="id"
option-label="code"
map-options

108
src/pages/InvoiceIn/InvoiceInFilter.vue
View File

@ -28,6 +28,22 @@ const activities = ref([]);
</div>
</template>
<template #body="{ params, searchFn }">
<QItem>
<QItemSection>
<VnSelect
v-model="params.supplierFk"
url="Suppliers"
:fields="['id', 'nickname']"
:label="t('params.supplierFk')"
option-value="id"
option-label="nickname"
dense
outlined
rounded
:filter-options="['id', 'name']"
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInput
@ -50,17 +66,30 @@ const activities = ref([]);
</QItem>
<QItem>
<QItemSection>
<VnSelect
v-model="params.supplierFk"
url="Suppliers"
:fields="['id', 'nickname']"
:label="t('params.supplierFk')"
option-value="id"
option-label="nickname"
dense
outlined
rounded
:filter-options="['id', 'name']"
<VnInput
:label="t('params.serialNumber')"
v-model="params.serialNumber"
is-outlined
lazy-rules
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInput
:label="t('params.serial')"
v-model="params.serial"
is-outlined
lazy-rules
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInputDate
:label="t('Issued')"
v-model="params.issued"
is-outlined
/>
</QItemSection>
</QItem>
@ -76,40 +105,17 @@ const activities = ref([]);
</QItem>
<QItem>
<QItemSection>
<VnCurrency v-model="params.amount" is-outlined />
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInputDate :label="t('From')" v-model="params.from" is-outlined />
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInputDate :label="t('To')" v-model="params.to" is-outlined />
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInputDate
:label="t('Issued')"
v-model="params.issued"
<VnInput
:label="t('params.awb')"
v-model="params.awbCode"
is-outlined
lazy-rules
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnSelect
:label="t('params.supplierActivityFk')"
v-model="params.supplierActivityFk"
dense
outlined
rounded
option-value="code"
option-label="name"
:options="activities"
/>
<VnCurrency v-model="params.amount" is-outlined />
</QItemSection>
</QItem>
<QItem>
@ -133,32 +139,16 @@ const activities = ref([]);
<QExpansionItem :label="t('More options')" expand-separator>
<QItem>
<QItemSection>
<VnInput
:label="t('params.serialNumber')"
v-model="params.serialNumber"
<VnInputDate
:label="t('From')"
v-model="params.from"
is-outlined
lazy-rules
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInput
:label="t('params.serial')"
v-model="params.serial"
is-outlined
lazy-rules
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInput
:label="t('params.awb')"
v-model="params.awbCode"
is-outlined
lazy-rules
/>
<VnInputDate :label="t('To')" v-model="params.to" is-outlined />
</QItemSection>
</QItem>
</QExpansionItem>

236
src/pages/InvoiceIn/InvoiceInList.vue
View File

@ -1,18 +1,19 @@
<script setup>
import { onMounted, onUnmounted } from 'vue';
import { ref, computed, onMounted, onUnmounted } from 'vue';
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
import { downloadFile } from 'src/composables/downloadFile';
import { toDate, toCurrency } from 'src/filters/index';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import CardList from 'src/components/ui/CardList.vue';
import InvoiceInFilter from './InvoiceInFilter.vue';
import InvoiceInSummary from './Card/InvoiceInSummary.vue';
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
import RightMenu from 'src/components/common/RightMenu.vue';
import InvoiceInSearchbar from 'src/pages/InvoiceIn/InvoiceInSearchbar.vue';
import VnTable from 'src/components/VnTable/VnTable.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnInputDate from 'src/components/common/VnInputDate.vue';
const stateStore = useStateStore();
const { viewSummary } = useSummaryDialog();
@ -20,8 +21,91 @@ const { t } = useI18n();
onMounted(async () => (stateStore.rightDrawer = true));
onUnmounted(() => (stateStore.rightDrawer = false));
</script>
const tableRef = ref();
const cols = computed(() => [
{
align: 'left',
name: 'id',
label: 'Id',
},
{
align: 'left',
name: 'supplierFk',
label: t('invoiceIn.list.supplier'),
columnFilter: {
component: 'select',
attrs: {
url: 'Suppliers',
fields: ['id', 'name'],
},
},
columnClass: 'expand',
},
{
align: 'left',
name: 'supplierRef',
label: t('invoiceIn.list.supplierRef'),
},
{
align: 'left',
name: 'serialNumber',
label: t('invoiceIn.list.serialNumber'),
},
{
align: 'left',
name: 'serial',
label: t('invoiceIn.list.serial'),
},
{
align: 'left',
label: t('invoiceIn.list.issued'),
name: 'issued',
component: null,
columnFilter: {
component: 'date',
},
format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.issued)),
},
{
align: 'left',
name: 'isBooked',
label: t('invoiceIn.list.isBooked'),
columnFilter: false,
},
{
align: 'left',
name: 'awbCode',
label: t('invoiceIn.list.awb'),
},
{
align: 'left',
name: 'amount',
label: t('invoiceIn.list.amount'),
format: ({ amount }) => toCurrency(amount),
},
{
align: 'right',
name: 'tableActions',
actions: [
{
title: t('components.smartCard.openSummary'),
icon: 'preview',
type: 'submit',
action: (row) => viewSummary(row.id, InvoiceInSummary),
},
{
title: t('globals.download'),
icon: 'download',
type: 'submit',
isPrimary: true,
action: (row) => downloadFile(row.dmsFk),
},
],
},
]);
</script>
<template>
<InvoiceInSearchbar />
<RightMenu>
@ -29,92 +113,62 @@ onUnmounted(() => (stateStore.rightDrawer = false));
<InvoiceInFilter data-key="InvoiceInList" />
</template>
</RightMenu>
<QPage class="column items-center q-pa-md">
<div class="vn-card-list">
<VnPaginate
data-key="InvoiceInList"
url="InvoiceIns/filter"
order="issued DESC, id DESC"
auto-load
<VnTable
ref="tableRef"
data-key="InvoiceInList"
url="InvoiceIns/filter"
:order="['issued DESC', 'id DESC']"
redirect="invoice-in"
:columns="cols"
:right-search="false"
:create="{
urlCreate: 'InvoiceIns',
title: t('globals.createInvoiceIn'),
onDataSaved: ({ id }) => tableRef.redirect(id),
formInitialData: {},
}"
:disable-option="{ card: true }"
>
<template #column-supplierFk="{ row }">
<span class="link" @click.stop>
{{ row.supplierName }}
<SupplierDescriptorProxy :id="row.supplierFk" />
</span>
</template>
<template #more-create-dialog="{ data }">
<VnSelect
v-model="data.supplierFk"
url="Suppliers"
:fields="['id', 'nickname']"
:label="t('Supplier')"
option-value="id"
option-label="nickname"
:filter-options="['id', 'name']"
:required="true"
>
<template #body="{ rows }">
<CardList
v-for="(row, index) of rows"
:key="index"
:title="row.supplierRef"
@click="$router.push({ path: `/invoice-in/${row.id}` })"
:id="row.id"
>
<template #list-items>
<VnLv
:label="t('invoiceIn.list.supplierRef')"
:value="row.supplierRef"
/>
<VnLv
:label="t('invoiceIn.list.supplier')"
:value="row.supplierName"
@click.stop
>
<template #value>
<span class="link">
{{ row.supplierName }}
<SupplierDescriptorProxy :id="row.supplierFk" />
</span>
</template>
</VnLv>
<VnLv
:label="t('invoiceIn.list.serialNumber')"
:value="row.serialNumber"
/>
<VnLv
:label="t('invoiceIn.list.serial')"
:value="row.serial"
/>
<VnLv
:label="t('invoiceIn.list.issued')"
:value="toDate(row.issued)"
/>
<VnLv :label="t('invoiceIn.list.awb')" :value="row.awbCode" />
<VnLv
:label="t('invoiceIn.list.amount')"
:value="toCurrency(row.amount)"
/>
<VnLv
:label="t('invoiceIn.list.isBooked')"
:value="!!row.isBooked"
/>
</template>
<template #actions>
<QBtn
:label="t('components.smartCard.openCard')"
@click.stop="
$router.push({ path: `/invoice-in/${row.id}` })
"
outline
type="reset"
/>
<QBtn
:label="t('components.smartCard.openSummary')"
@click.stop="viewSummary(row.id, InvoiceInSummary)"
color="primary"
type="submit"
class="q-mt-sm"
/>
<QBtn
:label="t('globals.download')"
class="q-mt-sm"
@click.stop="downloadFile(row.dmsFk)"
type="submit"
color="primary"
/>
</template>
</CardList>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection>
<QItemLabel>{{ scope.opt?.nickname }}</QItemLabel>
<QItemLabel caption> #{{ scope.opt?.id }} </QItemLabel>
</QItemSection>
</QItem>
</template>
</VnPaginate>
</div>
</QPage>
<QPageSticky position="bottom-right" :offset="[20, 20]">
<QBtn color="primary" icon="add" size="lg" round :href="`/#/invoice-in/create`" />
</QPageSticky>
</VnSelect>
<VnInput
:label="t('invoiceIn.summary.supplierRef')"
v-model="data.supplierRef"
/>
<VnSelect
url="Companies"
:label="t('Company')"
:fields="['id', 'code']"
v-model="data.companyFk"
option-value="id"
option-label="code"
:required="true"
/>
<VnInputDate :label="t('invoiceIn.summary.issued')" v-model="data.issued" />
</template>
</VnTable>
</template>

3
src/pages/Route/RouteAutonomous.vue
View File

@ -214,7 +214,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
@click="openDmsUploadDialog"
>
<QTooltip>
{{ t('Create invoiceIn') }}
{{ t('globals.createInvoiceIn') }}
</QTooltip>
</QBtn>
</QCard>
@ -267,7 +267,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
es:
Search autonomous: Buscar autónomos
You can search by autonomous reference: Puedes buscar por referencia del autónomo
Create invoiceIn: Crear factura recibida
Two autonomous cannot be counted at the same time: Dos autonónomos no pueden ser contabilizados al mismo tiempo
Date: Fecha
Agency route: Agencia Ruta

3
src/pages/Supplier/Card/SupplierDescriptor.vue
View File

@ -177,7 +177,7 @@ const getEntryQueryParams = (supplier) => {
icon="vn:invoice-in-create"
color="primary"
>
<QTooltip>{{ t('Create invoiceIn') }}</QTooltip>
<QTooltip>{{ t('globals.createInvoiceIn') }}</QTooltip>
</QBtn>
</QCardActions>
</template>
@ -188,7 +188,6 @@ const getEntryQueryParams = (supplier) => {
es:
All entries with current supplier: Todas las entradas con proveedor actual
Go to client: Ir a cliente
Create invoiceIn: Crear factura recibida
Go to module index: Ir al índice del módulo
Inactive supplier: Proveedor inactivo
Unverified supplier: Proveedor no verificado