salix-front/src/pages/Shelving/Parking/Card/ParkingSummary.vue

53 lines
1.8 KiB
Vue

<script setup>
import { computed } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'components/ui/VnLv.vue';
const $props = defineProps({
id: {
type: Number,
default: 0,
},
});
const router = useRoute();
const { t } = useI18n();
const entityId = computed(() => $props.id || router.params.id);
const filter = {
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
include: [{ relation: 'sector', scope: { fields: ['id', 'description'] } }],
};
</script>
<template>
<div class="q-pa-md">
<CardSummary :url="`Parkings/${entityId}`" data-key="Parking" :filter="filter">
<template #header="{ entity }">{{ entity.code }}</template>
<template #body="{ entity }">
<QCard class="vn-one">
<QCardSection class="q-pa-none">
<a
class="header header-link"
:href="`#/parking/${entityId}/basic-data`"
>
{{ t('globals.pageTitles.basicData') }}
<QIcon name="open_in_new" />
</a>
</QCardSection>
<VnLv :label="t('globals.code')" :value="entity.code" />
<VnLv
:label="t('parking.pickingOrder')"
:value="entity.pickingOrder"
/>
<VnLv
:label="t('parking.sector')"
:value="entity.sector?.description"
/>
</QCard>
</template>
</CardSummary>
</div>
</template>