feat(client and ticket): add moreOptions in summary

This commit is contained in:
Alex Moreno 2024-11-22 15:30:43 +01:00
parent 01ffb663f1
commit 6f7b83d593
5 changed files with 45 additions and 36 deletions

View File

@ -6,6 +6,7 @@ import { useArrayData } from 'composables/useArrayData';
import { useSummaryDialog } from 'src/composables/useSummaryDialog'; import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { useState } from 'src/composables/useState'; import { useState } from 'src/composables/useState';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import VnMoreOptions from './VnMoreOptions.vue';
const $props = defineProps({ const $props = defineProps({
url: { url: {
@ -159,25 +160,11 @@ const toModule = computed(() =>
</QTooltip> </QTooltip>
</QBtn> </QBtn>
</RouterLink> </RouterLink>
<QBtn <VnMoreOptions v-if="$slots.menu">
v-if="$slots.menu" <template #menu>
color="white"
dense
flat
icon="more_vert"
round
size="md"
data-cy="descriptor-more-opts"
>
<QTooltip>
{{ t('components.cardDescriptor.moreOptions') }}
</QTooltip>
<QMenu :ref="menuRef">
<QList>
<slot name="menu" :entity="entity" :menu-ref="menuRef" /> <slot name="menu" :entity="entity" :menu-ref="menuRef" />
</QList> </template>
</QMenu> </VnMoreOptions>
</QBtn>
</div> </div>
<slot name="before" /> <slot name="before" />
<div class="body q-py-sm"> <div class="body q-py-sm">

View File

@ -5,6 +5,7 @@ import SkeletonSummary from 'components/ui/SkeletonSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { isDialogOpened } from 'src/filters'; import { isDialogOpened } from 'src/filters';
import VnMoreOptions from './VnMoreOptions.vue';
const props = defineProps({ const props = defineProps({
url: { url: {
@ -83,9 +84,14 @@ async function fetch() {
<slot name="header" :entity="entity" dense> <slot name="header" :entity="entity" dense>
<VnLv :label="`${entity.id} -`" :value="entity.name" /> <VnLv :label="`${entity.id} -`" :value="entity.name" />
</slot> </slot>
<slot name="header-right" :entity="entity"> <span class="row no-wrap">
<span></span> <slot name="header-right" :entity="entity" />
</slot> <VnMoreOptions v-if="$slots.menu && isDialogOpened()">
<template #menu>
<slot name="menu" :entity="entity" />
</template>
</VnMoreOptions>
</span>
</div> </div>
<div class="summaryBody row q-mb-md"> <div class="summaryBody row q-mb-md">
<slot name="body" :entity="entity" /> <slot name="body" :entity="entity" />

View File

@ -0,0 +1,20 @@
<template>
<QBtn
color="white"
dense
flat
icon="more_vert"
round
size="md"
data-cy="descriptor-more-opts"
>
<QTooltip>
{{ $t('components.cardDescriptor.moreOptions') }}
</QTooltip>
<QMenu ref="menuRef">
<QList>
<slot name="menu" />
</QList>
</QMenu>
</QBtn>
</template>

View File

@ -1,18 +1,18 @@
<script setup> <script setup>
import { computed, ref, onMounted } from 'vue'; import { computed, ref } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnUserLink from 'src/components/ui/VnUserLink.vue'; import VnUserLink from 'src/components/ui/VnUserLink.vue';
import { toCurrency, toPercentage, toDate, dashOrCurrency } from 'src/filters'; import { toCurrency, toPercentage, toDate, dashOrCurrency } from 'src/filters';
import CardSummary from 'components/ui/CardSummary.vue'; import CardSummary from 'components/ui/CardSummary.vue';
import { getUrl } from 'src/composables/getUrl';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue'; import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
import VnLinkMail from 'src/components/ui/VnLinkMail.vue'; import VnLinkMail from 'src/components/ui/VnLinkMail.vue';
import CustomerSummaryTable from 'src/pages/Customer/components/CustomerSummaryTable.vue'; import CustomerSummaryTable from 'src/pages/Customer/components/CustomerSummaryTable.vue';
import VnTitle from 'src/components/common/VnTitle.vue'; import VnTitle from 'src/components/common/VnTitle.vue';
import VnRow from 'src/components/ui/VnRow.vue'; import VnRow from 'src/components/ui/VnRow.vue';
import CustomerDescriptorMenu from './CustomerDescriptorMenu.vue';
const route = useRoute(); const route = useRoute();
const { t } = useI18n(); const { t } = useI18n();
const grafanaUrl = 'https://grafana.verdnatura.es'; const grafanaUrl = 'https://grafana.verdnatura.es';
@ -71,6 +71,9 @@ const sumRisk = ({ clientRisks }) => {
data-key="CustomerSummary" data-key="CustomerSummary"
module-name="Customer" module-name="Customer"
> >
<template #menu="{ entity }">
<CustomerDescriptorMenu :customer="entity" />
</template>
<template #body="{ entity }"> <template #body="{ entity }">
<QCard class="vn-one"> <QCard class="vn-one">
<VnTitle <VnTitle
@ -320,7 +323,7 @@ const sumRisk = ({ clientRisks }) => {
:value="entity.recommendedCredit" :value="entity.recommendedCredit"
/> />
</QCard> </QCard>
<QCard class="vn-one"> <QCard class="vn-max">
<VnTitle :text="t('Latest tickets')" /> <VnTitle :text="t('Latest tickets')" />
<CustomerSummaryTable /> <CustomerSummaryTable />
</QCard> </QCard>

View File

@ -113,7 +113,7 @@ function toTicketUrl(section) {
{{ entity.nickname }} {{ entity.nickname }}
</div> </div>
</template> </template>
<template #header-right="{ entity }"> <template #header-right>
<div> <div>
<QBtnDropdown <QBtnDropdown
ref="stateBtnDropdownRef" ref="stateBtnDropdownRef"
@ -132,18 +132,11 @@ function toTicketUrl(section) {
@update:model-value="changeState" @update:model-value="changeState"
/> />
</QBtnDropdown> </QBtnDropdown>
<QBtn color="white" dense flat icon="more_vert" round size="md">
<QTooltip>
{{ t('components.cardDescriptor.moreOptions') }}
</QTooltip>
<QMenu>
<QList>
<TicketDescriptorMenu :ticket="entity" />
</QList>
</QMenu>
</QBtn>
</div> </div>
</template> </template>
<template #menu="{ entity }">
<TicketDescriptorMenu :ticket="entity" />
</template>
<template #body="{ entity }"> <template #body="{ entity }">
<QCard class="vn-one"> <QCard class="vn-one">
<VnTitle <VnTitle