ソースを参照

added confirmation dialog for luedittable delete; added confirmation dialog helper; cleaned files

tags/0.1.6^0
Robin Thoni 8年前
コミット
c2d67389e0

+ 2
- 1
Gruntfile.js ファイルの表示

@@ -11,7 +11,8 @@ module.exports = function(grunt) {
11 11
                     'dist/luticate-utils.min.js': [
12 12
                         'src/luticateutils.js',
13 13
                         'src/*.js',
14
-                        'src/modals/*.js'
14
+                        'src/modals/*.js',
15
+                        'src/directives/*.js'
15 16
                     ]
16 17
                 }
17 18
             }

+ 1
- 1
bower.json ファイルの表示

@@ -1,6 +1,6 @@
1 1
 {
2 2
   "name": "luticate-utils",
3
-  "version": "0.1.5",
3
+  "version": "0.1.6",
4 4
   "authors": [
5 5
     "Robin THONI <robin@rthoni.com>"
6 6
   ],

+ 1
- 1
dist/luticate-utils.min.js
ファイル差分が大きすぎるため省略します
ファイルの表示


src/modals/dialogclose.js → src/directives/dialogclose.js ファイルの表示

@@ -8,7 +8,7 @@ angular.module('luticateUtils')
8 8
             return {
9 9
                 restrict: 'EA',
10 10
                 transclude: true,
11
-                templateUrl: '/luticateUtils/dialogclose.html',
11
+                templateUrl: '/luticateUtils/dialogclose-directive.html',
12 12
                 link: function link($scope, element, attrs) {
13 13
                     $scope.title = attrs.title;
14 14
 
@@ -25,7 +25,7 @@ angular.module('luticateUtils')
25 25
 
26 26
 angular.module("luticateUtils").run(["$templateCache", function($templateCache)
27 27
 {
28
-    $templateCache.put("/luticateUtils/dialogclose.html", '<div class="popin modal-content" xmlns="http://www.w3.org/1999/html">' +
28
+    $templateCache.put("/luticateUtils/dialogclose-directive.html", '<div class="popin modal-content" xmlns="http://www.w3.org/1999/html">' +
29 29
         '<div class="modal-header">{{ title }}</div>' +
30 30
         '<div class="modal-body" lu-busy="modal">' +
31 31
         '    <div class="form-group">' +

+ 91
- 0
src/directives/dialogokcancel.js ファイルの表示

@@ -0,0 +1,91 @@
1
+/**
2
+ * Created by robin on 11/2/15.
3
+ */
4
+
5
+(function () {
6
+    'use strict';
7
+
8
+    angular.module('luticateUtils')
9
+        .directive('dialogOkCancel', ['luticateDialogErrorHelper',
10
+            function (luticateDialogErrorHelper) {
11
+                return {
12
+                    restrict: 'EA',
13
+                    transclude: true,
14
+                    templateUrl: '/luticateUtils/dialogokcancel-directive.html',
15
+                    link: function link($scope, element, attrs) {
16
+                        $scope.title = attrs.title;
17
+                        $scope.model = {};
18
+                        $scope.pending = false;
19
+                        $scope.submitted = false;
20
+
21
+                        $scope.__submit = function()
22
+                        {
23
+                            $scope.submitted = true;
24
+                            if ($scope.form.$valid) {
25
+                                $scope.pending = true;
26
+                                $scope.promise = $scope.submitForm();
27
+                                if ($scope.promise)
28
+                                {
29
+                                    $scope.promise.then(function(data) {
30
+                                        if ($scope.onDone) {
31
+                                            $scope.onDone(data);
32
+                                        }
33
+                                        $scope.$close(data);
34
+                                        $scope.pending = false;
35
+                                    })
36
+                                        .catch(function(error)
37
+                                        {
38
+                                            if ($scope.onError) {
39
+                                                $scope.onError(error);
40
+                                            }
41
+                                            luticateDialogErrorHelper.errorDialog(error)
42
+                                                .result.then(function(data)
43
+                                                {
44
+                                                }, function(error2)
45
+                                                {
46
+                                                    $scope.$dismiss(error);
47
+                                                });
48
+                                            $scope.pending = false;
49
+                                        });
50
+                                }
51
+                                else {
52
+                                    $scope.$close();
53
+                                    $scope.pending = false;
54
+                                }
55
+                            }
56
+                        };
57
+
58
+                        $scope.__cancel = function()
59
+                        {
60
+                            if ($scope.onCanceled) {
61
+                                $scope.onCanceled();
62
+                            }
63
+                            $scope.$dismiss();
64
+                            $scope.pending = false;
65
+                        };
66
+                    }
67
+                };
68
+            }]);
69
+
70
+    angular.module("luticateUtils").run(["$templateCache", function($templateCache)
71
+    {
72
+        $templateCache.put("/luticateUtils/dialogokcancel-directive.html", '<div class="popin modal-content" xmlns="http://www.w3.org/1999/html">' +
73
+    '<form name="form" class="form-horizontal" ng-submit="__submit()">' +
74
+    '<div class="modal-header">{{ title }}</div>' +
75
+    '<div class="modal-body" lu-busy="modal">' +
76
+    '    <div class="form-group">' +
77
+    '    <ng-transclude></ng-transclude>' +
78
+    '    </div>' +
79
+    '    <div class="clearfix"></div>' +
80
+    /*'    <span class="error" ng-show="submitted">' +
81
+    '    <p class="error">{{ errorString }}</p>' +
82
+    '</span>' +*/
83
+    '</div>' +
84
+    '<div class="modal-footer">' +
85
+    '    <button type="button" class="btn btn-inverse" ng-click="__cancel()">Cancel</button>' +
86
+    '    <button type="submit" class="btn btn-primary" ng-enabled="!pending">OK</button>' +
87
+    '    </div>' +
88
+    '    </form>' +
89
+    '    </div>');
90
+    }]);
91
+})();

+ 16
- 6
src/luedittable.js ファイルの表示

@@ -3,8 +3,8 @@
3 3
  */
4 4
 
5 5
 angular.module('luticateUtils')
6
-    .directive('luEditTable', ['dialogs', 'luticateDialogErrorHelper', 'luticateAuthCache',
7
-        function(dialogs, luticateDialogErrorHelper, luticateAuthCache) {
6
+    .directive('luEditTable', ['dialogs', 'luticateDialogErrorHelper', 'luticateAuthCache', 'luticateDialogOkCancelHelper',
7
+        function(dialogs, luticateDialogErrorHelper, luticateAuthCache, luticateDialogOkCancelHelper) {
8 8
             return {
9 9
                 restrict: 'E',
10 10
                 scope: {
@@ -101,6 +101,16 @@ angular.module('luticateUtils')
101 101
                         }
102 102
                     }
103 103
 
104
+                    $scope.askDeleteItems = function()
105
+                    {
106
+                        luticateDialogOkCancelHelper.okCancelDialog({
107
+                            title: "Delete items",
108
+                            text: "Do you really want to delete selected items?"
109
+                        }).result.then(function()
110
+                        {
111
+                            $scope.deleteItems();
112
+                        });
113
+                    };
104 114
 
105 115
                     $scope.deleteItems = function () {
106 116
                         if ($scope.tableOptions.checkedItems.length == 0) {
@@ -135,12 +145,12 @@ angular.module('luticateUtils').run(['$templateCache', function($templateCache)
135 145
     $templateCache.put('/luticate/lutable.html',
136 146
 '<lu-basic-table options="tableOptions"><lu-basic-table-filter><ng-transclude ng-transclude="lu-basic-table-filter"></ng-transclude></lu-basic-table-filter></lu-basic-table>' +
137 147
 '<div class="col-sm-12">' +
138
-'    <button class="btn btn-danger" type="button" ng-click="deleteItems()"' +
139
-'       ng-disabled="tableOptions.checkedItems.length == 0" ng-show="tableOptions.canDel()">' +
140
-'       <span class="glyphicon glyphicon-remove" aria-hidden="true"></span> Delete' +
148
+'    <button class="btn btn-danger" type="button" ng-click="askDeleteItems()"' +
149
+'        ng-disabled="tableOptions.checkedItems.length == 0" ng-show="tableOptions.canDel()">' +
150
+'        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span> Delete' +
141 151
 '    </button>' +
142 152
 '    <button class="btn btn-primary" type="button" ng-click="tableOptions.addItem()" ng-show="tableOptions.canAdd()">' +
143
-'       <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add' +
153
+'        <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add' +
144 154
 '    </button>' +
145 155
 '</div>');
146 156
 }]);

+ 57
- 14
src/modals/dialogerror.js ファイルの表示

@@ -2,17 +2,60 @@
2 2
  * Created by robin on 11/3/15.
3 3
  */
4 4
 
5
-'use strict';
6
-
7
-angular.module('luticateUtils').
8
-    controller('luticateDialogError', ['$scope', 'data', '$state', 'luticateAuthCache',
9
-    function ($scope, data, $state, luticateAuthCache) {
10
-        $scope.message = data.message;
11
-        $scope.showLogin = data.data.Status == 401;
12
-        $scope.reconnect = function()
13
-        {
14
-            $scope.$dismiss();
15
-            luticateAuthCache.removeUser();
16
-            $state.go('login');
17
-        };
18
-    }]);
5
+(function () {
6
+    'use strict';
7
+
8
+    angular.module('luticateUtils').
9
+        controller('luticateDialogError', ['$scope', 'data', '$state', 'luticateAuthCache',
10
+        function ($scope, data, $state, luticateAuthCache) {
11
+            $scope.message = data.message;
12
+            $scope.showLogin = data.data.Status == 401;
13
+            $scope.reconnect = function()
14
+            {
15
+                $scope.$dismiss();
16
+                luticateAuthCache.removeUser();
17
+                $state.go('login');
18
+            };
19
+        }]);
20
+
21
+    angular.module('luticateUtils')
22
+        .factory('luticateDialogErrorHelper', ['dialogs', function (dialogs) {
23
+
24
+            var luticateDialogErrorHelper = {};
25
+
26
+            luticateDialogErrorHelper.errorMessage = function(data)
27
+            {
28
+                var message = data.Data;
29
+                message += " (HTTP code: " + data.Status + ")";
30
+                /*var status = 'Common.Status.HttpStatus.' + data.status;
31
+                 var statusText = tr(status);
32
+                 if (status != statusText)
33
+                 message += " : " + statusText;*/
34
+                return message;
35
+            };
36
+
37
+            luticateDialogErrorHelper.errorDialog = function(data)
38
+            {
39
+                var message = luticateDialogErrorHelper.errorMessage(data);
40
+                return dialogs.create('/luticateUtils/dialogerror.html', 'luticateDialogError', {message: message, data: data}, {});
41
+            };
42
+
43
+            return luticateDialogErrorHelper;
44
+        }]);
45
+
46
+    angular.module("luticateUtils").run(["$templateCache", function($templateCache)
47
+    {
48
+        $templateCache.put("/luticateUtils/dialogerror.html", '<div class="popin modal-content" xmlns="http://www.w3.org/1999/html">' +
49
+            '            <div class="modal-header">Error</div>' +
50
+            '        <div class="modal-body">' +
51
+            '        <div class="form-group">{{ message }}</div>' +
52
+            '        <div class="clearfix"></div>' +
53
+            '        </div>' +
54
+            '        <div class="modal-footer">' +
55
+            '        <button type="submit" class="btn btn-inverse" ng-click="$close()" ng-show="!showLogin">Close</button>' +
56
+            '        <button type="submit" class="btn btn-inverse" ng-click="$close()" ng-show="showLogin">Cancel</button>' +
57
+            '        <button type="button" class="btn btn-primary" ng-click="reconnect()" ng-show="showLogin">Login</button>' +
58
+            '        </div>' +
59
+            '        </div>')
60
+    }]);
61
+})();

+ 0
- 47
src/modals/dialogerrorhelper.js ファイルの表示

@@ -1,47 +0,0 @@
1
-/**
2
- * Created by robin on 11/3/15.
3
- */
4
-
5
-(function () {
6
-    'use strict';
7
-    angular.module('luticateUtils')
8
-        .factory('luticateDialogErrorHelper', ['dialogs', function (dialogs) {
9
-
10
-            var luticateDialogErrorHelper = {};
11
-
12
-            luticateDialogErrorHelper.errorMessage = function(data)
13
-            {
14
-                var message = data.Data;
15
-                message += " (HTTP code: " + data.Status + ")";
16
-                /*var status = 'Common.Status.HttpStatus.' + data.status;
17
-                var statusText = tr(status);
18
-                if (status != statusText)
19
-                    message += " : " + statusText;*/
20
-                return message;
21
-            };
22
-
23
-            luticateDialogErrorHelper.errorDialog = function(data)
24
-            {
25
-                var message = luticateDialogErrorHelper.errorMessage(data);
26
-                return dialogs.create('/luticateUtils/dialogerror.html', 'luticateDialogError', {message: message, data: data}, {});
27
-            };
28
-
29
-            return luticateDialogErrorHelper;
30
-        }]);
31
-})();
32
-
33
-angular.module("luticateUtils").run(["$templateCache", function($templateCache)
34
-{
35
-    $templateCache.put("/luticateUtils/dialogerror.html", '<div class="popin modal-content" xmlns="http://www.w3.org/1999/html">' +
36
-        '            <div class="modal-header">Error</div>' +
37
-        '        <div class="modal-body">' +
38
-        '        <div class="form-group">{{ message }}</div>' +
39
-        '        <div class="clearfix"></div>' +
40
-        '        </div>' +
41
-        '        <div class="modal-footer">' +
42
-        '        <button type="submit" class="btn btn-inverse" ng-click="$close()" ng-show="!showLogin">Close</button>' +
43
-        '        <button type="submit" class="btn btn-inverse" ng-click="$close()" ng-show="showLogin">Cancel</button>' +
44
-        '        <button type="button" class="btn btn-primary" ng-click="reconnect()" ng-show="showLogin">Login</button>' +
45
-        '        </div>' +
46
-        '        </div>')
47
-}]);

+ 31
- 79
src/modals/dialogokcancel.js ファイルの表示

@@ -1,88 +1,40 @@
1 1
 /**
2
- * Created by robin on 11/2/15.
2
+ * Created by robin on 11/3/15.
3 3
  */
4 4
 
5 5
 
6
-angular.module('luticateUtils')
7
-    .directive('dialogOkCancel', ['luticateDialogErrorHelper',
8
-        function (luticateDialogErrorHelper) {
9
-            return {
10
-                restrict: 'EA',
11
-                transclude: true,
12
-                templateUrl: '/luticateUtils/dialogokcancel.html',
13
-                link: function link($scope, element, attrs) {
14
-                    $scope.title = attrs.title;
15
-                    $scope.model = {};
16
-                    $scope.pending = false;
17
-                    $scope.submitted = false;
6
+(function () {
7
+    'use strict';
18 8
 
19
-                    $scope.__submit = function()
20
-                    {
21
-                        $scope.submitted = true;
22
-                        if ($scope.form.$valid) {
23
-                            $scope.pending = true;
24
-                            $scope.promise = $scope.submitForm();
25
-                            if ($scope.promise)
26
-                            {
27
-                                $scope.promise.then(function(data) {
28
-                                    if ($scope.onDone) {
29
-                                        $scope.onDone(data);
30
-                                    }
31
-                                    $scope.$close(data);
32
-                                    $scope.pending = false;
33
-                                })
34
-                                    .catch(function(error)
35
-                                    {
36
-                                        if ($scope.onError) {
37
-                                            $scope.onError(error);
38
-                                        }
39
-                                        luticateDialogErrorHelper.errorDialog(error)
40
-                                            .result.then(function(data)
41
-                                            {
42
-                                            }, function(error2)
43
-                                            {
44
-                                                $scope.$dismiss(error);
45
-                                            });
46
-                                        $scope.pending = false;
47
-                                    });
48
-                            }
49
-                            else {
50
-                                $scope.$close();
51
-                                $scope.pending = false;
52
-                            }
53
-                        }
54
-                    };
9
+    angular.module('luticateUtils').
10
+    controller('luticateDialogOkCancel', ['$scope', 'data',
11
+        function ($scope, data) {
12
+            $scope.text = data.text;
13
+            $scope.title = data.title;
14
+            $scope.submitForm = function()
15
+            {
16
+                $scope.$close();
17
+            };
18
+        }]);
19
+
20
+    angular.module('luticateUtils')
21
+        .factory('luticateDialogOkCancelHelper', ['dialogs', function (dialogs) {
55 22
 
56
-                    $scope.__cancel = function()
57
-                    {
58
-                        if ($scope.onCanceled) {
59
-                            $scope.onCanceled();
60
-                        }
61
-                        $scope.$dismiss();
62
-                        $scope.pending = false;
63
-                    };
64
-                }
23
+            var luticateDialogOkCancelHelper = {};
24
+
25
+            luticateDialogOkCancelHelper.okCancelDialog = function(data)
26
+            {
27
+                return dialogs.create('/luticateUtils/dialogokcancel-dialog.html', 'luticateDialogOkCancel', data, {});
65 28
             };
29
+
30
+            return luticateDialogOkCancelHelper;
66 31
         }]);
67 32
 
68
-angular.module("luticateUtils").run(["$templateCache", function($templateCache)
69
-{
70
-    $templateCache.put("/luticateUtils/dialogokcancel.html", '<div class="popin modal-content" xmlns="http://www.w3.org/1999/html">' +
71
-'<form name="form" class="form-horizontal" ng-submit="__submit()">' +
72
-'<div class="modal-header">{{ title }}</div>' +
73
-'<div class="modal-body" lu-busy="modal">' +
74
-'    <div class="form-group">' +
75
-'    <ng-transclude></ng-transclude>' +
76
-'    </div>' +
77
-'    <div class="clearfix"></div>' +
78
-/*'    <span class="error" ng-show="submitted">' +
79
-'    <p class="error">{{ errorString }}</p>' +
80
-'</span>' +*/
81
-'</div>' +
82
-'<div class="modal-footer">' +
83
-'    <button type="button" class="btn btn-inverse" ng-click="__cancel()">Cancel</button>' +
84
-'    <button type="submit" class="btn btn-primary" ng-enabled="!pending">OK</button>' +
85
-'    </div>' +
86
-'    </form>' +
87
-'    </div>')
88
-}]);
33
+    angular.module("luticateUtils").run(["$templateCache", function($templateCache)
34
+    {
35
+        $templateCache.put("/luticateUtils/dialogokcancel-dialog.html",
36
+            '<dialog-ok-cancel title="{{ title }}">' +
37
+            '    <div class="modal-body">{{ text }}</div>' +
38
+            '</dialog-ok-cancel>')
39
+    }]);
40
+})();

読み込み中…
キャンセル
保存