forked from verdnatura/salix-front
feat: manualInvoice with address
This commit is contained in:
parent
a2b7e81982
commit
fc3a025047
|
@ -1,155 +0,0 @@
|
||||||
<script setup>
|
|
||||||
import { reactive, ref, computed } from 'vue';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
|
||||||
import { useRouter } from 'vue-router';
|
|
||||||
|
|
||||||
import FetchData from 'components/FetchData.vue';
|
|
||||||
import VnRow from 'components/ui/VnRow.vue';
|
|
||||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
|
||||||
import VnInput from 'src/components/common/VnInput.vue';
|
|
||||||
import FormModelPopup from './FormModelPopup.vue';
|
|
||||||
import VnInputDate from './common/VnInputDate.vue';
|
|
||||||
|
|
||||||
const emit = defineEmits(['onDataSaved']);
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const manualInvoiceFormData = reactive({
|
|
||||||
maxShipped: Date.vnNew(),
|
|
||||||
});
|
|
||||||
|
|
||||||
const formModelPopupRef = ref();
|
|
||||||
const invoiceOutSerialsOptions = ref([]);
|
|
||||||
const taxAreasOptions = ref([]);
|
|
||||||
const ticketsOptions = ref([]);
|
|
||||||
const clientsOptions = ref([]);
|
|
||||||
const isLoading = computed(() => formModelPopupRef.value?.isLoading);
|
|
||||||
|
|
||||||
const onDataSaved = async (formData, requestResponse) => {
|
|
||||||
emit('onDataSaved', formData, requestResponse);
|
|
||||||
if (requestResponse && requestResponse.id)
|
|
||||||
router.push({ name: 'InvoiceOutSummary', params: { id: requestResponse.id } });
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<FetchData
|
|
||||||
url="InvoiceOutSerials"
|
|
||||||
:filter="{ where: { code: { neq: 'R' } }, order: ['code'] }"
|
|
||||||
@on-fetch="(data) => (invoiceOutSerialsOptions = data)"
|
|
||||||
auto-load
|
|
||||||
/>
|
|
||||||
<FetchData
|
|
||||||
url="TaxAreas"
|
|
||||||
:filter="{ order: ['code'] }"
|
|
||||||
@on-fetch="(data) => (taxAreasOptions = data)"
|
|
||||||
auto-load
|
|
||||||
/>
|
|
||||||
<FormModelPopup
|
|
||||||
ref="formModelPopupRef"
|
|
||||||
:title="t('Create manual invoice')"
|
|
||||||
url-create="InvoiceOuts/createManualInvoice"
|
|
||||||
model="invoiceOut"
|
|
||||||
:form-initial-data="manualInvoiceFormData"
|
|
||||||
@on-data-saved="onDataSaved"
|
|
||||||
>
|
|
||||||
<template #form-inputs="{ data }">
|
|
||||||
<span v-if="isLoading" class="text-primary invoicing-text">
|
|
||||||
<QIcon name="warning" class="fill-icon q-mr-sm" size="md" />
|
|
||||||
{{ t('Invoicing in progress...') }}
|
|
||||||
</span>
|
|
||||||
<VnRow>
|
|
||||||
<VnSelect
|
|
||||||
:label="t('Ticket')"
|
|
||||||
:options="ticketsOptions"
|
|
||||||
hide-selected
|
|
||||||
option-label="id"
|
|
||||||
option-value="id"
|
|
||||||
v-model="data.ticketFk"
|
|
||||||
@update:model-value="data.clientFk = null"
|
|
||||||
url="Tickets"
|
|
||||||
:where="{ refFk: null }"
|
|
||||||
:fields="['id', 'nickname']"
|
|
||||||
:filter-options="{ order: 'shipped DESC' }"
|
|
||||||
>
|
|
||||||
<template #option="scope">
|
|
||||||
<QItem v-bind="scope.itemProps">
|
|
||||||
<QItemSection>
|
|
||||||
<QItemLabel> #{{ scope.opt?.id }} </QItemLabel>
|
|
||||||
<QItemLabel caption>{{ scope.opt?.nickname }}</QItemLabel>
|
|
||||||
</QItemSection>
|
|
||||||
</QItem>
|
|
||||||
</template>
|
|
||||||
</VnSelect>
|
|
||||||
<span class="row items-center" style="max-width: max-content">{{
|
|
||||||
t('Or')
|
|
||||||
}}</span>
|
|
||||||
<VnSelect
|
|
||||||
:label="t('Client')"
|
|
||||||
:options="clientsOptions"
|
|
||||||
hide-selected
|
|
||||||
option-label="name"
|
|
||||||
option-value="id"
|
|
||||||
v-model="data.clientFk"
|
|
||||||
@update:model-value="data.ticketFk = null"
|
|
||||||
url="Clients"
|
|
||||||
:fields="['id', 'name']"
|
|
||||||
:filter-options="{ order: 'name ASC' }"
|
|
||||||
/>
|
|
||||||
<VnInputDate :label="t('Max date')" v-model="data.maxShipped" />
|
|
||||||
</VnRow>
|
|
||||||
<VnRow>
|
|
||||||
<VnSelect
|
|
||||||
:label="t('Serial')"
|
|
||||||
:options="invoiceOutSerialsOptions"
|
|
||||||
hide-selected
|
|
||||||
option-label="description"
|
|
||||||
option-value="code"
|
|
||||||
v-model="data.serial"
|
|
||||||
/>
|
|
||||||
<VnSelect
|
|
||||||
:label="t('Area')"
|
|
||||||
:options="taxAreasOptions"
|
|
||||||
hide-selected
|
|
||||||
option-label="code"
|
|
||||||
option-value="code"
|
|
||||||
v-model="data.taxArea"
|
|
||||||
/>
|
|
||||||
</VnRow>
|
|
||||||
<VnRow>
|
|
||||||
<VnInput
|
|
||||||
:label="t('Reference')"
|
|
||||||
type="textarea"
|
|
||||||
v-model="data.reference"
|
|
||||||
fill-input
|
|
||||||
autogrow
|
|
||||||
/>
|
|
||||||
</VnRow>
|
|
||||||
</template>
|
|
||||||
</FormModelPopup>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.invoicing-text {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
color: $primary;
|
|
||||||
font-size: 24px;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<i18n>
|
|
||||||
es:
|
|
||||||
Create manual invoice: Crear factura manual
|
|
||||||
Ticket: Ticket
|
|
||||||
Client: Cliente
|
|
||||||
Max date: Fecha límite
|
|
||||||
Serial: Serie
|
|
||||||
Area: Area
|
|
||||||
Reference: Referencia
|
|
||||||
Or: O
|
|
||||||
Invoicing in progress...: Facturación en progreso...
|
|
||||||
</i18n>
|
|
|
@ -162,9 +162,7 @@ onMounted(() => {
|
||||||
: $props.defaultMode;
|
: $props.defaultMode;
|
||||||
stateStore.rightDrawer = quasar.screen.gt.xs;
|
stateStore.rightDrawer = quasar.screen.gt.xs;
|
||||||
columnsVisibilitySkipped.value = [
|
columnsVisibilitySkipped.value = [
|
||||||
...splittedColumns.value.columns
|
...splittedColumns.value.columns.filter((c) => !c.visible).map((c) => c.name),
|
||||||
.filter((c) => c.visible == false)
|
|
||||||
.map((c) => c.name),
|
|
||||||
...['tableActions'],
|
...['tableActions'],
|
||||||
];
|
];
|
||||||
createForm.value = $props.create;
|
createForm.value = $props.create;
|
||||||
|
|
|
@ -1,8 +1,7 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { onMounted, watch, computed, ref } from 'vue';
|
import { onMounted, watch, computed, ref, useAttrs } from 'vue';
|
||||||
import { date } from 'quasar';
|
import { date } from 'quasar';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { useAttrs } from 'vue';
|
|
||||||
|
|
||||||
const model = defineModel({ type: [String, Date] });
|
const model = defineModel({ type: [String, Date] });
|
||||||
const $props = defineProps({
|
const $props = defineProps({
|
||||||
|
|
|
@ -95,7 +95,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
||||||
|
|
||||||
Object.assign(params, userParams);
|
Object.assign(params, userParams);
|
||||||
params.filter.skip = store.skip;
|
params.filter.skip = store.skip;
|
||||||
if (store.order && store.order.length) params.filter.order = store.order;
|
if (store.order?.length) params.filter.order = store.order;
|
||||||
else delete params.filter.order;
|
else delete params.filter.order;
|
||||||
|
|
||||||
params.filter = JSON.stringify(params.filter);
|
params.filter = JSON.stringify(params.filter);
|
||||||
|
|
|
@ -9,7 +9,6 @@ import RefundInvoiceForm from 'src/components/RefundInvoiceForm.vue';
|
||||||
import SendEmailDialog from 'components/common/SendEmailDialog.vue';
|
import SendEmailDialog from 'components/common/SendEmailDialog.vue';
|
||||||
|
|
||||||
import useNotify from 'src/composables/useNotify';
|
import useNotify from 'src/composables/useNotify';
|
||||||
import { useSession } from 'src/composables/useSession';
|
|
||||||
import { usePrintService } from 'composables/usePrintService';
|
import { usePrintService } from 'composables/usePrintService';
|
||||||
import { useVnConfirm } from 'composables/useVnConfirm';
|
import { useVnConfirm } from 'composables/useVnConfirm';
|
||||||
import { getUrl } from 'src/composables/getUrl';
|
import { getUrl } from 'src/composables/getUrl';
|
||||||
|
@ -30,8 +29,6 @@ const $props = defineProps({
|
||||||
|
|
||||||
const { notify } = useNotify();
|
const { notify } = useNotify();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const session = useSession();
|
|
||||||
const token = session.getToken();
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const { openReport, sendEmail } = usePrintService();
|
const { openReport, sendEmail } = usePrintService();
|
||||||
const { openConfirmationModal } = useVnConfirm();
|
const { openConfirmationModal } = useVnConfirm();
|
||||||
|
|
|
@ -13,6 +13,7 @@ import { toCurrency, toDate } from 'src/filters/index';
|
||||||
import { useStateStore } from 'stores/useStateStore';
|
import { useStateStore } from 'stores/useStateStore';
|
||||||
import { QBtn } from 'quasar';
|
import { QBtn } from 'quasar';
|
||||||
import CustomerDescriptorProxy from '../Customer/Card/CustomerDescriptorProxy.vue';
|
import CustomerDescriptorProxy from '../Customer/Card/CustomerDescriptorProxy.vue';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const stateStore = useStateStore();
|
const stateStore = useStateStore();
|
||||||
|
@ -24,6 +25,12 @@ const selectedRows = ref([]);
|
||||||
const hasSelectedCards = computed(() => selectedRows.value.length > 0);
|
const hasSelectedCards = computed(() => selectedRows.value.length > 0);
|
||||||
const MODEL = 'InvoiceOuts';
|
const MODEL = 'InvoiceOuts';
|
||||||
const { openReport } = usePrintService();
|
const { openReport } = usePrintService();
|
||||||
|
const addressOptions = ref([]);
|
||||||
|
|
||||||
|
async function fetchClientAddress(id) {
|
||||||
|
const { data } = await axios.get(`Clients/${id}/addresses`);
|
||||||
|
addressOptions.value = data;
|
||||||
|
}
|
||||||
|
|
||||||
const columns = computed(() => [
|
const columns = computed(() => [
|
||||||
{
|
{
|
||||||
|
@ -246,7 +253,17 @@ watchEffect(selectedRows);
|
||||||
:options="customerOptions"
|
:options="customerOptions"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
|
@update:model-value="fetchClientAddress"
|
||||||
/>
|
/>
|
||||||
|
<VnSelect
|
||||||
|
v-model="data.addressFk"
|
||||||
|
:label="t('invoiceOutModule.address')"
|
||||||
|
:options="addressOptions"
|
||||||
|
option-value="id"
|
||||||
|
option-label="nickname"
|
||||||
|
:disable="!data.clientFk"
|
||||||
|
/>
|
||||||
|
|
||||||
<VnSelect
|
<VnSelect
|
||||||
url="InvoiceOutSerials"
|
url="InvoiceOutSerials"
|
||||||
v-model="data.serial"
|
v-model="data.serial"
|
||||||
|
|
|
@ -2,6 +2,7 @@ invoiceOutModule:
|
||||||
customer: Client
|
customer: Client
|
||||||
amount: Amount
|
amount: Amount
|
||||||
company: Company
|
company: Company
|
||||||
|
address: Address
|
||||||
invoiceOutList:
|
invoiceOutList:
|
||||||
tableVisibleColumns:
|
tableVisibleColumns:
|
||||||
id: ID
|
id: ID
|
||||||
|
@ -15,11 +16,11 @@ invoiceOutList:
|
||||||
DownloadPdf: Download PDF
|
DownloadPdf: Download PDF
|
||||||
InvoiceOutSummary: Summary
|
InvoiceOutSummary: Summary
|
||||||
negativeBases:
|
negativeBases:
|
||||||
country: Country
|
country: Country
|
||||||
clientId: Client ID
|
clientId: Client ID
|
||||||
base: Base
|
base: Base
|
||||||
ticketId: Ticket
|
ticketId: Ticket
|
||||||
active: Active
|
active: Active
|
||||||
hasToInvoice: Has to invoice
|
hasToInvoice: Has to invoice
|
||||||
verifiedData: Verified data
|
verifiedData: Verified data
|
||||||
commercial: Commercial
|
commercial: Commercial
|
||||||
|
|
|
@ -4,6 +4,7 @@ invoiceOutModule:
|
||||||
customer: Cliente
|
customer: Cliente
|
||||||
amount: Importe
|
amount: Importe
|
||||||
company: Empresa
|
company: Empresa
|
||||||
|
address: Consignatario
|
||||||
invoiceOutList:
|
invoiceOutList:
|
||||||
tableVisibleColumns:
|
tableVisibleColumns:
|
||||||
id: ID
|
id: ID
|
||||||
|
@ -20,12 +21,12 @@ invoiceOutList:
|
||||||
DownloadPdf: Descargar PDF
|
DownloadPdf: Descargar PDF
|
||||||
InvoiceOutSummary: Resumen
|
InvoiceOutSummary: Resumen
|
||||||
negativeBases:
|
negativeBases:
|
||||||
country: País
|
country: País
|
||||||
clientId: ID del cliente
|
clientId: ID del cliente
|
||||||
client: Cliente
|
client: Cliente
|
||||||
base: Base
|
base: Base
|
||||||
ticketId: Ticket
|
ticketId: Ticket
|
||||||
active: Activo
|
active: Activo
|
||||||
hasToInvoice: Debe facturar
|
hasToInvoice: Debe facturar
|
||||||
verifiedData: Datos verificados
|
verifiedData: Datos verificados
|
||||||
commercial: Comercial
|
commercial: Comercial
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { useRoute, useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { onMounted, ref } from 'vue';
|
import { reactive, onMounted, ref } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { useState } from 'composables/useState';
|
import { useState } from 'composables/useState';
|
||||||
|
@ -9,16 +9,13 @@ import VnRow from 'components/ui/VnRow.vue';
|
||||||
import VnSelect from 'components/common/VnSelect.vue';
|
import VnSelect from 'components/common/VnSelect.vue';
|
||||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||||
import { useDialogPluginComponent } from 'quasar';
|
import { useDialogPluginComponent } from 'quasar';
|
||||||
import { reactive } from 'vue';
|
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'components/FetchData.vue';
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const route = useRoute();
|
|
||||||
const state = useState();
|
const state = useState();
|
||||||
const ORDER_MODEL = 'order';
|
const ORDER_MODEL = 'order';
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const clientList = ref([]);
|
|
||||||
const agencyList = ref([]);
|
const agencyList = ref([]);
|
||||||
const addressList = ref([]);
|
const addressList = ref([]);
|
||||||
defineEmits(['confirm', ...useDialogPluginComponent.emits]);
|
defineEmits(['confirm', ...useDialogPluginComponent.emits]);
|
||||||
|
|
Loading…
Reference in New Issue