@extends('backend.layouts.app')

@section('content')

<div class="aiz-titlebar text-left mt-2 mb-3">
    <h5 class="mb-0 h6">{{translate('Edit Seller Information')}}</h5>
</div>

<div class="col-lg-8 mx-auto">
    <div class="card">
        <div class="card-header">
            <h5 class="mb-0 h6">{{translate('Seller Information')}}</h5>
        </div>

        <div class="card-body">
            <h5 class="mb-3">{{translate('Seller Bank Information')}}</h5>
            <div class="shop_info">
                @foreach($shop->info_update_pending as $attr=>$value)

                    <div class="form-group row" >
                        <label class="col-sm-2 col-from-label" for="name">{{translate($attr)}}</label>
                        <div class="col-sm-5">
                            <input type="text" readonly  id="name" name="name" class="form-control" value="{{$value['value']}}">
                        </div>
                        <div  class="col-sm-5">
                            <button class="btn btn-success pending_values_approve"
                                    id="pending_values_approve"
                                    data-attribute="{{$attr}}"
                                    type="button"
                            >
                                approved
                            </button>
                            <button class="btn btn-danger pending_values_not_approved"
                                    id="pending_values_not_approved"
                                    data-attribute_not_approved="{{$attr}}"
                            >
                                not approved
                            </button>
                        </div>
                    </div>
                @endforeach
            </div>

        </div>
        <div class="card-body">
            <h5 class="mb-3">{{translate('Seller personal Information')}}</h5>
            <div class="user_info">
            @foreach($user->info_update_pending as $attr=>$value)
                <div class="form-group row">
                    <label class="col-sm-2 col-from-label" for="name">{{translate($attr)}}</label>
                    <div class="col-sm-5">
                        @if($attr =='avatar_original')
                            <img class="img-fluid lazyload"
                                 src="{{uploaded_asset($value['value'])}}">
                        @else
                            <input type="text" readonly  id="name" name="name" class="form-control" value="{{$value['value']}}">
                        @endif
                    </div>
                    <div  class="col-sm-5">
                        <button class="btn btn-success pending_values_approve"
                                id="pending_values_approve"
                                data-attribute="{{$attr}}"
                                type="button"
                        >
                            approved
                        </button>
                        <button class="btn btn-danger pending_values_not_approved"
                                id="pending_values_not_approved"
                                data-attribute_not_approved="{{$attr}}"
                        >
                            not approved
                        </button>
                    </div>
                </div>
            @endforeach
            </div>
        </div>
    </div>
</div>


<div class="modal fade" id="modalImages" tabindex="-1" role="dialog" aria-labelledby="exampleModalSizeLg"
     aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-body" id="modalImagesBody">
                <form>
                    <input id="attr" type="hidden">
                    <div class="row">
                        <div class="col">
                            <label class="col-form-label h3">{{translate('The Reason Of Refuse')}}</label>
                            <textarea name="note" id="note" class="form-control" rows="3"></textarea>
                        </div>
                    </div>
                    <br>
                    <div class="row text-center">
                        <div class="col">
                           <a id="module_refuse"  class="btn btn-danger" type="button">{{translate('Ok')}}</a>
                        </div>
                    </div>
                </form>
            </div>
        </div>

    </div>
</div>


@endsection
@section('script')
    <script>
        $(document).on('click','.pending_values_approve',function (e) {
            e.preventDefault();
            var approved = $(this).attr('data-attribute');
            console.log(approved)
            let shopDOM = '';
            let userDOM = '';
            $.ajax({
                url: "{{route('sellers.update_pending',$shop->id)}}",
                type: "GET",

                data: {_token:'{{ csrf_token() }}', attr:approved, status:'approved'},
                dataType: "json",

                success: function (response) {
                    console.log(response)
                    let shopInfo = response.data.shop;
                    let userInfo = response.data.user;

                    for (const shopInfoKey in shopInfo) {
                        if(shopInfo[shopInfoKey]['status'] === 'pending'){
                            shopDOM += `
                         <div class="form-group row" >
                        <label class="col-sm-2 col-from-label" for="name">${shopInfoKey}</label>
                        <div class="col-sm-5">
                            <input type="text" readonly placeholder="{{translate('Name')}}" id="name" name="name" class="form-control" value="${shopInfo[shopInfoKey]['value']}">
                        </div>
                        <div  class="col-sm-5">
                            <button class="btn btn-success pending_values_approve"
                                    id="pending_values_approve"
                                    data-attribute="${shopInfoKey}"
                                    type="button"
                            >
                                approved
                            </button>
                            <button class="btn btn-danger pending_values_not_approved"
                                    id="pending_values_not_approved"
                                    data-attribute_not_approved="${shopInfoKey}"
                            >
                                not approved
                            </button>
                        </div>
                    </div>`;
                        }

                    }
                    $('.shop_info').html(shopDOM);

                    for (const shopInfoKey in userInfo) {
                        if(userInfo[shopInfoKey]['status'] === 'pending'){
                            console.log(userInfo[shopInfoKey]=='avatar_original')
                            console.log(userInfo[shopInfoKey])
                            console.log(typeof userInfo[shopInfoKey])
                            userDOM += `
                         <div class="form-group row" >
                        <label class="col-sm-2 col-from-label" for="name">${shopInfoKey}</label>
                        <div class="col-sm-5">`;
                             if(shopInfoKey=='avatar_original'){

                                 userDOM +=  `<img class="img-fluid lazyload"
                                 src="uploaded_asset(${userInfo[shopInfoKey]['value']})">`;
                             }else {
                                 userDOM +=  ` <input type="text" readonly  id="name" name="name" class="form-control" value="${userInfo[shopInfoKey]['value']}">
`
                             }
                            userDOM += `</div>
                        <div  class="col-sm-5">
                            <button class="btn btn-success pending_values_approve"
                                    id="pending_values_approve"
                                    data-attribute="${shopInfoKey}"
                                    type="button"
                            >
                                approved
                            </button>
                            <button class="btn btn-danger pending_values_not_approved"
                                    id="pending_values_not_approved"
                                    data-attribute_not_approved="${shopInfoKey}"
                            >
                                not approved
                            </button>
                        </div>
                    </div>`;
                        }

                    }
                    $('.user_info').html(userDOM);
                    AIZ.plugins.notify('success', '{{ translate('Approved sellers updated successfully') }}');
                }
            });
        })


        $(document).on('click','.pending_values_not_approved',function (e) {
            e.preventDefault();
            var not_approved = $(this).attr('data-attribute_not_approved');
            $("#modalImages #attr").val( not_approved );
            $("#modalImages").modal('show')
        })



        $('#module_refuse').click(function (e) {
            e.preventDefault();
            let note = $('#note').val()
            let attr = $('#attr').val()
            let shopDOM = '';
            let userDOM = '';
            $.ajax({
                url: "{{route('sellers.update_pending',$shop->id)}}",
                type: "GET",

                data: {
                    _token:'{{ csrf_token() }}', attr:attr, note:note ,status:'not_approved'
                },
                dataType: "json",
                success: function (response) {
                    let shopInfo = response.data.shop;
                    let userInfo = response.data.user;
                    for (const shopInfoKey in shopInfo) {
                        if(shopInfo[shopInfoKey]['status'] === 'pending'){

                            shopDOM += `
                         <div class="form-group row" >
                        <label class="col-sm-2 col-from-label" for="name">${shopInfoKey}</label>
                        <div class="col-sm-5">
                            <input type="text" readonly id="name" name="name" class="form-control" value="${shopInfo[shopInfoKey]['value']}">
                        </div>
                        <div  class="col-sm-5">
                            <button class="btn btn-success pending_values_approve"
                                    id="pending_values_approve"
                                    data-attribute="${shopInfoKey}"
                                    type="button"
                            >
                                approved
                            </button>
                            <button class="btn btn-danger pending_values_not_approved"
                                    id="pending_values_not_approved"
                                    data-attribute_not_approved="${shopInfoKey}"
                            >
                                not approved
                            </button>
                        </div>
                    </div>`;
                        }

                    }
                    $('.shop_info').html(shopDOM);

                    for (const shopInfoKey in userInfo) {
                        if(userInfo[shopInfoKey]['status'] === 'pending'){

                            userDOM += `
                         <div class="form-group row" >
                        <label class="col-sm-2 col-from-label" for="name">${shopInfoKey}</label>
                        <div class="col-sm-5">
                            <input type="text" readonly  id="name" name="name" class="form-control" value="${userInfo[shopInfoKey]['value']}">
                        </div>
                        <div  class="col-sm-5">
                            <button class="btn btn-success pending_values_approve"
                                    id="pending_values_approve"
                                    data-attribute="${shopInfoKey}"
                                    type="button"
                            >
                                approved
                            </button>
                            <button class="btn btn-danger pending_values_not_approved"
                                    id="pending_values_not_approved"
                                    data-attribute_not_approved="${shopInfoKey}"
                            >
                                not approved
                            </button>
                        </div>
                    </div>`;
                        }

                    }
                    $('.user_info').html(userDOM);
                    AIZ.plugins.notify('success', '{{ translate('Approved sellers updated successfully') }}');
                    $('#note').val('')
                    $("#modalImages").modal('hide')
                }
            });
        })
    </script>
@endsection