salix-front/src/pages/Shelving/Card/ShelvingSummary.vue

87 lines
2.8 KiB
Vue

<script setup>
import { computed, ref } 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';
import VnUserLink from 'components/ui/VnUserLink.vue';
import ShelvingDescriptorMenu from './ShelvingDescriptorMenu.vue';
const $props = defineProps({
id: {
type: Number,
default: 0,
},
});
const route = useRoute();
const { t } = useI18n();
const summary = ref({});
const entityId = computed(() => $props.id || route.params.id);
const filter = {
include: [
{
relation: 'worker',
scope: {
fields: ['id'],
include: {
relation: 'user',
scope: { fields: ['nickname'] },
},
},
},
{ relation: 'parking' },
],
};
</script>
<template>
<div class="q-pa-md">
<CardSummary
ref="summary"
:url="`Shelvings/${entityId}`"
:filter="filter"
data-key="ShelvingSummary"
>
<template #header="{ entity }">
<div>{{ entity.code }}</div>
</template>
<template #menu="{ entity }">
<ShelvingDescriptorMenu
:shelving="entity"
@on-remove="$refs.summary.fetch()"
/>
</template>
<template #body="{ entity }">
<QCard class="vn-one">
<RouterLink
class="header header-link"
:to="{ name: 'ShelvingBasicData', params: { id: entityId } }"
>
{{ t('globals.pageTitles.basicData') }}
<QIcon name="open_in_new" />
</RouterLink>
<VnLv :label="t('globals.code')" :value="entity.code" />
<VnLv
:label="t('shelving.list.parking')"
:value="entity.parking?.code"
/>
<VnLv :label="t('shelving.list.priority')" :value="entity.priority" />
<VnLv v-if="entity.worker" :label="t('globals.worker')">
<template #value>
<VnUserLink
:name="entity.worker?.user?.nickname"
:worker-id="entity.worker?.id"
/>
</template>
</VnLv>
<VnLv
:label="t('shelving.summary.recyclable')"
:value="entity.isRecyclable"
/>
</QCard>
</template>
</CardSummary>
</div>
</template>