Merge pull request #3576 from marshmalien/feat-toolbar-sort-template-list

Add sort toolbar to template lists Reviewed-by: https://github.com/softwarefactory-project-zuul[bot]
2026-01-12 10:30:03 -03:30 · 2019-04-03 19:32:38 +00:00 · 2019-04-03 19:32:38 +00:00 · cfa2eabb57
commit cfa2eabb57
parent 2bda81661e 4e4afb4a98
8 changed files with 94 additions and 24 deletions
--- a/awx/ui/client/features/templates/routes/organizationsTemplatesList.route.js
+++ b/awx/ui/client/features/templates/routes/organizationsTemplatesList.route.js
@ -21,7 +21,11 @@ export default {
        template_search: {
            dynamic: true,
            value: {
-                type: 'workflow_job_template,job_template',
+                type: 'job_template',
+                order_by: 'name',
+                page_size: '20',
+                or__jobtemplate__project__organization: null,
+                or__jobtemplate__inventory__organization: null
            },
        }
    },
@ -60,11 +64,11 @@ export default {
            ($stateParams, Wait, GetBasePath, qs) => {
                const searchPath = GetBasePath('unified_job_templates');

-                const searchParam = _.assign($stateParams.template_search, {
-                    or__project__organization: $stateParams.organization_id,
-                    or__jobtemplate__inventory__organization: $stateParams.organization_id,
-                });
-
+                const searchParam = Object.assign(
+                    $stateParams.template_search, {
+                    or__jobtemplate__project__organization: $stateParams.organization_id,
+                    or__jobtemplate__inventory__organization: $stateParams.organization_id}
+                );
                Wait('start');
                return qs.search(searchPath, searchParam)
                    .finally(() => Wait('stop'));
--- a/awx/ui/client/features/templates/routes/projectsTemplatesList.route.js
+++ b/awx/ui/client/features/templates/routes/projectsTemplatesList.route.js
@ -6,11 +6,15 @@ const templatesListTemplate = require('~features/templates/templatesList.view.ht
 export default {
    url: "/templates",
    name: 'projects.edit.templates',
+    searchPrefix: 'template',
    params: {
        template_search: {
            dynamic: true,
            value: {
-                type: 'workflow_job_template,job_template',
+                type: 'job_template',
+                order_by: 'name',
+                page_size: '20',
+                jobtemplate__project: null
            },
        }
    },
--- a/awx/ui/client/features/templates/routes/templatesList.route.js
+++ b/awx/ui/client/features/templates/routes/templatesList.route.js
@ -25,6 +25,8 @@ export default {
            dynamic: true,
            value: {
                type: 'workflow_job_template,job_template',
+                order_by: 'name',
+                page_size: '20'
            },
        }
    },
--- a/awx/ui/client/features/templates/templates.strings.js
+++ b/awx/ui/client/features/templates/templates.strings.js
@ -143,6 +143,11 @@ function TemplatesStrings (BaseString) {
        CANCEL: t.s('CANCEL'),
        SAVE_AND_EXIT: t.s('SAVE & EXIT')
    };
+
+    ns.sort = {
+        NAME_ASCENDING: t.s('Name (Ascending)'),
+        NAME_DESCENDING: t.s('Name (Descending)')
+    };
 }

 TemplatesStrings.$inject = ['BaseStringService'];
--- a/awx/ui/client/features/templates/templatesList.controller.js
+++ b/awx/ui/client/features/templates/templatesList.controller.js
@ -36,6 +36,7 @@ function ListTemplatesController(
    let refreshAfterLaunchClose = false;
    let pendingRefresh = false;
    let refreshTimerRunning = false;
+    let paginateQuerySet = {};

    vm.strings = strings;
    vm.templateTypes = mapChoices(choices);
@ -61,6 +62,39 @@ function ListTemplatesController(
    };
    vm.dataset = Dataset.data;
    vm.templates = Dataset.data.results;
+    vm.defaultParams = $state.params.template_search;
+
+    const toolbarSortDefault = {
+        label: `${strings.get('sort.NAME_ASCENDING')}`,
+        value: 'name'
+    };
+
+    vm.toolbarSortOptions = [
+        toolbarSortDefault,
+        { label: `${strings.get('sort.NAME_DESCENDING')}`, value: '-name' }
+    ];
+
+    vm.toolbarSortValue = toolbarSortDefault;
+
+    $scope.$on('updateDataset', (event, dataset, queryset) => {
+        paginateQuerySet = queryset;
+    });
+
+    vm.onToolbarSort = (sort) => {
+        vm.toolbarSortValue = sort;
+
+        const queryParams = Object.assign(
+            {},
+            $state.params.template_search,
+            paginateQuerySet,
+            { order_by: sort.value }
+        );
+
+        // Update params
+        $state.go('.', {
+            template_search: queryParams
+        }, { notify: false, location: 'replace' });
+    };

    $scope.$watch('vm.dataset.count', () => {
        $scope.$emit('updateCount', vm.dataset.count, 'templates');
@ -75,6 +109,7 @@ function ListTemplatesController(
        } else {
            vm.activeId = "";
        }
+        setToolbarSort();
    }, true);

    $scope.$on(`ws-jobs`, () => {
@ -203,15 +238,25 @@ function ListTemplatesController(
        }
    };

+    function setToolbarSort () {
+        const orderByValue = _.get($state.params, 'template_search.order_by');
+        const sortValue = _.find(vm.toolbarSortOptions, (option) => option.value === orderByValue);
+        if (sortValue) {
+            vm.toolbarSortValue = sortValue;
+        } else {
+            vm.toolbarSortValue = toolbarSortDefault;
+        }
+    }
+
    function refreshTemplates() {
        Wait('start');
        let path = GetBasePath('unified_job_templates');
        qs.search(path, $state.params.template_search, { 'X-WS-Session-Quiet': true })
-            .then(function(searchResponse) {
-                vm.dataset = searchResponse.data;
-                vm.templates = vm.dataset.results;
-            })
-            .finally(() => Wait('stop'));
+        .then(function(searchResponse) {
+            vm.dataset = searchResponse.data;
+            vm.templates = vm.dataset.results;
+        })
+        .finally(() => Wait('stop'));
        pendingRefresh = false;
        refreshTimerRunning = true;
        $timeout(() => {
--- a/awx/ui/client/features/templates/templatesList.view.html
+++ b/awx/ui/client/features/templates/templatesList.view.html
@ -8,6 +8,7 @@
            list="vm.list"
            collection="vm.templates"
            dataset="vm.dataset"
+            default-params="vm.defaultParams"
            search-tags="vm.searchTags"
            search-bar-full-width="vm.isPortalMode">
        </smart-search>
@ -33,10 +34,13 @@
    </div>
    <at-list-toolbar
        ng-if="vm.templates.length > 0"
-        sort-only="false"
-        on-collapse="vm.onCollapse"
        on-expand="vm.onExpand"
-        is-collapsed="vm.isCollapsed">
+        on-collapse="vm.onCollapse"
+        is-collapsed="vm.isCollapsed"
+        sort-only="false"
+        sort-value="vm.toolbarSortValue"
+        sort-options="vm.toolbarSortOptions"
+        on-sort="vm.onToolbarSort">
    </at-list-toolbar>
    <at-list results="vm.templates" id="templates_list">
        <at-row ng-repeat="template in vm.templates"
--- a/awx/ui/client/src/organizations/list/organizations-list.controller.js
+++ b/awx/ui/client/src/organizations/list/organizations-list.controller.js
@ -43,45 +43,50 @@ export default ['$stateParams', '$scope', '$rootScope',

        function parseCardData(cards) {
            return cards.map(function(card) {
-                var val = {},
-                    url = '/#/organizations/' + card.id + '/';
+                var val = {};
                val.user_capabilities = card.summary_fields.user_capabilities;
                val.name = card.name;
                val.id = card.id;
                val.description = card.description || undefined;
                val.links = [];
                val.links.push({
-                    href: url + 'users',
+                    sref: `organizations.users({organization_id: ${card.id}})`,
+                    srefOpts: { inherit: false },
                    name: i18n._("USERS"),
                    count: card.summary_fields.related_field_counts.users,
                    activeMode: 'users'
                });
                val.links.push({
-                    href: url + 'teams',
+                    sref: `organizations.teams({organization_id: ${card.id}})`,
+                    srefOpts: { inherit: false },
                    name: i18n._("TEAMS"),
                    count: card.summary_fields.related_field_counts.teams,
                    activeMode: 'teams'
                });
                val.links.push({
-                    href: url + 'inventories',
+                    sref: `organizations.inventories({organization_id: ${card.id}})`,
+                    srefOpts: { inherit: false },
                    name: i18n._("INVENTORIES"),
                    count: card.summary_fields.related_field_counts.inventories,
                    activeMode: 'inventories'
                });
                val.links.push({
-                    href: url + 'projects',
+                    sref: `organizations.projects({organization_id: ${card.id}})`,
+                    srefOpts: { inherit: false },
                    name: i18n._("PROJECTS"),
                    count: card.summary_fields.related_field_counts.projects,
                    activeMode: 'projects'
                });
                val.links.push({
-                    href: url + 'job_templates',
+                    sref: `organizations.job_templates({organization_id: ${card.id}, or__jobtemplate__project__organization: ${card.id}, or__jobtemplate__inventory__organization: ${card.id}})`,
+                    srefOpts: { inherit: false },
                    name: i18n._("JOB TEMPLATES"),
                    count: card.summary_fields.related_field_counts.job_templates,
                    activeMode: 'job_templates'
                });
                val.links.push({
-                    href: url + 'admins',
+                    sref: `organizations.admins({organization_id: ${card.id}})`,
+                    srefOpts: { inherit: false },
                    name: i18n._("ADMINS"),
                    count: card.summary_fields.related_field_counts.admins,
                    activeMode: 'admins'
--- a/awx/ui/client/src/organizations/list/organizations-list.partial.html
+++ b/awx/ui/client/src/organizations/list/organizations-list.partial.html
@ -83,7 +83,8 @@
                                {{ link.count }}
                            </span>
                            <a class="OrgCards-linkName"
-                                ng-href="{{ link.href }}">
+                                ui-sref="{{ link.sref }}"
+                                ui-sref-opts="{{ link.srefOpts }}">
                                {{ link.name }}
                            </a>
                        </div>