feat(profile): update profile form layout and functionality, enhance styles for better responsiveness

This commit is contained in:
ncoronel 2026-07-08 09:34:24 -03:00
parent baf5e2d4e7
commit b7ed16966c
8 changed files with 29 additions and 10 deletions

View File

@ -1,9 +1,7 @@
.account-layout {
display: flex;
max-width: 1200px;
margin: 0 auto;
padding: 40px 20px;
gap: 40px;
gap: 100px;
background-color: #f7f7f7;
min-height: calc(100vh - 100px);
}

View File

@ -50,7 +50,7 @@
</div>
<div class="form-actions">
<app-button type="button" variant="cancel" hostClass="action-btn">Cancelar</app-button>
<app-button type="submit" variant="primary" hostClass="action-btn">Guardar</app-button>
<app-button type="button" variant="cancel" hostClass="action-btn" buttonClass="w-100">Cancelar</app-button>
<app-button type="submit" variant="primary" hostClass="action-btn" buttonClass="w-100">Guardar</app-button>
</div>
</form>

View File

@ -2,7 +2,7 @@
display: flex;
flex-direction: column;
gap: 16px;
max-width: 500px;
width: 100%;
}
.form-actions {
display: flex;

View File

@ -1,7 +1,8 @@
import { Component } from '@angular/core';
import { Component, OnInit, inject } from '@angular/core';
import { ReactiveFormsModule, FormBuilder, FormGroup } from '@angular/forms';
import { InputComponent } from '../../../../../../shared/components/input/input.component';
import { ButtonComponent } from '../../../../../../shared/components/button/button.component';
import { AuthService } from '../../../../../../core/services/auth/auth.service';
@Component({
selector: 'app-profile-form',
@ -10,8 +11,9 @@ import { ButtonComponent } from '../../../../../../shared/components/button/butt
templateUrl: './profile-form.html',
styleUrl: './profile-form.scss',
})
export class ProfileForm {
export class ProfileForm implements OnInit {
profileForm: FormGroup;
private authService = inject(AuthService);
constructor(private fb: FormBuilder) {
this.profileForm = this.fb.group({
@ -22,4 +24,18 @@ export class ProfileForm {
password: ['']
});
}
ngOnInit(): void {
this.authService.loadCurrentUser().subscribe({
next: (user) => {
this.profileForm.patchValue({
fullName: user.nombre_apellido,
email: user.email,
dni: user.dni || '',
phone: user.telefono || ''
});
},
error: (err) => console.error('Error fetching user profile', err)
});
}
}

View File

@ -2,7 +2,8 @@
display: flex;
justify-content: space-between;
align-items: center;
padding: 16px;
padding: 16px;
padding-left:0;
border-bottom: 1px solid #e0e0e0;
transition: background-color 0.2s, border-radius 0.2s;
cursor: pointer;

View File

@ -1,5 +1,5 @@
.purchase-list-container {
display: flex;
flex-direction: column;
max-width: 600px;
width: 100%;
}

View File

@ -1,6 +1,8 @@
.page-container {
display: flex;
flex-direction: column;
width: 100%;
max-width: 600px;
}
.page-title {
font-size: 16px;

View File

@ -1,6 +1,8 @@
.page-container {
display: flex;
flex-direction: column;
width: 100%;
max-width: 600px;
}
.page-title {
font-size: 16px;