refs 6105 claimNotes and VnNotes created #83
|
@ -27,7 +27,7 @@ async function insert() {
|
|||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="notes row justify-center">
|
||||
<div class="column items-center">
|
||||
<VnPaginate
|
||||
:data-key="$props.url"
|
||||
:url="$props.url"
|
||||
|
@ -38,63 +38,51 @@ async function insert() {
|
|||
ref="vnPaginateRef"
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<QCard
|
||||
class="row justify-between items-center flex-wrap-wrap q-pa-md q-ma-md"
|
||||
v-for="(note, index) in rows"
|
||||
:key="index"
|
||||
>
|
||||
<div class="picture q-pa-sm col-6 col-lg-2">
|
||||
<QCard class="q-pa-md" v-for="(note, index) in rows" :key="index">
|
||||
<QCardSection horizontal>
|
||||
jorgep marked this conversation as resolved
Outdated
|
||||
<slot name="picture">
|
||||
jgallego marked this conversation as resolved
Outdated
alexm
commented
El QDialog dixal al final del html, si no queda confus El QDialog dixal al final del html, si no queda confus
|
||||
<VnAvatar :worker="note.workerFk">
|
||||
<template #description>
|
||||
<span class="link">
|
||||
{{
|
||||
`${note.worker.firstName} ${note.worker.lastName}`
|
||||
}}
|
||||
</span>
|
||||
<WorkerDescriptorProxy :id="note.worker.id" />
|
||||
</template>
|
||||
</VnAvatar>
|
||||
<VnAvatar :worker="note.workerFk" />
|
||||
</slot>
|
||||
</div>
|
||||
<div class="text q-mx-auto q-pa-xs col col-lg-8">
|
||||
<QItem class="full-width justify-between items-start">
|
||||
<span class="link">
|
||||
{{ `${note.worker.firstName} ${note.worker.lastName}` }}
|
||||
<WorkerDescriptorProxy :id="note.worker.id" />
|
||||
</span>
|
||||
<slot name="actions">
|
||||
{{ toDateHour(note.created) }}
|
||||
</slot>
|
||||
</QItem>
|
||||
</QCardSection>
|
||||
<QCardSection>
|
||||
<slot name="text">
|
||||
{{ note.text }}
|
||||
</slot>
|
||||
</div>
|
||||
<div class="actions self-baseline text-right col-6 col-lg-2">
|
||||
<slot name="actions">
|
||||
<div>
|
||||
{{ toDateHour(note.created) }}
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
</QCardSection>
|
||||
</QCard>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
<QPageSticky position="bottom-right" :offset="[25, 25]">
|
||||
<QBtn
|
||||
v-if="addNote"
|
||||
class="add-btn"
|
||||
color="primary"
|
||||
icon="add"
|
||||
size="xl"
|
||||
size="lg"
|
||||
round
|
||||
@click="noteModal = true"
|
||||
/>
|
||||
</QPageSticky>
|
||||
<QDialog v-model="noteModal" persistent>
|
||||
<QCard class="note-dialog column q-pa-sm">
|
||||
<QCardSection class="note-dialog__header row self-start justify-between">
|
||||
<div class="note-dialog__title row items-center text-primary text-h6">
|
||||
<QIcon name="draft" class="note-dialog__title-icon q-mr-sm" />
|
||||
<div class="text-h6 note-dialog__title-text">
|
||||
<QCard>
|
||||
<QCardSection>
|
||||
<QItem class="q-px-none">
|
||||
<span class="text-primary text-h6 full-width">
|
||||
<QIcon name="draft" class="q-mr-xs" />
|
||||
{{ t('Add note') }}
|
||||
jorgep marked this conversation as resolved
Outdated
alexm
commented
Podries gastar el component VnPaginate i te ahorraries el fetch de dalt i el v.for de aci.
Pots gastar el component i possarli v-bind="$attrs" i li pasa les propietats que a tu te hajen pasat. I ja no has ni de fenirles tu Podries gastar el component VnPaginate i te ahorraries el fetch de dalt i el v.for de aci.
Apart aixina tens millor logica per als filtros (VnPaginate te mes props que podrien ser utils en un futur):
```
dataKey: {
type: String,
required: true,
},
autoLoad: {
type: Boolean,
default: false,
},
data: {
type: Array,
default: null,
},
url: {
type: String,
default: '',
},
filter: {
type: Object,
default: null,
},
where: {
type: Object,
default: null,
},
order: {
type: String,
default: '',
},
limit: {
type: Number,
default: 10,
},
userParams: {
type: Object,
default: null,
},
offset: {
type: Number,
default: 500,
},
```
Pots gastar el component i possarli v-bind="$attrs" i li pasa les propietats que a tu te hajen pasat. I ja no has ni de fenirles tu
|
||||
</div>
|
||||
</div>
|
||||
<QBtn icon="close" flat round dense v-close-popup />
|
||||
</span>
|
||||
<QBtn icon="close" flat round dense v-close-popup />
|
||||
</QItem>
|
||||
</QCardSection>
|
||||
<QCardSection class="note-dialog__content">
|
||||
<QCardSection>
|
||||
<QInput
|
||||
autofocus
|
||||
type="textarea"
|
||||
|
@ -105,7 +93,7 @@ async function insert() {
|
|||
v-model="newNote"
|
||||
></QInput>
|
||||
</QCardSection>
|
||||
<QCardActions class="note-dialog__actions self-end q-mr-md">
|
||||
<QCardActions class="justify-end q-mr-sm">
|
||||
<QBtn
|
||||
flat
|
||||
:label="t('globals.close')"
|
||||
|
@ -125,25 +113,7 @@ async function insert() {
|
|||
</template>
|
||||
<style lang="scss" scoped>
|
||||
jorgep marked this conversation as resolved
alexm
commented
fetch? Seria mas correcto submit, insert, etc fetch? Seria mas correcto submit, insert, etc
|
||||
.q-card {
|
||||
max-width: 60em;
|
||||
min-width: 340px;
|
||||
}
|
||||
.note-dialog {
|
||||
&__header {
|
||||
width: 100%;
|
||||
}
|
||||
&__content {
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $breakpoint-md) {
|
||||
.avatar-picture {
|
||||
width: 135px;
|
||||
}
|
||||
.text {
|
||||
order: 3;
|
||||
}
|
||||
max-width: 80em;
|
||||
}
|
||||
</style>
|
||||
<i18n>
|
||||
|
|
|
@ -266,6 +266,7 @@ export default {
|
|||
rma: 'RMA',
|
||||
photos: 'Photos',
|
||||
log: 'Audit logs',
|
||||
notes: 'Notes',
|
||||
},
|
||||
list: {
|
||||
customer: 'Customer',
|
||||
|
|
|
@ -265,6 +265,7 @@ export default {
|
|||
rma: 'RMA',
|
||||
photos: 'Fotos',
|
||||
log: 'Registros de auditoría',
|
||||
notes: 'Notas',
|
||||
},
|
||||
list: {
|
||||
customer: 'Cliente',
|
||||
|
|
|
@ -44,17 +44,6 @@ onMounted(async () => {
|
|||
<LeftMenu source="card" />
|
||||
<QSeparator />
|
||||
<QList>
|
||||
<QItem
|
||||
active-class="text-primary"
|
||||
:to="`/claim/${entityId}/notes`"
|
||||
clickable
|
||||
v-ripple
|
||||
>
|
||||
<QItemSection avatar>
|
||||
<QIcon name="draft" />
|
||||
</QItemSection>
|
||||
<QItemSection> {{ t('Notes') }} </QItemSection>
|
||||
</QItem>
|
||||
<QItem
|
||||
active-class="text-primary"
|
||||
clickable
|
||||
|
|
|
@ -25,7 +25,7 @@ const body = {
|
|||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="claim-notes col items-center">
|
||||
<div class="col items-center">
|
||||
<VnNotes
|
||||
:add-note="true"
|
||||
:id="id"
|
||||
|
|
|
@ -11,7 +11,14 @@ export default {
|
|||
redirect: { name: 'ClaimMain' },
|
||||
menus: {
|
||||
main: ['ClaimList', 'ClaimRmaList'],
|
||||
card: ['ClaimBasicData', 'ClaimLines', 'ClaimRma', 'ClaimPhotos', 'ClaimLog'],
|
||||
card: [
|
||||
'ClaimBasicData',
|
||||
'ClaimLines',
|
||||
'ClaimRma',
|
||||
'ClaimPhotos',
|
||||
'ClaimLog',
|
||||
'ClaimNotes',
|
||||
],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
|
@ -108,7 +115,7 @@ export default {
|
|||
path: 'notes',
|
||||
meta: {
|
||||
title: 'notes',
|
||||
icon: 'vn:details',
|
||||
icon: 'draft',
|
||||
},
|
||||
component: () => import('src/pages/Claim/Card/ClaimNotes.vue'),
|
||||
},
|
||||
|
|
|
@ -1,16 +1,17 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('ClaimNotes', () => {
|
||||
beforeEach(() => {
|
||||
const claimId = 2;
|
||||
cy.login('developer');
|
||||
cy.visit(`/#/claim/${claimId}/notes`);
|
||||
cy.visit(`/#/claim/${2}/notes`);
|
||||
});
|
||||
|
||||
it('should add a new note', () => {
|
||||
const message = 'This is a new message.';
|
||||
cy.get('.add-btn').click();
|
||||
cy.get('.note-dialog__content').type(message);
|
||||
cy.get('.note-dialog__actions .q-btn:nth-child(2)').click();
|
||||
cy.get('.notes .q-card .text').eq(0).should('have.text', message);
|
||||
cy.get('.q-page-sticky button').click();
|
||||
cy.get('.q-dialog .q-card__section:nth-child(2)').type(message);
|
||||
cy.get('.q-card__actions button:nth-child(2)').click();
|
||||
cy.get('.q-card .q-card__section:nth-child(2)')
|
||||
.eq(0)
|
||||
.should('have.text', message);
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue
El ref este si no es gasta en cap lloc lleval