#8448 - devToTest #1254
|
@ -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">
|
||||||
|
@ -222,8 +209,8 @@ const toModule = computed(() =>
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss">
|
||||||
:deep(.body) {
|
.body {
|
||||||
background-color: var(--vn-section-color);
|
background-color: var(--vn-section-color);
|
||||||
.text-h5 {
|
.text-h5 {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
@ -262,7 +249,9 @@ const toModule = computed(() =>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
.title {
|
.title {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
|
|
@ -1,10 +1,11 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, computed, watch, onBeforeMount, onMounted } from 'vue';
|
import { ref, computed, watch, onBeforeMount } from 'vue';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import SkeletonSummary from 'components/ui/SkeletonSummary.vue';
|
import SkeletonSummary from 'components/ui/SkeletonSummary.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 { useStateStore } from 'src/stores/useStateStore';
|
import VnMoreOptions from './VnMoreOptions.vue';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
url: {
|
url: {
|
||||||
|
@ -40,7 +41,6 @@ const { store } = arrayData;
|
||||||
const entity = computed(() => (Array.isArray(store.data) ? store.data[0] : store.data));
|
const entity = computed(() => (Array.isArray(store.data) ? store.data[0] : store.data));
|
||||||
const isLoading = ref(false);
|
const isLoading = ref(false);
|
||||||
|
|
||||||
const stateStore = useStateStore();
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
entity,
|
entity,
|
||||||
fetch,
|
fetch,
|
||||||
|
@ -52,9 +52,6 @@ onBeforeMount(async () => {
|
||||||
watch(props, async () => await fetch());
|
watch(props, async () => await fetch());
|
||||||
});
|
});
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
stateStore.rightDrawerChangeValue(false);
|
|
||||||
});
|
|
||||||
async function fetch() {
|
async function fetch() {
|
||||||
store.url = props.url;
|
store.url = props.url;
|
||||||
store.filter = props.filter ?? {};
|
store.filter = props.filter ?? {};
|
||||||
|
@ -64,6 +61,7 @@ async function fetch() {
|
||||||
isLoading.value = false;
|
isLoading.value = false;
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="summary container">
|
<div class="summary container">
|
||||||
<QCard class="cardSummary">
|
<QCard class="cardSummary">
|
||||||
|
@ -84,11 +82,16 @@ async function fetch() {
|
||||||
<span v-else></span>
|
<span v-else></span>
|
||||||
</slot>
|
</slot>
|
||||||
<slot name="header" :entity="entity" dense>
|
<slot name="header" :entity="entity" dense>
|
||||||
{{ entity.id + ' - ' + entity.name }}
|
<VnLv :label="`${entity.id} -`" :value="entity.name" />
|
||||||
</slot>
|
|
||||||
<slot name="header-right" :entity="entity">
|
|
||||||
<span></span>
|
|
||||||
</slot>
|
</slot>
|
||||||
|
<span class="row no-wrap">
|
||||||
|
<slot name="header-right" :entity="entity" />
|
||||||
|
<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" />
|
||||||
|
@ -97,6 +100,7 @@ async function fetch() {
|
||||||
</QCard>
|
</QCard>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.summary.container {
|
.summary.container {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
@ -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>
|
|
@ -12,6 +12,7 @@ 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';
|
||||||
|
@ -70,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
|
||||||
|
@ -94,14 +98,13 @@ const sumRisk = ({ clientRisks }) => {
|
||||||
:phone-number="entity.mobile"
|
:phone-number="entity.mobile"
|
||||||
:channel="entity.country?.saySimpleCountry?.channel"
|
:channel="entity.country?.saySimpleCountry?.channel"
|
||||||
class="q-ml-xs"
|
class="q-ml-xs"
|
||||||
:country="entity.country?.code"
|
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</VnLv>
|
</VnLv>
|
||||||
<VnLv :value="entity.email" copy
|
<VnLv :value="entity.email" copy
|
||||||
><template #label>
|
><template #label>
|
||||||
{{ t('globals.params.email') }}
|
{{ t('globals.params.email') }}
|
||||||
<VnLinkMail :email="entity.email"></VnLinkMail> </template
|
<VnLinkMail email="entity.email"></VnLinkMail> </template
|
||||||
></VnLv>
|
></VnLv>
|
||||||
<VnLv
|
<VnLv
|
||||||
:label="t('customer.summary.salesPerson')"
|
:label="t('customer.summary.salesPerson')"
|
||||||
|
@ -173,7 +176,7 @@ const sumRisk = ({ clientRisks }) => {
|
||||||
:label="t('customer.summary.notifyByEmail')"
|
:label="t('customer.summary.notifyByEmail')"
|
||||||
:value="entity.isToBeMailed"
|
:value="entity.isToBeMailed"
|
||||||
/>
|
/>
|
||||||
<VnLv :label="t('globals.isVies')" :value="entity.isVies" />
|
<VnLv :label="t('customer.summary.vies')" :value="entity.isVies" />
|
||||||
</VnRow>
|
</VnRow>
|
||||||
</QCard>
|
</QCard>
|
||||||
<QCard class="vn-one">
|
<QCard class="vn-one">
|
||||||
|
|
|
@ -96,7 +96,6 @@ function toTicketUrl(section) {
|
||||||
ref="summaryRef"
|
ref="summaryRef"
|
||||||
:url="`Tickets/${entityId}/summary`"
|
:url="`Tickets/${entityId}/summary`"
|
||||||
data-key="TicketSummary"
|
data-key="TicketSummary"
|
||||||
data-cy="ticketSummary"
|
|
||||||
>
|
>
|
||||||
<template #header-left>
|
<template #header-left>
|
||||||
<VnToSummary
|
<VnToSummary
|
||||||
|
@ -114,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"
|
||||||
|
@ -133,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
|
||||||
|
@ -258,7 +250,7 @@ function toTicketUrl(section) {
|
||||||
<QCard class="vn-one" v-if="entity.notes.length">
|
<QCard class="vn-one" v-if="entity.notes.length">
|
||||||
<VnTitle
|
<VnTitle
|
||||||
:url="toTicketUrl('observation')"
|
:url="toTicketUrl('observation')"
|
||||||
:text="t('globals.pageTitles.notes')"
|
:text="t('ticket.pageTitles.notes')"
|
||||||
/>
|
/>
|
||||||
<QVirtualScroll
|
<QVirtualScroll
|
||||||
:items="entity.notes"
|
:items="entity.notes"
|
||||||
|
|
Loading…
Reference in New Issue