Merge pull request 'feature/ms-141-EntrySubmoduleNotes' (#74) from feature/ms-141-EntrySubmoduleNotes into dev

Reviewed-on: hyervoni/salix-front-mindshore#74

src/i18n/en/index.js

@@ -335,6 +335,10 @@ export default {
             buyingValue: 'Buying value',
             packagingFk: 'Box',
         },
+        notes: {
+            observationType: 'Observation type',
+            description: 'Description',
+        },
         descriptor: {
             agency: 'Agency',
             landed: 'Landed',

src/i18n/es/index.js

@@ -334,6 +334,10 @@ export default {
             buyingValue: 'Coste',
             packagingFk: 'Embalaje',
         },
+        notes: {
+            observationType: 'Tipo de observación',
+            description: 'Descripción',
+        },
         descriptor: {
             agency: 'Agency',
             landed: 'F. entrega',

src/pages/Entry/Card/EntryNotes.vue

@@ -1 +1,99 @@
-<template>Entry Notes</template>
+<script setup>
+import { ref, onMounted } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+
+import FetchData from 'components/FetchData.vue';
+import CrudModel from 'components/CrudModel.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+
+const route = useRoute();
+const { t } = useI18n();
+
+const entryObservationsRef = ref(null);
+const entryObservationsOptions = ref([]);
+
+onMounted(() => {
+    if (entryObservationsRef.value) entryObservationsRef.value.reload();
+});
+</script>
+<template>
+    <FetchData
+        url="ObservationTypes"
+        @on-fetch="(data) => (entryObservationsOptions = data)"
+        auto-load
+    />
+    <CrudModel
+        data-key="EntryAccount"
+        url="EntryObservations"
+        model="EntryAccount"
+        :filter="{
+            fields: ['id', 'entryFk', 'observationTypeFk', 'description'],
+            where: { entryFk: route.params.id },
+        }"
+        ref="entryObservationsRef"
+        :default-remove="false"
+        :data-required="{ entryFk: route.params.id }"
+    >
+        <template #body="{ rows }">
+            <QCard class="q-pa-md">
+                <VnRow
+                    v-for="(row, index) in rows"
+                    :key="index"
+                    class="row q-gutter-md q-mb-md"
+                >
+                    <div class="col-3">
+                        <VnSelectFilter
+                            :label="t('entry.notes.observationType')"
+                            v-model="row.observationTypeFk"
+                            :options="entryObservationsOptions"
+                            option-label="description"
+                            option-value="id"
+                            hide-selected
+                        />
+                    </div>
+                    <div class="col">
+                        <VnInput
+                            :label="t('entry.notes.description')"
+                            v-model="row.description"
+                        />
+                    </div>
+                    <div class="col-1 row justify-center items-center">
+                        <QIcon
+                            name="delete"
+                            size="sm"
+                            class="cursor-pointer"
+                            color="primary"
+                            @click="entryObservationsRef.remove([row])"
+                        >
+                            <QTooltip>
+                                {{ t('Remove note') }}
+                            </QTooltip>
+                        </QIcon>
+                    </div>
+                </VnRow>
+                <VnRow>
+                    <QIcon
+                        name="add"
+                        size="sm"
+                        class="cursor-pointer"
+                        color="primary"
+                        @click="entryObservationsRef.insert()"
+                    >
+                        <QTooltip>
+                            {{ t('Add note') }}
+                        </QTooltip>
+                    </QIcon>
+                </VnRow>
+            </QCard>
+        </template>
+    </CrudModel>
+</template>
+
+<i18n>
+    es:
+        Add note: Añadir nota
+        Remove note: Quitar nota
+</i18n>