#359

PlexRequests.Api.Models/Plex/PlexFriends.cs

@@ -54,7 +54,7 @@ namespace PlexRequests.Api.Models.Plex
         [XmlElement(ElementName = "Server")]
         public Server Server { get; set; }
         [XmlAttribute(AttributeName = "id")]
-        public int Id { get; set; }
+        public string Id { get; set; }
         [XmlAttribute(AttributeName = "title")]
         public string Title { get; set; }
         [XmlAttribute(AttributeName = "username")]

PlexRequests.UI/Content/app/controllers/userManagement/userManagementController.js

@@ -5,8 +5,20 @@
         $scope.user = {}; // The local user
         $scope.users = []; // list of users
 
-        $scope.error = false;
+        $scope.selectedUser = {};
-        $scope.errorMessage = {};
+
+        $scope.sortType = 'username';
+        $scope.sortReverse = false;
+        $scope.searchTerm = '';
+
+        $scope.error = {
+            error: false,
+            errorMessage: ""
+        };
+
+        $scope.selectUser = function(id) {
+            $scope.selectedUser = $scope.users.find(x => x.id === id);
+        }
 
         $scope.getUsers = function () {
             $scope.users = userManagementService.getUsers()
@@ -16,10 +28,16 @@
         };
 
         $scope.addUser = function () {
+            if (!$scope.user.username || !$scope.user.password) {
+                $scope.error.error = true;
+                $scope.error.errorMessage = "Please provide a correct username and password";
+                generateNotify($scope.error.errorMessage, 'warning');
+                return;
+            }
             userManagementService.addUser($scope.user).then(function (data) {
                 if (data.message) {
-                    $scope.error = true;
+                    $scope.error.error = true;
-                    $scope.errorMessage = data.message;
+                    $scope.error.errorMessage = data.message;
                 } else {
                     $scope.users.push(data);
                     $scope.user = {};

PlexRequests.UI/Models/UserManagementUsersViewModel.cs

@@ -1,13 +1,40 @@
-namespace PlexRequests.UI.Models
+using System.Collections.Generic;
+
+namespace PlexRequests.UI.Models
 {
     public class UserManagementUsersViewModel
     {
+        public UserManagementUsersViewModel()
+        {
+            PlexInfo = new UserManagementPlexInformation();
+        }
         public string Username { get; set; }
         public string Claims { get; set; }
-        public int Id { get; set; }
+        public string Id { get; set; }
         public string Alias { get; set; }
         public UserType Type { get; set; }
         public string EmailAddress { get; set; }
+        public UserManagementPlexInformation PlexInfo { get; set; }
+    }
+
+    public class UserManagementPlexInformation
+    {
+        public UserManagementPlexInformation()
+        {
+            Servers = new List<UserManagementPlexServers>();
+        }
+        public string Thumb { get; set; }
+        public List<UserManagementPlexServers> Servers { get; set; }
+    }
+
+    public class UserManagementPlexServers
+    {
+        public int Id { get; set; }
+        public string ServerId { get; set; }
+        public string MachineIdentifier { get; set; }
+        public string Name { get; set; }
+        public string LastSeenAt { get; set; }
+        public string NumLibraries { get; set; }
     }
 
     public enum UserType

PlexRequests.UI/Modules/UserManagementModule.cs

@@ -31,7 +31,7 @@ namespace PlexRequests.UI.Modules
             Get["/users", true] = async (x, ct) => await LoadUsers();
             Post["/createuser"] = x => CreateUser(Request.Form["userName"].ToString(), Request.Form["password"].ToString());
             Get["/local/{id}"] = x => LocalDetails((Guid)x.id);
-            Get["/plex/{id}", true] = async (x,ct) => await PlexDetails((int)x.id);
+            Get["/plex/{id}", true] = async (x,ct) => await PlexDetails(x.id);
         }
 
         private ICustomUserMapper UserMapper { get; }
@@ -56,6 +56,7 @@ namespace PlexRequests.UI.Modules
 
                 model.Add(new UserManagementUsersViewModel
                 {
+                    Id= user.UserGuid,
                     Claims = claimsString,
                     Username = user.UserName,
                     Type = UserType.LocalUser,
@@ -71,13 +72,18 @@ namespace PlexRequests.UI.Modules
 
                 foreach (var u in plexUsers.User)
                 {
+
                     model.Add(new UserManagementUsersViewModel
                     {
                         Username = u.Username,
                         Type = UserType.PlexUser,
                         Id = u.Id,
                         Claims = "Requestor",
-                        EmailAddress = u.Email
+                        EmailAddress = u.Email,
+                        PlexInfo = new UserManagementPlexInformation
+                        {
+                            Thumb = u.Thumb
+                        }
                     });
                 }
             }
@@ -114,7 +120,7 @@ namespace PlexRequests.UI.Modules
             return Nancy.Response.NoBody;
         }
 
-        private async Task<Response> PlexDetails(int id)
+        private async Task<Response> PlexDetails(string id)
         {
             var plexSettings = await PlexSettings.GetSettingsAsync();
             if (!string.IsNullOrEmpty(plexSettings.PlexAuthToken))
@@ -122,7 +128,7 @@ namespace PlexRequests.UI.Modules
                 //Get Plex Users
                 var plexUsers = PlexApi.GetUsers(plexSettings.PlexAuthToken);
 
-                var selectedUser = plexUsers.User?.FirstOrDefault(x => x.Id == id);
+                var selectedUser = plexUsers.User?.FirstOrDefault(x => x.Id.ToString() == id);
                 if (selectedUser != null)
                 {
                     return Response.AsJson(selectedUser);

PlexRequests.UI/Views/UserManagement/Index.cshtml

@@ -3,50 +3,91 @@
 <script src="~/Content/app/controllers/userManagement/userManagementController.js"></script>
 <script src="~/Content/app/services/userManagement/userManagementService.js"></script>
 <div ng-controller="userManagementController" ng-init="getUsers()">
-    
-    <br>
-    <br>
-    <fieldset>
-        <table class="table table-striped table-hover table-responsive">
-            <thead>
-            <tr>
-                <th>Id</th>
-                <th>Username</th>
-                <th>Email</th>
-                <th>User Type</th>
-            </tr>
-            </thead>
-            <tbody>
-            <tr ng-repeat="u in users">
-                <td>
-                    {{u.username}}
-                </td>
-                <td>
-                    {{u.emailAddress}}
-                </td>
-                <td>
-                    {{u.claims}}
-                </td>
-                <td>
-                    {{u.type == 0 ? 'Local User' : 'Plex User'}}
-                    {{u.type}}
-                </td>
-            </tr>
-            </tbody>
-
-        </table>
-
 
+    <div class="col-md-7">
+        <br>
+        <br>
+        <div ng-show="error.error" ng-bind="error.errorMessage"></div>
         <form ng-submit="addUser()">
             <div class="form-group">
-                <input id="username" type="text" placeholder="user" ng-model="user.username" class="form-control-custom"/>
+                <input id="username" type="text" placeholder="user" ng-model="user.username" class="form-control-custom" />
             </div>
             <div class="form-group">
-                <input id="password" type="password" placeholder="password" ng-model="user.password" class="form-control-custom"/>
+                <input id="password" type="password" placeholder="password" ng-model="user.password" class="form-control-custom" />
             </div>
-            <input type="submit" class="btn btn-success-outline" value="Add"/>
+            <input type="submit" class="btn btn-success-outline" value="Add" />
         </form>
-    </fieldset>
+        <form>
-</div>
+            <div class="form-group">
+                <div class="input-group">
+                    <div class="input-group-addon">
+                        <i class="fa fa-search"></i>
+                    </div>
+
+                    <input type="text" class="form-control" placeholder="Search" ng-model="searchTerm">
+
+                </div>
+            </div>
+        </form>
+        <table class="table table-striped table-hover table-responsive table-condensed">
+            <thead>
+                <tr>
+                    <th>
+                        <a href="#" ng-click="sortType = 'username'; sortReverse = !sortReverse">
+                            Username
+                            <span ng-show="sortType == 'username' && !sortReverse" class="fa fa-caret-down"></span>
+                            <span ng-show="sortType == 'username' && sortReverse" class="fa fa-caret-up"></span>
+                        </a>
+                    </th>
+                    <th>
+                        <a href="#" ng-click="sortType = 'emailAddress'; sortReverse = !sortReverse">
+                            Email
+                            <span ng-show="sortType == 'emailAddress' && !sortReverse" class="fa fa-caret-down"></span>
+                            <span ng-show="sortType == 'emailAddress' && sortReverse" class="fa fa-caret-up"></span>
+                        </a>
+                    </th>
+                    <th>
+                        <a href="#" ng-click="sortType = 'type'; sortReverse = !sortReverse">
+                            User Type
+                            <span ng-show="sortType == 'type' && !sortReverse" class="fa fa-caret-down"></span>
+                            <span ng-show="sortType == 'type' && sortReverse" class="fa fa-caret-up"></span>
+                        </a>
+                    </th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr ng-repeat="u in users | orderBy:sortType:sortReverse | filter:searchTerm">
+                    <td>
+                        {{u.username}}
+                    </td>
+                    <td>
+                        {{u.emailAddress}}
+                    </td>
+                    <td>
+                        {{u.claims}}
+                    </td>
+                    <td>
+                        {{u.type === 1 ? 'Local User' : 'Plex User'}}
+                    </td>
+                    <td>
+                        <a href="#" ng-click="selectUser(u.id)" class="btn btn-info-outline">Details/Edit</a>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+
+    <div class="col-md-5">
+        <img ng-src="{{selectedUser.plexInfo.thumb}}"/>
+        <div ng-bind="selectedUser.id"></div>
+        <div ng-bind="selectedUser.username"></div>
+        <div ng-bind="selectedUser.emailAddress"></div>
+        <div ng-bind="selectedUser.claims"></div>
+        <div ng-bind="selectedUser.type === 1 ? 'Local User' : 'Plex User'"></div>
+
+    </div>
 
 
+
+
+</div>