feat(customer): improve basicData to balance
This commit is contained in:
parent
8d59fc95e7
commit
026c632a4c
|
@ -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>
|
||||
|
|
|
@ -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),
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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>
|
|
@ -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"
|
||||
/>
|
||||
|
|
|
@ -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 = '';
|
||||
}
|
||||
|
|
|
@ -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) => {
|
||||
|
|
|
@ -18,4 +18,3 @@ const { t } = useI18n();
|
|||
</slot>
|
||||
<WorkerDescriptorProxy v-if="$props.workerId" :id="$props.workerId" />
|
||||
</template>
|
||||
<style scoped></style>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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"
|
||||
|
|
|
@ -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:
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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">
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -106,9 +106,9 @@ const columns = computed(() => [
|
|||
component: null,
|
||||
after: {
|
||||
component: markRaw(VnLinkPhone),
|
||||
attrs: (prop) => {
|
||||
attrs: ({ model }) => {
|
||||
return {
|
||||
'phone-number': prop,
|
||||
'phone-number': model,
|
||||
};
|
||||
},
|
||||
},
|
||||
|
|
|
@ -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>
|
|
@ -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>
|
|
@ -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"
|
||||
|
|
|
@ -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>
|
|
@ -18,9 +18,9 @@ const columns = [
|
|||
name: 'itemFk',
|
||||
columnField: {
|
||||
component: VnImg,
|
||||
attrs: (id) => {
|
||||
attrs: ({ row }) => {
|
||||
return {
|
||||
id,
|
||||
id: row.id,
|
||||
size: '50x50',
|
||||
width: '50px',
|
||||
};
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -70,9 +70,9 @@ const columns = computed(() => [
|
|||
name: 'image',
|
||||
columnField: {
|
||||
component: VnImg,
|
||||
attrs: (id) => {
|
||||
attrs: ({ row }) => {
|
||||
return {
|
||||
id,
|
||||
id: row.id,
|
||||
width: '50px',
|
||||
};
|
||||
},
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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',
|
||||
|
|
Loading…
Reference in New Issue