Desarrollo de los submodulos basic data, notes y pbx #245
|
|
@ -1,98 +1,38 @@
|
|||
<script setup>
|
||||
import { onBeforeMount, ref, watch } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute } from 'vue-router';
|
||||
|
||||
import axios from 'axios';
|
||||
import { date } from 'quasar';
|
||||
import VnNotes from 'src/components/ui/VnNotes.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const rows = ref([]);
|
||||
|
||||
const filter = {
|
||||
order: 'created DESC',
|
||||
where: { workerFk: null },
|
||||
include: { relation: 'user' },
|
||||
where: { workerFk: route.params.id },
|
||||
include: {
|
||||
relation: 'worker',
|
||||
scope: {
|
||||
fields: ['id', 'firstName', 'lastName'],
|
||||
include: {
|
||||
relation: 'user',
|
||||
scope: {
|
||||
fields: ['id', 'nickname'],
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
onBeforeMount(() => {
|
||||
getData(route.params.id);
|
||||
});
|
||||
|
||||
watch(
|
||||
() => route.params.id,
|
||||
(newValue) => {
|
||||
getData(newValue);
|
||||
}
|
||||
);
|
||||
|
||||
const getData = async (id) => {
|
||||
filter.where.workerFk = id;
|
||||
try {
|
||||
const { data } = await axios.get('WorkerObservations', {
|
||||
params: { filter: JSON.stringify(filter) },
|
||||
});
|
||||
rows.value = data;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
const toWorkerNoteCreate = () => {
|
||||
router.push({ name: 'WorkerNoteCreate' });
|
||||
const body = {
|
||||
workerFk: route.params.id,
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="full-width flex justify-center">
|
||||
<QCard class="full-width q-pa-lg" v-if="rows.length">
|
||||
<div>
|
||||
<QCard
|
||||
v-for="(item, index) in rows"
|
||||
:key="index"
|
||||
:class="{
|
||||
'q-pa-md': true,
|
||||
'q-rounded': true,
|
||||
'custom-border': true,
|
||||
'q-mb-md': index < rows.length - 1,
|
||||
}"
|
||||
>
|
||||
<div class="flex justify-end">
|
||||
<p class="color-vn-label q-mb-none">
|
||||
{{ date.formatDate(item?.created, 'DD-MM-YYYY HH:mm') }}
|
||||
</p>
|
||||
</div>
|
||||
<h6 class="q-mt-none q-mb-none">{{ item.text }}</h6>
|
||||
</QCard>
|
||||
</div>
|
||||
</QCard>
|
||||
<div v-else>
|
||||
<h5 class="flex justify-center color-vn-label">
|
||||
{{ t('globals.noResults') }}
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<QPageSticky :offset="[18, 18]">
|
||||
<QBtn @click.stop="toWorkerNoteCreate()" color="primary" fab icon="add" />
|
||||
<QTooltip>
|
||||
{{ t('New note') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
<VnNotes
|
||||
style="overflow-y: auto"
|
||||
|
jsegarra marked this conversation as resolved
Outdated
|
||||
:add-note="{ type: Boolean, default: true }"
|
||||
url="WorkerObservations"
|
||||
:filter="filter"
|
||||
:body="body"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.custom-border {
|
||||
border: 2px solid var(--vn-light-gray);
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
New note: Nueva nota
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -1,99 +0,0 @@
|
|||
<script setup>
|
||||
import { computed, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
import axios from 'axios';
|
||||
|
||||
import useNotify from 'src/composables/useNotify';
|
||||
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
|
||||
const { notify } = useNotify();
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const isLoading = ref(false);
|
||||
const text = ref('');
|
||||
|
||||
const hasChanged = computed(() => {
|
||||
return text.value !== '';
|
||||
});
|
||||
|
||||
const onSubmit = async () => {
|
||||
isLoading.value = true;
|
||||
|
||||
const payload = {
|
||||
text: text.value,
|
||||
workerFk: Number(route.params.id),
|
||||
};
|
||||
try {
|
||||
await axios.post('WorkerObservations', payload);
|
||||
text.value = null;
|
||||
notify('globals.dataSaved', 'positive');
|
||||
toWorkerNotes();
|
||||
} catch (error) {
|
||||
notify(error.error, 'negative');
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const toWorkerNotes = () => {
|
||||
router.push({
|
||||
name: 'WorkerNotes',
|
||||
params: {
|
||||
id: route.params.id,
|
||||
},
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Teleport to="#st-actions">
|
||||
<QBtnGroup push class="q-gutter-x-sm">
|
||||
<QBtn
|
||||
:disabled="isLoading"
|
||||
:label="t('globals.cancel')"
|
||||
:loading="isLoading"
|
||||
@click="toWorkerNotes"
|
||||
color="primary"
|
||||
flat
|
||||
icon="close"
|
||||
/>
|
||||
<QBtn
|
||||
:disabled="!hasChanged"
|
||||
:label="t('globals.save')"
|
||||
:loading="isLoading"
|
||||
@click="onSubmit"
|
||||
color="primary"
|
||||
icon="save"
|
||||
/>
|
||||
</QBtnGroup>
|
||||
</Teleport>
|
||||
|
||||
<div class="full-width flex justify-center">
|
||||
<QCard class="card-width q-pa-lg">
|
||||
<QCardSection>
|
||||
<QForm>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
:label="t('Note')"
|
||||
autofocus
|
||||
type="textarea"
|
||||
v-model="text"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
</QForm>
|
||||
</QCardSection>
|
||||
</QCard>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Note: Nota
|
||||
</i18n>
|
||||
Loading…
Reference in New Issue
Usar componente VnNotes (src/components/ui/VnNotes.vue)
Corregido:
8cf14929e3Se muestran los segundos pero es tema del composable toDateHour
Por otra parte, si relleno el input pero pulso sobre la X, no muestra el modal de confirmar salida. Esto creo que es punto de mejora en VnNotes. tu que dices @alexm ??