choices to add,clear and delete

develop
tykayn 3 years ago
parent 5083306384
commit b7afca96db
  1. 24
      src/app/config/PollConfig.ts
  2. 129
      src/app/pages/dates/dates.component.html
  3. 7
      src/app/pages/dates/dates.component.scss
  4. 33
      src/app/pages/dates/dates.component.ts
  5. 2
      src/assets/i18n/fr.json
  6. 85
      yarn.lock

@ -5,6 +5,25 @@ export interface DateOption {
literal: string;
}
export const timeOfDay = [{literal: 'matin'},
{literal: 'midi'},
{literal: 'après-midi'},
{literal: 'soirée'}];
export const defaultDates = [
{
literal: `${new Date().getDate()}-${new Date().getMonth()}-${new Date().getFullYear()}`,
timeList: [{literal: 'matin'}, {literal: 'midi'}, {literal: 'soir'}]
},
{
literal: `${new Date().getDate() + 1}-${new Date().getMonth()}-${new Date().getFullYear()}`,
timeList: [{literal: 'matin'}, {literal: 'midi'}, {literal: 'soir'}]
},
{
literal: `${new Date().getDate() + 2}-${new Date().getMonth()}-${new Date().getFullYear()}`,
timeList: [{literal: 'matin'}, {literal: 'midi'}, {literal: 'soir'}]
}
];
/**
* configuration of the poll, add new fields at will
*/
@ -17,8 +36,9 @@ export class PollConfig {
myName = '';
visibility = 'link_only';
// date specific poll
allowSeveralHours = false;
dateList: DateOption[] = [];
allowSeveralHours = 'true';
dateList: DateOption[] = defaultDates; // sets of days as strings
timeList: DateOption[] = timeOfDay; // ranges of time expressed as strings
answers: any = [{
id: 0,
text: 'réponse de démo 1'

@ -1,56 +1,117 @@
<div i18n>
{{"dates.title"|translate}}
{{"dates.title"|translate}}
</div>
<div>
<label for="multi_hours">
<label for="multi_hours">
<span i18n>
Je souhaite mettre des créneaux horaires
</span>
<select
name="multi_hours"
id="multi_hours"
[(ngModel)]="config.allowSeveralHours"
>
<option value="true">{{"dates.multiple.different"|translate}}</option>
<option value="false">{{"dates.multiple.identical"|translate}}</option>
</select>
<span i18n>
<select
name="multi_hours"
id="multi_hours"
[(ngModel)]="config.allowSeveralHours"
>
<option value="true">{{"dates.multiple.different"|translate}}</option>
<option value="false">{{"dates.multiple.identical"|translate}}</option>
</select>
<span i18n>
pour chaque journée
</span>
</label>
</label>
</div>
<button
class="btn btn-primary"
(click)="addDate()"
i18n
class="btn btn-primary"
(click)="addDate()"
id="add_date_button"
>
{{"dates.add"|translate}}
</button>
<button
class="btn btn-primary"
(click)="addtime()"
id="add_time_button"
>
{{"dates.add"|translate}}
{{"dates.addTime"|translate}}
</button>
<button
class="btn btn-warning"
(click)="emptyAll()"
id="empty_button"
>{{"dates.empty"|translate}}
</button>
<div class="dates-list">
{{config.dateList.length}}
<span i18n>
{{config.dateList.length}}
<span>
{{"dates.count_dates"|translate}}
</span>
<div
*ngFor="let choice of config.dateList; index as id"
class="date-choice"
>
<input
type="text"
name="dateChoices[]"
[(ngModel)]="choice.literal"
>
<button (click)="config.dateList.splice(id, 1)">X</button>
</div>
<div
class="identical-dates"
*ngIf="'false'==config.allowSeveralHours"
>
<div
class="time-choice"
*ngFor="let choice of config.timeList; index as id"
>
<input
type="text"
name="timeChoices_{{id}}"
[(ngModel)]="choice.literal"
>
<button (click)="config.timeList.splice(id, 1)">X</button>
</div>
</div>
<hr>
<span>
{{"dates.count_dates"|translate}}
</span>
<div
*ngFor="let choice of config.dateList; index as id"
class="date-choice"
>
<input
type="text"
name="dateChoices_{{id}}"
[(ngModel)]="choice.literal"
>
<button
class="btn btn-warning"
(click)="config.dateList.splice(id, 1)"
>X
</button>
<button
class="btn btn-primary"
(click)="addTimetoDate(choice, id)"
> Ajouter un choix d'heure
</button>
<div
class="several-times"
*ngIf="'true'==config.allowSeveralHours"
>
<div
class="time-choice"
*ngFor="let time of choice.timeList; index as idTime"
>
<input
type="text"
name="dateTime_{{id}}_Choices_{{idTime}}"
[(ngModel)]="time.literal"
>
<button
class="btn btn-warning"
(click)="config.timeList.splice(idTime, 1)"
>X
</button>
</div>
</div>
</div>
</div>
<a
[routerLink]="'/step/end'"
class="btn btn-block"
[routerLink]="'/step/end'"
class="btn btn-block"
>
C'est parfait!
C'est parfait!
</a>

@ -0,0 +1,7 @@
.several-times {
padding-left: 1em;
input {
margin-right: 1em;
}
}

@ -1,4 +1,4 @@
import {Component, OnInit} from '@angular/core';
import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
import {ConfigService} from '../../config.service';
import {BaseComponent} from '../base-page/base.component';
@ -8,7 +8,7 @@ import {BaseComponent} from '../base-page/base.component';
styleUrls: ['./dates.component.scss']
})
export class DatesComponent extends BaseComponent implements OnInit {
constructor(public config: ConfigService) {
constructor(public config: ConfigService, private cd: ChangeDetectorRef) {
super(config);
}
@ -16,6 +16,33 @@ export class DatesComponent extends BaseComponent implements OnInit {
}
addDate() {
this.config.dateList.push({ literal: '' });
this.config.dateList.push({literal: ''});
}
addtime() {
this.config.timeList.push({literal: ''});
}
/**
* add a time period to a specific date choice,
* focus on the new input
* @param config
* @param id
*/
addTimetoDate(config: any, id: number) {
config.timeList.push({literal: ''});
let selector = '[ng-reflect-name="dateTime_' + id + '_Choices_' + (config.timeList.length - 1) + '"]';
console.log('selector', selector);
this.cd.detectChanges();
const elem = document.querySelector(selector);
if (elem && elem.focus) {
elem.focus();
}
}
emptyAll() {
this.config.dateList.forEach(element => {
element.literal = '';
});
}
}

@ -38,6 +38,8 @@
"different": "possiblement différentes"
},
"add": "Ajouter une plage de dates",
"addTime": "Ajouter une plage d'heure",
"empty": "Vider",
"count_dates": "choix de dates"
},
"choices": {

@ -309,6 +309,20 @@
tree-kill "1.2.1"
webpack-sources "1.3.0"
"@ngx-translate/core@^11.0.1":
version "11.0.1"
resolved "https://registry.yarnpkg.com/@ngx-translate/core/-/core-11.0.1.tgz#cecefad41f06368f5859dac48fec8fcc4485615f"
integrity sha512-nBCa1ZD9fAUY/3eskP3Lql2fNg8OMrYIej1/5GRsfcutx9tG/5fZLCv9m6UCw1aS+u4uK/vXjv1ctG/FdMvaWg==
dependencies:
tslib "^1.9.0"
"@ngx-translate/http-loader@^4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/@ngx-translate/http-loader/-/http-loader-4.0.0.tgz#8a555248ad4b7d513460fcec9da25b0447962f1d"
integrity sha512-x8LumqydWD7eX9yQTAVeoCM9gFUIGVTUjZqbxdAUavAA3qVnk9wCQux7iHLPXpydl8vyQmLoPQR+fFU+DUDOMA==
dependencies:
tslib "^1.9.0"
"@schematics/angular@8.2.2":
version "8.2.2"
resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-8.2.2.tgz#ad606789a016e540facd44b81bff9aac874afb25"
@ -362,6 +376,11 @@
dependencies:
"@types/jasmine" "*"
"@types/marked@^0.6.5":
version "0.6.5"
resolved "https://registry.yarnpkg.com/@types/marked/-/marked-0.6.5.tgz#3cf2a56ef615dad24aaf99784ef90a9eba4e29d8"
integrity sha512-6kBKf64aVfx93UJrcyEZ+OBM5nGv4RLsI6sR1Ar34bpgvGVRoyTgpxn4ZmtxOM5aDTAaaznYuYUH8bUX3Nk3YA==
"@types/minimatch@*":
version "3.0.3"
resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
@ -1521,6 +1540,15 @@ cli-width@^2.0.0:
resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.2.0.tgz#ff19ede8a9a5e579324147b0c11f0fbcbabed639"
integrity sha1-/xnt6Kml5XkyQUewwR8PvLq+1jk=
clipboard@^2.0.0:
version "2.0.4"
resolved "https://registry.yarnpkg.com/clipboard/-/clipboard-2.0.4.tgz#836dafd66cf0fea5d71ce5d5b0bf6e958009112d"
integrity sha512-Vw26VSLRpJfBofiVaFb/I8PVfdI1OxKcYShe6fm0sP/DtmiWQNCjhM/okTvdCo0G+lMMm1rMYbk4IK4x1X+kgQ==
dependencies:
good-listener "^1.2.2"
select "^1.1.2"
tiny-emitter "^2.0.0"
cliui@^4.0.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/cliui/-/cliui-4.1.0.tgz#348422dbe82d800b3022eef4f6ac10bf2e4d1b49"
@ -1612,6 +1640,11 @@ commander@^2.11.0, commander@^2.12.1, commander@^2.20.0, commander@~2.20.0:
resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.0.tgz#d58bb2b5c1ee8f87b0d340027e9e94e222c5a422"
integrity sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==
commander@^2.19.0:
version "2.20.3"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
commondir@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
@ -2055,6 +2088,11 @@ delayed-stream@~1.0.0:
resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
integrity sha1-3zrhmayt+31ECqrgsp4icrJOxhk=
delegate@^3.1.2:
version "3.2.0"
resolved "https://registry.yarnpkg.com/delegate/-/delegate-3.2.0.tgz#b66b71c3158522e8ab5744f720d8ca0c2af59166"
integrity sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw==
delegates@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/delegates/-/delegates-1.0.0.tgz#84c6e159b81904fdca59a0ef44cd870d31250f9a"
@ -2911,6 +2949,13 @@ globby@^7.1.1:
pify "^3.0.0"
slash "^1.0.0"
good-listener@^1.2.2:
version "1.2.2"
resolved "https://registry.yarnpkg.com/good-listener/-/good-listener-1.2.2.tgz#d53b30cdf9313dffb7dc9a0d477096aa6d145c50"
integrity sha1-1TswzfkxPf+33JoNR3CWqm0UXFA=
dependencies:
delegate "^3.1.2"
graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6:
version "4.2.2"
resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.2.tgz#6f0952605d0140c1cfdb138ed005775b92d67b02"
@ -3921,6 +3966,13 @@ karma@~4.1.0:
tmp "0.0.33"
useragent "2.3.0"
katex@^0.11.1:
version "0.11.1"
resolved "https://registry.yarnpkg.com/katex/-/katex-0.11.1.tgz#df30ca40c565c9df01a466a00d53e079e84ffaa2"
integrity sha512-5oANDICCTX0NqYIyAiFCCwjQ7ERu3DQG2JFHLbYOf+fXaMoH8eg/zOq5WSYJsKMi/QebW+Eh3gSM+oss1H/bww==
dependencies:
commander "^2.19.0"
killable@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/killable/-/killable-1.0.1.tgz#4c8ce441187a061c7474fb87ca08e2a638194892"
@ -4133,6 +4185,11 @@ map-visit@^1.0.0:
dependencies:
object-visit "^1.0.0"
marked@^0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/marked/-/marked-0.7.0.tgz#b64201f051d271b1edc10a04d1ae9b74bb8e5c0e"
integrity sha512-c+yYdCZJQrsRjTPhUx7VKkApw9bwDkNbHUKo1ovgcfDjb2kc8rLuRbIFyXL5WOEUwzSSKo3IXpph2K6DqB/KZg==
md5.js@^1.3.4:
version "1.3.5"
resolved "https://registry.yarnpkg.com/md5.js/-/md5.js-1.3.5.tgz#b5d07b8e3216e3e27cd728d72f70d1e6a342005f"
@ -4420,6 +4477,17 @@ neo-async@^2.5.0, neo-async@^2.6.0:
resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.1.tgz#ac27ada66167fa8849a6addd837f6b189ad2081c"
integrity sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==
ngx-markdown@^8.2.1:
version "8.2.1"
resolved "https://registry.yarnpkg.com/ngx-markdown/-/ngx-markdown-8.2.1.tgz#53bafde382aa69ae6787abf0d72bf63bc028105a"
integrity sha512-59LG8rEoOwDsZyyJckp+QDnW/c5wMaRpNkb6TWktlBVTfQKyAYHr6BuSskVbZ4y8nsj54UQg0CDFLBOfUiqOwA==
dependencies:
"@types/marked" "^0.6.5"
katex "^0.11.1"
marked "^0.7.0"
prismjs "^1.16.0"
tslib "^1.9.0"
nice-try@^1.0.4:
version "1.0.5"
resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366"
@ -5094,6 +5162,13 @@ prepend-http@^1.0.0:
resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc"
integrity sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw=
prismjs@^1.16.0:
version "1.17.1"
resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.17.1.tgz#e669fcbd4cdd873c35102881c33b14d0d68519be"
integrity sha512-PrEDJAFdUGbOP6xK/UsfkC5ghJsPJviKgnQOoxaDbBjwc8op68Quupwt1DeAFoG8GImPhiKXAvvsH7wDSLsu1Q==
optionalDependencies:
clipboard "^2.0.0"
process-nextick-args@~2.0.0:
version "2.0.1"
resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
@ -5700,6 +5775,11 @@ select-hose@^2.0.0:
resolved "https://registry.yarnpkg.com/select-hose/-/select-hose-2.0.0.tgz#625d8658f865af43ec962bfc376a37359a4994ca"
integrity sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo=
select@^1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/select/-/select-1.1.2.tgz#0e7350acdec80b1108528786ec1d4418d11b396d"
integrity sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0=
selenium-webdriver@3.6.0, selenium-webdriver@^3.0.1:
version "3.6.0"
resolved "https://registry.yarnpkg.com/selenium-webdriver/-/selenium-webdriver-3.6.0.tgz#2ba87a1662c020b8988c981ae62cb2a01298eafc"
@ -6466,6 +6546,11 @@ timers-browserify@^2.0.4:
dependencies:
setimmediate "^1.0.4"
tiny-emitter@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.1.0.tgz#1d1a56edfc51c43e863cbb5382a72330e3555423"
integrity sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==
tmp@0.0.30:
version "0.0.30"
resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.30.tgz#72419d4a8be7d6ce75148fd8b324e593a711c2ed"

Loading…
Cancel
Save