@extends('hr::layouts.master')
@section('content')
<!-- Tax Master Starts Here -->
<script src="{{ asset('/js/accounting/controller/accountingModules.js')}}"></script>
<script src="{{ asset('/js/accounting/controller/systemaccountheadsController.js')}}"></script>
<script src="{{ asset('/js/accounting/controller/taxMasterController.js')}}"></script>
<div ng-app="accountingApp">
    <div ng-controller="taxMasterCtrl" ng-init="taxMasterPagingInit()">
        <!--Hidden Variables -->
        <input type="hidden" id='data-taxMaster' value="{{$taxMaster or '[]'}}"/>
        <input type="hidden" id='data-systemaccountHeads' value="{{$systemaccountHeads or '[]'}}"/>
        <input type="hidden" id='data-accountheadMaster' value="{{$accountheadMaster or '[]'}}"/>
        <!--hidden variables end here.-->
        <div class="col s12">
            <div class="card">
                <h1 class="page-title">Tax Master
                    <div class="right">    
                        <a href="#modal_createtaxMaster" ng-click="clearTaxMaster()" class="tooltipped" data-position="top" data-delay="50"  data-tooltip="Create New TaxMaster"><i class="fa fa-plus"></i></a>
                    </div> 
                </h1>
            </div>
        </div>
        <!--display starts here.-->
        <div class="col s12">
            <div class="row">
            </div> 
        </div>
        <div ng-show="taxMaster.data == 0">
            <div ng-show="taxMaster.data == 0" class="col s12 card">
                <div class="no-data">   
                    <i class="no-data-img"></i>
                    <p>No results found</p>
                </div>
            </div>
        </div>
        <div ng-hide="taxMaster.data == 0">
            <br>

            <!--Pagination starts here-->
            <ul class="pagination" ng-if="1 < pages.length || !autoHide">
                <li  ng-disabled="pagingData.current_page == 1">
                    <a href="" ng-click="pagingData.current_page == 1 || setCurrenttaxMasterPage(1)">&laquo;</a>
                </li>
                <li  ng-disabled="pagingData.current_page == 1">
                    <a href="" ng-click="pagingData.current_page == 1 || setCurrenttaxMasterPage(pagingData.current_page - 1)">&lsaquo;</a>
                </li>
                <li ng-repeat="pageNumber in pages track by  $index" ng-class="{ active :pagingData.current_page == pageNumber, disabled : pageNumber == '...' }">
                    <a href="" ng-click="setCurrenttaxMasterPage(pageNumber)">@{{ pageNumber}}</a>
                </li>

                <li  ng-disabled="pagingData.current_page == pagingData.last_page">
                    <a href="" ng-click="pagingData.current_page == pagingData.last_page || setCurrenttaxMasterPage(pagingData.current_page + 1)">&rsaquo;</a>
                </li>
                <li  ng-disabled="pagingData.current_page == pagingData.last_page">
                    <a href="" ng-click="pagingData.current_page == pagingData.last_page || setCurrenttaxMasterPage(pagingData.last_page)">&raquo;</a>
                </li>
            </ul>
            <!--Pagination ends here-->

            <div class="col m12  ">  
                <div class="card">
                    <div class="table-responsive">
                        <table class="table table-striped table-hover highlight">
                            <thead>
                                <tr>
                                    <th>Tax name</th>
                                    <th>Tax scope</th>
                                    <th>Tax computation</th>
                                    <th>Tax account</th>
                                    <th>Tax accountrefund</th>
                                    <th>Lableoninvoice</th>
                                    <th>Tax value</th>
                                    <th>Edit</th>
                                    <th>Delete</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr ng-repeat="taxMasters in taxMaster.data|  filter:search">
                                    <td>@{{taxMasters.taxname}}</td>
                                    <td>@{{taxMasters.taxscope}}</td>
                                    <td>@{{taxMasters.taxcomputation}}</td>
                                    <td>@{{taxMasters.type}}</td>
                                    <td>@{{taxMasters.account}}</td>
                                    <td>@{{taxMasters.lableoninvoice}}</td>
                                    <td ng-show="taxMasters.taxcomputation == 'PERCENTAGE'">@{{taxMasters.taxvalue}}%</td>
                                    <td ng-show="taxMasters.taxcomputation == 'FIXED'">@{{taxMasters.taxvalue}}</td>
                                    <td>
                                        <a href="#!" ng-click="editTaxMaster(taxMasters.id, $index)"><i class="fa fa-pencil fa-fw"></i>Edit</a>
                                    </td>
                                    <td>
                                        <a href="#!" ng-click="showDeleteModalTaxMaster(taxMasters.id, $index)"><i class="fa fa-trash-o fa-fw"></i>Delete</a>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>   
            </div>
        </div>
        <!--dispay ends here-->

        <!-- Modal Structure for creation starts here-->
        <div id="modal_createtaxMaster" class="modal" data-modalfire>
            <div class="modal-content">
                <h4>Create Tax Master</h4>                
                <div class="row">
                    <form class="custom-form col s12" id="frmTaxMaster">
                        <div class="row">
                            <div class="input-field mandatory col s6">
                                <label for="txtname" data-error="Name is mandatory">Name</label>
                                <input id="txtname" type="text" class="validate" name="txtname" ng-model="txtname" data-vtype="text" required>                                
                                <span class="error-msg"></span>
                            </div>
                            <div class="input-field mandatory col s6">
                                <input id="txtlableoninvoice" type="text" class="validate" name="txtlableoninvoice" ng-model="txtlableoninvoice" data-vtype="text" required>                                
                                <label for="txtlableoninvoice" data-error="Tax txtlableoninvoice is mandatory">lableoninvoice</label>
                                <span class="error-msg"></span>
                            </div>
                            <div class="input-field mandatory col s4">
                                <select id="selScope" name="selScope" ng-model="selScope" data-select class="browser-default" >
                                    <option value="" >Choose Tax Scope</option>
                                    <option value="SALES">SALES</option>
                                    <option value="PURCHASE">PURCHASE</option>
                                    <option value="NONE">NONE</option>
                                </select>
                            </div>
                            <div class="input-field mandatory col s4">
                                <select id="selComputation" name="selComputation" ng-model="selComputation" class="browser-default"  data-select >
                                    <option value="">Choose Tax Computation</option>
                                    <option value="FIXED">FIXED</option>
                                    <option value="PERCENTAGE">PERCENTAGE</option>
                                </select>
                            </div>
                            <div class="input-field mandatory col s3">
                                <input id="txtTaxvalue" type="text" class="validate" name="txtTaxvalue" ng-model="txtTaxvalue" data-vtype="number"  required>                                
                                <label for="txtTaxvalue" data-error="Tax Value is mandatory">Tax Value</label>
                                <span class="error-msg"></span>
                            </div>
                            <div class="input-field col s1" ng-show="selComputation == 'PERCENTAGE'" >
                                <input readonly="true" value="%"/>
                            </div>
                            <div class="input-field mandatory col s6">  
                                <select id="selaccountId"  name="selaccountId" ng-model="selaccountId" data-select required>
                                    <option value="" disabled selected>choose your Account</option>
                                    <option ng-repeat="selccountrefundId in systemaccountHeads.data"  value="@{{selccountrefundId.id}}">@{{selccountrefundId.type}}</option>
                                </select>   
                            </div>

                            <div class="input-field mandatory col s6">  
                                <select id="selccountrefundId" name="selccountrefundId" ng-model="selccountrefundId" data-select required>
                                    <option value="" disabled selected>Select Accountrefund</option>
                                    <option ng-repeat="selccountrefundId in systemaccountHeads.data"  value="@{{selccountrefundId.id}}">@{{selccountrefundId.type}}</option>
                                </select>
                            </div>

                            <input type="hidden" value="" id="taxMasterId" name='taxMasterId' ng-model="taxMasterId"/>

                        </div>
                    </form>
                </div>     
            </div>
            <div class="modal-footer">  
                <a class="footer-legend left"><i class="fa fa-caret-right red-text" aria-hidden="true">
                    </i> &nbsp;Mandatory Fields</a>  
                <a href="#!" ng-click="savetaxMaster($event)" class="waves-effect waves-light btn">Create</a>
                <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Cancel</a>
            </div>   
        </div>
        <!-- Modal Structure for creation ends here-->
        <!-- Delete Modal Structure Start-->
        <div id="modal-taxMaster-delete" class="modal modal-fixed-footer" data-modalfire>
            <div class="modal-content">
                <h4>Do you want delete this item(s) ?</h4>
            </div>
            <div class="modal-footer">
                <a href="#!" ng-click="deleteTaxMaster()" class="modal-action waves-effect waves-red btn-flat ">Yes</a>
                <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">No</a>
            </div>
        </div>
        <!-- Delete Modal Structure End-->
    </div>
</div>
<!-- Tax Master Ends Here -->

@stop