昆明网站建设开发制作,江西网站做的好的企业,wordpress主题加速,成都网站开发多少钱概念
本文在上一文章搭建完数据库#xff0c;以及创建好项目之后#xff0c;以及前端静态文件后#xff0c;对项目的首页功能开发。
后端代码编写
在views.py文件中创建方法#xff0c;连接数据库#xff0c;并获取首页需要的数据
def getGoodsList(type):# 获取所有横…概念
本文在上一文章搭建完数据库以及创建好项目之后以及前端静态文件后对项目的首页功能开发。
后端代码编写
在views.py文件中创建方法连接数据库并获取首页需要的数据
def getGoodsList(type):# 获取所有横幅滚动商品idres Recommend.objects.filter(typetype)goodsIds []for r in res:goodsIds.append(r.goods_id)# 根据推荐栏的商品信息goods Goods.objects.filter(id__intuple(goodsIds))if type !1:# 将实体类对象转换成字典进行遍历for g in goods.values():t Type.objects.get(idg[type_id]).nameg[typename] treturn goods
# 处理首页的请求
def index(request):# 获取所有商品分类信息global typestypesType.objects.all()# 根据推荐栏的商品scrollsgetGoodsList(1)# 获取新品newListgetGoodsList(3)# 获取热品hotListgetGoodsList(2)return render(request,index.html,{typeList:types,scroll:scrolls,newList:newList,hotList:hotList})
前端页面搭建
在子项目中创建templates文件夹在该文件夹下创建header.html,foot.html以及index.html作为首页的前端内容
header.html
div classheaderdiv classcontainernav classnavbar navbar-default rolenavigationdiv classnavbar-headerbutton typebutton classnavbar-toggle data-togglecollapse data-target#bs-example-navbar-collapse-1span classsr-onlyToggle navigation/spanspan classicon-bar/spanspan classicon-bar/spanspan classicon-bar/span/buttonh1 classnavbar-branda href//a/h1/div!--navbar-header--div classcollapse navbar-collapse idbs-example-navbar-collapse-1ul classnav navbar-navlia href/{% if flag 1 %}classactive{% endif %}首页/a/lili classdropdowna href# classdropdown-toggle{% if flag 2 %}active{% endif %} data-toggledropdown商品分类b classcaret/b/aul classdropdown-menu multi-column columns-2lidiv classrowdiv classcol-sm-12h4商品分类/h4ul classmulti-column-dropdownlia classlist href/goods_list全部系列/a/li{% for t in typeList%}lia classlist href/goods_list?typeid{{ t.id }}{{t.name}}/a/li{% endfor %}/ul/div/div/li/ul/lilia href/goodsrecommend_list?type2 {% if flag 3 and t 2 %} classactive {% endif %}热销/a/lilia href/goodsrecommend_list?type3 {% if flag 3 and t 3 %} classactive {% endif %}新品/a/li{% if user %}lia href/order_list {% if flag 5 %} classactive {% endif %}我的订单/a/lilia href/user_center.jsp {% if flag 4 %} classactive {% endif %}个人中心/a/lilia href/user_logout 退出/a/li{% else %}lia href/user_register.jsp {% if flag 10 %} classactive {% endif %}注册/a/lilia href/user_login.jsp {% if flag 9 %} classactive {% endif %}登录/a/li{% endif %}{% if user and user.isadmin %}lia href/admin/index.jsp target_blank后台管理/a/li{% endif %}/ul!--/.navbar-collapse--/div!--//navbar-header--/navdiv classheader-infodiv classheader-right search-boxa hrefjavascript:;span classglyphicon glyphicon-search aria-hiddentrue/span/adiv classsearchform classnavbar-form action/goods_searchinput typetext classform-control namekeywordbutton typesubmit classbtn btn-default{% if flag 7 %}active{% endif %} aria-labelLeft Align搜索/button/form/div/divdiv classheader-right carta hrefgoods_cart.jspspan classglyphicon glyphicon-shopping-cart{% if flag 8 %}active{% endif %} aria-hiddentruespan classcard_num{% if order %}{{ order.amount }}{% else %}0{% endif %}/span/span/a/divdiv classclearfix /div/divdiv classclearfix /div/div
/div
foot.html
div classfooterdiv classcontainerdiv classtext-center/div/div
/divindex.html
!DOCTYPE html
html
head{% load static %}title首页/titlemeta nameviewport contentwidthdevice-width, initial-scale1meta http-equivContent-Type contenttext/html; charsetutf-8link typetext/css relstylesheet href{% static css/bootstrap.css %}link typetext/css relstylesheet href{% static css/style.css %}script typetext/javascript src{% static js/jquery.min.js %}/scriptscript typetext/javascript src{% static js/bootstrap.min.js %}/scriptscript typetext/javascript src{% static layer/layer.js %}/scriptscript typetext/javascript src{% static js/cart.js %}/script
/head
body
!--header--
{% include header.html with flag1 typeListtypeList %}
!--banner--div classbannerdiv classcontainerdiv idcarousel-example-generic classcarousel slide data-ridecarousel!-- Indicators --ol classcarousel-indicators idolnum{% for g in scroll %}{% if forloop.first %}li data-target#carousel-example-generic data-slide-to0 classactive/li{% else %}li data-target#carousel-example-generic data-slide-to{{ forloop.counter0 }}/li{% endif %}{% endfor %}/ol!-- Wrapper for slides --div classcarousel-inner rolelistbox idlunbotu stylewidth: 1242px; height: 432px;{% for g in scroll %}{% if forloop.first %}div classitem activeh2 classhdnga href/goods_detail?id{{ g.id }}{{ g.name }}/aspan/span/h2p今日精选推荐/pa classbanner_a hrefjavascript:; onclickbuy({{ g.id }})立刻购买/adiv classbanner-texta href/goods_detail?id{{ g.id }}img src{% static g.cover %} alt{{ g.name }} width350 height350/a/div/div{% else %}div classitemh2 classhdnga href/goods_detail?id{{ g.id }}{{ g.name }}/aspan/span/h2p今日精选推荐/pa classbanner_a hrefjavascript:; onclickbuy({{ g.id }})立刻购买/adiv classbanner-texta href/goods_detail?id{{ g.id }}img src{% static g.cover %} alt{{ g.name }} width350 height350/a/div/div{% endif %}{% endfor %}/div/div/div
/div!--//banner--div classsubscribe2/div!--gallery--
div classgallerydiv classcontainerdiv classalert alert-danger热销推荐/divdiv classgallery-grids{% for g in hotList %}div classcol-md-4 gallery-grid glry-twoa href/goods_detail?id{{ g.id }}img src{% static g.cover %} classimg-responsive alt{{ g.name }} width350 height350//adiv classgallery-info galrr-info-twopspan classglyphicon glyphicon-eye-open aria-hiddentrue/spana href/goods_detail?id{{ g.id }}查看详情/a/pa classshop hrefjavascript:; onclickbuy({{ g.id }})立刻购买/adiv classclearfix/div/divdiv classgaly-infop{{ g.typeName }} {{ g.name }}/pdiv classgalrydiv classpricesh5 classitem_price¥ {{ g.price }}/h5/divdiv classclearfix/div/div/div/div{% endfor %}/divdiv classclearfix/divdiv classalert alert-info新品推荐/divdiv classgallery-grids{% for g in newList %}div classcol-md-3 gallery-grid a href/goods_detail?id{{ g.id }}img src{% static g.cover %} classimg-responsive alt{{ g.name }}//adiv classgallery-infopspan classglyphicon glyphicon-eye-open aria-hiddentrue/spana href/goods_detail?id{{ g.id }}查看详情/a/pa classshop hrefjavascript:; onclickbuy({{ g.id }})立刻购买/adiv classclearfix/div/divdiv classgaly-infop{{ g.typeName }} {{ g.name }}/pdiv classgalrydiv classpricesh5 classitem_price¥ {{ g.price }}/h5/divdiv classclearfix/div/div/div/div{% endfor %}/div/div
/div
!--//gallery--!--subscribe--
div classsubscribe/div
!--//subscribe--
!--footer--
{% include footer.html %}
/body
/html
在主项目的urls.py文件中定义请求地址用于浏览器访问views.py文件 path(,views.index), 在PyCharm的内置dos窗口中输入以下指令启动服务器
python manage.py runserver
浏览器中访问该地址
