Update users

myapp/ns_api/user.py

@@ -5,16 +5,75 @@ __email__ = 'remizoffalex@mail.ru'
 __url__ = 'https://remizoffalex.ru'
 
 from . import jsonrpc, login_required
-from .. import models
+from .. import app, lib, models
 
 
-@jsonrpc.method('users')
+@jsonrpc.method('user.pages(id=int, page=int)')
-def users_list():
+def user_pages_list(id, page):
+    """Список статей пользователя
+    """
+    user = models.db_session.query(
+        models.User
+    ).filter(
+        models.User.id==id
+    ).first()
+    if user is None:
+        raise ValueError
+    pages = models.db_session.query(
+        models.Page
+    ).filter(
+        models.Page.user_id==id
+    ).order_by(
+        models.Page.title.asc()
+    )
+    pages = lib.getpage(
+        pages,
+        page,
+        app.config['ITEMS_ON_PAGE']
+    ).all()
+
+    result = []
+    for page in pages:
+        newRow = page.as_dict()
+        newRow['user'] = page.user.as_dict()
+        newRow['tags'] = []
+        for tagLink in page.tags:
+            newRow['tags'].append(tagLink.tag.as_dict())
+        result.append(newRow)
+    return result
+
+
+@jsonrpc.method('user.pages.count(id=int)')
+def user_pages_count(id):
+    """Общее количество статей
+    """
+    user = models.db_session.query(
+        models.User
+    ).filter(
+        models.User.id==id
+    ).first()
+    if user is None:
+        raise ValueError
+    result = models.db_session.query(
+        models.Page
+    ).filter(
+        models.Page.user_id==id
+    ).count()
+    return result
+
+
+@jsonrpc.method('users(page=int)')
+def users_list(page):
     """
     Показать список пользователей
     """
     users = models.db_session.query(
         models.User
+    )
+    users = lib.getpage(
+        users,
+        page,
+        app.config['ITEMS_ON_PAGE']
     ).all()
 
     result = []

myapp/ns_page/templates/user/pages.html

@@ -5,11 +5,14 @@
 <div class="float-right">
 <a class="btn btn-outline-success" href="/page/add"><i class="fa fa-plus"></i></a>
 </div>
+<button type="button" class="btn btn-outline-secondary" v-on:click="showPanel(panels.filter)"><i class="fa fa-filter"></i></button>
 
 Статьи
 </h3>
 <hr />
 
+{% include 'inc/filter.html' %}
+
 <pagination-component v-bind:pagination="pagination" v-bind:click-handler="getPages"></pagination-component>
 
 <div class="row" v-if="firstAlpha">
@@ -35,10 +38,38 @@
 var app = new Vue({
     el: '#app',
     data: {
+        filter: '',
         pages: [],
         pagination: {{ pagedata['pagination']|tojson|safe }},
+        panels: {
+            filter: {
+                visible: false
+            }
+        },
     },
     methods: {
+        arrayRemove: function(arr, value) {
+            /* Удаление элемента из списка */
+            return arr.filter(function(ele){
+                return ele != value;
+            });
+        },
+        filterApply: function() {},
+        filterClear: function() {
+            /* Очистить фильтр */
+            let vm = this;
+            vm.filter = '';
+        },
+        filterPage: function(page) {
+            let vm = this;
+            if ( vm.filter.length<1 ) {
+                return true;
+            }
+            if ( page.title.toLowerCase().includes(vm.filter.toLowerCase()) ) {
+                return true;
+            }
+            return false;
+        },
         getPages: function() {
             /* Получить список статей */
             let vm = this;
@@ -60,6 +91,10 @@ var app = new Vue({
                 }
             );
         },
+        showPanel: function(panel) {
+            /* Показать/скрыть панель */
+            panel.visible = !panel.visible;
+        },
     },
     created: function() {
         let vm = this;
@@ -93,6 +128,12 @@ var app = new Vue({
         );
     },
     computed: {
+        filteredPages: function() {
+            /* Отфильтрованный список */
+            let vm = this;
+            var result = vm.pages.filter(vm.filterPage);
+            return result; 
+        },
         firstAlpha: function() {
             /* Получить первый символ */
             let vm = this;

myapp/ns_user/templates/user.html

@@ -6,6 +6,12 @@
 <a class="btn btn-outline-secondary" href="/users"><i class="fa fa-chevron-left"></i></a>
 {{ user.name }}</h3>
 <hr />
+{% endraw %}
+
+{% include 'user_menu.html' %}
+{% raw %}
+
+Зарегистрирован: {{ user.created }}
 
 {% endraw %}
 
@@ -30,6 +36,7 @@
 var app = new Vue({
     el: '#app',
     data: {
+        menuitem: null,
         user: {{ pagedata['user']|tojson|safe }},
     },
     methods: {

myapp/ns_user/templates/user_menu.html

@@ -0,0 +1,13 @@
+<div class="row">
+<div class="col">
+
+<div class="btn btn-primary mb-2" v-if="menuitem===null"><i class="fa fa-bars"></i></div>
+<a class="btn btn-outline-secondary mb-2" :href="'/user/' + user.id" v-else><i class="fa fa-bars"></i></a>
+
+
+<div class="btn btn-primary mb-2" v-if="menuitem==='pages'">Статьи</div>
+<a class="btn btn-outline-secondary mb-2" :href="'/user/' + user.id + '/pages'" v-else>Статьи</a>
+
+</div>
+</div>
+<hr />

myapp/ns_user/templates/user_pages.html

@@ -0,0 +1,132 @@
+{% extends "skeleton.html" %}
+{% block content %}
+
+{% raw %}
+<h3>
+<a class="btn btn-outline-secondary" href="/users"><i class="fa fa-chevron-left"></i></a>
+{{ user.name }}</h3>
+<hr />
+{% endraw %}
+
+{% include 'user_menu.html' %}
+
+<pagination-component v-bind:pagination="pagination" v-bind:click-handler="getPages"></pagination-component>
+
+{% include 'inc/pages.html' %}
+
+<pagination-component v-bind:pagination="pagination" v-bind:click-handler="getPages"></pagination-component>
+
+<backtotop-component></backtotop-component>
+
+
+{% endblock %}
+
+{% block breadcrumb %}
+{% raw %}
+<ol class="breadcrumb mt-3">
+    <li class="breadcrumb-item"><a href="/"><i class="fa fa-home"></i></a></li>
+    <li class="breadcrumb-item"><a href="/user">Список пользователей</a></li>
+    <li class="breadcrumb-item">{{ user.name }}</li>
+</ol>
+{% endraw %}
+{% endblock %}
+
+{% block script %}
+<script type="text/javascript" src="/static/components/backtotop.js"></script>
+<link rel="stylesheet" href="/static/components/backtotop.css"></link>
+<script type="text/javascript" src="/static/components/pagination.js"></script>
+
+<script type="text/javascript">
+var app = new Vue({
+    el: '#app',
+    data: {
+        filter: '',
+        menuitem: 'pages',
+        user: {{ pagedata['user']|tojson|safe }},
+        pages: [],
+        pagination: {{ pagedata['pagination']|tojson|safe }},
+    },
+    methods: {
+        filterApply: function() {},
+        filterClear: function() {
+            /* Очистить фильтр */
+            let vm = this;
+            vm.filter = '';
+        },
+        filterPage: function(page) {
+            let vm = this;
+            if ( vm.filter.length<1 ) {
+                return true;
+            }
+            if ( page.title.toLowerCase().includes(vm.filter.toLowerCase()) ) {
+                return true;
+            }
+            return false;
+        },
+        getPages: function() {
+            /* Получить список статей */
+            let vm = this;
+            axios.post(
+                '/api',
+                {
+                    "jsonrpc": "2.0",
+                    "method": "pages",
+                    "params": {
+                        "page": vm.pagination.page
+                    },
+                    "id": 1
+                }
+            ).then(
+                function(response) {
+                    if ('result' in response.data) {
+                        vm.pages = response.data['result'];
+                    }
+                }
+            );
+        },
+    },
+    created: function() {
+        let vm = this;
+        axios.post(
+            '/api',
+            [
+                {
+                    "jsonrpc": "2.0",
+                    "method": "user.pages",
+                    "params": {
+                        "id": vm.user.id,
+                        "page": vm.pagination.page
+                    },
+                    "id": 1
+                },
+                {
+                    "jsonrpc": "2.0",
+                    "method": "user.pages.count",
+                    "params": {
+                        "id": vm.user.id,
+                    },
+                    "id": 1
+                }
+            ]
+        ).then(
+            function(response) {
+                if ('result' in response.data[0]) {
+                    vm.pages = response.data[0]['result'];
+                }
+                if ('result' in response.data[1]) {
+                    vm.pagination.size = response.data[1]['result'];
+                }
+            }
+        );
+    },
+    computed: {
+        filteredPages: function() {
+            /* Отфильтрованный список */
+            let vm = this;
+            var result = vm.pages.filter(vm.filterPage);
+            return result; 
+        },
+    },
+})
+</script>
+{% endblock %}

myapp/ns_user/templates/users.html

@@ -5,6 +5,8 @@
 <hr />
 
 {% raw %}
+<pagination-component v-bind:pagination="pagination" v-bind:click-handler="getUsers"></pagination-component>
+
 <div class="row" v-for="(user, userIdx) in users">
 <div class="col py-2">
 <a :href="'/user/' + user.id">{{ user.name }}</a>
@@ -18,6 +20,8 @@
 </div>
 {% endraw %}
 
+<pagination-component v-bind:pagination="pagination" v-bind:click-handler="getUsers"></pagination-component>
+
 <backtotop-component></backtotop-component>
 
 {% endblock %}
@@ -32,15 +36,17 @@
 {% block script %}
 <script type="text/javascript" src="/static/components/backtotop.js"></script>
 <link rel="stylesheet" href="/static/components/backtotop.css"></link>
+<script type="text/javascript" src="/static/components/pagination.js"></script>
 
 <script type="text/javascript">
 var app = new Vue({
     el: '#app',
     data: {
-        users: []
+        users: [],
+        pagination: {{ pagedata['pagination']|tojson|safe }},
     },
     methods: {
-        getUserList: function() {
+        getUsers: function() {
             let vm = this;
             axios.post(
                 '/api',
@@ -62,7 +68,34 @@ var app = new Vue({
     },
     created: function() {
         let vm = this;
-        vm.getUserList();
+        axios.post(
+            '/api',
+            [
+                {
+                    "jsonrpc": "2.0",
+                    "method": 'users',
+                    "params": {
+                        "page": vm.pagination.page
+                    },
+                    "id": 1
+                },
+                {
+                    "jsonrpc": "2.0",
+                    "method": 'users.count',
+                    "params": {},
+                    "id": 1
+                }
+            ]
+        ).then(
+            function(response) {
+                if ('result' in response.data[0]) {
+                    vm.users = response.data[0]['result'];
+                }
+                if ('result' in response.data[1]) {
+                    vm.pagination.size = response.data[1]['result'];
+                }
+            }
+        );
     }
 })
 </script>

myapp/ns_user/views.py

@@ -27,6 +27,31 @@ def user_id(id):
     return body
 
 
+@app.route('/user/<int:id>/pages')
+def user_pages(id):
+    """Список статей пользователя
+    """
+    pagedata = {}
+    user = models.db_session.query(
+        models.User
+    ).filter(
+        models.User.id==id
+    ).first()
+    if user is None:
+        abort(404)
+    pagedata['user'] = user.as_dict()
+    pagedata['title'] = '{} - {}'.format(user.name, app.config['TITLE'])
+
+    pagedata['pagination'] = {
+        "page": 1,
+        "per_page": app.config['ITEMS_ON_PAGE'],
+        "size": 0
+    }
+
+    body = render_template('user_pages.html', pagedata=pagedata)
+    return body
+
+
 @app.route('/users')
 def users():
     """
@@ -34,5 +59,12 @@ def users():
     """
     pagedata = {}
     pagedata['title'] = 'Список пользователей - ' + app.config['TITLE']
+
+    pagedata['pagination'] = {
+        "page": 1,
+        "per_page": app.config['ITEMS_ON_PAGE'],
+        "size": 0
+    }
+
     body = render_template('users.html', pagedata=pagedata)
     return body

myapp/templates/inc/pages.html

@@ -1,5 +1,5 @@
 {% raw %}
-<div class="row" v-for="(page, pageIdx) in pages">
+<div class="row" v-for="(page, pageIdx) in filteredPages">
 <div class="col py-2" :class="{'bg-light': pageIdx % 2}">
 <a :href="'/page/' + page.id">{{ page.title }}</a>