Merge branch 'aureplop/kpsul_js_refactor' into aureplop/js_basket

kfet/static/kfet/js/history.js

@@ -5,53 +5,12 @@ class KHistory {
     static get default_options() {
         return {
             'templates': {
-                'purchase': `
+                'purchase': '<div class="ope"><span class="amount"></span><span class="infos1"></span><span class="infos2"></span><span class="addcost"></span><span class="canceled"></span></div>',
-                    <div class="ope">
+                'specialope': '<div class="ope"><span class="amount"></span><span class="infos1"></span><span class="infos2"></span><span class="addcost"></span><span class="canceled"></span></div>',
-                        <span class="amount"></span>
+                'opegroup': '<div class="opegroup"><span class="time"></span><span class="trigramme"></span><span class="amount"></span><span class="valid_by"></span><span class="comment"></span></div>',
-                        <span class="infos1"></span>
+                'transfergroup': '<div class="opegroup"><span class="time"></span><span class="infos"></span><span class="valid_by"></span><span class="comment"></span></div>',
-                        <span class="infos2"></span>
+                'day': '<div class="day"><span class="date"></span></div>',
-                        <span class="addcost"></span>
+                'transfer': '<div class="ope"><span class="amount"></span><span class="infos1"></span><span class="glyphicon glyphicon-arrow-right"></span><span class="infos2"></span><span class="canceled"></span></div>',
-                        <span class="canceled"></span>
-                    </div>
-                    `,
-                'specialope': `
-                    <div class="ope">
-                        <span class="amount"></span>
-                        <span class="infos1"></span>
-                        <span class="infos2"></span>
-                        <span class="addcost"></span>
-                        <span class="canceled"></span>
-                    </div>
-                    `,
-                'opegroup': `
-                    <div class="opegroup">
-                        <span class="time"></span>
-                        <span class="trigramme"></span>
-                        <span class="amount"></span>
-                        <span class="valid_by"></span>
-                        <span class="comment"></span>
-                    </div>`,
-                'transfergroup': `
-                    <div class="opegroup">
-                        <span class="time"></span>
-                        <span class="infos"></span>
-                        <span class="valid_by"></span>
-                        <span class="comment"></span>
-                    </div>
-                    `,
-                'day': `
-                    <div class="day">
-                        <span class="date"></span>
-                    </div>
-                    `,
-                'transfer': `
-                    <div class="ope">
-                        <span class="amount"></span>
-                        <span class="infos1"></span>
-                        <span class="glyphicon glyphicon-arrow-right"></span>
-                        <span class="infos2"></span>
-                        <span class="canceled"></span>
-                    </div>`,
             },
 
             'api_options': {
@@ -78,14 +37,7 @@ class KHistory {
 
         var templates = all_options.templates;
         if (all_options.no_trigramme)
-            templates['opegroup'] = `
+            templates['opegroup'] = '<div class="opegroup"><span class="time"></span><span class="amount"></span><span class="valid_by"></span><span class="comment"></span></div>';
-                <div class="opegroup">
-                    <span class="time"></span>
-                    <span class="amount"></span>
-                    <span class="valid_by"></span>
-                    <span class="comment"></span>
-                </div>
-                `;
 
         this.display = new ForestDisplay(this._$container, templates, this.data);
 
@@ -138,27 +90,48 @@ class KHistory {
     is_valid(opegroup) {
         var options = this.api_options;
 
-        if (options.from && dateUTCToParis(opegroup.at).isBefore(moment(options.from)))
+        if (options.from && dateUTCToParis(opegroup.content.at).isBefore(moment(options.from)))
             return false;
 
-        if (options.to && dateUTCToParis(opegroup.at).isAfter(moment(options.to)))
+        if (options.to && dateUTCToParis(opegroup.content.at).isAfter(moment(options.to)))
             return false;
 
-        if (options.transfersonly && opegroup.constructor.verbose_name == 'opegroup')
+        var accounts_filter = options.accounts && options.accounts.length;
+        var checkouts_filter = options.checkouts && options.checkouts.length;
+
+        if (opegroup.modelname == 'opegroup') {
+
+            if (options.transfersonly)
                 return false;
 
-        if (options.opesonly && opegroup.constructor.verbose_name == 'transfergroup')
+            if (accounts_filter && options.accounts.indexOf(opegroup.content.account_id) < 0)
                 return false;
 
-        if (options.accounts && options.accounts.length &&
+            if (checkouts_filter && options.checkouts.indexOf(opegroup.content.checkout_id) < 0)
-                options.accounts.indexOf(opegroup.account_id) < 0)
                 return false;
 
-        if (options.checkouts && options.checkouts.length &&
+        } else if (opegroup.modelname == 'transfergroup') {
-                (opegroup.modelname == 'transfergroup' ||
+
-                 options.checkouts.indexOf(opegroup.checkout_id) < 0))
+            if (options.opesonly)
                 return false;
 
+            if (checkouts_filter)
+                return false;
+
+            if (accounts_filter) {
+                opegroup.content.children =
+                    opegroup.content.children.filter( function(transfer) {
+                        var is_from_in =
+                            options.accounts.indexOf(transfer.content.from_acc_id) >= 0;
+                        var is_to_in =
+                            options.accounts.indexOf(transfer.content.to_acc_id) >= 0;
+                        return is_from_in || is_to_in;
+                    });
+                if (opegroup.content.children.length == 0)
+                    return false;
+            }
+        }
+
         return true;
     }
 

kfet/static/kfet/js/kpsul.js

@@ -70,21 +70,9 @@ class AccountManager {
         // buttons: search, read or create
         this._$buttons_container = this._$container.find('.buttons');
         this._buttons_templates = {
-            create: template`
+            create: template`<a href="${'url'}" class="btn btn-primary" target="_blank" title="Créer ce compte"><span class="glyphicon glyphicon-plus"></span></a>`,
-                <a href="${'url'}" class="btn btn-primary" target="_blank" title="Créer ce compte">
+            read: template`<a href="${'url'}" class="btn btn-primary" target="_blank" title="Détails du compte"><span class="glyphicon glyphicon-info-sign"></span></a>`,
-                    <span class="glyphicon glyphicon-plus"></span>
+            search: template`<button class="btn btn-primary search" title="Rechercher"><span class="glyphicon glyphicon-search"></span></button>`,
-                </a>
-            `,
-            read: template`
-                <a href="${'url'}" class="btn btn-primary" target="_blank" title="Détails du compte">
-                    <span class="glyphicon glyphicon-info-sign"></span>
-                </a>
-            `,
-            search: template`
-                <button class="btn btn-primary search" title="Rechercher">
-                    <span class="glyphicon glyphicon-search"></span>
-                </button>
-            `,
         };
 
     }
@@ -213,10 +201,7 @@ class AccountSearch {
     constructor(manager) {
         this.manager = manager;
 
-        this._content = `
+        this._content = '<input type="text" name="q" id="search_autocomplete" autocomplete="off" spellcheck="false" autofocus><div id="account_results"></div>';
-            <input type="text" name="q" id="search_autocomplete" autocomplete="off" spellcheck="false" autofocus>
-            <div id="account_results"></div>
-        `;
         this._input = '#search_autocomplete';
         this._results_container = '#account_results';
 
@@ -310,16 +295,8 @@ class CheckoutManager {
 
         this._$buttons_container = this._$container.find('.buttons');
         this._buttons_templates = {
-            read: template`
+            read: template`<a class="btn btn-primary" href="${'url'}" title="En savoir plus" target="_blank"><span class="glyphicon glyphicon-info-sign"></span></a>`,
-                <a class="btn btn-primary" href="${'url'}" title="En savoir plus" target="_blank">
+            statement_create: template`<a href="${'url'}" title="Effectuer un relevé" class="btn btn-primary" target="_blank"><span class="glyphicon glyphicon-euro"></span></a>`,
-                    <span class="glyphicon glyphicon-info-sign"></span>
-                </a>
-            `,
-            statement_create: template`
-                <a href="${'url'}" title="Effectuer un relevé" class="btn btn-primary" target="_blank">
-                    <span class="glyphicon glyphicon-euro"></span>
-                </a>
-            `,
         };
     }
 
@@ -462,18 +439,8 @@ class ArticleManager {
         this.data = new ArticleList();
         var $container = $('#articles_data');
         var templates = {
-            category: `
+            category: '<div class="category"><span class="name"></span></div>',
-                <div class="category">
+            article: '<div class="article"><span class="name"></span><span class="price"></span><span class="stock"></span></div>',
-                    <span class="name"></span>
-                </div>
-            `,
-            article: `
-                <div class="article">
-                    <span class="name"></span>
-                    <span class="price"></span>
-                    <span class="stock"></span>
-                </div>
-            `,
         };
         this.display = new ForestDisplay($container, templates, this.data);
         this.autocomplete = new ArticleAutocomplete(this, $container);

kfet/templates/kfet/history.html

@@ -94,7 +94,8 @@ $(document).ready(function() {
         if ($checkouts)
             data['checkouts'] = checkouts;
         var accounts = getSelectedMultiple($accounts);
-            data['accounts'] = accounts;
+        if (accounts)
+            data['accounts'] = accounts.map(id => parseInt(id));
 
         // Update history
         khistory.fetch(data);

kfet/views.py

@@ -1798,22 +1798,29 @@ def perform_transfers(request):
     websocket_data['opegroups'] = [{
         'add': True,
         'modelname': 'transfergroup',
+        'content': {
             'id': transfergroup.pk,
             'at': transfergroup.at,
             'comment': transfergroup.comment,
             'valid_by__trigramme': (transfergroup.valid_by and
                                     transfergroup.valid_by.trigramme or None),
-        'opes': [],
+            'children': []
+        },
     }]
     for transfer in transfers:
         ope_data = {
+            'modelname': 'transfer',
+            'content': {
                 'id': transfer.pk,
                 'amount': transfer.amount,
                 'from_acc': transfer.from_acc.trigramme,
                 'to_acc': transfer.to_acc.trigramme,
                 'canceled_by__trigramme': None, 'canceled_at': None,
+                'from_acc_id': transfer.from_acc.id,
+                'to_acc_id': transfer.to_acc.id,
+            },
         }
-        websocket_data['opegroups'][0]['opes'].append(ope_data)
+        websocket_data['opegroups'][0]['content']['children'].append(ope_data)
 
     consumers.KPsul.group_send('kfet.kpsul', websocket_data)
     return JsonResponse(data)