摘要:文章目錄商品列表頁(yè)邏輯代碼商品列表頁(yè)的數(shù)據(jù)渲染商品詳細(xì)頁(yè)實(shí)現(xiàn)商品收藏商品列表頁(yè)邏輯代碼的定義視圖函數(shù)商品列表獲取請(qǐng)求參數(shù)變量是商品搜索功能的關(guān)鍵字,它與模型的字段進(jìn)行模糊匹配,因此查詢條件為。
commodity的views.py定義視圖函數(shù)commodityView
from django.core.paginator import Paginator, PageNotAnInteger,EmptyPagefrom django.http import HttpResponsefrom django.shortcuts import renderfrom .models import *def commodityView(request): title = "商品列表" classContent = "commoditys" firsts = Types.objects.values("firsts").distinct() typesList = Types.objects.all() # 獲取請(qǐng)求參數(shù) t = request.GET.get("t","") s = request.GET.get("s","sold") p = request.GET.get("p",1) n = request.GET.get("n","") commodityInfos = CommodityInfos.objects.all() if t: types = Types.objects.filter(id=t).first() commodityInfos = commodityInfos.filter(types=types.seconds) if s: commodityInfos = commodityInfos.order_by("-"+ s) if n: commodityInfos = commodityInfos.filter(name_contains=n) pagintor = Paginator(commodityInfos,6) try: pages = pagintor.page(p) except PageNotAnInteger: pages = pagintor.page(1) except EmptyPage: pages = pagintor.page(pagintor.num_pages) return render(request,"commodity.html",locals())
(1)變量n是商品搜索功能的關(guān)鍵字,它與模型CommodityInfos的字段name進(jìn)行模糊匹配,因此查詢條件為name__contains=n。
(2)變量t是查詢某個(gè)分頁(yè)的商品信息,它以整型格式表示,代表模型Type的主鍵id
(3)變量s是設(shè)置商品的排序方式,如果請(qǐng)求參數(shù)s為空,則默認(rèn)變量s等于字符串sold
(4)變量p是設(shè)置商品信息的頁(yè)數(shù),默認(rèn)變量p等于1
commodity.html
{% extends "base.html" %}{% load static %}{% block content %} <div class="commod-cont-wrap"> <div class="commod-cont w1200 layui-clear"> <div class="left-nav"> <div class="title">所有分類</div> <div class="list-box"> {% for f in firsts %} <dl> <dt>{{ f.firsts }}</dt> {% for t in typesList %} {% if t.firsts == f.firsts %} <dd><a href="{% url "commodity:commodity" %}?t={{ t.id }}&n={{ n }}">{{ t.seconds }}</a></dd> {% endif %} {% endfor %} </dl> {% endfor %} </div> </div> <div class="right-cont-wrap"> <div class="right-cont"> <div class="sort layui-clear"> <a {% if not s or s == "sold" %}class="active" {% endif %} href="{% url "commodity:commodity" %}?t={{ t }}&s=sold&n={{ n }}">銷量</a> <a {% if s == "price" %}class="active" {% endif %} href="{% url "commodity:commodity" %}?t={{ t }}&s=price&n={{ n }}">價(jià)格</a> <a {% if s == "created" %}class="active" {% endif %} href="{% url "commodity:commodity" %}?t={{ t }}&s=created&n={{ n }}">新品</a> <a {% if s == "likes" %}class="active" {% endif %} href="{% url "commodity:commodity" %}?t={{ t }}&s=likes&n={{ n }}">收藏</a> </div> <div class="prod-number"> <a href="javascript:;">商品列表</a> <span>></span> <a href="javascript:;">共{{ commodityInfos|length }}件商品</a> </div> <div class="cont-list layui-clear" id="list-cont"> {% for p in pages.object_list %} <div class="item"> <div class="img"> <a href="{% url "commodity:detail" p.id %}"> <img height="280" width="280" src="{{ p.img.url }}"></a> </div> <div class="text"> <p class="title">{{ p.name }}</p> <p class="price"> <span class="pri">¥{{ p.price|floatformat:"2" }}</span> <span class="nub">{{ p.sold }}付款</span> </p> </div> </div> {% endfor %} </div> </div> </div> <div id="demo0" style="text-align: center;"> <div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-1"> {% if pages.has_previous %} <a href="{% url "commodity:commodity" %}?t={{ t }}&s={{ s }}&n={{ n }}&p={{ pages.previous_page_number }}" class="layui-laypage-prev">上一頁(yè)</a> {% endif %} {% for page in pages.paginator.page_range %} {% if pages.number == page %} <span class="layui-laypage-curr"><em class="layui-laypage-em"></em><em>{{ page }}</em></span> {% elif pages.number|add:"-1" == page or pages.number|add:"1" == page %} <a href="{% url "commodity:commodity" %}?t={{ t }}&s={{ s }}&n={{ n }}&p={{ page }}">{{ page }}</a> {% endif %} {% endfor %} {% if pages.has_next %} <a href="{% url "commodity:commodity" %}?t={{ t }}&s={{ s }}&n={{ n }}&p={{ pages.pages.next_page_number }}" class="layui-laypage-next">下一頁(yè)</a> {% endif %} </div> </div> </div> </div>{% endblock content %} {% block script %} layui.config({ base: "{% static "js/" %}" }).use(["mm","laypage","jquery"],function(){ var laypage = layui.laypage,$ = layui.$, mm = layui.mm; $(".list-box dt").on("click",function(){ if($(this).attr("off")){ $(this).removeClass("active").siblings("dd").show() $(this).attr("off","") }else{ $(this).addClass("active").siblings("dd").hide() $(this).attr("off",true) } })});{% endblock script %}
效果圖
commodity的views.py定義視圖函數(shù)detailView
def detailView(request, id): title = "商品介紹" classContent = "datails" commoditys = CommodityInfos.objects.filter(id=id).first() items = CommodityInfos.objects.exclude(id=id).order_by("-sold")[:5] likesList = request.session.get("likes", []) likes = True if id in likesList else False return render(request, "details.html", locals())
details.html
{% extends "base.html" %}{% load static %}{% block content %} <div class="data-cont-wrap w1200"> <div class="crumb"> <a href="{% url "index:index" %}">首頁(yè)</a> <span>></span> <a href="{% url "commodity:commodity" %}">所有商品</a> <span>></span> <a href="javascript:;">產(chǎn)品詳情</a> </div> <div class="product-intro layui-clear"> <div class="preview-wrap"> <img height="300" width="300" src="{{ commoditys.img.url }}"> </div> <div class="itemInfo-wrap"> <div class="itemInfo"> <div class="title"> <h4>{{ commoditys.name }}</h4> {% if likes %} <span id="collect"><i class="layui-icon layui-icon-rate-solid"></i>收藏</span> {% else %} <span id="collect"><i class="layui-icon layui-icon-rate"></i>收藏</span> {% endif %} </div> <div class="summary"> <p class="reference"><span>參考價(jià)</span> <del>¥{{ commoditys.price|floatformat:"2" }}</del></p> <p class="activity"><span>活動(dòng)價(jià)</span><strong class="price"><i>¥</i>{{ commoditys.discount|floatformat:"2" }}</strong></p> <p class="address-box"><span>送 至</span><strong class="address">廣東 廣州 天河區(qū)</strong></p> </div> <div class="choose-attrs"> <div class="color layui-clear"><span class="title">規(guī) 格</span> <div class="color-cont"><span class="btn active">{{ commoditys.sezes }}</span></div></div> <div class="number layui-clear"><span class="title">數(shù) 量</span><div class="number-cont"> <span class="cut btn">-</span> <input onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,"")}else{this.value=this.value.replace(//D/g,"")}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,"")}else{this.value=this.value.replace(//D/g,"")}" maxlength="4" type="" id="quantity" value="1"> <span class="add btn">+</span></div></div> </div> <div class="choose-btns"> <a class="layui-btn layui-btn-danger car-btn"> <i class="layui-icon layui-icon-cart-simple"></i>加入購(gòu)物車</a> </div> </div> </div> </div> <div class="layui-clear"> <div class="aside"> <h4>熱銷推薦</h4> <div class="item-list"> {% for item in items %} <div class="item"> <a href="{% url "commodity:detail" item.id %}"> <img height="280" width="280" src="{{ item.img.url }}"> </a> <p> <span title="{{ item.name }}"> {% if item.name|length > 15 %} {{ item.name|slice:":15" }}... {% else %} {{ item.name|slice:":15" }} {% endif %} </span> <span class="pric">¥{{ item.discount|floatformat:"2" }}</span> </p> </div> {% endfor %} </div> </div> <div class="detail"> <h4>詳情</h4> <div class
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/119071.html
摘要:文章目錄基礎(chǔ)模板設(shè)計(jì)首頁(yè)模板設(shè)計(jì)和的定義相應(yīng)的視圖函數(shù)配置媒體資源的路由信息基礎(chǔ)模板設(shè)計(jì)在項(xiàng)目的文件夾新建文件該文件用于存放每個(gè)網(wǎng)頁(yè)頂部的代碼母嬰商城請(qǐng)輸入需要的商品 ...
摘要:前言由于寫的文章已經(jīng)是有點(diǎn)多了,為了自己和大家的檢索方便,于是我就做了這么一個(gè)博客導(dǎo)航。 前言 由于寫的文章已經(jīng)是有點(diǎn)多了,為了自己和大家的檢索方便,于是我就做了這么一個(gè)博客導(dǎo)航。 由于更新比較頻繁,因此隔一段時(shí)間才會(huì)更新目錄導(dǎo)航哦~想要獲取最新原創(chuàng)的技術(shù)文章歡迎關(guān)注我的公眾號(hào):Java3y Java3y文章目錄導(dǎo)航 Java基礎(chǔ) 泛型就這么簡(jiǎn)單 注解就這么簡(jiǎn)單 Druid數(shù)據(jù)庫(kù)連接池...
摘要:有必要建一個(gè)資源服務(wù)器存放靜態(tài)資源。一些用戶級(jí)別的數(shù)據(jù)輕量可以考慮存儲(chǔ)在中。存儲(chǔ)的是值,可以通過來對(duì)和對(duì)象之間的轉(zhuǎn)換如果我們的數(shù)據(jù)是在后臺(tái)傳過去或者轉(zhuǎn)換而成的,在前臺(tái)上并沒有做什么改變的話。 移動(dòng)商城項(xiàng)目總結(jié) 移動(dòng)商城項(xiàng)目是我第二個(gè)做得比較大的項(xiàng)目,該項(xiàng)目系統(tǒng)來源于傳智Java168期,十天的視頻課程(想要視頻的同學(xué)關(guān)注我的公眾號(hào)就可以直接獲取了) 通過這次的項(xiàng)目又再次開闊了我的視野,...
目錄 一、禪道 一、測(cè)試工具背景 二、測(cè)試管理工具 三、測(cè)試工具介紹 四、禪道介紹 五、禪道操作 7. 創(chuàng)建發(fā)布 8. 測(cè)試團(tuán)隊(duì) 二、缺陷報(bào)告 三、測(cè)試報(bào)告 一、概要 二、測(cè)試過程 三、缺陷分析 四、測(cè)試總結(jié) 四、接口測(cè)試以及用例編寫 五、Fiddler 好文推薦 一、禪道 一、測(cè)試工具背景 當(dāng)測(cè)試環(huán)境搭建完成后,測(cè)試人員將在自己搭建的環(huán)境上執(zhí)行測(cè)試用例,開展測(cè)試工作。測(cè)試人員在執(zhí)行測(cè)試用例的過...
閱讀 3481·2023-04-26 02:31
閱讀 3637·2021-11-23 09:51
閱讀 1299·2021-11-17 09:33
閱讀 2453·2021-11-16 11:45
閱讀 2581·2021-10-11 11:12
閱讀 2424·2021-09-22 15:22
閱讀 2728·2021-09-04 16:40
閱讀 2591·2021-07-30 15:30