From f0b1ab034fd1bd75c27d36161be20455fa0de785 Mon Sep 17 00:00:00 2001
From: John Mitchell <jlmitch5@ncsu.edu>
Date: Thu, 21 Jan 2016 18:11:04 -0500
Subject: [PATCH] added links to cards (actual links and badges don't work)

---
 awx/ui/client/legacy-styles/lists.less        |  2 ++
 .../client/src/controllers/Organizations.js   | 25 +++++++++++++++++++
 .../src/organizations/orgcards.block.less     | 23 ++++++++++++++++-
 awx/ui/client/src/partials/organizations.html | 12 +++++++++
 4 files changed, 61 insertions(+), 1 deletion(-)

diff --git a/awx/ui/client/legacy-styles/lists.less b/awx/ui/client/legacy-styles/lists.less
index 8361dc2fed..11b1a6dcd7 100644
--- a/awx/ui/client/legacy-styles/lists.less
+++ b/awx/ui/client/legacy-styles/lists.less
@@ -129,6 +129,7 @@ table, tbody {
 }
 
 .List-header {
+    align-items: center;
     display: flex;
     height: 34px;
 }
@@ -145,6 +146,7 @@ table, tbody {
     height: 14px;
     margin: 3px 0;
     background-color: @list-title-badge;
+    border-radius: 5px;
 }
 
 .List-titleText {
diff --git a/awx/ui/client/src/controllers/Organizations.js b/awx/ui/client/src/controllers/Organizations.js
index a6d3507eb0..ff89fb63a7 100644
--- a/awx/ui/client/src/controllers/Organizations.js
+++ b/awx/ui/client/src/controllers/Organizations.js
@@ -28,6 +28,31 @@ export function OrganizationsList($stateParams, $scope, $rootScope, $location,
                 val.isActiveCard = true;
             }
             val.description = card.description || undefined;
+            val.links = [];
+            val.links.push({
+                href: card.related.users,
+                name: "USERS"
+            });
+            val.links.push({
+                href: card.related.teams,
+                name: "TEAMS"
+            });
+            val.links.push({
+                href: card.related.inventories,
+                name: "INVENTORIES"
+            });
+            val.links.push({
+                href: card.related.projects,
+                name: "PROJECTS"
+            });
+            val.links.push({
+                href: card.related.job_templates,
+                name: "JOB TEMPLATES"
+            });
+            val.links.push({
+                href: card.related.admins,
+                name: "ADMINS"
+            });
             return val;
         });
     };
diff --git a/awx/ui/client/src/organizations/orgcards.block.less b/awx/ui/client/src/organizations/orgcards.block.less
index e3438c2fbb..9ee5180381 100644
--- a/awx/ui/client/src/organizations/orgcards.block.less
+++ b/awx/ui/client/src/organizations/orgcards.block.less
@@ -8,6 +8,7 @@
 .OrgCards-card {
     background-color: #fff;
     padding: 20px;
+    padding-bottom: 0px;
     border-radius: 5px;
     border: 1px solid #e8e8e8;
     display: flex;
@@ -51,12 +52,32 @@
 }
 
 .OrgCards-description {
-    margin-bottom: 0px;
+    margin-bottom: 20px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }
 
+.OrgCards-links {
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+
+.OrgCards-link {
+    flex: initial;
+    width: ~"calc(50% - 20px)";
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    margin-bottom: 20px;
+}
+
+.OrgCards-linkBadge {
+    margin-right: 10px;
+}
+
 @media (min-width: 1179px) {
     .OrgCards-card {
         width: ~"calc(25% - 15px)";
diff --git a/awx/ui/client/src/partials/organizations.html b/awx/ui/client/src/partials/organizations.html
index c027c3b6fa..a9d47afd32 100644
--- a/awx/ui/client/src/partials/organizations.html
+++ b/awx/ui/client/src/partials/organizations.html
@@ -42,6 +42,18 @@
                 </div>
             </div>
             <p class="OrgCards-description">{{ card.description || "Place organization description here" }}</p>
+            <div class="OrgCards-links">
+                <div class="OrgCards-link" ng-repeat="link in card.links">
+                    <span class="badge List-titleBadge
+                        OrgCards-linkBadge">
+                        0
+                    </span>
+                    <a class="OrgCards-linkName"
+                        ng-href="{{ link.href }}">
+                        {{ link.name }}
+                    </a>
+                </div>
+            </div>
         </div>
     </div>
 </div>