| @ -0,0 +1,170 @@ | |||
| package mx.gob.jumapacelaya.views.login; | |||
| import com.vaadin.flow.component.Key; | |||
| import com.vaadin.flow.component.button.Button; | |||
| import com.vaadin.flow.component.button.ButtonVariant; | |||
| import com.vaadin.flow.component.dependency.CssImport; | |||
| import com.vaadin.flow.component.html.H2; | |||
| import com.vaadin.flow.component.html.Image; | |||
| import com.vaadin.flow.component.icon.VaadinIcon; | |||
| import com.vaadin.flow.component.notification.Notification; | |||
| import com.vaadin.flow.component.notification.NotificationVariant; | |||
| import com.vaadin.flow.component.orderedlayout.HorizontalLayout; | |||
| import com.vaadin.flow.component.orderedlayout.VerticalLayout; | |||
| import com.vaadin.flow.component.textfield.PasswordField; | |||
| import com.vaadin.flow.component.textfield.TextField; | |||
| import com.vaadin.flow.router.BeforeEnterEvent; | |||
| import com.vaadin.flow.router.BeforeEnterObserver; | |||
| import com.vaadin.flow.router.PageTitle; | |||
| import com.vaadin.flow.router.Route; | |||
| import com.vaadin.flow.server.auth.AnonymousAllowed; | |||
| import jakarta.servlet.ServletException; | |||
| import jakarta.servlet.http.HttpServletRequest; | |||
| import org.springframework.beans.factory.annotation.Autowired; | |||
| import java.util.regex.Pattern; | |||
| @Route("iniciarSesion") | |||
| @PageTitle("IniciarSesion") | |||
| @AnonymousAllowed | |||
| @CssImport("./themes/soportet.iv1.2/styles.css") | |||
| public class Login extends VerticalLayout implements BeforeEnterObserver { | |||
| private final HttpServletRequest request; | |||
| @Autowired | |||
| public Login(HttpServletRequest request) { | |||
| this.request = request; | |||
| addClassName("login-rich-content"); | |||
| setSizeFull(); | |||
| setAlignItems(Alignment.CENTER); | |||
| setJustifyContentMode(JustifyContentMode.CENTER); | |||
| setPadding(false); | |||
| HorizontalLayout mainLayout = new HorizontalLayout(); | |||
| mainLayout.setSizeFull(); | |||
| mainLayout.setPadding(false); | |||
| mainLayout.setMargin(false); | |||
| Image logo = new Image("images/bckgndNvo.png", "Fondo Nvo color"); | |||
| logo.addClassName("login-logo"); | |||
| Pattern emailPattern = Pattern.compile("^[\\w\\.-]+@[\\w\\.-]+\\.[a-z]{2,}$", Pattern.CASE_INSENSITIVE); | |||
| H2 title = new H2("Mesa de Ayuda JUMAPA Celaya"); | |||
| title.getStyle().set("width", "90%"); | |||
| title.getStyle().set("margin-top", "10px"); | |||
| title.getStyle().set("color", "#691b31"); | |||
| Button loginButton = new Button("Iniciar Sesión", VaadinIcon.SIGN_IN.create()); | |||
| loginButton.addThemeVariants(ButtonVariant.LUMO_PRIMARY); | |||
| loginButton.getStyle().set("width", "80%"); | |||
| loginButton.addClickShortcut(Key.ENTER); | |||
| TextField username = new TextField("Usuario"); | |||
| username.getStyle().set("width", "80%"); | |||
| username.addValueChangeListener(event -> { | |||
| String value = event.getValue(); | |||
| if (emailPattern.matcher(value).matches()) { | |||
| username.setInvalid(true); | |||
| username.setErrorMessage("No se permite ingresar un correo electrónico, solo nombres de usuario"); | |||
| loginButton.setEnabled(false); | |||
| } else { | |||
| username.setInvalid(false); | |||
| username.setErrorMessage(null); | |||
| loginButton.setEnabled(true); | |||
| } | |||
| }); | |||
| username.setClearButtonVisible(true); | |||
| username.setRequired(true); | |||
| username.setInvalid(false); | |||
| PasswordField password = new PasswordField("Contraseña"); | |||
| password.getStyle().set("width", "80%"); | |||
| password.setRequired(true); | |||
| VerticalLayout fieldLayout = new VerticalLayout(); | |||
| fieldLayout.add(title, username, password, loginButton); | |||
| fieldLayout.setAlignItems(Alignment.CENTER); | |||
| fieldLayout.setJustifyContentMode(JustifyContentMode.CENTER); | |||
| fieldLayout.setPadding(true); | |||
| fieldLayout.getStyle().set("background-color", "#ddc9a3"); | |||
| fieldLayout.getStyle().set("border-radius", "30px"); | |||
| fieldLayout.getStyle().set("height", "300px"); | |||
| fieldLayout.getStyle().set("width", "300px"); | |||
| VerticalLayout formContainer = new VerticalLayout(); | |||
| Image imageLogin = new Image("images/JUMAPA_NVO.png", "logo"); | |||
| imageLogin.setWidth("300px"); | |||
| formContainer.add(imageLogin, fieldLayout); | |||
| formContainer.setSizeUndefined(); | |||
| formContainer.setPadding(true); | |||
| formContainer.setMargin(false); | |||
| formContainer.setAlignItems(Alignment.CENTER); | |||
| formContainer.setJustifyContentMode(JustifyContentMode.CENTER); | |||
| formContainer.getElement().getThemeList().add("dark"); | |||
| mainLayout.add(formContainer, logo); | |||
| mainLayout.setFlexGrow(1, formContainer); | |||
| mainLayout.setFlexGrow(2, logo); | |||
| loginButton.addClickListener(e -> { | |||
| boolean valid = true; | |||
| if (username.isEmpty()) { | |||
| username.setInvalid(true); | |||
| valid = false; | |||
| } else { | |||
| username.setInvalid(false); | |||
| } | |||
| if (password.isEmpty()) { | |||
| password.setInvalid(true); | |||
| valid = false; | |||
| } else { | |||
| password.setInvalid(false); | |||
| } | |||
| if (!valid) { | |||
| Notification notification = new Notification("Por favor, completa todos los campos requeridos."); | |||
| notification.addThemeVariants(NotificationVariant.LUMO_ERROR); | |||
| notification.setDuration(3000); | |||
| notification.setPosition(Notification.Position.MIDDLE); | |||
| notification.open(); | |||
| return; | |||
| } | |||
| try { | |||
| request.login(username.getValue(), password.getValue()); | |||
| getUI().ifPresent(ui -> ui.navigate("")); | |||
| } catch (ServletException ex) { | |||
| Notification notification = new Notification("!Usuario o Contraseña incorrectos, verifica tus datos!"); | |||
| notification.addThemeVariants(NotificationVariant.LUMO_ERROR); | |||
| notification.setDuration(3000); | |||
| notification.setPosition(Notification.Position.MIDDLE); | |||
| notification.open(); | |||
| } | |||
| }); | |||
| add(mainLayout); | |||
| } | |||
| @Override | |||
| public void beforeEnter(BeforeEnterEvent event) { | |||
| if (event.getLocation() | |||
| .getQueryParameters() | |||
| .getParameters() | |||
| .containsKey("error")) { | |||
| } | |||
| } | |||
| } | |||