add: edit proposal

src/components/MakeProposalModal.vue

@@ -1,11 +1,12 @@
 <script setup>
-    import { ref, onMounted, reactive } from 'vue';
+    import { ref, onMounted, reactive, computed } from 'vue';
     import CardEmpty from './CardEmpty.vue';
     import Spiner from './ui/Spiner.vue';
     import BadgeError from './ui/BadgeError.vue';
     import { GoogleMap, Marker } from 'vue3-google-map';
     import useDirectionsRender from '../composables/useDirectionRender';
     import { useAuthStore } from '../stores/auth';
+    import { useCompanyStore } from '../stores/company';
     import { useVehiclesStore } from '../stores/vehicles';
     import { saveProposal } from '../services/vehicles'
     import Swal from 'sweetalert2';
@@ -33,9 +34,14 @@
         load: {
             type: Object,
             required: true,
+        },
+        proposal: {
+            type: Object,
         }
     })
 
+    const companyStore = useCompanyStore();
+
 
     defineEmits(['reset-load'])
 
@@ -56,6 +62,11 @@
         originCoords.value = await geocodeAddress(props.load.origin_formatted_address);
         destinationCoords.value = await geocodeAddress(props.load.destination_formatted_address);
         isLoading.value = false;
+        console.log(props.proposal);
+        if(props.proposal) {
+            form.vehicle = props.proposal.vehicle._id;
+            form.comments = props.proposal.comment;
+        }
     }
 
     const handleResize = () => {
@@ -86,30 +97,53 @@
         }
 
         msgError.value = '';
-        let formData = {
-            carrier: authStore.user.company,
-            bidder : authStore.user._id,
-            comment: form.comments,
-            vehicle : form.vehicle,
-            load : props.load._id
+        let result;
+        let action;
+        if(!props.proposal) {
+            let formData = {
+                carrier: authStore.user.company,
+                bidder : authStore.user._id,
+                comment: form.comments,
+                vehicle : form.vehicle,
+                load : props.load._id
+            }
+            loadingSubmit.value = true;
+            action = 'creada';
+            result = await companyStore.createPropsal(formData);
+        } else {
+            let formData = {
+                comment: form.comments,
+                vehicle : form.vehicle,
+            }
+            const index = vehiclesStore.vehicles.findIndex((prop) => prop._id === form.vehicle);
+            const vehicleSelected  = vehiclesStore.vehicles[index];
+            console.log(vehicleSelected);
+            const localData = {
+                vehicle: vehicleSelected,
+                _driver: vehicleSelected?.driver.first_name + ' ' + vehicleSelected?.driver.last_name
+            }
+            loadingSubmit.value = true;
+            action = 'actualizada'
+            result = await companyStore.updatePropsalLoad(props.proposal._id, formData, localData);
         }
 
-        loadingSubmit.value = true;
-        const result = await saveProposal(formData);
-        if(result !== null) {
+        if(result === 'success') {
             document.getElementById('btnClosemakeProposalModal').click();
             Swal.fire({
-                title: '<strong>Oferta creada con éxito!</strong>',
+                title: `<strong>Oferta ${action} con éxito!</strong>`,
                 icon: 'success'
             })
         } else {
             Swal.fire({
-                title: '<strong>Oferta no se pudo crear!</strong>',
+                title: result,
                 icon: 'error'
             })
         }
         loadingSubmit.value = false;
     }
+
+    const title = computed(() => (props.proposal) ? 'Modificar oferta' : 'Realizar oferta');
+    const btnSubmit = computed(() => (props.proposal) ? 'Guardar' : 'Enviar');
 </script>
 
 <template>
@@ -117,7 +151,7 @@
         <div class="modal-dialog modal-dialog-centered modal-xl" role="document">
             <div class="modal-content">
                 <div class="modal-header">
-                    <h2 class="title mt-2 mb-3">Realizar oferta</h2>
+                    <h2 class="title mt-2 mb-3">{{ title }}</h2>
                     <button 
                         id="btnClosemakeProposalModal" 
                         type="button" 
@@ -163,11 +197,12 @@
                                         v-else 
                                         type="submit"
                                         class="btn-primary-sm"
-                                        value="Enviar"
+                                        :value="btnSubmit"
                                     />
                                 </div>
                             </form>
                             <GoogleMap
+                                v-if="!proposal"
                                 api-key="AIzaSyAJtfvrAKy7vnUSv2nzk4dYQkOs3OP4MMs"
                                 :center="{lat:19.432600, lng:-99.133209}"
                                 :zoom="zoom"