wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

Merge pull request '6475-descriptor_preview' (!109) from 6475-descriptor_preview into dev 

Reviewed-on: verdnatura/salix-front#109
Reviewed-by: Alex Moreno <alexm@verdnatura.es>
This commit is contained in:
Pablo Natek 2023-12-11 07:27:42 +00:00
parent 09ff922c94 e7d22052a7
commit 5c84a68ca6
8 changed files with 85 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/components/ui/CardDescriptor.vue
View File

@ -1,6 +1,7 @@
<script setup> <script setup>
import { onMounted, useSlots, ref, watch, computed } from 'vue'; import { onMounted, useSlots, ref, watch, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import axios from 'axios'; import axios from 'axios';
import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue'; import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
@ -30,8 +31,12 @@ const $props = defineProps({
type: String, type: String,
default: '', default: '',
}, },
summary: {
type: Object,
default: null,
},
}); });
const quasar = useQuasar();
const slots = useSlots(); const slots = useSlots();
const { t } = useI18n(); const { t } = useI18n();
const entity = computed(() => useArrayData($props.dataKey).store.data); const entity = computed(() => useArrayData($props.dataKey).store.data);
@ -57,27 +62,36 @@ async function getData() {
emit('onFetch', data); emit('onFetch', data);
} }
const emit = defineEmits(['onFetch']); const emit = defineEmits(['onFetch']);
function viewSummary(id) {
quasar.dialog({
component: $props.summary,
componentProps: {
id,
},
});
}
</script> </script>
<template> <template>
<div class="descriptor"> <div class="descriptor">
<template v-if="entity"> <template v-if="entity">
<div class="header bg-primary q-pa-sm"> <div class="header bg-primary q-pa-sm justify-between">
<RouterLink :to="{ name: `${module}List` }"> <QBtn
<QBtn @click.stop="viewSummary(entity.id)"
round round
flat flat
dense dense
size="md" size="md"
icon="view_list" icon="preview"
color="white" color="white"
class="link" class="link"
> v-if="summary"
<QTooltip> >
{{ t('components.cardDescriptor.mainList') }} <QTooltip>
</QTooltip> {{ t('components.smartCard.openSummary') }}
</QBtn> </QTooltip>
</RouterLink> </QBtn>
<RouterLink :to="{ name: `${module}Summary`, params: { id: entity.id } }"> <RouterLink :to="{ name: `${module}Summary`, params: { id: entity.id } }">
<QBtn <QBtn
round round
@ -93,7 +107,6 @@ const emit = defineEmits(['onFetch']);
</QTooltip> </QTooltip>
</QBtn> </QBtn>
</RouterLink> </RouterLink>
<QBtn <QBtn
v-if="slots.menu" v-if="slots.menu"
size="md" size="md"
@ -216,8 +229,6 @@ const emit = defineEmits(['onFetch']);
width: 256px; width: 256px;
.header { .header {
display: flex; display: flex;
justify-content: space-between;
align-items: stretch;
} }
.icons { .icons {
margin: 0 10px; margin: 0 10px;

3
src/pages/Claim/Card/ClaimDescriptor.vue
View File

@ -7,6 +7,7 @@ import { useState } from 'src/composables/useState';
import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue'; import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue'; import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
import ClaimDescriptorMenu from 'pages/Claim/Card/ClaimDescriptorMenu.vue'; import ClaimDescriptorMenu from 'pages/Claim/Card/ClaimDescriptorMenu.vue';
import CardDescriptor from 'components/ui/CardDescriptor.vue'; import CardDescriptor from 'components/ui/CardDescriptor.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
@ -119,7 +120,7 @@ const setData = (entity) => {
<template #value> <template #value>
<span class="link"> <span class="link">
{{ entity.worker.user.name }} {{ entity.worker.user.name }}
<WorkerDescriptorProxy :id="entity.worker.userFk" /> <WorkerDescriptorProxy :id="entity.worker.user.id" />
</span> </span>
</template> </template>
</VnLv> </VnLv>

45
src/pages/Claim/ClaimList.vue
View File

@ -5,12 +5,13 @@ import { useQuasar } from 'quasar';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { toDate } from 'filters/index'; import { toDate } from 'filters/index';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import ClaimSummaryDialog from './Card/ClaimSummaryDialog.vue';
import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
import ClaimFilter from './ClaimFilter.vue'; import ClaimFilter from './ClaimFilter.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import CardList from 'src/components/ui/CardList.vue'; import CardList from 'src/components/ui/CardList.vue';
import ClaimSummaryDialog from './Card/ClaimSummaryDialog.vue';
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
import WorkerDescriptorProxy from '../Worker/Card/WorkerDescriptorProxy.vue';
const stateStore = useStateStore(); const stateStore = useStateStore();
const router = useRouter(); const router = useRouter();
@ -37,6 +38,15 @@ function viewSummary(id) {
}, },
}); });
} }
function viewDescriptor(id) {
quasar.dialog({
component: CustomerDescriptorProxy,
componentProps: {
id,
},
});
}
</script> </script>
<template> <template>
@ -86,14 +96,22 @@ function viewSummary(id) {
> >
<template #list-items> <template #list-items>
<VnLv label="ID" :value="row.id" /> <VnLv label="ID" :value="row.id" />
<VnLv <VnLv :label="t('claim.list.customer')" @click.stop>
:label="t('claim.list.customer')" <template #value>
:value="row.clientName" <span class="link">
/> {{ row.clientName }}
<VnLv <CustomerDescriptorProxy :id="row.clientFk" />
:label="t('claim.list.assignedTo')" </span>
:value="row.workerName" </template>
/> </VnLv>
<VnLv :label="t('claim.list.assignedTo')" @click.stop>
<template #value>
<span class="link">
{{ row.workerName }}
<WorkerDescriptorProxy :id="row.workerFk" />
</span>
</template>
</VnLv>
<VnLv <VnLv
:label="t('claim.list.created')" :label="t('claim.list.created')"
:value="toDate(row.created)" :value="toDate(row.created)"
@ -125,13 +143,6 @@ function viewSummary(id) {
{{ t('components.smartCard.openSummary') }} {{ t('components.smartCard.openSummary') }}
</QTooltip> </QTooltip>
</QBtn> </QBtn>
<QBtn flat icon="vn:client" @click.stop>
<QTooltip>
{{ t('components.smartCard.viewDescription') }}
</QTooltip>
<CustomerDescriptorProxy :id="row.clientFk" />
</QBtn>
</template> </template>
</CardList> </CardList>
</template> </template>

5
src/pages/Customer/Card/CustomerDescriptor.vue
View File

@ -14,6 +14,10 @@ const $props = defineProps({
required: false, required: false,
default: null, default: null,
}, },
summary: {
type: Object,
default: null,
},
}); });
const route = useRoute(); const route = useRoute();
@ -34,6 +38,7 @@ const setData = (entity) => (data.value = useCardDescription(entity.name, entity
:title="data.title" :title="data.title"
:subtitle="data.subtitle" :subtitle="data.subtitle"
@on-fetch="setData" @on-fetch="setData"
:summary="$props.summary"
data-key="customerData" data-key="customerData"
> >
<template #body="{ entity }"> <template #body="{ entity }">

8
src/pages/Customer/Card/CustomerDescriptorProxy.vue
View File

@ -1,5 +1,6 @@
<script setup> <script setup>
import CustomerDescriptor from './CustomerDescriptor.vue'; import CustomerDescriptor from './CustomerDescriptor.vue';
import CustomerSummaryDialog from './CustomerSummaryDialog.vue';
const $props = defineProps({ const $props = defineProps({
id: { id: {
@ -8,8 +9,13 @@ const $props = defineProps({
}, },
}); });
</script> </script>
<template> <template>
<QPopupProxy> <QPopupProxy>
<CustomerDescriptor v-if="$props.id" :id="$props.id" /> <CustomerDescriptor
v-if="$props.id"
:id="$props.id"
:summary="CustomerSummaryDialog"
/>
</QPopupProxy> </QPopupProxy>
</template> </template>

7
src/pages/Worker/Card/WorkerDescriptor.vue
View File

@ -14,6 +14,10 @@ const $props = defineProps({
required: false, required: false,
default: null, default: null,
}, },
summary: {
type: Object,
default: null,
},
}); });
const route = useRoute(); const route = useRoute();
@ -53,7 +57,7 @@ const sip = computed(() => worker.value?.sip && worker.value.sip.extension);
function getWorkerAvatar() { function getWorkerAvatar() {
const token = getToken(); const token = getToken();
return `/api/Images/user/160x160/${route.params.id}/download?access_token=${token}`; return `/api/Images/user/160x160/${entityId.value}/download?access_token=${token}`;
} }
const data = ref(useCardDescription()); const data = ref(useCardDescription());
const setData = (entity) => { const setData = (entity) => {
@ -69,6 +73,7 @@ const setData = (entity) => {
:filter="filter" :filter="filter"
:title="data.title" :title="data.title"
:subtitle="data.subtitle" :subtitle="data.subtitle"
:summary="$props.summary"
@on-fetch=" @on-fetch="
(data) => { (data) => {
worker = data; worker = data;

7
src/pages/Worker/Card/WorkerDescriptorProxy.vue
View File

@ -1,5 +1,6 @@
<script setup> <script setup>
import WorkerDescriptor from './WorkerDescriptor.vue'; import WorkerDescriptor from './WorkerDescriptor.vue';
import WorkerSummaryDialog from './WorkerSummaryDialog.vue';
const $props = defineProps({ const $props = defineProps({
id: { id: {
@ -11,6 +12,10 @@ const $props = defineProps({
<template> <template>
<QPopupProxy> <QPopupProxy>
<WorkerDescriptor v-if="$props.id" :id="$props.id" /> <WorkerDescriptor
v-if="$props.id"
:id="$props.id"
:summary="WorkerSummaryDialog"
/>
</QPopupProxy> </QPopupProxy>
</template> </template>

14
test/cypress/integration/ticketBoxing.spec.js
View File

@ -17,18 +17,4 @@ describe('TicketBoxing', () => {
cy.get('div[class="q-item__label text-h6"]').eq(0).click(); cy.get('div[class="q-item__label text-h6"]').eq(0).click();
cy.get('.q-notification__message').should('have.text', 'No videos available'); cy.get('.q-notification__message').should('have.text', 'No videos available');
}); });
it('should show select time and video if have video list', () => {
cy.intercept(
{
method: 'GET',
url: '/api/Boxings/*',
},
['2022-01-01T01-01-00.mp4', '2022-02-02T02-02-00.mp4', '2022-03-03T03-03-00.mp4']
).as('getVideoList');
cy.get('.q-list').eq(3).find('.q-item').eq(2).click();
cy.get('.q-list').eq(3).find('.q-item').eq(0).find('.q-range');
cy.get('.q-list').eq(3).find('.q-item').eq(1).find('.q-select');
});
}); });