vcomply-workflow-engine 2.0.4 → 2.0.167

package/projects/vx-workflow-engine/src/lib/workflow-assessment/import-an-assessment/import-an-assessment.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ImportAnAssessmentComponent } from './import-an-assessment.component';
+
+describe('WorkflowAssessmentComponent', () => {
+  let component: ImportAnAssessmentComponent;
+  let fixture: ComponentFixture<ImportAnAssessmentComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ImportAnAssessmentComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ImportAnAssessmentComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/vx-workflow-engine/src/lib/workflow-assessment/import-an-assessment/import-an-assessment.component.ts

@@ -0,0 +1,577 @@
+import { Component, Output, EventEmitter, ViewChild } from '@angular/core';
+import * as XLSX from 'xlsx';
+import { AuthService } from '../../workflow-services/auth.service';
+import { AssessmentService } from '../../workflow-services/assessment.service';
+import { CreateAssessmentContainerComponent } from '../../sharedComponents/assessment-editor/create-assessment-container/create-assessment-container.component';
+import { UiKitService } from '../../workflow-services/ui-kit.service';
+
+type AOA = any[][];
+const smileyActions = { IMPORT_MORE: "IMPORT_MORE", VIEW_ASSESSMENTS: "VIEW_ASSESSMENTS" }
+
+@Component({
+  selector: 'app-import-an-assessment',
+  templateUrl: './import-an-assessment.component.html',
+  styleUrls: ['./import-an-assessment.component.less', '../../forms.less'],
+})
+
+export class ImportAnAssessmentComponent {
+  @ViewChild('editor', { static: false }) editorCont!: CreateAssessmentContainerComponent;
+  @Output() closeWorkflow = new EventEmitter();
+  @Output() disconnectRefresh = new EventEmitter();
+  isShowLoader: boolean = false;
+  isWrongFormat = false;
+  fileName: any;
+  data: any;
+  uploadedFiles: any = [];
+  fileResponse: any = [];
+  fileValue: any;
+  organizationId = 0;
+  errorMessage = "invalid file error"
+  downloadStatus: string = 'NOT_DOWNLOADING';
+  downloadPercent = 0;
+  smileyMessageAction = `You're All Set!`;
+  actionButtons = [
+    { buttonText: 'Import More Assessments', class: 'white-btn', id: smileyActions.IMPORT_MORE },
+    { buttonText: 'View Assessments', class: 'blue-btn', id: smileyActions.VIEW_ASSESSMENTS },
+  ];
+  showSmiley = false;
+  assessmentData !: any;
+  sheetData !: any;
+  convertedData: any;
+  isUploaded: boolean = false;
+  categoryData !: any;
+
+  setIsUploaded(isUploaded: boolean) {
+    this.isUploaded = isUploaded;
+    this.auth.previewPanel.next(isUploaded);
+    if (!isUploaded) {
+      const closeBtn = document.getElementById("close-workflow-engine-btn")
+      if (closeBtn) closeBtn.style.display = "block";
+      this.convertedData = {};
+    }
+  }
+
+  constructor(
+    private auth: AuthService,
+    public assessmentService: AssessmentService
+  ) { 
+    this.organizationId =  this.auth.getOrganizationId();
+  }
+
+  closeSmiley(event: any) {
+    this.showSmiley = false;
+    this.closeWorkflow.emit({ evt: this.assessmentData, confirm: false });
+  }
+
+  downloadTemplate() {
+    this.downloadStatus = 'DOWNLOADING';
+    this.downloadPercent = 0;
+    const downloadDate = new Date().toDateString().split(' ');
+    const fileName = `Import an Assessment-${downloadDate[2]}-${downloadDate[1]}-${downloadDate[3]}.xlsx`;
+
+    this.assessmentService.downloadTemplate().subscribe(
+      {
+        next: (data: any) => {
+          setTimeout(() => {
+            this.downloadStatus = this.assessmentService.downLoadFile(data, 'application/xlsx', fileName);
+          }, 1500);
+        },
+        error: () => { this.downloadStatus = 'DOWNLOADED'; }
+      }
+
+    );
+  }
+
+  triggerBrowseFile() {
+    const getFile = document.getElementById('iaa-file-input');
+    if (getFile) {
+      getFile.click();
+
+    }
+  }
+
+  //  handle upload file area
+  uploadFile(evt: any) {
+    const target: DataTransfer = evt.target as DataTransfer;
+    const reader: FileReader = new FileReader();
+    reader.onload = (e: any) => {
+      const bstr: string = e.target.result;
+      const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });
+      const wsname: string = wb.SheetNames[0];
+      const wsname1: string = wb.SheetNames[1];
+      const ws: XLSX.WorkSheet = wb.Sheets[wsname];
+      const tempData: XLSX.WorkSheet = wb.Sheets[wsname1];
+      this.categoryData = XLSX.utils.sheet_to_json(tempData, {
+        header: 1,
+      }) as AOA;
+      console.log("data",this.categoryData)
+      this.sheetData = XLSX.utils.sheet_to_json(ws, {
+        header: 1,
+      }) as AOA;
+
+      this.generateCategoryList(this.categoryData);
+
+      this.assessmentData = this.sheetData.filter((dataElement: any) => dataElement.length > 0);
+
+      this.isWrongFormat = false;
+      this.errorMessage = '';
+      console.log("Imp", this.checkFormat(this.assessmentData))
+      if (!this.checkFormat(this.assessmentData)) {
+        const closeBtn = document.getElementById("close-workflow-engine-btn");
+         if (closeBtn) closeBtn.style.display = "none";
+
+        this.generateEditorPayload(this.assessmentData);
+        this.auth.previewPanel.next(true);
+        this.isUploaded = true;
+        setTimeout(()=>{this.editorCont.triggerPreviewWithValidation()},100)
+
+      }
+
+    }
+    reader.readAsBinaryString(target.files[0]);
+  }
+
+  categoryList !: any;
+  generateCategoryList(categoryData: any) {
+    const catList: any = {}
+    if (categoryData) {
+      categoryData.forEach((ele: any) => {
+        catList[ele[0]] = ele[1];
+      })
+      this.categoryList = catList;
+    }
+  }
+
+  categoryNametoId(categoryName: string) {
+    if (this.categoryList[categoryName]) {
+      return this.categoryList[categoryName];
+    } else {
+      return null;
+    }
+
+  }
+  generateEditorPayload(data: any) {
+    //check format
+
+    const payload: any = {
+
+      metadata:
+      {
+        assessment_name: "",
+        description: "",
+        assessment_type: "compliance",
+        category_arr: [
+
+        ],
+        approval_workflow_arr: {
+          "test": "test"
+        },
+        approval_required: true,
+        source_page: "compliance"
+      },
+      assessmentData: {
+        version: 2,
+        questionRandomize: false,
+        anonymousResponse: false,
+        hasWelcome: false,
+        hasWelcomeDescription: false,
+        welcomeText: '',
+        hasWelcomeImage: false,
+        welcomeImage: '',
+        welcomeDescription: '',
+        hasThanks: false,
+        hasThankyouImage: false,
+        thankyouText: '',
+        thankyouImage: '',
+        hasThankyouDescription: false,
+        thankyouDescription: '',
+        elements: [],
+        pageDetailsList: [],
+        customResponseSet: [],
+        settings: this.settings,
+        responseSegment: this.initializeEmptyResponseSegment()
+      }
+    }
+
+    this.convertedData = payload;
+    this.convertedData.metadata.assessment_name = this.assessmentData[2][1];
+    this.convertedData.metadata.description = this.assessmentData[3][1];
+    // this.convertedData.metadata.category_arr[0] = this.assessmentData[4][1];
+    this.convertedData.metadata.category_arr = [this.categoryNametoId(this.assessmentData[4][1])];
+
+    //TODO: create a function to convert from categories names to categories id.
+    //TODO: check the api for sub-flow like assessment-setting.
+    // this.convertedData.metadata.category_arr[0] = "61cc27c5b3e8642b333f3591";
+    this.generateQuestionsList(data.slice(6), payload.assessmentData.elements)
+  }
+
+  generateQuestionsList(questionsList: any, questionsArray: any) {
+    questionsArray = [];
+    if (questionsList?.length) {
+      questionsList.forEach((question: any, index: number) => {
+        console.log("question list", question)
+        questionsArray.push();
+        switch (question[0]) {
+          case 'Single Textbox':
+            questionsArray.push(this.generateSingleTextbox('single-textbox',question, index))
+            break;
+          case 'Multiple Choice':
+            questionsArray.push(this.generateMultipleChoice('multiple-choice',question, index))
+            break;
+          case 'Checkbox':
+            questionsArray.push(this.generateMultipleChoice('checkbox',question, index))
+            break;
+          case 'Dropdown':
+            questionsArray.push(this.generateMultipleChoice('dropdown',question, index))
+            break;
+          case 'Date & Time':
+            questionsArray.push(this.generateDateTime('date-time',question, index))
+            break;
+          case 'File Upload':
+            questionsArray.push(this.generateFileUpload(question, index))
+            break;
+          default:
+          // No need to do anything for default
+        }
+      })
+    }
+    console.log("questions", questionsArray)
+    this.convertedData.assessmentData.elements = questionsArray;
+  }
+  colMap: any = {
+    type: 0,
+    title: 1,
+    score: 2,
+    opt1: 3,
+    opt2: 4,
+    opt3: 5,
+    opt4: 6,
+    opt5: 7,
+    opt6: 8,
+    required: 9,
+    failed: 10,
+    description: 11,
+    placeholder: 12,
+    comment: 13,
+    other: 14,
+    randomize: 15,
+    alignment: 16,
+    userattachment: 17,
+    usercomment: 18
+  }
+  generateSingleTextbox(type:string,question: any, index: any) {
+    return {
+      type: 'single-textbox', name: `Question_${index}`, page: 1,
+      hasValidation: false, validationType: '', isRequired: question[this.colMap?.required] === 'Yes' ? true : false, hasCharacterLength: false, minCharacterLength: 0,
+      maxCharacterLength: 100, title: question[this.colMap?.title]?.toString()?.trim() ?? '',
+      hasDescription: question[this.colMap?.description]?.toString()?.trim()?.length ? true : false, description: question[this.colMap?.description]?.toString()?.trim() ?? '',
+      hasComments: question[this.colMap?.usercomment]?.toString()?.trim()?.length ? true : false, comments: question[this.colMap?.comment]?.toString()?.trim(),
+      randomize: question[this.colMap?.randomize] === 'Yes' ? true : false, hasOther: question[this.colMap?.other] === 'Yes' ? true : false, otherValue: 'Other', alignment: question[this.colMap?.alignment] === 'Yes' ? true : false, reverse: false,
+      isRespondentAttachment: question[this.colMap?.userattachment] === 'Yes' ? true : false, userAttachedFiles: [], isRespondentComment: question[this.colMap?.usercomment] === 'Yes' ? true : false,
+      visibilityLogic: [],
+      otherConfig: { color: "#000000", isFailed: false, score: question[this.colMap?.score] ?? 1 },
+      choices: [{
+        title: '',
+        value: 1,
+        isSelected: false,
+        required: 0,
+        hasHelpingLabel: false,
+        helpingLabel: "",
+        isFailed: false,
+        score: question[this.colMap?.score] ?? 1,
+        color: "#000000"
+      }]
+    };
+  }
+
+  generateMultipleChoice(type:string,question: any, index: any) {
+    console.log("Yo Man", question)
+    return {
+      type: type, name: `Question_${index}`, page: 1,
+      hasValidation: false, validationType: '', isRequired: question[this.colMap?.required] === 'Yes' ? true : false,
+      hasCharacterLength: false, minCharacterLength: 0, maxCharacterLength: 100, title: question[this.colMap?.title]?.toString()?.trim() ?? '',
+      hasDescription: question[this.colMap?.description]?.toString()?.trim()?.length ? true : false, description: question[this.colMap?.description]?.toString().trim() ?? '',
+      hasComments: question[this.colMap?.comment]?.toString()?.trim()?.length ? true : false, comments: question[this.colMap?.comment]?.toString().trim(),
+      randomize: question[this.colMap?.randomize] === 'Yes' ? true : false, hasOther: question[this.colMap?.other] === 'Yes' ? true : false, otherValue: 'Other', alignment: question[this.colMap?.alignment] === 'Yes' ? true : false, reverse: false,
+      isRespondentAttachment: question[this.colMap?.userattachment] === 'Yes' ? true : false, userAttachedFiles: [],
+      visibilityLogic: [], isRespondentComment: question[this.colMap?.usercomment] === 'Yes' ? true : false,
+      otherConfig: { color: "#000000", isFailed: false, score: question[this.colMap?.score] ?? 1 },
+      choices: this.generateChoices(question)
+    };
+  }
+
+  generateDateTime(type:string,question: any, index: any) {
+    return {
+      type: type, name: `Question_${index}`, page: 1,
+      hasValidation: false, validationType: '', isRequired: question[this.colMap?.required] === 'Yes' ? true : false,
+      hasCharacterLength: false, minCharacterLength: 0, maxCharacterLength: 100, title: question[this.colMap?.title]?.toString()?.trim() ?? '',
+      hasDescription: question[this.colMap?.description]?.toString()?.trim()?.length ? true : false, description: question[this.colMap?.description]?.toString()?.trim() ?? '',
+      hasComments: question[this.colMap?.comment]?.toString()?.trim()?.length ? true : false, comments: question[this.colMap?.comment]?.toString().trim(),
+      randomize: question[this.colMap?.randomize] === 'Yes' ? true : false, hasOther: question[this.colMap?.other] === 'Yes' ? true : false, otherValue: 'Other', alignment: question[this.colMap?.alignment] === 'Yes' ? true : false, reverse: false,
+      isRespondentAttachment: question[this.colMap?.userattachment] === 'Yes' ? true : false, userAttachedFiles: [],
+      visibilityLogic: [], isRespondentComment: question[this.colMap?.usercomment] === 'Yes' ? true : false,
+      otherConfig: { color: "#000000", isFailed: false, score: question[this.colMap?.score] ?? 1 },
+      choices: [{
+        title: '',
+        value: 1,
+        isSelected: false,
+        required: 0,
+        hasHelpingLabel: false,
+        helpingLabel: "",
+        isFailed: false,
+        score: question[this.colMap?.score] ?? 1,
+        color: "#000000"
+      }],
+      hasDate: true,
+      hasTime: false,
+      dateFormat: "DD/MM/YYYY",
+      timeFormat: 24,
+      date: {
+        title: question[this.colMap?.placeholder] ?? 'Select Date',
+        value: ""
+      },
+      time: {
+        title: question[this.colMap?.placeholder] ?? 'Select Time',
+        value: ""
+      },
+    };
+  }
+  generateFileUpload(question: any, index: any) {
+
+    return {
+      type: 'file-upload', name: `Question_${index}`, page: 1,
+      hasValidation: false, validationType: '', isRequired: question[this.colMap?.required] === 'Yes' ? true : false, hasCharacterLength: false, minCharacterLength: 0,
+      maxCharacterLength: 100, title: question[this.colMap?.title]?.toString()?.trim() ?? '',
+      hasDescription: question[this.colMap?.description]?.toString()?.trim()?.length ? true : false, description: question[this.colMap?.description]?.toString()?.trim() ?? '',
+      hasComments: question[this.colMap?.usercomment]?.toString()?.trim()?.length ? true : false, comments: question[this.colMap?.comment]?.toString()?.trim(),
+      randomize: question[this.colMap?.randomize] === 'Yes' ? true : false, hasOther: question[this.colMap?.other] === 'Yes' ? true : false, otherValue: 'Other', alignment: question[this.colMap?.alignment] === 'Yes' ? true : false, reverse: false,
+      isRespondentAttachment: question[this.colMap?.userattachment] === 'Yes' ? true : false, userAttachedFiles: [],
+      visibilityLogic: [], isRespondentComment: question[this.colMap?.usercomment] === 'Yes' ? true : false,
+      otherConfig: { color: "#000000", isFailed: false, score: question[this.colMap?.score] ?? 1 },
+      choices: [{
+        title: '',
+        value: 1,
+        isSelected: false,
+        required: 0,
+        hasHelpingLabel: false,
+        helpingLabel: "",
+        isFailed: false,
+        score: question[this.colMap?.score] ?? 1,
+        color: "#000000"
+      }],
+      allowedFileTypes: {
+        pdf: true,
+        doc: true,
+        png: true,
+        jpg: true,
+        gif: true
+      },
+    };
+  }
+
+  generateChoices(question: any) {
+    const options = [question[this.colMap?.opt1], question[this.colMap?.opt2], question[this.colMap?.opt3], question[this.colMap?.opt4], question[this.colMap?.opt5], question[this.colMap?.opt6]].filter((ele: any) => ele);
+    options.forEach((ele:any) =>{
+      if(ele){
+        ele.toString()?.trim();
+      }
+    })
+    if (options?.length === 0) {
+      options.push('')
+    }
+    const optionMap: any = {
+      'Option 1': 3,
+      'Option 2': 4,
+      'Option 3': 5,
+      'Option 4': 6,
+      'Option 5': 7,
+      'Option 6': 8,
+    }
+    options.forEach((choice: any, index: any) => {
+      options[index] = {
+        title: (choice && typeof (choice) == 'string')? choice : choice.toString() ?? '',
+        value: 1,
+        isSelected: false,
+        required: 0,
+        hasHelpingLabel: false,
+        helpingLabel: "",
+        isFailed: (choice?.toString()?.trim() == question[optionMap[question[this.colMap?.failed]]]) ? true : false,
+        score: question[this.colMap?.score] ?? 1,
+        color: "#000000"
+      }
+    })
+
+    return options;
+  }
+
+  public settings: any = {
+    assessmentMode: false,
+    defaultScore: 1,
+    negativeScoreCriteria: 'FAILED',
+    negativeScore: 0,
+    weightageEnabled: false,
+    settingsEnabled: false
+  }
+
+  checkFormat(assessmentData: any): boolean {
+    const orgInTemplate =  this.categoryData[0][5];
+   console.log("temp",orgInTemplate,this.organizationId)
+    //Completly blank excel sheet
+    if (assessmentData.length === 0 || orgInTemplate !== this.organizationId) {
+      this.errorMessage = 'You have uploaded the wrong template. Please download the template again to proceed.';
+      this.isWrongFormat = true;
+      return true;
+    }
+
+
+    //Invalid Tempalte
+    try {
+      if (assessmentData[2][0] !== "Assessment Name\*"
+        || assessmentData[3][0] !== "Description"
+        || assessmentData[4][0] !== "Assessment Category\*"
+        || assessmentData[5][0] !== "Question Type\*"
+      ) {
+        this.errorMessage = 'You have uploaded the wrong template. Please download the template again to proceed.';
+        this.isWrongFormat = true;
+        return true;
+      }
+    } catch {
+      this.errorMessage = 'You have uploaded the wrong template. Please download the template again to proceed.';
+      this.isWrongFormat = true;
+      return true;
+    }
+
+    //Check Assessment name
+    try{
+      if (!assessmentData[2][1] || assessmentData[2][1] === "" || assessmentData[2][1] === undefined) {
+        this.errorMessage = 'Enter a name for this Assessment.';
+        this.isWrongFormat = true;
+        return true;
+      }
+    }catch{
+      this.errorMessage = 'Enter a name for this Assessment.';
+      this.isWrongFormat = true;
+      return true;
+    }
+
+    //category not selected
+   try{
+    if (!assessmentData[4][1] || assessmentData[4][1] === "" || assessmentData[4][1] === undefined) {
+      this.errorMessage = 'Select the Assessment Category.';
+      this.isWrongFormat = true;
+      return true;
+    }
+   }catch{
+    this.errorMessage = 'Select the Assessment Category.';
+    this.isWrongFormat = true;
+    return true;
+   }
+
+    //Does not contains any questions
+    try{
+      if (assessmentData.slice(7)?.length === 0) {
+        this.errorMessage = 'You have uploaded a blank template. Please add questions to this template and upload it again.';
+        this.isWrongFormat = true;
+        return true;
+      }
+    }catch{
+      this.errorMessage = 'You have uploaded a blank template. Please add questions to this template and upload it again.';
+      this.isWrongFormat = true;
+      return true;
+    }
+
+
+
+    //handle type of question and options count
+    for (let i = 7; i <= assessmentData.length - 1; i++) {
+      if (assessmentData[i][0] !== 'Multiple Choice' &&
+        assessmentData[i][0] !== 'Checkbox' &&
+        assessmentData[i][0] !== 'Dropdown' &&
+        assessmentData[i][0] !== 'Single Textbox' &&
+        assessmentData[i][0] !== 'Date & Time' &&
+        assessmentData[i][0] !== 'File Upload'
+      ) {
+        this.errorMessage = 'You have uploaded the wrong template. Please download the template again to proceed.';
+        this.isWrongFormat = true;
+        return true;
+      }
+      // if (assessmentData[i][1] === '') {
+      //   this.errorMessage = 'You have uploaded the wrong template. Please download the template again to proceed.';
+      //   this.isWrongFormat = true;
+      //   return true;
+      // }
+    }
+
+
+    this.errorMessage = '';
+    return false;
+  }
+
+  initializeEmptyResponseSegment() {
+    return {
+      title: '',
+      description: '',
+      maxScore: 10,
+      segments: []
+    }
+  }
+
+  postAssessment(data: any) {
+    this.isShowLoader = true;
+    this.assessmentService.createAssessment(this.convertedData.metadata).subscribe({
+      next: (response: any) => {
+        this.postAssessmentDetails(response._id, data.mode, data.assessmentDetails);
+      },
+      error: (err: any) => {
+        this.isShowLoader = false;
+      }
+    })
+  }
+
+  postAssessmentDetails(id: any, mode: any, assessmentDetails: any) {
+
+    this.isUploaded = false;
+    this.auth.previewPanel.next(false);
+    console.log('this.isUploaded', this.isUploaded)
+    const payload = {
+      question: assessmentDetails,
+      action: "questions_save",
+      state: mode
+    }
+
+    this.assessmentService.saveAssessmentDetails(id, payload).subscribe({
+      next: (response: any) => {
+        this.assessmentData = {};
+        this.isShowLoader = false;
+        this.showSmiley = true;
+      },
+      error: (err: any) => {
+        this.isShowLoader = false;
+      }
+    })
+  }
+
+  smileyAction(id: any) {
+    console.log(id)
+    if (id === smileyActions.VIEW_ASSESSMENTS) {
+      this.disconnectRefresh.emit(false);
+      // TODO: Navigate to '/manage-assessment'
+      let url: string;
+      if (window.location.host.startsWith('localhost')) {
+        url = 'http://' + window.location.host + '/manage-assessment';
+      } else {
+        url = 'https://' + window.location.host + '/assessment/manage-assessment';
+      }
+      console.log(url);
+      window.location.href = url;
+    }
+    else {
+      this.showSmiley = false;
+      this.auth.previewPanel.next(false);
+      const closeBtn = document.getElementById("close-workflow-engine-btn");
+      if (closeBtn) closeBtn.style.display = "block";
+
+    }
+  }
+
+}