comenzando a trabajar con vista de productos

This commit is contained in:
nat 2022-01-12 12:04:02 -03:00
parent b79ea6d1ed
commit 5d47636280
5 changed files with 36 additions and 34 deletions

3
public/css/app.css vendored Normal file
View File

@ -0,0 +1,3 @@
p.navbar-item:empty {
display: none;
}

View File

@ -11,10 +11,10 @@ Vue.component('categorias-container', {
</div>
</div>
</div>
</div>
</div>
</div>
</div>`,
</div><!-- END CARD -->
</div><!-- END BLOCK COLUMN -->
</div><!-- END COLUMNS -->
</div><!-- END CONTAINER -->`,
data() {
return {
categorias: null
@ -29,38 +29,37 @@ Vue.component('categorias-container', {
Vue.component('productos-container', {
template: `
<div class="productos-container">
<div v-for="producto in productos" class="card">
<div class="card-image">
<figure class="image is-4by3">
<img src="https://bulma.io/images/placeholders/1280x960.png" alt="Placeholder image">
</figure>
</div>
<div class="card-content">
<div class="media">
<div class="container">
<div class="columns is-multiline is-mobile">
<div v-for="producto in productos" class="block column is-one-quarter-desktop is-one-third-tablet is-half-mobile">
<div class="card" style="height:100%">
<div class="card-image">
<figure class="image is-4by3">
<img src="https://bulma.io/images/placeholders/1280x960.png" alt="Placeholder image">
</figure>
</div>
<div class="media-content">
<p class="title is-4">John Smith</p>
<p class="subtitle is-6">@johnsmith</p>
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-6" v-text="producto.nombre"></p>
<p class="subtitle is-7" v-text="producto.proveedor_id"></p>
<p class="subtitle is-7" v-text="producto.precio"></p>
</div>
</div>
</div>
</div>
<div class="content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Phasellus nec iaculis mauris. <a>@bulmaio</a>.
<a href="#">#css</a> <a href="#">#responsive</a>
<br>
<time datetime="2016-1-1">11:09 PM - 1 Jan 2016</time>
</div>
</div>
</div>
</div>`,
</div><!-- END CARD -->
</div><!-- END BLOCK COLUMN -->
</div><!-- END COLUMNS -->
</div><!-- END CONTAINER -->`,
data() {
return {
productos: null
productos: []
}
},
mounted() {
axios.get("/api/productos").then(response => this.productos = response.data);
axios.get("/api/productos").then(response => {
console.log(response.data);
this.productos = response.data.data;
});
}
});

View File

@ -20,14 +20,12 @@ Vue.component('subpedido-select', {
nombre: this.subpedido,
grupo_de_compra_id: this.gdcid
}).then(response => {
//se creo el subpedido, guardamos el subpedido en sesion
axios.post("/subpedidos/guardar_sesion", {
subpedido: response.data
}).then(response => {
if (response.status == 200) {
window.location.href = 'productos';
} else {
console.log(response);
}
});
});
}

View File

@ -15,6 +15,7 @@
<!-- Styles -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
</head>
<body>

View File

@ -2,6 +2,7 @@
@section('content')
<categorias-container></categorias-container>
<productos-container></productos-container>
@endsection
@section('scripts')