@extends('layouts/gnr_layout')
@section('title', '| Edit Branch Requisition')
@section('content')
<style>
    .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 33px;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow b {
        border-color: #ccc transparent transparent transparent;
        margin-left: -5px;
        margin-top: 0px;
    }
    .select2-container .select2-selection--single .select2-selection__rendered {
        font-size: 11px;
    }
    .select2-container--default .select2-results>.select2-results__options {
        font-size: 11px !important;
    }
    .select2-search--dropdown .select2-search__field {
        outline: 0;
    }
    .select2-container--default .select2-selection--single {
        border: 1px solid #e4e4e4 !important;
        border-radius: 0px !important;
    }
</style>
<div class="row add-data-form">
    <div class="col-md-12">
        <div class="col-md-1"></div>
        {{-- fullbody start  --}}
        <div class="col-md-10 fullbody">
            <div class="viewTitle" style="border-bottom: 1px solid white;">
                <a href="{{route('requisition.view')}}" class="btn btn-info pull-right addViewBtn"><i class="glyphicon glyphicon-th-list viewIcon"> </i>Requisition List</a>
            </div>

            {{-- panel start  --}}
            <div class="panel panel-default panel-border">
                <div class="panel-heading">
                    <div class="panel-title">Update Branch Requisition</div>
                </div>
                {{-- panel body start  --}}
                <div class="panel-body">
                    <div class="row">
                        {{-- <form class="form-horizontal form-groups" action="{{route('requisition.update',$data['requisition']->id)}}" method="post" role="form"> --}}
                        <form class="form-horizontal form-groups" action="" method="post" role="form">

                            {{-- left start --}}
                            <input type="hidden" name="requisitionId" value="{{$data['requisition']->id}}">
                            <div class="col-md-6">

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Branch Name:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('name', 'Branch Name:', ['class' => 'col-sm-4 control-label'],false) !!} --}}
                                    <div class="col-sm-8">
                                        <input class="form-control" type="text" name="name" placeholder="Enter branch name" value="{{$data['requisition']->name}}" autocomplete = 'off' />
                                        {{-- {!! Form::text('name', $value = null, ['class' => 'form-control', 'id' => 'name','type' => 'text', 'placeholder' => 'Enter branch name']) !!} --}}
                                        <p id='namee' style="max-height:3px;"></p>
                                    </div>
                                </div>


                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Project Type:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('projectTypeId', 'Project Type:', ['class' => 'col-sm-4 control-label'],false) !!} --}}
                                    <div class="col-sm-8">
                                        <select class="form-control" id="projectTypeId" name="projectTypeId" >
                                            <option value="">Select Project</option>
                                            @foreach ($data['projectTypeId'] as $key=>$value)
                                                <option value="{{$key}}" @if ($data['requisition']->projectTypeId == $key) selected @endif>{{$value}}</option>
                                            @endforeach
                                        </select>
                                        <p id='projectTypeIde' style="max-height:3px;"></p>
                                    </div>
                                </div>


                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Branch Code:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('branchCode', 'Branch Code:', ['class' => 'col-sm-4 control-label'],false) !!} --}}
                                    <div class="col-sm-8">
                                        <input class="form-control" type="text" name="branchCode" placeholder="Enter branc code" value="{{$data['requisition']->branchCode}}">
                                        {{-- {!! Form::text('branchCode', $value = null, ['class' => 'form-control', 'id' =>'branchCode', 'type' => 'text', 'placeholder' => 'Enter branc code']) !!} --}}
                                        <p id='branchCodee' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Group Name:<sup class="text-danger">*<sup></label>
                                    <div class="col-sm-8">
                                        <select name="groupId" class="form-control" id="exampleFormControlSelect1">
                                            <option value=" ">Please Select Group Name</option>
                                            @foreach ($data['groupId'] as $key=>$value)
                                                <option value="{{$key}}" @if ($data['requisition']->groupId == $key) selected @endif>{{$value}}</option>
                                            @endforeach
                                        </select>
                                        <p id='groupIde' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('companyId', 'Company Name:<sup class="text-danger">*<sup>', ['class' => 'col-sm-4 control-label'],false) !!}
                                    <div class="col-sm-8">
                                        <select name="companyId" class="form-control" id="exampleFormControlSelect1">
                                            <option value=" ">Please Select Company Name</option>
                                            @foreach ($data['companyId'] as $key=>$value)
                                                <option value="{{$key}}" @if ($data['requisition']->companyId == $key) selected @endif>{{$value}}</option>
                                            @endforeach
                                        </select>
                                        {{--{!! Form::select('companyId', $companyId, null, array('class'=>'form-control', 'id' => 'companyId')) !!} --}}
                                        <p id='companyIde' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Project Name:<sup class="text-danger">*<sup></label>
                                    <div class="col-sm-8">
                                        <select name="projectId" class="form-control" id="exampleFormControlSelect1">
                                            <option value=" ">Please Select Project Name</option>
                                            @foreach ($data['projectId'] as $key=>$value)
                                                <option value="{{$key}}" @if ($data['requisition']->projectId == $key) selected @endif>{{$value}}</option>
                                            @endforeach
                                        </select>
                                        <p id='projectIde' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="" >Project Type:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('projectTypeId', 'Project Type:', ['class' => 'col-sm-4 control-label'],false)
                                    !!} --}}
                                    <div class="col-sm-8">
                                        <select name="projectTypeId" class="form-control" id="exampleFormControlSelect1">
                                            <option value=" ">Please Select</option>
                                            @foreach ($data['projectTypeId'] as $key=>$value)
                                                <option value="{{$key}}" @if ($data['requisition']->projectTypeId == $key) selected @endif>{{$value}}</option>
                                            @endforeach
                                        </select>
                                        <p id='projectTypeIde' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Contact Person:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('contactPerson', 'Contact Person:', ['class' => 'col-sm-4 control-label'],false) !!} --}}
                                    <div class="col-sm-8">
                                        <input class="form-control" type="text" name="contactPerson" placeholder="Enter contact person name" value="{{$data['requisition']->contactPerson}}" autocomplete = 'off'/>
                                        <p id='contactPersone' style="max-height:3px;"></p>
                                    </div>
                                </div>
                            </div>
                            {{-- left end --}}
                            {{-- right start --}}
                            <div class="col-md-6">

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Mobile:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('phone', 'Mobile:', ['class' => 'col-sm-4 control-label'],false) !!} --}}
                                    <div class="col-sm-8">
                                        <input class="form-control" type="tel" name="phone" id="" placeholder="Enter phone number" value="{{$data['requisition']->phone}}" autocomplete = 'off'/>
                                        {{-- {!! Form::text('phone', $value = null, ['class' => 'form-control', 'id' => 'phone', 'type' => 'text', 'placeholder' => 'Enter phone number']) !!} --}}
                                        <p id='phonee' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Email:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('email', 'Email:', ['class' => 'col-sm-4 control-label'],false) !!} --}}
                                    <div class="col-sm-8">
                                        <input class="form-control" type="email" name="email" id="" placeholder="Enter email address" value="{{$data['requisition']->email}}" autocomplete = 'off'/>
                                        {{-- {!! Form::text('email', $value = null, ['class' => 'form-control', 'id' => 'email', 'type' => 'text', 'placeholder' => 'Enter email address']) !!} --}}
                                        <p id='emaile' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">Address:<sup class="text-danger">*<sup></label>
                                    {{-- {!! Form::label('address', 'Address:', ['class' => 'col-sm-4 control-label'],false) !!} --}}
                                    <div class="col-sm-8">
                                        <textarea class="form-control" name="address" id="" cols="2" rows="2" placeholder="Enter address" autocomplete = 'off'>{{$data['requisition']->address}}</textarea>
                                        {{-- {!! Form::textarea('address', $value = null, ['class' => 'form-control', 'id' => 'address', 'rows' => 2, 'type' => 'text', 'placeholder' => 'Enter address']) !!} --}}
                                        <p id='addresse' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('district_code', 'District:', ['class' => 'col-sm-4 control-label'],false) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('district_code', ['' => 'Please Select District'] + $data['districtCodes'], $data['district']->district_code ?? null, array('class'=>'form-control select2', 'id'=> 'district_code')) !!}
                                        <p id='district_code_msg' style="max-height:3px;"></p>
                                    </div>
                                </div>
                                <div class="form-group">
                                    {!! Form::label('thana_code', 'Upazila:', ['class' => 'col-sm-4 control-label'],false) !!}
                                    <div class="col-sm-8">
                                        {!! Form::select('thana_code', ['' => 'Please Select Thana'], null, ['class' => 'form-control select2', 'id' => 'thana_code']) !!}
                                        <p id='thana_code_msg' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('branchOpeningDate', 'B. Opening Date:<sup class="text-danger">*<sup>', ['class' => 'col-sm-4
                                    control-label'],false) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('branchOpeningDate', $value = $data['requisition']->branchOpeningDate, ['class' => 'form-control', 'id' => 'branchOpeningDate', 'type' => 'text', 'placeholder' => 'Enter Branch Opening Date:', 'autocomplete' => 'off']) !!}
                                        <p id='phonee' style="max-height:3px;"></p>
                                    </div>
                                </div>

                                <div class="form-group">
                                    {!! Form::label('softwareStartDate', 'S. Opening Date:<sup class="text-danger">*<sup>', ['class' => 'col-sm-4
                                    control-label'],false) !!}
                                    <div class="col-sm-8">
                                        {!! Form::text('softwareStartDate', $value = $data['requisition']->softwareStartDate, ['class' => 'form-control', 'id'=> 'softwareStartDate', 'type' => 'text', 'placeholder' => 'Enter Software Opening Date', 'autocomplete' => 'off']) !!}
                                        <p id='softwareStartDatee' style="max-height:3px;"></p>
                                    </div>
                                </div>

                            </div>
                            {{-- right end --}}
                            {{-- buttons start  --}}
                            <div class="form-group">
                                {!! Form::label('submit', ' ', ['class' => 'col-sm-0 control-label'],false) !!}
                                <div class="col-sm-12 text-center">
                                    {{-- <button type="submit" class="btn btn-info">Submit</button> --}}
                                    {!! Form::submit('Update', ['id' => 'add', 'class' => 'btn btn-info']); !!}
                                    <a href="{{route('requisition.view')}}" class="btn btn-danger closeBtn">Close</a>
                                    <span id="success" style="color:green; font-size:20px;" class="pull-right"></span>
                                </div>
                            </div>
                            {{-- buttons end  --}}
                        </form>
                    </div>
                </div>
                {{-- panel body end  --}}
            </div>
            {{-- panel end  --}}
            <div class="footerTitle" style="border-top:1px solid white"></div>
        </div>
        {{-- fullbody end  --}}
        <div class="col-md-1"></div>
    </div>
    </div>
    </div>
</div>
@endsection



{{-- SCRIPTS  --}}

<script src="{{asset('js/jquery-1.11.1.min.js')}}"></script>

<script type="text/javascript">
    $(document).ready(function () {

        $(function () {
            $("#branchOpeningDate").datepicker({
                changeMonth: true,
                changeYear: true
            });
        });

        $(function () {
            $("#softwareStartDate").datepicker({
                changeMonth: true,
                changeYear: true
            });
        });

        // form submit
        $('form').submit(function (event) {
            event.preventDefault();
            var id = $("input[name=requisitionId]").val();
            var url = "{{ route('requisition.update', ":id") }}";
            url = url.replace(':id', id);

            $.ajax({
                type: 'post',
                url: url,
                data: $('form').serialize(),
                dataType: 'json',
                success: function (_response) {
                    console.log(_response);
                    if (_response.responseTitle == "Error") {
                        if (_response.responseText['name']) {
                            $('#namee').empty();
                            $('#namee').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.name + '</span>');
                            return false;
                        }
                        if (_response.responseText['branchCode']) {
                            $('#branchCodee').empty();
                            $('#branchCodee').show();
                            $('#branchCodee').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.branchCode + '</span>');
                            return false;
                        }
                        if (_response.responseText['groupId']) {
                            $('#groupIde').empty();
                            $('#groupIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.groupId + '</span>');
                            return false;
                        }
                        if (_response.responseText['companyId']) {
                            $('#companyIde').empty();
                            $('#companyIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.companyId + '</span>');
                            return false;
                        }
                        if (_response.responseText['projectId']) {
                            $('#projectIde').empty();
                            $('#projectIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.projectId + '</span>');
                            return false;
                        }
                        if (_response.responseText['projectTypeId']) {
                            $('#projectTypeIde').empty();
                            $('#projectTypeIde').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.projectTypeId + '</span>');
                            return false;
                        }
                        if (_response.responseText['contactPerson']) {
                            $('#contactPersone').empty();
                            $('#contactPersone').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.contactPerson + '</span>');
                            return false;
                        }
                        if (_response.responseText['email']) {
                            $('#emaile').empty();
                            $('#emaile').show();
                            $('#emaile').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.email + '</span>');
                            return false;
                        }
                        if (_response.responseText['phone']) {
                            $('#phonee').empty();
                            $('#phonee').show();
                            $('#phonee').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.phone + '</span>');
                            return false;
                        }
                        if (_response.responseText['address']) {
                            $('#addresse').empty();
                            $('#addresse').append(
                                '<span class="errormsg" style="color:red;">' + _response
                                .responseText.address + '</span>');
                            return false;
                        }
                    } else {
                        $("#name").val('');
                        $("#groupId").val('');
                        $("#companyId").val('');
                        $("#projectId").val('');
                        $("#projectTypeId").val('');
                        $("#contactPerson").val('');
                        $("#email").val('');
                        $("#phone").val('');
                        $("#address").val('');
                        $("#branchCode").val('');
                        $("#branchOpeningDate").val('');
                        $("#softwareStartDate").val('');
                        $('.error').addClass("hidden");
                        // $('#success').text(_response.responseText);
                        if(_response.responseTitle == "Success!"){
                            toastr.success(_response.responseText, _response.responseTitle, opts);
                            setTimeout(function(){
                                window.location.href =
                                "{{route('requisition.view')}}";
                            }, 2000);
                        }
                    }
                },
                error: function (_response) {
                    //alert(_response.errors);
                }
            });
        });

        // form input
        $("input").keyup(function () {
            var name = $("#name").val();
            if (name) {
                $('#namee').hide();
            } else {
                $('#namee').show();
            }
            var branchCode = $("#branchCode").val();
            if (branchCode) {
                $('#branchCodee').hide();
            } else {
                $('#branchCodee').show();
            }
            var contactPerson = $("#contactPerson").val();
            if (contactPerson) {
                $('#contactPersone').hide();
            } else {
                $('#contactPersone').show();
            }
            var email = $("#email").val();
            if (email) {
                $('#emaile').hide();
            } else {
                $('#emaile').show();
            }
            var phone = $("#phone").val();
            if (phone) {
                $('#phonee').hide();
            } else {
                $('#phonee').show();
            }
            var email = $("#email").val();
            if (emaile) {
                $('#emaile').hide();
            } else {
                $('#emaile').show();
            }
        });

        $("textarea").keyup(function () {
            var address = $("#address").val();
            if (address) {
                $('#addresse').hide();
            } else {
                $('#addresse').show();
            }
        });

        $('select').on('change', function (e) {
            var groupId = $("#groupId").val();
            if (groupId) {
                $('#groupIde').hide();
            } else {
                $('#groupIde').show();
            }
            var companyId = $("#companyId").val();
            if (companyId) {
                $('#companyIde').hide();
            } else {
                $('#companyIde').show();
            }
            var projectId = $("#projectId").val();
            if (projectId) {
                $('#projectIde').hide();
            } else {
                $('#projectIde').show();
            }
            var projectTypeId = $("#projectTypeId").val();
            if (projectTypeId) {
                $('#projectTypeIde').hide();
            } else {
                $('#projectTypeIde').show();
            }

            if (companyId) {
                $.ajax({
                    url: 'getCompanyDetails/' + companyId,
                    type: 'get',
                    dataType: 'json',
                    success: function (response) {
                        $('#mfiCode').val(response.companyCode);
                    }
                });
            }
        });

    });

    // project change
    $(document).ready(function () {
        $("#projectId").change(function () {
            $("#projectTypeId").empty();
            $("#projectTypeId").prepend('<option selected="selected" value="">Please Select</option>');
            var projectId = $('#projectId').val();

            $.ajax({
                type: 'post',
                url: './projectIdSendGetPTypeId',
                data: {
                    '_token': $('input[name=_token]').val(),
                    'projectId': projectId
                },
                dataType: 'json',
                success: function (_response) {
                    $.each(_response, function (index, value) {
                        $('#projectTypeId').append("<option value='" + index +
                            "'>" + value + "</option>");
                    });
                }
            });
        });
    });


    $('#fundTransferForm').submit(function(event) {
        event.preventDefault();
        $.ajax({
            type: 'post',
            url: "{{ url('adviceFundTransferDdiItem/') }}",
            data: $('#fundTransferForm').serialize(),
            dataType: 'json',
            success: function(data) {
                if (data.errors) {
                } else {
                    if(data.responseTitle == "Success!"){
                        toastr.success(data.responseText, data.responseTitle, opts);
                        setTimeout(function(){
                            window.location.href =
                            "{{ url('fundTransferDdiRegisterListFiltering/') }}";
                        }, 2000);
                    }else{
                        toastr.warning(data.responseText, data.responseTitle, opts);
                    }
                }
            },
            error: function(_response) {
                // Handle error
                alert(_response.errors);
            }
        });
    });

    // District Change Event
    $(document).ready(function () {
        var selectedThanaCode = '{{ $data['requisition']->thanaCode ?? '' }}';

        $('#district_code').change(function () {
            // Get the selected district code
            var district_code = $(this).val();

            // Clear and disable the thana_code dropdown if no district is selected
            $('#thana_code').empty().append('<option value="">Please Select Upazila</option>');

            if (district_code) {

                // Make AJAX request to fetch thanas based on selected district
                $.ajax({
                    type: 'POST',
                    url: '{{ route("getThanaCodesByDistrict") }}',
                    data: {
                        district_code: district_code,
                        _token: '{{ csrf_token() }}'
                    },
                    success: function (response) {
                        $.each(response, function (thana_code, thana_name) {
                            $('#thana_code').append('<option value="' + thana_code + '">' + thana_name + '</option>');
                        });
                        if (selectedThanaCode) {
                            $('#thana_code').val(selectedThanaCode);
                            selectedThanaCode = '';
                        }
                    },
                    error: function () {
                        alert('Unable to fetch upazilas, please try again.');
                    }
                });
            }
        });

        // $('label[for="district_code"], label[for="thana_code"]').each(function() {
        //     $(this).append(' <small class="text-muted" style="font-size: 70%;">(Optional)</small>');
        // });

        if ($('#district_code').val()) {
            $('#district_code').trigger('change');
        }
    });



</script>