Skip to content

Commit 4c81e5b

Browse files
committed
Added Product List page
1 parent 75e9908 commit 4c81e5b

18 files changed

+218
-9
lines changed
39 Bytes
Binary file not shown.

DjangoEcommerce/settings.py

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -127,4 +127,5 @@
127127
MEDIA_ROOT=os.path.join(BASE_DIR,"media")
128128

129129
STATIC_URL="/static/"
130-
STATIC_ROOT=os.path.join(BASE_DIR,"static")
130+
STATIC_ROOT=os.path.join(BASE_DIR,"static")
131+
BASE_URL="http://127.0.0.1:8000"

DjangoEcommerceApp/AdminViews.py

Lines changed: 39 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@
88
from django.urls import reverse
99
from django.http import HttpResponseRedirect,HttpResponse
1010
from django.db.models import Q
11+
from DjangoEcommerce.settings import BASE_URL
12+
from django.views.decorators.csrf import csrf_exempt
1113

1214
@login_required(login_url="/admin/")
1315
def admin_home(request):
@@ -245,4 +247,40 @@ def post(self,request,*args,**kwargs):
245247

246248
product_transaction=ProductTransaction(product_id=product,transaction_type=1,transaction_product_count=in_stock_total,transaction_description="Intially Item Added in Stocks")
247249
product_transaction.save()
248-
return HttpResponse("OK")
250+
return HttpResponse("OK")
251+
252+
@csrf_exempt
253+
def file_upload(request):
254+
file=request.FILES["file"]
255+
fs=FileSystemStorage()
256+
filename=fs.save(file.name,file)
257+
file_url=fs.url(filename)
258+
return HttpResponse('{"location":"'+BASE_URL+''+file_url+'"}')
259+
260+
261+
class ProductListView(ListView):
262+
model=Products
263+
template_name="admin_templates/product_list.html"
264+
paginate_by=3
265+
266+
def get_queryset(self):
267+
filter_val=self.request.GET.get("filter","")
268+
order_by=self.request.GET.get("orderby","id")
269+
if filter_val!="":
270+
products=Products.objects.filter(Q(product_name__contains=filter_val) | Q(product_description__contains=filter_val)).order_by(order_by)
271+
else:
272+
products=Products.objects.all().order_by(order_by)
273+
274+
product_list=[]
275+
for product in products:
276+
product_media=ProductMedia.objects.filter(product_id=product.id,media_type=1,is_active=1).first()
277+
product_list.append({"product":product,"media":product_media})
278+
279+
return product_list
280+
281+
def get_context_data(self,**kwargs):
282+
context=super(ProductListView,self).get_context_data(**kwargs)
283+
context["filter"]=self.request.GET.get("filter","")
284+
context["orderby"]=self.request.GET.get("orderby","id")
285+
context["all_table_fields"]=Products._meta.get_fields()
286+
return context
1.36 KB
Binary file not shown.
85 Bytes
Binary file not shown.

DjangoEcommerceApp/adminurls.py

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,5 +48,7 @@
4848
path('merchant_update/<slug:pk>',AdminViews.MerchantUserUpdateView.as_view(),name="merchant_update"),
4949

5050
#Products
51-
path('product_create',AdminViews.ProductView.as_view(),name="product_view")
51+
path('product_create',AdminViews.ProductView.as_view(),name="product_view"),
52+
path('product_list',AdminViews.ProductListView.as_view(),name="product_list"),
53+
path('file_upload',AdminViews.file_upload,name="file_upload")
5254
]

DjangoEcommerceApp/templates/admin_templates/product_create.html

Lines changed: 59 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -209,11 +209,65 @@ <h5>Product Tags</h5>
209209
{% block custom_js %}
210210
<script src="//cdn.tiny.cloud/1/u6oa5pnpaa1vxho1md7uk4zmq2ai7xuf5o5wfgyrc131vpj6/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
211211
<script>
212-
tinymce.init({
213-
selector: '#long_desc',
214-
plugins: 'quickbars emoticons preview a11ychecker advcode casechange formatpainter linkchecker autolink lists media checklist media mediaembed pageembed permanentpen powerpaste table advtable tinymcespellchecker',
215-
toolbar: 'quickbars emoticons preview media a11ycheck addcomment showcomments casechange checklist code formatpainter pageembed permanentpen table',
216-
});
212+
tinymce.init({
213+
selector: "textarea#long_desc",
214+
height: 300,
215+
plugins: [
216+
"advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
217+
"searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime nonbreaking",
218+
"save table contextmenu directionality emoticons template paste textcolor",
219+
],
220+
images_upload_url:"{% url 'file_upload' %}",
221+
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l ink image | print preview media fullpage | forecolor backcolor emoticons",
222+
style_formats: [
223+
{ title: "Bold text", inline: "b" },
224+
{ title: "Red text", inline: "span", styles: { color: "#ff0000" } },
225+
{ title: "Red header", block: "h1", styles: { color: "#ff0000" } },
226+
{ title: "Example 1", inline: "span", classes: "example1" },
227+
{ title: "Example 2", inline: "span", classes: "example2" },
228+
{ title: "Table styles" },
229+
{ title: "Table row 1", selector: "tr", classes: "tablerow1" },
230+
],
231+
automatic_uploads: true,
232+
file_picker_types: 'image',
233+
file_picker_callback: function (cb, value, meta) {
234+
var input = document.createElement('input');
235+
input.setAttribute('type', 'file');
236+
input.setAttribute('accept', 'image/*');
237+
238+
/*
239+
Note: In modern browsers input[type="file"] is functional without
240+
even adding it to the DOM, but that might not be the case in some older
241+
or quirky browsers like IE, so you might want to add it to the DOM
242+
just in case, and visually hide it. And do not forget do remove it
243+
once you do not need it anymore.
244+
*/
245+
246+
input.onchange = function () {
247+
var file = this.files[0];
248+
249+
var reader = new FileReader();
250+
reader.onload = function () {
251+
/*
252+
Note: Now we need to register the blob in TinyMCEs image blob
253+
registry. In the next release this part hopefully won't be
254+
necessary, as we are looking to handle it internally.
255+
*/
256+
var id = 'blobid' + (new Date()).getTime();
257+
var blobCache = tinymce.activeEditor.editorUpload.blobCache;
258+
var base64 = reader.result.split(',')[1];
259+
var blobInfo = blobCache.create(id, file, base64);
260+
blobCache.add(blobInfo);
261+
262+
/* call the callback and populate the Title field with the file name */
263+
cb(blobInfo.blobUri(), { title: file.name });
264+
};
265+
reader.readAsDataURL(file);
266+
};
267+
268+
input.click();
269+
},
270+
});
217271
</script>
218272
<script>
219273
$(".add_media").click(function(){
Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
{% extends 'admin_templates/base_template.html' %}
2+
{% block title %}
3+
Product List
4+
{% endblock title %}
5+
6+
7+
{% block custom_css %}
8+
{% endblock custom_css %}
9+
10+
{% block page_title %}
11+
Product List
12+
{% endblock page_title %}
13+
14+
{% block page_content %}
15+
<div class="row">
16+
<div class="col-lg-12">
17+
<div class="search-element">
18+
<div class="card">
19+
20+
<div class="card-body">
21+
<form method="get">
22+
<button class="btn btn-primary" type="submit" style="float:right"><i class="fas fa-search"></i> Search</button>
23+
<input class="form-control" type="search" placeholder="Search" aria-label="Search" data-width="250" style="width: 250px;float:right" name="filter" value="{{ filter }}">
24+
</form>
25+
</div>
26+
27+
</div>
28+
</div>
29+
</div>
30+
</div>
31+
<div class="row">
32+
<div class="col-lg-12">
33+
<div class="search-element">
34+
<div class="card">
35+
36+
<div class="card-body">
37+
<b>Sort By : - </b>
38+
<a href="{% url 'product_list' %}?filter={{ filter }}&orderby=id">ID</a> |
39+
<a href="{% url 'product_list' %}?filter={{ filter }}&orderby=product_name">Title</a> |
40+
<a href="{% url 'product_list' %}?filter={{ filter }}&orderby=product_description">Description</a>
41+
</div>
42+
</div>
43+
</div>
44+
</div>
45+
</div>
46+
<div class="row">
47+
{% for product in object_list %}
48+
<div class="col-12 col-sm-6 col-md-6 col-lg-3">
49+
<article class="article article-style-b">
50+
<div class="article-header">
51+
<div class="article-image" data-background="{{ product.media.media_content }}" style="background-image: url(&quot;assets/img/news/img13.jpg&quot;);">
52+
</div>
53+
<div class="article-badge">
54+
<div class="article-badge-item bg-danger"><i class="fas fa-fire"></i>{{ product.product.product_name }}</div>
55+
</div>
56+
</div>
57+
<div class="article-details">
58+
<p><span class="badge badge-primary">{{ product.product.subcategories_id.title }}</span></p>
59+
<p>{{ subcategory.description }}</p>
60+
<p><span class="badge badge-warning">Url Slug : {{ product.product.url_slug }}</span></p>
61+
<div class="article-cta">
62+
<label class="custom-switch mt-2" style="float:left">
63+
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input" {% if product.product.is_active == 1 %}checked{% endif %}>
64+
<span class="custom-switch-indicator"></span>
65+
<span class="custom-switch-description">ACTIVE</span>
66+
</label>
67+
<a href="#" class="btn btn-warning ">EDIT <i class="fas fa-chevron-right"></i></a>
68+
<div><br></div>
69+
<a href="#" class="btn btn-danger btn-block">ADD MEDIA <i class="fas fa-chevron-right"></i></a>
70+
<a href="#" class="btn btn-success btn-block">EDIT MEDIA <i class="fas fa-chevron-right"></i></a>
71+
<a href="#" class="btn btn-primary btn-block">ADD Stocks <i class="fas fa-chevron-right"></i></a>
72+
</div>
73+
</div>
74+
</article>
75+
</div>
76+
{% endfor %}
77+
</div>
78+
<div class="row">
79+
<div class="col-lg-12">
80+
<div class="card">
81+
82+
<div class="card-body">
83+
<nav aria-label="Page navigation example">
84+
<ul class="pagination">
85+
{% if page_obj.has_previous %}
86+
<li class="page-item"><a class="page-link" href="{% url 'product_list' %}?filter={{ filter }}&orderby={{ orderby }}&page={{ page_obj.previous_page_number }}">Previous</a></li>
87+
{% else %}
88+
<li class="page-item disabled"><a class="page-link" href="#">Previous</a></li>
89+
{% endif %}
90+
{% for i in paginator.page_range %}
91+
<li class="page-item {% if i == page_obj.number %}active{% endif %}"><a class="page-link" href="{% url 'product_list' %}?filter={{ filter }}&orderby={{ orderby }}&page={{ i }}">{{ i }}</a></li>
92+
{% endfor %}
93+
{% if page_obj.has_next %}
94+
<li class="page-item"><a class="page-link" href="{% url 'product_list' %}?filter={{ filter }}&orderby={{ orderby }}&page={{ page_obj.next_page_number }}">Next</a></li>
95+
{% else %}
96+
<li class="page-item disabled"><a class="page-link" href="#">Next</a></li>
97+
{% endif %}
98+
99+
</ul>
100+
</nav>
101+
</div>
102+
</div>
103+
</div>
104+
</div>
105+
106+
{% endblock page_content %}
107+
108+
109+
{% block custom_js %}
110+
{% endblock custom_js %}

DjangoEcommerceApp/templates/admin_templates/sidebar.html

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,10 +48,12 @@
4848
</li>
4949

5050
{% url 'product_view' as product_view %}
51-
<li class="dropdown {% if request.path == product_view %} active {% endif %}">
51+
{% url 'product_list' as product_list %}
52+
<li class="dropdown {% if request.path == product_view %} active {% endif %} {% if request.path == product_list %} active {% endif %}">
5253
<a href="#" class="nav-link has-dropdown"><i class="fas fa-dice-d6"></i><span>Products</span></a>
5354
<ul class="dropdown-menu">
5455
<li class='{% if request.path == product_view %} active {% endif %}'><a class="nav-link" href="{% url 'product_view' %}">Add Products</a></li>
56+
<li class='{% if request.path == product_list %} active {% endif %}'><a class="nav-link" href="{% url 'product_list' %}">Product List</a></li>
5557
</ul>
5658
</li>
5759
</ul>

README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,3 +50,5 @@
5050
## Added Add Product Page With Dynamic Content and Media
5151
<img src="screenshots/product_create.png" style="width:100%" alt="category"/>
5252

53+
## Added Product List Page
54+
<img src="screenshots/product_list.png" style="width:100%" alt="Products"/>

0 commit comments

Comments
 (0)