[sidebar] Showing basic information on side panel
authorErik Haider Forsén <erikhf@ifi.uio.no>
Thu, 19 Nov 2015 18:32:50 +0000 (19:32 +0100)
committerErik Haider Forsén <erikhf@ifi.uio.no>
Thu, 19 Nov 2015 18:32:50 +0000 (19:32 +0100)
src/components/app.html
src/components/sidebar/sidebar.html
src/components/sidebar/sidebar.ts

index 803b227..153fffd 100644 (file)
@@ -1,13 +1,18 @@
 <div class="container">
     <div class="nav">
         Navbar
-        <mou-search (newsearch)="map.update($event)"></mou-search>
+        <mou-search (newsearch)="sidebar.update($event)"></mou-search>
         <mou-filter></mou-filter>
     </div>
 
-    <mou-map (newactive)="sidebar.update($event)" #map></mou-map>
-    <mou-sidebar #sidebar></mou-sidebar>
-
+    <div class="row">
+        <div class="col-md-8">
+            <mou-map (newactive)="sidebar.update($event)" #map></mou-map>
+        </div>
+        <div class="col-md-4">
+            <mou-sidebar #sidebar></mou-sidebar>
+        </div>
+    </div>
 </div>
 
 
index d0ac134..875e2c2 100644 (file)
@@ -1 +1,19 @@
-<div>Yolo world!</div>
\ No newline at end of file
+<div>
+    <div *ng-if="activeOrgUnit">
+        <div class="form-group">
+            <label>Name</label>
+            <input class="form-control" type="text" [(ng-model)]="activeOrgUnit.name" [disabled]="!editmode">
+        </div>
+        <div class="form-group">
+            <label>Shortname</label>
+            <input class="form-control" type="text" [(ng-model)]="activeOrgUnit.shortName" [disabled]="!editmode">
+        </div>
+        <fieldset class="form-group">
+            <legend>Group(s)</legend>
+            <div *ng-for="#group of activeOrgUnit.organisationUnitGroups">
+                <input class="form-control" type="text" [(ng-model)]="group.name" [disabled]="!editmode">
+            </div>
+        </fieldset>
+        <button class="btn btn-default" (click)="editmode = !editmode">Edit</button>
+    </div>
+</div>
\ No newline at end of file
index f3e46ab..704268c 100644 (file)
@@ -1,17 +1,27 @@
-import {Component, CORE_DIRECTIVES,} from 'angular2/angular2';
+import {Component, NgFor, NgIf, NgModel, CORE_DIRECTIVES,FORM_DIRECTIVES} from 'angular2/angular2';
 import {Http} from 'angular2/http';
 
 
 @Component({
     selector: 'mou-sidebar',
-    directives: [CORE_DIRECTIVES],
+    directives: [CORE_DIRECTIVES,FORM_DIRECTIVES,NgFor,NgModel,NgIf],
     templateUrl: './components/sidebar/sidebar.html'
 })
 export class Sidebar {
     http: Http;
+    activeOrgUnit: Object;
+    editmode: boolean;
 
     constructor(http:Http){
         this.http = http;
+        editmode = false;
+    }
+
+    update(orgunitId){
+        console.log(orgunitId);
+        this.http.get(dhisAPI + "/api/organisationUnits/" + orgunitId)
+            .map(res => res.json())
+            .subscribe(res => this.activeOrgUnit = res)
     }
 }