nathalie/pedi2
3
3
Fork 1
Code Issues Pull requests 1 Projects Releases Wiki Activity

BarrioSelect y RegionSelect usan la store

Browse source
This commit is contained in:
Alejandro Tasistro 2025-05-19 03:05:06 -03:00
parent fe292802cd
commit fe57e8c6b3
2 changed files with 62 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
resources/js/components/comunes/BarrioSelect.vue
View file

@ -1,13 +1,19 @@
<template>
<div v-show="visible" class="block">
<div v-if="region_elegida !== null" class="block">
<div class="field">
<label class="label" :class="isAdmin ? 'has-text-white' : ''">Seleccioná tu barrio o grupo de compra</label>
<label class="label" :class="admin ? 'has-text-white' : ''">
Seleccioná tu barrio o grupo de compra
</label>
<div class="control">
<div class="select">
<select @change="onGDCSelected" v-model="gdc" name="name">
<option :disabled="isDefaultDisabled==1" value=null>Seleccionar</option>
<option v-for="(gdc, index) in gdcs" :key="index" v-text="gdc.nombre + (isAdmin ? '_admin' : '')"
:name="gdc.nombre + (isAdmin ? '_admin' : '')">
<select @change="selectGrupoDeCompra({ grupo_de_compra: barrio })" v-model="barrio">
<option :disabled="grupo_de_compra_elegido !== null" value=null>
Seleccionar
</option>
<option v-for="(gdc, index) in grupos_de_compra"
:key="index"
v-text="gdc.nombre"
:name="gdc.nombre">
</option>
</select>
</div>
@ -17,35 +23,24 @@
</template>
<script>
export default {
data() {
return {
visible: false,
region: null,
gdcs: [],
isDefaultDisabled: 0,
gdc: null,
isAdmin: this.admin == null ? false : this.admin
}
},
mounted() {
Event.$on('region-seleccionada', (region)=> {
this.region = region;
this.fillGDC(region);
this.visible = true;
});
},
methods : {
fillGDC(region) {
axios.get("/api/grupos-de-compra").then(response => {
this.gdcs = response.data[this.region];
});
},
onGDCSelected() {
this.isDefaultDisabled = 1;
Event.$emit("gdc-seleccionado",this.gdc);
}
},
props: {'admin': Boolean}
}
import { mapActions, mapGetters, mapMutations, mapState } from "vuex";
export default {
name: 'BarrioSelect',
async mounted() {
await this.getRegiones();
},
methods: {
...mapMutations('login',["selectGrupoDeCompra"]),
...mapActions('login',["getRegiones", "getGruposDeCompra"]),
},
computed: {
...mapState('login',["region_elegida","grupos_de_compra","grupo_de_compra_elegido"]),
...mapGetters('login',["admin"]),
},
data() {
return {
barrio: null,
};
},
}
</script>

54
resources/js/components/comunes/RegionSelect.vue
View file

@ -1,12 +1,20 @@
<template>
<div class="block">
<div class="field">
<label class="label" :class="whiteText ? 'has-text-white' : ''">Seleccioná tu región</label>
<label class="label" :class="admin ? 'has-text-white' : ''">
Seleccioná tu región
</label>
<div class="control">
<div class="select">
<select @change="onRegionSelected" v-model="region">
<option :disabled="isDefaultDisabled===1" value=null>Seleccionar</option>
<option v-for="(region, index) in regiones" :key="index" v-text="region" :name="region"></option>
<select @change="selectRegion({ region })" v-model="region">
<option :disabled="region_elegida !== null" value=null>
Seleccionar
</option>
<option v-for="(region, index) in regiones"
:key="index"
v-text="region"
:name="region">
</option>
</select>
</div>
</div>
@ -15,24 +23,22 @@
</template>
<script>
export default {
data() {
return {
regiones: [],
isDefaultDisabled: 0,
region: null,
whiteText: this.admin == null ? false : this.admin
}
},
mounted() {
axios.get("/api/regiones").then(response => this.regiones = response.data);
},
methods: {
onRegionSelected() {
this.isDefaultDisabled = 1;
Event.$emit("region-seleccionada",this.region);
}
},
props: {'admin': Boolean}
}
import {mapActions, mapGetters, mapState} from "vuex";
export default {
async mounted() {
await this.getRegiones();
},
data() {
return {
region: null,
};
},
methods: {
...mapActions('login',["getRegiones","selectRegion"]),
},
computed: {
...mapState('login',["regiones","region_elegida"]),
...mapGetters('login',["admin"]),
}
}
</script>