resources/js/components/pedidos/Body.vue

@@ -1,7 +1,11 @@
 <template>
     <div id="pedidos-body" class="pb-6 mb-6">
         <pedido-select v-if="!pedidoDefinido"/>
-        <pedidos-main v-else/>
+        <pedidos-main v-else>
+            <template v-slot:cartel>
+                <cartel-pedido-aprobado/>
+            </template>
+        </pedidos-main>
     </div>
 </template>
 
@@ -9,10 +13,11 @@
 import { mapGetters } from "vuex";
 import PedidoSelect from "./PedidoSelect.vue";
 import PedidosMain from "./PedidosMain.vue";
+import CartelPedidoAprobado from "./CartelPedidoAprobado.vue";
 
 export default {
     name: "PedidosBody",
-    components: { PedidosMain, PedidoSelect },
+    components: { CartelPedidoAprobado, PedidosMain, PedidoSelect },
     computed: {
         ...mapGetters('pedido', ["pedidoDefinido"]),
     },

resources/js/components/pedidos/PedidosMain.vue

@@ -2,13 +2,12 @@
 import { defineComponent } from "vue";
 import Canasta from "./Canasta.vue";
 import Chismosa from "./Chismosa.vue";
-import CartelPedidoAprobado from "./CartelPedidoAprobado.vue";
 import NavMigas from "./NavMigas.vue";
 import { mapActions, mapState } from "vuex";
 
 export default defineComponent({
     name: "PedidosMain",
-    components: { NavMigas, CartelPedidoAprobado, Chismosa, Canasta },
+    components: { NavMigas, Chismosa, Canasta },
     computed: {
         ...mapState('ui', ["show_chismosa"]),
     },
@@ -26,7 +25,7 @@ export default defineComponent({
         <nav-migas/>
         <div class="columns">
             <div class="column" :class="{ 'is-two-thirds-desktop is-hidden-touch': show_chismosa }">
-                <cartel-pedido-aprobado/>
+                <slot name="cartel"></slot>
                 <canasta/>
             </div>
             <div class="column is-full-touch" v-if="show_chismosa">