<div class="vat-bill-detail"> <div class="header-title"> <div style="display:inline-block"><span class="title-name">{{'BillDetail' | translate }}</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">{{'BillSearchType' | translate }}:</span></td> <td> <div dx-select-box="searchOptions.billTypeOptions"></div> </td> <td><span class="lbl-name">{{'BillSearchCustomer' | translate }}:</span></td> <td> <input class="form-control" name="name" ng-model="searchParam.customer" maxlength="20"> </td> <td><span class="lbl-name">{{'BillSearchNumber' | translate }}:</span></td> <td> <input class="form-control" name="name" ng-model="searchParam.billNumber" maxlength="20"> </td> <td ng-show="!hasShowMoreSearchBox"> <button type="button" class="btn btn-primary invoice-btn" ng-click="searchboxService.search()">{{'BillDtlSearch' | translate }} </button> </td> <td ng-show="!hasShowMoreSearchBox"> <button type="button" class="btn btn-primary invoice-btn" ng-click="searchboxService.resetBox()">{{'BillDtlReset' | translate }} </button> </td> <td ng-show="!hasShowMoreSearchBox"> <span class="lbl-name"> <a href="javacript:void(0)" ng-click="searchboxService.showOrHideSearchBox()"><span><i class="fa fa-chevron-down" aria-hidden="true"></i><span style="margin-left:3px;">{{'BillDtlMoreSearch' | translate }}</span></span></a> </span> </td> </tr> <tr ng-show="hasShowMoreSearchBox"> </td> <td><span class="lbl-name">{{'BillSearchRevenueType' | translate }}:</span></td> <td> <div dx-select-box="searchOptions.revenueTypeOptions"></div> </td> <td><span class="lbl-name">{{'BillSearchContent' | translate }}:</span></td> <td> <input class="form-control" name="name" ng-model="searchParam.billContent" maxlength="20"> </td> <td><span class="lbl-name">{{'BillSearchDepartment' | translate }}:</span></td> <td> <input class="form-control" name="name" ng-model="searchParam.department" maxlength="20"> </td> </tr> <tr ng-show="hasShowMoreSearchBox"> <td><span class="lbl-name">{{'BillSearchTaxRate' | translate }}:</span></td> <td> <div dx-select-box="searchOptions.taxRateOptions"></div> </td> <td><span class="lbl-name">{{'BillSearchDate' | translate }}:</span></td> <td> <div class="period-picker"> <input type="text" id="periodDatepicker" class="datepicker imp-subheader" style="width:120px;" readonly="readonly" ng-model="searchParam.billDate"/> <i class="fa fa-calendar imp-subheader red-color" style="width:20px;"></i> </div> </td> <td> <button type="button" class="btn btn-primary invoice-btn" ng-click="searchboxService.search()">{{'BillDtlSearch' | translate }} </button> </td> <td> <button type="button" class="btn btn-primary invoice-btn" ng-click="searchboxService.resetBox()">{{'BillDtlReset' | translate }} </button> </td> <td> <a href="javascript:void(0);" ng-click="searchboxService.showOrHideSearchBox()"> <span><i class="fa fa-chevron-up" aria-hidden="true"></i><span style="margin-left:3px;">{{'BillDtlShrink' | translate }}</span></span></a> </td> </tr> </table> </div> </div> <div class="body"> <div class="grid-container"> <div id="invoiceGridContainer" dx-data-grid="revenueGridOptions"> <div data-options="dxTemplate:{ name:'editCellTemplate' }"> </div> </div> </div> <div class="page-footer"> <ack-pagination page-options="pagingOptions" refresh-table="refreshGrid()"></ack-pagination> </div> </div> </div> <div class="modal fade" id="editRevenueTypeDiv" tabindex="-1" role="dialog"> <div class="modal-dialog" style="width: 1200px;" role="document"> <div class="modal-content"> <div class="modal-header"> <h3 class="modal-title" id="modal-title"> <span translate="BillEditRevenueType"></span> </h3> </div> <div class="modal-body" id="modal-body"> <form class="form-horizontal" id="configForm"> <div class="form-group"> <label class="col-sm-2 control-label"><span style="color: red">*</span>{{'BillSearchRevenueType' | translate}}:</label> <div class="col-sm-4"> <div dx-select-box="searchOptions.editRevenueTypeOptions"></div> </div> </div> </form> </div> <div class="modal-footer"> <button type="button" class="btn btn-primary" ng-click="updateBillDetail()">{{'Confirm' | translate }}</button> <button type="button" class="btn btn-third" data-dismiss="modal" ng-click="cancelModal()">{{'Cancel' | translate }}</button> </div> </div> </div> </div> </div>