PUNKT-49 Dostępność testu przy dodawaniu do grupy

FrontEnd/.angular-cli.json

@@ -24,6 +24,7 @@
         "../node_modules/primeng/resources/primeng.min.css",
         "../node_modules/primeng/resources/themes/luna-amber/theme.css",
         "../node_modules/primeng/resources/components/dialog/dialog.css",
+        "../node_modules/primeng/resources/components/calendar/calendar.css",
         "styles.css"
       ],
       "scripts": [

FrontEnd/src/app/groups/groups.module.ts

@@ -14,6 +14,7 @@ import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { MatNativeDateModule } from '@angular/material';
+import { CalendarModule } from 'primeng/calendar';
 
 import { GroupsService } from './groups.service';
 
@@ -50,7 +51,8 @@ import { TestsInGroupResultsComponent } from './tests-in-group-results/tests-in-
     MatInputModule,
     MatDatepickerModule,
     ReactiveFormsModule,
-    MatNativeDateModule
+    MatNativeDateModule,
+    CalendarModule
   ],
   declarations: [
     MyGroupsComponent,

FrontEnd/src/app/groups/groups.service.ts

@@ -177,9 +177,17 @@ export class GroupsService {
       });
   }
 
-  addTestsToGroup(group: number, tests: Array<string>): Observable<any> {
+  addTestsToGroup(group: number, tests: Array<string>, dateFrom: number = null, dateTo = null): Observable<any> {
     const testToSend = tests.map(item => {
-      return { testId: item };
+      if (dateFrom === null) {
+        return { testId: item };
+      } else {
+        return {
+          testId: item,
+          dateFrom: dateFrom,
+          dateTo: dateTo
+        }
+      }
     });
     this.setHeaders();
     return this.httpClient.post(`groups/${group}/tests`,
@@ -193,6 +201,30 @@ export class GroupsService {
       });
   }
 
+  putTestsToGroup(group: number, tests: Array<string>, dateFrom: number = null, dateTo = null): Observable<any> {
+    const testToSend = tests.map(item => {
+      if (dateFrom === null) {
+        return { testId: item };
+      } else {
+        return {
+          testId: item,
+          dateFrom: dateFrom,
+          dateTo: dateTo
+        }
+      }
+    });
+    this.setHeaders();
+    return this.httpClient.put(`groups/${group}/tests`,
+      testToSend,
+      {
+        headers: this.headers,
+        observe: 'response',
+        responseType: 'text'
+      }).catch((error: any) => {
+        return Observable.throw(error);
+      });
+  }
+
   addMaterialsToGroup(group: number, materials: Array<string>): Observable<any> {
     const testToSend = materials.map(item => {
       return { materialId: item };

FrontEnd/src/app/groups/sharing-resources-in-groups/sharing-resources-in-groups.component.css

@@ -30,3 +30,8 @@
     display: flex;
     justify-content: center;
 }
+
+input {
+    margin-left: 1rem;
+    padding-left: 5px;
+}

FrontEnd/src/app/groups/sharing-resources-in-groups/sharing-resources-in-groups.component.html

@@ -25,6 +25,14 @@
             <h2 *ngIf="testsToAdd.length > 0">Testy</h2>
           </p-header>
         </p-listbox>
+        <div *ngIf="testsToAdd.length > 0">
+          <br /><br />
+          Od kiedy test ma być dostępny:
+          <p-calendar [(ngModel)]="dateFrom" [showTime]="true"></p-calendar>
+          <br /><br /><br />
+          Ile minut ma być dostępny ten test:
+          <input type="number" step="1" min="1" name="howLong" [(ngModel)]="howLong" />
+        </div>
         <br /><br />
         <button [disabled]="selected.length === 0" class="button mr-1" (click)="addResources()"><i class="fas fa-check-circle"></i> Dodaj</button>
       </div>

FrontEnd/src/app/groups/sharing-resources-in-groups/sharing-resources-in-groups.component.ts

@@ -15,6 +15,8 @@ import { Subscription } from 'rxjs/Subscription';
 export class SharingResourcesInGroupsComponent implements OnInit, OnDestroy {
 
   public id = 0;
+  public dateFrom: Date;
+  public howLong = 10;
 
   public materialsToAdd: Resource[] = [];
   public testsToAdd: Resource[] = [];
@@ -159,7 +161,13 @@ export class SharingResourcesInGroupsComponent implements OnInit, OnDestroy {
   addResources() {
     this.id = this.route.snapshot.params.id;
     if (this.selectedTypeOfResource === ResourceType.test) {
-      this.addTestsToGroupSub = this.groupService.addTestsToGroup(this.id, this.selected).subscribe(
+      let dateFrom = null;
+      let dateTo = null;
+      if (this.dateFrom) {
+        dateFrom = this.dateFrom.getTime();
+        dateTo = dateFrom + this.howLong * 60 * 1000;
+      }
+      this.addTestsToGroupSub = this.groupService.addTestsToGroup(this.id, this.selected, dateFrom, dateTo).subscribe(
         success => {
           this.snackBar.open('Twoje testy zostały dodane do grupy.', null,
             { duration: 3000, verticalPosition: 'top', panelClass: ['snackbar-success'] });

FrontEnd/src/styles.css

@@ -202,11 +202,21 @@ button:hover, a:hover {
     border: 1px solid #625283 !important;
 }
 
-.wrapper .wrapper-add .container .wrapper .wrapper-add .container {
+.wrapper .wrapper-add .container .wrapper .wrapper-add .container, body .ui-listbox .ui-listbox-list {
     background-color: #19032f !important;
     border: 1px solid #45395e !important;
 }
 
+body .ui-listbox .ui-listbox-header {
+    background-color: #0c0118 !important;
+    border: 1px solid #45395e !important;
+}
+
+body .ui-chkbox .ui-chkbox-box {
+    background-color: #45395e !important;
+    border: 1px solid #625283 !important;
+}
+
 .ui-dialog * {
     font-family: 'Roboto Slab', 'Cambria', serif !important;
 }
@@ -333,3 +343,22 @@ button:hover, a:hover {
     }
 
 }
+
+p-calendar {
+    margin-left: 1rem !important;
+}
+
+body .ui-inputtext {
+    background-color: #FFF !important;
+    border: 1px solid #FFF !important;
+    color: #000 !important;
+}
+
+body .ui-datepicker {
+    background-color: #19032f !important;
+    border: 1px solid #45395e !important;
+}
+
+body .ui-datepicker .ui-datepicker-header {
+    background-color: #0c0118 !important;
+}