@include('admin.layouts.header')
@include('admin.layouts.sidebar')
<div class="m-grid__item m-grid__item--fluid m-wrapper">
    <!-- BEGIN: Subheader -->
    <div class="m-subheader ">
        <div class="d-flex align-items-center">
            <div class="mr-auto">
                <h3 class="m-subheader__title m-subheader__title--separator">
                    Add Merchant Location
                </h3>
                <ul class="m-subheader__breadcrumbs m-nav m-nav--inline">
                    <li class="m-nav__item m-nav__item--home">
                        <a href="{{ asset('/') }}" class="m-nav__link m-nav__link--icon">
                            <i class="m-nav__link-icon la la-home"></i>
                        </a>
                    </li>
                    <li class="m-nav__separator">
                        -
                    </li>
                    <li class="m-nav__item">
                        <a href="{{ asset('admin-user') }}" class="m-nav__link">
                            <span class="m-nav__link-text">
                                 Merchant Location
                            </span>
                        </a>
                    </li>
                    <li class="m-nav__separator">
                        -
                    </li>
                    <li class="m-nav__item">
                        <a href="" class="m-nav__link">
                            <span class="m-nav__link-text">
                                Add
                            </span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- END: Subheader -->
    <div class="m-content">
        @if($errors->any())
            @foreach($errors->all() as $key => $error)
                <div class="alert alert-danger alert-dismissible fade show" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"></button>
                    {{$error}}
                </div>
            @endforeach
        @endif
        <div class="m-portlet m-portlet--mobile">
            @if(\Illuminate\Support\Facades\Session::has('Merchant_Center_View|1-0-1-0'))
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <span class="m-portlet__head-icon">
                            <i class="flaticon-add"></i>
                        </span>
                        <h3 class="m-portlet__head-text">
                            Add Merchant Location
                        </h3>
                    </div>
                </div>
            </div>
            @endif
            <!--begin::Form-->
            <form id="merchant_location_form" action="{{ asset('admin/merchant/location/add/'.$merchant_id) }}" class="m-form m-form--fit m-form--label-align-right" method="POST" enctype="multipart/form-data">
                <div class="m-portlet__body">
                    <div class="m-form__section m-form__section--first">
                        <input type="hidden" name="_token" value="{{csrf_token()}}" />
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                GST Number:
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="gst_number" value="{{ Request::old('gst_number') }}" placeholder="Enter GST Number">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Center Name:
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="name" value="{{ Request::old('name') }}" placeholder="Enter Center Name" required="">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Slug:
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="slug" value="{{ Request::old('slug') }}" placeholder="Enter merchant slug" required="">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Email:
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="email" value="{{ Request::old('email') }}" placeholder="Enter Email" required="">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Mobile Number:
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="phone" value="{{ Request::old('contact_number') }}" placeholder="Enter Mobile Number" maxlength="10" required="">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Address:
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="location" value="{{ Request::old('location') }}" placeholder="Enter Location" required="">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                State: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <select class="form-control" name="state" id="state" required>
                                    <option value="">Please select State</option>
                                    @foreach($state_list as $state_name)
                                        <option value="{!! $state_name->name !!}" <?php echo Request::old('state') == $state_name->name ? 'selected="selected"' : '' ?>>{!! $state_name->name !!}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Relation Ship Manager: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <select name="rm_id" id="rm" autocomplete="on" class="form-control" required="required">
                                    <option value="" disabled selected>Select Relation</option>
                                    @foreach($users as $user)
                                        <option value="{!! $user->id !!}" <?php echo Request::old('rm_id') == $user->id ? 'selected="selected"' : '' ?>>{!! $user->name !!}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Total Revenue Per Month: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" id="total_revenue_per_month" name="total_revenue_per_month" class="form-control" value="{{ Request::old('total_revenue_per_month') }}" placeholder="Enter total revenue per month" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Percentage of Sales in EMI: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-5">
                                <input type="text" id="percentage_of_sales_in_emi" name="percentage_of_sales_in_emi" class="form-control" value="{{ Request::old('percentage_of_sales_in_emi') }}" min='0' max='100' maxlength='3' placeholder="Enter value in percentage between 0 and 100" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')">
                            </div>
                            <div class="col-lg-1" style="font-size: x-large;padding: 0;">
                                %
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Number of lenders: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" id="number_of_lenders" name="number_of_lenders" class="form-control" value="{{ Request::old('number_of_lenders') }}" placeholder="Enter number of lenders" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Preferred number of visits required on a monthly basis: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" id="number_of_visits" name="number_of_visits" class="form-control" value="{{ Request::old('number_of_visits') }}" min='0' min='30' placeholder="Enter number of visits required" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Landmark (Between City/State): <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" id="landmark" name="landmark" class="form-control" value="{{ Request::old('landmark') }}" placeholder="Enter landmark between city or state">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Average Ticket Size: <span style="color: red">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" id="avg_ticket_size" name="avg_ticket_size" class="form-control" value="{{ Request::old('avg_ticket_size') }}" placeholder="Enter average ticket size">
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Potential number of applications on MOM Basis: <span style="color: red">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="number" class="form-control m-input" name="target_number_application" value="{{ Request::old('target_number_application',0) }}" placeholder="Enter target number of application on MOM basis" required="">
                            </div>
                        </div>

                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Potential value of applications on MOM Basis: <span style="color: red">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="number" class="form-control m-input" name="target_value_application" value="{{ Request::old('target_value_application',0) }}" placeholder="Enter target value of applications on MOM basis" required="">
                            </div>
                        </div>

                    </div>
                </div>
                @if(\Illuminate\Support\Facades\Session::has('Merchant_Center_View|1-0-1-0'))
                <div class="m-portlet__foot m-portlet__foot--fit">
                    <div class="m-form__actions m-form__actions">
                        <button type="submit" class="btn btn-primary">
                            Submit
                        </button>
                        <button type="reset" onclick="window.history.back()" class="btn btn-secondary">
                            Cancel
                        </button>
                    </div>
                </div>
                @endif
            </form>
            <!--end::Form-->
        </div>
    </div>
</div>
@include("admin.layouts.footer")

<script>
    // var total_revenue = 0;
    // var precentage_of_sales = 0;
    // var lenders_number = 0;
    // var ticket_size = 0;

    // $('input[name="total_revenue_per_month"]').on('change', function(){
    //     if(this.value > 0){
    //         total_revenue = this.value;
    //         if($('input[name="percentage_of_sales_in_emi"]').val() > 0){
    //             precentage_of_sales = $('input[name="percentage_of_sales_in_emi"]').val();
    //         }
    //         if($('input[name="number_of_lenders"]').val() > 0){
    //             lenders_number = $('input[name="number_of_lenders"]').val();
    //         }
    //         if($('input[name="avg_ticket_size"]').val() > 0){
    //             ticket_size = $('input[name="avg_ticket_size"]').val();
    //         }
    //         var calculatePotentialNumber = (((total_revenue * (precentage_of_sales /100))/lenders_number)/ticket_size);
    //         $('input[name="target_number_application"]').val(Math.round(calculatePotentialNumber));
    //         var calculatePotentialValue = ((total_revenue * (precentage_of_sales /100))/lenders_number);
    //         $('input[name="target_value_application"]').val(Math.round(calculatePotentialValue));
    //     }
    // });
    // $('input[name="percentage_of_sales_in_emi"]').on('change', function(){
    //     if(this.value > 0){
    //         precentage_of_sales = this.value;
    //         if($('input[name="total_revenue_per_month"]').val() > 0){
    //             total_revenue = $('input[name="total_revenue_per_month"]').val();
    //         }
    //         if($('input[name="number_of_lenders"]').val() > 0){
    //             lenders_number = $('input[name="number_of_lenders"]').val();
    //         }
    //         if($('input[name="avg_ticket_size"]').val() > 0){
    //             ticket_size = $('input[name="avg_ticket_size"]').val();
    //         }
    //         var calculatePotentialNumber = (((total_revenue * (precentage_of_sales /100))/lenders_number)/ticket_size);
    //         $('input[name="target_number_application"]').val(Math.round(calculatePotentialNumber));
    //         var calculatePotentialValue = ((total_revenue * (precentage_of_sales /100))/lenders_number);
    //         $('input[name="target_value_application"]').val(Math.round(calculatePotentialValue));
    //     }
    // });
    // $('input[name="number_of_lenders"]').on('change', function(){
    //     if(this.value > 0){
    //         lenders_number = this.value;
    //         if($('input[name="total_revenue_per_month"]').val() > 0){
    //             total_revenue = $('input[name="total_revenue_per_month"]').val();
    //         }
    //         if($('input[name="percentage_of_sales_in_emi"]').val() > 0){
    //             precentage_of_sales = $('input[name="percentage_of_sales_in_emi"]').val();
    //         }
    //         if($('input[name="avg_ticket_size"]').val() > 0){
    //             ticket_size = $('input[name="avg_ticket_size"]').val();
    //         }
    //         var calculatePotentialNumber = (((total_revenue * (precentage_of_sales /100))/lenders_number)/ticket_size);
    //         $('input[name="target_number_application"]').val(Math.round(calculatePotentialNumber));
    //         var calculatePotentialValue = ((total_revenue * (precentage_of_sales /100))/lenders_number);
    //         $('input[name="target_value_application"]').val(Math.round(calculatePotentialValue));
    //     }
    // });
    // $('input[name="avg_ticket_size"]').on('change', function(){
    //     if(this.value > 0){
    //         ticket_size = this.value;
    //         if($('input[name="total_revenue_per_month"]').val() > 0){
    //             total_revenue = $('input[name="total_revenue_per_month"]').val();
    //         }
    //         if($('input[name="percentage_of_sales_in_emi"]').val() > 0){
    //             precentage_of_sales = $('input[name="percentage_of_sales_in_emi"]').val();
    //         }
    //         if($('input[name="number_of_lenders"]').val() > 0){
    //             lenders_number = $('input[name="number_of_lenders"]').val();
    //         }
    //         var calculatePotentialNumber = (((total_revenue * (precentage_of_sales /100))/lenders_number)/ticket_size);
    //         $('input[name="target_number_application"]').val(Math.round(calculatePotentialNumber));
    //         var calculatePotentialValue = ((total_revenue * (precentage_of_sales /100))/lenders_number);
    //         $('input[name="target_value_application"]').val(Math.round(calculatePotentialValue));
    //     }
    // });

    $(document).on("submit", "#merchant_location_form", function (event) {
        var form = this;
        event.preventDefault();

        if($('input[name="total_revenue_per_month"]').val().length <= 0){
            alert('Total revenue value is missing');
            return false;
        }
        if($('input[name="number_of_lenders"]').val().length <= 0){
            alert('Number of lender is missing');
            return false;
        }
        if($('input[name="landmark"]').val().length <= 0){
            alert('Landmark value is missing');
            return false;
        }

        if($('input[name="percentage_of_sales_in_emi"]').val().length <= 0){
            alert('Sale percentage value is missing');
            return false;
        }else if($('input[name="percentage_of_sales_in_emi"]').val() < 0 || $('input[name="percentage_of_sales_in_emi"]').val() > 100){
            alert('Entered value must be in between 0 to 100');
            $('input[name="percentage_of_sales_in_emi"]').css({'border-color':'red'});
            let topC = $('input[name="percentage_of_sales_in_emi"]').offset().top;
            if(topC) {
                $('html, body').animate({scrollTop: topC - 150}, 'slow');
            }
            return false;
        }
        if($('input[name="number_of_visits"]').val().length <= 0){
            alert('Visit number is missing');
            return false;
        }else if($('input[name="number_of_visits"]').val() < 0 || $('input[name="number_of_visits"]').val() > 30){
            alert('Entered value must be in between 0 to 30');
            $('input[name="number_of_visits"]').css({'border-color':'red'});
            let topC = $('input[name="number_of_visits"]').offset().top;
            if(topC) {
                $('html, body').animate({scrollTop: topC - 150}, 'slow');
            }
            return false;
        }
        if($('input[name="avg_ticket_size"]').val().length <= 0){
            alert('Averge ticket value is missing');
            return false;
        }

        form.submit();
    });
    
</script>