@extends('layouts.master')
@section('content')

<!-- Main Content -->

            <div class="container-fluid">

				<!-- Title -->
				<div class="row heading-bg" style="background-color:  {!! \App\Helper::barColor() !!}">
					<div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
						<h5 class="txt-light">{!! \App\Helper::panelName() !!}</h5>
					</div>
					<!-- Breadcrumb -->
					<div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
						<ol class="breadcrumb">
						    <li><a href="{{ url('/') }}"><span class="font-nexa">{!! \App\Helper::panelName() !!}</a></li>
							<li><a href="{{ url('/') }}">Auto Add Saldo</a></li>
						</ol>
					</div>
					<!-- /Breadcrumb -->
				</div>
				<!-- /Title -->

				<div class="row">

				    <div class="col-xs-12 col-md-12">
				        <div class="panel panel-default" style="color: {!! \App\Helper::barColor() !!}">
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-xs-2">
                                        <span class="label" style="background-color: {!! \App\Helper::barColor() !!}">{{ auth()->user()->level }}</span>
                                    </div>
                                    <div class="col-xs-10 text-right">
                                        <h6>{!! \App\Helper::panelName() !!} Auto Add Saldo</h6>
                                    </div>
                                </div>
                                <hr style="border-top: 1px solid {!! \App\Helper::barColor() !!}">

                                 <div class="table-responsive">
                                    <table class="table table-bordered table-hover" id="users-table">
                                        <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>ACTION</th>
                                                <th>JUMLAH</th>
                                                <th>LAYANAN</th>
                                                <th>DATE</th>
                                            </tr>
                                        </thead>
                                    </table>
                                </div>


                                
				    </div>



				   


				</div>



    </div>




			</div>

@endsection

@section('js')

<script>
$(function() {
    $('#users-table').DataTable({
        processing: true,
        serverSide: true,
        ajax: '/user/jsmutasi',
        columns: [
            { data: 'id',
                render: function(data,type, row){
                    var a = Math.floor(Math.random() * 9999) + 1000;
                    return '#' +a;
                }
            },
            { data: 'action', 
                render: function(data, type, row){
                    if(data == 'Cut Balance'){
                        return '<span class="badge badge-danger">'+data+'</span>';
                    }else{
                        return '<span class="badge badge-success">'+data+'</span>';
                    }
                }
            },
            { data: 'quantity', name: 'quantity' },
            { data: 'msg', name: 'msg' },
            { data: 'date', name: 'date'},

        ]
    });
});
</script>

@endsection