WIP
This commit is contained in:
parent
b2edb89118
commit
62a806b813
|
|
@ -627,6 +627,7 @@ export default {
|
||||||
list: 'List',
|
list: 'List',
|
||||||
create: 'Create',
|
create: 'Create',
|
||||||
summary: 'Summary',
|
summary: 'Summary',
|
||||||
|
extraCommunity: 'ExtraCommunity',
|
||||||
},
|
},
|
||||||
list: {
|
list: {
|
||||||
clone: 'Clone',
|
clone: 'Clone',
|
||||||
|
|
|
||||||
|
|
@ -629,6 +629,7 @@ export default {
|
||||||
list: 'Listado',
|
list: 'Listado',
|
||||||
create: 'Crear',
|
create: 'Crear',
|
||||||
summary: 'Resumen',
|
summary: 'Resumen',
|
||||||
|
extraCommunity: 'ExtraCommunity',
|
||||||
},
|
},
|
||||||
list: {
|
list: {
|
||||||
clone: 'Clonar',
|
clone: 'Clonar',
|
||||||
|
|
|
||||||
|
|
@ -16,12 +16,11 @@ const {
|
||||||
formInitialData,
|
formInitialData,
|
||||||
|
|
||||||
invoicing,
|
invoicing,
|
||||||
printer,
|
|
||||||
status,
|
status,
|
||||||
} = storeToRefs(invoiceOutGlobalStore);
|
} = storeToRefs(invoiceOutGlobalStore);
|
||||||
|
|
||||||
// invoiceOutGlobalStore actions
|
// invoiceOutGlobalStore actions
|
||||||
const { makeInvoice, setPrinterValue, setStatusValue } = invoiceOutGlobalStore;
|
const { makeInvoice, setStatusValue } = invoiceOutGlobalStore;
|
||||||
|
|
||||||
const clientsToInvoice = ref('all');
|
const clientsToInvoice = ref('all');
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,445 @@
|
||||||
|
<script setup>
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||||
|
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||||
|
// import invoiceOutService from 'src/services/invoiceOut.service';
|
||||||
|
// import { toCurrency } from 'src/filters';
|
||||||
|
import { QBadge, QBtn } from 'quasar';
|
||||||
|
// import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js';
|
||||||
|
import { toDate } from 'src/filters';
|
||||||
|
|
||||||
|
// const invoiceOutGlobalStore = useInvoiceOutGlobalStore();
|
||||||
|
|
||||||
|
const rows = ref([]);
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
// const dateRange = reactive({
|
||||||
|
// from: Date.vnFirstDayOfMonth(),
|
||||||
|
// to: Date.vnLastDayOfMonth(),
|
||||||
|
// });
|
||||||
|
|
||||||
|
// const selectedCustomerId = ref(0);
|
||||||
|
// const selectedWorkerId = ref(0);
|
||||||
|
|
||||||
|
const filter = ref({
|
||||||
|
company: null,
|
||||||
|
country: null,
|
||||||
|
clientId: null,
|
||||||
|
client: null,
|
||||||
|
amount: null,
|
||||||
|
base: null,
|
||||||
|
ticketId: null,
|
||||||
|
active: null,
|
||||||
|
hasToInvoice: null,
|
||||||
|
verifiedData: null,
|
||||||
|
comercial: null,
|
||||||
|
});
|
||||||
|
|
||||||
|
const tableColumnComponents = {
|
||||||
|
id: {
|
||||||
|
component: QBtn,
|
||||||
|
props: {},
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
supplierName: {
|
||||||
|
component: QBtn,
|
||||||
|
props: {},
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
agencyModeName: {
|
||||||
|
component: 'span',
|
||||||
|
props: {},
|
||||||
|
event: () => {},
|
||||||
|
// props: { flat: true, color: 'blue' },
|
||||||
|
// event: (prop) => selectCustomerId(prop.value),
|
||||||
|
},
|
||||||
|
client: {
|
||||||
|
component: 'span',
|
||||||
|
props: {},
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
amount: {
|
||||||
|
component: 'span',
|
||||||
|
props: {},
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
base: {
|
||||||
|
component: 'span',
|
||||||
|
props: {},
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
ticketId: {
|
||||||
|
component: 'span',
|
||||||
|
props: {},
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
active: {
|
||||||
|
component: 'span',
|
||||||
|
props: { type: 'boolean' },
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
hasToInvoice: {
|
||||||
|
component: 'span',
|
||||||
|
props: { type: 'boolean' },
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
verifiedData: {
|
||||||
|
component: 'span',
|
||||||
|
props: { type: 'boolean' },
|
||||||
|
event: () => {},
|
||||||
|
},
|
||||||
|
comercial: {
|
||||||
|
component: QBtn,
|
||||||
|
props: { flat: true, color: 'blue' },
|
||||||
|
// event: (prop) => selectWorkerId(prop.row.comercialId),
|
||||||
|
event: (prop) => {},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const columns = ref([
|
||||||
|
{
|
||||||
|
label: 'id',
|
||||||
|
field: 'id',
|
||||||
|
name: 'id',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'cargoSupplierFk',
|
||||||
|
field: 'cargoSupplierFk',
|
||||||
|
name: 'cargoSupplierFk',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'agencyModeFk',
|
||||||
|
field: 'agencyModeFk',
|
||||||
|
name: 'agencyModeFk',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'invoiceAmount',
|
||||||
|
field: 'invoiceAmount',
|
||||||
|
name: 'invoiceAmount',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'ref',
|
||||||
|
field: 'ref',
|
||||||
|
name: 'ref',
|
||||||
|
align: 'left',
|
||||||
|
// format: (value) => toCurrency(value),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'stickers',
|
||||||
|
field: 'stickers',
|
||||||
|
name: 'stickers',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'ticketId',
|
||||||
|
field: 'ticketFk',
|
||||||
|
name: 'ticketId',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'active',
|
||||||
|
field: 'isActive',
|
||||||
|
name: 'active',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'hasToInvoice',
|
||||||
|
field: 'hasToInvoice',
|
||||||
|
name: 'hasToInvoice',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'verifiedData',
|
||||||
|
field: 'isTaxDataChecked',
|
||||||
|
name: 'verifiedData',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'comercial',
|
||||||
|
field: 'comercialName',
|
||||||
|
name: 'comercial',
|
||||||
|
align: 'left',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
// const downloadCSV = async () => {
|
||||||
|
// invoiceOutGlobalStore.getNegativeBasesCsv(dateRange.from, dateRange.to);
|
||||||
|
// };
|
||||||
|
|
||||||
|
// const search = async () => {
|
||||||
|
// const and = [];
|
||||||
|
// Object.keys(filter.value).forEach((key) => {
|
||||||
|
// if (filter.value[key]) {
|
||||||
|
// and.push({
|
||||||
|
// [key]: filter.value[key],
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
|
||||||
|
// const params = {
|
||||||
|
// ...dateRange,
|
||||||
|
// filter: {
|
||||||
|
// limit: 20,
|
||||||
|
// where: { and },
|
||||||
|
// },
|
||||||
|
// };
|
||||||
|
// rows.value = await invoiceOutService.getNegativeBases(params);
|
||||||
|
// };
|
||||||
|
|
||||||
|
// const refresh = () => {
|
||||||
|
// dateRange.from = Date.vnFirstDayOfMonth();
|
||||||
|
// dateRange.to = Date.vnLastDayOfMonth();
|
||||||
|
// filter.value = {
|
||||||
|
// company: null,
|
||||||
|
// country: null,
|
||||||
|
// clientId: null,
|
||||||
|
// client: null,
|
||||||
|
// amount: null,
|
||||||
|
// base: null,
|
||||||
|
// ticketId: null,
|
||||||
|
// active: null,
|
||||||
|
// hasToInvoice: null,
|
||||||
|
// verifiedData: null,
|
||||||
|
// comercial: null,
|
||||||
|
// };
|
||||||
|
// search();
|
||||||
|
// };
|
||||||
|
|
||||||
|
// const selectCustomerId = (id) => {
|
||||||
|
// selectedCustomerId.value = id;
|
||||||
|
// };
|
||||||
|
|
||||||
|
// const selectWorkerId = (id) => {
|
||||||
|
// selectedWorkerId.value = id;
|
||||||
|
// };
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
// refresh();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<QPage class="column items-center q-pa-md">
|
||||||
|
<QTable
|
||||||
|
:rows="rows"
|
||||||
|
:columns="columns"
|
||||||
|
hide-bottom
|
||||||
|
row-key="clientId"
|
||||||
|
:pagination="{ rowsPerPage: 0 }"
|
||||||
|
class="full-width q-mt-md"
|
||||||
|
>
|
||||||
|
<template #top-left>
|
||||||
|
<div class="row justify-start items-end">
|
||||||
|
<QInput
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
outlined
|
||||||
|
rounded
|
||||||
|
placeholder="dd-mm-aaa"
|
||||||
|
:label="t('invoiceOut.negativeBases.from')"
|
||||||
|
class="q-mr-md q"
|
||||||
|
:model-value="toDate(dateRange.from)"
|
||||||
|
>
|
||||||
|
<template #append>
|
||||||
|
<QIcon name="event" class="cursor-pointer">
|
||||||
|
<QPopupProxy
|
||||||
|
cover
|
||||||
|
transition-show="scale"
|
||||||
|
transition-hide="scale"
|
||||||
|
>
|
||||||
|
<QDate v-model="dateRange.from">
|
||||||
|
<div class="row items-center justify-end">
|
||||||
|
<QBtn
|
||||||
|
v-close-popup
|
||||||
|
label="Close"
|
||||||
|
color="primary"
|
||||||
|
flat
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</QDate>
|
||||||
|
</QPopupProxy>
|
||||||
|
</QIcon>
|
||||||
|
</template>
|
||||||
|
</QInput>
|
||||||
|
<QInput
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
outlined
|
||||||
|
rounded
|
||||||
|
placeholder="dd-mm-aaa"
|
||||||
|
:label="t('invoiceOut.negativeBases.to')"
|
||||||
|
class="q-mr-md q"
|
||||||
|
:model-value="toDate(dateRange.to)"
|
||||||
|
>
|
||||||
|
<template #append>
|
||||||
|
<QIcon name="event" class="cursor-pointer">
|
||||||
|
<QPopupProxy
|
||||||
|
cover
|
||||||
|
transition-show="scale"
|
||||||
|
transition-hide="scale"
|
||||||
|
>
|
||||||
|
<QDate v-model="dateRange.to">
|
||||||
|
<div class="row items-center justify-end">
|
||||||
|
<QBtn
|
||||||
|
v-close-popup
|
||||||
|
label="Close"
|
||||||
|
color="primary"
|
||||||
|
flat
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</QDate>
|
||||||
|
</QPopupProxy>
|
||||||
|
</QIcon>
|
||||||
|
</template>
|
||||||
|
</QInput>
|
||||||
|
<QBtn
|
||||||
|
color="primary"
|
||||||
|
icon-right="archive"
|
||||||
|
no-caps
|
||||||
|
@click="downloadCSV()"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #top-right>
|
||||||
|
<div class="row justify-start items-center">
|
||||||
|
<span class="q-mr-md text-grey-7">
|
||||||
|
{{ rows.length }} {{ t('results') }}
|
||||||
|
</span>
|
||||||
|
<QBtn
|
||||||
|
color="primary"
|
||||||
|
icon-right="search"
|
||||||
|
no-caps
|
||||||
|
class="q-mr-sm"
|
||||||
|
@click="search"
|
||||||
|
/>
|
||||||
|
<QBtn color="primary" icon-right="refresh" no-caps @click="refresh" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #header="props">
|
||||||
|
<QTr :props="props" class="full-height">
|
||||||
|
<QTh v-for="col in props.cols" :key="col.name" :props="props">
|
||||||
|
<div class="column justify-start items-start full-height">
|
||||||
|
{{ t(`invoiceOut.negativeBases.${col.label}`) }}
|
||||||
|
<QInput
|
||||||
|
:disable="
|
||||||
|
[
|
||||||
|
'isActive',
|
||||||
|
'hasToInvoice',
|
||||||
|
'isTaxDataChecked',
|
||||||
|
].includes(col.field)
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
[
|
||||||
|
'isActive',
|
||||||
|
'hasToInvoice',
|
||||||
|
'isTaxDataChecked',
|
||||||
|
].includes(col.field)
|
||||||
|
"
|
||||||
|
dense
|
||||||
|
standout
|
||||||
|
v-model="filter[col.field]"
|
||||||
|
type="text"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</QTh>
|
||||||
|
</QTr>
|
||||||
|
</template>
|
||||||
|
<template #body-cell="props">
|
||||||
|
<QTd :props="props">
|
||||||
|
<component
|
||||||
|
:is="tableColumnComponents[props.col.name].component"
|
||||||
|
class="col-content"
|
||||||
|
v-bind="tableColumnComponents[props.col.name].props"
|
||||||
|
@click="tableColumnComponents[props.col.name].event(props)"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
v-if="
|
||||||
|
tableColumnComponents[props.col.name].props.type !=
|
||||||
|
'boolean'
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ props.value }}
|
||||||
|
</span>
|
||||||
|
<span v-else>
|
||||||
|
<QBadge v-if="props.value" color="grey">
|
||||||
|
<QIcon name="check" size="xs" />
|
||||||
|
</QBadge>
|
||||||
|
|
||||||
|
<QBadge v-else color="grey" outline>
|
||||||
|
<QIcon name="" size="xs" />
|
||||||
|
</QBadge>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<CustomerDescriptorProxy
|
||||||
|
v-if="props.col.name === 'clientId'"
|
||||||
|
:id="selectedCustomerId"
|
||||||
|
/>
|
||||||
|
<WorkerDescriptorProxy
|
||||||
|
v-if="props.col.name === 'comercial'"
|
||||||
|
:id="selectedWorkerId"
|
||||||
|
/>
|
||||||
|
</component>
|
||||||
|
</QTd>
|
||||||
|
</template>
|
||||||
|
</QTable>
|
||||||
|
</QPage>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.card {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #292929;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.card-section {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-text {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #eeeeee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #aaaaaa;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.col-content {
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 6px 6px 6px 6px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<i18n>
|
||||||
|
{
|
||||||
|
"en": {
|
||||||
|
"status": {
|
||||||
|
"packageInvoicing": "Build packaging tickets",
|
||||||
|
"invoicing": "Invoicing client",
|
||||||
|
"stopping": "Stopping process",
|
||||||
|
"done": "Ended process"
|
||||||
|
},
|
||||||
|
"of": "of"
|
||||||
|
},
|
||||||
|
"es": {
|
||||||
|
"status":{
|
||||||
|
"packageInvoicing": "Generación de tickets de empaque",
|
||||||
|
"invoicing": "Facturando a cliente",
|
||||||
|
"stopping": "Deteniendo proceso",
|
||||||
|
"done": "Proceso detenido",
|
||||||
|
},
|
||||||
|
"of": "de"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</i18n>
|
||||||
|
|
@ -10,7 +10,7 @@ export default {
|
||||||
component: RouterView,
|
component: RouterView,
|
||||||
redirect: { name: 'TravelMain' },
|
redirect: { name: 'TravelMain' },
|
||||||
menus: {
|
menus: {
|
||||||
main: ['TravelList'],
|
main: ['TravelList', 'ExtraCommunity'],
|
||||||
card: [],
|
card: [],
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
|
|
@ -29,11 +29,21 @@ export default {
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Travel/TravelList.vue'),
|
component: () => import('src/pages/Travel/TravelList.vue'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'extra-community',
|
||||||
|
name: 'ExtraCommunity',
|
||||||
|
meta: {
|
||||||
|
title: 'extraCommunity',
|
||||||
|
icon: 'vn:shipment-01',
|
||||||
|
},
|
||||||
|
component: () => import('src/pages/Travel/ExtraCommunity.vue'),
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: 'create',
|
path: 'create',
|
||||||
name: 'TravelCreate',
|
name: 'TravelCreate',
|
||||||
meta: {
|
meta: {
|
||||||
title: 'create',
|
title: 'extraCommunity',
|
||||||
|
icon: '',
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Travel/TravelCreate.vue'),
|
component: () => import('src/pages/Travel/TravelCreate.vue'),
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue