From ea639208bc9c2926fe2bddd8f23162429fc736df Mon Sep 17 00:00:00 2001
From: jiahuay <jiahua.yan@huawei.com>
Date: Wed, 24 Sep 2014 17:53:45 -0700
Subject: [PATCH] Fix role assign bug on filterd servers

Change-Id: Ife55b7311c4e54f4ec11c43b11b51e1f1a57ab93
---
 v2/assets/css/style.css                    |  1 +
 v2/src/app/wizard/role_assignment.tpl.html | 18 +++++++++---------
 v2/src/app/wizard/wizard.js                |  4 ++--
 3 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/v2/assets/css/style.css b/v2/assets/css/style.css
index beb8eb3..09370c4 100644
--- a/v2/assets/css/style.css
+++ b/v2/assets/css/style.css
@@ -993,6 +993,7 @@ circle[depth='4'] {
 .role-widget-box {
     position: fixed !important;
     margin-left: 0px !important;
+    z-index: 10;
 }
 .margin-left-neg4 {
     margin-left: -4px;
diff --git a/v2/src/app/wizard/role_assignment.tpl.html b/v2/src/app/wizard/role_assignment.tpl.html
index b1e08be..5826397 100644
--- a/v2/src/app/wizard/role_assignment.tpl.html
+++ b/v2/src/app/wizard/role_assignment.tpl.html
@@ -95,39 +95,39 @@
                     </tr>
                 </thead>
                 <tbody>
-                    <tr ng-repeat="(key, value) in $data | filter: search" ng-init="value.roles = value.roles === undefinded? [] : value.roles"  ng-class="{'hightlight': value.checked}">
+                    <tr ng-repeat="server in $data | filter: search" ng-init="server.roles = server.roles === undefinded? [] : server.roles"  ng-class="{'hightlight': server.checked}">
                         <td>
                             <label>
-                                <input ng-model="value.checked" type="checkbox" class="ace">
+                                <input ng-model="server.checked" type="checkbox" class="ace">
                                 <span class="lbl"></span>
                             </label>
                         </td>
                         <td ng-repeat="column in server_columns" ng-show="column.visible" sortable="column.field">
                             <span ng-switch on="column.field">
                                 <span ng-switch-when="os_installed">
-                                    <span ng-if="value['os']">
+                                    <span ng-if="server['os']">
                                         <label>
-                                            <input ng-model="value.reinstallos" type="checkbox" class="ace">
+                                            <input ng-model="server.reinstallos" type="checkbox" class="ace">
                                             <span class="lbl"></span>
                                         </label>
                                     </span>
-                                    <span ng-if="!value['os']">
+                                    <span ng-if="!server['os']">
                                         -
                                     </span>
                                 </span>
                                 <span ng-switch-when="clusters">
-                                    <span ng-repeat="cluster in value.clusters">
+                                    <span ng-repeat="cluster in server.clusters">
                                         {{cluster.name}}&nbsp;
                                     </span>
                                 </span>
                                 <span ng-switch-default>
-                                    {{value[column.field]}}
+                                    {{server[column.field]}}
                                 </span>
                             </span>
                         </td>
                         <td>
-                            <div class="role-assign-drop" ui-on-Drop="onDrop($event, key)" drag-hover-class="drag-enter-role" drop-channel="{{value.dropChannel}}">
-                                <alert ng-repeat="role in value['roles']" close="removeRole(value, role)" class="role-tag border-radius-4 fade-animation" ng-style="{'background-color': role.color}">
+                            <div class="role-assign-drop" ui-on-Drop="onDrop($event, server)" drag-hover-class="drag-enter-role" drop-channel="{{server.dropChannel}}">
+                                <alert ng-repeat="role in server['roles']" close="removeRole(server, role)" class="role-tag border-radius-4" ng-style="{'background-color': role.color}">
                                     {{role.display_name}}
                                 </alert>
                             </div>
diff --git a/v2/src/app/wizard/wizard.js b/v2/src/app/wizard/wizard.js
index caaeaba..a51c7ca 100644
--- a/v2/src/app/wizard/wizard.js
+++ b/v2/src/app/wizard/wizard.js
@@ -1451,8 +1451,8 @@ angular.module('compass.wizard', [
         });
     };
 
-    $scope.onDrop = function($event, key) {
-        $scope.dragKey = key;
+    $scope.onDrop = function($event, server) {
+        $scope.dragKey = $scope.servers.indexOf(server);
     };
 
     $scope.dropSuccessHandler = function($event, role_value, key) {