@extends('hr::layouts.master')
@section('content')
<script src="{{ asset('/js/hr/controller/empModules.js')}}"></script> 
<script src="{{ asset('/js/calendar/controller/clientController.js')}}"></script> 
<div  ng-app="calendarApp" ng-controller="clientCtrl" ng-init="clientPagingInit()">
    <div class="col s12">
        <div class="card">
            <h1 class="page-title">Client Management</h1>
            <a href="#!" ng-click="GoBack()" class="waves-effect page-button"><i class="material-icons left">arrow_back</i>Back</a>
        </div>
    </div>
    <!-- Modal Structure -->
    <div class="col s12">
        <div class="card">
            <div class="modal-content">                   
                <div class="row">
                    <form class=" custom-form col s12" id="frmclientsc">
                        <div class="row">
                            <div class="input-field col s12">
                                <input id="radiocompanyornot" type="radio" name="radiocompanyornot" value="COMPANY" ng-model="radiocompanyornot" ng-click="rCclear()">
                                <label for="radiocompanyornot">Company</label>
                                <input id="radiocompanyorno" type="radio" name="radiocompanyornot"  value="INDIVIDUAL" ng-model="radiocompanyornot" ng-click="rIclear()" >
                                <label for="radiocompanyorno">Individual</label>
                            </div>
                            <div class="input-field col s12">                            
                                <input id="txtname" class="validate" type="text" name="txtname" data-vtype="name" ng-model="txtname" required data-vtype="name" placeholder="Name">                                
                                <span class="error-msg"></span>                           
                            </div>
                            <div class="input-field col s12">                            
                                <input id="txtaddress" class="validate" type="text" data-vtype="text" name="txtaddress" ng-model="txtaddress" required data-vtype="text" placeholder="Address">                                
                                <span class="error-msg"></span>                           
                            </div>
                            <div class="input-field col s6">
                                <input id="txttin" type="text" name="txttin" ng-model="txttin" placeholder="Tin" >                            
                            </div>
                            <div class="input-field col s6">
                                <input id="txtwebsite" type="url" name="txtwebsite" ng-model="txtwebsite" placeholder="Website">                            
                            </div>
                            <div class="row" ng-show="radiocompanyornot == 'INDIVIDUAL'">
                                <div class="input-field col s6"  >
                                    <select id="sctjob" name="sctjob" ng-model="sctjob" data-select>
                                        <option ng-repeat="jobposition in jobpositions.data" value="@{{jobposition.id}}">@{{jobposition.position}}</option>
                                    </select>
                                    <label for="txttin">Job Position</label>
                                </div>
                                <div class="input-field col s6"   >
                                    <select id="sctsalutation" name="sctsalutation" ng-model="sctsalutation" data-select>
                                        <option ng-repeat="salutation in salutations.data" value="@{{salutation.id}}">@{{salutation.name}}</option>
                                    </select>                               
                                    <label for="txttin">Salutation</label>
                                </div>
                            </div>
                            <div class="row">
                                <div class="input-field col s4">                           
                                    <input id="txtphone" type="text" data-vtype="telephone" name="txtphone" ng-model="txtphone" required placeholder="Contact Number" data-vtype="telephone">                                
                                    <span class="error-msg"></span>                            
                                </div>
                                <div class="input-field col s4">                           
                                    <input id="txtemail" class="validate" data-vtype="email" type="email" name="txtemail" ng-model="txtemail" required placeholder="Email" data-vtype="email">                                
                                    <span class="error-msg"></span>                           
                                </div>
                                <div class="input-field col s4">
                                    <input id="txtfax" type="text" name="txtfax" ng-model="txtfax" required placeholder="Fax">                             

                                </div>
                            </div>
                            <div class="row" ng-show="radiocompanyornot == 'COMPANY'">
                                <div class="input-field col s4" >
                                    <input id="txtcontactname" type="text" name="txtcontactname" ng-model="txtcontactname" required placeholder="Contact Person Name">                               
                                </div>
                                <div class="input-field col s4">
                                    <input id="txtpersoncontact" type="text" name="txtpersoncontact" ng-model="txtpersoncontact" required placeholder="Contact Person Number" data-vtype="telephone">                                
                                    <span class="error-msg"></span>

                                </div>
                                <div class="input-field col s4">
                                    <input id="txtpersonemail"  type="email" name="txtpersonemail" ng-model="txtpersonemail" placeholder="Person Email">                                
                                </div>
                            </div>
                            <div class="row">
                                <div class="input-field col s6">
                                    <input id="txtlanguage" type="text" name="txtlanguage" ng-model="txtlanguage" placeholder="Language">                                
                                </div>
                                <div class="input-field col s6">
                                    <input id="txttitle" type="text" name="txttitle" ng-model="txttitle"  placeholder="Title">                                
                                </div>
                            </div>
                            <div class="input-field col s12">
                                <textarea id="txtnotes" type="text" name="txtnotes" ng-model="txtnotes"  placeholder="Note"></textarea>
                            </div>
                            <div class="input-field col s6">
                                <input id="chkcustomer" type="checkbox" name="chkcustomer"  ng-model="chkcustomer">                                
                                <label for="chkcustomer">Is customer</label>
                            </div>
                            <div class="input-field col s6">
                                <input id="chkvendor" type="checkbox" name="chkvendor"  ng-model="chkvendor" >                              
                                <label for="chkvendor">Is Vendor</label>
                            </div>
                        </div>
                       
                    </form>
                </div>
            </div>

        </div>
        <div class="card">
            <div class="row">
                <div class="col s12"> 
                    <div class="table-filter col s5 right">
                        <div class="input-field" ng-hide="clients.data == 0">
                            <input type="text" value="" ng-model="txtclient" ng-keyup="searchAjaxclient()()"><i class="material-icons">search</i>
                        </div>
                    </div> 
                    <table class="responsive-table highlight " ng-hide="clients.data == 0">
                        <thead>
                            <tr>
                                <th>TYPE</th>
                                <th>Company Name</th>
                                <th>Phone</th>
                                <th>Email</th>
                                <th>Contact Person Name</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="client in clients.data|  filter:searchclient" >
                                <td>@{{client.companyornot}}</td>
                                <td>@{{client.name}}</td>
                                <td>@{{client.phone}}</td>
                                <td>@{{client.email}}</td>
                                <td>@{{client.contactpersonname}}</td>

                                <td>
                                    <a href="#!" ng-click="editclient(client.id, $index)"><i class="fa fa-pencil fa-fw"></i> Edit</a>
                                    <a href="#!" ng-click="showDeleteclient(client.id, $index)" ><i class="fa fa-trash-o fa-fw"></i>Delete</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <div class="table-footer" ng-hide="clients.data == 0>
                        <!--Pagination starts here-->
                        <ul class="pagination right" ng-if="1 < pages.length || !autoHide">
                            <li  ng-disabled="pagingData.current_page == 1">
                                <a href="" ng-click="pagingData.current_page == 1 || setCurrentclientPage(1)">&laquo;</a>
                            </li>
                            <li  ng-disabled="pagingData.current_page == 1">
                                <a href="" ng-click="pagingData.current_page == 1 || setCurrentclientPage(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="setCurrentclientPage(pageNumber)">@{{ pageNumber}}</a>
                            </li>

                            <li  ng-disabled="pagingData.current_page == pagingData.last_page">
                                <a href="" ng-click="pagingData.current_page == pagingData.last_page || setCurrentclientPage(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 || setCurrentclientPage(pagingData.last_page)">&raquo;</a>
                            </li>
                        </ul>
                    </div>
                    <div class="no-data" ng-show="clients.data == 0">   
                        <i class="no-data-img"></i>
                        <p>No results found</p>
                    </div>
                    <div id="modal-client-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="deleteclient()" 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>

                </div>
            </div>
        </div>
        <!-- Modal Structure -->
        <input type="hidden"  id="data-clients" value="{{$clients or []}}" >
        <input type="hidden"  id="data-jobpositions" value="{{$jobpositions or []}}" >
        <input type="hidden"  id="data-salutations" value="{{$salutations or []}}" >

         <div class="col s12">
                            <div class="primay-footer ">
                                <div class="footer-content">
                                    <div class="row">
                                        <div class="input-field col s7">                                        
                                            <p class="footer-legend"><i class="fa fa-caret-right red-text" aria-hidden="true"></i> &nbsp;Mandatory Fields</p>
                                        </div>
                                        <div class="input-field right">   
                                            <!--<button class="btn white grey-text-text default waves-effect" type="reset">Cancel</button>-->

                                            <a  href="#!" ng-click="saveclient($event)" class="btn transparent green-text primary waves-effect">Save Client</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div> 
    </div>
</div>
@stop