@extends('cash_books.accounts.includes.accounts_tabs')
@section('accounts')
    <style>
        .account_open_balance_modal {
            width: 40%;
            margin-left: 1%;
        }
    </style>
    <div class="msghead">
        <ul class="msghead_menu">
            <div class="pull-right">
                <form class="form form-inline" id="add_accounts">
                    <input name="name" class="input-xlarge" value="" placeholder="Ledger Name"
                           style="margin-bottom: 30px" required>
                    <select name="sub_account_id" id="sub_account_id" data-placeholder="" style="width:250px;" required>
                        <option>Select Sub Account</option>
                        @foreach($account_groups as $account_group)
                            <optgroup label="{{$account_group->name}}">
                                @foreach($account_group->subGroups as $subGroup)
                                    <option value="{{$subGroup->id}}">{{$subGroup->name}}</option>
                                @endforeach
                            </optgroup>
                        @endforeach
                    </select>
                    <input class="btn " type="submit" value="ADD ACCOUNT" style="margin-bottom: 30px">
                </form>
            </div>
        </ul>
        <span class="clearall"></span>
    </div><!--msghead-->
    <br>
    <table class="table table-striped table-condensed table-bordered" id="dyntable">
        <thead>
        <tr>
            <td style="width: 20px;">S/N</td>
            <th class="head0">Name</th>
            <th class="head1">Group</th>
            <th class="head1">Sub Group</th>
            <th class="head1">Type</th>
            <th class="head1">Open Balance</th>
            <th class="head1">Action</th>
        </tr>
        </thead>
        <tbody id="accounts_body">
        @foreach($accounts as $index=> $account)
            <tr>
                <td>{{$index+1}}</td>
                <td>{{$account->name}}</td>
                <td>{{$account->group}}</td>
                <td>{{$account->sub_group}}</td>
                <td>{{$account->type}}</td>
                <td style="text-align: right">
                    @if(($account->account_group_id == 2) OR ($account->account_group_id == 1) OR ($account->account_group_id == 3) OR ($account->account_group_id == 4))
                        @if(!empty($account->openBalance))
                            {{number_format($account->openBalance->amount,2)}} ({{$account->openBalance->currency}})
                        @endif
                    @else
                        -
                    @endif
                </td>
                <td style="text-align: right;width: 40px">
                    <div class="btn-group">
                        @if(($account->account_group_id == 2) OR ($account->account_group_id == 1) OR ($account->account_group_id == 3) OR ($account->account_group_id == 4))
                            <a class="btn btn btn-mini" onclick="modelShow('account_open_balance{{$account->id}}')">
                                <i class="iconfa-money icon"></i> Open balance
                            </a>
                            <div aria-hidden="false" aria-labelledby="myModalLabel" role="dialog" tabindex="-1"
                                 class="modal hide fade in modal-1 account_open_balance_modal"
                                 id="account_open_balance{{$account->id}}">
                                <!-- Modal content-->
                                {!! Form::open(array('route' => 'accounts.open-balances.store', 'class' => 'stdform open_balance_form','method'=>'post')) !!}
                                <div class="modal-header" style="background: #50A6C6">
                                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                                    <h4> CREATE OPEN BALANCE</h4>
                                </div>
                                <div class="modal-body">
                                    <div class="row-fluid">
                                        <div class="span12">
                                            <div class="par control-group">
                                                <label class="span4" style="text-align: right">Account
                                                    Name</label>

                                                <div class="controls span8">
                                                    <input type="text" name="name" class="input-large "
                                                           value="{{$account->name}}"
                                                           readonly/>
                                                    <input type="hidden" name="account_id"
                                                           value="{{$account->id}}"/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row-fluid">
                                        <div class="span12">
                                            <div class="par control-group">
                                                <label class="span4" style="text-align: right">Date
                                                    Before</label>

                                                <div class="controls span8">
                                                    <input type="text" name="date_before"
                                                           class="input-large account_open_balance_date_picker"
                                                           autocomplete="off"
                                                           @if(!empty($account->openBalance)) value="{{$account->openBalance->date}}" @endif/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row-fluid">
                                        <div class="span12">
                                            <div class="par control-group">
                                                <label class="span4" style="text-align: right">Amount</label>

                                                <div class="controls span8">
                                                    <input type="text" name="amount"
                                                           class="input-large number"
                                                           @if(!empty($account->openBalance)) value="{{number_format($account->openBalance->amount,2)}}"
                                                           @endif
                                                           autocomplete="off"/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row-fluid">
                                        <div class="span12">
                                            <div class="par control-group">
                                                <label class="span4" style="text-align: right">Currency</label>

                                                <div class="controls span8">
                                                    <select tabindex="2" class="chzn-1 span7" name="currency"
                                                            required>
                                                        <option value="USD"
                                                                @if(!empty($account->openBalance))
                                                                @if($account->openBalance->currency == 'USD') selected @endif
                                                                @endif
                                                        >USD
                                                        </option>
                                                        <option value="TSH"
                                                                @if(!empty($account->openBalance))
                                                                @if($account->openBalance->currency == 'TSH') selected @endif
                                                                @endif
                                                        >TSH
                                                        </option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row-fluid">
                                        <div class="span12">
                                            <div class="par control-group">
                                                <label class="span4" style="text-align: right">Exchange
                                                    Rate</label>

                                                <div class="controls span8">
                                                    <input type="text" name="exchange_rate"
                                                           class="input-large number"
                                                           @if(!empty($account->openBalance)) value="{{$account->openBalance->exchange_rate}}"
                                                           @endif
                                                           autocomplete="off"/>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row-fluid">
                                        <div class="span12">
                                            <div class="par control-group">
                                                <label class="span4" style="text-align: right">Remark</label>

                                                <div class="controls span8">
                                    <span class="field">
                                        <textarea cols="80" name="remark" rows="5" class="span9">
                                            @if(!empty($account->openBalance)) {{$account->openBalance->remark}} @endif
                                        </textarea>
                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div><!--#tabs-->
                                <div class="modal-footer">
                                    <div class="row">
                                        <div class="form-group">
                                            <button class="btn btn-primary" type="submit">SUBMIT</button>
                                            <button type="reset" class="btn" data-dismiss="modal">Close</button>
                                        </div>
                                    </div>
                                </div>
                                </form>
                            </div>
                        @endif
                        <a class="btn btn btn-mini edit_vendor" style="margin-left: 4px;"
                           onclick="modelShow('account_edit{{$account->id}}')">
                            <i class="icon-pencil icon"></i>
                        </a>

                        <div aria-hidden="false" aria-labelledby="myModalLabel" role="dialog" tabindex="-1"
                             class="modal hide fade in modal-1 account_open_balance_modal"
                             id="account_edit{{$account->id}}">
                            <!-- Modal content-->
                            {!! Form::open(array('route' => array('account.update'), 'class' => 'stdform','method'=>'post')) !!}
                            <div class="modal-header" style="background: #50A6C6">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4> EDIT ACCOUNT</h4>
                            </div>
                            <div class="modal-body">
                                <div class="row-fluid">
                                    <div class="row-fluid">
                                        <div class="span12">
                                            <div class="par control-group">
                                                <label class="control-label span4" for="vehicle_number">Account
                                                    Name</label>

                                                <div class="controls span8">
                                                    <input type="text" class="input-xlarge" name="account_name"
                                                           value="{{$account->name}}"/>
                                                    <input type="hidden" value="{{$account->id}}" name="account_id">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div><!--row-fluid-->
                            </div>
                            <div class="modal-footer">
                                <div class="row">
                                    <div class="form-group">
                                        <button class="btn btn-primary" type="submit">SUBMIT</button>
                                        <button type="reset" class="btn" data-dismiss="modal">Close</button>
                                    </div>
                                </div>
                            </div>
                            </form>
                        </div>

                        @if((($account->is_default == 0) AND ($account->account_group_id != 3) AND ($account->account_group_id != 4)) AND ($account->getIsDeleted()))
                            <button class="btn btn btn-mini btn-danger delete_account" style="margin-left: 4px;">
                                <i class="icon-trash icon"></i>
                            </button>
                        @endif
                        <input type="hidden" value="{{$account->id}}" class="account_id">
                    </div>
                </td>
            </tr>
        @endforeach
        </tbody>
    </table>

    <table class="hide">
        <tbody id="added_account">
        <tr>
            <td></td>
            <td><input name="account" value=""></td>
            <td>
                <select name="account_group">
                    <option></option>
                    @foreach($account_groups as $group)
                        <option value="{{$group->id}}">{{$group->name}}</option>
                    @endforeach
                </select>
            </td>
            <td>

            </td>
        </tr>
        </tbody>
    </table>

    <script>
        jQuery('#sub_account_id,.sub_account_id_edit').chosen();
        jQuery('.account_open_balance_date_picker').datepicker();

        jQuery("#add_accounts").on('submit', function (e) {
            e.preventDefault();
            jQuery.ajax({
                url: '{{ route('accounts.store') }}',
                type: 'post',
                data: jQuery("#add_accounts").serialize(),
                cache: false,
                success: function (html) {
                    location.reload();
                }
            });
        });

        jQuery(".delete_account").on('click', function (e) {
            e.preventDefault();
            var conf = confirm('Are you sure?');
            if (conf)
                var tr_p = jQuery(this).parents('tr');

            var account_id = tr_p.find('.account_id').val();

            jQuery.ajax({
                url: '{{ route('accounts.delete') }}',
                type: 'post',
                data: {
                    account_id: account_id
                },
                cache: false,
                success: function (html) {
                    location.reload();
                }
            });
        });

        jQuery('.open_balance_form').on('submit', function (e) {
            jQuery.ajaxSetup({
                header: jQuery('meta[name="_token"]').attr('content')
            })
            e.preventDefault(e);
            jQuery.ajax({
                type: "post",
                url: "{{route('accounts.open-balances.store')}}",
                data: jQuery(this).serialize(),
                success: function (data) {
                    if (data == 'DONE') {
                        jQuery(this).closest('.account_open_balance_modal').modal('toggle');
                        jQuery.jGrowl('{!! HTML::image('img/truck.png') !!} OPEN BALANCE UPDATED SUCCESSFUL ', {
                            theme: 'contrastBorder',
                            sticky: true
                        });
                    } else {
                        alert("FAIL TO UPDATE OPEN BALANCE");
                    }

                },
                error: function (data) {

                }
            })
        });
    </script>
@stop