feat(customer): improve basicData to balance

This commit is contained in:
Alex Moreno 2024-07-26 09:47:28 +02:00
parent 8d59fc95e7
commit 026c632a4c
25 changed files with 527 additions and 914 deletions

View File

@ -7,9 +7,11 @@ import { dashIfEmpty } from 'src/filters';
import VnSelect from 'components/common/VnSelect.vue';
import VnSelectCache from 'components/common/VnSelectCache.vue';
import VnInput from 'components/common/VnInput.vue';
import VnInputNumber from 'components/common/VnInputNumber.vue';
import VnInputDate from 'components/common/VnInputDate.vue';
import VnInputTime from 'components/common/VnInputTime.vue';
import VnComponent from 'components/common/VnComponent.vue';
import VnUserLink from 'components/ui/VnUserLink.vue';
const model = defineModel(undefined, { required: true });
const $props = defineProps({
@ -66,7 +68,7 @@ const defaultComponents = {
},
},
number: {
component: markRaw(VnInput),
component: markRaw(VnInputNumber),
attrs: {
disable: !$props.isEditable,
class: 'fit',
@ -98,14 +100,14 @@ const defaultComponents = {
},
checkbox: {
component: markRaw(QCheckbox),
attrs: (prop) => {
attrs: ({ model }) => {
const defaultAttrs = {
disable: !$props.isEditable,
'model-value': Boolean(prop),
'model-value': Boolean(model),
class: 'no-padding fit',
};
if (typeof prop == 'number') {
if (typeof model == 'number') {
defaultAttrs['true-value'] = 1;
defaultAttrs['false-value'] = 0;
}
@ -126,6 +128,9 @@ const defaultComponents = {
icon: {
component: markRaw(QIcon),
},
userLink: {
component: markRaw(VnUserLink),
},
};
const value = computed(() => {
@ -152,6 +157,7 @@ const col = computed(() => {
newColumn.component = 'checkbox';
if ($props.default && !newColumn.component) newColumn.component = $props.default;
if ($props.componentProp == 'columnCreate') console.log('newColumn: ', newColumn);
return newColumn;
});
@ -163,14 +169,14 @@ const components = computed(() => $props.components ?? defaultComponents);
v-if="col.before"
:prop="col.before"
:components="components"
:value="model"
:value="{ row, model }"
v-model="model"
/>
<VnComponent
v-if="col.component"
:prop="col"
:components="components"
:value="model"
:value="{ row, model }"
v-model="model"
/>
<span :title="value" v-else>{{ value }}</span>
@ -178,7 +184,7 @@ const components = computed(() => $props.components ?? defaultComponents);
v-if="col.after"
:prop="col.after"
:components="components"
:value="model"
:value="{ row, model }"
v-model="model"
/>
</div>

View File

@ -10,6 +10,8 @@ import VnInputDate from 'components/common/VnInputDate.vue';
import VnInputTime from 'components/common/VnInputTime.vue';
import VnTableColumn from 'components/VnTable/VnColumn.vue';
defineExpose({ addFilter });
const $props = defineProps({
column: {
type: Object,
@ -32,7 +34,7 @@ const model = defineModel(undefined, { required: true });
const arrayData = useArrayData($props.dataKey, { searchUrl: $props.searchUrl });
const columnFilter = computed(() => $props.column?.columnFilter);
const updateEvent = { 'update:modelValue': addFilter };
const updateEvent = { 'update:modelValue': addFilter, remove: () => addFilter(null) };
const enterEvent = {
'keyup.enter': () => addFilter(model.value),
remove: () => addFilter(null),

View File

@ -311,11 +311,6 @@ defineExpose({
:params="params"
:columns="splittedColumns.columns"
/>
<slot
name="moreFilterPanel"
:params="params"
:columns="splittedColumns.columns"
/>
</template>
</VnFilterPanel>
</QScrollArea>
@ -326,6 +321,7 @@ defineExpose({
v-bind="$attrs"
:limit="20"
ref="CrudModelRef"
@on-fetch="(...args) => emit('onFetch', ...args)"
:search-url="searchUrl"
:disable-infinite-scroll="isTableMode"
@save-changes="reload"
@ -363,7 +359,7 @@ defineExpose({
<template #top-left v-if="!$props.withoutHeader">
<slot name="top-left"></slot>
</template>
<template #top-right>
<template #top-right v-if="!$props.withoutHeader">
<VnVisibleColumn
v-if="isTableMode"
v-model="splittedColumns.columns"
@ -391,7 +387,7 @@ defineExpose({
<div
class="column self-start q-ml-xs ellipsis"
:class="`text-${col?.align ?? 'left'}`"
style="height: 75px"
:style="$props.columnSearch ? 'height: 75px' : ''"
>
<div
class="row items-center no-wrap"
@ -432,7 +428,7 @@ defineExpose({
</VnTableChip>
</QTd>
</template>
<template #body-cell="{ col, row }">
<template #body-cell="{ col, row, rowIndex }">
<!-- Columns -->
<QTd
auto-width
@ -445,7 +441,12 @@ defineExpose({
rowCtrlClickFunction($event, row)
"
>
<slot :name="`column-${col.name}`" :col="col" :row="row">
<slot
:name="`column-${col.name}`"
:col="col"
:row="row"
:row-index="rowIndex"
>
<VnTableColumn
:column="col"
:row="row"
@ -465,7 +466,6 @@ defineExpose({
>
<QBtn
v-for="(btn, index) of col.actions"
v-show="btn.show ? btn.show(row) : true"
:key="index"
:title="btn.title"
:icon="btn.icon"
@ -476,6 +476,11 @@ defineExpose({
? 'text-primary-light'
: 'color-vn-text '
"
:style="`visibility: ${
(btn.show && btn.show(row)) ?? true
? 'visible'
: 'hidden'
}`"
@click="btn.action(row)"
/>
</QTd>
@ -533,7 +538,9 @@ defineExpose({
:class="$props.cardClass"
>
<div
v-for="col of splittedColumns.cardVisible"
v-for="(
col, index
) of splittedColumns.cardVisible"
:key="col.name"
class="fields"
>
@ -554,6 +561,7 @@ defineExpose({
:name="`column-${col.name}`"
:col="col"
:row="row"
:row-index="index"
>
<VnTableColumn
:column="col"
@ -613,9 +621,15 @@ defineExpose({
>
<template #form-inputs="{ data }">
<div class="grid-create">
<VnTableColumn
<slot
v-for="column of splittedColumns.create"
:key="column.name"
:name="`column-create-${column.name}`"
:data="data"
:column-name="column.name"
:label="column.label"
>
<VnTableColumn
:column="column"
:row="{}"
default="input"
@ -623,6 +637,7 @@ defineExpose({
:show-label="true"
component-prop="columnCreate"
/>
</slot>
<slot name="more-create-dialog" :data="data" />
</div>
</template>

View File

@ -30,12 +30,12 @@ function mix(toComponent) {
mixed = {
component: customComponent?.component ?? component,
attrs: {
...toValueAttrs(attrs),
...toValueAttrs(customComponent?.attrs),
...toComponent,
...toValueAttrs(customComponent?.forceAttrs),
...toComponent,
...toValueAttrs(attrs),
},
event: event ?? customComponent?.event,
event: { ...customComponent?.event, ...event },
};
return mixed;
}

View File

@ -0,0 +1,8 @@
<script setup>
import VnInput from 'src/components/common/VnInput.vue';
const model = defineModel({ type: [Number, String] });
</script>
<template>
<VnInput v-bind="$attrs" v-model.number="model" type="number" />
</template>

View File

@ -2,7 +2,7 @@
import { ref, toRefs, computed, watch, onMounted } from 'vue';
import { useI18n } from 'vue-i18n';
import FetchData from 'src/components/FetchData.vue';
const emit = defineEmits(['update:modelValue', 'update:options']);
const emit = defineEmits(['update:modelValue', 'update:options', 'remove']);
const $props = defineProps({
modelValue: {
@ -159,7 +159,10 @@ async function filterHandler(val, update) {
let newOptions;
if (!$props.defaultFilter) return update();
if ($props.url) {
if (
$props.url &&
($props.limit || (!$props.limit && Object.keys(myOptions.value).length === 0))
) {
newOptions = await fetchFilter(val);
} else newOptions = filter(val, myOptionsOriginal.value);
update(
@ -208,7 +211,12 @@ async function filterHandler(val, update) {
<QIcon
v-show="value"
name="close"
@click.stop="value = null"
@click.stop="
() => {
value = null;
emit('remove');
}
"
class="cursor-pointer"
size="xs"
/>

View File

@ -28,8 +28,8 @@ function handleKeyUp(event) {
}
async function insert() {
const body = $props.body;
Object.assign(body, { text: newNote.value });
await axios.post($props.url, body);
const newBody = { ...body, ...{ text: newNote.value } };
await axios.post($props.url, newBody);
await vnPaginateRef.value.fetch();
newNote.value = '';
}

View File

@ -115,8 +115,8 @@ watch(
);
watch(
() => props.url,
(url) => fetch({ url })
() => [props.url, props.filter],
([url, filter]) => fetch({ url, filter })
);
const addFilter = async (filter, params) => {

View File

@ -18,4 +18,3 @@ const { t } = useI18n();
</slot>
<WorkerDescriptorProxy v-if="$props.workerId" :id="$props.workerId" />
</template>
<style scoped></style>

View File

@ -1,120 +1,191 @@
<script setup>
import { computed, onBeforeMount, ref, watch } from 'vue';
import { computed, onBeforeMount, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import { useRole } from 'src/composables/useRole';
import axios from 'axios';
import { QCheckbox, QBtn, useQuasar } from 'quasar';
import { useQuasar } from 'quasar';
import { toCurrency, toDate, toDateHourMin } from 'src/filters';
import { useState } from 'src/composables/useState';
import { useState } from 'composables/useState';
import { useStateStore } from 'stores/useStateStore';
import { useValidator } from 'src/composables/useValidator';
import { usePrintService } from 'src/composables/usePrintService';
import { useSession } from 'src/composables/useSession';
import { usePrintService } from 'composables/usePrintService';
import { useSession } from 'composables/useSession';
import { useVnConfirm } from 'composables/useVnConfirm';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import FetchData from 'components/FetchData.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnTable from 'components/VnTable/VnTable.vue';
import VnInput from 'components/common/VnInput.vue';
import VnSubToolbar from 'components/ui/VnSubToolbar.vue';
import VnFilter from 'components/VnTable/VnFilter.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
import CustomerNewPayment from 'src/pages/Customer/components/CustomerNewPayment.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import InvoiceOutDescriptorProxy from 'src/pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
const session = useSession();
const tokenMultimedia = session.getTokenMultimedia();
const { openConfirmationModal } = useVnConfirm();
const { sendEmail } = usePrintService();
const { t } = useI18n();
const { validate } = useValidator();
const { hasAny } = useRole();
const session = useSession();
const tokenMultimedia = session.getTokenMultimedia();
const quasar = useQuasar();
const route = useRoute();
const state = useState();
const stateStore = useStateStore();
const user = state.getUser();
const clientRisks = ref(null);
const clientRisksRef = ref(null);
const companiesOptions = ref([]);
const companyId = ref(null);
const receiptsRef = ref(null);
const receiptsData = ref([]);
const filterCompanies = { order: ['code'] };
const userParams = {
const clientRisk = ref([]);
const tableRef = ref();
const companyId = ref();
const companyLastId = ref(user.value.companyFk);
const balances = ref([]);
const vnFilterRef = ref({});
const filter = computed(() => {
return {
clientId: route.params.id,
companyId: user.value.companyFk,
companyId: companyId.value ?? user.value.companyFk,
};
});
const companyFilterColumn = {
align: 'left',
name: 'companyId',
label: t('Company'),
component: 'select',
attrs: {
url: 'Companies',
optionLabel: 'code',
sortBy: 'code',
limit: 0,
},
columnFilter: {
event: {
remove: () => (companyId.value = null),
'update:modelValue': (newCompanyFk) => {
if (!newCompanyFk) return;
vnFilterRef.value.addFilter(newCompanyFk);
companyLastId.value = newCompanyFk;
},
blur: () =>
!companyId.value &&
(companyId.value = companyLastId.value ?? user.value.companyFk),
},
},
visible: false,
create: true,
};
const filter = {
include: { relation: 'company', scope: { fields: ['code'] } },
where: { clientFk: route.params.id, companyFk: user.value.companyFk },
const referenceColumn = {
align: 'left',
name: 'description',
label: t('Reference'),
};
const onlyCreate = {
visible: false,
columnFilter: false,
create: true,
};
const columns = computed(() => [
{
align: 'left',
field: 'payed',
format: (value) => toDate(value),
name: 'payed',
label: t('Date'),
name: 'date',
format: ({ payed }) => toDate(payed),
cardVisible: true,
create: true,
columnCreate: {
component: 'date',
},
},
{
align: 'left',
field: 'created',
format: (value) => toDateHourMin(value),
name: 'created',
label: t('Creation date'),
name: 'creationDate',
format: ({ created }) => toDateHourMin(created),
cardVisible: true,
},
{
align: 'left',
field: 'userName',
name: 'workerFk',
label: t('Employee'),
name: 'employee',
columnField: {
component: 'userLink',
attrs: ({ row }) => {
return {
workerId: row.workerFk,
name: row.userName,
};
},
{
align: 'left',
field: 'description',
label: t('Reference'),
name: 'reference',
},
cardVisible: true,
},
{ ...referenceColumn, isTitle: true, class: 'extend' },
companyFilterColumn,
{
align: 'left',
field: 'bankFk',
align: 'right',
name: 'bankFk',
label: t('Bank'),
name: 'bank',
cardVisible: true,
create: true,
},
{
align: 'right',
name: 'amountPaid',
label: t('Amount'),
component: 'number',
...onlyCreate,
},
{
align: 'right',
field: 'debit',
format: (value) => value && toCurrency(value),
label: t('Debit'),
name: 'debit',
label: t('Debit'),
format: ({ debit }) => debit && toCurrency(debit),
isId: true,
},
{
align: 'right',
field: 'credit',
format: (value) => value && toCurrency(value),
name: 'credit',
label: t('Havings'),
name: 'havings',
format: ({ credit }) => credit && toCurrency(credit),
cardVisible: true,
},
{
align: 'right',
field: 'balance',
format: (value) => value && toCurrency(value),
label: t('Balance'),
name: 'balance',
label: t('Balance'),
format: ({ balance }) => toCurrency(balance),
cardVisible: true,
},
{
align: 'left',
field: 'isConciliate',
name: 'isConciliate',
label: t('Conciliated'),
name: 'conciliated',
cardVisible: true,
},
{ ...referenceColumn, ...onlyCreate },
{
align: 'left',
field: 'totalWithVat',
label: '',
name: 'actions',
name: 'tableActions',
actions: [
{
title: t('globals.downloadPdf'),
icon: 'cloud_download',
show: (row) => row.isInvoice,
action: (row) => showBalancePdf(row),
},
{
title: t('Send compensation'),
icon: 'outgoing_mail',
show: (row) => !!row.isCompensation,
action: ({ id }) =>
openConfirmationModal(
t('Send compensation'),
t('Do you want to report compensation to the client by mail?'),
() => sendEmail(`Receipts/${id}/balance-compensation-email`)
),
},
],
},
]);
@ -123,254 +194,154 @@ onBeforeMount(() => {
companyId.value = user.value.companyFk;
});
watch(
() => route.params.id,
(newValue) => {
if (!newValue) return;
userParams.clientId = newValue;
filter.where.clientFk = newValue;
getData();
async function getClientRisk(reload = false) {
if (reload || !clientRisk.value?.length) {
const { data } = await axios.get(`clientRisks`, {
params: {
filter: JSON.stringify({
include: { relation: 'company', scope: { fields: ['code'] } },
where: { clientFk: route.params.id, companyFk: user.value.companyFk },
}),
},
});
clientRisk.value = data;
}
);
return clientRisk.value;
}
const getData = () => {
receiptsRef.value?.fetch();
clientRisksRef.value?.fetch();
};
const getCurrentBalance = () => {
const currentBalance = clientRisks.value.find((balance) => {
async function getCurrentBalance() {
const currentBalance = (await getClientRisk()).find((balance) => {
return balance.companyFk === companyId.value;
});
return currentBalance && currentBalance.amount;
};
}
const onFetch = (balances) => {
balances.forEach((balance, index) => {
async function onFetch(data) {
balances.value = [];
for (const [index, balance] of data.entries()) {
if (index === 0) {
balance.balance = getCurrentBalance();
} else {
let previousBalance = balances[index - 1];
balance.balance =
previousBalance.balance -
(previousBalance.debit - previousBalance.credit);
balance.balance = await getCurrentBalance();
continue;
}
});
receiptsData.value = balances;
};
const previousBalance = data[index - 1];
balance.balance =
previousBalance?.balance - (previousBalance?.debit - previousBalance?.credit);
}
balances.value = data;
}
// BORRAR COMPONENTE Y HACER CON VNTABLE
const showNewPaymentDialog = () => {
quasar.dialog({
component: CustomerNewPayment,
componentProps: {
companyId: companyId.value,
totalCredit: clientRisks.value[0]?.amount,
promise: getData,
totalCredit: clientRisk.value[0]?.amount,
promise: getClientRisk(true),
},
});
};
const updateCompanyId = (id) => {
if (id) {
companyId.value = id;
userParams.companyId = id;
filter.where.companyFk = id;
}
getData();
};
const saveFieldValue = async (row) => {
try {
const payload = { description: row.description };
await axios.patch(`Receipts/${row.id}`, payload);
} catch (err) {
return err;
}
};
const sendEmailAction = () => {
sendEmail(`Suppliers/${route.params.id}/campaign-metrics-email`);
};
const showBalancePdf = (balance) => {
const url = `api/InvoiceOuts/${balance.id}/download?access_token=${tokenMultimedia}`;
const showBalancePdf = ({ id }) => {
const url = `api/InvoiceOuts/${id}/download?access_token=${tokenMultimedia}`;
window.open(url, '_blank');
};
</script>
<template>
<FetchData
:filter="filter"
@on-fetch="(data) => (clientRisks = data)"
auto-load
ref="clientRisksRef"
url="ClientRisks"
<VnSubToolbar class="q-mb-md">
<template #st-data>
<div class="column justify-center q-px-md q-py-sm">
<span class="text-bold">{{ t('Total by company') }}</span>
<div class="row justify-center" v-if="clientRisk?.length">
{{ clientRisk[0].company.code }}:
{{ toCurrency(clientRisk[0].amount) }}
</div>
</div>
</template>
<template #st-actions>
<div>
<VnFilter
ref="vnFilterRef"
v-model="companyId"
data-key="CustomerBalance"
:column="companyFilterColumn"
search-url="balance"
/>
<FetchData
:filter="filterCompanies"
@on-fetch="(data) => (companiesOptions = data)"
auto-load
url="Companies"
/>
<VnPaginate
auto-load
</div>
</template>
</VnSubToolbar>
<VnTable
ref="tableRef"
data-key="CustomerBalance"
url="Receipts/filter"
:user-params="userParams"
ref="receiptsRef"
@on-fetch="onFetch"
>
<template #body="{ rows }">
<QTable
search-url="balance"
:user-params="filter"
:columns="columns"
:no-data-label="t('globals.noResults')"
:rows-per-page-options="[0]"
:rows="rows"
class="full-width q-mt-md"
row-key="id"
:right-search="false"
:is-editable="false"
:column-search="false"
@on-fetch="onFetch"
:create="{
urlCreate: `Clients/${route.params.id}/createReceipt`,
mapper: (data) => {
data.companyFk = data.companyId;
delete data.companyId;
return data;
},
title: t('New payment'),
onDataSaved: () => tableRef.reload(),
formInitialData: { companyId },
}"
auto-load
>
<template #body-cell-employee="{ row }">
<QTd auto-width @click.stop>
<QBtn color="blue" flat no-caps>{{ row.userName }}</QBtn>
<WorkerDescriptorProxy :id="row.workerFk" />
</QTd>
<template #column-balance="{ rowIndex }">
{{ toCurrency(balances[rowIndex]?.balance) }}
</template>
<template #body-cell-reference="{ row }">
<QTd auto-width @click.stop v-if="row.isInvoice">
<QBtn color="blue" dense flat>
{{ t('bill', { ref: row.description }) }}
</QBtn>
<InvoiceOutDescriptorProxy :id="row.id" />
</QTd>
<QTd v-else>
<VnInput
@keyup.enter="saveFieldValue(row)"
autofocus
clearable
dense
v-model="row.description"
/>
</QTd>
</template>
<template #body-cell-conciliated="{ row }">
<QTd align="center">
<QCheckbox :model-value="row.isConciliate === 1" disable />
</QTd>
</template>
<template #body-cell-actions="{ row }">
<QTd align="center">
<QIcon
@click.stop="showDialog = true"
class="q-ml-md fill-icon"
color="primary"
name="outgoing_mail"
size="sm"
v-if="row.isCompensation"
>
<QTooltip>
{{ t('Send compensation') }}
</QTooltip>
</QIcon>
<QIcon
@click="showBalancePdf(row)"
class="q-ml-md fill-icon"
color="primary"
name="cloud_download"
size="sm"
v-if="row.hasPdf"
>
<QTooltip>
{{ t('globals.downloadPdf') }}
</QTooltip>
</QIcon>
<QDialog v-model="showDialog">
<QCard class="q-pa-sm">
<QCardSection>
<span
ref="closeButton"
class="flex justify-end color-vn-label"
v-close-popup
>
<QIcon name="close" size="sm" />
<template #column-description="{ row }">
<div class="link" v-if="row.isInvoice">
{{ row.description }}
<InvoiceOutDescriptorProxy :id="row.description" />
</div>
<span v-else class="q-pa-xs dotted rounded-borders" :title="row.description">
{{ row.description }}
</span>
<div class="text-h6">
{{ t('Send compensation') }}
</div>
</QCardSection>
<QCardSection>
<div>
{{
t(
'Do you want to report compensation to the client by mail?'
)
}}
</div>
</QCardSection>
<QCardActions class="flex justify-end q-mb-sm">
<QBtn
:label="t('globals.cancel')"
color="primary"
flat
v-close-popup
<QPopupEdit
v-model="row.description"
v-slot="scope"
@save="
(value) =>
value != row.description &&
axios.patch(`Receipts/${row.id}`, { description: value })
"
>
<VnInput
v-model="scope.value"
:disable="!hasAny(['administrative'])"
@keypress.enter="scope.set"
autofocus
/>
<QBtn
:label="t('globals.save')"
@click="sendEmailAction"
class="q-ml-sm"
color="primary"
/>
</QCardActions>
</QCard>
</QDialog>
</QTd>
</QPopupEdit>
</template>
</QTable>
</template>
</VnPaginate>
<QDrawer :width="256" show-if-above side="right" v-model="stateStore.rightDrawer">
<div class="q-mt-xl q-px-md">
<template #column-create-bankFk="{ data, columnName, label }">
<VnSelect
:label="t('Company')"
:options="companiesOptions"
@update:model-value="updateCompanyId($event)"
hide-selected
option-label="code"
option-value="id"
v-model="companyId"
:rules="validate('entry.companyFk')"
/>
</div>
<QCard class="q-ma-md q-pa-md q-mt-lg" v-if="receiptsData?.length">
<QCardSection>
<div class="flex justify-center text-subtitle1 text-bold">
{{ t('Total by company') }}
</div>
<div class="flex justify-center">
<div class="q-mr-sm" v-if="clientRisks?.length">
{{ clientRisks[0].company.code }}:
</div>
<div v-if="clientRisks?.length">
{{ toCurrency(clientRisks[0].amount) }}
</div>
</div>
</QCardSection>
</QCard>
</QDrawer>
<QPageSticky :offset="[18, 18]">
<QBtn @click.stop="showNewPaymentDialog()" color="primary" fab icon="add" />
<QTooltip>
{{ t('New payment') }}
</QTooltip>
</QPageSticky>
url="Accountings"
:label="label"
:limit="0"
option-label="bank"
sort-by="id"
v-model="data[columnName]"
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemLabel>
#{{ scope.opt?.id }}: {{ scope.opt?.bank }}
</QItemLabel>
</QItem>
</template>
</VnSelect>
</template>
</VnTable>
</template>
<i18n>
@ -393,3 +364,12 @@ es:
Send compensation: Enviar compensación
Do you want to report compensation to the client by mail?: ¿Desea informar de la compensación al cliente por correo?
</i18n>
<style lang="scss" scoped>
.dotted {
border: 1px dotted var(--vn-header-color);
}
.dotted:hover {
border: 1px dotted $primary;
}
</style>

View File

@ -8,65 +8,27 @@ import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnImg from 'src/components/ui/VnImg.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
const route = useRoute();
const { t } = useI18n();
const workers = ref([]);
const workersCopy = ref([]);
const businessTypes = ref([]);
const contactChannels = ref([]);
function setWorkers(data) {
workers.value = data;
workersCopy.value = data;
}
const filterOptions = {
options: workers,
filterFn: (options, value) => {
const search = value.toLowerCase();
if (value === '') return workersCopy.value;
return options.value.filter((row) => {
const id = row.id;
const name = row.name.toLowerCase();
const idMatches = id === search;
const nameMatches = name.indexOf(search) > -1;
return idMatches || nameMatches;
});
},
};
</script>
<template>
<fetch-data
url="Workers/activeWithInheritedRole"
:filter="{ where: { role: 'salesPerson' } }"
@on-fetch="setWorkers"
auto-load
/>
<fetch-data
<FetchData
url="ContactChannels"
@on-fetch="(data) => (contactChannels = data)"
auto-load
/>
<fetch-data
<FetchData
url="BusinessTypes"
@on-fetch="(data) => (businessTypes = data)"
auto-load
/>
<fetch-data
:filter="filter"
@on-fetch="(data) => (clients = data)"
auto-load
url="Clients"
/>
<FormModel :url="`Clients/${route.params.id}`" auto-load model="customer">
<template #form="{ data, validate, filter }">
<template #form="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md">
<VnInput
:label="t('globals.name')"
@ -75,7 +37,6 @@ const filterOptions = {
clearable
v-model="data.name"
/>
<QSelect
:input-debounce="0"
:label="t('customer.basicData.businessType')"
@ -126,30 +87,26 @@ const filterOptions = {
/>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<QSelect
:input-debounce="0"
:label="t('customer.basicData.salesPerson')"
:options="workers"
:rules="validate('client.salesPersonFk')"
@filter="(value, update) => filter(value, update, filterOptions)"
emit-value
map-options
option-label="name"
option-value="id"
use-input
<VnSelect
url="Workers/activeWithInheritedRole"
:filter="{ where: { role: 'salesPerson' } }"
option-filter="firstName"
v-model="data.salesPersonFk"
:label="t('customer.basicData.salesPerson')"
:rules="validate('client.salesPersonFk')"
:use-like="false"
>
<template #prepend>
<QAvatar color="orange">
<VnImg
v-if="data.salesPersonFk"
:id="user.id"
:id="data.salesPersonFk"
collection="user"
spinner-color="white"
/>
</QAvatar>
</template>
</QSelect>
</VnSelect>
<QSelect
v-model="data.contactChannelFk"
:options="contactChannels"

View File

@ -1,8 +1,7 @@
<script setup>
import { computed } from 'vue';
import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import { QBtn } from 'quasar';
import { toCurrency, toDateHourMin } from 'src/filters';
import VnTable from 'components/VnTable/VnTable.vue';
import VnUserLink from 'src/components/ui/VnUserLink.vue';
@ -10,7 +9,8 @@ import VnUserLink from 'src/components/ui/VnUserLink.vue';
const { t } = useI18n();
const route = useRoute();
const filter = {
const filter = computed(() => {
return {
include: [
{
relation: 'worker',
@ -21,10 +21,11 @@ const filter = {
},
],
where: { clientFk: +route.params.id },
order: ['created DESC'],
limit: 20,
};
};
});
const tableRef = ref();
const tableData = ref([]);
const columns = computed(() => [
{
align: 'left',
@ -43,39 +44,44 @@ const columns = computed(() => [
name: 'amount',
format: ({ amount }) => toCurrency(amount),
},
{
label: t('Credit'),
name: 'credit',
create: true,
visible: false,
attrs: {
autofocus: true,
},
},
]);
</script>
<template>
<!-- Column titles are missing -->
<VnTable
ref="tableRef"
data-key="ClientCredit"
url="ClientCredits"
search-url="credits"
:filter="filter"
:order="['created DESC']"
:columns="columns"
default-mode="table"
auto-load
:right-search="false"
:is-editable="false"
:use-model="true"
:column-search="false"
:disable-option="{ card: true }"
@on-fetch="(data) => (tableData = data)"
:create="{
urlUpdate: `Clients/${route.params.id}`,
title: t('New credit'),
onDataSaved: () => tableRef.reload(),
formInitialData: { credit: tableData.at(0)?.amount },
}"
>
<template #column-employee="{ row }">
<VnUserLink :name="row?.worker?.user?.name" :worker-id="row.worker?.id" />
</template>
</VnTable>
<QPageSticky :offset="[18, 18]">
<QBtn
@click.stop="$router.push({ name: 'CustomerCreditCreate' })"
color="primary"
fab
icon="add"
/>
<QTooltip>
{{ t('New credit') }}
</QTooltip>
</QPageSticky>
</template>
<i18n>
es:

View File

@ -89,24 +89,18 @@ function handleLocation(data, location) {
</QItem>
</template>
</VnSelect>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnLocation
:rules="validate('Worker.postcode')"
:roles-allowed-to-create="['deliveryAssistant']"
:options="postcodesOptions"
v-model="data.postcode"
@update:model-value="(location) => handleLocation(data, location)"
>
</VnLocation>
/>
</VnRow>
<VnRow>
<QCheckbox :label="t('Active')" v-model="data.isActive" />
<QCheckbox :label="t('Frozen')" v-model="data.isFreezed" />
</VnRow>
<VnRow>
<QCheckbox :label="t('Has to invoice')" v-model="data.hasToInvoice" />
<div>

View File

@ -2,20 +2,17 @@
import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import { QBtn } from 'quasar';
import { useStateStore } from 'src/stores/useStateStore';
import { toCurrency } from 'src/filters';
import { toDateTimeFormat } from 'src/filters/date';
import FetchData from 'components/FetchData.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import VnTable from 'components/VnTable/VnTable.vue';
const { t } = useI18n();
const route = useRoute();
const stateStore = computed(() => useStateStore());
const rows = ref([]);
const totalAmount = ref();
const filter = {
const tableRef = ref();
const filter = computed(() => {
return {
include: [
{
relation: 'greugeType',
@ -30,73 +27,61 @@ const filter = {
},
},
],
order: 'shipped DESC, amount',
where: {
clientFk: `${route.params.id}`,
clientFk: route.params.id,
},
limit: 20,
};
const tableColumnComponents = {
date: {
component: 'span',
props: () => {},
event: () => {},
},
createdBy: {
component: QBtn,
props: () => ({ flat: true, color: 'blue', noCaps: true }),
event: () => {},
},
comment: {
component: 'span',
props: () => {},
event: () => {},
},
type: {
component: 'span',
props: () => {},
event: () => {},
},
amount: {
component: 'span',
props: () => {},
event: () => {},
},
};
};
});
const columns = computed(() => [
{
align: 'left',
field: 'shipped',
label: t('Date'),
name: 'date',
format: (value) => toDateTimeFormat(value),
name: 'shipped',
format: ({ shipped }) => toDateTimeFormat(shipped),
create: true,
columnCreate: {
component: 'date',
autofocus: true,
},
},
{
align: 'left',
field: (value) => value?.user?.name,
name: 'userFk',
label: t('Created by'),
name: 'createdBy',
component: 'userLink',
attrs: ({ row }) => {
return {
defaultName: true,
workerId: row.user?.id,
name: row.user?.name,
};
},
},
{
align: 'left',
field: 'description',
name: 'description',
label: t('Comment'),
name: 'comment',
create: true,
},
{
align: 'left',
field: (value) => value?.greugeType?.name,
name: 'greugeTypeFk',
format: ({ greugeType }) => greugeType?.name,
label: t('Type'),
name: 'type',
create: true,
columnCreate: {
component: 'select',
url: 'greugeTypes',
limit: 0,
},
},
{
align: 'left',
field: 'amount',
label: t('Amount'),
name: 'amount',
format: (value) => toCurrency(value),
label: t('Amount'),
format: ({ amount }) => toCurrency(amount),
create: true,
},
]);
@ -107,60 +92,33 @@ const setRows = (data) => {
</script>
<template>
<FetchData :filter="filter" @on-fetch="setRows" auto-load url="greuges" />
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="300" show-if-above>
<QCard class="full-width q-pa-sm">
<h6 class="flex justify-end q-my-lg q-pr-lg" v-if="totalAmount !== undefined">
<span class="color-vn-label q-mr-md">{{ t('Total') }}:</span>
{{ toCurrency(totalAmount) }}
</h6>
<QSkeleton v-else type="QInput" square />
</QCard>
</QDrawer>
<div class="full-width flex justify-center">
<QPage class="card-width q-pa-lg">
<QCard class="q-pa-sm q-mt-md">
<QTable
<VnTable
ref="tableRef"
data-key="Greuges"
url="Greuges"
search-url="greuges"
:filter="filter"
:order="['shipped DESC', 'amount']"
:columns="columns"
:no-data-label="t('globals.noResults')"
:pagination="{ rowsPerPage: 12 }"
:rows="rows"
class="full-width q-mt-md"
row-key="id"
:right-search="false"
:is-editable="false"
:use-model="true"
:column-search="false"
@on-fetch="(data) => setRows(data)"
:create="{
urlCreate: `Greuges`,
title: t('New credit'),
onDataSaved: () => tableRef.reload(),
formInitialData: { shipped: new Date(), clientFk: route.params.id },
}"
auto-load
>
<template #body-cell="props">
<QTd :props="props">
<QTr :props="props" class="cursor-pointer">
<component
:is="tableColumnComponents[props.col.name].component"
class="col-content"
v-bind="
tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
>
{{ props.value }}
<WorkerDescriptorProxy
:id="props.row.userFk"
v-if="props.col.name === 'createdBy'"
/>
</component>
</QTr>
</QTd>
</template>
</QTable>
<template #top-left>
<QCard class="q-px-md q-py-sm">
{{ t('Total') }}: {{ toCurrency(totalAmount) }}
</QCard>
</QPage>
</div>
<QPageSticky :offset="[18, 18]">
<QBtn color="primary" fab icon="add" :to="{ name: 'CustomerGreugeCreate' }" />
<QTooltip>
{{ t('New greuge') }}
</QTooltip>
</QPageSticky>
</template>
</VnTable>
</template>
<style lang="scss">

View File

@ -1,14 +1,8 @@
<script setup>
import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router';
import { useRoute } from 'vue-router';
import VnNotes from 'src/components/ui/VnNotes.vue';
import { toDateTimeFormat } from 'src/filters/date';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
const { t } = useI18n();
const route = useRoute();
const router = useRouter();
const noteFilter = {
order: 'created DESC',
@ -16,68 +10,14 @@ const noteFilter = {
clientFk: `${route.params.id}`,
},
};
const toCustomerNoteCreate = () => {
router.push({ name: 'CustomerNoteCreate' });
};
</script>
<template>
<div class="full-width flex justify-center">
<QCard class="card-width q-pa-lg">
<VnPaginate
data-key="CustomerNotes"
<VnNotes
url="clientObservations"
auto-load
:add-note="true"
:filter="noteFilter"
>
<template #body="{ rows }">
<div v-if="rows.length">
<QCard
v-for="(item, index) in rows"
:key="index"
class="q-pa-md q-rounded custom-border"
:class="{ 'q-mb-md': index < rows.length - 1 }"
>
<div class="flex justify-between">
<p class="color-vn-label">
{{ item.worker.user.nickname }}
</p>
<p class="color-vn-label">
{{ toDateTimeFormat(item?.created) }}
</p>
</div>
<h6 class="q-mt-xs q-mb-none">{{ item.text }}</h6>
</QCard>
</div>
<div v-else>
<h5 class="flex justify-center color-vn-label">
{{ t('globals.noResults') }}
</h5>
</div>
</template>
</VnPaginate>
</QCard>
</div>
<QPageSticky :offset="[18, 18]">
<QBtn @click.stop="toCustomerNoteCreate()" color="primary" fab icon="add" />
<QTooltip>
{{ t('New note') }}
</QTooltip>
</QPageSticky>
:body="{ clientFk: route.params.id }"
style="overflow-y: auto"
/>
</template>
<style lang="scss">
.custom-border {
border: 2px solid var(--vn-accent-color);
border-radius: 10px;
padding: 10px;
}
</style>
<i18n>
es:
New note: Nueva nota
</i18n>

View File

@ -106,9 +106,9 @@ const columns = computed(() => [
component: null,
after: {
component: markRaw(VnLinkPhone),
attrs: (prop) => {
attrs: ({ model }) => {
return {
'phone-number': prop,
'phone-number': model,
};
},
},

View File

@ -1,67 +0,0 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router';
import FetchData from 'components/FetchData.vue';
import FormModel from 'components/FormModel.vue';
const { t } = useI18n();
const route = useRoute();
const router = useRouter();
const initialData = ref({});
const setClient = (data) => {
initialData.value.credit = data.credit;
};
const toCustomerCredits = () => {
router.push({
name: 'CustomerCredits',
params: {
id: route.params.id,
},
});
};
</script>
<template>
<FetchData
:filter="filter"
@on-fetch="setClient"
auto-load
:url="`Clients/${route.params.id}/getCard`"
/>
<FormModel
:form-initial-data="initialData"
:observe-form-changes="false"
:url-update="`/Clients/${route.params.id}`"
@on-data-saved="toCustomerCredits()"
>
<template #moreActions>
<QBtn
:label="t('globals.cancel')"
@click="toCustomerCredits"
color="primary"
flat
icon="close"
/>
</template>
<template #form="{ data }">
<QInput
:label="t('Credit')"
clearable
type="number"
v-model.number="data.credit"
/>
</template>
</FormModel>
</template>
<i18n>
es:
Credit: Crédito
</i18n>

View File

@ -1,97 +0,0 @@
<script setup>
import { onMounted, reactive, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router';
import FetchData from 'components/FetchData.vue';
import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnInputDate from 'components/common/VnInputDate.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
const { t } = useI18n();
const route = useRoute();
const router = useRouter();
const initialData = reactive({
shipped: '2001-01-01T11:00:00.000Z',
});
const greugeTypes = ref([]);
onMounted(() => {
initialData.clientFk = `${route.params.id}`;
});
const toCustomerGreuges = () => {
router.push({
name: 'CustomerGreuges',
params: {
id: route.params.id,
},
});
};
</script>
<template>
<fetch-data @on-fetch="(data) => (greugeTypes = data)" auto-load url="greugeTypes" />
<FormModel
:form-initial-data="initialData"
:observe-form-changes="false"
@on-data-saved="toCustomerGreuges()"
model="client"
url-create="Greuges"
>
<template #moreActions>
<QBtn
:label="t('globals.cancel')"
@click="toCustomerGreuges"
color="primary"
flat
icon="close"
/>
</template>
<template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md">
<VnInput
:label="t('Amount')"
clearable
type="number"
v-model="data.amount"
/>
<VnInputDate :label="t('Date')" v-model="data.shipped" />
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInput :label="t('Comment')" clearable v-model="data.description" />
<VnSelect
:label="t('Type')"
:options="greugeTypes"
hide-selected
option-label="name"
option-value="id"
v-model="data.greugeTypeFk"
/>
</VnRow>
</template>
</FormModel>
</template>
<style lang="scss" scoped>
.add-icon {
cursor: pointer;
background-color: $primary;
border-radius: 50px;
}
</style>
<i18n>
es:
Amount: Importe
Date: Fecha
Comment: Comentario
Type: Tipo
</i18n>

View File

@ -11,12 +11,10 @@ import VnRow from 'components/ui/VnRow.vue';
import VnInputDate from 'components/common/VnInputDate.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
import VnInput from 'src/components/common/VnInput.vue';
import { useState } from 'src/composables/useState';
const { t } = useI18n();
const route = useRoute();
const { dialogRef } = useDialogPluginComponent();
const state = useState();
const user = state.getUser();
const $props = defineProps({
companyId: {
@ -40,7 +38,7 @@ const bankOptions = ref([]);
const clientFindOne = ref([]);
const deliveredAmount = ref(null);
const amountToReturn = ref(null);
const viewRecipt = ref(true);
const viewReceipt = ref();
const sendEmail = ref(false);
const isLoading = ref(false);
@ -57,24 +55,46 @@ const filterClientFindOne = {
id: route.params.id,
},
};
const initialData = reactive({
amountPaid: $props.totalCredit,
clientFk: route.params.id,
companyFk: $props.companyId,
email: clientFindOne.value.email,
bankFk: user.value.localBankFk,
});
onBeforeMount(() => {
urlCreate.value = `Clients/${route.params.id}/createReceipt`;
});
const setPaymentType = (id) => {
initialData.payed = '2001-01-01T11:00:00.000Z';
if (id === 1) initialData.description = 'Credit card';
if (id === 2) initialData.description = 'Cash';
if (id === 3 || id === 3117) initialData.description = '';
if (id === 4) initialData.description = 'Transfer';
const setPaymentType = (value) => {
// if (id === 1) initialData.description = 'Credit card';
// if (id === 2) initialData.description = 'Cash';
// if (id === 3 || id === 3117) initialData.description = '';
// if (id === 4) initialData.description = 'Transfer';
// const CASH_CODE = 2;
// // const CASH_CODE = 2
// if (!value) return;
// const accountingType = CASH_CODE;
// initialData.description = '';
// viewReceipt.value = value == CASH_CODE;
// if (accountingType.code == 'compensation') this.receipt.description = '';
// else {
// if (
// accountingType.receiptDescription != null &&
// accountingType.receiptDescription != ''
// )
// this.receipt.description.push(accountingType.receiptDescription);
// if (this.originalDescription)
// this.receipt.description.push(this.originalDescription);
// this.receipt.description = this.receipt.description.join(', ');
// }
// this.maxAmount = accountingType && accountingType.maxAmount;
// this.receipt.payed = Date.vnNew();
// if (accountingType.daysInFuture)
// this.receipt.payed.setDate(
// this.receipt.payed.getDate() + accountingType.daysInFuture
// );
};
const calculateFromAmount = (event) => {
@ -207,7 +227,6 @@ const onDataSaved = async () => {
<div class="q-mt-lg" v-if="data.bankFk === 2">
<div class="text-h6">{{ t('Cash') }}</div>
<VnRow class="row q-gutter-md q-mb-md">
<VnInput
:label="t('Delivered amount')"
@ -224,13 +243,11 @@ const onDataSaved = async () => {
v-model="amountToReturn"
/>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<QCheckbox v-model="viewRecipt" />
<QCheckbox v-model="viewReceipt" />
<QCheckbox v-model="sendEmail" />
</VnRow>
</div>
<div class="q-mt-lg row justify-end">
<QBtn
:disabled="isLoading"

View File

@ -1,57 +0,0 @@
<script setup>
import { onMounted, reactive } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router';
import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue';
const { t } = useI18n();
const route = useRoute();
const router = useRouter();
const initialData = reactive({});
onMounted(() => {
initialData.clientFk = `${route.params.id}`;
});
const toCustomerNotes = () => {
router.push({
name: 'CustomerNotes',
params: {
id: route.params.id,
},
});
};
</script>
<template>
<FormModel
:form-initial-data="initialData"
:observe-form-changes="false"
@on-data-saved="toCustomerNotes()"
url-create="ClientObservations"
>
<template #moreActions>
<QBtn
:label="t('globals.cancel')"
@click="toCustomerNotes"
color="primary"
flat
icon="close"
/>
</template>
<template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md">
<QInput :label="t('Note')" type="textarea" v-model="data.text" />
</VnRow>
</template>
</FormModel>
</template>
<i18n>
es:
Note: Nota
</i18n>

View File

@ -18,9 +18,9 @@ const columns = [
name: 'itemFk',
columnField: {
component: VnImg,
attrs: (id) => {
attrs: ({ row }) => {
return {
id,
id: row.id,
size: '50x50',
width: '50px',
};

View File

@ -192,7 +192,7 @@ onMounted(async () => {
:filter="entryFilter"
:create="{
urlCreate: 'Entries',
title: 'Create entry',
title: t('Create entry'),
onDataSaved: ({ id }) => tableRef.redirect(id),
formInitialData: {},
}"
@ -210,4 +210,5 @@ es:
Virtual entry: Es una redada
Search entries: Buscar entradas
You can search by entry reference: Puedes buscar por referencia de la entrada
Create entry: Crear entrada
</i18n>

View File

@ -70,9 +70,9 @@ const columns = computed(() => [
name: 'image',
columnField: {
component: VnImg,
attrs: (id) => {
attrs: ({ row }) => {
return {
id,
id: row.id,
width: '50px',
};
},

View File

@ -221,9 +221,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
:find="['agencyModeFk', 'agencyModeName']"
v-model="row.agencyModeFk"
@update:model-value="onUpdate(row.ticketFk, 'agencyModeFk', $event)"
>
{{ console.log('row: ', row) }}
</VnSelectCache>
/>
</template>
<template #column-clientFk="{ row }">
<span class="link" @click.stop>

View File

@ -187,39 +187,15 @@ export default {
},
{
path: 'notes',
name: 'CustomerNotesCard',
redirect: { name: 'CustomerNotes' },
children: [
{
path: '',
name: 'CustomerNotes',
meta: {
title: 'notes',
icon: 'vn:notes',
},
component: () =>
import('src/pages/Customer/Card/CustomerNotes.vue'),
},
{
path: 'create',
name: 'CustomerNoteCreate',
meta: {
title: 'note-create',
},
component: () =>
import(
'src/pages/Customer/components/CustomerNoteCreate.vue'
),
},
],
component: () => import('src/pages/Customer/Card/CustomerNotes.vue'),
},
{
path: 'credits',
name: 'CreditsCard',
redirect: { name: 'CustomerCredits' },
children: [
{
path: '',
name: 'CustomerCredits',
meta: {
title: 'credits',
@ -228,26 +204,8 @@ export default {
component: () =>
import('src/pages/Customer/Card/CustomerCredits.vue'),
},
{
path: 'create',
name: 'CustomerCreditCreate',
meta: {
title: 'credit-create',
},
component: () =>
import(
'src/pages/Customer/components/CustomerCreditCreate.vue'
),
},
],
},
{
path: 'greuges',
name: 'GreugesCard',
redirect: { name: 'CustomerGreuges' },
children: [
{
path: '',
name: 'CustomerGreuges',
meta: {
title: 'greuges',
@ -256,19 +214,6 @@ export default {
component: () =>
import('src/pages/Customer/Card/CustomerGreuges.vue'),
},
{
path: 'create',
name: 'CustomerGreugeCreate',
meta: {
title: 'greuge-create',
},
component: () =>
import(
'src/pages/Customer/components/CustomerGreugeCreate.vue'
),
},
],
},
{
path: 'balance',
name: 'CustomerBalance',