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

Compare commits

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

9 commits
1b920093c4 ... faa947e6a7

Author SHA1 Message Date
ale
faa947e6a7 Eliminadas admin_login y compras_login, usando login genérico 2025-06-13 19:33:17 -03:00
ale
fdd3232345 Usando componente genérico de login en las tres views de auth 2025-06-13 19:28:15 -03:00
ale
b72fc57b8d Componente genérico para login 2025-06-13 19:28:02 -03:00
ale
3cb27c5c30 Cambios de estilo para compras 2025-06-13 19:27:47 -03:00
ale
b4458862f4 Renombrado 2025-06-13 19:27:15 -03:00
ale
7a4aa6d7a0 Agregado height:100% a form 2025-06-13 19:26:59 -03:00
ale
0637b7a208 Agregado getter para nombre 2025-06-13 19:12:36 -03:00
ale
af8879eadd Agregados métodos para obtener textos y estilos de las diferentes pantallas de login 2025-06-13 18:33:55 -03:00
ale
9e93b914ac Agregada altura 100% a html, body y #root 2025-06-13 18:33:34 -03:00
17 changed files with 363 additions and 99 deletions
Show stats Expand all files Collapse all files

2
app/Http/Controllers/AdminController.php
View file

@ -9,7 +9,7 @@ class AdminController extends Controller
{
public function show()
{
return view('auth/admin_login');
return view('auth/login');
}
public function index() {

2
app/Http/Controllers/ComprasController.php
View file

@ -37,7 +37,7 @@ class ComprasController
public function show()
{
return view('auth/compras_login');
return view('auth/login');
}
public function cargarCanasta(Request $request): JsonResponse

26
resources/js/components/AppLogin.vue Normal file
View file

@ -0,0 +1,26 @@
<script>
import LoginInput from "./login/LoginInput.vue";
import LoginLoginTitulos from "./login/LoginTitulos.vue";
import { mapGetters } from "vuex";
export default {
name: 'LoginForm',
components: { LoginTitulos: LoginLoginTitulos, LoginInput },
computed: {
...mapGetters("login", ["estilos"])
}
}
</script>
<template>
<div id="login-form" :class="estilos.fondo">
<section class="section">
<login-titulos></login-titulos>
<login-input></login-input>
</section>
</div>
</template>
<style scoped>
</style>

24
resources/js/components/login/LoginInput.vue Normal file
View file

@ -0,0 +1,24 @@
<script>
import { mapGetters } from "vuex";
import BarrioLogin from "./input/BarrioLogin.vue";
import UserLogin from "./input/UserLogin.vue";
export default {
name: "LoginInput",
components: { UserLogin, BarrioLogin },
computed: {
...mapGetters("login", ["urlRol"]),
},
}
</script>
<template>
<div>
<user-login v-if="urlRol === 'compras'"></user-login>
<barrio-login v-else></barrio-login>
</div>
</template>
<style scoped>
</style>

24
resources/js/components/login/LoginTitulos.vue Normal file
View file

@ -0,0 +1,24 @@
<script>
import { mapGetters } from "vuex";
export default {
name: "LoginTitulos",
computed: {
...mapGetters("login", ["textos", "estilos"]),
}
};
</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>
</template>
<style scoped>
</style>

27
resources/js/components/login/Titulos.vue
View file

@ -1,27 +0,0 @@
<script>
import { mapGetters } from "vuex";
export default {
name:'LoginTitulos',
computed: {
...mapGetters('login',["titulos", "urlRol"]),
whiteText() {
console.log(this.urlRol);
return this.urlRol === 'admin';
}
}
};
</script>
<template>
<div class="block">
<h1 class="title" :class="{'has-text-white': whiteText}">{{ titulos.titulo }}</h1>
<p class="subtitle" :class="{'has-text-white': whiteText}">
{{ `Bienvenidx a la ${titulos.subtitlo} del ` }}<strong :class="{'has-text-white': whiteText}">Mercado Popular de Subistencia</strong>
</p>
</div>
</template>
<style scoped>
</style>

26
resources/js/components/login/input/BarrioLogin.vue Normal file
View file

@ -0,0 +1,26 @@
<script>
import { defineComponent } from "vue";
import RegionSelect from "./barrio/RegionSelect.vue";
import BarrioSelect from "./barrio/BarrioSelect.vue";
import { mapActions } from "vuex";
export default defineComponent({
components: { BarrioSelect, RegionSelect },
methods: {
...mapActions("login", ["getRegiones"]),
},
async mounted() {
await this.getRegiones();
},
})
</script>
<template>
<div class="block">
<region-select></region-select>
<barrio-select></barrio-select>
</div>
</template>
<style scoped>
</style>

65
resources/js/components/login/input/PasswordInput.vue Normal file
View file

@ -0,0 +1,65 @@
<template>
<div class="block">
<div class="field">
<label class="label" :class="estilos.texto">
{{ textos.password }}
</label>
<div class="field has-addons">
<div class="control">
<input required
class="input"
:type="passwordType"
name="password"
:placeholder="textos.password">
</div>
<div class="control">
<a class="button" :class="estilos.botones" @click="togglePassword">
{{ textoBotonPassword }}
</a>
</div>
</div>
<p class="help"
:class="estilos.texto">
{{ textos.ayuda }}
</p>
</div>
<div class="field">
<div class="control">
<input type="submit" class="button" :class="estilos.botones" value="Log in"/>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from "vuex";
export default {
name: 'PasswordInput',
data() {
return {
passwordVisible: false,
passwordType: "password",
}
},
computed: {
...mapGetters("login", ["textos", "estilos"]),
textoBotonPassword() {
return `${this.passwordVisible ? "Ocultar" : "Mostrar"} contraseña`;
}
},
methods: {
togglePassword() {
this.passwordType = this.passwordVisible ? "password" : "text";
this.passwordVisible = !this.passwordVisible;
}
}
}
</script>
<style>
.help {
font-size: 1rem;
}
</style>

19
resources/js/components/login/input/UserLogin.vue Normal file
View file

@ -0,0 +1,19 @@
<script>
import { defineComponent } from "vue";
import PasswordInput from "./PasswordInput.vue";
import UserInput from "./user/UserInput.vue";
export default defineComponent({
components: { UserInput, PasswordInput }
})
</script>
<template>
<div class="block">
<user-input></user-input>
<password-input></password-input>
</div>
</template>
<style scoped>
</style>

47
resources/js/components/login/input/barrio/BarrioSelect.vue Normal file
View file

@ -0,0 +1,47 @@
<template>
<div v-if="region_elegida" class="block">
<div class="field">
<label class="label" :class="estilos.texto">
Seleccioná tu barrio o grupo de compra
</label>
<div class="control">
<div class="select">
<select v-model="barrio"
@change="selectGrupoDeCompra({ grupo_de_compra: barrio })">
<option :disabled="grupo_de_compra_elegido" 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>
<password-input v-if="grupo_de_compra_elegido"></password-input>
<input readonly v-model="nombre" type="hidden" name="name">
</div>
</template>
<script>
import { mapGetters, mapMutations, mapState } from "vuex";
import PasswordInput from "../PasswordInput.vue";
export default {
name: 'BarrioSelect',
components: { PasswordInput },
methods: {
...mapMutations("login", ["selectGrupoDeCompra"]),
},
computed: {
...mapState("login", ["region_elegida", "grupos_de_compra", "grupo_de_compra_elegido"]),
...mapGetters("login", ["urlRol", "estilos", "nombre"]),
},
data() {
return {
barrio: null,
};
},
}
</script>

43
resources/js/components/login/input/barrio/RegionSelect.vue Normal file
View file

@ -0,0 +1,43 @@
<template>
<div class="field">
<label class="label" :class="estilos.texto">
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>
</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", ["estilos"]),
}
}
</script>

20
resources/js/components/login/input/user/UserInput.vue Normal file
View file

@ -0,0 +1,20 @@
<script>
export default {
name: "UserInput",
}
</script>
<template>
<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>
</template>
<style scoped>
</style>

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

@ -69,7 +69,65 @@ const getters = {
throw new Error("Url inválida");
}
},
textos() {
let rol = getters.urlRol();
switch (rol) {
case 'admin':
return {
titulo: "Administración de Pedidos MPS",
subtitlo: "administración de pedidos",
password: "Contraseña de administración del barrio",
ayuda: "Si no la sabés, consultá a la comisión informática",
label: "Seleccioná tu región"
};
case 'compras':
return {
titulo: "Comisiones MPS",
subtitlo: "página de comisiones",
password: "Contraseña del barrio",
ayuda: "Si no la sabés, consultá a tus compañerxs",
label: "Usuario"
};
case 'pedido':
return {
titulo: "Pedidos MPS",
subtitlo: "aplicación de pedidos",
password: "Contraseña",
ayuda: "Si no la sabés, consultá a la comisión informática",
label: "Seleccioná tu región"
};
default:
throw new Error("Url inválida");
}
},
estilos() {
let rol = getters.urlRol();
switch (rol) {
case 'admin':
return {
fondo: "has-background-danger",
texto: "has-text-white",
botones: "is-warning",
};
case 'compras':
return {
fondo: "has-background-warning",
texto: "",
botones: "is-dark"
};
case 'pedido':
return {
fondo: "",
texto: "",
botones: "is-danger"
};
default:
throw new Error("Url inválida");
}
},
nombre() {
return `${state.grupo_de_compra_elegido}${ getters.urlRol() === 'admin' ? '_admin' : ''}`;
}
};
export default {

5
resources/sass/app.scss vendored
View file

@ -10,6 +10,11 @@
html, body {
overflow-x: hidden;
max-width: 100%;
height: 100%;
}
form, #root, #login-form {
height: 100%;
}
main.has-top-padding {

28
resources/views/auth/admin_login.blade.php
View file

@ -1,28 +0,0 @@
<!DOCTYPE html>
<html class="has-background-danger" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ config('app.name', 'Pedidos del MPS') }}</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
<link rel="stylesheet" href="{{ mix('css/app.css') }}">
</head>
<body>
<section class="section">
<div id="root" class="container">
<login-titulos></login-titulos>
@error('name')
<div class="notification is-warning">
Contraseña incorrecta, intentalo nuevamente.
</div>
@enderror
<comunes-region-select></comunes-region-select>
<form method="post" action="/login">
@csrf
<comunes-login-form></comunes-login-form>
</form>
</div>
</section>
<script src="{{ mix('js/app.js') }}" defer></script>
</body>
</html>

28
resources/views/auth/compras_login.blade.php
View file

@ -1,28 +0,0 @@
<!DOCTYPE html>
<html class="has-background-warning" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ config('app.name', 'Pedidos del MPS') }}</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
<link rel="stylesheet" href="{{ mix('css/app.css') }}">
<script src="https://kit.fontawesome.com/9235d1c676.js" crossorigin="anonymous"></script>
</head>
<body>
<section class="section">
<div id="root" class="container">
<login-titulos></login-titulos>
@error('name')
<div class="notification is-danger">
Contraseña incorrecta, intentalo nuevamente.
</div>
@enderror
<form method="post" action="/login">
@csrf
<compras-login></compras-login>
</form>
</div>
</section>
<script src="{{ mix('js/app.js') }}" defer></script>
</body>
</html>

16
resources/views/auth/login.blade.php
View file

@ -9,22 +9,12 @@
<script src="https://kit.fontawesome.com/9235d1c676.js" crossorigin="anonymous"></script>
</head>
<body>
<section class="section">
<div id="root" class="container">
<admin-boton-login></admin-boton-login>
<login-titulos></login-titulos>
@error('name')
<div class="notification is-danger">
Contraseña incorrecta, intentalo nuevamente.
</div>
@enderror
<comunes-region-select></comunes-region-select>
<div id="root">
<form method="post" action="/login">
@csrf
<comunes-login-form></comunes-login-form>
<app-login></app-login>
</form>
</div>
</section>
<script src="{{ mix('js/app.js') }}" defer></script>
<script src="{{ mix('js/app.js') }}" defer></script>
</body>
</html>