Django+Semantic-UI+MongoDB的一个小实例 

 1 from django.db import models
 2 
 3 # Create your models here.
 4 from mongoengine import *
 5 from mongoengine import connect
 6 connect('data_sample', host='localhost', port=27017)
 7 
 8 class ItemInfo(Document):
 9     pub_date = StringField()
10     title = StringField()
11     url = StringField()
12     look = StringField()
13     cates = ListField(StringField())
14     price = IntField()
15     area = ListField(StringField())
16 
17 # for i in ItemInfo.objects:
18 #     print(i.title, i.url, i.area)
 1 from django.shortcuts import render
 2 from web_pure.models import ItemInfo
 3 from django.core.paginator import Paginator
 4 
 5 # Create your views here.
 6 def pure_index(request):
 7     return render(request,'pure_index.html')
 8 
 9 def home(request):
10     limit = 10
11     item_info = ItemInfo.objects
12     paginatior = Paginator(item_info,limit)
13     page = request.GET.get('page',1)
14     print(request)
15     print(request.GET)
16     loaded = paginatior.page(page)
17 
18     context = {
19         'ItemInfo':loaded,
20     }
21 
22     return render(request,'pure_index_paginator.html',context)
Views
{% load static %}
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A layout example that shows off a blog page with a list of posts.">

    <title>Blog &ndash; Layout Examples &ndash; Pure</title>

    <link rel="stylesheet" type="text/css" href="{% static 'semantic/dist/semantic.min.css' %}">
    <script src="{% static 'semantic/dist/jquery.min.js' %}"></script>
    <script src="{% static 'semantic/dist/semantic.min.js' %}"></script>


</head>
<body>
    <div class="ui left visible thin sidebar inverted vertical menu">
        <div class="header item">
            <img src="{% static 'images/logo2.png' %}">
        </div>
        <div class="item">
            Doucument
            <i class="browser icon"></i>
        </div>
        <div class="item">
            Charts
            <i class="bar chart icon"></i>
        </div>
        <div class="item">
            Others
            <i class="idea icon"></i>
        </div>
    </div>
    <div class="pusher">
        <div class="ui menu">
            <div class="header item" id="menu">
                Menu
                <i class="content icon"></i>
            </div>
            <div class="item">
                About us
            </div>
            <div class="item">
                Location
            </div>
            <div class="item">
                Others
            </div>
        </div>
        <div class="ui container">
            <div class="ui items">
                {% for item in ItemInfo %}
                <div class="item">
                    <div class="content">
                        <div class="header">
                            <h3>￥{{ item.price }} - {{ item.pub_date }}</h3>
                            <p class="post-meta">
                            {% for a in item.area %}
                            <a class="post-category post-category-design" href="#">{{ a }}</a>
                            {% endfor %}
                        </p>
                        </div>
                        <div class="description">
                            <p>
                                {{ item.title }}
                            </p>
                        </div>
                        <div class="extra">
                            {% for cate in item.cates %}
                            <div class="ui label">
                                {{ cate }}
                            </div>
                            {% endfor %}

                        </div>
                    </div>
                </div>
                {% endfor %}
            </div>
            <div class="ui pagination menu">
                {% if ItemInfo.has_previous %}
                <a class="item" href="?page={{ ItemInfo.previous_page_number }}"> < </a>
                {% endif %}
                <div class="disabled item">
                    {{ ItemInfo.number }} of {{ ItemInfo.paginator.num_pages }}
                </div>
                {% if ItemInfo.has_next %}
                <a class="item" href="?page={{ ItemInfo.next_page_number }}"> > </a>
                {% endif %}
            </div>

        </div>
    </div>


    <script>
    $('#menu').click(function () {
        $('.ui.sidebar').sidebar('toggle');
    });
</script>
</body>
</html>
Index

 

posted @ 2018-04-24 16:59  banshaohuan  阅读(459)  评论(0)    收藏  举报