UI-1888: When a user has a Mobile device, list the related MDN in the 'Phone Numbers' section without the possibilty of un-assigning it or edit its features

i18n/en-US.json

@@ -656,7 +656,11 @@
 				"5": "Autoprovision one of our supported devices. The UI comes complete with pre-populated manufacturers and devices. Once complete it will automatically be assigned to the specific user.",
 				"6": "Manage what features Users can access. Turn on/off and manage any of the specific User Features."
 			}
-		}
+		},
+
+		"__comment": "UI-1888: ",
+		"__version": "4.0",
+		"confirmMobileUnAssignment": "You are about to un-assign a Mobile device. Be aware the phone number associated with this device ({{variable}}) will also be un-assigned from this user. Are you sure?"
 	},
 
 	"strategy": {

i18n/fr-FR.json

@@ -605,7 +605,9 @@
 				"5": "Ajouter des téléphones à vos utilisateurs via cette case.",
 				"6": "Gérez les différentes fonctionnalités disponibles pour vos utilisateurs via ce menu."
 			}
-		}
+		},
+
+		"confirmMobileUnAssignment": "Vous allez retirer un téléphone mobile. Le numéro lié à ce téléphone ({{variable}}) sera aussi retiré de cet utilisateur. Voulez-vous continuer ?"
 	},
 
 	"strategy": {

submodules/users/users.css

@@ -435,6 +435,10 @@
 }
 
 /* Detail Numbers */
+#users_container .detail-numbers .list-wrapper .item-row .number-container {
+	min-width: 237px;
+}
+
 #users_container .detail-numbers .list-wrapper .item-row .features .tooltip-inner {
 	white-space:pre-wrap;
 }

submodules/users/users.js

@@ -1018,15 +1018,33 @@ define(function(require){
 			});
 
 			template.on('click', '.detail-devices .list-assigned-items .remove-device', function() {
-				var row = $(this).parents('.item-row');
+				var row = $(this).parents('.item-row'),
+					userId = template.find('.grid-row.active').data('id'),
+					deviceId = row.data('id'),
+					userData = _.find(data.users, function(user, idx) { return user.id === userId; }),
+					deviceData = _.find(userData.extra.devices, function(device, idx) { return device.id === deviceId; }),
+					removeDevice = function () {
+						if(row.hasClass('assigned')) {
+							unassignedDevices[row.data('id')] = true;
+						}
+						row.remove();
+						var rows = template.find('.detail-devices .list-assigned-items .item-row');
+						if(rows.is(':visible') === false) {
+							template.find('.detail-devices .list-assigned-items .empty-row').show();
+						}
+					};
 
-				if(row.hasClass('assigned')) {
-					unassignedDevices[row.data('id')] = true;
+				if (deviceData.type === 'mobile') {
+					monster.ui.confirm(
+						self.i18n.active().users.confirmMobileUnAssignment.replace(
+							'{{variable}}',
+							monster.util.formatPhoneNumber(deviceData.mobile.mdn)
+						),
+						removeDevice
+					);
 				}
-				row.remove();
-				var rows = template.find('.detail-devices .list-assigned-items .item-row');
-				if(rows.is(':visible') === false) {
-					template.find('.detail-devices .list-assigned-items .empty-row').show();
+				else {
+					removeDevice();
 				}
 			});
 
@@ -1035,17 +1053,19 @@ define(function(require){
 				var $this = $(this),
 					row = $this.parents('.item-row');
 
-				extraSpareNumbers.push(row.data('id'));
+				if (row.data('type') !== 'mobile') {
+					extraSpareNumbers.push(row.data('id'));
 
-				row.slideUp(function() {
-					row.remove();
+					row.slideUp(function() {
+						row.remove();
 
-					if ( !template.find('.list-assigned-items .item-row').is(':visible') ) {
-						template.find('.list-assigned-items .empty-row').slideDown();
-					}
+						if ( !template.find('.list-assigned-items .item-row').is(':visible') ) {
+							template.find('.list-assigned-items .empty-row').slideDown();
+						}
 
-					template.find('.spare-link').removeClass('disabled');
-				});
+						template.find('.spare-link').removeClass('disabled');
+					});
+				}
 			});
 
 			template.on('click', '.actions .spare-link:not(.disabled)', function(e) {
@@ -2590,10 +2610,9 @@ define(function(require){
 			});
 		},
 
-		usersGetNumbersData: function(userId, callback) {
-			var self = this;
-
-			monster.parallel({
+		usersGetNumbersData: function(userId, callback, loadNumbersView) {
+			var self = this,
+				parallelRequests = {
 					user: function(callbackParallel) {
 						self.usersGetUser(userId, function(user) {
 							callbackParallel && callbackParallel(null, user);
@@ -2639,13 +2658,20 @@ define(function(require){
 						self.usersListNumbers(function(listNumbers) {
 							callbackParallel && callbackParallel(null, listNumbers);
 						});
-
 					}
-				},
-				function(err, results) {
-					callback && callback(results);
 				}
-			);
+
+			if (loadNumbersView) {
+				parallelRequests.devices = function(callbackParallel) {
+					self.usersListDeviceUser(userId, function (listDevices) {
+						callbackParallel && callbackParallel(null, listDevices);
+					});
+				};
+			}
+
+			monster.parallel(parallelRequests, function(err, results) {
+				callback && callback(results);
+			});
 		},
 
 		usersGetNumbersTemplate: function(userId, callback) {
@@ -2660,7 +2686,7 @@ define(function(require){
 
 					callback && callback(template, results);
 				});
-			});
+			}, true);
 		},
 		usersGetDevicesTemplate: function(userId, callback) {
 			var self = this;
@@ -2718,6 +2744,21 @@ define(function(require){
 					user: data.user || {}
 				};
 
+			if (data.devices.length) {
+				_.each(data.devices, function(device, idx) {
+					if (device.device_type === 'mobile') {
+						data.numbers.numbers[device.mobile.mdn] = {
+							assigned_to: response.user.id,
+							features: [ 'mobile' ],
+							isLocal: false,
+							phoneNumber: device.mobile.mdn,
+							state: 'in_service',
+							used_by: 'mobile'
+						};
+					}
+				});
+			}
+
 			monster.pub('common.numbers.getListFeatures', function(features) {
 				if('numbers' in data.numbers) {
 					_.each(data.numbers.numbers, function(number, k) {
@@ -2737,6 +2778,9 @@ define(function(require){
 							response.countSpare++;
 							response.unassignedNumbers[k] = number;
 						}
+						else if (number.used_by === 'mobile') {
+							response.assignedNumbers.push(number);
+						}
 					});
 				}
 

views/users-numbers.html

@@ -5,8 +5,9 @@
 				{{ i18n.users.noAssignedNumbers }}
 			</div>
 			{{#each assignedNumbers}}
-				<div class="item-row" data-id="{{this.phoneNumber}}" data-search="{{formatPhoneNumber this.phoneNumber}} {{this.phoneNumber}} {{this.locality.city}} {{this.locality.country}}">
+				<div class="item-row" data-id="{{this.phoneNumber}}" data-type="{{this.used_by}}" data-search="{{formatPhoneNumber this.phoneNumber}} {{this.phoneNumber}} {{this.locality.city}} {{this.locality.country}}">
 					<div class="features-block pull-right">
+					{{#compare this.used_by "!==" "mobile"}}
 						<div class="edit-features">
 							<div class="navbar">
 								<ul class="nav pull-right">
@@ -14,19 +15,20 @@
 										<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-cog"></i></a>
 										<ul class="dropdown-menu">
 										{{#unless this.isLocal}}
-											{{#if ../../isCnamEnabled}}
-												<li><a class="callerId-number" href="#"><i class="fa fa-user"></i>{{ ../../../i18n.callerId }}</a></li>
+											{{#if ../../../isCnamEnabled}}
+												<li><a class="callerId-number" href="#"><i class="fa fa-user"></i>{{ ../../../../i18n.callerId }}</a></li>
 											{{/if}}
-											{{#if ../../isE911Enabled}}
-												<li><a class="e911-number" href="#"><i class="fa fa-ambulance"></i>{{ ../../../i18n.e911 }}</a></li>
+											{{#if ../../../isE911Enabled}}
+												<li><a class="e911-number" href="#"><i class="fa fa-ambulance"></i>{{ ../../../../i18n.e911 }}</a></li>
 											{{/if}}
 										{{/unless}}
-											<li><a class="prepend-number" href="#"><i class="fa fa-file-text-o"></i>{{ ../i18n.numberPrepend }}</a></li>
+											<li><a class="prepend-number" href="#"><i class="fa fa-file-text-o"></i>{{ ../../i18n.numberPrepend }}</a></li>
 										</ul>
 									</li>
 								</ul>
 							</div>
 						</div>
+					{{/compare}}
 						<div class="features">
 						{{#compare this.state '===' 'port_in'}}
 							<i class="fa fa-exclamation-triangle monster-red active help-popover" data-toggle="tooltip" data-placement="top" data-original-title="{{../../i18n.portIconHelp}}"></i>
@@ -36,9 +38,11 @@
 							{{/each}}
 						</div>
 					</div>
-					<div class="number">
-						<button type="button" class="monster-button monster-button-danger remove-number">{{ ../i18n.unassign }}</button>
-						{{ formatPhoneNumber this.phoneNumber }}
+					<div class="number-container">
+						<button type="button" class="monster-button monster-button-danger remove-number{{#compare this.used_by "===" "mobile"}} disabled" disabled{{else}}"{{/compare}}>{{ ../i18n.unassign }}</button>
+						<span class="number">
+							{{ formatPhoneNumber this.phoneNumber }}
+						</span>
 					</div>
 					<!--<div class="locality">
 						{{#if this.localityEnabled}}