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

Compare commits

base: nathalie:faa947e6a78c4db6eeb7ed02d9f2b7cdcd79a3f7
Branches Tags
nathalie:master
nathalie:funcion/refactor-general
nathalie:funcion/saldos
nathalie:backup-90
..
compare: nathalie:80b5dc60acaa906294ecda164a5be472d9210e03
Branches Tags
nathalie:funcion/refactor-general
nathalie:funcion/saldos
nathalie:master
nathalie:backup-90

5 commits
faa947e6a7 ... 80b5dc60ac

Author SHA1 Message Date
ale
80b5dc60ac Agregado LoginDropdown a pantalla de login 2025-06-14 12:11:05 -03:00
ale
517e5203c9 Agregado LoginDropdown.vue con opciones de login según urlRol 2025-06-14 12:10:41 -03:00
ale
dbdb97a78e Eliminados métodos no usados y agregado método para opciones de login segun urlRol 2025-06-14 12:10:20 -03:00
ale
79bdb04ce2 Espacios 2025-06-14 12:09:54 -03:00
ale
3503be8e56 Eliminados componentes no usados 2025-06-14 12:09:38 -03:00
11 changed files with 90 additions and 279 deletions
Show stats Expand all files Collapse all files

4
resources/js/components/AppLogin.vue
View file

@ -2,10 +2,11 @@
import LoginInput from "./login/LoginInput.vue";
import LoginLoginTitulos from "./login/LoginTitulos.vue";
import { mapGetters } from "vuex";
import LoginDropdown from "./login/LoginDropdown.vue";
export default {
name: 'LoginForm',
components: { LoginTitulos: LoginLoginTitulos, LoginInput },
components: { LoginDropdown, LoginTitulos: LoginLoginTitulos, LoginInput },
computed: {
...mapGetters("login", ["estilos"])
}
@ -15,6 +16,7 @@ export default {
<template>
<div id="login-form" :class="estilos.fondo">
<section class="section">
<login-dropdown class="is-hidden-tablet"></login-dropdown>
<login-titulos></login-titulos>
<login-input></login-input>
</section>

12
resources/js/components/admin/BotonLogin.vue
View file

@ -1,12 +0,0 @@
<template>
<div class="buttons is-right">
<a class="button is-danger is-light is-small" href="/admin">
<span class="icon">
<i class="fa fa-solid fa-user-check"></i>
</span>
<span>
Admin
</span>
</a>
</div>
</template>

5
resources/js/components/admin/DropdownDescargar.vue
View file

@ -38,10 +38,9 @@ export default {
};
},
computed: {
...mapState('admin',["grupo_de_compra_id"]),
...mapGetters('admin',["hayAprobados"]),
...mapState('admin', ["grupo_de_compra_id"]),
...mapGetters('admin', ["hayAprobados"]),
},
}
</script>

52
resources/js/components/compras/Login.vue
View file

@ -1,52 +0,0 @@
<template>
<div class="block">
<div class="field">
<label class="label">Usuario</label>
<div class="field">
<div class="control">
<input required class="input" type="text" name="name" placeholder="Usuario">
</div>
</div>
</div>
<div class="field">
<label class="label">Contraseña</label>
<div class="field has-addons">
<div class="control">
<input required class="input" :type="this.passwordType" name="password" placeholder="Contraseña">
</div>
<div class="control">
<a class="button is-dark" @click="togglePassword">
{{ (passwordVisible ? 'Ocultar' : 'Mostrar') + ' contraseña'}}
</a>
</div>
</div>
</div>
<div class="field">
<div class="control">
<input type="submit" class="button is-dark" value="Ingresar"/>
</div>
</div>
</div>
</template>
<script>
export default {
name: "LoginAdmin",
data() {
return {
passwordVisible: false,
passwordType: "password",
}
},
methods: {
togglePassword() {
if (this.passwordVisible) this.passwordType = "password";
else this.passwordType = "text"
this.passwordVisible = !this.passwordVisible
}
}
}
</script>
<style>
</style>

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

@ -1,46 +0,0 @@
<template>
<div v-if="region_elegida" class="block">
<div class="field">
<label class="label" :class="adminUrl ? 'has-text-white' : ''">
Seleccioná tu barrio o grupo de compra
</label>
<div class="control">
<div class="select">
<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>
</div>
</div>
</div>
</template>
<script>
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',["adminUrl"]),
},
data() {
return {
barrio: null,
};
},
}
</script>

57
resources/js/components/comunes/Login.vue
View file

@ -1,57 +0,0 @@
<template>
<div v-if="grupo_de_compra_elegido" class="block">
<div class="field">
<label class="label"
:class="adminUrl ? 'has-text-white' : ''">{{ mensajes.mensaje }}</label>
<div class="field has-addons">
<div class="control">
<input required class="input" :type="this.passwordType" name="password" :placeholder="mensajes.mensaje">
</div>
<div class="control">
<a class="button is-warning" @click="togglePassword">
{{ (passwordVisible ? 'Ocultar' : 'Mostrar') + ' contraseña'}}
</a>
</div>
</div>
<p class="help"
:class="adminUrl ? 'has-text-white' : ''">{{ mensajes.ayuda }}</p>
</div>
<div class="field">
<div class="control">
<input type="submit" class="button is-warning" value="Log in"/>
</div>
</div>
</div>
</template>
<script>
import { mapGetters, mapState } from "vuex";
export default {
name: 'Login',
data() {
return {
passwordVisible: false,
passwordType: "password",
}
},
computed: {
...mapState('login',["grupo_de_compra_elegido"]),
...mapGetters('login',["adminUrl","mensajes"]),
},
methods: {
togglePassword() {
if (this.passwordVisible) this.passwordType = "password";
else this.passwordType = "text"
this.passwordVisible = !this.passwordVisible
}
}
}
</script>
<style>
.help {
font-size: 1rem;
}
</style>

35
resources/js/components/comunes/LoginForm.vue
View file

@ -1,35 +0,0 @@
<template>
<div class="block">
<barrio-select></barrio-select>
<login></login>
<input readonly v-model="nombre" type="hidden" name="name">
</div>
</template>
<script>
import {mapActions, mapGetters, mapState} from "vuex";
import BarrioSelect from "./BarrioSelect.vue";
import Login from "./Login.vue";
export default {
components: {
BarrioSelect,
Login,
},
async mounted() {
await this.getRegiones();
},
computed: {
...mapGetters('login',["adminUrl"]),
...mapState('login',["grupo_de_compra_elegido"]),
nombre() {
return `${this.grupo_de_compra_elegido}${this.adminUrl ? '_admin' : ''}`;
}
},
methods: {
...mapActions('login',["getRegiones"]),
},
}
</script>
<style scoped></style>

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

@ -1,45 +0,0 @@
<template>
<div class="block">
<div class="field">
<label class="label" :class="adminUrl ? 'has-text-white' : ''">
Seleccioná tu región
</label>
<div class="control">
<div class="select">
<select @change="selectRegion({ region })" v-model="region">
<option :disabled="region_elegida" value=null>
Seleccionar
</option>
<option v-for="(region, index) in regiones"
:key="index"
v-text="region"
:name="region">
</option>
</select>
</div>
</div>
</div>
</div>
</template>
<script>
import {mapActions, mapGetters, mapState} from "vuex";
export default {
name: 'RegionSelect',
async mounted() {
await this.getRegiones();
},
data() {
return {
region: null,
};
},
methods: {
...mapActions('login',["getRegiones","selectRegion"]),
},
computed: {
...mapState('login',["regiones","region_elegida"]),
...mapGetters('login',["adminUrl"]),
}
}
</script>

48
resources/js/components/login/LoginDropdown.vue Normal file
View file

@ -0,0 +1,48 @@
<script>
import { mapGetters } from "vuex";
export default {
name: "LoginDropdown",
computed: {
...mapGetters("login", ["opcionesLogin", "estilos"])
},
data() {
return {
dropdownActivo: false
};
},
}
</script>
<template>
<div class="buttons is-right">
<div class="dropdown" :class="{'is-active': dropdownActivo}" @mouseleave="dropdownActivo = false">
<div class="dropdown-trigger">
<button class="button"
aria-haspopup="true"
aria-controls="dropdown-menu"
type="button"
@click="dropdownActivo = !dropdownActivo">
<span class="icon is-small">
<i class="fa fa-solid fa-user-check"></i>
</span>
<span>Cambiar login</span>
<span class="icon is-small">
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
<div class="dropdown-menu" role="menu">
<div class="dropdown-content">
<a class="dropdown-item" v-for="opcion in opcionesLogin" :href="opcion.href">
{{ opcion.nombre }}
</a>
</div>
</div>
</div>
</div>
</template>
<style scoped>
</style>

21
resources/js/components/login/LoginTitulos.vue
View file

@ -1,8 +1,10 @@
<script>
import { mapGetters } from "vuex";
import LoginDropdown from "./LoginDropdown.vue";
export default {
name: "LoginTitulos",
components: { LoginDropdown },
computed: {
...mapGetters("login", ["textos", "estilos"]),
}
@ -10,12 +12,19 @@ export default {
</script>
<template>
<div class="block">
<h1 class="title" :class="estilos.texto">{{ textos.titulo }}</h1>
<p class="subtitle" :class="estilos.texto">
{{ `Bienvenidx a la ${textos.subtitlo} del ` }}
<strong :class="estilos.texto">Mercado Popular de Subistencia</strong>
</p>
<div class="columns">
<div class="column">
<div class="block">
<h1 class="title" :class="estilos.texto">{{ textos.titulo }}</h1>
<p class="subtitle" :class="estilos.texto">
{{ `Bienvenidx a la ${textos.subtitlo} del ` }}
<strong :class="estilos.texto">Mercado Popular de Subistencia</strong>
</p>
</div>
</div>
<div class="column is-2 is-hidden-mobile">
<login-dropdown></login-dropdown>
</div>
</div>
</template>

44
resources/js/store/modules/login.js vendored
View file

@ -40,15 +40,6 @@ const actions = {
};
const getters = {
adminUrl() {
return window.location.pathname.startsWith('/admin');
},
mensajes() {
return {
mensaje: `Contraseña de ${getters.adminUrl() ? 'administración ' : ''}del barrio`,
ayuda: `Si no la sabés, consultá a ${getters.adminUrl() ? 'la comisión informática ' : 'tus compañerxs'}.`
};
},
urlRol() {
let split = window.location.pathname
.replace('login', '')
@ -56,19 +47,6 @@ const getters = {
.filter(x => x.length);
return split[0] ?? 'pedido';
},
titulos() {
let rol = getters.urlRol();
switch (rol) {
case 'admin':
return { titulo: "Administración de Pedidos MPS", subtitlo: "administración de pedidos" };
case 'compras':
return { titulo: "Comisiones MPS", subtitlo: "página de comisiones" };
case 'pedido':
return { titulo: "Pedidos MPS", subtitlo: "aplicación de pedidos" };
default:
throw new Error("Url inválida");
}
},
textos() {
let rol = getters.urlRol();
switch (rol) {
@ -125,6 +103,28 @@ const getters = {
throw new Error("Url inválida");
}
},
opcionesLogin() {
let rol = getters.urlRol();
switch (rol) {
case 'admin':
return [
{ nombre: "Pedidos", href: "/" },
{ nombre: "Compras", href: "/compras" }
];
case 'compras':
return [
{ nombre: "Pedidos", href: "/" },
{ nombre: "Administración", href: "/admin" }
];
case 'pedido':
return [
{ nombre: "Administración", href: "/admin" },
{ nombre: "Compras", href: "/compras" }
];
default:
throw new Error("Url inválida");
}
},
nombre() {
return `${state.grupo_de_compra_elegido}${ getters.urlRol() === 'admin' ? '_admin' : ''}`;
}