import { Component, OnInit, Input, Inject } from '@angular/core';
import { FormFieldsService } from './form-fields.service';
import { MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { Observable } from 'rxjs';
import { MatSnackBar } from '@angular/material/snack-bar';


export interface DialogData {
  animal: string;
  name: string;
}

@Component({
  selector: 'app-form-fields',
  templateUrl: './form-fields.component.html',
  styleUrls: ['./form-fields.component.css']
})
export class FormFieldsComponent implements OnInit {

  @Input("reportId") reportId1 : string;

  formFieldsListObj : any[];
  postMoveUpwrdObj : {};
  postDownwardObj : {};
  orderSeqOfDown : number;
  orderSeqOfUp : number;
  showDialog : boolean;
  closable : boolean;
  sqlAsDefaultValue : Boolean;
  showDefaultSQLOption : boolean;
  verifyFieldValueAs : number;
  predefinedValueList : any[];
  predefinedValue : string;
  tabId : string;
  tabName : string;
  validationType : string;
  visible : string;
  orderSeq : number;
  message : any;
  groupFormField : boolean;
  fieldType : string;
  fieldSQL : string;
  fieldName : string;
  fieldId : string;
  fieldDefaultSQL : string;
  errorStackTrace : any;
  errorMessage : any;
  defaultValue : any;
  finalPOSTObj : any;
  mode : string;
  showSpinner : boolean;
  showDialog1 : boolean;
  queryObj : {};
  validateResponseString : string;
  showVerifySpinner : boolean;
  Groups : {}[] = [];
  isDefaultSql : boolean;
  


  constructor(private _formFieldsService : FormFieldsService, public dialog: MatDialog, private _snackBar: MatSnackBar) { 
    this.formFieldsListObj = new Array();
    this.postMoveUpwrdObj = new Object();
    this.postDownwardObj = new Object();
    this.showDialog = false;
    this.showDefaultSQLOption = false;
    this.closable = true;
    this.predefinedValueList = new Array();
    this.finalPOSTObj = new Object();
    this.showSpinner = false;
    this.showDialog1 = false;
    this.queryObj = {};
    this.showVerifySpinner = false;
    this.Groups = new Array();
    this.isDefaultSql = false;
  }

  ngOnInit() {
    this.showSpinner = true;
    this._formFieldsService.getListOfFormFields()
      .subscribe((responseFormFields) => {
        this.showSpinner = true;
        for (let m = 0; m < responseFormFields.length; m++) {
          responseFormFields[m]["orderSeq"] = m + 1;
          this.formFieldsListObj.push(responseFormFields[m]);
        }
        this.showSpinner = false;
        this._formFieldsService.getFormFieldGroupsData(this.reportId1)
          .subscribe((responseGroupsData) => {
            this.showSpinner = true;
            this.Groups = JSON.parse(responseGroupsData["formFieldGroupsJSON"]);
            this.showSpinner = false;
          });     
    });
  }
  

  isLast( n : number)
  {
    if(n == this.formFieldsListObj.length-1)
    {
      return true;
    }
    else
    {
      return false;
    }
  }

  isFirst( n : number)
  {
    if(n == 0)
    {
      return true;
    }
    else
    {
      return false;
    }
  }


  moveUpward( n : number)
  {
    this.showSpinner = true;
    
    this._formFieldsService.getFormFieldData(this.formFieldsListObj[n]["id"])
    .subscribe((responseGetFormFieldn) => {
        this.postMoveUpwrdObj = responseGetFormFieldn;

              this._formFieldsService.getFormFieldData(this.formFieldsListObj[n-1]["id"])
              .subscribe((responseGetFormFieldnmin1) => {
                  this.postDownwardObj = responseGetFormFieldnmin1;

                  this.orderSeqOfDown = this.postMoveUpwrdObj["orderSeq"];
                  this.orderSeqOfUp = this.postDownwardObj["orderSeq"];
            
                  this.postMoveUpwrdObj["orderSeq"] = this.orderSeqOfUp;
                  this.postDownwardObj["orderSeq"] = this.orderSeqOfDown;

                  console.log(this.postDownwardObj);
                  console.log(this.postMoveUpwrdObj);
                  this.postMoveUpwrdObj["lastUpdatedFieldId"] = this.postDownwardObj["fieldId"];
                  this.postDownwardObj["lastUpdatedFieldId"] = this.postMoveUpwrdObj["fieldId"];
                  
                  this._formFieldsService.postFormFieldData(this.postDownwardObj, this.reportId1)
                  .subscribe((responsePostn) => {
                    if(responsePostn["message"])
                    {
                      this._formFieldsService.postFormFieldData(this.postMoveUpwrdObj, this.reportId1)
                      .subscribe((responsePostnmin1) => {
                      if(responsePostnmin1["message"])
                      {
                        
                      this.formFieldsListObj = [];
                      this._formFieldsService.getListOfFormFields()
                      .subscribe((finalListResponse) => {
                        for(let k=0; k<finalListResponse.length; k++)
                        {
                        //  this.formFieldsListObj.push(finalListResponse[k]);
                            for(let m=0; m<finalListResponse.length; m++)
                            {
                            if(finalListResponse[m]["orderSeq"] == k+1)
                            {
                                this.formFieldsListObj.push(finalListResponse[m]);
                            } 
                          }
                          }
                          this.showSpinner = false;
                      });
                      }
                    });
                    }
                    });

              });
            });

 
     

  }

  moveDownward( n : number)
  {
    this.showSpinner = true;
    
    this._formFieldsService.getFormFieldData(this.formFieldsListObj[n]["id"])
    .subscribe((responseGetFormFieldn) => {
        this.postMoveUpwrdObj = responseGetFormFieldn;

              this._formFieldsService.getFormFieldData(this.formFieldsListObj[n+1]["id"])
              .subscribe((responseGetFormFieldnmin1) => {
                  this.postDownwardObj = responseGetFormFieldnmin1;

                  this.orderSeqOfDown = this.postMoveUpwrdObj["orderSeq"];
                  this.orderSeqOfUp = this.postDownwardObj["orderSeq"];
            
                  this.postMoveUpwrdObj["orderSeq"] = this.orderSeqOfUp;
                  this.postDownwardObj["orderSeq"] = this.orderSeqOfDown;

                  console.log(this.postDownwardObj);
                  console.log(this.postMoveUpwrdObj);

                  this.postMoveUpwrdObj["lastUpdatedFieldId"] = this.postDownwardObj["fieldId"];
                  this.postDownwardObj["lastUpdatedFieldId"] = this.postMoveUpwrdObj["fieldId"];
                  
                  this._formFieldsService.postFormFieldData(this.postDownwardObj, this.reportId1)
                  .subscribe((responsePostn) => {
                    if(responsePostn["message"])
                    {
                      this._formFieldsService.postFormFieldData(this.postMoveUpwrdObj, this.reportId1)
                      .subscribe((responsePostnmin1) => {
                      if(responsePostnmin1["message"])
                      {
                        
                      this.formFieldsListObj = [];
                      this._formFieldsService.getListOfFormFields()
                      .subscribe((finalListResponse) => {
                        for(let k=0; k<finalListResponse.length; k++)
                        {
                        //  this.formFieldsListObj.push(finalListResponse[k]);
                            for(let m=0; m<finalListResponse.length; m++)
                            {
                            if(finalListResponse[m]["orderSeq"] == k+1)
                            {
                                this.formFieldsListObj.push(finalListResponse[m]);
                            } 
                          }
                          }
                          this.showSpinner = false;
                      });
                      }
                    });
                    }
                    
                    });

              });
            });

  }

  ngDoCheck()
  {
    if(this.sqlAsDefaultValue)
    {
      this.showDefaultSQLOption = true;
    }
    else
    {
      this.showDefaultSQLOption = false;
    }
    
  }

  setDisplayMode(displayMode : string)
  {
  }

  edit(id : string)
  {
      this._formFieldsService.getFormFieldData(id)
    .subscribe((responseFormFieldData) => {
      this.validationType = responseFormFieldData["validationType"];

      if(responseFormFieldData["visible"] === true)
      {
        this.visible = "YES";
      }
      else
      {
        this.visible = "NO";
      }

      this.orderSeq = responseFormFieldData["orderSeq"];
      this.message = responseFormFieldData["message"];
      this.groupFormField = responseFormFieldData["groupFormField"];
      this.fieldType = responseFormFieldData["fieldType"];
      this.fieldSQL = responseFormFieldData["fieldSQL"];
      this.fieldName = responseFormFieldData["fieldName"];
      this.fieldId = responseFormFieldData["fieldId"];
      this.fieldDefaultSQL = responseFormFieldData["fieldDefaultSQL"];
      this.errorStackTrace = responseFormFieldData["errorStackTrace"];
      this.errorMessage = responseFormFieldData["errorMessage"];
      this.defaultValue = responseFormFieldData["defaultValue"]	;
       if(this.fieldDefaultSQL != null || this.fieldDefaultSQL != "")	
          this.isDefaultSql = true;	
       else	
          this.isDefaultSql = false;	
       	
       if(this.defaultValue == null || this.defaultValue == "")	
          this.isDefaultSql = true;	
       else	
          this.isDefaultSql = false;  

       if ((this.fieldDefaultSQL == null || this.fieldDefaultSQL == "") && (this.defaultValue == null || this.defaultValue == "")) 
        this.isDefaultSql = false; 

      if(responseFormFieldData["predefinedValueList"] == null)
      {
        this.predefinedValueList = [];
      }
      else
      {
        this.predefinedValueList = responseFormFieldData["predefinedValueList"];
      }

      this.showDialog = true;
      this.closable = true;
      this.mode = "Edit";
    });
  
  }

  add()
  {
    this.showDialog = true;
    this.closable = true;
    this.validationType = "";
    this.visible = "YES";
      this.message = "";
      this.groupFormField = false;
      this.fieldType = "";
      this.fieldSQL = "";
      this.fieldName = "";
      this.fieldId = "";
      this.fieldDefaultSQL = "";
      this.errorStackTrace = "";
      this.errorMessage = "";
      this.isDefaultSql = false;
      this.predefinedValueList = [];
      this.defaultValue="";

      this.showDialog = true;
      this.closable = true;

      this.mode = "Add";
      
  }

  close() {
    this.showDialog = !this.showDialog;
    this.closable = false;

  }

  closeValidateModal()
  {
    this.showDialog1 = !this.showDialog1;
    this.showVerifySpinner = false;
  }

  addToList( attrib : string)
  {
    this.predefinedValueList.push(
      {
        "id" : attrib, 
        "name" : attrib,
        "selected" : false
      });
  }

  deleteFromList(attrib : string)
  {
    
    for(let k=0; k<this.predefinedValueList.length; k++)
    {
      if(this.predefinedValueList[k]["id"] == attrib)
      {
        this.predefinedValueList.splice(k, 1);
      }
    }
  }


  save()
  {
    this.showSpinner = true;
    this.showDialog = false;
      this.finalPOSTObj["validationType"] = this.validationType;

      if(this.visible == "YES")
      {
        this.finalPOSTObj["visible"] = true;
      }
      else
      {
        this.finalPOSTObj["visible"] = false;
      }

      this.finalPOSTObj["orderSeq"] = this.orderSeq;
      this.finalPOSTObj["message"] = this.message;
      this.finalPOSTObj["groupFormField"] = this.groupFormField;
      this.finalPOSTObj["fieldType"] = this.fieldType;
      this.finalPOSTObj["fieldSQL"] = this.fieldSQL;
      this.finalPOSTObj["fieldName"] = this.fieldName;
      this.finalPOSTObj["fieldId"] = this.fieldId;
      
      this.finalPOSTObj["errorStackTrace"] = this.errorStackTrace;
      this.finalPOSTObj["errorMessage"] = this.errorMessage;
       this.finalPOSTObj["lastUpdatedFieldId"] = this.fieldId;

      this.finalPOSTObj["fieldDefaultSQL"] = this.fieldDefaultSQL;	
    	
      this.finalPOSTObj["defaultValue"] = this.defaultValue;
    	
      if(this.fieldDefaultSQL != "" && this.fieldDefaultSQL != null)	
      {	
        this.finalPOSTObj["defaultValue"] = "";		
      }	

      this.finalPOSTObj["predefinedValueList"] = this.predefinedValueList;

      if(this.mode == "Edit")
      {
      this._formFieldsService.postFormFieldData(this.finalPOSTObj, this.reportId1)
      .subscribe((responsePost) => {
        if(responsePost["message"])
        {
          this._formFieldsService.getListOfFormFields()
          .subscribe((responseFormFields) => {
            this.formFieldsListObj = [];
            let m=0;
            while(responseFormFields[m])
            {
              this.formFieldsListObj.push(responseFormFields[m]);
              m++;
            }

           
          this.showSpinner = false;
          
          });
          
        }
      });
    }
    else
    {
      this._formFieldsService.addFormFieldData(this.finalPOSTObj, this.reportId1)
      .subscribe((responsePost) => {
        if(responsePost["message"])
        {
          this._formFieldsService.getListOfFormFields()
          .subscribe((responseFormFields) => {
            this.formFieldsListObj = [];
            let m=0;
            while(responseFormFields[m])
            {
              this.formFieldsListObj.push(responseFormFields[m]);
              m++;
            }

          this.showSpinner = false;
          
          });
        }
      });
    }
  }

  delete( id : string)
  {
    this.showSpinner = true;
    this._formFieldsService.deleteFormField(id)
    .subscribe((responseDeleted) => {
        if(responseDeleted["message"] == "Formfield  Deleted")
        {
          this._formFieldsService.getListOfFormFields()
          .subscribe((responseFormFields) => {
            this.formFieldsListObj = [];
            let m=0;
            while(responseFormFields[m])
            {
              this.formFieldsListObj.push(responseFormFields[m]);
              m++;
            }

            this.showSpinner = false;
            
          });
        }
    })
  }

  verify( SQLType : string)
  {
    this.showVerifySpinner = true;
    this.showDialog1 = true;
    if(SQLType == "Default")
    {
      this.queryObj = {
        query : this.fieldDefaultSQL
      };
      this._formFieldsService.verifySQL(this.queryObj)
      .subscribe((responseDefaultSQL) => {
        this.validateResponseString = responseDefaultSQL["data"]["elements"];
        this.showVerifySpinner = false;
      });
    }
    else
    {
      this.queryObj = {
        query : this.fieldSQL
      };
      this._formFieldsService.verifySQL(this.queryObj)
      .subscribe((responseSQL) => {
        this.validateResponseString = responseSQL["data"]["elements"];
        this.showVerifySpinner = false;
      });
    }
    
  }

  deleteFromGroup(formFieldId : String)
  {
    for(let k=0; k<this.Groups.length; k++)
    {
      let element = this.Groups[k];
      for(let l=0; l<element["formFieldList"].length; l++)
      {
        if(element["formFieldList"][l]["id"] == formFieldId)
        {
          this.Groups[k]["formFieldList"].splice(l, 1);
        }
      }
    }
  }

  deleteGroup(groupName : string)
  {
    for(let k=0; k<this.Groups.length; k++)
    {
      if(this.Groups[k]["name"] == groupName)
      {
        this.Groups.splice(k, 1);
      }
    }
  }

  createGroup()
  {
    this.openDialog();
  }
  
  openDialog(){
    const dialogRef = this.dialog.open(DialogOverviewExampleDialog, {
      width: '400px',
      height: '600px',
      data: this.formFieldsListObj
    });

    dialogRef.afterClosed().subscribe(result => {

      let groupAlreadyExists = false;
      if(this.Groups == null || this.Groups == undefined)
      {
        this.Groups = new Array();
      }
      for(let k=0; k<this.Groups.length; k++)
      {
        if(this.Groups[k]["name"] == result["name"])
        {
          groupAlreadyExists = true;
        }
      }
      

      if(!groupAlreadyExists)
      {
      let UpdatedResult = result;
      for(let i=0; i<result["formFieldList"].length; i++)
      {
        let formFieldId = result["formFieldList"][i];
        let j=0;
        while(this.formFieldsListObj[j])
        {
          if(this.formFieldsListObj[j]["id"] == formFieldId)
          {
            UpdatedResult["formFieldList"][i] = this.formFieldsListObj[j];
          }
          j++;
        }

      }
      if(this.Groups !== null || this.Groups!== undefined)
      {
        this.Groups.push(UpdatedResult);
      }
      else
      {
        this.Groups = new Array();
        this.Groups.push(UpdatedResult);
      }
      
      }
      else
      {
        this.openSnackBar("Group Already Exists.","Try using another name!");
      }
      
      
    });
  }

  openSnackBar(message: string, action: string) {
    this._snackBar.open(message, action, {
      duration: 5000,
    });
  }

  saveFormFieldGroups()
  {
    let formFieldGroupsPostObj = 
    {
      reportId : this.reportId1,
      formFieldGroupsJSON : JSON.stringify(this.Groups)
    };

    this._formFieldsService.postFormFieldGroupsData(formFieldGroupsPostObj)
    .subscribe((responsePost) => {
      this.openSnackBar("Successfully Saved!","");
    });
  }

}

@Component({
  selector: 'app-create-group',
  templateUrl: './create-group.component.html',
})
export class DialogOverviewExampleDialog {
  createGroupObj : any = {};
  constructor(
    public dialogRef: MatDialogRef<DialogOverviewExampleDialog>,
    @Inject(MAT_DIALOG_DATA) public data: DialogData) {
    }

  onNoClick() : void {
    this.dialogRef.close();
  }

}