Browse Source

filter

tags/v0.1.0
Robin Thoni 7 years ago
parent
commit
3db7470b3d

+ 12
- 3
app/app.js View File

119
                 url:'/pkguids/add',
119
                 url:'/pkguids/add',
120
                 parent: 'root',
120
                 parent: 'root',
121
                 title: "New PkGuid",
121
                 title: "New PkGuid",
122
+                toolbarTitle: "PkGuid ~ New",
122
                 reloadOnSearch: false,
123
                 reloadOnSearch: false,
123
                 templateUrl:'views/pkguidedit.html',
124
                 templateUrl:'views/pkguidedit.html',
124
                 controller:'PkGuidEditController'
125
                 controller:'PkGuidEditController'
128
                 url:'/pkguids/edit/:id',
129
                 url:'/pkguids/edit/:id',
129
                 parent: 'root',
130
                 parent: 'root',
130
                 title: "Edit PkGuid",
131
                 title: "Edit PkGuid",
132
+                toolbarTitle: "PkGuid ~ Edit",
131
                 reloadOnSearch: false,
133
                 reloadOnSearch: false,
132
                 templateUrl:'views/pkguidedit.html',
134
                 templateUrl:'views/pkguidedit.html',
133
                 controller:'PkGuidEditController',
135
                 controller:'PkGuidEditController',
145
             }
147
             }
146
         };
148
         };
147
     }])
149
     }])
148
-    .run(['$rootScope', '$transitions', function ($rootScope, $transitions) {
149
-        $transitions.onSuccess({}, function($transitions)
150
+    .run(['$rootScope', '$transitions', 'AppUtilsBusiness', function ($rootScope, $transitions, AppUtilsBusiness) {
151
+        $transitions.onEnter({}, function($transitions)
150
         {
152
         {
151
             var toState = $transitions.$to();
153
             var toState = $transitions.$to();
152
-            $rootScope.title = toState.title + " - App";
154
+            var title = toState.title != null ? toState.title : toState.toolbarTitle != null ? toState.toolbarTitle : null;
155
+            var toolbarTitle = toState.toolbarTitle != null ? toState.toolbarTitle : toState.title != null ? toState.title : null;
156
+            if (title != null) {
157
+                AppUtilsBusiness.setTitle(title);
158
+            }
159
+            if (toolbarTitle != null) {
160
+                AppUtilsBusiness.setToolbarTitle(toolbarTitle);
161
+            }
153
         });
162
         });
154
     }]);
163
     }]);

+ 15
- 3
app/controllers/pkguid.controller.js View File

6
 
6
 
7
             $scope.query = {
7
             $scope.query = {
8
                 order: 'someText',
8
                 order: 'someText',
9
+                filter: '',
9
                 limit: 5,
10
                 limit: 5,
10
                 page: 1
11
                 page: 1
11
             };
12
             };
12
 
13
 
14
+            $scope.isFilterShown = false;
13
             $scope.pkGuids = null;
15
             $scope.pkGuids = null;
14
             $scope.error = null;
16
             $scope.error = null;
15
 
17
 
18
+            $scope.showFilter = function(show) {
19
+                $scope.isFilterShown = show;
20
+                if (!$scope.isFilterShown) {
21
+                    if ($scope.query.filter != '') {
22
+                        $scope.query.filter = '';
23
+                        $scope.getPkGuids();
24
+                    }
25
+                }
26
+            };
27
+
16
             $scope.askRemoveOne = function (pkguid) {
28
             $scope.askRemoveOne = function (pkguid) {
17
                 var confirm = $mdDialog.confirm()
29
                 var confirm = $mdDialog.confirm()
18
                     .title('Confirm deletion')
30
                     .title('Confirm deletion')
34
             $scope.askRemoveSelected = function () {
46
             $scope.askRemoveSelected = function () {
35
                 var confirm = $mdDialog.confirm()
47
                 var confirm = $mdDialog.confirm()
36
                     .title('Confirm deletion')
48
                     .title('Confirm deletion')
37
-                    .textContent('Do you really want to delete ' + $scope.selected.length + ' PkGuids?')
49
+                    .textContent('Do you really want to delete ' + $scope.selected.length + ' PkGuid?')
38
                     .ok('Delete')
50
                     .ok('Delete')
39
                     .cancel('Cancel');
51
                     .cancel('Cancel');
40
                 $mdDialog.show(confirm).then(function() {
52
                 $mdDialog.show(confirm).then(function() {
49
                     $scope.getPkGuids();
61
                     $scope.getPkGuids();
50
                 }
62
                 }
51
                 else {
63
                 else {
52
-                    pkGuidBusiness.deleteDbo($scope.selected[0].id)
64
+                    $scope.promise = pkGuidBusiness.deleteDbo($scope.selected[0].id)
53
                         .then(function(data)
65
                         .then(function(data)
54
                     {
66
                     {
55
                         $scope.selected = $scope.selected.splice(1);
67
                         $scope.selected = $scope.selected.splice(1);
66
                 $scope.error = null;
78
                 $scope.error = null;
67
                 $scope.selected = [];
79
                 $scope.selected = [];
68
                 var orderBy = AppUtilsBusiness.convertOrderBy($scope.query.order);
80
                 var orderBy = AppUtilsBusiness.convertOrderBy($scope.query.order);
69
-                $scope.promise = pkGuidBusiness.getMultiple(orderBy, $scope.query.page - 1, $scope.query.limit).then(function(data)
81
+                $scope.promise = pkGuidBusiness.getMultiple(orderBy, $scope.query.filter, $scope.query.page - 1, $scope.query.limit).then(function(data)
70
                 {
82
                 {
71
                     $scope.pkGuids = data;
83
                     $scope.pkGuids = data;
72
                 }, function(error)
84
                 }, function(error)

+ 39
- 23
app/controllers/pkguidedit.controller.js View File

1
 angular.module('app')
1
 angular.module('app')
2
-    .controller('PkGuidEditController', ['$scope', '$state', '$mdDialog', 'pkGuidBusiness',
3
-        function ($scope, $state, $mdDialog, pkGuidBusiness) {
2
+    .controller('PkGuidEditController', ['$scope', '$state', '$mdDialog', 'pkGuidBusiness', 'AppUtilsBusiness',
3
+        function ($scope, $state, $mdDialog, pkGuidBusiness, AppUtilsBusiness) {
4
 
4
 
5
             $scope.pkguid = null;
5
             $scope.pkguid = null;
6
             $scope.defaultPkguid = {
6
             $scope.defaultPkguid = {
13
 
13
 
14
             $scope.error = null;
14
             $scope.error = null;
15
 
15
 
16
-            if ($state.params != null) {
17
-                if ($state.params.pkguid != null) {
18
-                    $scope.pkguid = $state.params.pkguid;
16
+            $scope.setTitle = function()
17
+            {
18
+                if ($scope.pkguid.id != null) {
19
+                    AppUtilsBusiness.setTitle('Edit PkGuid \'' + $scope.pkguid.someText + '\'');
20
+                    AppUtilsBusiness.setToolbarTitle('PkGuid ~ Edit ~ \'' + $scope.pkguid.someText + '\'');
19
                 }
21
                 }
20
-                else if ($state.params.id != null) {
21
-                    $scope.running = true;
22
-                    pkGuidBusiness.getSingleById($state.params.id).then(function(data)
23
-                    {
24
-                        $scope.running = false;
25
-                        $scope.pkguid = data;
26
-                    }, function (error) {
27
-                        $scope.running = false;
28
-                        $scope.error = error;
29
-                    });
30
-                }
31
-                else {
32
-                    $scope.pkguid = angular.copy($scope.defaultPkguid);
33
-                }
34
-            }
35
-            else {
36
-                $scope.pkguid = angular.copy($scope.defaultPkguid);
37
-            }
22
+            };
38
 
23
 
39
             $scope.submit = function () {
24
             $scope.submit = function () {
40
                 $scope.error = null;
25
                 $scope.error = null;
52
                     pkGuidBusiness.editSingleByIdDbo($scope.pkguid.id, $scope.pkguid).then(function (data) {
37
                     pkGuidBusiness.editSingleByIdDbo($scope.pkguid.id, $scope.pkguid).then(function (data) {
53
                         $scope.running = false;
38
                         $scope.running = false;
54
                         $scope.pkguid = data;
39
                         $scope.pkguid = data;
40
+                        $scope.setTitle();
55
                     }, function (error) {
41
                     }, function (error) {
56
                         $scope.running = false;
42
                         $scope.running = false;
57
                         $scope.error = error;
43
                         $scope.error = error;
59
                 }
45
                 }
60
             };
46
             };
61
 
47
 
48
+
49
+            if ($state.params != null) {
50
+                if ($state.params.pkguid != null) {
51
+                    $scope.pkguid = $state.params.pkguid;
52
+                    $scope.setTitle();
53
+                }
54
+                else if ($state.params.id != null) {
55
+                    $scope.running = true;
56
+                    pkGuidBusiness.getSingleById($state.params.id).then(function(data)
57
+                    {
58
+                        $scope.running = false;
59
+                        $scope.pkguid = data;
60
+                        $scope.setTitle();
61
+                    }, function (error) {
62
+                        $scope.running = false;
63
+                        $scope.error = error;
64
+                        $scope.pkguid = null;
65
+                        $scope.setTitle();
66
+                    });
67
+                }
68
+                else {
69
+                    $scope.pkguid = angular.copy($scope.defaultPkguid);
70
+                    $scope.setTitle();
71
+                }
72
+            }
73
+            else {
74
+                $scope.pkguid = angular.copy($scope.defaultPkguid);
75
+                $scope.setTitle();
76
+            }
77
+
62
         }]);
78
         }]);

+ 11
- 6
app/controllers/toolbar.controller.js View File

3
  */
3
  */
4
 
4
 
5
 angular.module('app')
5
 angular.module('app')
6
-    .controller('ToolBarController', ['$scope', '$state', '$mdSidenav',
7
-        function($scope, $state, $mdSidenav) {
6
+    .controller('ToolBarController', ['$scope', '$rootScope', '$mdSidenav',
7
+        function ($scope, $rootScope, $mdSidenav) {
8
 
8
 
9
-                $scope.toggleSideBar = function()
10
-                {
11
-                    $mdSidenav('left').toggle();
12
-                };
9
+            $scope.title = "Toolbar";
10
+
11
+            $scope.toggleSideBar = function () {
12
+                $mdSidenav('left').toggle();
13
+            };
14
+
15
+            $rootScope.$on('toolbar.title', function (event, params) {
16
+                $scope.title = params.title;
17
+            });
13
         }]);
18
         }]);

+ 1
- 1
app/index.html View File

3
 <head>
3
 <head>
4
     <base href="/app/">
4
     <base href="/app/">
5
     <meta charset="utf-8">
5
     <meta charset="utf-8">
6
-    <title ng-bind="title">App</title>
6
+    <title ng-bind="title">MyApp</title>
7
 
7
 
8
     <!-- build:css css/globals.css -->
8
     <!-- build:css css/globals.css -->
9
     <link rel="stylesheet" href="../bower_components/components-font-awesome/css/font-awesome.min.css"/>
9
     <link rel="stylesheet" href="../bower_components/components-font-awesome/css/font-awesome.min.css"/>

+ 8
- 0
app/less/app.less View File

70
   background-color: #e3f2fd;
70
   background-color: #e3f2fd;
71
 }
71
 }
72
 
72
 
73
+md-toolbar.md-table-toolbar form {
74
+  width: 100%;
75
+}
76
+
77
+md-toolbar.md-table-toolbar form .md-errors-spacer {
78
+  display: none;
79
+}
80
+
73
 /**
81
 /**
74
 ========================================================
82
 ========================================================
75
 **/
83
 **/

+ 19
- 1
app/views/pkguid.html View File

1
 <div layout="column" layout-fill layout-align="top">
1
 <div layout="column" layout-fill layout-align="top">
2
 
2
 
3
     <div flex>
3
     <div flex>
4
-        <md-toolbar class="md-table-toolbar md-default" ng-show="selected.length == 0">
4
+        <md-toolbar class="md-table-toolbar md-default" ng-show="!isFilterShown && selected.length == 0">
5
             <div class="md-toolbar-tools">
5
             <div class="md-toolbar-tools">
6
                 <span>PkGuids</span>
6
                 <span>PkGuids</span>
7
                 <span flex></span>
7
                 <span flex></span>
8
+                <md-button class="md-icon-button" ng-click="showFilter(true)">
9
+                    <md-icon class="material-icons">filter_list</md-icon>
10
+                </md-button>
8
                 <md-button class="md-icon-button" ui-sref="pkguid_add">
11
                 <md-button class="md-icon-button" ui-sref="pkguid_add">
9
                     <md-icon class="material-icons">add</md-icon>
12
                     <md-icon class="material-icons">add</md-icon>
10
                 </md-button>
13
                 </md-button>
13
                 </md-button>
16
                 </md-button>
14
             </div>
17
             </div>
15
         </md-toolbar>
18
         </md-toolbar>
19
+        <md-toolbar class="md-table-toolbar md-default" ng-show="isFilterShown && selected.length == 0">
20
+            <div class="md-toolbar-tools">
21
+                <md-icon class="material-icons">search</md-icon>
22
+                <form autocomplete="off">
23
+                    <md-input-container class="md-block" flex-gt-sm>
24
+                        <label>Filter</label>
25
+                        <input type="text" ng-model="query.filter" ng-model-options="{debounce: 500}" ng-change="getPkGuids()">
26
+                    </md-input-container>
27
+
28
+                </form>
29
+                <md-button class="md-icon-button" ng-click="showFilter(false)">
30
+                    <md-icon class="material-icons">close</md-icon>
31
+                </md-button>
32
+            </div>
33
+        </md-toolbar>
16
         <md-toolbar class="md-table-toolbar alternate" ng-show="selected.length > 0">
34
         <md-toolbar class="md-table-toolbar alternate" ng-show="selected.length > 0">
17
             <div class="md-toolbar-tools">
35
             <div class="md-toolbar-tools">
18
                 <span>{{selected.length}} {{selected.length > 1 ? 'PkGuids' : 'PkGuid'}} selected</span>
36
                 <span>{{selected.length}} {{selected.length > 1 ? 'PkGuids' : 'PkGuid'}} selected</span>

+ 1
- 1
app/views/sidebar.html View File

1
 <md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="left" md-is-locked-open="$mdMedia('gt-md')">
1
 <md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="left" md-is-locked-open="$mdMedia('gt-md')">
2
     <header class="nav-header" ss-style-color="{'background-color': 'primary.default'}">
2
     <header class="nav-header" ss-style-color="{'background-color': 'primary.default'}">
3
         <md-toolbar class="md-theme-indigo">
3
         <md-toolbar class="md-theme-indigo">
4
-            <h1 class="md-toolbar-tools"><a ui-sref="home">App</a></h1>
4
+            <h1 class="md-toolbar-tools"><a ui-sref="home">MyApp</a></h1>
5
         </md-toolbar>
5
         </md-toolbar>
6
     </header>
6
     </header>
7
     <div flex ng-controller="SideBarController">
7
     <div flex ng-controller="SideBarController">

+ 1
- 1
app/views/toolbar.html View File

3
         <md-button class="md-icon-button" aria-label="Toolbar" ng-click="toggleSideBar()" hide-gt-md>
3
         <md-button class="md-icon-button" aria-label="Toolbar" ng-click="toggleSideBar()" hide-gt-md>
4
             <md-icon class="material-icons">menu</md-icon>
4
             <md-icon class="material-icons">menu</md-icon>
5
         </md-button>
5
         </md-button>
6
-        <h2>Toolbar</h2>
6
+        <h2>{{title}}</h2>
7
         <span flex></span>
7
         <span flex></span>
8
     </div>
8
     </div>
9
 </md-toolbar>
9
 </md-toolbar>

+ 2
- 1
bower.json View File

16
     "angular-material-data-table": "^0.10.9",
16
     "angular-material-data-table": "^0.10.9",
17
     "components-font-awesome": "^4.7.0",
17
     "components-font-awesome": "^4.7.0",
18
     "angular-material-sidenav": "^0.0.14",
18
     "angular-material-sidenav": "^0.0.14",
19
-    "material-design-icons": "^3.0.1"
19
+    "material-design-icons": "^3.0.1",
20
+    "angular-translate": "^2.13.1"
20
   }
21
   }
21
 }
22
 }

+ 11
- 1
sdk/Business/apputils.business.js View File

6
     'use strict';
6
     'use strict';
7
 
7
 
8
     angular.module('appSdk')
8
     angular.module('appSdk')
9
-        .factory('AppUtilsBusiness', [function () {
9
+        .factory('AppUtilsBusiness', ['$rootScope', function($rootScope) {
10
 
10
 
11
             var AppUtilsBusiness = {};
11
             var AppUtilsBusiness = {};
12
 
12
 
21
                 return orderBy;
21
                 return orderBy;
22
             };
22
             };
23
 
23
 
24
+            AppUtilsBusiness.setTitle = function(title)
25
+            {
26
+                $rootScope.title = title + ' - MyApp';
27
+            };
28
+
29
+            AppUtilsBusiness.setToolbarTitle = function(title)
30
+            {
31
+                $rootScope.$emit('toolbar.title', {title: title});
32
+            };
33
+
24
             return AppUtilsBusiness;
34
             return AppUtilsBusiness;
25
         }]);
35
         }]);
26
 })();
36
 })();

Loading…
Cancel
Save