busqueda funcionando, migas rotas

This commit is contained in:
Alejandro Tasistro 2023-05-27 14:23:52 -03:00
parent 2eac2a9554
commit d19c83289d
5 changed files with 230 additions and 108 deletions

280
public/js/app.js vendored
View File

@ -2058,10 +2058,7 @@ __webpack_require__.r(__webpack_exports__);
return {
categorias: null,
visible: true,
miga: {
nombre: "Categorías",
href: "/productos"
}
miga: this.$rootMiga
};
},
mounted: function mounted() {
@ -2071,11 +2068,14 @@ __webpack_require__.r(__webpack_exports__);
_this.categorias = response.data;
});
Event.$emit("migas-setear-como-inicio", this.miga);
Event.$on("categoria-seleccionada", function (_) {
return _this.visible = false;
});
},
methods: {
seleccionarCategoria: function seleccionarCategoria(categoria) {
this.visible = false;
Event.$emit("categoria-seleccionada", categoria);
Event.$emit("categoria-seleccionada", 'categoria', categoria);
}
}
});
@ -2215,7 +2215,7 @@ __webpack_require__.r(__webpack_exports__);
data: function data() {
return {
visible: false,
gdc: null,
gdc: this.$gdc,
passwordVisible: false,
passwordType: "password"
};
@ -2341,11 +2341,26 @@ __webpack_require__.r(__webpack_exports__);
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
/* harmony default export */ __webpack_exports__["default"] = ({
data: function data() {
return {
isActive: false,
subpedido: null
subpedido: this.$pedido,
searchString: ""
};
},
methods: {
@ -2360,7 +2375,12 @@ __webpack_require__.r(__webpack_exports__);
});
},
toggleChismosa: function toggleChismosa() {
if (this.isActive) this.toggleState();
Event.$emit("toggle-chismosa");
},
buscar: function buscar() {
Event.$emit("migas-setear-como-inicio", this.$rootMiga);
Event.$emit("categoria-seleccionada", 'nombre', this.searchString);
}
},
mounted: function mounted() {
@ -3113,7 +3133,7 @@ __webpack_require__.r(__webpack_exports__);
},
agregarProducto: function agregarProducto() {
if (this.cant < 0) alert("No se puede agregar cantidades negativas");else if (!Number.isInteger(this.cant)) alert("Las cantidades deben ser números enteros");else {
Event.$emit("sync-subpedido", this.cant, this.producto.id);
this.$settearProducto(this.cant, this.producto.id);
this.cerrar();
}
}
@ -3220,28 +3240,27 @@ __webpack_require__.r(__webpack_exports__);
return {
productos: [],
visible: false,
categoria: null,
paginar: 150
paginar: 150,
valor: null,
filtro: null
};
},
computed: {
miga: function miga() {
return {
nombre: this.categoria,
href: "#" + this.categoria
nombre: this.valor,
href: "#" + this.valor
};
}
},
mounted: function mounted() {
var _this = this;
Event.$on('categoria-seleccionada', function (categoria) {
_this.categoria = categoria;
Event.$on('categoria-seleccionada', function (filtro, valor) {
_this.filtro = filtro;
_this.valor = valor;
axios.get("/api/productos", {
params: {
categoria: _this.categoria,
paginar: _this.paginar
}
params: _this.params(filtro, valor)
}).then(function (response) {
_this.productos = response.data.data;
});
@ -3252,6 +3271,13 @@ __webpack_require__.r(__webpack_exports__);
methods: {
seleccionarProducto: function seleccionarProducto(producto) {
Event.$emit("producto-seleccionado", producto);
},
params: function params(filtro, valor) {
var params = {
paginar: this.paginar
};
params[filtro] = valor;
return params;
}
}
});
@ -3542,7 +3568,7 @@ exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loa
// module
exports.push([module.i, "\np.navbar-item:empty {\n display: none;\n}\n\n", ""]);
exports.push([module.i, "\np.navbar-item:empty {\n display: none;\n}\n@media (max-width: 1023px) {\n.invert-in-burger {\n filter: invert(.5);\n}\n.margin-in-burger {\n margin-left: .75rem;\n margin-right: 1.5rem;\n}\n}\n", ""]);
// exports
@ -3561,7 +3587,7 @@ exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loa
// module
exports.push([module.i, "\n.breadcrumb a {\n\tcolor: #cc0f35;\n}\nnav.breadcrumb.is-fixed-top {\n\tleft: 0;\n\tposition: fixed;\n\tright: 0;\n\tz-index: 30;\n\ttop: 3.25rem;\n\theight: 3.25rem;\n}\n", ""]);
exports.push([module.i, "\n.breadcrumb a {\n\tcolor: #cc0f35;\n}\nnav.breadcrumb.is-fixed-top {\n\tleft: 0;\n\tposition: fixed;\n\tright: 0;\n\ttop: 3.25rem;\n\theight: 3.25rem;\n\tz-index: -10;\n}\n", ""]);
// exports
@ -5047,10 +5073,11 @@ var render = function () {
_c(
"div",
{ staticClass: "columns is-multiline is-mobile" },
_vm._l(_vm.categorias, function (catego) {
_vm._l(_vm.categorias, function (categoria, i) {
return _c(
"div",
{
key: i,
staticClass:
"block column is-one-quarter-desktop is-one-third-tablet is-half-mobile",
},
@ -5062,7 +5089,7 @@ var render = function () {
staticStyle: { height: "100%" },
on: {
"!click": function ($event) {
return _vm.seleccionarCategoria(catego)
return _vm.seleccionarCategoria(categoria)
},
},
},
@ -5078,7 +5105,7 @@ var render = function () {
[
_c("p", {
staticClass: "title is-6",
domProps: { textContent: _vm._s(catego) },
domProps: { textContent: _vm._s(categoria) },
}),
]
),
@ -5466,42 +5493,9 @@ var render = function () {
_c("div", { staticClass: "navbar-brand" }, [
_vm._m(0),
_vm._v(" "),
_c(
"p",
{ staticClass: "navbar-item", staticStyle: { margin: "0 auto" } },
[_vm._t("subpedido")],
2
),
_c("p", { staticClass: "navbar-item" }, [_vm._t("gdc")], 2),
_vm._v(" "),
_c(
"a",
{
staticClass: "navbar-item",
attrs: { href: "#chismosa" },
on: {
"!click": function ($event) {
return _vm.toggleChismosa.apply(null, arguments)
},
},
},
[
_c("img", {
staticStyle: { padding: "0 0.3em" },
attrs: { src: "/assets/chismosa.png", height: "28" },
}),
_vm._v(" "),
_c("p", { staticStyle: { margin: "0 auto", color: "white" } }, [
_vm._v("$ "),
_c("span", {
domProps: {
textContent: _vm._s(
_vm.subpedido == null ? 0 : _vm.subpedido.total
),
},
}),
]),
]
),
_c("p", { staticClass: "navbar-item" }, [_vm._t("subpedido")], 2),
_vm._v(" "),
_c(
"a",
@ -5512,7 +5506,7 @@ var render = function () {
role: "button",
"aria-label": "menu",
"aria-expanded": "false",
"data-target": "navbarBasicExample",
"data-target": "nav-bar",
},
on: { click: _vm.toggleState },
},
@ -5531,31 +5525,108 @@ var render = function () {
{
staticClass: "navbar-menu",
class: { "is-active": _vm.isActive },
attrs: { id: "navbarBasicExample" },
attrs: { id: "nav-bar" },
},
[
_c(
"div",
{ staticClass: "navbar-start has-text-right-mobile" },
[
_c("p", { staticClass: "navbar-item" }, [_vm._t("gdc")], 2),
_vm._v(" "),
_c(
"a",
{
staticClass: "navbar-item",
attrs: {
onclick:
"event.preventDefault();\n document.getElementById('logout-form').submit();",
_c("div", { staticClass: "navbar-end" }, [
_vm.subpedido.id != null
? _c(
"div",
{
staticClass:
"control mt-auto mb-auto has-icons-left margin-in-burger",
},
},
[_vm._v("\n Cerrar sesión\n ")]
),
_vm._v(" "),
_vm._t("logout-form"),
],
2
),
[
_c("input", {
directives: [
{
name: "model",
rawName: "v-model",
value: _vm.searchString,
expression: "searchString",
},
],
staticClass: "input is-small",
attrs: { type: "text", placeholder: "Harina" },
domProps: { value: _vm.searchString },
on: {
keyup: function ($event) {
if (
!$event.type.indexOf("key") &&
_vm._k(
$event.keyCode,
"enter",
13,
$event.key,
"Enter"
)
) {
return null
}
return _vm.buscar.apply(null, arguments)
},
input: function ($event) {
if ($event.target.composing) {
return
}
_vm.searchString = $event.target.value
},
},
}),
_vm._v(" "),
_vm._m(1),
]
)
: _vm._e(),
_vm._v(" "),
_vm.subpedido.id != null
? _c(
"a",
{
staticClass: "navbar-item",
attrs: { href: "#chismosa" },
on: {
"!click": function ($event) {
return _vm.toggleChismosa.apply(null, arguments)
},
},
},
[
_vm._m(2),
_vm._v(" "),
_c("span", {
domProps: {
textContent: _vm._s(
"$" +
(_vm.subpedido == null ? 0 : _vm.subpedido.total)
),
},
}),
]
)
: _vm._e(),
_vm._v(" "),
_c(
"div",
{ staticClass: "block navbar-item" },
[
_c(
"a",
{
staticClass: "button",
attrs: {
onclick:
"event.preventDefault(); document.getElementById('logout-form').submit();",
},
},
[_vm._v("\n Cerrar sesión\n ")]
),
_vm._v(" "),
_vm._t("logout-form"),
],
2
),
]),
]
),
]
@ -5572,6 +5643,29 @@ var staticRenderFns = [
[_c("img", { attrs: { src: "/assets/logoMPS.png", height: "28" } })]
)
},
function () {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c("span", { staticClass: "icon is-small is-left" }, [
_c("i", { staticClass: "fas fa-search" }),
])
},
function () {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c(
"span",
{ staticClass: "icon is-small mr-1", attrs: { id: "chismosa" } },
[
_c("img", {
staticClass: "invert-in-burger",
attrs: { src: "/assets/chismosa.png" },
}),
]
)
},
]
render._withStripped = true
@ -6597,10 +6691,11 @@ var render = function () {
_c(
"div",
{ staticClass: "columns is-multiline is-mobile" },
_vm._l(_vm.productos, function (producto) {
_vm._l(_vm.productos, function (producto, i) {
return _c(
"div",
{
key: i,
staticClass:
"block column is-one-quarter-desktop is-one-third-tablet is-half-mobile",
},
@ -19219,12 +19314,33 @@ var files = __webpack_require__("./resources/js sync recursive \\.vue$/");
files.keys().map(function (key) {
return Vue.component(key.split('/').pop().split('.')[0], files(key)["default"]);
});
/**
* Global data
*/
Vue.prototype.$rootMiga = {
nombre: "Categorías",
href: "/productos"
};
Vue.prototype.$gdc = null;
Vue.prototype.$pedido = {
id: null,
nombre: null,
grupo_de_compra_id: null,
created_at: null,
updated_at: null
};
Vue.prototype.$settearProducto = function (cantidad, id) {
Event.$emit("sync-subpedido", this.cant, this.producto.id);
};
/**
* Next, we will create a fresh Vue application instance and attach it to
* the page. Then, you may begin adding components to this application
* or customize the JavaScript scaffolding to fit your unique needs.
*/
var app = new Vue({
el: '#root'
});

4
resources/js/app.js vendored
View File

@ -24,6 +24,10 @@ files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(
/**
* Global data
*/
Vue.prototype.$rootMiga = {
nombre: "Categorías",
href: "/productos"
}
Vue.prototype.$gdc = null
Vue.prototype.$pedido = {
id: null,

View File

@ -1,12 +1,12 @@
<template>
<div v-show="visible" class="container">
<div class="columns is-multiline is-mobile">
<div v-for="catego in categorias" class="block column is-one-quarter-desktop is-one-third-tablet is-half-mobile">
<div @click.capture="seleccionarCategoria(catego)" class="card" style="height:100%" >
<div v-for="(categoria,i) in categorias" :key="i" class="block column is-one-quarter-desktop is-one-third-tablet is-half-mobile">
<div @click.capture="seleccionarCategoria(categoria)" class="card" style="height:100%" >
<div class="card-content">
<div class="media">
<div class="media-content" style="overflow:hidden">
<p class="title is-6" v-text="catego"></p>
<p class="title is-6" v-text="categoria"></p>
</div>
</div>
</div>
@ -22,22 +22,20 @@
return {
categorias: null,
visible: true,
miga: {
nombre: "Categorías",
href: "/productos"
}
miga: this.$rootMiga
}
},
mounted() {
axios.get("/api/categorias").then(response => {
this.categorias = response.data;
});
Event.$emit("migas-setear-como-inicio",this.miga);
Event.$emit("migas-setear-como-inicio", this.miga);
Event.$on("categoria-seleccionada", (_) => this.visible = false)
},
methods: {
seleccionarCategoria(categoria) {
this.visible = false;
Event.$emit("categoria-seleccionada",categoria);
Event.$emit("categoria-seleccionada",'categoria',categoria);
}
}
}

View File

@ -23,7 +23,7 @@
<div id="nav-bar" class="navbar-menu" :class="{'is-active':isActive}">
<div class="navbar-end">
<div v-if="subpedido.id != null" class="control mt-auto mb-auto has-icons-left margin-in-burger">
<input class="input is-small" type="text" placeholder="Harina" :v-model="searchString">
<input class="input is-small" type="text" placeholder="Harina" v-model="searchString" @keyup.enter="buscar" >
<span class="icon is-small is-left">
<i class="fas fa-search"></i>
</span>
@ -69,7 +69,8 @@
Event.$emit("toggle-chismosa")
},
buscar() {
Event.$emit("buscar-productos",this.searchString)
Event.$emit("migas-setear-como-inicio", this.$rootMiga)
Event.$emit("categoria-seleccionada",'nombre',this.searchString)
}
},
mounted() {

View File

@ -1,7 +1,7 @@
<template>
<div v-show="visible" 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 v-for="(producto,i) in productos" :key="i" class="block column is-one-quarter-desktop is-one-third-tablet is-half-mobile">
<div @click.capture="seleccionarProducto(producto)" class="card" style="height:100%">
<div class="card-image">
<figure class="image is-4by3">
@ -30,32 +30,30 @@
</template>
<script>
export default {
data() {
export default {
data() {
return {
productos: [],
visible: false,
categoria: null,
paginar: 150
paginar: 150,
valor: null,
filtro: null
}
},
computed: {
miga: function(){
return {
nombre: this.categoria,
href: "#" + this.categoria
nombre: this.valor,
href: "#" + this.valor
}
}
},
mounted() {
Event.$on('categoria-seleccionada', (categoria) => {
this.categoria = categoria;
Event.$on('categoria-seleccionada', (filtro,valor) => {
this.filtro = filtro
this.valor = valor
axios.get("/api/productos", {
params: {
categoria: this.categoria,
paginar: this.paginar
}
params: this.params(filtro,valor)
}).then(response => {
this.productos = response.data.data;
});
@ -66,7 +64,12 @@
methods: {
seleccionarProducto(producto) {
Event.$emit("producto-seleccionado",producto);
}
},
params: function(filtro,valor) {
let params = {paginar: this.paginar}
params[filtro] = valor
return params
}
}
}
</script>