TT#9602 ngcp-csc Adressbook adjustments

- save callback
- contact layout

Change-Id: I21945eecc4afdb8dce502c8d1c773705159fd790

app/locales.js

@@ -853,11 +853,11 @@ Ext.define('Ngcp.csc.locales', {
                 sp: 'web'
             },
             new_contact: {
-                en: 'Create new contact',
-                it: 'Create new contact',
-                de: 'Create new contact',
-                fr: 'Create new contact',
-                sp: 'Create new contact'
+                en: 'ADD NEW CONTACT',
+                it: 'ADD NEW CONTACT',
+                de: 'ADD NEW CONTACT',
+                fr: 'ADD NEW CONTACT',
+                sp: 'ADD NEW CONTACT'
             },
             firstname: {
                 en: 'firstname',

classic/src/view/pages/addressbook/Addressbook.js

@@ -102,6 +102,15 @@ Ext.define('NgcpCsc.view.pages.addressbook.Addressbook', {
             html: Ext.String.format('<div class="addressbook-heading">{0} {1}</div>', Ngcp.csc.locales.addressbook.user_label[localStorage.getItem('languageSelected')], localStorage.getItem('username'))
         }, {
             xtype: 'addressbook-grid'
+        }, {
+            margin: 10,
+            xtype: 'button',
+            reference: 'addNewBtn',
+            text: Ngcp.csc.locales.addressbook.new_contact[localStorage.getItem('languageSelected')],
+            handler: 'createNewContact',
+            bind: {
+                disabled: '{selection}'
+            }
         }]
     }]
 });

classic/src/view/pages/addressbook/AddressbookController.js

@@ -11,6 +11,11 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookController', {
         }
     },
 
+    onIconClicked: function(event, el) {
+        // eval is never the best option
+        Ext.Function.defer(eval('this.' + el.dataset.callback), 1, this, [el.id]);
+    },
+
     resetChanges: function() {
         var grid = this.lookupReference('addressBookGrid');
         var store = Ext.getStore('Addressbook');
@@ -52,9 +57,9 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookController', {
         return Ngcp.csc.locales.addressbook.company[localStorage.getItem('languageSelected')].toLowerCase();
     },
 
-    removeContact: function(grid, rowIndex, colIndex) {
-        var store = grid.getStore();
-        var rec = grid.getStore().getAt(rowIndex);
+    removeContact: function(id) {
+        var store = Ext.getStore('Addressbook');
+        var rec = store.findRecord('id', id);
         store.remove(rec);
         this.fireEvent('showmessage', true, Ngcp.csc.locales.common.remove_success[localStorage.getItem('languageSelected')]);
     },

classic/src/view/pages/addressbook/AddressbookGrid.js

@@ -11,9 +11,13 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookGrid', {
 
     listeners: {
         afterrender: 'onGridRendered',
-        cellclick: 'onCellClicked'
+        cellclick: 'onCellClicked',
+        click: {
+            fn: 'onIconClicked',
+            element: 'el',
+            delegate: 'div.card-icon'
+        }
     },
-
     tbar: [{
         xtype: 'label',
         text: Ngcp.csc.locales.common.order_by[localStorage.getItem('languageSelected')]
@@ -53,12 +57,7 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookGrid', {
                 fn: 'changeGroupField'
             }
         }
-        },
-        '->', {
-            text: Ngcp.csc.locales.addressbook.new_contact[localStorage.getItem('languageSelected')],
-            handler: 'createNewContact'
-        }
-    ],
+    }],
     columns: {
         defaults: {
             menuDisabled: true,
@@ -81,15 +80,6 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookGrid', {
         }, {
             flex: 1,
             dataIndex: 'mobile'
-        }, {
-            xtype: 'actioncolumn',
-            width: 30,
-            align: 'right',
-            items: [{
-                glyph: 'xf00d@FontAwesome',
-                tooltip: Ngcp.csc.locales.common.delete[localStorage.getItem('languageSelected')],
-                handler: 'removeContact'
-            }]
         }]
     },
 
@@ -114,6 +104,11 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookGrid', {
             '<p><div class="label">' + Ngcp.csc.locales.addressbook.e_mail[localStorage.getItem('languageSelected')] + ':</div><div> <a class="link" href="mailto:{e_mail}">{e_mail}</a></div></p>',
             '<p><div class="label">' + Ngcp.csc.locales.addressbook.homepage[localStorage.getItem('languageSelected')] + ':</div><div> <a target="_blank" class="link" href="{homepage}">{homepage}</a></div></p>',
             '</div>',
+            '<div class="card-wrapper">',
+            '<div class="card-icon-row">',
+            '<div id="{id}" class="card-icon" data-callback="removeContact"><i class="fa fa-trash green-icon fa-2x pointer" aria-hidden="true"></i></div>',
+            '</div>',
+            '</div>',
             '</div>')
     }]
 });