chore: Add host-sets tab to in target view

2020-08-26 12:31:55 -04:00
1 parent b166a35dd6
commit e8cc2f5729
@@ -38,7 +38,7 @@ Router.map(function () {
          this.route('targets', function() {
            this.route('target', { path: ':target_id' }, function() {
              this.route('host-sets', function() {
-                this.route('host-set');
+                this.route('host-set', { path: ':host_set_id'}, function() {});
              });
            });
            this.route('new');
@@ -1,5 +1,26 @@
 import Route from '@ember/routing/route';
+import { all } from 'rsvp';

 export default class ScopesScopeProjectsProjectTargetsTargetHostSetsRoute extends Route {
+  // =methods

+  /**
+   *
+   * Loads all host-sets under the current target and it's parent scope.
+   * @return {Promise{[HostSetModel]}}
+   */
+  async model() {
+    const target = this.modelFor('scopes.scope.projects.project.targets.target');
+    const scopeID = this.modelFor('scopes.scope.projects.project').id;
+
+    const hostSets = target.host_sets.map((hostSet) =>
+      this.store.findRecord(
+        'host-set',
+        hostSet.host_set_id,
+        { adapterOptions : { scopeID, hostCatalogID: hostSet.host_catalog_id } }
+      )
+    );
+
+    return all(hostSets);
+  }
 }
@@ -1 +1,38 @@
-{{outlet}}
+<Rose::Layout::Page as |page|>
+
+  <page.breadcrumbs>
+    <BreadCrumbs />
+  </page.breadcrumbs>
+
+  <page.header>
+    <h2>{{t "resources.target"}}</h2>
+  </page.header>
+
+  <page.navigation>
+    <Rose::Nav::Tabs as |nav|>
+      <nav.link @route='scopes.scope.projects.project.targets.target.index'>
+        {{t 'titles.details'}}
+      </nav.link>
+      <nav.link @route='scopes.scope.projects.project.targets.target.host-sets'>
+        {{t 'titles.host-sets'}}
+      </nav.link>
+    </Rose::Nav::Tabs>
+  </page.navigation>
+
+  <page.actions>
+    <Rose::Dropdown @text="{{t 'form.label.manage'}}" @dropdownRight={{true}} as |dropdown|>
+      <dropdown.button
+        @style="danger"
+        @disabled={{@model.canSave}}
+        {{on "click" (route-action "delete" @model)}}
+      >
+        {{t 'actions.delete-target'}}
+      </dropdown.button>
+    </Rose::Dropdown>
+  </page.actions>
+
+  <page.body>
+    {{outlet}}
+  </page.body>
+
+</Rose::Layout::Page>
@@ -1,3 +1,33 @@
 {{title (t "resources.host-sets")}}

-{{outlet}}
+<Rose::Table as |table|>
+  <table.header as |header|>
+    <header.row as |row|>
+      <row.headerCell>{{t "form.label.name"}}</row.headerCell>
+      <row.headerCell>{{t "form.label.type"}}</row.headerCell>
+      <row.headerCell>{{t "form.label.id"}}</row.headerCell>
+    </header.row>
+  </table.header>
+  <table.body as |body|>
+    {{#each @model as |hostSet|}}
+      <body.row as |row|>
+        <row.headerCell>
+          <LinkTo
+            @route="scopes.scope.projects.project.targets.target.host-sets.host-set"
+            @model={{hostSet}}
+          >
+            {{hostSet.displayName}}
+          </LinkTo>
+          <p>{{hostSet.description}}</p>
+        </row.headerCell>
+        <row.cell>
+          <Rose::Badge @style="outline">{{hostSet.type}}</Rose::Badge>
+        </row.cell>
+        <row.cell>
+          <code>{{hostSet.id}}</code>
+        </row.cell>
+      </body.row>
+    {{/each}}
+  </table.body>
+</Rose::Table>
+
@@ -1,42 +1,5 @@
-<Rose::Layout::Page as |page|>
-
-  <page.breadcrumbs>
-    <BreadCrumbs />
-  </page.breadcrumbs>
-
-  <page.header>
-    <h2>{{t "resources.target"}}</h2>
-  </page.header>
-
-  <page.navigation>
-    <Rose::Nav::Tabs as |nav|>
-      <nav.link @route='scopes.scope.projects.project.targets.target'>
-        {{t 'titles.details'}}
-      </nav.link>
-      <nav.link @route='scopes.scope.projects.project.targets.target.host-sets'>
-        {{t 'titles.host-sets'}}
-      </nav.link>
-    </Rose::Nav::Tabs>
-  </page.navigation>
-
-  <page.actions>
-    <Rose::Dropdown @text="{{t 'form.label.manage'}}" @dropdownRight={{true}} as |dropdown|>
-      <dropdown.button
-        @style="danger"
-        @disabled={{@model.canSave}}
-        {{on "click" (route-action "delete" @model)}}
-      >
-        {{t 'actions.delete-target'}}
-      </dropdown.button>
-    </Rose::Dropdown>
-  </page.actions>
-
-  <page.body>
-    <Form::Target
-      @model={{@model}}
-      @submit={{route-action "save" @model}}
-      @cancel={{route-action "cancel" @model}}
-    />
-  </page.body>
-
-</Rose::Layout::Page>
+<Form::Target
+  @model={{@model}}
+  @submit={{route-action "save" @model}}
+  @cancel={{route-action "cancel" @model}}
+/>