survery-lib 2.1.3 → 2.1.4

package/fesm2022/survery-lib.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { Injectable, Directive, HostListener, Pipe, Component, Input, EventEmitter, Output, InjectionToken, Inject, NgModule } from '@angular/core';
 import { v4 } from 'uuid';
-import { Subject, of, debounceTime, distinctUntilChanged, map, filter, pairwise, take } from 'rxjs';
+import { Subject, of, debounceTime, distinctUntilChanged, map, filter, pairwise, take, withLatestFrom, switchMap } from 'rxjs';
 import * as i1 from '@angular/forms';
 import { Validators, FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import * as i3 from '@ngrx/store';
@@ -9,6 +9,7 @@ import { createFeatureSelector, createSelector, createAction, props, createReduc
 import { createEntityAdapter } from '@ngrx/entity';
 import * as i4 from '@angular/common';
 import { CommonModule } from '@angular/common';
+import { SubSink } from 'subsink';
 import * as i5 from '@ng-select/ng-select';
 import { NgSelectModule } from '@ng-select/ng-select';
 import * as i1$1 from '@angular/common/http';
@@ -17,8 +18,8 @@ import * as i5$1 from 'ngx-bootstrap/rating';
 import { RatingModule } from 'ngx-bootstrap/rating';
 import * as i6 from 'ngx-bootstrap/pagination';
 import { PaginationModule } from 'ngx-bootstrap/pagination';
-import * as i2 from '@ngrx/effects';
-import { EffectsModule } from '@ngrx/effects';
+import * as i1$2 from '@ngrx/effects';
+import { createEffect, ofType, EffectsModule } from '@ngrx/effects';
 
 var QuestionTypeEnum;
 (function (QuestionTypeEnum) {
@@ -658,6 +659,10 @@ class QuestionTextTemplateComponent {
                 }
                 this.fCtrls.answer.updateValueAndValidity();
             }
+            var question = this.questionArr().find(x => x.questionId == value.questionId);
+            if (question?.answerText) {
+                this.rForm.controls.answer.setValue(question.answerText, { emitEvent: false });
+            }
             this.toggleEnableAnswer(value.questionAllInfo.isReadOnly);
         }
     }
@@ -668,6 +673,7 @@ class QuestionTextTemplateComponent {
         this._formBuilder = _formBuilder;
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.isArabicLang = false;
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
@@ -785,6 +791,11 @@ class QuestionRadioButtonTemplateComponent {
                 this.fCtrls.answer.addValidators([Validators.required]);
                 this.fCtrls.answer.updateValueAndValidity();
             }
+            var question = this.questionArr().find(x => x.questionId == value.questionId);
+            if (question?.answerId) {
+                this.rForm.controls.answer.setValue(question.answerId, { emitEvent: false });
+                this.fCtrls.answerArray.controls.find(x => x.value.id == question.answerId).controls.isSelected.setValue(true);
+            }
         }
     }
     constructor(_formBuilder, _surveyLibService, _Store) {
@@ -792,6 +803,7 @@ class QuestionRadioButtonTemplateComponent {
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
         this.elemId = v4();
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
             name: new FormControl(null),
@@ -884,6 +896,10 @@ class QuestionCheckBoxTemplateComponent {
                 this.fCtrls.answer.addValidators([Validators.required]);
                 this.fCtrls.answer.updateValueAndValidity();
             }
+            var question = this.questionArr().find(x => x.questionId == value.questionId);
+            if (question?.answerIdArr) {
+                this.rForm.controls.answer.setValue(question.answerIdArr, { emitEvent: false });
+            }
         }
     }
     constructor(_formBuilder, _surveyLibService, _Store) {
@@ -891,6 +907,7 @@ class QuestionCheckBoxTemplateComponent {
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
         this.elemId = v4();
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
             name: new FormControl(null),
@@ -987,12 +1004,18 @@ class QuestionDropdownTemplateComponent {
                 this.fCtrls.answer.addValidators([Validators.required]);
                 this.fCtrls.answer.updateValueAndValidity();
             }
+            var question = this.questionArr().find(x => x.questionId == value.questionId);
+            if (question?.answerId) {
+                this.rForm.controls.answer.setValue(question.answerId, { emitEvent: false });
+            }
         }
     }
     constructor(_formBuilder, _surveyLibService, _Store) {
         this._formBuilder = _formBuilder;
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
+        this.subs = new SubSink();
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.emitter = new EventEmitter();
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
@@ -1005,8 +1028,11 @@ class QuestionDropdownTemplateComponent {
             isShow: new FormControl(true),
         });
     }
+    ngOnDestroy() {
+        this.subs.unsubscribe();
+    }
     ngOnInit() {
-        this.fCtrls.answer.valueChanges.pipe().pipe(debounceTime(200), distinctUntilChanged()).subscribe(value => {
+        this.subs.sink = this.fCtrls.answer.valueChanges.pipe().pipe(debounceTime(200), distinctUntilChanged()).subscribe(value => {
             const formValue = this.rForm.value;
             this._Store.dispatch(surveyActions.updateQuestionAnswer({
                 questionId: formValue.id,
@@ -1019,7 +1045,7 @@ class QuestionDropdownTemplateComponent {
                 Answer: value
             });
         });
-        this._Store.select(questionSelectors.pageQuestions).pipe(map(arr => arr.find(x => x.questionId == this.fCtrls.id.value)))
+        this.subs.sink = this._Store.select(questionSelectors.pageQuestions).pipe(map(arr => arr.find(x => x.questionId == this.fCtrls.id.value)))
             .pipe(filter(x => x != null), pairwise()).subscribe(value => {
             const oldValue = value[0];
             const newValue = value[1];
@@ -1089,6 +1115,10 @@ class QuestionMatrixTemplateComponent {
                         isValid: group.controls.answer.valid
                     }));
                 });
+                var question = this.questionArr().find(x => x.questionId == group.value.subQuestionId);
+                if (question != null) {
+                    group.controls.answer.setValue(question.answerId, { emitEvent: false });
+                }
                 this.fCtrls.subQuestionArray.push(group);
             });
         }
@@ -1098,6 +1128,7 @@ class QuestionMatrixTemplateComponent {
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
         this.elemId = v4();
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
             typeId: new FormControl(null),
@@ -1187,6 +1218,11 @@ class QuestionBooleanTemplateComponent {
                 this.fCtrls.answer.addValidators([Validators.required]);
                 this.fCtrls.answer.updateValueAndValidity();
             }
+            var question = this.questionArr().find(x => x.questionId == value.questionId);
+            if (question?.answerId) {
+                this.rForm.controls.answer.setValue(question.answerId, { emitEvent: false });
+                this.fCtrls.answerArray.controls.find(x => x.value.id == question.answerId).controls.isSelected.setValue(true);
+            }
         }
     }
     constructor(_formBuilder, _surveyLibService, _Store) {
@@ -1194,6 +1230,7 @@ class QuestionBooleanTemplateComponent {
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
         this.elemId = v4();
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
             name: new FormControl(null),
@@ -1282,6 +1319,10 @@ class QuestionDropdownMultiTemplateComponent {
                 this.fCtrls.answer.addValidators([Validators.required]);
                 this.fCtrls.answer.updateValueAndValidity();
             }
+            var question = this.questionArr().find(x => x.questionId == value.questionId);
+            if (question?.answerIdArr) {
+                this.rForm.controls.answer.setValue(question.answerIdArr, { emitEvent: false });
+            }
         }
     }
     constructor(_formBuilder, _surveyLibService, _Store) {
@@ -1289,6 +1330,7 @@ class QuestionDropdownMultiTemplateComponent {
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
         this.elemId = v4();
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
             name: new FormControl(null),
@@ -1408,7 +1450,7 @@ class QuestionCascadeTemplateComponent {
         this._ApiService = _ApiService;
         this._Store = _Store;
         this.surveyQuestionArr = [];
-        this.pageQuestions$ = this._Store.select(questionSelectors.pageQuestions);
+        this.pageQuestions$ = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.pageId = null;
         this.questionGroupId = null;
         this.isPre = false;
@@ -1486,14 +1528,13 @@ class QuestionCascadeTemplateComponent {
             group.controls.answer.updateValueAndValidity();
         }
         this.fCtrls.questionArr.push(group);
-        console.log(this.fCtrls.questionArr.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: QuestionCascadeTemplateComponent, deps: [{ token: i1.FormBuilder }, { token: SurveyLibService }, { token: ApiService }, { token: i3.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: QuestionCascadeTemplateComponent, selector: "lib-question-cascade-template", inputs: { pageId: "pageId", questionGroupId: "questionGroupId", isPre: "isPre", surveyLanguageId: "surveyLanguageId", applicantKey: "applicantKey", setQuestion: "setQuestion" }, ngImport: i0, template: "<ng-container *ngFor=\"let item of questionFormArray.controls; trackBy:identify ; let i = index\">\r\n      <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"(pageQuestions$  |async) |findQuestion :item.value.id \"\r\n        (emitter)=\"onUpdateAnswer($event)\" >\r\n    </lib-question-dropdown-template>  \r\n</ng-container>", styles: [""], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: QuestionDropdownTemplateComponent, selector: "lib-question-dropdown-template", inputs: ["setQuestion"], outputs: ["emitter"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: FindQuestionPipe, name: "findQuestion" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: QuestionCascadeTemplateComponent, selector: "lib-question-cascade-template", inputs: { pageId: "pageId", questionGroupId: "questionGroupId", isPre: "isPre", surveyLanguageId: "surveyLanguageId", applicantKey: "applicantKey", setQuestion: "setQuestion" }, ngImport: i0, template: "<ng-container *ngFor=\"let item of questionFormArray.controls; trackBy:identify ; let i = index\">\r\n      <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"pageQuestions$() |findQuestion :item.value.id \"\r\n        (emitter)=\"onUpdateAnswer($event)\" >\r\n    </lib-question-dropdown-template>  \r\n</ng-container>", styles: [""], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: QuestionDropdownTemplateComponent, selector: "lib-question-dropdown-template", inputs: ["setQuestion"], outputs: ["emitter"] }, { kind: "pipe", type: FindQuestionPipe, name: "findQuestion" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: QuestionCascadeTemplateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-question-cascade-template', template: "<ng-container *ngFor=\"let item of questionFormArray.controls; trackBy:identify ; let i = index\">\r\n      <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"(pageQuestions$  |async) |findQuestion :item.value.id \"\r\n        (emitter)=\"onUpdateAnswer($event)\" >\r\n    </lib-question-dropdown-template>  \r\n</ng-container>" }]
+            args: [{ selector: 'lib-question-cascade-template', template: "<ng-container *ngFor=\"let item of questionFormArray.controls; trackBy:identify ; let i = index\">\r\n      <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"pageQuestions$() |findQuestion :item.value.id \"\r\n        (emitter)=\"onUpdateAnswer($event)\" >\r\n    </lib-question-dropdown-template>  \r\n</ng-container>" }]
         }], ctorParameters: function () { return [{ type: i1.FormBuilder }, { type: SurveyLibService }, { type: ApiService }, { type: i3.Store }]; }, propDecorators: { pageId: [{
                 type: Input
             }], questionGroupId: [{
@@ -1543,6 +1584,10 @@ class QuestionFeedbackTemplateComponent {
                 this.fCtrls.answer.addValidators([Validators.required]);
                 this.fCtrls.answer.updateValueAndValidity();
             }
+            var question = this.questionArr().find(x => x.questionId == value.questionId);
+            if (question?.answerText) {
+                this.rForm.controls.answer.setValue(question.answerText, { emitEvent: false });
+            }
             this.toggleEnableAnswer(value.questionAllInfo.isReadOnly);
         }
     }
@@ -1553,6 +1598,7 @@ class QuestionFeedbackTemplateComponent {
         this._formBuilder = _formBuilder;
         this._surveyLibService = _surveyLibService;
         this._Store = _Store;
+        this.questionArr = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.isArabicLang = false;
         this.rForm = this._formBuilder.group({
             id: new FormControl(null),
@@ -1661,8 +1707,8 @@ class SurveryLibComponent {
         this.surveryLibraryDivId = v4();
         this.reloadDefaultAnswerId = v4();
         this.questionAnswerArr = [];
-        this.pageQuestionGroups$ = this._Store.select(questionGroupSelectors.pageQuestionGroups);
-        this.pageQuestions$ = this._Store.select(questionSelectors.pageQuestions);
+        this.pageQuestionGroups$ = this._Store.selectSignal(questionGroupSelectors.pageQuestionGroups);
+        this.pageQuestions$ = this._Store.selectSignal(questionSelectors.pageQuestions);
         this.isFirstPage$ = this._Store.select(surveySelectors.isFirstPage);
         this.isLastPage$ = this._Store.select(surveySelectors.isLastPage);
         this.curruntShowedSurveyPages$ = this._Store.select(surveySelectors.selectedPageIndex).pipe(map(x => x + 1));
@@ -1685,6 +1731,9 @@ class SurveryLibComponent {
     questionIdentify(index, item) {
         return item.questionId;
     }
+    questionGroupIdentify(index, item) {
+        return item.questionGroupId;
+    }
     ngOnInit() {
         this._Store.select(surveySelectors.selectedPageId).subscribe(value => {
             this.fCtrls.currentPageId.setValue(value);
@@ -1765,11 +1814,11 @@ class SurveryLibComponent {
         return null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SurveryLibComponent, deps: [{ token: SurveyLibService }, { token: i3.Store }, { token: i1.FormBuilder }, { token: CheckRuleExpsUsecase }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SurveryLibComponent, selector: "lib-survery-lib", inputs: { isPre: "isPre", surveyLanguageId: "surveyLanguageId", applicantKey: "applicantKey", isArabicLang: "isArabicLang" }, outputs: { surveyResultEmit: "surveyResultEmit", selectLanguageEmit: "selectLanguageEmit" }, ngImport: i0, template: "<div id=\"survery-card-{{surveryLibraryDivId}}\" class=\"survay-card\">\r\n  <div [attr.id]=\"'survey-page_'+fCtrls.currentPageId.value\">\r\n    <ng-container *ngFor=\"let item of (pageQuestionGroups$ | async)\">\r\n      <div class=\"survay-card\">\r\n        <div class=\"survay-card-body\">\r\n          <div class=\"survay-group\">\r\n            <div class=\"title\">\r\n              <h2 class=\"group-title\" [innerHTML]=\"item.questionGroupName\">\r\n              </h2>\r\n              <span class=\"group-sub-title \" [innerHTML]=\"item.questionGroupDescription\">\r\n              </span>\r\n            </div>\r\n            <ng-container\r\n              *ngFor=\"let question of ((pageQuestions$|async) |filterQuestion : item.questionGroupId); trackBy:questionIdentify\">\r\n              <lib-question-boolean-template #questionBooleanTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.Boolean\">\r\n              </lib-question-boolean-template>\r\n\r\n              <lib-question-text-template #questionTextTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.TextInput\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-text-template>\r\n\r\n                <lib-question-feedback-template #questionFeedTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.FeedBack\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-feedback-template>\r\n\r\n              <lib-question-radio-button-template #questionRadioButtonTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.RadioButton\">\r\n              </lib-question-radio-button-template>\r\n\r\n              <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDown\"></lib-question-dropdown-template>\r\n\r\n              <lib-question-dropdown-multi-template [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDownMulti\">\r\n              </lib-question-dropdown-multi-template>\r\n\r\n              <lib-question-check-box-template #questionCheckBoxTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.CheckBox\">\r\n              </lib-question-check-box-template>\r\n\r\n              <lib-question-matrix-template #questionMatrixTemplate [setQuestion]=\"question\"\r\n                 *ngIf=\"question.questionType == questionTypeEnum.Matrix\">\r\n              </lib-question-matrix-template>\r\n\r\n               <lib-question-cascade-template #questionCascadeTemplate [setQuestion]=\"question\"\r\n               *ngIf=\"question.questionType == questionTypeEnum.Cascade\"\r\n                [applicantKey]=\"applicantKey\" [isPre]=\"isPre\" [surveyLanguageId]=\"surveyLanguageId\"\r\n                [pageId]=\"question.surveyPageId\" [questionGroupId]=\"question.questionGroupId\"></lib-question-cascade-template>\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <div class=\"survay-card-footr\" *ngIf=\"fCtrls.showedSurveyPages.value.length > 0\">\r\n    <div class=\"container\" style=\" justify-content: start;\">\r\n      <div class=\"survay-pagination fw-bold\">\r\n        <span>{{ curruntShowedSurveyPages$ | async}}</span>\r\n        <span class=\"ms-2 me-2\">{{isArabicLang ? '\u0645\u0646' : 'of'}} </span>\r\n        <span>{{fCtrls.showedSurveyPages.value.length}}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".disable__btn{background-color:gray!important;cursor:not-allowed}.quastion{padding:10px}.quastion .quastion-title{color:var(--dark-100, #363636);text-align:right;font-family:Almarai;font-size:18px;font-style:normal;font-weight:700;line-height:20.6px}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: QuestionTextTemplateComponent, selector: "lib-question-text-template", inputs: ["isArabicLang", "setQuestion", "isDisabled"] }, { kind: "component", type: QuestionRadioButtonTemplateComponent, selector: "lib-question-radio-button-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionCheckBoxTemplateComponent, selector: "lib-question-check-box-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionDropdownTemplateComponent, selector: "lib-question-dropdown-template", inputs: ["setQuestion"], outputs: ["emitter"] }, { kind: "component", type: QuestionMatrixTemplateComponent, selector: "lib-question-matrix-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionBooleanTemplateComponent, selector: "lib-question-boolean-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionDropdownMultiTemplateComponent, selector: "lib-question-dropdown-multi-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionCascadeTemplateComponent, selector: "lib-question-cascade-template", inputs: ["pageId", "questionGroupId", "isPre", "surveyLanguageId", "applicantKey", "setQuestion"] }, { kind: "component", type: QuestionFeedbackTemplateComponent, selector: "lib-question-feedback-template", inputs: ["isArabicLang", "setQuestion", "isDisabled"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: FilterQuestionPipe, name: "filterQuestion" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SurveryLibComponent, selector: "lib-survery-lib", inputs: { isPre: "isPre", surveyLanguageId: "surveyLanguageId", applicantKey: "applicantKey", isArabicLang: "isArabicLang" }, outputs: { surveyResultEmit: "surveyResultEmit", selectLanguageEmit: "selectLanguageEmit" }, ngImport: i0, template: "<div id=\"survery-card-{{surveryLibraryDivId}}\" class=\"survay-card\">\r\n  <div [attr.id]=\"'survey-page_'+fCtrls.currentPageId.value\">\r\n    <ng-container *ngFor=\"let item of pageQuestionGroups$(); trackBy:questionGroupIdentify\">\r\n      <div class=\"survay-card\">\r\n        <div class=\"survay-card-body\">\r\n          <div class=\"survay-group\">\r\n            <div class=\"title\">\r\n              <h2 class=\"group-title\" [innerHTML]=\"item.questionGroupName\">\r\n              </h2>\r\n              <span class=\"group-sub-title \" [innerHTML]=\"item.questionGroupDescription\">\r\n              </span>\r\n            </div>\r\n            <ng-container\r\n              *ngFor=\"let question of (pageQuestions$() |filterQuestion : item.questionGroupId); trackBy:questionIdentify\">\r\n              <lib-question-boolean-template #questionBooleanTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.Boolean\">\r\n              </lib-question-boolean-template>\r\n\r\n              <lib-question-text-template #questionTextTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.TextInput\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-text-template>\r\n\r\n                <lib-question-feedback-template #questionFeedTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.FeedBack\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-feedback-template>\r\n\r\n              <lib-question-radio-button-template #questionRadioButtonTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.RadioButton\">\r\n              </lib-question-radio-button-template>\r\n\r\n              <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDown\"></lib-question-dropdown-template>\r\n\r\n              <lib-question-dropdown-multi-template [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDownMulti\">\r\n              </lib-question-dropdown-multi-template>\r\n\r\n              <lib-question-check-box-template #questionCheckBoxTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.CheckBox\">\r\n              </lib-question-check-box-template>\r\n\r\n              <lib-question-matrix-template #questionMatrixTemplate [setQuestion]=\"question\"\r\n                 *ngIf=\"question.questionType == questionTypeEnum.Matrix\">\r\n              </lib-question-matrix-template>\r\n\r\n               <lib-question-cascade-template #questionCascadeTemplate [setQuestion]=\"question\"\r\n               *ngIf=\"question.questionType == questionTypeEnum.Cascade\"\r\n                [applicantKey]=\"applicantKey\" [isPre]=\"isPre\" [surveyLanguageId]=\"surveyLanguageId\"\r\n                [pageId]=\"question.surveyPageId\" [questionGroupId]=\"question.questionGroupId\"></lib-question-cascade-template>\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <div class=\"survay-card-footr\" *ngIf=\"fCtrls.showedSurveyPages.value.length > 0\">\r\n    <div class=\"container\" style=\" justify-content: start;\">\r\n      <div class=\"survay-pagination fw-bold\">\r\n        <span>{{ curruntShowedSurveyPages$ | async}}</span>\r\n        <span class=\"ms-2 me-2\">{{isArabicLang ? '\u0645\u0646' : 'of'}} </span>\r\n        <span>{{fCtrls.showedSurveyPages.value.length}}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".disable__btn{background-color:gray!important;cursor:not-allowed}.quastion{padding:10px}.quastion .quastion-title{color:var(--dark-100, #363636);text-align:right;font-family:Almarai;font-size:18px;font-style:normal;font-weight:700;line-height:20.6px}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: QuestionTextTemplateComponent, selector: "lib-question-text-template", inputs: ["isArabicLang", "setQuestion", "isDisabled"] }, { kind: "component", type: QuestionRadioButtonTemplateComponent, selector: "lib-question-radio-button-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionCheckBoxTemplateComponent, selector: "lib-question-check-box-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionDropdownTemplateComponent, selector: "lib-question-dropdown-template", inputs: ["setQuestion"], outputs: ["emitter"] }, { kind: "component", type: QuestionMatrixTemplateComponent, selector: "lib-question-matrix-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionBooleanTemplateComponent, selector: "lib-question-boolean-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionDropdownMultiTemplateComponent, selector: "lib-question-dropdown-multi-template", inputs: ["setQuestion"] }, { kind: "component", type: QuestionCascadeTemplateComponent, selector: "lib-question-cascade-template", inputs: ["pageId", "questionGroupId", "isPre", "surveyLanguageId", "applicantKey", "setQuestion"] }, { kind: "component", type: QuestionFeedbackTemplateComponent, selector: "lib-question-feedback-template", inputs: ["isArabicLang", "setQuestion", "isDisabled"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: FilterQuestionPipe, name: "filterQuestion" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SurveryLibComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-survery-lib', template: "<div id=\"survery-card-{{surveryLibraryDivId}}\" class=\"survay-card\">\r\n  <div [attr.id]=\"'survey-page_'+fCtrls.currentPageId.value\">\r\n    <ng-container *ngFor=\"let item of (pageQuestionGroups$ | async)\">\r\n      <div class=\"survay-card\">\r\n        <div class=\"survay-card-body\">\r\n          <div class=\"survay-group\">\r\n            <div class=\"title\">\r\n              <h2 class=\"group-title\" [innerHTML]=\"item.questionGroupName\">\r\n              </h2>\r\n              <span class=\"group-sub-title \" [innerHTML]=\"item.questionGroupDescription\">\r\n              </span>\r\n            </div>\r\n            <ng-container\r\n              *ngFor=\"let question of ((pageQuestions$|async) |filterQuestion : item.questionGroupId); trackBy:questionIdentify\">\r\n              <lib-question-boolean-template #questionBooleanTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.Boolean\">\r\n              </lib-question-boolean-template>\r\n\r\n              <lib-question-text-template #questionTextTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.TextInput\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-text-template>\r\n\r\n                <lib-question-feedback-template #questionFeedTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.FeedBack\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-feedback-template>\r\n\r\n              <lib-question-radio-button-template #questionRadioButtonTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.RadioButton\">\r\n              </lib-question-radio-button-template>\r\n\r\n              <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDown\"></lib-question-dropdown-template>\r\n\r\n              <lib-question-dropdown-multi-template [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDownMulti\">\r\n              </lib-question-dropdown-multi-template>\r\n\r\n              <lib-question-check-box-template #questionCheckBoxTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.CheckBox\">\r\n              </lib-question-check-box-template>\r\n\r\n              <lib-question-matrix-template #questionMatrixTemplate [setQuestion]=\"question\"\r\n                 *ngIf=\"question.questionType == questionTypeEnum.Matrix\">\r\n              </lib-question-matrix-template>\r\n\r\n               <lib-question-cascade-template #questionCascadeTemplate [setQuestion]=\"question\"\r\n               *ngIf=\"question.questionType == questionTypeEnum.Cascade\"\r\n                [applicantKey]=\"applicantKey\" [isPre]=\"isPre\" [surveyLanguageId]=\"surveyLanguageId\"\r\n                [pageId]=\"question.surveyPageId\" [questionGroupId]=\"question.questionGroupId\"></lib-question-cascade-template>\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <div class=\"survay-card-footr\" *ngIf=\"fCtrls.showedSurveyPages.value.length > 0\">\r\n    <div class=\"container\" style=\" justify-content: start;\">\r\n      <div class=\"survay-pagination fw-bold\">\r\n        <span>{{ curruntShowedSurveyPages$ | async}}</span>\r\n        <span class=\"ms-2 me-2\">{{isArabicLang ? '\u0645\u0646' : 'of'}} </span>\r\n        <span>{{fCtrls.showedSurveyPages.value.length}}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".disable__btn{background-color:gray!important;cursor:not-allowed}.quastion{padding:10px}.quastion .quastion-title{color:var(--dark-100, #363636);text-align:right;font-family:Almarai;font-size:18px;font-style:normal;font-weight:700;line-height:20.6px}\n"] }]
+            args: [{ selector: 'lib-survery-lib', template: "<div id=\"survery-card-{{surveryLibraryDivId}}\" class=\"survay-card\">\r\n  <div [attr.id]=\"'survey-page_'+fCtrls.currentPageId.value\">\r\n    <ng-container *ngFor=\"let item of pageQuestionGroups$(); trackBy:questionGroupIdentify\">\r\n      <div class=\"survay-card\">\r\n        <div class=\"survay-card-body\">\r\n          <div class=\"survay-group\">\r\n            <div class=\"title\">\r\n              <h2 class=\"group-title\" [innerHTML]=\"item.questionGroupName\">\r\n              </h2>\r\n              <span class=\"group-sub-title \" [innerHTML]=\"item.questionGroupDescription\">\r\n              </span>\r\n            </div>\r\n            <ng-container\r\n              *ngFor=\"let question of (pageQuestions$() |filterQuestion : item.questionGroupId); trackBy:questionIdentify\">\r\n              <lib-question-boolean-template #questionBooleanTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.Boolean\">\r\n              </lib-question-boolean-template>\r\n\r\n              <lib-question-text-template #questionTextTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.TextInput\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-text-template>\r\n\r\n                <lib-question-feedback-template #questionFeedTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.FeedBack\"\r\n                [isArabicLang]=\"isArabicLang\"></lib-question-feedback-template>\r\n\r\n              <lib-question-radio-button-template #questionRadioButtonTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.RadioButton\">\r\n              </lib-question-radio-button-template>\r\n\r\n              <lib-question-dropdown-template #questionDropdownTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDown\"></lib-question-dropdown-template>\r\n\r\n              <lib-question-dropdown-multi-template [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.DropDownMulti\">\r\n              </lib-question-dropdown-multi-template>\r\n\r\n              <lib-question-check-box-template #questionCheckBoxTemplate [setQuestion]=\"question\"\r\n                *ngIf=\"question.questionType == questionTypeEnum.CheckBox\">\r\n              </lib-question-check-box-template>\r\n\r\n              <lib-question-matrix-template #questionMatrixTemplate [setQuestion]=\"question\"\r\n                 *ngIf=\"question.questionType == questionTypeEnum.Matrix\">\r\n              </lib-question-matrix-template>\r\n\r\n               <lib-question-cascade-template #questionCascadeTemplate [setQuestion]=\"question\"\r\n               *ngIf=\"question.questionType == questionTypeEnum.Cascade\"\r\n                [applicantKey]=\"applicantKey\" [isPre]=\"isPre\" [surveyLanguageId]=\"surveyLanguageId\"\r\n                [pageId]=\"question.surveyPageId\" [questionGroupId]=\"question.questionGroupId\"></lib-question-cascade-template>\r\n            </ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <div class=\"survay-card-footr\" *ngIf=\"fCtrls.showedSurveyPages.value.length > 0\">\r\n    <div class=\"container\" style=\" justify-content: start;\">\r\n      <div class=\"survay-pagination fw-bold\">\r\n        <span>{{ curruntShowedSurveyPages$ | async}}</span>\r\n        <span class=\"ms-2 me-2\">{{isArabicLang ? '\u0645\u0646' : 'of'}} </span>\r\n        <span>{{fCtrls.showedSurveyPages.value.length}}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: [".disable__btn{background-color:gray!important;cursor:not-allowed}.quastion{padding:10px}.quastion .quastion-title{color:var(--dark-100, #363636);text-align:right;font-family:Almarai;font-size:18px;font-style:normal;font-weight:700;line-height:20.6px}\n"] }]
         }], ctorParameters: function () { return [{ type: SurveyLibService }, { type: i3.Store }, { type: i1.FormBuilder }, { type: CheckRuleExpsUsecase }]; }, propDecorators: { isPre: [{
                 type: Input
             }], surveyLanguageId: [{
@@ -1914,6 +1963,124 @@ function surveyReducer(state, action) {
     return _surveyReducer(state, action);
 }
 
+var LogicActionEnum;
+(function (LogicActionEnum) {
+    LogicActionEnum[LogicActionEnum["Show"] = 1] = "Show";
+    LogicActionEnum[LogicActionEnum["Hide"] = 2] = "Hide";
+    LogicActionEnum[LogicActionEnum["Enable"] = 3] = "Enable";
+    LogicActionEnum[LogicActionEnum["Disable"] = 4] = "Disable";
+    LogicActionEnum[LogicActionEnum["SetAnswer"] = 5] = "SetAnswer";
+})(LogicActionEnum || (LogicActionEnum = {}));
+
+class SurveyEffects {
+    constructor(_actions, _store, _checkRuleExpsUsecase) {
+        this._actions = _actions;
+        this._store = _store;
+        this._checkRuleExpsUsecase = _checkRuleExpsUsecase;
+        this.updateQuestionAnswer$ = createEffect(() => this._actions.pipe(ofType(surveyActions.updateQuestionAnswer), withLatestFrom(this._store.select(surveySelectors.ruleArr), this._store.select(questionSelectors.allQuestions)), switchMap(([action, ruleArr, questionArr]) => {
+            var formatedRuleArr = [];
+            ruleArr.forEach(rule => {
+                rule.ruleExps.forEach(ruleQuestion => {
+                    formatedRuleArr.push({
+                        ruleId: rule.ruleId,
+                        questionId: ruleQuestion.questionId
+                    });
+                });
+            });
+            var selectedRuleIdArr = formatedRuleArr.filter(x => x.questionId == action.questionId).map(x => Number(x.ruleId));
+            var arr = ruleArr.filter(x => selectedRuleIdArr.find(c => c == x.ruleId) != null);
+            arr.forEach(rule => {
+                this._checkRuleExpsUsecase.execute({
+                    ruleExps: rule.ruleExps,
+                    questions: questionArr,
+                }).subscribe(result => {
+                    var isPassed = result.exprestionResultArr.filter(x => x == false).length == 0;
+                    if (isPassed) {
+                        rule.ruleResultQuestions.forEach(resultQuestion => {
+                            if (rule.logicActionId == LogicActionEnum.Show) {
+                                this._store.dispatch(surveyActions.updateQuestionShow({
+                                    questionId: resultQuestion.questionId,
+                                    isShow: true
+                                }));
+                            }
+                            else if (rule.logicActionId == LogicActionEnum.Hide) {
+                                this._store.dispatch(surveyActions.updateQuestionShow({
+                                    questionId: resultQuestion.questionId,
+                                    isShow: false
+                                }));
+                            }
+                            else if (rule.logicActionId == LogicActionEnum.Enable) {
+                                this._store.dispatch(surveyActions.updateQuestionDisable({
+                                    questionId: resultQuestion.questionId,
+                                    isDisabled: false
+                                }));
+                            }
+                            else if (rule.logicActionId == LogicActionEnum.Disable) {
+                                this._store.dispatch(surveyActions.updateQuestionDisable({
+                                    questionId: resultQuestion.questionId,
+                                    isDisabled: true
+                                }));
+                            }
+                            else if (rule.logicActionId == LogicActionEnum.SetAnswer) {
+                            }
+                            const question = questionArr.find(x => x.questionId == resultQuestion.questionId);
+                            //update matrix sub questions
+                            if (question.questionType == QuestionTypeEnum.Matrix && question.isMatrixGroup == true) {
+                                var subQuestions = questionArr.filter(x => x.parentQuestionId == question.questionId);
+                                subQuestions.forEach(subQuestion => {
+                                    if (rule.logicActionId == LogicActionEnum.Show) {
+                                        this._store.dispatch(surveyActions.updateQuestionShow({
+                                            questionId: subQuestion.questionId,
+                                            isShow: true
+                                        }));
+                                    }
+                                    else if (rule.logicActionId == LogicActionEnum.Hide) {
+                                        this._store.dispatch(surveyActions.updateQuestionShow({
+                                            questionId: subQuestion.questionId,
+                                            isShow: false
+                                        }));
+                                    }
+                                    else if (rule.logicActionId == LogicActionEnum.Enable) {
+                                        this._store.dispatch(surveyActions.updateQuestionDisable({
+                                            questionId: subQuestion.questionId,
+                                            isDisabled: false
+                                        }));
+                                    }
+                                    else if (rule.logicActionId == LogicActionEnum.Disable) {
+                                        this._store.dispatch(surveyActions.updateQuestionDisable({
+                                            questionId: subQuestion.questionId,
+                                            isDisabled: true
+                                        }));
+                                    }
+                                });
+                            }
+                        });
+                    }
+                    else {
+                        rule.ruleResultQuestions.forEach(resultQuestion => {
+                            const question = questionArr.find(x => x.questionId == resultQuestion.questionId);
+                            this._store.dispatch(surveyActions.updateQuestionShow({
+                                questionId: resultQuestion.questionId,
+                                isShow: question.isShow_default
+                            }));
+                            this._store.dispatch(surveyActions.updateQuestionDisable({
+                                questionId: resultQuestion.questionId,
+                                isDisabled: question.isDisabled_default
+                            }));
+                        });
+                    }
+                });
+            });
+            return of([]);
+        })), { dispatch: false });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SurveyEffects, deps: [{ token: i1$2.Actions }, { token: i3.Store }, { token: CheckRuleExpsUsecase }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SurveyEffects }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SurveyEffects, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1$2.Actions }, { type: i3.Store }, { type: CheckRuleExpsUsecase }]; } });
+
 class SurveryLibModule {
     static forRoot(config) {
         return {
@@ -1945,11 +2112,11 @@ class SurveryLibModule {
             MaskedForMinMaxDirective,
             FindQuestionPipe,
             QuestionFeedbackTemplateComponent,
-            MaskedForMaxLengthDirective], imports: [CommonModule, HttpClientModule, ReactiveFormsModule, FormsModule, NgSelectModule, i3.StoreFeatureModule, i2.EffectsFeatureModule, RatingModule, PaginationModule], exports: [SurveryLibComponent,
+            MaskedForMaxLengthDirective], imports: [CommonModule, HttpClientModule, ReactiveFormsModule, FormsModule, NgSelectModule, i3.StoreFeatureModule, i1$2.EffectsFeatureModule, RatingModule, PaginationModule], exports: [SurveryLibComponent,
             StoreModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SurveryLibModule, imports: [CommonModule, HttpClientModule, ReactiveFormsModule, FormsModule, NgSelectModule,
             StoreModule.forFeature('survey-lib', surveyReducer),
-            EffectsModule.forFeature([]), RatingModule, PaginationModule, StoreModule] }); }
+            EffectsModule.forFeature([SurveyEffects]), RatingModule, PaginationModule, StoreModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SurveryLibModule, decorators: [{
             type: NgModule,
@@ -1976,7 +2143,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
                     imports: [
                         CommonModule, HttpClientModule, ReactiveFormsModule, FormsModule, NgSelectModule,
                         StoreModule.forFeature('survey-lib', surveyReducer),
-                        EffectsModule.forFeature([]), RatingModule, PaginationModule
+                        EffectsModule.forFeature([SurveyEffects]), RatingModule, PaginationModule
                     ],
                     exports: [
                         SurveryLibComponent,