Created Students Courses Index View (#84)

Add Style & Unenroll Button
MatiasComercio · Feb 3, 2017 · d09d70e · d09d70e
1 parent 40e0f6f
commit d09d70e
Show file tree

Hide file tree

Showing 6 changed files with 157 additions and 0 deletions.
diff --git a/app/scripts/controllers/students/StudentsCoursesIndexCtrl.js b/app/scripts/controllers/students/StudentsCoursesIndexCtrl.js
@@ -0,0 +1,51 @@
+'use strict';
+
+define(['paw'], function(paw) {
+  paw.controller('StudentsCoursesIndexCtrl', ['$routeParams', function($routeParams) {
+    var docket = $routeParams.docket; // For future Service calls
+
+    this.student = {
+      docket: '55019',
+      firstName: 'Matías',
+      lastName: 'Mercado',
+      email: 'mmercado@itba.edu.ar',
+      genre: 'Masculino',
+      dni: '38917403',
+      birthday: '1995-05-04',
+      address: {
+        country: 'Argentina',
+        city: 'Buenos Aires',
+        neighborhood: 'Almagro',
+        number: '682',
+        street: 'Corrientes',
+        floor: '2',
+        door: 'A',
+        telephone: '1544683390',
+        zipCode: '1100'
+      },
+      courses: [
+        {
+          courseId: '72.03',
+          credits: 3,
+          name: 'Introducción a Informática',
+          semester: 1
+        },
+        {
+          courseId: '94.21',
+          credits: 6,
+          name: 'Formacion General I',
+          semester: 5
+        }
+      ]
+    };
+
+    this.filter = {
+      id: $routeParams.id,
+      name: $routeParams.name
+    };
+    this.resetSearch = function() {
+      this.filter = {};
+    };
+
+  }]);
+});
diff --git a/app/scripts/i18n/translations.es.js b/app/scripts/i18n/translations.es.js
@@ -84,6 +84,9 @@ define([], function() {
     // Course Show
     i18nCourses: 'Materias',
     i18nInformation: 'Información',
+    // Students Inscriptions
+    i18nUnenroll: 'Dar de Baja',
+    // Courses Index
     i18nCourseId: 'Código',
     i18nCourseName: 'Nombre',
     i18nCredits: 'Créditos',

diff --git a/app/scripts/routes.js b/app/scripts/routes.js
@@ -51,6 +51,11 @@ define([], function() {
                 templateUrl: 'views/courses/correlatives_new.html',
                 controller: 'CoursesCorrelativesNewCtrl',
                 relativePath: '/courses'
+            },
+            '/students/:docket/courses': {
+                templateUrl: 'views/students/courses_index.html',
+                controller: 'StudentsCoursesIndexCtrl',
+                relativePath: '/students'
             }
             /* ===== yeoman hook ===== */
             /* Do not remove these commented lines! Needed for auto-generation */

diff --git a/app/styles/main.scss b/app/styles/main.scss
@@ -20,3 +20,4 @@ $fa-font-path: '../bower_components/font-awesome/fonts';
 @import 'partials/courses/show';
 @import 'partials/courses/students_index';
 @import 'partials/courses/correlatives_new';
+@import 'partials/students/courses_index';
diff --git a/app/styles/partials/students/_courses_index.scss b/app/styles/partials/students/_courses_index.scss
@@ -0,0 +1,20 @@
+@import 'modules/variables/importer';
+
+.students-courses-index-container {
+  .table {
+    .actions-container {
+      display: flex;
+      flex-wrap: wrap;
+      width: 100%;
+      justify-content: flex-start;
+
+      .btn {
+        flex: 1;
+        min-width: 175px;
+        max-width: 200px;
+        margin: 10px;
+        margin-left: 0;
+      }
+    }
+  }
+}
diff --git a/app/views/students/courses_index.html b/app/views/students/courses_index.html
@@ -0,0 +1,77 @@
+<div ng-controller='StudentsCoursesIndexCtrl as controller' class='students-courses-index-container'>
+  <!-- Page Heading -->
+  <div class='page-header break-words'>
+    <h1 class='inline'>
+      <span translate='i18nStudents'></span>
+    </h1>
+    <h2 class='inline'>
+      <span> - </span>
+      <span> {{controller.student.firstName}} {{controller.student.lastName}}</span>
+      <small> - </small>
+      <small translate='i18nStudentCourses'></small>
+    </h2>
+  </div>
+  <!-- /Page Heading -->
+
+  <!-- Filter -->
+  <div class='filter-container'>
+    <div class='filter-fields'>
+      <div class='own-input-group'>
+        <span class='search-label' translate=i18nCourseId></span>
+        <input type='text' class='form-input-field' ng-model='controller.filter.id' placeholder="{{ 'i18nCourseId' | translate }}..."/>
+      </div>
+      <div class='own-input-group'>
+        <span class='search-label' translate='i18nCourseName'></span>
+        <input type='text' class='form-input-field' ng-model='controller.filter.name' placeholder="{{ 'i18nCourseName' | translate }}..."/>
+      </div>
+    </div>
+    <div class='filter-buttons'>
+      <button class='btn btn-default' type='submit'>
+        <span class='fa fa-search' aria-hidden='true'></span>
+        <span translate='i18nSearchButton' translate ></span>
+      </button>
+      <button class='btn btn-default' ng-click='controller.resetSearch()' type='submit'>
+        <span class='fa fa-repeat' aria-hidden='true'></span>
+        <span translate='i18nResetButton'></span>
+      </button>
+    </div>
+  </div>
+  <!-- /Filter -->
+
+  <!-- Content -->
+  <div class='table-responsive'>
+    <table class='table table-hover'>
+      <thead>
+        <tr>
+          <th translate='i18nCourseId'></th>
+          <th translate='i18nCourseName'></th>
+          <th translate='i18nCredits'></th>
+          <th translate='i18nSemester'></th>
+          <th translate='i18nActions'></th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr ng-hide='controller.student.courses.length > 0' class='bg-warning'>
+          <td colspan='5' class='text-danger text-center' translate='i18nNoCoursesFound'></td>
+        </tr>
+        <tr ng-repeat='course in controller.student.courses'>
+          <td>{{ course.courseId }}</td>
+          <td>{{ course.name }}</td>
+          <td>{{ course.credits }}</td>
+          <td>{{ course.semester }}</td>
+          <td class='actions-container'>
+            <a class='btn btn-default' role='button'>
+              <span class='fa fa-info-circle' aria-hidden='true'></span>
+              <span translate='i18nCourseShow'></span>
+            </a>
+            <a class='btn btn-danger' role='button'>
+              <span class='fa fa-trash' aria-hidden='true'></span>
+              <span translate='i18nUnenroll'></span>
+            </a>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+  <!-- Content -->
+</div>