add: search loads

src/components/CardLoad.vue

@@ -5,9 +5,11 @@
     import { getStatusLoad } from '../helpers/status';
     import { useLoadsStore } from '../stores/loads';
     import Swal from 'sweetalert2'
+    import { useAuthStore } from '../stores/auth';
 
     const router = useRouter();
     const loadsStore = useLoadsStore();
+    const authStore = useAuthStore();
 
     const props = defineProps({
         load: {
@@ -112,7 +114,7 @@
                 </p>
                 
             </div>
-            <div class="col-lg-6 col-sm-12">
+            <div class="col-lg-6 col-sm-12" v-if="authStore.user?.permissions.includes('role_shipper')">
                 <p><span>Status de la publicación:</span> <span>{{ getStatusPublished(load) }}</span></p>
                 <p :style="{color: getStatusLoad(load).color}"><span>Status de la carga:</span> <span>{{ getStatusLoad(load).status }}</span></p>
             </div>
@@ -146,7 +148,7 @@
         <div v-if="load.notes" class="box-note">
             {{ load.notes }}
         </div>
-        <div class="btn-row" v-if="!readOnly">
+        <div class="btn-row" v-if="!readOnly && authStore.user?.permissions.includes('role_shipper')">
             <button
                 class="btn-primary-sm bg-dark"
                 @click="handleDeleteLoad"
@@ -174,6 +176,19 @@
                 data-target="#proposalsModal"
             >#{{ load.no_of_proposals }} Ofertas</button>
         </div>
+        <div class="btn-row" v-if="authStore.user?.permissions.includes('role_carrier')">
+            <button
+                class="btn-primary-sm bg-dark"
+                data-toggle="modal" data-target="#formLoadModal"
+                @click=""
+            >Hacer oferta</button>
+            <button
+                class="btn-primary-sm"
+                @click=""
+                data-toggle="modal" 
+                data-target="#proposalsModal"
+            ><i class="fa-solid fa-phone clear-sm"></i> Llamar ahora</button>
+        </div>
     </div>
 </template>