fix: refs #8443 code and form view fixes

src/components/EntityCalendar.vue

@@ -8,6 +8,10 @@ import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.scss';
 import { useWeekdayStore } from 'src/stores/useWeekdayStore';
 import useWeekdaysOrder from 'src/composables/getWeekdays';
 
+const formatDate = (dateToFormat, format = 'YYYY-MM-DD') => {
+  return date.formatDate(dateToFormat, format);
+};
+
 const props = defineProps({
     year: {
         type: Number,
@@ -33,13 +37,13 @@ const { locale } = useI18n();
 const weekdayStore = useWeekdayStore();
 const weekDays = useWeekdaysOrder();
 const calendarRef = ref(null);
-const today = ref(date.formatDate(Date.vnNew(), 'YYYY-MM-DD'));
+const today = ref(formatDate(Date.vnNew()));
 const todayTimestamp = computed(() => {
     const date = Date.vnNew();
     date.setHours(0, 0, 0, 0);
     return date.getTime();
 });
-const _monthDate = computed(() => date.formatDate(props.monthDate, 'YYYY-MM-DD'));
+const _monthDate = computed(() => formatDate(props.monthDate));
 
 const calendarHeaderTitle = computed(() => {
     return `${weekdayStore.getLocaleMonths[props.month - 1].locale} ${props.year}`;

src/components/EntityCalendarGrid.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed, onMounted, ref, watch, onUnmounted, nextTick } from 'vue';
+import { computed, onMounted, ref, onUnmounted, nextTick } from 'vue';
 import { useStateStore } from 'stores/useStateStore';
 import { useWeekdayStore } from 'src/stores/useWeekdayStore';
 import { useArrayData } from 'src/composables/useArrayData';
@@ -27,8 +27,6 @@ const firstDay = ref(Date.vnNew());
 const lastDay = ref(Date.vnNew());
 const months = ref([]);
 const arrayData = useArrayData(props.dataKey);
-const { store } = arrayData;
-
 onMounted(async () => {
   const initialDate = Date.vnNew();
   initialDate.setDate(1);

src/pages/Route/Vehicle/Card/VehicleEventInclusionForm.vue

@@ -61,7 +61,7 @@ const arrayData = useArrayData('VehicleEvents');
 
 onMounted(() => {
     if (props.event) {
-        vehicleFormData.value = { ...props.event };
+        vehicleFormData.value = props.event;
     }
 });
 
@@ -130,13 +130,6 @@ const refetchEvents = async () => {
             <VnRow class="row q-gutter-md q-mb-md">
                 <VnInputDate :label="t('Started')" v-model="vehicleFormData.started" />
                 <VnInputDate :label="t('Finished')" v-model="vehicleFormData.finished" />
-            </VnRow>
-            <VnRow>
-                <VnInput
-                    v-model="vehicleFormData.description"
-                    :label="t('globals.description')"
-                    type="text"
-                />
                 <VnSelect
                     url="VehicleStates"
                     v-model="vehicleFormData.vehicleStateFk"
@@ -144,6 +137,11 @@ const refetchEvents = async () => {
                     option-label="state"
                 />
             </VnRow>
+            <VnInput
+                    v-model="vehicleFormData.description"
+                    :label="t('globals.description')"
+                    type="text"
+            />
         </template>
         <template #custom-buttons>
             <QBtn

src/pages/Route/Vehicle/VehicleCalendar.vue

@@ -3,13 +3,6 @@ import EntityCalendar from 'src/components/EntityCalendar.vue';
 
 const emit = defineEmits(['onDateSelected']);
 
-const getEventAttrs = ({ day }) => ({
-    class: '--event',
-    label: day,
-});
-
-defineExpose({ getEventAttrs });
-
 </script>
 
 <template>

src/pages/Route/Vehicle/VehicleCalendarGrid.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, watch, onMounted } from 'vue';
+import { ref, watch } from 'vue';
 import EntityCalendarGrid from 'src/components/EntityCalendarGrid.vue';
 import VehicleCalendar from './VehicleCalendar.vue';
 import { useArrayData } from 'src/composables/useArrayData';

test/cypress/integration/route/vehicle/vehicleEvents.spec.js

@@ -10,14 +10,14 @@ describe('Vehicle', () => {
         cy.dataCy('Started_inputDate').type('01/01/2001');
         cy.dataCy('Finished_inputDate').type('08/02/2001');
         cy.get(':nth-child(5)').find('[data-cy="Description_input"]').clear().type('Test');
-        cy.selectOption(':nth-child(5) > .q-select > .q-field__inner > .q-field__control > .q-field__control-container', 3);
+        cy.selectOption('.vn-row > .q-select > .q-field__inner > .q-field__control > .q-field__control-container', 3);
         cy.get('.q-mt-lg > .q-btn--standard').click();
 
         cy.get('.q-current-day > .q-calendar-month__day--content > .q-btn').click();
         cy.dataCy('Started_inputDate').clear().type('03/02/2001');
         cy.dataCy('Finished_inputDate').clear().type('15/03/2001');
         cy.get(':nth-child(5)').find('[data-cy="Description_input"]').clear().type('Test2');
-        cy.selectOption(':nth-child(5) > .q-select > .q-field__inner > .q-field__control > .q-field__control-container', 5);
+        cy.selectOption('.vn-row > .q-select > .q-field__inner > .q-field__control > .q-field__control-container', 5);
         cy.get('.q-mt-lg > .q-btn--standard').click();
 
         cy.dataCy('delete_event').eq(0).click();