salix-front/src/pages/Zone/Card/ZoneSummary.vue

114 lines
3.3 KiB
Vue

<script setup>
import { ref, onMounted, computed } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import VnLv from 'src/components/ui/VnLv.vue';
import CardSummary from 'components/ui/CardSummary.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
import { getUrl } from 'src/composables/getUrl';
import { toCurrency } from 'filters/index';
import { toTimeFormat } from 'src/filters/date';
import axios from 'axios';
import ZoneDescriptorMenuItems from './ZoneDescriptorMenuItems.vue';
const route = useRoute();
const { t } = useI18n();
const $props = defineProps({
id: {
type: Number,
default: 0,
},
});
const entityId = computed(() => $props.id || route.params.id);
const zoneUrl = ref();
const filter = computed(() => {
const filter = {
include: {
relation: 'agencyMode',
fields: ['name'],
},
where: {
id: entityId,
},
};
return filter;
});
const columns = computed(() => [
{
label: t('list.name'),
name: 'name',
field: 'warehouse',
align: 'left',
format: (val) => val.name,
},
]);
const warehouses = ref([]);
const getWarehouses = async () => {
const params = {
filter: {
include: {
relation: 'warehouse',
fields: ['name'],
},
},
};
const { data } = await axios.get(`Zones/${entityId.value}/warehouses`, { params });
warehouses.value = data;
};
onMounted(async () => {
zoneUrl.value = (await getUrl('')) + `zone/${entityId.value}/`;
await getWarehouses();
});
</script>
<template>
<CardSummary
data-key="ZoneSummary"
ref="summary"
url="Zones/findOne"
:filter="filter"
>
<template #header="{ entity }">
<div>#{{ entity.id }} - {{ entity.name }}</div>
</template>
<template #menu="{ entity }">
<ZoneDescriptorMenuItems :zone="entity" />
</template>
<template #body="{ entity: zone }">
<QCard class="vn-one">
<VnTitle :url="zoneUrl + `basic-data`" :text="t('summary.basicData')" />
<VnLv :label="t('list.agency')" :value="zone.agencyMode?.name" />
<VnLv :label="t('list.price')" :value="toCurrency(zone.price)" />
<VnLv :label="t('zone.bonus')" :value="toCurrency(zone.bonus)" />
</QCard>
<QCard class="vn-one">
<VnTitle :url="zoneUrl + `basic-data`" :text="t('summary.basicData')" />
<VnLv :label="t('summary.closeHour')" :value="toTimeFormat(zone.hour)" />
<VnLv :label="t('zone.travelingDays')" :value="zone.travelingDays" />
<QCheckbox
:label="t('zone.volumetric')"
v-model="zone.isVolumetric"
:disable="true"
/>
</QCard>
<QCard class="full-width">
<VnTitle :url="zoneUrl + `warehouses`" :text="t('list.warehouse')" />
<QTable
:columns="columns"
:rows="warehouses"
:no-data-label="t('globals.noResults')"
/>
</QCard>
</template>
</CardSummary>
</template>