Merge branch 'migrate-alex' into 'master'

add: selected popup directory type

See merge request jcruzbaasworkspace/enruta/webeta!13

src/components/CustomPopup.vue

@@ -0,0 +1,93 @@
+<script setup>
+    const props = defineProps({
+        options: {
+            type: Array,
+            required: true
+        },
+        value: {
+            type: Object,
+            required: true
+        },
+        style: {
+            type: Object,
+            required: false
+        },
+        selectedColor: {
+            type: String,
+            required: false
+        }
+    })
+
+
+    defineEmits(['change-value', 'close-popup'])
+</script>
+
+<template>
+        <div 
+            class="background-popup"
+            @click="$emit('close-popup')"
+        >
+        </div>
+        <div 
+            class="content-popup"
+            :style="style"
+        >
+            <div 
+                v-for="option in options"
+                class="box-btn" 
+                :style="{
+                    backgroundColor: (value.value === option.value) ? (selectedColor) ? selectedColor : 'primary' : ''
+                }"
+                @click="$emit('change-value', option)"
+            >{{ option.label }}</div>
+        </div>
+</template>
+
+
+<style scoped>
+    .background-popup {
+        position: fixed;
+        z-index: 1000;
+        width: 100wv;
+        right: 0px;
+        top: 0px;
+        left: 0px;
+        cursor: pointer;
+        bottom: 0px;
+        background-color: #c6b9b9;
+        opacity: 0.2;
+    }
+
+    .content-popup {
+        position: fixed;
+        right: 180px;
+        top: 180px;
+        z-index: 2000;
+        width: 200px;
+        background-color: #FFF;
+        opacity: 1;
+        border-radius: 13px;
+        padding: 20px 32px;
+        display: flex;
+        flex-direction: column;
+        /* flex-wrap: nowrap; */
+        /* overflow: hidden; */
+        filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.10));
+    }
+
+    .box-btn {
+        padding: 8px 16px;
+        margin-bottom: 8px;
+        background-color: rgb(234, 241, 241);
+        border-radius: 5px;
+        font-size: 0.8rem;
+        font-weight: 700;
+    }
+
+    @media (max-width: 568px) {
+        .content-popup {
+            top: 200px;
+            right: 20px;
+        }
+    }
+</style>

src/components/FormLoadModal.vue

@@ -79,7 +79,6 @@
         formLoad.owner = auth.user?.first_name + ' ' + auth.user?.last_name;
         //origin_formatted_address
         if(loadStore.currentLoad){
-            console.log(loadStore.currentLoad);
             formLoad.price = loadStore.currentLoad.actual_cost;
 			formLoad.segment = loadStore.currentLoad.categories?.length <= 0 ? [] : loadStore.currentLoad.categories.map(m =>{
 				return m;
@@ -131,7 +130,6 @@
 
         watch([originCoords, destinationCoords], async() => {
             if(originCoords.value && destinationCoords.value) {
-                // console.log('Se llama api direcciones ')
                 polylines.value = await getDirections(originCoords.value, destinationCoords.value);
             }
         })
@@ -406,7 +404,7 @@
                                 v-model:field="formLoad.dateDownload"
                             />
                             <Custominput
-                                label="Peso de la carga*"
+                                label="Peso de la carga en Kg*"
                                 type="number"
                                 :filled="false"
                                 name="weight"
@@ -423,7 +421,7 @@
                                 />
                             </div>
                             <Custominput
-                                label="Precio"
+                                label="Precio en MXN"
                                 type="Number"
                                 :filled="false"
                                 name="price"
@@ -451,8 +449,8 @@
                             <h2>Dirección de origen</h2>
 
                             <div class="form-check my-4" v-if="loadingLocations === false">
-                                <input class="form-check-input chekmark" type="checkbox" id="flexCheckDefault" v-model="checkLocationLoad">
-                                <label class="form-check-label custom-label" for="flexCheckDefault">
+                                <input class="form-check-input chekmark" type="checkbox" id="directoryOrigin" v-model="checkLocationLoad">
+                                <label class="form-check-label custom-label" for="directoryOrigin">
                                     Usar locaciones registradas 
                                 </label>
                             </div>
@@ -521,8 +519,8 @@
                         <div class="form-section">
                             <h2>Dirección de destino</h2>
                             <div class="form-check my-4" v-if="loadingLocations === false">
-                                <input class="form-check-input chekmark" type="checkbox" id="flexCheckDefault" v-model="checkLocationDownload">
-                                <label class="form-check-label custom-label" for="flexCheckDefault">
+                                <input class="form-check-input chekmark" type="checkbox" id="directoryDestination" v-model="checkLocationDownload">
+                                <label class="form-check-label custom-label" for="directoryDestination">
                                     Usar locaciones registradas 
                                 </label>
                             </div>