Node blogging -- display and paging of registered user data for background management

Keywords: Database less

1. Requirements: when clicking user management in the navigation bar, the information of all users will be displayed directly

2. Add user management route in admin.js

var User=require('../models/User');
//Add a user management route
router.get('/user',function (req,res) {
    //
    //Read all user data from the database
    //
    User.find().then(function (users) {
        res.render('admin/user_index',{
            userInfo:req.userInfo,
            users:users
        })
    });

})

3. Add a user? Index.html page in view/admin to display user information

{%extends 'layout.html' %}
{% block main%}
<ol class="breadcrumb">
    <li><a href="/">Management home page</a></li>
    <li><span>User list</span></a></li>
</ol>
<h3>User list</h3>
<table class="table table-hover table-striped">

    <tr>
        <th>ID</th>
        <th>User name</th>
        <th>Password</th>
        <th>Administrator or not</th>
    </tr>
    {% for user in users%}
    <tr>
        <td>{{user._id.toString()}}</td>
        <td>{{user.username}}</td>
        <td>{{user.password}}</td>
        <td>
            {%if user.isAdmin%}
            yes
            {%endif%}
        </td>
    </tr>
    {% endfor %}
</table>
{% endblock %}

4. To implement paging, you need to borrow a limit() operation from the database to limit the number of data items obtained. In admin.js

//Add a user management route
router.get('/user',function (req,res) {
    //
    //Read all user data from the database
    //limit(Number): limit the number of data acquired
    //skip(2): ignore the number of data
    //
    //2 per page,
    // 1: 1-2 skip: 0; - > current page 1*limit
    // 2:3-4 skip:2
    //
    var page = Number(req.query.page || 1);//In the actual process, it is necessary to determine whether the page is a numerical value
    //Limit the value of page
    var limit =2;
    var pages=0;
    //Get the total number of data records in the database
    User.count().then(function (count) {
        //Calculate total pages
        pages=Math.ceil(count/limit);//Rounding up
        //Value cannot exceed pages
        page=Math.min(page,pages);
        //Value cannot be less than 1
        page=Math.max(page,1);

        var skip = (page-1)*limit;

        User.find().limit(2).skip(skip).then(function (users) {
            res.render('admin/user_index',{
                userInfo:req.userInfo,
                users:users,

                count:count,
                page:page,//Pass it to the template to show which page is the current page
                pages:pages,
                limit:limit
            })
        });
    });
});

5. Add up and down page dynamic information to user-index.html

<nav>
    <ul class="pager">
        <li class="previous"><a href="/admin/user?page={{page-1}}"><span aria-hidden="true">&larr;</span> Previous page</a></li>
        <li>
            Altogether {{count}} Data, display per page {{limit}} Data, total {{pages}} Page, current page {{page}} page
        </li>
        <li class="next"><a href="/admin/user?page={{page+1}}">next page<span aria-hidden="true">&rarr;</span></a></li>
    </ul>
</nav>

6. We can encapsulate the up and down page dynamic information in uder_index.html, and put this code into a new page.html

Include it in user_index.html. You can import paging page.html into any page

[note] you must include count, limit, pages and page in the reference page.html

<! -- include another page in the form of reference and subset -- >
{%include 'page.html'%}

 

Posted by mikeglaz on Wed, 01 Jan 2020 15:20:24 -0800