Add UI for update enrollment

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/conf/config.json

@@ -122,6 +122,7 @@
     "perm:users:update",
     "perm:users:send-invitation",
     "perm:admin-users:view",
+    "perm:admin:devices:update-enrollment",
     "perm:groups:devices",
     "perm:groups:update",
     "perm:groups:add",

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/modules/business-controllers/user.js

@@ -620,6 +620,9 @@ var userModule = function () {
         if (publicMethods.isAuthorized("/permission/admin/device-mgt/topics/view")) {
             permissions["VIEW_TOPICS"] = true;
         }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/admin/devices/update-enrollment")) {
+            permissions["UPDATE_ENROLLMENT"] = true;
+        }
 
         return permissions;
     };

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.devices/devices.hbs

@@ -209,6 +209,22 @@
                                                 {{/if}}
                                             </a>
                                         </li>
+                                        <!--update enrollment-->
+                                        {{#if permissions.updateEnrollment}}
+                                            <li>
+                                                <a href="#" style="width: 100px;height: 80px;"
+                                                   data-click-event="remove-form"
+                                                   class="btn square-element update-enrollment-link"
+                                                   data-toggle="modal" data-target="#modalDemo">
+                                                    <span class="icon fw-stack">
+                                                        <i class="fw fw-circle-outline fw-stack-2x"></i>
+                                                        <i class="fw fw-user fw-stack-1x"></i>
+                                                    </span>
+                                                    Update Enrollment
+                                                </a>
+                                            </li>
+                                        {{/if}}
+                                        <!--/update enrollment-->
                                     </ul>
                                 </th>
                             </tr>
@@ -513,6 +529,58 @@
                         </div>
                     </div>
                 </div>
+                <!--update enrollment modal-->
+                <div id="update-enrollment-modal-content" class="hide">
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            Please enter the username to update the enrollment device(s).
+                        </h3>
+                        <div id="update-enrollment-error-content" class="pull-left modal-title hidden"
+                             style="color: #d9534f;">
+                            <strong>
+                                <span><i class="fw fw-error"></i></span>
+                                <div id="update-enrollment-error-msg" style="display: inline">
+                                </div>
+                            </strong>
+                        </div>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i>
+                        </button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+                        <input id="update-enrollment-name" style="color:#3f3f3f;padding:5px;" type="text"
+                               placeholder="[ username ]" size="60" required>
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="#" id="update-enrollment-yes-link" class="btn-operations">
+                                Update
+                            </a>
+                            <a href="#" id="update-enrollment-cancel-link" class="btn-operations">
+                                Cancel
+                            </a>
+                        </div>
+                    </div>
+                </div>
+
+                <div id="update-enrollment-200-content" class="hide">
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            Successfully updated enrollment.
+                        </h3>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i>
+                        </button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="javascript:hidePopup()" class="btn-operations">Ok</a>
+                        </div>
+                    </div>
+                </div>
+                <!--/update enrollment modal-->
             </div>
         </div>
     </div>

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.devices/devices.js

@@ -43,6 +43,9 @@ function onRequest(context) {
         if (uiPermissions.ADD_DEVICE) {
             viewModel.permissions.enroll = true;
         }
+        if (uiPermissions.UPDATE_ENROLLMENT) {
+            viewModel.permissions.updateEnrollment = true;
+        }
         viewModel.currentUser = currentUser;
         var deviceCount = 0;
         if (groupId) {

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.devices/public/js/listing.js

@@ -809,6 +809,68 @@ function attachDeviceEvents() {
         });
     });
 
+    /**
+     * Following click function would execute
+     * when a user clicks on "Update Enrollment" link
+     * on Device Management page.
+     */
+    $("a.update-enrollment-link").click(function () {
+        var deviceIdentifiers = [];
+        var deviceId = $(this).data("deviceid");
+        var deviceType = $(this).data("devicetype");
+
+        if (deviceId && deviceType) {
+            deviceIdentifiers = [{"id": deviceId, "type": deviceType}];
+        } else {
+            deviceIdentifiers = getSelectedDevices();
+        }
+
+        if (deviceIdentifiers.length === 0) {
+            $(modalPopupContent).html($('#no-device-selected').html());
+            $("a#no-device-selected-link").click(function () {
+                hidePopup();
+            });
+            showPopup();
+            return;
+        }
+
+        $(modalPopupContent).html($('#update-enrollment-modal-content').html());
+        showPopup();
+
+        $("a#update-enrollment-yes-link").click(function () {
+            var username = $("#update-enrollment-name").val();
+            console.log(username);
+            if (username) {
+                var i;
+                var deviceIds = [];
+                for (i=0; i<deviceIdentifiers.length; i++) {
+                    deviceIds.push(deviceIdentifiers[i].id);
+                }
+                var serviceURL = "/api/device-mgt/v1.0/admin/devices/device-owner?owner=" + username;
+                invokerUtil.put(serviceURL, deviceIds, function (message) {
+                    $(modalPopupContent).html($('#update-enrollment-200-content').html());
+                    setTimeout(function () {
+                        hidePopup();
+                        location.reload(false);
+                    }, 2000);
+                }, function (jqXHR) {
+                    displayDeviceErrors(jqXHR);
+                });
+            } else {
+                $("div#update-enrollment-error-msg").text("Username cannot be empty");
+                $("div#update-enrollment-error-content").removeClass("hidden");
+                setTimeout(function() {
+                    $("div#update-enrollment-error-content").addClass("hidden");
+                    $("div#update-enrollment-error-msg").text();
+                }, 2000)
+            }
+        });
+
+        $("a#update-enrollment-cancel-link").click(function () {
+            hidePopup();
+        });
+    });
+
     /**
      * Following click function would execute
      * when a user clicks on "Add to Group" link