<aura:component controller="AddDeleteController" >
    
    <aura:attribute name="store" type="string" default="default"/>
    <aura:attribute name="processForNewStore" type="boolean" default="false"/>
    
    <aura:attribute name="GoDisableButton" type="boolean" default="true"/>
    <aura:attribute name="PreDisableButton" type="boolean" default="true"/>
    <aura:attribute name="objectTableData2" type="list"  />
    <aura:attribute name="pageontopShow" type = "boolean" default = "false"/> 
    <aura:attribute name="objectTableData1" type="list" />
    <aura:attribute name="orderTableData1" type="list" />
    <aura:attribute name="orderTableData2" type="list"  />
    <aura:attribute name="orderProductTableData1" type="list" />
    <aura:attribute name="orderProductTableData2" type="list"  />
    <aura:attribute name="draftOrderTableData2" type="list"  />
    <aura:attribute name="draftOrderProductTableData2" type="list"  />
    <aura:attribute name="opportunityTableData1" type="list" />
    <aura:attribute name="opportunityTableData2" type="list"  />
    <aura:attribute name="opportunityProductTableData1" type="list" />
    <aura:attribute name="opportunityProductTableData2" type="list"  />
    <aura:attribute name="contactTableData1" type="list" />
    <aura:attribute name="contactTableData2" type="list"  />
    
    <aura:attribute name="ProductTableRequiredData1" type="list" />
    <aura:attribute name="productTableData2" type="list" />
    <aura:attribute name="productList" type="list"/>
    <aura:attribute name="productTableData1" type="list" />
    <aura:attribute name="VariantTableRequiredData1" type="list" />
    <aura:attribute name="variantTableData2" type="list" />
    <aura:attribute name="variantList" type="list"/>
    <aura:attribute name="variantTableData1" type="list" />
    <aura:attribute name="defaultFieldMappingForProduct" type="list"/>
    <aura:attribute name="defaultFieldMappingForVariant" type="list"/>
    
    <aura:attribute name="objectInstance" type="object" default="{}"/> 
    <aura:attribute name="myBool" type="Boolean" default="true"/>
    <aura:attribute name="DefaultAccount" type="Boolean" default="false"/>
    <aura:attribute name="opportunityStageList" type="list"  />
    <aura:attribute name="opportunityContactRolesList" type="list"  /> 
    <aura:attribute name="SyncAllContactInAccount" type="boolean" />
    <aura:attribute name="Accountexist" type="boolean" default="false"/>
    <aura:attribute name="OrderAccountexist" type="boolean" default="false"/>
    <aura:attribute name="DefaultAccountForContacts" type="Account" description="Use,for store SELECTED sObject Record"/>
    <aura:attribute name="DefaultAccountForOrders" type="Account" description="Use,for store SELECTED sObject Record"/>
    <aura:attribute name="DefaultAccountForContactslist" type="list" />
    <aura:attribute name="today" type="Integer" default=""/>
    <aura:attribute name="DefaultOpportunityStage" type="String" default=""/>
    <aura:attribute name="configObj" type="object"  />
    <aura:attribute name="DefaultCloseDate" type="date" default = "" />
    <aura:attribute name="listofDeletecustomSetttingRecord" type="Set" default="[]" />
    
    <aura:attribute name="flagForInit" type="Boolean" default="true"/>
    
    <aura:attribute name="flag" type="Boolean" default="true"/>
    <aura:attribute name="objectTableRequiredData1" type="list" />
    <aura:attribute name="contactTableRequiredData1" type="list" />
    <aura:attribute name="PersonAccountTableRequiredData1" type="list" />
    <aura:attribute name="OrderTableRequiredData1" type="list" />
    <aura:attribute name="OrderProductTableRequiredData1" type="list" />
    <aura:attribute name="DraftOrderTableRequiredData" type="list" />
    <aura:attribute name="DraftOrderProductTableRequiredData" type="list" />
    <aura:attribute name="OpportunityTableRequiredData1" type="list" />
    <aura:attribute name="OpportunityProductTableRequiredData1" type="list" />
    <aura:attribute name="DoInItComplete" type="Boolean" default="false"/>
    <aura:attribute name="listSize" type="Integer" default="1"/>
    <aura:registerEvent name="ParentSaveButtonEvt" type="c:ParentSaveButtonEvent"/>   
    <aura:registerEvent name="ParentPrevButtonEvt" type="c:ParentPrevButtonEvent"/>
    <aura:attribute name="isOpen" type="boolean" default="false"/>
    <!--Init handler which is call doInit js function on component Load-->  
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/> 
    
    <!--Event handler for Add and Delete Row Event which is fire from Child Component-->    
    <aura:handler name="DeleteRowEvt" event="c:DeleteRowEvt" action="{!c.removeDeletedRow}"/>
    <aura:handler name="AddRowEvt" event="c:AddNewRowEvt" action="{!c.addNewRow}"/>
    
    <!--Aura Attribute for store Contact Object List as Array-->    
    <aura:attribute name="accountList" type="list"/>
    <aura:attribute name="contactList" type="list"/> 
    <aura:attribute name="orderList" type="list"/>
    <aura:attribute name="orderProductList" type="list"/>
    <aura:attribute name="draftOrderList" type="list"/>
    <aura:attribute name="draftOrderProductList" type="list"/>
    <aura:attribute name="opportunityList" type="list"/>
    <aura:attribute name="opportunityProductList" type="list"/>
    
    <aura:attribute name="showCustomSetting" type="boolean" default="false"/>
    <aura:attribute name="defaultFieldMapping" type="boolean"/>
    
    <aura:attribute name="defaultFieldMappingForAccount" type="list"/>
    <aura:attribute name="defaultFieldMappingForContact" type="list"/>
    <aura:attribute name="defaultFieldMappingForOrder" type="list"/>
    <aura:attribute name="defaultFieldMappingForOrderProduct" type="list"/>
    <aura:attribute name="defaultFieldMappingForDraftOrder" type="list"/>
    <aura:attribute name="defaultFieldMappingForDraftOrderProduct" type="list"/>
    <aura:attribute name="defaultFieldMappingForOpportunity" type="list"/>
    <aura:attribute name="defaultFieldMappingForOpportunityProduct" type="list"/>
    <aura:attribute name= "closeddatefunction" type="String"/>
    <!--  <aura:handler event="aura:waiting" action="{!c.showSpinner}"/>
    <aura:handler event="aura:doneWaiting" action="{!c.hideSpinner}"/>  -->
    
    <!--aura:attribute name="Spinner" type="boolean" default="true"/-->
    
    <!--loading spinner start... style=Brand Medium (blue dots)-->
    <aura:if>
        <div class="centered">
            <img src="{!$Resource.PageLoadingGif}" style="width: 26%;margin-top: 16e;margin-left: 45em;" />
        </div>
    </aura:if>
    
    
    <!-- Loading spinner end-->  <div class="slds-p-horizontal_large">
    
    <aura:if isTrue="{!v.DoInItComplete}">
        <div class="slds-float_left slds-m-around_x-small">
            <img width="70" height="70" src="https://cdn.shopify.com/assets/images/logos/shopify-bag.png" /> &nbsp; &nbsp; <b>{!v.store}</b>
        </div>
        <center> 
            <br/>
            <!--  handleUploadAction   -->
            <!--button class="slds-button slds-button_success" onclick="{!c.goPrev}">Go to the previous page</button>   
        <button class="slds-button slds-button_success" onclick="{!c.handleUploadAction}">Save &amp; Go to the next step</button-->
            
            <lightning:button iconName="utility:back"
                              iconPosition="left"   
                              variant="success" label="Go to the previous page" title="Go to the previous page" disabled="{!v.PreDisableButton}" onclick="{!c.goPrev}"/>
            <lightning:button iconName="utility:forward"
                              iconPosition="right" 
                              variant="success" label="Save &amp; Go to the next step" title="Save &amp; Go to the next step" disabled="{!v.GoDisableButton}" onclick="{!c.handleUploadAction }"/>
            <br/>
            <p style="margin-top:1%"><sup><b style="color: red;">*</b></sup> Don't worry you can come back and edit this mapping later.</p>
            <br/>
        </center> 
        <aura:if isTrue="{!!v.configObj.HIC_ShopifySync__Person_Account__c}">
            <center>  
                <table class="slds-table slds-table_bordered slds-table_cell-buffer" >
                    <thead>
                        <tr>
                            <td  style="padding-left: 35px;color: #6b6d70;">
                                
                                <div class="tooltip" >
                                    <h1 class="slds-page-header__title"><lightning:icon style="margin-right: 10px;" iconName='utility:settings' />Customer Settings
                                        
                                    </h1>
                                    <!--span class="tooltiptext">Salesforce Account Setting</span-->
                                </div>
                            </td>
                        </tr>
                    </thead>
                    <tbody>
                        <tr class="{!v.configObj.HIC_ShopifySync__Default_Account__c ?
                                   'slds-text-title_caps On ' : 'slds-text-title_caps'}" >
                            
                            <td scope="col" > 
                                <div class="tooltip" >
                                    <lightning:input type="toggle" 
                                                     label=" Sync All Contact / Order in Single Account "
                                                     name="reimbursed"
                                                     class="slds-p-around--small"
                                                     value="{!v.configObj.HIC_ShopifySync__Default_Account__c}"
                                                     messageToggleActive=""
                                                     messageToggleInactive=""
                                                     checked ="{!v.configObj.HIC_ShopifySync__Default_Account__c}"
                                                     onchange="{!c.showCustomSettingAction}"
                                                     />
                                    <!--span class="tooltiptext" style="overflow-wrap: break-word;">
                                        <div  style="overflow-wrap: break-word;word-wrap: break-word !important;" >
                                            <p style="word-break: break-word;">Select Default Account from salesforce, After that all the other records contacts,orders and opportunity will related to it.</p>
                                        </div>

                                    </span-->
                                </div>
                                
                            </td>
                            <td></td>
                            
                        </tr>
                        <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Default_Account__c}">
                            <tr class="slds-text-title_caps">
                                
                                <td scope="col">
                                    <div class="slds-truncate" title="First Name">Select Account to sync all Contact/Order </div>
                                </td>  
                                <td scope="col">
                                    <aura:if isTrue="{!v.Accountexist}">
                                        <c:customLookup aura:id="childComp" selectedRecord="{!v.DefaultAccountForContacts}" />
                                    </aura:if>
                                    
                                </td>
                            </tr>
                        </aura:renderIf>
                    </tbody>
                </table>
            </center>
        </aura:if>
        <span> 
            <center>
                <div style = "margin-block-start: 10px;">
                    
                    <thead>
                        <tr class="slds-line-height_reset">
                            <th class="slds-text-title_caps" scope="col" >
                                <div class="slds-form-element">
                                    <label class="slds-checkbox_toggle slds-grid">
                                        <span class="slds-form-element__label slds-m-bottom_none"> <h1 style = "font-size: 1.625rem;"> Use Default Field Mapping  </h1></span>
                                        <!--<input type="checkbox" aura:id="checkboxDefault" name="checkbox-toggle-14" aria-describedby="checkbox-toggle-14" onchange="{!c.DefeaultfunctionChange}" value ="{!v.defaultFieldMapping}" />-->
                                        <ui:inputCheckbox aura:id="checkboxDefault" click="{!c.DefaultfunctionChange}" name="checkbox-toggle-14" value ="{!v.configObj.HIC_ShopifySync__Default_Field_Mapping__c}" />
                                        <span id="checkbox-toggle-14" class="slds-checkbox_faux_container" aria-live="assertive">
                                            <span class="slds-checkbox_faux" style = "margin-block-start: 7px;"> </span>
                                            <span class="slds-checkbox_on"></span>
                                            <span class="slds-checkbox_off"></span>
                                        </span>
                                    </label>
                                </div>
                                
                                
                            </th>
                        </tr>
                    </thead>
                </div>
            </center>
        </span>
        
        
        <!-- Manual Custom setting section -->
        <div class = "DisplayCustomSetting"  style = "{!if(v.configObj.HIC_ShopifySync__Default_Field_Mapping__c,'display:none;','display:block;')}" > 
            <table id="tableId" class="slds-table slds-table_bordered slds-table_cell-buffer">
                <aura:renderIf isTrue="{!!v.configObj.HIC_ShopifySync__Default_Account__c}"> 
                    <thead>
                        <tr><th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                            <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Person_Account__c}">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:person_account' />Person Account Field Mapping</h1>
                                </div>
                            </aura:renderIf>
                            <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Account_Contact__c}">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:account' />Account Field Mapping</h1>
                                </div>
                            </aura:renderIf>
                            </th></tr>
                    </thead>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col">
                                
                            </th>
                            <th scope="col" >
                                
                            </th>
                            <th scope="col" >
                                
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Person_Account__c}">
                            <aura:iteration items="{!v.PersonAccountTableRequiredData1}" var="item" indexVar="index">
                                <c:RequiredFieldMapping  defaultFieldMappingForAccount = "{!v.defaultFieldMappingForAccount}" objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.objectTableData2}" Objecttype= "Account"/> 
                            </aura:iteration>
                        </aura:renderIf>
                        <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Account_Contact__c}">
                            
                            <aura:iteration items="{!v.objectTableRequiredData1}" var="item" indexVar="index">
                                <c:RequiredFieldMapping  defaultFieldMappingForAccount = "{!v.defaultFieldMappingForAccount}" objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.objectTableData2}" Objecttype= "Account"/> 
                            </aura:iteration>
                        </aura:renderIf>
                    </tbody>
                    
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col" style="width: auto;">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col">
                                
                            </th>
                            <th scope="col">
                                
                            </th>
                            <th scope="col">
                                
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        
                        <aura:iteration items="{!v.accountList}" var="item" indexVar="index">
                            <!--<ui:outputText value="{!item.salesforcefields}"/>-->
                            <!--<ui:outputText value="{!item.selectedfields}"/> -->
                            <!--<ui:outputText value="{!item.salesforcefields}"/> -->
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.accountList}" configObj = "configObj" listSize = "{!v.accountList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.objectTableData1}" objectTableData2="{!v.objectTableData2}" Objecttype= "Account"   />
                        </aura:iteration>
                        
                    </tbody>
                </aura:renderIf>
                <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Account_Contact__c}">
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:contact' />Contact Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>
                    <thead>
                        
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <aura:iteration items="{!v.contactTableRequiredData1}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.contactTableData2}" Objecttype= "Account"/>
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        
                        <aura:iteration items="{!v.contactList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping  ObjectListPassed="{!v.contactList}" listSize = "{!v.contactList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.contactTableData1}" objectTableData2="{!v.contactTableData2}" Objecttype= "Contact"/> 
                        </aura:iteration>
                    </tbody>                                                       
                </aura:renderIf>
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Product_Sync__c}"> 
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:orders' />Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>                        
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>    
                    <tbody>
                        <aura:iteration items="{!v.ProductTableRequiredData1}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.productTableData2}" Objecttype= "Product2" /> 
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody> 
                        
                        <aura:iteration items="{!v.productList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.productList}" listSize = "{!v.productList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.productTableData1}" objectTableData2="{!v.productTableData2}" Objecttype= "Product2"  /> 
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product'/>Variant Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>    
                    <aura:if isTrue="{!v.VariantTableRequiredData1}"> 
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead> 
                    <tbody>
                        <aura:iteration items="{!v.VariantTableRequiredData1}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.variantTableData2}" Objecttype= "HIC_ShopifySync__Variant__c" /> 
                        </aura:iteration>
                    </tbody>
                    </aura:if>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>  
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div> 
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody>
                        <aura:iteration items="{!v.variantList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.variantList}" listSize = "{!v.variantList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.variantTableData1}" objectTableData2="{!v.variantTableData2}" Objecttype= "HIC_ShopifySync__Variant__c" /> 
                        </aura:iteration>
                    </tbody>
                </aura:if>  
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Order__c}"> 
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:orders' />Order Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>                        
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>    
                    <tbody>
                        <aura:iteration items="{!v.OrderTableRequiredData1}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.orderTableData2}" Objecttype= "Order"  /> 
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody> 
                        
                        <aura:iteration items="{!v.orderList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.orderList}" listSize = "{!v.orderList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.orderTableData1}" objectTableData2="{!v.orderTableData2}" Objecttype= "Order"  /> 
                        </aura:iteration>
                    </tbody>  
                    
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product'/>Order Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>   
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead> 
                    <tbody>
                        <aura:iteration items="{!v.OrderProductTableRequiredData1}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.orderProductTableData2}" Objecttype= "OrderItem" /> 
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>  
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div> 
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody>
                        <aura:iteration items="{!v.orderProductList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.orderProductList}" listSize = "{!v.orderProductList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.orderProductTableData1}" objectTableData2="{!v.orderProductTableData2}" Objecttype= "OrderItem" /> 
                        </aura:iteration>
                    </tbody>
                </aura:if>
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Enable_Draft_Order__c}">
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:orders' />Draft Order Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>                        
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>    
                    <tbody>
                        <aura:iteration items="{!v.DraftOrderTableRequiredData}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.draftOrderTableData2}" Objecttype= "DraftOrder"  /> 
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody> 
                        
                        <aura:iteration items="{!v.draftOrderList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.draftOrderList}" listSize = "{!v.draftOrderList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.orderTableData1}" objectTableData2="{!v.draftOrderTableData2}" Objecttype= "DraftOrder"  /> 
                        </aura:iteration>
                    </tbody>  
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product'/>Draft Order Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>   
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead> 
                    <tbody>
                        <aura:iteration items="{!v.DraftOrderProductTableRequiredData}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.draftOrderProductTableData2}" Objecttype= "DraftOrderItem" /> 
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>  
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div> 
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody>
                        <aura:iteration items="{!v.draftOrderProductList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.draftOrderProductList}" listSize = "{!v.draftOrderProductList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.orderProductTableData1}" objectTableData2="{!v.draftOrderProductTableData2}" Objecttype= "DraftOrderItem" /> 
                        </aura:iteration>
                    </tbody>
                </aura:if>
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Opportunity__c}">
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:opportunity' />Opportunity Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>  
                    <tbody>
                        <aura:iteration items="{!v.OpportunityTableRequiredData1}" var="item" indexVar="index">
							<aura:if isTrue="{!(!v.configObj.HIC_ShopifySync__Specify_Close_Date__c || item.salesforcefields !='CloseDate')}">
                                <c:RequiredFieldMapping aura:id ="OpportunityReqCmpID" objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.opportunityTableData2}" Objecttype= "Opportunity" /> 
                            </aura:if> 
                        </aura:iteration>
                    </tbody>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>  
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div> 
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody>
                        <aura:iteration items="{!v.opportunityList}" var="item" indexVar="index"> 
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.opportunityList}" listSize = "{!v.opportunityList.length}" Spinner="{!v.Spinner}" objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.opportunityTableData1}" objectTableData2="{!v.opportunityTableData2}" Objecttype= "Opportunity" /> 
                        </aura:iteration>
                    </tbody>
                </aura:if>
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Opportunity_Line_Item__c}">
                    <thead>
                        <tr>
                            <th colspan = "6" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background:#abadb0">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product' />Opportunity Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>    
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Required Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>  
                    <tbody>
                        <aura:iteration items="{!v.OpportunityProductTableRequiredData1}" var="item" indexVar="index">
                            <c:RequiredFieldMapping objectInstance="{!item}" rowIndex="{!index}" objectTableData2="{!v.opportunityProductTableData2}" Objecttype= "OpportunityLineItem" /> 
                        </aura:iteration>
                    </tbody>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">Optional Fields</div> 
                            </th>
                        </tr>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>  
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div> 
                            </th>
                            <th scope="col" colspan= "3">
                                
                            </th>
                        </tr>
                    </thead>   
                    <tbody>
                        <aura:iteration items="{!v.opportunityProductList}" var="item" indexVar="index">
                            <c:ConfiguarationFieldMapping ObjectListPassed="{!v.opportunityProductList}" listSize = "{!v.opportunityProductList.length}" Spinner="{!v.Spinner}"   objectInstance="{!item}" rowIndex="{!index}" table2Data="{!v.opportunityProductTableData1}" objectTableData2="{!v.opportunityProductTableData2}" Objecttype= "OpportunityLineItem" /> 
                        </aura:iteration>
                    </tbody>  
                </aura:if>
            </table>
            <br/>
        </div>
        
        <!-- Default Custom setting section -->
        <div class = "DefaultCustomSetting"  style = "{!if(v.configObj.HIC_ShopifySync__Default_Field_Mapping__c, 'display:block;','display:none;')}" >  
            <table id="tableId" class="slds-table slds-table_bordered slds-table_cell-buffer">
                <aura:renderIf isTrue="{!!v.configObj.HIC_ShopifySync__Default_Account__c}"> 
                    <thead>
                        <tr><th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                            <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Person_Account__c}">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:person_account' />Person Account Field Mapping</h1>
                                </div>
                            </aura:renderIf>
                            <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Account_Contact__c}">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles" ><lightning:icon style="margin-right: 10px;" iconName='standard:account' />Account Field Mapping</h1>
                                </div>
                            </aura:renderIf>
                            </th></tr>
                    </thead>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForAccount}" var="item" indexVar="index">
                            
                            <tr id="trId">
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
								<td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody>
                </aura:renderIf> 
                <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Account_Contact__c}">
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"> <lightning:icon style="margin-right: 10px;" iconName='standard:contact' />Contact Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>    
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForContact}" var="item" indexVar="index">
                            
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
								<td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                            
                        </aura:iteration>
                        
                    </tbody>                                                   
                </aura:renderIf>
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Product_Sync__c}"> 
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:products' />Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForProduct}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td> 
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody>     
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product' />Variant Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead> 
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>     
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForVariant}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody> 
                </aura:if>
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Order__c}"> 
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:orders' />Order Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForOrder}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody>     
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product' />Order Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead> 
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>     
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForOrderProduct}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody> 
                </aura:if>
                
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Enable_Draft_Order__c}">
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:orders' />Draft Order Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>  
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForDraftOrder}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody>     
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product' />Draft Order Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead> 
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>     
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForDraftOrderProduct}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody> 
                </aura:if>
                
                <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Opportunity__c}">
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:opportunity' />Opportunity Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>   
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForOpportunity}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody>
                    <aura:if isTrue="{!v.configObj.HIC_ShopifySync__Opportunity_Line_Item__c}">
                    <thead>
                        <tr>
                            <th colspan = "4" style="padding-left: 0px; padding-right: 0px;">
                                <div class="slds-page-header" style = "background: #6b6d70;color: white;">
                                    <h1 class="slds-page-header__title iconstyles"><lightning:icon style="margin-right: 10px;" iconName='standard:product' />Opportunity Product Field Mapping</h1>
                                </div>
                            </th>
                        </tr>
                    </thead>
                    <thead>
                        <tr class="slds-text-title_caps">
                            <th scope="col">
                                <div class="slds-truncate">S.No</div> 
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="First Name">Salesforce</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate">Default</div>
                            </th>
                            <th scope="col">
                                <div class="slds-truncate" title="Last Name">Shopify</div>
                            </th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <aura:iteration items="{!v.defaultFieldMappingForOpportunityProduct}" var="item" indexVar="index">
                            <tr>
                                <td>{!index + 1}</td>
                                <td>{!item.HIC_ShopifySync__SF_Field__c}</td>
                                <td><ui:outputCheckbox aura:id="output" value="{!item.HIC_ShopifySync__Default_Value__c}"/></td>
                                <td>{!item.HIC_ShopifySync__Shopify_Fields__c}</td>
                            </tr>
                        </aura:iteration>
                    </tbody>
                    </aura:if>
                </aura:if>
            </table>
            <br/>
        </div>
        <!--/aura:if--> 
        <!--Iterate the child Component for display Table rows 
               with pass the List Item Index for track the Every child Component 
               and pass each List OrderItem Instance -->    
        <!-- <table class="slds-table slds-table_bordered slds-table_cell-buffer" >
        <thead>
            <tr>
                <td>
                    <h1 class="slds-page-header__title">Order Settings</h1>
                </td>
            </tr>
        </thead>
        <tbody>
            <tr class="slds-text-title_caps">
                
                <td scope="col">
                    <div class="slds-truncate" title="First Name">Default Order Account</div>
                </td>  
                <td scope="col">

                    <aura:if isTrue="{!v.OrderAccountexist}">
                           <c:customLookup selectedRecord = "{!v.DefaultAccountForOrders}"/>
                    </aura:if>

                    
                </td>
            </tr>
   
       </tbody>
    </table> -->
        <aura:renderIf isTrue="{!and(!v.configObj.HIC_ShopifySync__Default_Field_Mapping__c,v.configObj.HIC_ShopifySync__Opportunity__c)}">    <!--table aura:id="maintable" class="datepicker__month datepicker-table datepicker-table" role="grid" aria-labelledby="month"-->
            <table  class="slds-table slds-table_bordered slds-table_cell-buffer">
                
                <thead>
                    <tr style= "border-bottom: outset thin;border-color: #ffffff;">
                        <td  style= "padding-left: 24px;padding-bottom: 12px;color: #6b6d70;" colspan = "2">
                            <h1 class="slds-page-header__title "><lightning:icon style="margin-right: 10px;" iconName='utility:settings' />Opportunity Settings</h1>
                        </td> 
                    </tr>
                </thead>
                <tbody>
                    
                    <tr class="{!v.configObj.HIC_ShopifySync__Specify_Close_Date__c ?
                               'slds-text-title_caps On ' : 'slds-text-title_caps'}" >
                        <td scope="col" > 
                            <lightning:input type="toggle" 
                                             label="Give Default Close Date"
                                             name="reimbursed"
                                             class="slds-p-around--small"
                                             value="{!v.configObj.HIC_ShopifySync__Specify_Close_Date__c}"
                                             messageToggleActive=""
                                             messageToggleInactive=""
                                             checked ="{!v.configObj.HIC_ShopifySync__Specify_Close_Date__c}"
                                             onchange=""
                                             />
                        </td>
                        <td></td>
                        
                    </tr>
                    <aura:renderIf isTrue="{!v.configObj.HIC_ShopifySync__Specify_Close_Date__c}">
                        <tr class="slds-text-title_caps">
                            
                            <td scope="col" style= "padding-left: 0px;">
                                <div class="slds-truncate"  style=" float: left;margin-left: 54px;" title="First Name">Close Opportunity in how many days after creating </div>
                            </td>  
                            <td scope="col" style = "">
                                <lightning:input  aura:id = "OppClosedate" type="number" placeholder="Days" name="number" min="0" required="true" value="{!v.today}" />
                                <!--  <div class="slds-truncate" title="First Name">
                                                    <ui:inputDate aura:id="expdate" label= "" class="slds-select" value="2019-6-26" displayDatePicker="true" required="true"/>
                                             
                                                </div>
                                                 <div style = "max-width: 47rem !important;">
                                                       <lightning:input messageWhenPatternMismatch = "use format MMM D, YYYY."  messageWhenTypeMismatch = "use format MMM D, YYYY." messageWhenBadInput ="use format MMM D, YYYY." aura:id="expdate" type="date" name="input2" required="true"    value="{!v.today}" />
                                                </div>--> 
                            </td>
                        </tr>
                    </aura:renderIf>
                    
                    
                    
                    <tr class="slds-text-title_caps">
                        
                        <td scope="col" style= "padding-left: 0px;">
                            <div class="slds-truncate" title="First Name" style=" float: left;margin-left: 36px;" >Default Stage</div>
                            
                        </td>  
                        <td scope="col"> 
                            
                            <lightning:select aura:id="a_opt" value="{!v.DefaultOpportunityStage}" required="true"> 
                                <option value="None">None</option>
                                <aura:iteration items="{!v.opportunityStageList}" var="stageNames" >
                                    <option text="{!stageNames}" value="{!stageNames}" selected="{!stageNames==v.DefaultOpportunityStage}" ></option>
                                </aura:iteration>
                            </lightning:select> 
                            
                        </td>
                    </tr>
                </tbody>
            </table>
        </aura:renderIf>    
        
        <center> 
            <br/>
            <br/>
            <!--  handleUploadAction   -->
            <lightning:button iconName="utility:back"
                              iconPosition="left"
                              variant="success" label="Go to the previous page" title="Go to the previous page" disabled="{!v.PreDisableButton}" onclick="{!c.goPrev}"/>
            <lightning:button iconName="utility:forward"
                              iconPosition="right"
                              variant="success" label="Save &amp; Go to the next step" title="Save &amp; Go to the next step" disabled="{!v.GoDisableButton}" onclick="{!c.handleUploadAction }"/>
            <br/>
            <p style="margin-top:1%"><sup><b style="color: red;">*</b></sup> Don't worry you can change the steps later {!v.MainSpinner}.</p>
            
            <br/>
            <aura:if isTrue="{!v.DoInItComplete}">
                <aura:if isTrue ="{!v.pageontopShow}">
                    <button type="button" id= "myBtn"  aura:id="nextButtonWSP" style ="float:left;background: red;" onclick="{!c.top}" oncomplete="scrollTo('custom', 0, 0);;" ><lightning:icon iconName='utility:jump_to_top' /></button>
                </aura:if>
            </aura:if>
        </center>    
        
    </aura:if>
    
    
    <!--loading spinner start... style=Brand Medium (blue dots)-->
    <!-- Loading spinner end-->  
    
    <!--Use "slds-m-around_xx-large" class to add standard X-Large padding to the component--> 
    
    <div class="slds-m-around_xx-large">
        
        <!--Use aura:renderIf tag to display Model Box, on the bese of conditions. [isOpen boolean attribute] -->   
        <aura:renderIf isTrue="{!v.isOpen}">            
            
            <!--###### MODAL BOX Start######--> 
            <section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open">
                <center>
                    <div class="slds-modal__container">
                        <div class="slds-modal__content slds-p-around_medium" id="modal-content-id-1">
                            <lightning:buttonIcon iconName="utility:close"
                                                  onclick="{! c.closeModel }"
                                                  alternativeText="close"
                                                  variant="bare-inverse"
                                                  class="slds-modal__close"/>
                            <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">Required Field Missing</h2>
                            <p><b>Please Fill All Required Fields.
                                </b>
                            </p><br/>
                            <lightning:button variant="neutral" 
                                              label="Ok"
                                              title="OK"
                                              onclick="{! c.closeModel }"/>
                        </div>
                        <br/><br/>
                    </div>
                </center>
            </section>
            
            <div class="slds-backdrop slds-backdrop_open"></div>
            <!--###### MODAL BOX Part END Here ######-->
        </aura:renderIf>
    </div>
    </div>
    
    
    
</aura:component>