You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

home.html 3.4KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. <div layout="column" layout-fill layout-align="top center">
  2. <p ng-show="DataShareBusiness.CurrentGroups.length == 0" class="welcome-message">
  3. Welcome to Chronos !
  4. </p>
  5. <p ng-show="getSheetCount() > 5">
  6. Too many elements to display, please select a sub group.
  7. </p>
  8. <div lu-busy="coursesView" class="col-xs-12 seven-cols">
  9. <div class="col-xs-12">
  10. <div class="col-xs-offset-4 col-xs-1">
  11. <md-button class="md-primary md-group-button" ng-click="goToRelativeWeek(-1)">
  12. <
  13. </md-button>
  14. </div>
  15. <div class="col-xs-2">
  16. <md-datepicker ng-model="selectedDate" md-placeholder="Enter date"></md-datepicker>
  17. </div>
  18. <div class="col-xs-1">
  19. <md-button class="md-primary md-group-button col-xs-1" ng-click="goToRelativeWeek(1)">
  20. >
  21. </md-button>
  22. </div>
  23. </div>
  24. <div class="col-xs-1 hour-column">
  25. <div class="day-column-hours">
  26. <div class="day-column-hour" ng-hide="$first" ng-repeat="hour in hours" ng-style="{'top': ($index / hours.length * 100) + '%'}">
  27. {{hour | date : timeFormat}} -
  28. </div>
  29. </div>
  30. </div>
  31. <div class="col-xs-11 days-container">
  32. <div ng-repeat="day in days" class="col-sm-1 day-column"
  33. ng-style="{'border-right': $last ? 'solid #505050 1px' : ''}">
  34. <div class="day-column-header day-column-header-day"
  35. ng-class="{'day-column-header-current': !isToday(day.date) && selectedDate.getTime() == day.date.getTime(),
  36. 'day-column-header-today': isToday(day.date)}">
  37. {{ day.day }}
  38. </div>
  39. <div class="day-column-header day-column-header-date"
  40. ng-class="{'day-column-header-current': !isToday(day.date) && selectedDate.getTime() == day.date.getTime(),
  41. 'day-column-header-today': isToday(day.date)}">
  42. {{ day.date | date : dateFormat }}
  43. </div>
  44. <div class="day-column-courses">
  45. <div class="day-column-course" ng-repeat="course in getCoursesByDate(day.date)" ng-click="showCourse(course)"
  46. ng-style="{'height': (course.EndPercent - course.BeginPercent) + '%',
  47. 'top' : course.BeginPercent + '%', 'width': (100 / course.ParallelCoursesCount)+'%',
  48. 'left': (course.ParallelCoursesPosition * (100 / course.ParallelCoursesCount)) + '%',
  49. 'border-left': (course.ParallelCoursesPosition != 0) ? 'solid #505050 1px' : ''}">
  50. <span class="day-column-course-name">{{ course.Name }}</span>
  51. <div ng-repeat="room in course.RoomList">
  52. <span class="day-column-room-name">{{room.Name}}</span>
  53. </div>
  54. <div ng-repeat="staff in course.StaffList">
  55. <span class="day-column-staff-name">{{staff.Name}}</span>
  56. </div>
  57. <span class="day-column-course-hour">{{course.BeginDate | date : timeFormat}} - {{course.EndDate | date : timeFormat}}</span>
  58. </div>
  59. </div>
  60. </div>
  61. </div>
  62. </div>
  63. </div>