salix-front/src/pages/DeliveryNote/Card/DeliveryNoteSummary.vue

91 lines
3.3 KiB
Vue

<script setup>
import { computed } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { toCurrency, toDate, dashIfEmpty } from 'src/filters';
import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
const route = useRoute();
const { t } = useI18n();
const $props = defineProps({
id: {
type: Number,
default: 0,
},
});
const entityId = computed(() => $props.id || route.params.id);
</script>
<template>
<CardSummary
ref="summary"
:url="`DeliveryNotes/${entityId}/summary`"
:entity-id="entityId"
data-key="deliveryNoteSummary"
>
<template #header="{ entity: { deliveryNote } }">
<div>{{ deliveryNote.id }} - {{ deliveryNote.ref }}</div>
</template>
<template #body="{ entity: { deliveryNote } }">
<QCard class="vn-one">
<VnTitle
:url="`#/delivery-note/${entityId}/basic-data`"
:text="t('globals.pageTitles.basicData')"
/>
<div class="vn-card-group">
<div class="vn-card-content">
<VnLv :label="t('globals.id')" :value="deliveryNote.id" />
<VnLv :label="t('globals.reference')" :value="deliveryNote.ref" />
<VnLv
:label="t('globals.shipped')"
:value="toDate(deliveryNote.shipped)"
/>
<VnLv
:label="t('globals.landed')"
:value="toDate(deliveryNote.landed)"
/>
<VnLv
:label="t('globals.amount')"
:value="toCurrency(deliveryNote.amount)"
/>
</div>
<div class="vn-card-content">
<VnLv :label="t('globals.supplier')">
<template #value>
<span class="link">
{{ deliveryNote.supplier.name }}
<SupplierDescriptorProxy
:id="deliveryNote.supplierFk"
/>
</span>
</template>
</VnLv>
<VnLv
:label="t('globals.company')"
:value="deliveryNote.company.code"
/>
<VnLv
:label="t('globals.state')"
:value="deliveryNote.deliveryNoteState.state"
/>
<VnLv
:label="t('globals.invoiceIn')"
:value="dashIfEmpty(deliveryNote.invoiceInFk)"
/>
</div>
</div>
</QCard>
</template>
</CardSummary>
</template>
<style lang="scss" scoped>
.no-uppercase {
text-transform: none;
}
</style>