diff --git a/package.json b/package.json index f521ff51..59523ba2 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "start": "ng serve --proxyConfig proxy.conf.json", "start-qa": "ng serve --configuration=qa", "start-prod": "ng serve --configuration=prod", + "start-local": "ng serve --configuration=local", "build": "ng build --prod", "build-token": "npm run build -- --configuration=token", "lint": "tslint \"src/**/*.ts\"" diff --git a/src/app/components/components.module.ts b/src/app/components/components.module.ts index f0c19ea1..6c00e0d2 100644 --- a/src/app/components/components.module.ts +++ b/src/app/components/components.module.ts @@ -1,72 +1,74 @@ -import { SharedModule } from '../shared/shared.module'; -import { NgModule } from '@angular/core'; -import { AnswerExtraQuestionsComponent } from './answer/answer-extra-questions/answer-extra-questions.component'; -import { LoginComponent } from './login/login.component'; -import { StatisticsValueComponent } from './statistics/statistics-value/statistics-value.component'; -import { AnswerNoteComponent } from './answer/answer-note/answer-note.component'; -import { StatisticsDetailsComponent } from './statistics/statistics-details/statistics-details.component'; -import { CategoricalQuestionComponent } from './answer/categorical-question/categorical-question.component'; -import { StatisticsCardComponent } from './statistics/statistics-card/statistics-card.component'; -import { StatisticsComponent } from './statistics/statistics.component'; -import { AnswerFormListComponent } from './answer/answer-form-list/answer-form-list.component'; -import { AnswerDetailsComponent } from './answer/answer-details/answer-details.component'; -import { AnswerComponent } from './answer/answer.component'; -import { ObserversComponent } from './observers/observers.component'; -import { AnswerListComponent } from './answer/answers-list/answer-list.component'; -import { HeaderComponent } from './header/header.component'; -import { ObserverCardComponent } from './observers/observer-card/observer-card.component'; -import { OberverRowComponent } from './observers/oberver-row/oberver-row.component'; -import { ObserverProfileComponent } from './observers/observer-profile/observer-profile.component'; -import { NotificationsComponent } from './notifications/notifications.component'; -import { NgMultiSelectDropDownModule } from 'ng-multiselect-dropdown'; +import {SharedModule} from '../shared/shared.module'; +import {NgModule} from '@angular/core'; +import {AnswerExtraQuestionsComponent} from './answer/answer-extra-questions/answer-extra-questions.component'; +import {LoginComponent} from './login/login.component'; +import {StatisticsValueComponent} from './statistics/statistics-value/statistics-value.component'; +import {AnswerNoteComponent} from './answer/answer-note/answer-note.component'; +import {StatisticsDetailsComponent} from './statistics/statistics-details/statistics-details.component'; +import {CategoricalQuestionComponent} from './answer/categorical-question/categorical-question.component'; +import {StatisticsCardComponent} from './statistics/statistics-card/statistics-card.component'; +import {StatisticsComponent} from './statistics/statistics.component'; +import {AnswerFormListComponent} from './answer/answer-form-list/answer-form-list.component'; +import {AnswerDetailsComponent} from './answer/answer-details/answer-details.component'; +import {AnswerComponent} from './answer/answer.component'; +import {ObserversComponent} from './observers/observers.component'; +import {AnswerListComponent} from './answer/answers-list/answer-list.component'; +import {HeaderComponent} from './header/header.component'; +import {ObserverCardComponent} from './observers/observer-card/observer-card.component'; +import {OberverRowComponent} from './observers/oberver-row/oberver-row.component'; +import {ObserverProfileComponent} from './observers/observer-profile/observer-profile.component'; +import {NotificationsComponent} from './notifications/notifications.component'; +import {NgMultiSelectDropDownModule} from 'ng-multiselect-dropdown'; import {FormCreateComponent} from './forms/form-create/form-create.component'; import {SectionComponent} from './forms/section/section.component'; import {QuestionComponent} from './forms/question/question.component'; +import {PredefinedOptionsModalComponent} from './forms/predefined-options-modal/predefined-options-modal.component'; import {OptionComponent} from './forms/option/option.component'; import {FormsComponent} from './forms/forms.component'; import {DragDropModule} from '@angular/cdk/drag-drop'; -import { TableModule } from '../table/table.module' -import { ObserverImportComponent } from './observers/observer-import/observer-import.component'; +import {TableModule} from '../table/table.module' +import {ObserverImportComponent} from './observers/observer-import/observer-import.component'; export let components = [ - AnswerComponent, - AnswerListComponent, - AnswerDetailsComponent, - AnswerFormListComponent, - AnswerNoteComponent, - CategoricalQuestionComponent, - AnswerExtraQuestionsComponent, - ObserversComponent, - ObserverCardComponent, - OberverRowComponent, - ObserverProfileComponent, - FormsComponent, - FormCreateComponent, - SectionComponent, - QuestionComponent, - OptionComponent, - HeaderComponent, - StatisticsComponent, - StatisticsCardComponent, - StatisticsDetailsComponent, - StatisticsValueComponent, - NotificationsComponent, - LoginComponent, - ObserverImportComponent, + AnswerComponent, + AnswerListComponent, + AnswerDetailsComponent, + AnswerFormListComponent, + AnswerNoteComponent, + CategoricalQuestionComponent, + AnswerExtraQuestionsComponent, + ObserversComponent, + ObserverCardComponent, + OberverRowComponent, + ObserverProfileComponent, + FormsComponent, + FormCreateComponent, + SectionComponent, + QuestionComponent, + PredefinedOptionsModalComponent, + OptionComponent, + HeaderComponent, + StatisticsComponent, + StatisticsCardComponent, + StatisticsDetailsComponent, + StatisticsValueComponent, + NotificationsComponent, + LoginComponent, + ObserverImportComponent, ]; @NgModule({ - declarations: components, - exports: components, - imports: [ - SharedModule, - NgMultiSelectDropDownModule.forRoot(), - DragDropModule, - TableModule, - ] + declarations: components, + exports: components, + imports: [ + SharedModule, + NgMultiSelectDropDownModule.forRoot(), + DragDropModule, + TableModule, + ] }) -export class ComponentsModule { +export class ComponentsModule { } diff --git a/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.html b/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.html new file mode 100644 index 00000000..bd565f1f --- /dev/null +++ b/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.html @@ -0,0 +1,17 @@ +
+
{{'PREDEFINED_OPTIONS_MODAL.TITLE' | translate}}
+
+
+

{{'PREDEFINED_OPTIONS_MODAL.NOTE' | translate}}

+
+ {{ category.label | translate }} +
+ {{ option.label | translate }} +
+
+
+
+ + +
diff --git a/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.scss b/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.scss new file mode 100644 index 00000000..f0351327 --- /dev/null +++ b/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.scss @@ -0,0 +1,4 @@ +.node-children { + margin: 1.5px 1.5px 1.5px 15px; + padding-left: 10px; +} diff --git a/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.ts b/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.ts new file mode 100644 index 00000000..79b6bf5b --- /dev/null +++ b/src/app/components/forms/predefined-options-modal/predefined-options-modal.component.ts @@ -0,0 +1,66 @@ +import {Component, OnInit} from '@angular/core'; +import {NgbActiveModal} from '@ng-bootstrap/ng-bootstrap'; +import predefinedOptions from '../../../../assets/configs/predefined-options.json'; + +interface Category { + label: string; + options: Option[]; +} + +interface Option { + label: string; + check?: boolean; +} + +@Component({ + selector: 'app-predefined-options-modal', + templateUrl: './predefined-options-modal.component.html', + styleUrls: ['./predefined-options-modal.component.scss'] +}) +export class PredefinedOptionsModalComponent implements OnInit { + data: Category[]; + private readonly checkboxPersistentData: any; + + constructor(public modal: NgbActiveModal) { + if (!localStorage.getItem('selectedPredefinedOptions')) { + localStorage.setItem('selectedPredefinedOptions', '{}'); + } + try { + this.checkboxPersistentData = JSON.parse(localStorage.getItem('selectedPredefinedOptions')); + } catch { + localStorage.setItem('selectedPredefinedOptions', '{}'); + this.checkboxPersistentData = {}; + } + + this.data = predefinedOptions; + + this.data.forEach(category => { + category.options.forEach(option => { + if (option.label in this.checkboxPersistentData) + this.check(option, this.checkboxPersistentData[option.label] === 'true') + }) + }) + } + + check(option: Option, value: boolean) { + option.check = value; + this.checkboxPersistentData[option.label] = value ? 'true' : 'false'; + localStorage.setItem('selectedPredefinedOptions', JSON.stringify(this.checkboxPersistentData)); + } + + getChecked() { + const result = [] + this.data.forEach(category => { + category.options.forEach(option => { + if (option.check) + result.push(option.label) + }) + }) + return result; + } + + ngOnInit() { + } +} + + diff --git a/src/app/components/forms/question/question.component.html b/src/app/components/forms/question/question.component.html index 8f0a0001..f7d0d853 100644 --- a/src/app/components/forms/question/question.component.html +++ b/src/app/components/forms/question/question.component.html @@ -36,8 +36,9 @@ - -
+ {{'OPTION_ADD' | translate}}
- +
+
+ {{'OPTION_ADD' | translate}}
+
+ {{'PREDEFINED_OPTIONS_MODAL.ADD' | translate}}
+
diff --git a/src/app/components/forms/question/question.component.ts b/src/app/components/forms/question/question.component.ts index 7c415d29..8a9a80a4 100644 --- a/src/app/components/forms/question/question.component.ts +++ b/src/app/components/forms/question/question.component.ts @@ -7,6 +7,8 @@ import {initOptionFormGroup} from '../form-groups-builder'; import {moveItemInFormArray} from '../../utils'; import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; import { ConfirmationModalComponent } from 'src/app/shared/confirmation-modal/confirmation-modal.component'; +import {PredefinedOptionsModalComponent} from '../predefined-options-modal/predefined-options-modal.component'; +import {TranslateService} from '@ngx-translate/core'; @Component({ selector: 'app-question', @@ -22,7 +24,7 @@ export class QuestionComponent implements OnInit { questionTypes: QuestionType[]; - constructor(private formBuilder: FormBuilder, private _modalService: NgbModal) {} + constructor(private formBuilder: FormBuilder, private _modalService: NgbModal, private translate: TranslateService) {} ngOnInit() { @@ -41,6 +43,25 @@ export class QuestionComponent implements OnInit { this.optionsArray.push(initOptionFormGroup(this.formBuilder)); } + addOptionWithText(givenText: string) { + const formGroup = initOptionFormGroup(this.formBuilder); + formGroup.patchValue({text: givenText}); + this.optionsArray.push(formGroup); + } + + choosePredefinedOption() { + const modalRef = this._modalService.open(PredefinedOptionsModalComponent); + modalRef.result.then(resultList => { + resultList.forEach(selectedOption => { + const translatedSelectedOption = this.translate.instant(selectedOption); + if (!this.optionFormGroupsArray.some(item => item.get('text').value === translatedSelectedOption)) + this.addOptionWithText(translatedSelectedOption); + }) + }) + .catch(() => { + }); + } + toggleOptions() { this.hideOptions = !this.hideOptions; } diff --git a/src/assets/configs/predefined-options.json b/src/assets/configs/predefined-options.json new file mode 100644 index 00000000..18cd1c72 --- /dev/null +++ b/src/assets/configs/predefined-options.json @@ -0,0 +1,36 @@ +[ + { + "label": "PREDEFINED_OPTIONS.CONFIRMATION.LABEL", + "options": [ + { + "label": "PREDEFINED_OPTIONS.CONFIRMATION.YES" + }, + { + "label": "PREDEFINED_OPTIONS.CONFIRMATION.NO" + }, + { + "label": "PREDEFINED_OPTIONS.CONFIRMATION.DONT_KNOW" + } + ] + }, + { + "label": "PREDEFINED_OPTIONS.RATING.LABEL", + "options": [ + { + "label": "PREDEFINED_OPTIONS.RATING.1" + }, + { + "label": "PREDEFINED_OPTIONS.RATING.2" + }, + { + "label": "PREDEFINED_OPTIONS.RATING.3" + }, + { + "label": "PREDEFINED_OPTIONS.RATING.4" + }, + { + "label": "PREDEFINED_OPTIONS.RATING.5" + } + ] + } +] diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json index 60cc3688..9d91588c 100644 --- a/src/assets/i18n/en.json +++ b/src/assets/i18n/en.json @@ -45,6 +45,29 @@ "OPTION_ADD": "Add option", + "PREDEFINED_OPTIONS": { + "CONFIRMATION": { + "LABEL": "Confirmations", + "YES": "Yes", + "NO": "No", + "DONT_KNOW": "Don't know" + }, + "RATING": { + "LABEL": "Ratings", + "1": "1 - Very Bad", + "2": "2 - Bad", + "3": "3 - Mediocre", + "4": "4 - Good", + "5": "5 - Very Good" + } + }, + + "PREDEFINED_OPTIONS_MODAL": { + "ADD": "Choose predefined options", + "TITLE": "Choose from predefined options", + "NOTE": "Note: Your selection will be remembered" + }, + "NOTHING_SELECTED": "Nothing selected.", "SHOW": "Show", "HIDE": "Hide", @@ -113,6 +136,7 @@ "LAST_LOGIN": "Last login", "//": "COMMON_STUFF", + "ADD": "Add", "EDIT": "Edit", "DELETE": "Delete", "SEND_NOTIF": "Send Notification", diff --git a/src/assets/i18n/ro.json b/src/assets/i18n/ro.json index a7af5833..d86184ca 100644 --- a/src/assets/i18n/ro.json +++ b/src/assets/i18n/ro.json @@ -45,6 +45,30 @@ "OPTION_ADD": "Adaugă o opţiune", + "PREDEFINED_OPTIONS": { + "CONFIRMATION": { + "LABEL": "Confirmari", + "YES": "Da", + "NO": "Nu", + "DONT_KNOW": "Nu stiu" + }, + "RATING": { + "LABEL": "Calificative", + "1": "1 - Foarte slab", + "2": "2 - Slab", + "3": "3 - Mediu", + "4": "4 - Bine", + "5": "5 - Foarte bine" + } + }, + + "PREDEFINED_OPTIONS_MODAL": { + "ADD": "Alege optiuni prestabilite", + "TITLE": "Alege din optiunile prestabilite", + "NOTE": "Observatie: Optiunile selectate vor fi salvate" + }, + + "NOTHING_SELECTED": "Nu ati selectat nimic", "SHOW": "Vezi", "HIDE": "Ascunde", @@ -97,6 +121,7 @@ "//": "COMMON_STUFF", + "ADD": "Adaugă", "EDIT": "Editaţi", "DELETE": "Ștergeţi", "SEND_NOTIF": "Trimiteţi Notificare", diff --git a/tsconfig.json b/tsconfig.json index 0d94e304..8ec3c1a7 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -13,7 +13,9 @@ "outDir": "../dist/out-tsc", "sourceMap": true, "importHelpers": true, - "typeRoots": ["../node_modules/@types"] + "typeRoots": ["../node_modules/@types"], + "resolveJsonModule": true, + "esModuleInterop": true }, "files": ["src/main.ts", "src/polyfills.ts"], "include": ["src/**/*.d.ts"]