From c67f30918097daa3cf1470263500d7d3c030f118 Mon Sep 17 00:00:00 2001 From: Tykayn Date: Mon, 8 Nov 2021 09:32:50 +0100 Subject: [PATCH] style for calendar in step 3 --- src/app/app.component.ts | 4 +- src/app/core/models/poll.DTO.model.ts | 46 +++++++++++++++++++ src/app/core/services/poll.service.ts | 4 ++ .../step-three/step-three.component.html | 6 +-- src/styles/partials/_forms.scss | 34 ++++++++++++++ src/styles/themes/_base.scss | 1 - 6 files changed, 88 insertions(+), 7 deletions(-) create mode 100644 src/app/core/models/poll.DTO.model.ts diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 7ad5fadf..d9eb0ee9 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -12,6 +12,7 @@ import { FramaKeyboardShortcuts } from './shared/shortcuts/main'; import { ShortcutEventOutput, ShortcutInput } from 'ng-keyboard-shortcuts'; import { PollService } from './core/services/poll.service'; import { Poll } from './core/models/poll.model'; +import { PollDTO } from './core/models/poll.DTO.model'; @Component({ selector: 'app-root', @@ -42,7 +43,6 @@ export class AppComponent implements OnInit, OnDestroy, AfterViewInit { printpath(parent: string, config: Route[]) { for (let i = 0; i < config.length; i++) { const route = config[i]; - console.info(parent + '/' + route.path); if (route.children) { const currentPath = route.path ? parent + '/' + route.path : parent; this.printpath(currentPath, route.children); @@ -53,8 +53,6 @@ export class AppComponent implements OnInit, OnDestroy, AfterViewInit { ngOnInit(): void { this.printpath('', this.router.config); this.router.events.subscribe((evt) => { - console.log('route changed', evt); - if (!(evt instanceof NavigationEnd)) { return; } diff --git a/src/app/core/models/poll.DTO.model.ts b/src/app/core/models/poll.DTO.model.ts new file mode 100644 index 00000000..a2cffb5e --- /dev/null +++ b/src/app/core/models/poll.DTO.model.ts @@ -0,0 +1,46 @@ +import { Choice, ChoiceGroup } from './choice.model'; +import { DateChoice, TimeSlices } from './dateChoice.model'; + +export class PollDTO { + menuVisible = true; + expiracyDateDefaultInDays; + deletionDateAfterLastModification; + pollType: string = 'date'; // classic or dates + title; + description; + myName; + myComment = ''; + isAdmin; // when we create a poll; we are admin on it + myVoteStack; + myTempVoteStack; + myEmail; + myPolls; // list of retrieved polls from the backend api + allowSeveralHours; + visibility; // visible to one with the link: + voteChoices = 'yes; maybe; no'; // possible answers to a vote choice: only "yes"; "yes; maybe; no" + created_at; + expirationDate; // expiracy date + voteStackId; // id of the vote stack to update + pollId; // id of the current poll when created. data given by the backend api + pollSlug; // id of the current poll when created. data given by the backend api + currentPoll; // current poll selected with createPoll or getPoll of ConfigService + passwordAccess; + password; + customUrl; // custom slug in the url; must be unique + customUrlIsUnique; // given by the backend + urlSlugPublic; + urlPublic; + urlAdmin; + adminKey; // key to change config of the poll + owner_modifier_token; // key to change a vote stack + canModifyAnswers; // bool for the frontend selector + whoModifiesAnswers; // everybody; self; nobody (: just admin) + whoCanChangeAnswers; // everybody; self; nobody (: just admin) + dateList; // sets of days as strings; config to set identical time for days in a special days poll + timeList; // ranges of time expressed as strings + + answers; + displayConfirmVoteModalAdmin; + + constructor() {} +} diff --git a/src/app/core/services/poll.service.ts b/src/app/core/services/poll.service.ts index 19acaf5f..faa691e0 100644 --- a/src/app/core/services/poll.service.ts +++ b/src/app/core/services/poll.service.ts @@ -491,6 +491,10 @@ export class PollService implements Resolve { return list; } + convertCalendarDatesToChoices(array_dates) { + return array_dates; + } + newPollFromForm(form: any): any { const newpoll = new Poll( this.userService.getCurrentUser(), diff --git a/src/app/features/administration/form/steps/step-three/step-three.component.html b/src/app/features/administration/form/steps/step-three/step-three.component.html index 2dfaa6c4..96e390f5 100644 --- a/src/app/features/administration/form/steps/step-three/step-three.component.html +++ b/src/app/features/administration/form/steps/step-three/step-three.component.html @@ -78,9 +78,9 @@ [showWeek]="true" > - - - +
+ 
{{ pollService.calendar | json }}
+
diff --git a/src/styles/partials/_forms.scss b/src/styles/partials/_forms.scss index 977bd1b5..48f18b5e 100644 --- a/src/styles/partials/_forms.scss +++ b/src/styles/partials/_forms.scss @@ -235,3 +235,37 @@ mat-checkbox { width: 100%; padding: 1em; } + +// calendar primeng +.p-datepicker { + border: solix 1px $logo_color; + margin: 1em auto; + + .p-datepicker-month { + margin-right: 1em; + } + .p-datepicker-weeknumber span { + border-right: 1px solid $legend_color; + } + .p-datepicker-today span { + font-weight: bold; + border: solid 1px $legend_color; + } + + .p-datepicker-calendar td span { + padding: 1em; + width: 3.5em; + transition: all ease 0.5s; + &:hover { + background: mix($white, $legend_color); + color: $white; + transition: all ease 0.2s; + } + } + + .p-highlight { + background: $legend_color; + color: $white; + border-radius: 100%; + } +} diff --git a/src/styles/themes/_base.scss b/src/styles/themes/_base.scss index 5e2a778e..4d7250bc 100644 --- a/src/styles/themes/_base.scss +++ b/src/styles/themes/_base.scss @@ -2,7 +2,6 @@ background: $primary; main { - padding: 0; margin-bottom: 2em; padding-bottom: 5em; padding-top: 1em;