salix-front/src/pages/Department/Card/DepartmentDescriptor.vue

106 lines
3.0 KiB
Vue

<script setup>
import { computed, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { useVnConfirm } from 'composables/useVnConfirm';
import VnLv from 'src/components/ui/VnLv.vue';
import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
import axios from 'axios';
import useNotify from 'src/composables/useNotify.js';
const $props = defineProps({
id: {
type: Number,
required: false,
default: null,
},
summary: {
type: Object,
default: null,
},
});
const route = useRoute();
const router = useRouter();
const DepartmentDescriptorRef = ref();
const { t } = useI18n();
const { notify } = useNotify();
const entityId = computed(() => {
return $props.id || route.params.id;
});
const removeDepartment = async () => {
await axios.post(`/Departments/${entityId.value}/removeChild`, entityId.value);
router.push({ name: 'WorkerDepartment' });
notify('department.departmentRemoved', 'positive');
};
const { openConfirmationModal } = useVnConfirm();
</script>
<template>
<CardDescriptor
ref="DepartmentDescriptorRef"
module="Department"
:url="`Departments/${entityId}`"
:summary="$props.summary"
:to-module="{ name: 'WorkerDepartment' }"
data-key="Department"
>
<template #menu="{}">
<QItem
v-ripple
clickable
@click="
openConfirmationModal(
t('Are you sure you want to delete it?'),
t('Delete department'),
removeDepartment,
)
"
>
<QItemSection>{{ t('Delete') }}</QItemSection>
</QItem>
</template>
<template #body="{ entity }">
<VnLv :label="t('department.chat')" :value="entity.chatName" />
<VnLv
:label="t('globals.params.email')"
:value="entity.notificationEmail"
copy
/>
<VnLv
:label="t('department.selfConsumptionCustomer')"
:value="entity.client?.name"
/>
<VnLv
:label="t('department.bossDepartment')"
:value="entity.worker?.user?.name"
/>
</template>
<template #actions>
<QCardActions>
<QBtn
size="md"
icon="vn:worker"
color="primary"
:to="{
name: 'WorkerList',
query: {
table: JSON.stringify({ departmentFk: entityId }),
},
}"
>
<QTooltip>{{ t('Department workers') }}</QTooltip>
</QBtn>
</QCardActions>
</template>
</CardDescriptor>
</template>
<i18n>
es:
Department workers: Trabajadores del departamento
</i18n>