84 lines
2.4 KiB
Vue
84 lines
2.4 KiB
Vue
<script setup>
|
|
import { useI18n } from 'vue-i18n';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
|
import { toDateTimeFormat } from 'src/filters/date';
|
|
|
|
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
|
|
|
const { t } = useI18n();
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
|
|
const noteFilter = {
|
|
order: 'created DESC',
|
|
where: {
|
|
clientFk: `${route.params.id}`,
|
|
},
|
|
};
|
|
|
|
const toCustomerNoteCreate = () => {
|
|
router.push({ name: 'CustomerNoteCreate' });
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div class="full-width flex justify-center">
|
|
<QCard class="card-width q-pa-lg">
|
|
<VnPaginate
|
|
data-key="CustomerNotes"
|
|
url="clientObservations"
|
|
auto-load
|
|
:filter="noteFilter"
|
|
>
|
|
<template #body="{ rows }">
|
|
<div v-if="rows.length">
|
|
<QCard
|
|
v-for="(item, index) in rows"
|
|
:key="index"
|
|
class="q-pa-md q-rounded custom-border"
|
|
:class="{ 'q-mb-md': index < rows.length - 1 }"
|
|
>
|
|
<div class="flex justify-between">
|
|
<p class="color-vn-label">
|
|
{{ item.worker.user.nickname }}
|
|
</p>
|
|
<p class="color-vn-label">
|
|
{{ toDateTimeFormat(item?.created) }}
|
|
</p>
|
|
</div>
|
|
<h6 class="q-mt-xs q-mb-none">{{ item.text }}</h6>
|
|
</QCard>
|
|
</div>
|
|
|
|
<div v-else>
|
|
<h5 class="flex justify-center color-vn-label">
|
|
{{ t('globals.noResults') }}
|
|
</h5>
|
|
</div>
|
|
</template>
|
|
</VnPaginate>
|
|
</QCard>
|
|
</div>
|
|
|
|
<QPageSticky :offset="[18, 18]">
|
|
<QBtn @click.stop="toCustomerNoteCreate()" color="primary" fab icon="add" />
|
|
<QTooltip>
|
|
{{ t('New note') }}
|
|
</QTooltip>
|
|
</QPageSticky>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.custom-border {
|
|
border: 2px solid var(--vn-accent-color);
|
|
border-radius: 10px;
|
|
padding: 10px;
|
|
}
|
|
</style>
|
|
|
|
<i18n>
|
|
es:
|
|
New note: Nueva nota
|
|
</i18n>
|