cancel dialog on creation

This commit is contained in:
Tykayn 2021-11-17 15:06:36 +01:00 committed by tykayn
parent 5b5d17a880
commit 2c10dfb6d6
14 changed files with 129 additions and 18 deletions

View File

@ -22,10 +22,16 @@
"main": "src/main.ts", "main": "src/main.ts",
"polyfills": "src/polyfills.ts", "polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json", "tsConfig": "tsconfig.app.json",
"assets": ["src/favicon.ico", "src/assets"], "assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [ "styles": [
"node_modules/fork-awesome/css/fork-awesome.min.css", "node_modules/fork-awesome/css/fork-awesome.min.css",
"node_modules/bulma-switch/dist/css/bulma-switch.min.css", "node_modules/bulma-switch/dist/css/bulma-switch.min.css",
"node_modules/primeicons/primeicons.css",
"node_modules/primeng/resources/themes/saga-blue/theme.css",
"node_modules/primeng/resources/primeng.min.css",
"src/styles.scss" "src/styles.scss"
], ],
"scripts": [ "scripts": [
@ -93,8 +99,14 @@
"lint": { "lint": {
"builder": "@angular-devkit/build-angular:tslint", "builder": "@angular-devkit/build-angular:tslint",
"options": { "options": {
"tsConfig": ["tsconfig.app.json", "tsconfig.spec.json", "e2e/tsconfig.json"], "tsConfig": [
"exclude": ["**/node_modules/**"] "tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
} }
}, },
"e2e": { "e2e": {

View File

@ -59,6 +59,7 @@
"ngx-markdown": "^9.0.0", "ngx-markdown": "^9.0.0",
"ngx-webstorage": "^5.0.0", "ngx-webstorage": "^5.0.0",
"node-forge": "^0.10.0", "node-forge": "^0.10.0",
"primeicons": "^5.0.0",
"primeng": "^11.0.0", "primeng": "^11.0.0",
"quill": "^1.3.7", "quill": "^1.3.7",
"rxjs": "^6.5.5", "rxjs": "^6.5.5",

View File

@ -101,7 +101,7 @@ export class AppComponent implements OnInit, OnDestroy, AfterViewInit {
}); });
// debug cors // debug cors
this.apiService.getAllAvailablePolls(); // this.apiService.getAllAvailablePolls();
} }
ngAfterViewInit(): void { ngAfterViewInit(): void {

View File

@ -28,6 +28,7 @@ import { DayListComponent } from './form/date/list/day/day-list.component';
import { PickerComponent } from './form/date/picker/picker.component'; import { PickerComponent } from './form/date/picker/picker.component';
import { TimeListComponent } from './form/date/list/time/time-list.component'; import { TimeListComponent } from './form/date/list/time/time-list.component';
import { AdminConsultationComponent } from './consultation/consultation.component'; import { AdminConsultationComponent } from './consultation/consultation.component';
import { ConfirmDialogModule } from 'primeng/confirmdialog';
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -62,6 +63,7 @@ import { AdminConsultationComponent } from './consultation/consultation.componen
FormsModule, FormsModule,
TranslateModule.forChild({ extend: true }), TranslateModule.forChild({ extend: true }),
DragDropModule, DragDropModule,
ConfirmDialogModule,
], ],
}) })
export class AdministrationModule {} export class AdministrationModule {}

View File

@ -58,10 +58,31 @@
</div> </div>
</div> </div>
</form> </form>
<p-confirmDialog #cd [style]="{ width: '50vw' }">
<ng-template pTemplate="header">
<h3>{{ 'creation.dialog' | translate }}</h3>
</ng-template>
<ng-template pTemplate="footer">
<button
type="button"
pButton
icon="pi pi-times"
[label]="'dialogs.no' | translate"
(click)="cd.reject()"
></button>
<button
type="button"
pButton
icon="pi pi-check"
[label]="'dialogs.yes' | translate"
(click)="cd.accept()"
></button>
</ng-template>
</p-confirmDialog>
<div class="columns"> <div class="columns">
<div class="column"> <div class="column">
<button class="button is-warning is-fullwidth" [routerLink]="['/']"> <button pButton class="button is-warning is-fullwidth" (click)="cancelCreationDialog()">
Annuler {{ 'SENTENCES.Cancel' | translate }}
</button> </button>
</div> </div>
<div class="column"> <div class="column">

View File

@ -2,6 +2,8 @@ import { Component, Inject, Input, OnInit } from '@angular/core';
import { FormGroup } from '@angular/forms'; import { FormGroup } from '@angular/forms';
import { PollService } from '../../../../../core/services/poll.service'; import { PollService } from '../../../../../core/services/poll.service';
import { DOCUMENT } from '@angular/common'; import { DOCUMENT } from '@angular/common';
import { ConfirmationService } from 'primeng/api';
import { Router } from '@angular/router';
@Component({ @Component({
selector: 'app-step-one', selector: 'app-step-one',
@ -9,13 +11,18 @@ import { DOCUMENT } from '@angular/common';
styleUrls: ['./step-one.component.scss'], styleUrls: ['./step-one.component.scss'],
}) })
export class StepOneComponent implements OnInit { export class StepOneComponent implements OnInit {
constructor(public pollService: PollService, @Inject(DOCUMENT) private document: any) {}
@Input() @Input()
step_max: any; step_max: any;
@Input() @Input()
form: FormGroup; form: FormGroup;
constructor(
public pollService: PollService,
@Inject(DOCUMENT) private document: any,
private router: Router,
private confirmationService: ConfirmationService
) {}
ngOnInit(): void { ngOnInit(): void {
this.pollService.step_current = 1; this.pollService.step_current = 1;
const selector = '#title'; const selector = '#title';
@ -24,4 +31,13 @@ export class StepOneComponent implements OnInit {
firstField.focus(); firstField.focus();
} }
} }
cancelCreationDialog() {
this.confirmationService.confirm({
message: 'Quitter la création de sondage?',
accept: () => {
this.router.navigate(['/']);
},
});
}
} }

View File

@ -20,6 +20,7 @@
<div class="column"> <div class="column">
<button <button
class="button is-fullwidth" class="button is-fullwidth"
[disabled]="true"
[ngClass]="{ 'is-selected is-primary': !pollService.form.controls.isAboutDate.value }" [ngClass]="{ 'is-selected is-primary': !pollService.form.controls.isAboutDate.value }"
(click)="pollService.form.controls.isAboutDate.setValue(false)" (click)="pollService.form.controls.isAboutDate.setValue(false)"
> >

View File

@ -1,4 +1,4 @@
<section class="creation-stepper"> <section class="creation-stepper" id="creation_stepper">
<div class="shortcuts"> <div class="shortcuts">
<a <a
class="shortcut" class="shortcut"
@ -35,8 +35,20 @@
[ngClass]="{ 'is-active': pollService.step_current == 5 }" [ngClass]="{ 'is-active': pollService.step_current == 5 }"
>5</a >5</a
> >
<!-- <a class="shortcut" href="#" [routerLink]="['/administration/step/6']" [ngClass]="{'is-active':pollService.step_current == 6}">6</a>--> <a
<!-- <a class="shortcut" href="#" [routerLink]="['/administration/step/7']" [ngClass]="{'is-active':pollService.step_current == 7}">7</a>--> class="shortcut"
href="#"
[routerLink]="['/administration/step/6']"
[ngClass]="{ 'is-active': pollService.step_current == 6 }"
>6</a
>
<a
class="shortcut"
href="#"
[routerLink]="['/administration/step/7']"
[ngClass]="{ 'is-active': pollService.step_current == 7 }"
>7</a
>
</div> </div>
<div class="step-info"> <div class="step-info">
<h2 classs="title is-2" *ngIf="pollService.step_current == 1"> <h2 classs="title is-2" *ngIf="pollService.step_current == 1">
@ -52,4 +64,28 @@
<div class="step-bar-container" style="width: 100%;"> <div class="step-bar-container" style="width: 100%;">
<div class="step-bar-progress" [ngStyle]="{ width: (step_current / step_max) * 100 + '%' }"></div> <div class="step-bar-progress" [ngStyle]="{ width: (step_current / step_max) * 100 + '%' }"></div>
</div> </div>
<!-- modale de confirmation pour quitter-->
<p-confirmDialog #cd [style]="{ width: '50vw' }">
<ng-template pTemplate="header">
<h3>{{ 'creation.dialog' | translate }}</h3>
</ng-template>
<ng-template pTemplate="footer">
<button
type="button"
pButton
icon="pi pi-times"
[label]="'dialogs.no' | translate"
(click)="cd.reject()"
></button>
<button
type="button"
pButton
icon="pi pi-check"
[label]="'dialogs.yes' | translate"
(click)="cd.accept()"
></button>
</ng-template>
</p-confirmDialog>
<a href="#creation_stepper" (click)="cancelDialog()"></a>
</section> </section>

View File

@ -1,6 +1,7 @@
import { Component, Input, OnInit } from '@angular/core'; import { Component, Input, OnInit } from '@angular/core';
import { PollService } from '../../../core/services/poll.service'; import { PollService } from '../../../core/services/poll.service';
import { environment } from '../../../../environments/environment'; import { environment } from '../../../../environments/environment';
import { ConfirmationService } from 'primeng/api';
@Component({ @Component({
selector: 'app-stepper', selector: 'app-stepper',
@ -13,5 +14,14 @@ export class StepperComponent {
@Input() @Input()
public step_max: number = 5; public step_max: number = 5;
public show_shortcuts = environment.showStepperShortcuts; public show_shortcuts = environment.showStepperShortcuts;
constructor(public pollService: PollService) {} constructor(public pollService: PollService, private confirmationService: ConfirmationService) {}
cancelDialog() {
this.confirmationService.confirm({
message: 'Quitter la création de sondage?',
accept: () => {
this.router.navigate(['/']);
},
});
}
} }

View File

@ -11,6 +11,7 @@ a {
max-width: 20em; max-width: 20em;
@extend .truncate; @extend .truncate;
} }
.admin-ok pre,
.truncate { .truncate {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;

View File

@ -28,6 +28,8 @@ import { ErasableInputComponent } from './components/ui/erasable-input/erasable-
import { WipTodoComponent } from './components/ui/wip-todo/wip-todo.component'; import { WipTodoComponent } from './components/ui/wip-todo/wip-todo.component';
import { ErrorsListComponent } from '../features/shared/components/ui/form/errors-list/errors-list.component'; import { ErrorsListComponent } from '../features/shared/components/ui/form/errors-list/errors-list.component';
import { ShortcutsHelpComponent } from '../features/shared/components/ui/shortcuts-help/shortcuts-help.component'; import { ShortcutsHelpComponent } from '../features/shared/components/ui/shortcuts-help/shortcuts-help.component';
import { ConfirmDialogModule } from 'primeng/confirmdialog';
import { ConfirmationService } from 'primeng/api';
const COMPONENTS = [ const COMPONENTS = [
ChoiceDetailsComponent, ChoiceDetailsComponent,
@ -63,7 +65,8 @@ const MATERIAL_MODULES = [
@NgModule({ @NgModule({
declarations: COMPONENTS, declarations: COMPONENTS,
imports: [...ANGULAR_MODULES, ...MATERIAL_MODULES], imports: [...ANGULAR_MODULES, ...MATERIAL_MODULES, ConfirmDialogModule],
exports: [...ANGULAR_MODULES, ...MATERIAL_MODULES, ...COMPONENTS], exports: [...ANGULAR_MODULES, ...MATERIAL_MODULES, ...COMPONENTS],
providers: [ConfirmationService],
}) })
export class SharedModule {} export class SharedModule {}

View File

@ -29,6 +29,7 @@
"creation": { "creation": {
"title": "Créer un sondage", "title": "Créer un sondage",
"want": "Choisissez le type de sondage", "want": "Choisissez le type de sondage",
"dialog": "Quitter la création de sondage?",
"advanced": "Options avancées", "advanced": "Options avancées",
"kind": { "kind": {
"classic": "Propositions", "classic": "Propositions",
@ -143,6 +144,10 @@
"choiceNotColorblind": "Je ne suis pas", "choiceNotColorblind": "Je ne suis pas",
"colorblindText": "daltonien." "colorblindText": "daltonien."
}, },
"dialogs" : {
"no": "non",
"yes": "oui"
},
"selectors": { "selectors": {
"lang": "Sélectionner la langue" "lang": "Sélectionner la langue"
}, },

View File

@ -12,16 +12,14 @@ export const environment = {
production: false, production: false,
display_routes: true, // demo paths to test polls display_routes: true, // demo paths to test polls
autofill_creation: true, autofill_creation: true,
advanced_options_display: true, advanced_options_display: false,
autofill_participation: true, autofill_participation: false,
// autofill: false,
showDemoWarning: false, showDemoWarning: false,
// autoSendNewPoll: true,
autoSendNewPoll: false, autoSendNewPoll: false,
showStepperShortcuts: true, showStepperShortcuts: true,
interval_days_default: 7, interval_days_default: 7,
expiresDaysDelay: 60, expiresDaysDelay: 60,
maxCountOfAnswers: 150, maxCountOfAnswers: 300,
appTitle: 'Framadate', appTitle: 'Framadate',
appVersion: '0.6.0', appVersion: '0.6.0',
appLogo: 'assets/img/logo.png', appLogo: 'assets/img/logo.png',

View File

@ -9463,6 +9463,11 @@ pretty-format@^26.0.0, pretty-format@^26.1.0:
ansi-styles "^4.0.0" ansi-styles "^4.0.0"
react-is "^16.12.0" react-is "^16.12.0"
primeicons@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/primeicons/-/primeicons-5.0.0.tgz#73a0b6028a77c58a9eeb331ad13aaf085e8451ee"
integrity sha512-heygWF0X5HFI1otlZE62pp6ye7sZ8om78J9au2BRkg8O7Y8AHTZ9qKMRzchZUHLe8zUAvdi6hZzzm9XxgwIExw==
primeng@^11.0.0: primeng@^11.0.0:
version "11.4.5" version "11.4.5"
resolved "https://registry.yarnpkg.com/primeng/-/primeng-11.4.5.tgz#128137d727d555f68c212a1dcb1f2af3b0f4afd4" resolved "https://registry.yarnpkg.com/primeng/-/primeng-11.4.5.tgz#128137d727d555f68c212a1dcb1f2af3b0f4afd4"