@extends('adminlte::page') @section('content')
    <?php Fun::lang()?>
    <div class="title-page">
        <div class="page-bar">
            <ul class="page-breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
                <li><a href="#">Accounting Setup</a></li>
                <li><a href="#">Create Account Chart</a></li>
            </ul>
        </div>
    </div>
    <div class="page">

        <div class="top-content">
            <div class="row">
                <div class="col-sm-12 col-xs-12">
                    <div class="title-add">
                        <div class="pull-left">
                            <h3>Create Account Chart</h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12 col-xs-12">

                <div class="form-wrapper">
                    {!! Form::open(array('route' => 'account-chart.store','method'=>'POST','enctype'=>'multipart/form-data')) !!}
                    <div class="card card-default">
                        <div class="card-body">
                            <div class="form-group row">
                                <div class="col-sm-4 col-12">
                                    <label for="name" class="required">Account Type</label>
                                    {!! Form::select('acctype', $account_type, null, ['class' => 'form-control select2','id'=>'account-type','required']) !!}
                                </div>
                                <div class="col-sm-4 col-12">
                                    <label class="required">Sub Account Of </label>
                                    {{--                            {!! Form::select('acc_type_name', null, null, ['class' => 'form-control select2','id'=>'acc-type','required']) !!}--}}
                                    <select class="form-control select2" id="acc-type" name="acc_type_name" required></select>

                                </div>
                                <div class="col-sm-4 col-12">
                                    <label class="required">Account Number</label>
                                    <input type="text" class="form-control" name="acc_num" id="acc_num" required>
                                </div>
                            </div>

                            <div class="form-group row">

                                <div class="col-sm-4 col-xs-12 ">
                                    <label for="name" class="required">Sub Account</label>
                                    {!! Form::text('acc_name', null, array('placeholder' =>'Name','class' => 'form-control','required')) !!}
                                </div>
                                <div class="col-sm-4 col-xs-12">
                                    <label for="name" class="required">Sub Account Khmer</label>
                                    {!! Form::text('acc_namekh', null, array('placeholder' => 'Name Khmer','class' => 'form-control')) !!}
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-sm-12 col-xs-12 ">
                                    <label for="name" >Description</label>
                                    {!! Form::textarea('acc_des', null, array('placeholder' => 'Description','class' => 'form-control','rows'=>'3')) !!}
                                </div>
                            </div>
                        </div>
                        <div class="card-footer">
                            <div style="text-align: right;">
                                <button type="button" class="btn btn-sm btn-info" onclick="window.history.go(-1)"><i class="fa fa-arrow-circle-left"></i> Back</button>
                                <button type="submit" class="btn btn-sm btn-success"><i class="fa fa-save"></i> Save</button>
                            </div>
                        </div>
                    </div>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
@endsection @section('js')
    <script type="text/javascript">
        $(document).on('change','#account-type',function () {
            var type_id = $(this).find('option:selected').val();
            var route = "{{route('account-type.show',':id')}}";
            route = route.replace(':id', type_id);
            $.ajax({
                type: 'get',
                url: route,
                async: false,
                success: function(response) {
                    $('#acc-type').html(response);

                    $('select[name="acc_type_name"]').select2({
                        templateResult: function(data) {
                            if (!data.element) {
                                return data.text;
                            }
                            var $element = $(data.element);
                            var $wrapper = $('<span></span>');
                            $wrapper.addClass($element[0].className);
                            $wrapper.text(data.text);
                            return $wrapper;
                        }
                    });
                }
            });

        });
        $(document).on('change','#acc-type',function () {
            var chart_id = $(this).find('option:selected').val();
            var route = "{{route('get-account-code',':id')}}";
            route = route.replace(':id', chart_id);
            $.ajax({
                type: 'get',
                url: route,
                async: false,
                success: function(response) {
                    $('#acc_num').val(response);
                }
            });

        });

        $('.errors').hide();
        $('#form-acc').validate({
            rules :
                {
                    'acctype' : {required:true},
                    'accounttype' : {required:true}
                },
            message :
                {
                    'acctype' : 'Account Type is required',
                    'accounttype' : 'Account Type is required '
                }
        });
        $(document).on("change",'#acc-check',function(){
            if(this.checked)
            {
                $('#sub-account-type').removeAttr('disabled');
                $('#sub-account-type').prop('required');
            }
            else
            {
                $('#sub-account-type').val(1).trigger('change.select2');
                $('#sub-account-type').prop('disabled',true);
            }
        });
    </script>

@endsection