<div id="vat-account-mapping">
    <div class="nav-wrapper">
        <div class="nav-header" translate="AccountMappingTitle"></div><div class="nav-notmapped-count" ng-if="notMappedCount>0">{{'NotMappedEnterpriseAccountCountTips' | translate}}<span>{{notMappedCount}}</span></div>
        <div class="pull-right operation-wrapper">
            <span ng-click="showOperateLogPop()"><i class="fa fa-file-excel-o" aria-hidden="true"></i>{{'Remarks' | translate}}</span>
            <span ng-click="exportData()"><i class="fa fa-download" aria-hidden="true"></i> <span translate="ExportBtn"></span></span>
        </div>
     </div>
    <div class="content-container">
        <div class="subject-corresponding-container">                                                                         
            <div class="auto-mapping-div">            
                <div class="btn-wrapper">
                    <button class="btn btn-vat-primary" translate="SubmitAccountMap" ng-show="!isSubmitted" ng-click="submitAccountMap()"></button>
                    <button class="btn btn-vat-primary" translate="UndoAccountMap" ng-show="isSubmitted" ng-click="undoAccountMap()"></button>
                </div>

                <!-- 其他按钮 -->
                <div class="btn-wrapper" ng-show="hasImportPermission && !isSubmitted">
                    <button class="btn btn-vat-primary" translate="AutoMapping" ng-click="autoMap()"></button>|<button class="btn btn-vat-primary" translate="ClearMapping" ng-click="ClearMap()"></button>
                </div>
                <div class="btn-wrapper" style="background-color: #A32020;" ng-show="hasImportPermission && !isSubmitted && (importTypeId === 1 || importTypeId === 2)">
                    <button ng-show="importTypeId === 1" class="btn btn-vat-important" translate="ManualReclassification" ng-click="manualReclassificate()"></button>
                    <span ng-show="importTypeId === 1 && isImportAuditAdjust">|</span>
                    <button ng-show="importTypeId === 2 || (importTypeId === 1 && isImportAuditAdjust)" class="btn btn-vat-important" translate="VoucherReclassification" ng-click="voucherReclassificate()"></button>
                </div>
                <button class="btn btn-vat-third" ng-click="getStdRemapResult()" translate="StdAccountMappingResult"></button>                                       
                <div class="account-filter">
                    <span> {{'FilterMapStatus'| translate}}:&nbsp;&nbsp;{{filterConditionDesc}}&nbsp;</span>
                    <i class="fa fa-filter" aria-hidden="true" ng-click="showFilter()"></i>
                    <div class="filter-select" tabindex="-1" style="display:none">
                        <div>
                            {{'FilterMapStatus'| translate}}
                        </div>
                        <ul ng-repeat=" x in accountFilterList">
                            <li>
                                <input type="radio" checklist-model="filter.selected" checklist-value="x" ng-click="stateChanged($event,x)" ng-checked="isSelected(x.key)"> {{x.value}}
                            </li>
                        </ul>
                    </div>
                </div>
                <!-- 其他按钮 -->              
            </div>
            
            <div class="left-container" id="left-container" style="float:left;">
                <!-- 企业科目列表 -->
                <div class="tab-content">
                    <div id="enterprizeAccount" class="tab-pane active">
                        <div style="width: 100%; " class="subject-list-grid-warp">
                            <div id="etsGrid" class="subject-list-grid" style="height: 543px;" ui-grid="gridOptionsSubjectList"
                                 ui-grid-tree-view ui-grid-selection
                                 ui-grid-auto-resize ui-grid-resize-columns
                                 ui-grid-pinning
                                 ng-style="getGridHeight()"></div>
                        </div>

                    </div>
                </div>


                <!--选择COA,重分类信息界面-->
                <div class="reclassification-item-wrapper" id="reclassification-item-wrapper">
                    <div id="topMenu" style="height: 45px; line-height: 45px; padding-left: 10px; border: 1px solid #d4d4d4; border-bottom: none;">
                        {{'ReclassificationItem' | translate}}
                        <button class="btn btn-in-grid" style="min-width:70px;" ng-click="editReMapItem()" ng-show="hasImportPermission && !isSubmitted"><i class="fa fa-pencil" aria-hidden="true"></i>{{'Modify' | translate}}</button>
                        <button class="btn btn-in-grid" style="min-width:70px;" ng-click="deleteReMapItem()" ng-show="hasImportPermission && !isSubmitted"><i class="fa fa-minus-circle" aria-hidden="true" style="color: #F72B1C;"></i>{{'BtnDelete' | translate}}</button>
                    </div>
                    <div ui-grid="gridOptionsReclassificationItem" style="width:100%;" ui-grid-resize-columns ui-grid-selection ng-style="getReclassificationItemGridHeight()"></div>
                </div>
                <div>
                    <div id="content-resizer"
                         resizer="horizontal"
                         resizer-height="6"
                         bottom-min="0"
                         bottom-max="400"
                         resizer-top="#enterprizeAccount"
                         resizer-bottom="#reclassification-item-wrapper">
                        <div id="topIcon">
                            <img src="../../../../app-resources/images/collapse_gray.png" ng-click="toggleReclassificationGridTab()" />
                        </div>
                    </div>
                </div>
            </div>
            <!-- 标准科目列表 -->
            <div class="right-container" id="right-container">
                <div class="std-tree-container">
                    <!--顶部全部展开收缩以及标题-->
                    <div class="standard-subject-title">
                        <div class="headerIcon" ng-click="toggleStdSubject()">
                            <span ng-class="{hidden: stdCollapsed}"><i class="fa fa-minus" aria-hidden="true"></i></span>
                            <span ng-class="{hidden: !stdCollapsed}"><i class="fa fa-plus" aria-hidden="true"></i></span>
                        </div>

                        {{'StandardAccoutDoubleClick' | translate}}
                    </div>
                    <div>
                        <input class="form-control" placeholder="{{'SearchHintText' | translate}}" name="fancytree-vat-search" />
                    </div>
                    <div class="standard-subject-tree-container">
                        <table id="vatStadardAccountTreeTable" class="tree-table table table-condensed table-hover table-striped fancytree-fade-expander">
                            <colgroup>
                                <col width="0px" />
                                <col width="15px" />
                                <col width="*" />
                            </colgroup>
                            <tbody>
                                <tr>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>   
    </div>

    <div>
        <!--手工重对应 -->
        <div class="modal fade" id="manualReclassificationModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" data-keyboard="false">
            <div class="modal-dialog" style="width: 600px; height: 700px;" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <div class="modal-title">
                            {{remapTitle}}
                        </div>
                    </div>
                    <div class="modal-body">
                        <form class="form-horizontal" id="addReclassificationItem" name="addReclassificationItem">
                            <div class="form-group">
                                <label class="control-label col-sm-3"for="manualName">{{'ReclassificationName' | translate}}:</label>
                                <div class="col-sm-9">
                                    <input id="manualName" type="text" name="manualName" class="form-control" style="width: 300px;"
                                           placeholder="{{'RequiredField' | translate}} {{'ReclassificationNameTips' | translate}}" ng-model="editManualRModel.reMapName"
                                           ng-maxlength="maxTextLength" required  />
                                    <div ng-if="addReclassificationItem.manualName.$dirty" class="validation-message">
                                        <span ng-if="addReclassificationItem.manualName.$error.required">{{'RequiredField' | translate}}</span>
                                        <span ng-if="addReclassificationItem.manualName.$error.maxlength">{{'MaxLengthTip' | translate}}</span>
                                    </div>
                                </div>                    
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3" style="margin-left: 35px;margin-top: 8px;">{{'STANDARDProject' | translate}}:</label>
                                <div style="display: inline-block; margin-left: -20px;">
                                    <div id="reMapCustStdAutoComplete" dx-autocomplete="dxAutocompleteOptions.CustRemapAutocomplete" dx-item-alias="itemObj" style="width:300px">
                                        <div data-options="dxTemplate: { name: 'acStdItemTemplate' }">
                                            <span class='item-title'>
                                                <strong> {{itemObj.code }}</strong>
                                            </span>
                                            <span class='item-metadata'>
                                                <span> {{itemObj.name}}</span>
                                                <span>"{{(itemObj.direction == 1 ? 'AccountVoucher_Direction_Debit':'AccountVoucher_Direction_Credit')|translate}}"</span>
                                            </span>
                                        </div>
                                    </div>                                 
                                </div>     
                                <span ng-click="popTheParentCode()"><i class="fa fa-columns" aria-hidden="true" style=" font-size: 20px; vertical-align: top; margin-top: 10px;"></i></span>                                                                                                                                                               
                                <div ng-if="!stdAccountIsLeaf" class="validation-message" style="margin-left:165px">{{'StdAccountNotLeaf' | translate}}</div>
                            </div>

                            <div class="form-group">
                                <label class="control-label col-sm-3" for="manualDebitBal">{{'DebitBal' | translate}}:</label>
                                <div class="col-sm-9">
                                    <input id="manualDebitBal" type="text" name="manualDebitBal" class="form-control" style="width: 300px;"
                                           placeholder="{{'DebitTips' | translate}}"
                                           ng-model="editManualRModel.reMapDebit"
                                           ng-pattern="/^(\-)?\d+(\.\d{1,2})?$/"
                                           required />
                                    <div ng-if="addReclassificationItem.manualDebitBal.$dirty" class="validation-message">
                                        <span ng-if="addReclassificationItem.manualDebitBal.$error.required">{{'RequiredField' | translate}}</span>
                                        <span ng-if="addReclassificationItem.manualDebitBal.$error.pattern">{{'ReMapNumValidationMsg' | translate}}</span>
                                    </div>
                                </div>                         
                            </div>
                            <div class="form-group">
                                <label class="control-label col-sm-3" for="CreditBal">{{'CreditBal' | translate}}:</label>
                                <div class="col-sm-9">
                                    <input id="manualCreditBal" type="text" name="manualCreditBal" class="form-control" style="width: 300px;"
                                           placeholder="{{'CreditTips' | translate}}"
                                           ng-model="editManualRModel.reMapCredit"
                                           ng-pattern="/^(\-)?\d+(\.\d{1,2})?$/"
                                           required>
                                    <div ng-if="addReclassificationItem.manualCreditBal.$dirty" class="validation-message">
                                        <span ng-if="addReclassificationItem.manualCreditBal.$error.required">{{'RequiredField' | translate}}</span>
                                        <span ng-if="addReclassificationItem.manualCreditBal.$error.pattern">{{'ReMapNumValidationMsg' | translate}}</span>
                                    </div>
                                </div>                     
                            </div>                        
                            <div class="form-group">
                                <label class="control-label col-sm-3" for="manualReason">{{'Reason' | translate}}:</label>
                                <div class="col-sm-9">
                                    <textarea id="manualReason" name="manualReason" class="form-control" style="width:300px;height:80px;"
                                              ng-model="editManualRModel.reMapReason"
                                              ng-maxlength="maxRemarkLength"></textarea>
                                    <div ng-if="addReclassificationItem.manualReason.$dirty" class="validation-message">
                                        <span ng-if="addReclassificationItem.manualReason.$error.maxlength">{{'MaxLengthTip' | translate}}</span>
                                    </div>
                                </div>                        
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-vat-primary" ng-click="saveManualReclassification()" ng-disabled="addReclassificationItem.$invalid || !stdAccountIsLeaf">{{'Confirm' | translate}}</button>
                        <button type="button" class="btn btn-third" data-dismiss="modal" style="background-color: #797979;">{{'ButtonCancel' | translate}}</button>
                    </div>
                </div>
               
            </div>
        </div>
    </div>

        <!--凭证重对应 -->
        <div class="modal fade" id="voucherReclassificationModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" data-keyboard="false">
            <div class="modal-dialog" style="width: 1040px; height: 700px;" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <div class="modal-title">
                            {{remapTitle}}
                        </div>
                    </div>
                    <div class="modal-body">
                        <div>                        
                            <account-voucher-grid-filter is-searching="isSearching" period-id="periodId" enterprise-code="enterpriseCode" selected-vouchers="selectedVouchers" process-type-id="processTypeId" re-map-item="reMapItem"></account-voucher-grid-filter>
                        </div>                       
                        <!--<div style="border: 1px solid #959595; text-align: center;" id="voucherItemGrid" dx-data-grid="voucherItemGridOptions"></div>-->
                        <form class="form-inline" id="addVoucherReclassificationItem" name="addVoucherReclassificationItem">
                            <!-- 第一行 -->
                            <div class="form-group" style="margin-top:20px">
                                <label class="control-label" for="voucherName">{{'ReclassificationName' | translate}}:</label>
                                <div style="display:inline-block;">
                                    <input id="voucherName" type="text" name="voucherName" class="form-control"
                                           placeholder="{{'RequiredField' | translate}} {{'ReclassificationNameTips' | translate}}"
                                           ng-model="editVoucherRModel.reMapName"
                                           ng-maxlength="maxTextLength"
                                           required />
                                </div>
                            </div>                           
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

                            <div class="form-group" style="margin-top:20px">
                                <label class="control-label" style="float:left;margin-top:10px">{{'STANDARDProject' | translate}}:</label>
                                <div style="display:inline-block;">                                  
                                    <div id="reMapStdAutoComplete" dx-autocomplete="dxAutocompleteOptions.VoucherRemapAutoComplete" dx-item-alias="itemObj">
                                        <div data-options="dxTemplate: { name: 'acStdItemTemplate' }">
                                            <span class='item-title'>
                                                <strong> {{itemObj.code }}</strong>
                                            </span>
                                            <span class='item-metadata'>
                                                <span> {{itemObj.name}}</span>
                                                <span>"{{(itemObj.direction == 1 ? 'AccountVoucher_Direction_Debit':'AccountVoucher_Direction_Credit')|translate}}"</span>
                                            </span>
                                        </div>
                                    </div>                                                                    
                                </div>
                            </div>      
                            <span ng-click="popTheParentCode()"><i class="fa fa-columns" aria-hidden="true" style="font-size: 20px; vertical-align: middle; margin-top:15px"></i></span>                     
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

                            <div class="form-group" style="margin-top:20px">
                                <label class="control-label" for="voucherDebit">{{'DebitBal' | translate}}:</label>
                                <div style="display:inline-block;">
                                    <input id="voucherDebit" type="text" name="voucherDebit" class="form-control"
                                           placeholder="{{'AutoCalcDebitAmount' | translate}}"
                                           ng-model="editVoucherRModel.reMapDebit"
                                           readonly />
                                </div>
                                <div style="display:inline-block"></div>
                            </div>
                            <br />                  
                            <!-- 第二行  验证提示 -->
                            <div class="form-group">
                                <label class="control-label"></label>
                                <div class="validation-message-wrap">
                                    <div ng-if="addVoucherReclassificationItem.voucherName.$dirty" class="validation-message">
                                        <span ng-if="addVoucherReclassificationItem.voucherName.$error.required">{{'RequiredField' | translate}}</span>
                                        <span ng-if="addVoucherReclassificationItem.voucherName.$error.maxlength">{{'MaxLengthTip' | translate}}</span>
                                    </div>
                                </div>
                            </div>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

                            <div class="form-group">
                                <label class="control-label"></label>
                                <div class="validation-message-wrap">     
                                    <div ng-if="!stdAccountIsLeaf" class="validation-message">
                                        <span> {{'StdAccountNotLeaf' | translate}}</span>
                                    </div>
                                </div>
                            </div>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

                            <div class="form-group">
                                <label class="control-label"></label>
                                <div class="validation-message-wrap">

                                </div>
                            </div>

                            <br />
                            <!-- 第三行 -->
                            <div class="form-group">
                                <label class="control-label" for="voucherCredit">{{'CreditBal' | translate}}:</label>
                                <div style="display:inline-block;">
                                    <input id="voucherCredit" type="text" name="voucherCredit" class="form-control"
                                           placeholder="{{'AutoCalcCreditAmount' | translate}}"
                                           ng-model="editVoucherRModel.reMapCredit"
                                           readonly />
                                </div>
                            </div>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <div class="form-group">
                                <label class="control-label" for="voucherReason">{{'Reason' | translate}}:</label>
                                <div style="display:inline-block; margin-left:-5px">
                                    <input id="voucherReason" name="voucherReason" class="form-control" style="width: 522px;"
                                           ng-model="editVoucherRModel.reMapReason"
                                           ng-maxlength="maxRemarkLength" />
                                   
                                </div>
                            </div>
                            <br />
                            <!-- 第四行 验证提示 -->
                            <div class="form-group">
                                <label class="control-label"></label>
                                <div class="validation-message-wrap">

                                </div>
                            </div>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                              
                            <div class="form-group">
                                <label class="control-label"></label>
                                <div class="validation-message-wrap">
                                    <div ng-if="addVoucherReclassificationItem.voucherReason.$dirty" class="validation-message">
                                        <span ng-if="addVoucherReclassificationItem.voucherReason.$error.maxlength">{{'MaxLengthTip' | translate}}</span>
                                    </div>
                                </div>
                            </div> 
                        </form>
                    </div>
                    <div class="modal-footer">
                        <div style="float:right;margin-right:10px">
                            <button type="button" class="btn btn-vat-primary" ng-click="saveVoucherReclassification()" ng-disabled="addVoucherReclassificationItem.$invalid || !stdAccountIsLeaf">{{'Confirm' | translate}}</button>
                            <button type="button" id="btnCloseVoucherRemap" class="btn btn-third" data-dismiss="modal" ng-click="closeModal($event)" style="background-color: #797979;">{{'ButtonCancel' | translate}}</button>
                        </div>                        
                    </div>
                </div>
            </div>
        </div>

        <!-- 标准科目重对应结果 -->
        <div class="modal fade" id="stdReMapResultModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" data-keyboard="false">
            <div class="modal-dialog" style="width:1200px; height:1000px;" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <div class="modal-title">{{'StdAccountMappingResult' | translate}}<span class="close" data-dismiss="modal" aria-hidden="true" ng-click="closeModal($event)">&times;</span></div>                                                                                                                                       
                   </div>                            
                    <div class="modal-body">
                        <div ui-grid="gridOptionsStdReMapResult" style="width: 100%; max-height: 80%" ui-grid-resize-columns ui-grid-selection></div>
                    </div>      
                                                           
               </div>
           </div>
       </div>

        <!-- 凭证信息 -->
        <div class="modal fade" id="voucherDetailModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" data-keyboard="false">
            <div class="modal-dialog" style="width:1200px; height:1000px;" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <div class="modal-title">{{'AccountReMapVoucherDetailTitle' | translate}}<span class="close" data-dismiss="modal" aria-hidden="true" ng-click="closeModal($event)">&times;</span></div>                      
                    </div>
                    <div class="modal-body">
                        <div ui-grid="gridOptionsVouchersDetail" style="width:100%;" ui-grid-resize-columns></div>
                    </div>
                </div>

            </div>
        </div>
       
        <vat-operate-log period="periodId" module-type="moduleid" is-show="isShowLog" user-id="userId"></vat-operate-log>  
        <standard-account-grid-filter-modal is-show-std-filter="isShowStdFilter" std-account-list="stdAccountList" selected-std-code="selectedStdCode"></standard-account-grid-filter-modal>    
    
        <div style="display:none;">
            <table id="exportTable">
                <tr>
                    <td><span translate="EnterpriseSubjectCodeCol"></span></td>
                    <td><span translate="StdSubjectCodeCol"></span></td>
                    <td><span translate="EnterpriseSubjectNameCol"></span></td>
                    <td><span translate="StdSubjectNameCol"></span></td>
                    <td><span translate="EnterpriseCodeDirection"></span></td>
                    <td><span translate="StdCodeDirection"></span></td>
                </tr>
                <tr ng-repeat="exportData in exportDataList" on-finish-render="ngRepeatFinished">
                    <td>{{exportData.code}}</td>
                    <td>{{exportData.stdCode}}</td>
                    <td>{{exportData.fullName}}</td>
                    <td>{{exportData.stdFullName}}</td>
                    <td>{{exportData.directionDescription}}</td>
                    <td>{{exportData.stdDirection}}</td>
                </tr>
            </table>
        </div>
                 
</div>