Skip to content

[726] added error messages to recruitment dates in offer creation #1041

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
dianawieczorek wants to merge 8 commits into
base: master
Choose a base branch
from
Open

[726] added error messages to recruitment dates in offer creation #1041

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
208c140
added error messages to recruitment dates in offer creation
dianawieczorek Aug 8, 2018
85ab45f
fixed lint issues
dianawieczorek Aug 8, 2018
fab3fbe
changed custom facebook metatags for organizations
dianawieczorek Sep 26, 2018
9bc6f2e
changes
dianawieczorek Sep 26, 2018
cf426b8
revert unnecessary changes
dianawieczorek Sep 26, 2018
c44a28b
added semicolon in css
dianawieczorek Oct 17, 2018
b4efac7
Merge remote-tracking branch 'upstream/master'
dianawieczorek Oct 18, 2018
2c63d25
Merge branch 'master' into error-msg-offer-date
dianawieczorek Oct 24, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion frontend/package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

44 changes: 35 additions & 9 deletions frontend/src/app/offers/create-offer/create-offer.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ <h2>{{ inEditMode ? "Edycja" : "Tworzenie" }} oferty:</h2>
<label for="title" class="col-sm-3 col-form-label">*Tytuł oferty:</label>
<div class="col-sm-6">
<input type="text" class="form-control" placeholder="Tytuł oferty..." id="title" formControlName="title" required>
<span class="form-text text-muted" *ngIf="isFormInputInvalid('title')">
<span class="form-text text-danger" *ngIf="isFormInputInvalid('title')">
To pole jest obowiązkowe.</span>
</div>
<div class="col-sm-3">Określ, jak oferta będzie nazywać się w systemie, staraj się być dokładnym.</div>
Expand All @@ -28,7 +28,7 @@ <h2>{{ inEditMode ? "Edycja" : "Tworzenie" }} oferty:</h2>
<div class="col-sm-6">
<input type="text" class="form-control" placeholder="Miejsce odbywania wolontariatu..." id="location" formControlName="location"
required>
<span class="form-text text-muted" *ngIf="isFormInputInvalid('location')">
<span class="form-text text-danger" *ngIf="isFormInputInvalid('location')">
To pole jest obowiązkowe.</span>
</div>
<div class="col-sm-3">Określ, w jakim miejscu odbywać się będzie wolontariat.</div>
Expand All @@ -40,7 +40,7 @@ <h2>{{ inEditMode ? "Edycja" : "Tworzenie" }} oferty:</h2>
<option *ngFor="let organization of user?.organizations" [ngValue]="organization">
{{ organization?.name }}</option>
</select>
<span class="form-text text-muted" *ngIf="isFormInputInvalid('organization')">
<span class="form-text text-danger" *ngIf="isFormInputInvalid('organization')">
To pole jest obowiązkowe.</span>
</div>
<div class="col-sm-3">Określ organizację odpowiedzialną za wolontariat.</div>
Expand All @@ -64,7 +64,7 @@ <h3>Realizacja akcji:</h3>
</div>
</div>
<div class="col-sm-12 errors">
<span class="form-text text-muted" *ngIf="form.errors?.startedAtError">Jeśli akcja już trwa, nie podawaj daty początkowej.</span>
<span class="form-text text-danger" *ngIf="form.errors?.startedAtError">Jeśli akcja już trwa, nie podawaj daty początkowej.</span>
</div>
</div>
<div class="col-sm-3">Określ datę rozpoczęcia akcji w formacie RRRR-MM-DD.</div>
Expand All @@ -87,7 +87,7 @@ <h3>Realizacja akcji:</h3>
</div>
</div>
<div class="col-sm-12 errors">
<span class="form-text text-muted" *ngIf="form.errors?.finishedAtError">
<span class="form-text text-danger" *ngIf="form.errors?.finishedAtError">
Jeśli akcja nie kończy się, nie podawaj daty końcowej.
</span>
</div>
Expand All @@ -106,12 +106,25 @@ <h5 class="card-header">Rekrutacja podstawowa</h5>
<div class="col-sm-9">
<input type="datetime" placeholder="RRRR-MM-DD" class="form-control" id="recruitmentStartDate" formControlName="recruitmentStartDate">
</div>
<div class="col-sm-12 errors">
<span class="form-text text-danger" *ngIf="form.errors?.recruitmentStartDateError">
Rekrutacja nie moze zaczynać się po zakończeniu akcji
</span>
</div>
</div>
<div class="form-group row">
<label for="recruitmentEndDate" class="col-sm-3 col-form-label">Koniec:</label>
<div class="col-sm-9">
<input type="datetime" placeholder="RRRR-MM-DD" class="form-control" id="recruitmentEndDate" formControlName="recruitmentEndDate">
</div>
<div class="col-sm-12 errors">
<span class="form-text text-danger" *ngIf="form.errors?.recruitmentEndDateError">
Rekrutacja nie moze kończyć się po zakończeniu akcji
</span>
<span class="form-text text-danger" *ngIf="form.errors?.recruitmentError">
Data zakończenia rekrutacji nie może być wcześniejsza niż data jej rozpoczęcia
</span>
</div>
</div>
<div class="form-group row">
<label for="volunteersLimit" class="col-sm-3 col-form-label">Limit wolontariuszy:</label>
Expand All @@ -131,12 +144,25 @@ <h5 class="card-header">Rekrutacja rezerwowa</h5>
<div class="col-sm-9">
<input type="datetime" placeholder="RRRR-MM-DD" class="form-control" id="reserveRecruitmentStartDate" formControlName="reserveRecruitmentStartDate">
</div>
<div class="col-sm-12 errors">
<span class="form-text text-danger" *ngIf="form.errors?.reserveRecruitmentStartDate">
Rekrutacja rezerwowa nie moze zaczynać się po zakończeniu akcji
</span>
</div>
</div>
<div class="form-group row">
<label for="reserveRecruitmentEndDate" class="col-sm-3 col-form-label">Koniec:</label>
<div class="col-sm-9">
<input type="datetime" placeholder="RRRR-MM-DD" class="form-control" id="reserveRecruitmentEndDate" formControlName="reserveRecruitmentEndDate">
</div>
<div class="col-sm-12 errors">
<span class="form-text text-danger" *ngIf="form.errors?.reserveRecruitmentEndDate">
Rekrutacja rezerwowa nie moze kończyć się po zakończeniu akcji
</span>
<span class="form-text text-danger" *ngIf="form.errors?.reserveRecruitmentDate">
Data końca rekrutacji rezerwowej nie może być wcześniejsza niż data jej rozpoczęcia
</span>
</div>
</div>
<div class="form-group row">
<label for="reserveVolunteersLimit" class="col-sm-3 col-form-label">Limit wolontariuszy:</label>
Expand All @@ -155,7 +181,7 @@ <h5 class="card-header">Rekrutacja rezerwowa</h5>
<div class="col-sm-6">
<textarea type="text" class="form-control" placeholder="Opis oferty..." id="description" formControlName="description" required>
</textarea>
<span class="form-text text-muted" *ngIf="isFormInputInvalid('description')">
<span class="form-text text-danger" *ngIf="isFormInputInvalid('description')">
To pole jest obowiązkowe.</span>
</div>
<div class="col-sm-3">Postaraj się dokładnie opisać akcję.</div>
Expand All @@ -166,7 +192,7 @@ <h5 class="card-header">Rekrutacja rezerwowa</h5>
<textarea type="text" class="form-control" placeholder="Wymagania czasowe..." id="timeCommitment" formControlName="timeCommitment"
required>
</textarea>
<span class="form-text text-muted" *ngIf="isFormInputInvalid('timeCommitment')">
<span class="form-text text-danger" *ngIf="isFormInputInvalid('timeCommitment')">
To pole jest obowiązkowe.</span>
</div>
<div class="col-sm-3">Określ wymagania czasowe - ile godzin pracy w ciągu dnia wymaga dana akcja.</div>
Expand All @@ -177,7 +203,7 @@ <h5 class="card-header">Rekrutacja rezerwowa</h5>
<textarea type="text" class="form-control" placeholder="Korzyści dla wolontariusza..." id="benefits" formControlName="benefits"
required>
</textarea>
<span class="form-text text-muted" *ngIf="isFormInputInvalid('benefits')">
<span class="form-text text-danger" *ngIf="isFormInputInvalid('benefits')">
To pole jest obowiązkowe.</span>
</div>
<div class="col-sm-3">Określ korzyści płynące z udziału w akcji.</div>
Expand All @@ -203,7 +229,7 @@ <h5 class="card-header">Rekrutacja rezerwowa</h5>
</div>
<input type="file" id="image" (change)="onFileSelected($event)" accept="image/x-png,image/jpeg">
</div>
<span class="form-text text-muted" *ngIf="isFileToBig">
<span class="form-text text-danger" *ngIf="isFileToBig">
Rozmiar pliku nie może przekraczać 1MB.
</span>
</div>
Expand Down
4 changes: 4 additions & 0 deletions frontend/src/app/offers/create-offer/create-offer.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,3 +17,7 @@ label {
text-align: left;
}
}

.form-text{
font-size: .875rem

@magul magul Oct 13, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should end with semicolon

@dianawieczorek dianawieczorek Oct 17, 2018

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

added

}
35 changes: 34 additions & 1 deletion frontend/src/app/offers/create-offer/create-offer.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,8 @@ export class CreateOfferComponent implements OnInit, OnDestroy {
}

areDatesValid(form: FormGroup): {[key: string]: boolean} | null {
const { startedAt, actionOngoing, finishedAt, constantCoop } = form.value;
const { startedAt, actionOngoing, finishedAt, constantCoop, recruitmentStartDate, recruitmentEndDate,
reserveRecruitmentStartDate, reserveRecruitmentEndDate } = form.value;
const validationErrors = {};

if (startedAt && actionOngoing) {
Expand All @@ -150,6 +151,38 @@ export class CreateOfferComponent implements OnInit, OnDestroy {
validationErrors['finishedAtError'] = true;
}

if (recruitmentStartDate && constantCoop || recruitmentStartDate && finishedAt === '') {
validationErrors['recruitmentStartDateError'] = false;
} else if (recruitmentStartDate > finishedAt) {
validationErrors['recruitmentStartDateError'] = true;
}

if (recruitmentEndDate && constantCoop || recruitmentEndDate && finishedAt === '') {
validationErrors['recruitmentEndDateError'] = false;
} else if (recruitmentEndDate > finishedAt) {
validationErrors['recruitmentEndDateError'] = true;
}

if (recruitmentEndDate < recruitmentStartDate) {
validationErrors['recruitmentError'] = true;
}

if (reserveRecruitmentStartDate && constantCoop || reserveRecruitmentStartDate && finishedAt === '') {
validationErrors['reserveRecruitmentStartDate'] = false;
} else if (reserveRecruitmentStartDate > finishedAt) {
validationErrors['reserveRecruitmentStartDate'] = true;
}

if (reserveRecruitmentEndDate && constantCoop || reserveRecruitmentEndDate && finishedAt === '') {
validationErrors['reserveRecruitmentEndDate'] = false;
} else if (reserveRecruitmentEndDate > finishedAt) {
validationErrors['reserveRecruitmentEndDate'] = true;
}

if (reserveRecruitmentEndDate < reserveRecruitmentStartDate) {
validationErrors['reserveRecruitmentDate'] = true;
}

const hasAnyError = Object.keys(validationErrors).length > 0;

return hasAnyError ? validationErrors : null;
Expand Down