Как заменить алгоритмическую штуковину на странице редактирования моего профиля достойной bootstrapified панелью ввода - Django

Итак, у меня есть страница редактирования профиля, которая выглядит следующим образом:

Я хочу заменить вот это:

алгоритм: pbkdf2_sha256 итераций: 390000 соль: pZEUwO**************** хэш: M7qIWG************************************** Необработанные пароли не хранятся, поэтому нет возможности увидеть пароль этого пользователя, но вы можете изменить пароль с помощью этой формы.

из-под столбца Пароль с правильной формой, похожей на формат Имя пользователя, Имя, Фамилия и т.д.

Мои взгляды:

class NormalUserEditView(generic.UpdateView):
    form_class = EditProfileFormNormal
    template_name = 'authentication/edit_normalprofile.html'
    success_url = reverse_lazy('profile')
    
    def form_valid(self, form):
        messages.success(self.request, f'Account Edit: Successful')
        return super().form_valid(form)

    def get_object(self):
        return self.request.user

class PasswordsChangeView(PasswordChangeView):
    form_class = PasswordChangeForm
    success_url = reverse_lazy('profile')
    
    def form_valid(self, form):
        messages.success(self.request, 'Password Change: Successful')
        return super().form_valid(form)

Мои ссылки:

from django.urls import path
from . import views
from .views import UserEditView, NormalUserEditView, PasswordsChangeView
from django.contrib.auth import views as auth_views

urlpatterns = [
    path('register', views.register_user, name='register'),
    path('login', views.login_user, name='login'),
    path('logout', views.logout_user, name="logout"),
    path('confirm_address_page', views.cap, name="confirm-address-page"),
    path('activate/<uidb64>/<token>', views.activate, name="activate"),
    path('edit_user_profile/', UserEditView.as_view(), name="edit-profile"),
    path('password/', PasswordsChangeView.as_view(template_name='authentication/change-password.html')),
    path('edit_profile/', NormalUserEditView.as_view(), name="edit-normalprofile"),
    path('profile', views.profile, name="profile"),
]

Мои формы:

from django.contrib.auth.forms import UserCreationForm, UserChangeForm, PasswordChangeForm
from django.contrib.auth.models import User
from django import forms

class RegisterUserForm(UserCreationForm):
    email = forms.EmailField(widget=forms.EmailInput(attrs={'class': 'form-control'}))
    first_name = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))
    last_name = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))

    class Meta:
        model = User
        fields = ('username', 'first_name', 'last_name', 'email', 'password1', 'password2')

    def __init__(self, *args, **kwargs):
        super(RegisterUserForm, self).__init__(*args, **kwargs)

        self.fields['username'].widget.attrs['class'] = 'form-control'
        self.fields['password1'].widget.attrs['class'] = 'form-control'
        self.fields['password2'].widget.attrs['class'] = 'form-control'

class EditProfileForm(UserChangeForm):
    email = forms.EmailField(widget=forms.EmailInput(attrs={'class': 'form-control'}))
    first_name = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))
    last_name = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))
    username = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))
    is_superuser = forms.CharField(max_length=50, widget=forms.CheckboxInput(attrs={'class': 'form-check'}))
    is_staff = forms.CharField(max_length=50, widget=forms.CheckboxInput(attrs={'class': 'form-check'}))

    class Meta:
        model = User
        fields = ('username', 'first_name', 'last_name', 'email', 'password','is_superuser', 'is_staff')

class EditProfileFormNormal(UserChangeForm):
    email = forms.EmailField(widget=forms.EmailInput(attrs={'class': 'form-control'}))
    first_name = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))
    last_name = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))
    username = forms.CharField(max_length=50, widget=forms.TextInput(attrs={'class': 'form-control'}))
    class Meta:
        model = User
        fields = ('username', 'first_name', 'last_name', 'email', 'password')

class PasswordChangingForm(PasswordChangeForm):
    old_password = forms.CharField(widget=forms.PasswordInput(attrs={'class': 'form-control', 'type': 'password'}))
    new_password1 = forms.CharField(max_length=50, widget=forms.PasswordInput(attrs={'class': 'form-control', 'type': 'password'}))
    new_password2 = forms.CharField(max_length=50, widget=forms.PasswordInput(attrs={'class': 'form-control', 'type': 'password'}))

    class Meta:
        model = User
        fields = ('old_password', 'new_password1', 'new_password2')

Мой шаблон "edit_normalprofile.html":

{% extends 'base.html' %}

{% block content %}

{% if form. errors %}
    <div class="alert alert-warning alert-dismissible fade show" role="alert">
            Error Occured
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>



{% endif %} 
<div class="shadow p-4 mb-5 bg-body rounded">
    <h1> Edit Profile </h1><br/><hr><br/>
        <form method=POST>
            {% csrf_token %}
            {{ form.as_p }} <br/><br/>
            <input type="submit" value="Update" class="btn btn-success"
            >       <button class='btn btn-primary' href="{% url 'profile' %}"> View Profile </button>
        </form>
        
</div>
<br/><br/>  
{% endblock %}

И, наконец, мой шаблон "change-password.html":

{% extends 'base.html' %}

{% block content %}
<div class="shadow p-4 mb-5 bg-body rounded">
            <h1> Change Password </h1>
        <br/>

        <div class="form-group"></div>
                <form action="" method=POST>
                    {% csrf_token %}
                    {{ form.as_p }}
                    <input type="submit" value="Update" class="btn btn-success">
                    
                </form>
        </div>

</div>
<br/><br/>
{% endblock %}

Заранее спасибо.

Вернуться на верх