Updated summary with computed data
gitea/salix-front/pipeline/head This commit looks good
Details
gitea/salix-front/pipeline/head This commit looks good
Details
This commit is contained in:
parent
bbdae4b629
commit
c95759f302
|
|
@ -1,6 +1,6 @@
|
||||||
module.exports = {
|
module.exports = {
|
||||||
singleQuote: true,
|
singleQuote: true,
|
||||||
printWidth: 120,
|
printWidth: 90,
|
||||||
tabWidth: 4,
|
tabWidth: 4,
|
||||||
semi: true,
|
semi: true,
|
||||||
endOfLine: 'auto',
|
endOfLine: 'auto',
|
||||||
|
|
|
||||||
|
|
@ -15,6 +15,11 @@ onMounted(() => fetch());
|
||||||
const entity = ref();
|
const entity = ref();
|
||||||
const entityId = toRef(props, 'id');
|
const entityId = toRef(props, 'id');
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
entity,
|
||||||
|
fetch,
|
||||||
|
});
|
||||||
|
|
||||||
async function fetch() {
|
async function fetch() {
|
||||||
const id = entityId.value;
|
const id = entityId.value;
|
||||||
const { data } = await axios.get(`Clients/${id}/summary`);
|
const { data } = await axios.get(`Clients/${id}/summary`);
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { computed } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { toCurrency, toPercentage, toDate } from 'src/filters';
|
import { toCurrency, toPercentage, toDate } from 'src/filters';
|
||||||
|
|
@ -16,65 +16,116 @@ const $props = defineProps({
|
||||||
});
|
});
|
||||||
|
|
||||||
const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
|
const summary = ref();
|
||||||
|
const customer = computed(() => summary.value.entity);
|
||||||
|
|
||||||
|
const balanceDue = computed(() => {
|
||||||
|
return (
|
||||||
|
customer.value &&
|
||||||
|
customer.value.defaulters.length &&
|
||||||
|
customer.value.defaulters[0].amount
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
const balanceDueWarning = computed(() => (balanceDue.value ? 'negative' : ''));
|
||||||
|
|
||||||
|
const claimRate = computed(() => {
|
||||||
|
return customer.value.claimsRatio.claimingRate * 100;
|
||||||
|
});
|
||||||
|
|
||||||
|
const priceIncreasingRate = computed(() => {
|
||||||
|
return customer.value.claimsRatio.priceIncreasing / 100;
|
||||||
|
});
|
||||||
|
|
||||||
|
const debtWarning = computed(() => {
|
||||||
|
return customer.value.debt.debt > customer.value.credit ? 'negative' : '';
|
||||||
|
});
|
||||||
|
|
||||||
|
const creditWarning = computed(() => {
|
||||||
|
const data = customer.value;
|
||||||
|
const tooMuchInsurance = data.credit > data.creditInsurance;
|
||||||
|
const noCreditInsurance = data.credit && data.creditInsurance == null;
|
||||||
|
|
||||||
|
return tooMuchInsurance || noCreditInsurance ? 'negative' : '';
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<card-summary :id="entityId">
|
<card-summary ref="summary" :id="entityId">
|
||||||
<template #body="{ entity }">
|
<template #body="{ entity }">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<q-list>
|
<q-list>
|
||||||
<q-item-label header class="text-h6">
|
<q-item-label header class="text-h6">
|
||||||
{{ t('customer.summary.basicData') }}
|
{{ t('customer.summary.basicData') }}
|
||||||
<router-link :to="{ name: 'CustomerBasicData', params: { id: entityId } }" target="_blank">
|
<router-link
|
||||||
|
:to="{ name: 'CustomerBasicData', params: { id: entityId } }"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<q-icon name="open_in_new" />
|
<q-icon name="open_in_new" />
|
||||||
</router-link>
|
</router-link>
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
|
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.customerId') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.customerId')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.id }}</q-item-label>
|
<q-item-label>{{ entity.id }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.name') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.name')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.name }}</q-item-label>
|
<q-item-label>{{ entity.name }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.contact') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.contact')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.contact }}</q-item-label>
|
<q-item-label>{{ entity.contact }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.salesPersonUser">
|
<q-item v-if="entity.salesPersonUser">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.salesPerson') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.salesPerson')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.salesPersonUser.name }}</q-item-label>
|
<q-item-label>{{ entity.salesPersonUser.name }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.phone') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.phone')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.phone }}</q-item-label>
|
<q-item-label>{{ entity.phone }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.mobile') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.mobile')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.mobile }}</q-item-label>
|
<q-item-label>{{ entity.mobile }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.email') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.email')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.email }}</q-item-label>
|
<q-item-label>{{ entity.email }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.contactChannel">
|
<q-item v-if="entity.contactChannel">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.contactChannel') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.contactChannel')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.contactChannel.name }}</q-item-label>
|
<q-item-label>{{ entity.contactChannel.name }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
|
|
@ -87,37 +138,49 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.socialName') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.socialName')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.socialName }}</q-item-label>
|
<q-item-label>{{ entity.socialName }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.fiscalId') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.fiscalId')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.fi }}</q-item-label>
|
<q-item-label>{{ entity.fi }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.postcode') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.postcode')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.postcode }}</q-item-label>
|
<q-item-label>{{ entity.postcode }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.province">
|
<q-item v-if="entity.province">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.province') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.province')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.province.name }}</q-item-label>
|
<q-item-label>{{ entity.province.name }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.country">
|
<q-item v-if="entity.country">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.country') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.country')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.country.country }}</q-item-label>
|
<q-item-label>{{ entity.country.country }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.street') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.street')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.street }}</q-item-label>
|
<q-item-label>{{ entity.street }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
|
|
@ -136,7 +199,11 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
/>
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox v-model="entity.isActive" :label="t('customer.summary.isActive')" disable />
|
<q-checkbox
|
||||||
|
v-model="entity.isActive"
|
||||||
|
:label="t('customer.summary.isActive')"
|
||||||
|
disable
|
||||||
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox
|
<q-checkbox
|
||||||
|
|
@ -153,7 +220,11 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
/>
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox v-model="entity.hasToInvoice" :label="t('customer.summary.hasToInvoice')" disable />
|
<q-checkbox
|
||||||
|
v-model="entity.hasToInvoice"
|
||||||
|
:label="t('customer.summary.hasToInvoice')"
|
||||||
|
disable
|
||||||
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox
|
<q-checkbox
|
||||||
|
|
@ -163,7 +234,11 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
/>
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox v-model="entity.isVies" :label="t('customer.summary.vies')" disable />
|
<q-checkbox
|
||||||
|
v-model="entity.isVies"
|
||||||
|
:label="t('customer.summary.vies')"
|
||||||
|
disable
|
||||||
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
</q-list>
|
</q-list>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -174,30 +249,48 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.payMethod') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.payMethod')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.payMethod.name }}</q-item-label>
|
<q-item-label>{{ entity.payMethod.name }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.bankAccount') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.bankAccount')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.iban }}</q-item-label>
|
<q-item-label>{{ entity.iban }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.dueDay') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.dueDay')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.dueDay }}</q-item-label>
|
<q-item-label>{{ entity.dueDay }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox v-model="entity.hasLcr" :label="t('customer.summary.hasLcr')" disable />
|
<q-checkbox
|
||||||
|
v-model="entity.hasLcr"
|
||||||
|
:label="t('customer.summary.hasLcr')"
|
||||||
|
disable
|
||||||
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox v-model="entity.hasCoreVnl" :label="t('customer.summary.hasCoreVnl')" disable />
|
<q-checkbox
|
||||||
|
v-model="entity.hasCoreVnl"
|
||||||
|
:label="t('customer.summary.hasCoreVnl')"
|
||||||
|
disable
|
||||||
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox v-model="entity.hasSepaVnl" :label="t('customer.summary.hasB2BVnl')" disable />
|
<q-checkbox
|
||||||
|
v-model="entity.hasSepaVnl"
|
||||||
|
:label="t('customer.summary.hasB2BVnl')"
|
||||||
|
disable
|
||||||
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
</q-list>
|
</q-list>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -208,20 +301,30 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.addressName') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ entity.defaultAddress.nickname }}</q-item-label>
|
t('customer.summary.addressName')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
entity.defaultAddress.nickname
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.addressCity') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.addressCity')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.defaultAddress.city }}</q-item-label>
|
<q-item-label>{{ entity.defaultAddress.city }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.addressStreet') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ entity.defaultAddress.street }}</q-item-label>
|
t('customer.summary.addressStreet')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
entity.defaultAddress.street
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
</q-list>
|
</q-list>
|
||||||
|
|
@ -233,12 +336,18 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.username') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.username')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ entity.account.name }}</q-item-label>
|
<q-item-label>{{ entity.account.name }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item dense>
|
<q-item dense>
|
||||||
<q-checkbox v-model="entity.account.active" :label="t('customer.summary.webAccess')" disable />
|
<q-checkbox
|
||||||
|
v-model="entity.account.active"
|
||||||
|
:label="t('customer.summary.webAccess')"
|
||||||
|
disable
|
||||||
|
/>
|
||||||
</q-item>
|
</q-item>
|
||||||
</q-list>
|
</q-list>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -249,14 +358,22 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.totalGreuge') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ toCurrency(entity.totalGreuge) }}</q-item-label>
|
t('customer.summary.totalGreuge')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
toCurrency(entity.totalGreuge)
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.mana">
|
<q-item v-if="entity.mana">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.mana') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ toCurrency(entity.mana.mana) }}</q-item-label>
|
t('customer.summary.mana')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
toCurrency(entity.mana.mana)
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.claimsRatio">
|
<q-item v-if="entity.claimsRatio">
|
||||||
|
|
@ -264,18 +381,26 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
<q-item-label caption>
|
<q-item-label caption>
|
||||||
{{ t('customer.summary.priceIncreasingRate') }}
|
{{ t('customer.summary.priceIncreasingRate') }}
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
<q-item-label>{{ toPercentage(priceIncreasingRate) }}</q-item-label>
|
<q-item-label>{{
|
||||||
|
toPercentage(priceIncreasingRate)
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.averageInvoiced">
|
<q-item v-if="entity.averageInvoiced">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.averageInvoiced') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ toCurrency(entity.averageInvoiced.invoiced) }}</q-item-label>
|
t('customer.summary.averageInvoiced')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
toCurrency(entity.averageInvoiced.invoiced)
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.claimsRatio">
|
<q-item v-if="entity.claimsRatio">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.claimRate') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.claimRate')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label>{{ toPercentage(claimRate) }}</q-item-label>
|
<q-item-label>{{ toPercentage(claimRate) }}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
|
|
@ -288,69 +413,97 @@ const entityId = computed(() => Number($props.id) || Number(route.params.id));
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
<q-item v-if="entity.debt">
|
<q-item v-if="entity.debt">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.risk') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.risk')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label :class="debtWarning">
|
<q-item-label :class="debtWarning">
|
||||||
{{ toCurrency(entity.debt.debt) }}
|
{{ toCurrency(entity.debt.debt) }}
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
<q-item-section side>
|
<q-item-section side>
|
||||||
<q-icon name="vn:info">
|
<q-icon name="vn:info">
|
||||||
<q-tooltip>{{ t('customer.summary.riskInfo') }}</q-tooltip>
|
<q-tooltip>{{
|
||||||
|
t('customer.summary.riskInfo')
|
||||||
|
}}</q-tooltip>
|
||||||
</q-icon>
|
</q-icon>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.credit') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.credit')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label :class="creditWarning">
|
<q-item-label :class="creditWarning">
|
||||||
{{ toCurrency(entity.credit) }}
|
{{ toCurrency(entity.credit) }}
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
<q-item-section side>
|
<q-item-section side>
|
||||||
<q-icon name="vn:info">
|
<q-icon name="vn:info">
|
||||||
<q-tooltip>{{ t('customer.summary.creditInfo') }}</q-tooltip>
|
<q-tooltip>{{
|
||||||
|
t('customer.summary.creditInfo')
|
||||||
|
}}</q-tooltip>
|
||||||
</q-icon>
|
</q-icon>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.creditInsurance">
|
<q-item v-if="entity.creditInsurance">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.securedCredit') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ toCurrency(entity.creditInsurance) }}</q-item-label>
|
t('customer.summary.securedCredit')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
toCurrency(entity.creditInsurance)
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
<q-item-section side>
|
<q-item-section side>
|
||||||
<q-icon name="vn:info">
|
<q-icon name="vn:info">
|
||||||
<q-tooltip>{{ t('customer.summary.securedCreditInfo') }}</q-tooltip>
|
<q-tooltip>{{
|
||||||
|
t('customer.summary.securedCreditInfo')
|
||||||
|
}}</q-tooltip>
|
||||||
</q-icon>
|
</q-icon>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.balance') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ toCurrency(entity.sumRisk) || toCurrency(0) }}</q-item-label>
|
t('customer.summary.balance')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
toCurrency(entity.sumRisk) || toCurrency(0)
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
<q-item-section side>
|
<q-item-section side>
|
||||||
<q-icon name="vn:info">
|
<q-icon name="vn:info">
|
||||||
<q-tooltip>{{ t('customer.summary.balanceInfo') }}</q-tooltip>
|
<q-tooltip>{{
|
||||||
|
t('customer.summary.balanceInfo')
|
||||||
|
}}</q-tooltip>
|
||||||
</q-icon>
|
</q-icon>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.defaulters">
|
<q-item v-if="entity.defaulters">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.balanceDue') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
|
t('customer.summary.balanceDue')
|
||||||
|
}}</q-item-label>
|
||||||
<q-item-label :class="balanceDueWarning">
|
<q-item-label :class="balanceDueWarning">
|
||||||
{{ toCurrency(balanceDue) }}
|
{{ toCurrency(balanceDue) }}
|
||||||
</q-item-label>
|
</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
<q-item-section side>
|
<q-item-section side>
|
||||||
<q-icon name="vn:info">
|
<q-icon name="vn:info">
|
||||||
<q-tooltip>{{ t('customer.summary.balanceDueInfo') }}</q-tooltip>
|
<q-tooltip>{{
|
||||||
|
t('customer.summary.balanceDueInfo')
|
||||||
|
}}</q-tooltip>
|
||||||
</q-icon>
|
</q-icon>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item v-if="entity.recovery">
|
<q-item v-if="entity.recovery">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<q-item-label caption>{{ t('customer.summary.recoverySince') }}</q-item-label>
|
<q-item-label caption>{{
|
||||||
<q-item-label>{{ toDate(entity.recovery.started) }}</q-item-label>
|
t('customer.summary.recoverySince')
|
||||||
|
}}</q-item-label>
|
||||||
|
<q-item-label>{{
|
||||||
|
toDate(entity.recovery.started)
|
||||||
|
}}</q-item-label>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
</q-list>
|
</q-list>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue