@extends('layouts.master')
@section('title', 'User')
@push('css')

@endpush

@section('content')
    <div class="row">
        <div class="col-xl-12">
            <form method="POST" action="{{ route('user.account.add') }}">
                @csrf
            <div class="form-horizontal">
                <div class="col-sm-12">
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Account ID </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <input type="text" name="account_id" id="txtFirstName" placeholder="Account ID" value=""
                                class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Account Name </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <input type="text" name="account_name" id="txtFirstName" placeholder="account Name" value=""
                                class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Description </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <textarea type="text" name="description" id="txtFirstName" value=""
                                      class="form-control"></textarea>
                            <br/>
                            <button type="submit" title="Save"
                                    class="btn btn-sm btn-success pull-left">
                                Save
                                <i class="ace-icon fa fa-arrow-right icon-on-right bigger-110"></i>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            </form>
        </div>
        <div class="">
            <h3 class="panel-title">Account Information</h3>
        </div>
        <div class="col-xl-12">

            <div class="panel">

                <div class="panel-body">
                    <table id="demo-dt-basic" class="table table-striped table-bordered" cellspacing="0" width="100%">
                        <thead>
                        <tr>
                            <th>Account ID</th>
                            <th>Account Name </th>
                            <th class="min-tablet">Description</th>
                            <th class="min-tablet">Action</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach ($accounts as $account)
                        <tr>
                            <td>{{ $account->account_id }}</td>
                            <td>{{ $account->account_name }}</td>
                            <td>{{ $account->description }}</td>
                            <td>
                                <a style="font-size: 7px" href="{{route('user.account.edit', $account->id )}}" class="btn btn-mint btn-icon" ><i class="demo-psi-pen-5 icon-lg"></i></a>
                                <a style="font-size: 7px" onclick="return confirm('Are you sure?')" href="{{route('user.account.delete', $account->id )}}" class="btn btn-success btn-icon" ><i class="demo-psi-recycling icon-lg"></i></a>


                            </td>
                        </tr>
                        @endforeach

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('js')
<script>
    $(document).ready(function() {
        var table = $('#example').DataTable( {
            lengthChange: false,
            buttons: [ 'copy', 'excel', 'pdf', 'colvis' ]
        } );

        table.buttons().container()
            .appendTo( '#example_wrapper .col-md-6:eq(0)' );
    } );
</script>
@endpush