<?php $__env->startSection('title', 'Clients'); ?>

<?php $__env->startSection('content'); ?>
        
    <div class="col-xs-12 main page-dashboard">

        <div class="row">
            <ol class="breadcrumb">
                <li><a href="<?php echo e(route('dashboard')); ?>"><svg class="glyph stroked home"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#stroked-home"></use></svg></a></li>
                <li class="active">Clients</li>
            </ol>
        </div>

        <div class="row">
            <div class="col-lg-12">
                <h3 class="page-header">Clients</h3>
            </div>
        </div>
        
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <div class="row">
                            <div class="col-sm-6">
                                <svg class="glyph stroked clipboard with paper"><use xlink:href="#stroked-clipboard-with-paper"/></svg> List all clients
                            </div>
                            <div class="col-sm-6 text-right">
                                <a class="btn btn-primary js-addnewclient"><svg class="glyph stroked plus sign"><use xlink:href="#stroked-plus-sign"/></svg> Add new client</a>
                            </div>
                        </div>
                    </div>
                    <div class="panel-body">
                        <?php if(Session::has('message')): ?>
                            <div class="alert bg-<?php echo e(Session::get('class')); ?>"><?php echo e(Session::get('message')); ?></div>
                        <?php endif; ?>
                        <div class="js-status"></div>
                        <table class="js-table-clients" data-toggle="table" data-url="<?php echo e(route('apiClients')); ?>"  data-show-refresh="true" data-show-toggle="true" data-show-columns="true" data-search="true" data-pagination="true">
                            <thead>
                            <tr>
                                <th data-formatter="runningFormatter">#</th>
                                <th data-field="name" data-sortable="true">Company Name</th>
                                <th data-field="pic" data-sortable="true">PIC</th>
                                <th data-field="email">Email</th>
                                <th data-field="contact">Contact</th>
                                <th data-align="center" data-field="operate" data-events="operateEvents">Actions</th>
                            </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>

    </div>

<?php $__env->stopSection(); ?>



<?php $__env->startSection('script'); ?>
<script>
    // Add table operation
    function runningFormatter(value, row, index) {
        return 1+index;
    }

    window.operateEvents = {
        'click .edit': function (e, value, row, index) {
            $.ajax({
                url: '<?php echo e(URL::to("/")); ?>/clients/' + row.id + '/edit',
                dataType: 'html',
                type: 'GET',
            }).success(function(response) {
                bootbox
                    .dialog({
                        title: '...',
                        message: response,
                        onEscape: true,
                        backdrop: true
                    }).on('shown.bs.modal', function() {
                        var title = $('.js-form-title').data('title');
                        var firstfield = $('input[name=name]');
                        $('.modal-title').html(title);
                        firstfield.focus();
                    });
            });
        }
    };

    //Click add new user button
    $('.js-addnewclient').on('click', function() {
        $.ajax({
            url: "<?php echo e(action('ClientController@create')); ?>",
            dataType: 'html',
            type: 'GET',
        }).success(function(response) {
            bootbox
                .dialog({
                    title: '...',
                    message: response,
                        onEscape: true,
                        backdrop: true
                }).on('shown.bs.modal', function() {
                    var title = $('.js-form-title').data('title');
                    var firstfield = $('input[name=name]');
                    $('.modal-title').html(title);
                    firstfield.focus();
                });
        });

        return false;
    });
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.master', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>