<div class="invoice-manage-main">
    <div class="header-title">
        <div style="display:inline-block"><span class="title-name">采购端发票管理</span></div>
    </div>
    <div class="content-container">
        <div class="header">
            <div class="search-panel">
                <table class="table borderless table-bottom">
                    <tr>
                        <td><span class="lbl-name">购买方名称:</span></td>
                        <td>
                            <div dx-select-box="searchEntityOptions.selectboxBuyerNameOptions"></div>
                        </td>

                        <td><span class="lbl-name">销售方名称</span>:</td>
                        <td>
                            <div dx-text-box="searchEntityOptions.txtSellerNameBoxOptions"></div>
                        </td>

                        <td><span class="lbl-name">发票号码:</span></td>
                        <td>

                            <div dx-text-box="searchEntityOptions.txtInvoiceNumberOptions"></div>

                        </td>
                        <td ng-show="!hasShowMoreSearchBox">
                            <button type="button" class="btn btn-primary invoice-btn" ng-click="searchboxService.searchInvoice()">查询</button>
                        </td>
                        <td>
                            <span class="lbl-name">
                                <!--<a href="javacript:void(0)" ng-click="searchboxService.showOrHideSearchBox()" ng-show="hasShowMoreSearchBox"><span><i class="fa fa-chevron-up" aria-hidden="true"></i><span style="margin-left:3px;">收起查询</span></span></a>-->
                                <a href="javacript:void(0)" ng-click="searchboxService.showOrHideSearchBox()" ng-show="!hasShowMoreSearchBox"><span><i class="fa fa-chevron-down" aria-hidden="true"></i><span style="margin-left:3px;">{{'MoreQuery' | translate }}</span></span></a>
                            </span>
                        </td>
                    </tr>

                    <tr ng-show="hasShowMoreSearchBox">
                        <td><span class="lbl-name">发票状态:</span></td>
                        <td>
                            <div dx-select-box="searchEntityOptions.selectstatusOptions"></div>
                        </td>

                        <td><span class="lbl-name">开票日期:</span></td>
                        <td>
                            <!--<div dx-date-box="dateBox.timeFormat"></div>-->
                            <div class="input-daterange input-group" id="invoiceDatePicker">
                                <input type="text" class="input-sm form-control" name="start" ng-model="searchEntity.invoiceDateFrom" />
                                <span class="input-group-addon">-</span>
                                <input type="text" class="input-sm form-control" name="end" ng-model="searchEntity.invoiceDateTo" />
                            </div>
                        </td>


                        <td><span class="lbl-name">发票来源:</span></td>
                        <td>
                            <div dx-select-box="searchEntityOptions.selectinvoiceSourceTypeOptions"></div>
                        </td>


                    </tr>

                    <tr ng-show="hasShowMoreSearchBox">
                        <td><span class="lbl-name">发票类型:</span></td>
                        <td>
                            <div dx-select-box="searchEntityOptions.selectInvoiceTypeOptions"></div>
                        </td>
                        <td><span class="lbl-name">上传日期:</span></td>
                        <td>
                            <!--<div dx-date-box="dateBox.timeFormat"></div>-->

                            <div class="input-daterange input-group" id="uploadDatepicker">
                                <input type="text" class="input-sm form-control" name="start" ng-model="searchEntity.uploadDateFrom" />
                                <span class="input-group-addon">-</span>
                                <input type="text" class="input-sm form-control" name="end" ng-model="searchEntity.uploadDateTo" />
                            </div>

                        </td>

                        <td><span class="lbl-name">上传方式:</span></td>
                        <td>
                            <div dx-select-box="searchEntityOptions.selectInvoiceUploadTypeOptions"></div>
                        </td>

                    </tr>
                    <tr ng-show="hasShowMoreSearchBox">
                        <td><span class="lbl-name">发票实体:</span></td>
                        <td>
                            <div dx-select-box="searchEntityOptions.selectInvoiceEntityTypeOptions"></div>
                        </td>
                        <td><span class="lbl-name">票面金额(含税):</span></td>
                        <td>
                            <!--<div dx-text-box="searchEntityOptions.txtAmountOptions"></div>-->
                            <div class="input-daterange input-group">
                                <input type="number" class="input-sm form-control" name="start" ng-model="searchEntity.amountFrom" />
                                <span class="input-group-addon">-</span>
                                <input type="number" class="input-sm form-control" name="end" ng-model="searchEntity.amountTo" />
                            </div>

                        </td>
                        <td>
                            <button type="button" class="btn btn-primary invoice-btn" ng-click="searchboxService.searchInvoice()">{{'Query' | translate }}</button>

                        </td>
                        <td>
                            <a href="javascript:void(0);" ng-click="searchboxService.showOrHideSearchBox()" ng-show="hasShowMoreSearchBox"><span><i class="fa fa-chevron-up" aria-hidden="true"></i><span style="margin-left:3px;">{{'Collapse' | translate }}</span></span></a>
                        </td>

                    </tr>
                </table>
            </div>
        </div>
        <div class="body">
            <div class="buttom-row">
                <div class="left-side">
                    <button type="button" class="btn btn-primary invoice-btn" ng-click="eventService.gotoUploadIndexPage()">上传</button>
                    <span class="select-title" translate="HasChooseItemCount"></span>
                    <span class="select-number">{{selectedRecourdCount}}</span>
                    <span translate="ItemRecords"></span>
                </div>
                <div class="right-side">
                    <button type="button" class="btn btn-secondary  invoice-btn" ng-click="eventService.invoiceManualRecognize()">发票识别</button>
                    <button type="button" class="btn btn-secondary  invoice-btn" ng-click="eventService.invoiceExamination()">发票验真</button>
                    <button type="button" class="btn btn-secondary invoice-btn" ng-click="eventService.refundInovice()">退票</button>
                    <button type="button" class="btn btn-secondary invoice-btn" ng-click="modalService.invoiceVerify.open()">发票认证</button>
                    <button type="button" class="btn btn-third invoice-btn" ng-click="eventService.expireInvoice()">失效</button>
                </div>
            </div>
            <div class="grid-container">
                <div id="invoiceGridContainer" dx-data-grid="invoiceGridOptions" dx-item-alias="invoice">
                    <div data-options="dxTemplate: {name: 'detail'}">
                        <div class="internal-grid-container">
                            <div class="internal-grid" dx-data-grid="invoiceGridOptions.detailGridOptions(invoice.data.id)"></div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="page-footer">
                <ack-pagination page-options="pagingOptions" refresh-table="eventService.refreshInvoiceDataGrid()"></ack-pagination>
            </div>
        </div>

    </div>
    <!--退票-->
    <refund-reason reasons="refundReasons" invoice-ids="selectedItemIDs" is-show="showRefundModal" refresh-table="eventService.refreshInvoiceDataGrid()"></refund-reason>
    <!--发票手动验真-->
    <invoice-examination-modal is-show="isShowExaminationModal" invoice-entity="selectedInvoiceEntity" refresh-table="eventService.refreshInvoiceDataGrid()"></invoice-examination-modal>

    <!--上传发票认证文件-->
    <script type="text/ng-template" id="uploadInvoiceVerify.html">
        <div class="modal-header">
            <div class="modal-title" id="modal-title">上传认证清单</div>
        </div>
        <div class="modal-body" id="modal-body">
            <form class="form-horizontal" id="importInvoiceVerifyFrom" name="importInvoiceVerifyFrom">

                <div class="form-group">
                    <label for="selectDirection" class="col-sm-2 control-label">选择文件:</label>
                    <div class="col-sm-6">
                        <input class="form-control" type="text" name="fileName" value="{{invoiceVerifyfile ? invoiceVerifyfile.name : '' | limitString :25}}" readonly placeholder="" required>
                    </div>

                    <div class="col-sm-3">
                        <button type="file" ngf-select ng-model="invoiceVerifyfile" accept=".xls,.xlsx" class="btn btn-not-important">{{'BrowseFile' | translate }}</button>
                    </div>
                </div>
            </form>
        </div>

        <div class="modal-footer">
            <!--<div id="button" class="btn btn-primary" ng-click="modalService.invoiceVerify.save();">上传</div>-->
            <button class="btn btn-primary" type="button" ng-click="modalService.invoiceVerify.save()">上传</button>
            <button class="btn btn-third" type="button" ng-click="modalService.invoiceVerify.cancel()" translate="Cancel"></button>
        </div>
    </script>


    <!--发票detail table-->
    <script type="text/ng-template" id="invoiceDetailTable.html">
        <div class="modal-header">
            <h3 class="modal-title" id="modal-title">
                <span translate="InvoiceFPDMQuery"></span>
                <span> {{selectedInvoice.invoiceCode}}</span>
            </h3>
        </div>
        <div class="modal-body" id="modal-body">
            <invoice-table-template invoice="selectedInvoice" is-load-detail="false">
            </invoice-table-template>
        </div>
        <div class="modal-footer">
            <button class="btn btn-primary" type="button" ng-click="modalService.invoiceDetail.cancel();" translate="Confirm"></button>
        </div>
    </script>


</div>