如何从我在django中制作的表单数据中创建一个HTML的卡片视图？

Question

我正在创建一个Django CRM，在这里我使用表单来获取任何公司的数据。我想做的是，当我或任何人写了关于任何公司的详细信息并提交了它们--它们将被保存为公司.html中的卡片视图。

谁能帮我解决这个问题？

公司.html。

{% extends 'base.html' %}

{% load static %}

{% block content %}

<div class="container-fluid">

    <!-- Page Heading -->
    <div class="d-sm-flex align-items-center justify-content-between mb-4 mt-4">
    <a href="{% url 'company-create' %}" class="d-none d-sm-inline-block btn btn-sm btn-primary shadow-sm"><i class="fas fa-plus fa-sm text-white-50"></i> Create Company</a>
    </div>
    <div class="text-center">
        <a class="small" href="{% url 'dashboard' %}">Back</a>
    </div>


</div>
{% endblock content %}

company-create.html:

{% extends 'base.html' %}

{% load crispy_forms_tags %} 

{% block content %}

<!-- Begin Page Content -->
<div class="container-fluid">

    <!-- Page Heading -->
    <div class="d-sm-flex align-items-center justify-content-between mb-4 mt-4">
    <h1 class="h3 mb-0 text-gray-800">Company Create</h1>
    </div>          

    <!-- Main Content Here -->
    <div class="card o-hidden border-0 shadow-lg my-5">
      <div class="card-body p-0">
        <div class="row">
          <div class="col-lg-3"></div>
          <div class="col-lg-6">
            <div class="p-5">
              <div class="text-center">
                <h1 class="h4 text-gray-900 mb-4">Create a Company!</h1>
              </div>
              <form method="POST" action="" enctype="multipart/form-data">
                {% csrf_token %}
                {{user_form | crispy}}
                {{profile_form | crispy}}
                <button type="submit" class="btn btn-primary btn-block">Update</button>
              </form>
              <hr>
              <div class="text-center">
                <a class="small" href="{% url 'dashboard' %}">Back</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>



</div>
<!-- /.container-fluid -->
{% endblock content %}

forms.py:

from django import forms 
from django.contrib.auth.models import User
from django.contrib.auth.forms import UserCreationForm

from apps.userprofile.models import Profile

class SignUpForm(UserCreationForm):

first_name = forms.CharField(max_length=30, required=False, help_text='Optional')
last_name = forms.CharField(max_length=30, required=False, help_text='Optional')
email = forms.EmailField(max_length=254, help_text='Enter a valid email address')

class Meta:
    model = User
    fields = [
        'username',
        'first_name',
        'last_name',
        'email',
        'password1',
        'password2',
    ]


class UserForm(forms.ModelForm):
class Meta:
    model = User
    fields = [
        'username',
        'first_name',
        'last_name',
        'email',
    ]


class ProfileForm(forms.ModelForm):
class Meta:
    model = Profile
    fields = [
        'bio',
        'phone_number',
        'birth_date',
        'profile_image'
    ]


class CompanyForm(forms.Form):
name = forms.CharField(label="Enter Company Name",max_length= 50)
email = forms.EmailField(label="Enter Email")
phone_number = forms.CharField(label="Enter Phone Number",max_length=12)
contact_name = forms.CharField(label="Enter Contact Persons Name",max_length=50)
file = forms.FileField()

class Meta:
    model = User
    fields = [
        'name',
        'email',
        'phone_number',
        'username'
        'profile_image',
    ]

views.py:

from django.shortcuts import render
from django.contrib.auth.mixins import LoginRequiredMixin
from django.urls import reverse_lazy

from django.views.generic import TemplateView, CreateView

from .forms import SignUpForm, UserForm, ProfileForm, CompanyForm
from django.contrib.auth.models import User
from django.http import HttpResponseRedirect
from django.contrib import messages
from apps.userprofile.models import Profile

class HomeView(TemplateView):
template_name = 'common/home.html'

class DashboardView(LoginRequiredMixin, TemplateView):
template_name = 'common/dashboard.html'
login_url = reverse_lazy('home')

def get_context_data(self, **kwargs):
    # Call the base implementation first to get a context
    context = super().get_context_data(**kwargs)
    # Add in a QuerySet of all the books
    print(self.request.user.id)
    context['book_list'] = self.request.user
    return context

class SignUpView(CreateView):
form_class =  SignUpForm
success_url = reverse_lazy('home')
template_name = 'common/register.html'

class MessageView(TemplateView):
template_name = 'common/messages.html'

class CompanyView(TemplateView):
template_name = 'common/companies/companies.html'

class CompanyCreateView(LoginRequiredMixin, TemplateView):
user_form = CompanyForm
template_name = 'common/companies/company-create.html'

def post(self, request):

    post_data = request.POST or None
    file_data = request.FILES or None

    user_form = CompanyForm(post_data)

    if user_form.is_valid():
        user_form.save()
        messages.success(request, 'Your company was successfully created!')
        return HttpResponseRedirect(reverse_lazy('comapanies'))

    context = self.get_context_data(
                                    user_form=user_form
                                )

    return self.render_to_response(context)

def get(self, request, *args, **kwargs):
    return self.post(request, *args, **kwargs)

from django.http import HttpResponseRedirect
from django.contrib.auth.mixins import LoginRequiredMixin
from django.urls import reverse_lazy
from django.contrib import messages
from .forms import UserForm, ProfileForm
from django.contrib.auth.models import User
from apps.userprofile.models import Profile


class ProfileView(LoginRequiredMixin, TemplateView):
template_name = 'common/profile.html'

class ProfileUpdateView(LoginRequiredMixin, TemplateView):
user_form = UserForm
profile_form = ProfileForm
template_name = 'common/profile-update.html'

def post(self, request):

    post_data = request.POST or None
    file_data = request.FILES or None

    user_form = UserForm(post_data, instance=request.user)
    profile_form = ProfileForm(post_data, file_data, instance=request.user.profile)

    if user_form.is_valid() and profile_form.is_valid():
        user_form.save()
        profile_form.save()
        messages.success(request, 'Your profile was successfully updated!')
        return HttpResponseRedirect(reverse_lazy('profile'))

    context = self.get_context_data(
                                    user_form=user_form,
                                    profile_form=profile_form
                                )

    return self.render_to_response(context)

def get(self, request, *args, **kwargs):
    return self.post(request, *args, **kwargs)

除了这些代码，我还附上了一些CRM的截图。

Dashboard:就像所谓的公司和联系人的卡片一样，我希望公司的详细信息能在卡片中显示出来。

公司:这里点击创建联系人按钮后，我们会被重定向到公司创建表单。

创建公司:现在这里点击更新按钮后，填写了表单的详细信息，我想将表单重定向到联系人页面，在创建公司按钮下方显示新添加的公司详细信息，以卡片形式显示。

Answer 1

这是你所要求的方法，使用普通函数作为视图而不是类的例子。你需要在settings.py中做一些设置，如安装Pillow（如果你还没有做）。看看它是否能帮助你。

模型.py

from django.db import models


class CompanyDetail(models.Model):
name = models.CharField(label="Enter Company Name",max_length= 50)
email = models.EmailField(label="Enter Email")
phone_number = models.CharField(label="Enter Phone Number",max_length=12)
contact_name = models.CharField(label="Enter Contact Persons Name",max_length=50)

image = models.ImageField(upload_to='tour_images', blank=True)

views.py

from django.shortcuts import render,
from .models import CompanyDetail


def show_company_cards(request):

    company_details = CompanyDetail.objects.all()

    return render(request, 'company.html', {'company_details': company_details})

公司.html

{% extends 'base.html' %}

{% load static %}

{% block content %}
<div class="container-fluid">

    <!-- Page Heading -->
    <div class="d-sm-flex align-items-center justify-content-between mb-4 mt-4">
    <a href="{% url 'company-create' %}" class="d-none d-sm-inline-block btn btn-sm btn-primary shadow-sm"><i class="fas fa-plus fa-sm text-white-50"></i> Create Company</a>
    </div>
    <div class="text-center">
        <a class="small" href="{% url 'dashboard' %}">Back</a>
    </div>
<!-- this is the place of the closing container fluid that is in the bottom -->

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
<div class="container">
    <div class="row">

    {% for detail in company_details %}

        <div class="col-md-3">
            <div class="contact-box center-version">


                    <img alt="image" class="img-circle" src="{{ detail.image.url}}">

                    <h3 class="m-b-xs"><strong>{{detail.name}}</strong></h3>

                    <div class="font-bold">{{detail.contact_name}}</div>

                    <address class="m-t-md">

                        <strong>{{detail.email}}</strong><br>

                        <abbr title="Phone">P:</abbr> {{detail.phone_number}}

                    </address>

            </div>
        </div>

{% endfor %}


     </div>
  </div>

<!-- container fluid closer (test to see if it works) if no remove an put it back-->

</div>
{% endblock content %}