@extends('reachassuree_admin/layouts.main')
@section('title', $data['title'])
@section('content')
<style>
    ::-webkit-scrollbar {

        width: 16px;

    }

    ::-webkit-scrollbar-thumb {

        background-color: #d6dee1;

        border-radius: 20px;

        border: 6px solid transparent;

        background-clip: content-box;

    }

    ::-webkit-scrollbar-thumb:hover {

        background-color: #a8bbbf;

    }

    ::-webkit-scrollbar-track {

        background-color: transparent;

    }

    .pos-middle {

        vertical-align: middle;

    }
</style>
<style>
    table,
    th,
    td {
        text-align: "center";
        border: 1px solid black;
        border-collapse: collapse;
    }
</style>
<div class="page-content">
    <div class="container-fluid">
    @include('../reachassuree_admin/comman/header')
        
        <!-- start row -->
        <div class="row ">

            <div class="card">

                <div class="card-body">

                    <form action="{{route('subscription.plan.feature.save')}}" method="POST" id="subscriptionplan" class="needs-validation" novalidate enctype="multipart/form-data">
                        @csrf
                        <table class="table">

                            <div class="row">
                                <tr>
                                    <th>Feature Name</th>
                                    <th>HSN/SAC</th>
                                    <th>Unit</th>
                                    @foreach ($data['product_features'] as $key => $value)
                                <tr>
                                    <td>
                                        <input type="hidden" class="form-control" id="subscription_plan_id" name="subscription_plan_id" value="{{$data['subscription_plan_id']}}" required>
                                        <input type="hidden" class="form-control" id="product_feature_id" name="product_feature_id[{{$value['id']}}]" value="{{$value['id']}}" required>
                                        <input type="text" disabled name="name" class="form-control" id="name" name="name" value="{{$value['name']}}	" required>
                                    </td>
                                    <td>
                                        <input type="text" disabled name="code" class="form-control" id="code" name="code" value="{{$value['code']}}	" required>
                                    </td>
                                    <td>
                                        <input type="text" class="form-control" id="unit" name="unit[{{$value['id']}}]" placeholder="Unit Enter" value="{{$value['unit']}}" required>
                                    </td>
                                </tr>
                                @endforeach
                        </table>
                        <div class="row">
                            <div class="col-md-1">
                                <div class="mb-1">

                                    <label  class="form-label">&nbsp;&nbsp;&nbsp;&nbsp;</label>
                                    <button type="submit" class="form-control btn btn-primary" id="btnsubscriptionplanSave">Save</button>
                                </div>
                            </div>
                        </div>
                </div>
                </form>
            </div>
        </div>

        <!-- end row -->
    </div>
</div>


@endsection('content')
@section('custom-scripts')

<script src="{{ asset('ra-assets/libs/parsleyjs/parsley.min.js') }}"></script>
<script src="{{ asset('ra-assets/js/pages/form-validation.init.js') }}"></script>
<script src="{{ asset('ra-assets/js/pages/jquery.form.js') }}"></script>
<script type="text/javascript">
var addForm = "{{route('subscription.plan')}}";

    $(document).ready(function() {

        var options = {
            beforeSubmit: showRequest, // pre-submit callback
            success: showResponse // post-submit callback
        };
         $('#subscriptionplan').submit(function() {
            $(this).ajaxSubmit(options);
            return false;
        });
    });

    function showRequest(formData, jqForm, options) {
        var queryString = $.param(formData);
        return true;
    }

    // post-submit callback
    function showResponse(responseText, statusText, xhr, $form) {

        if (responseText['status'] == 1) {
            toastr["success"](responseText['msg']);
            window.location = addForm;
        } else if (responseText['status'] == 0) {
            if (typeof responseText['data'] !== "undefined") {
                var size = Object.keys(responseText['data']).length;
                if (size > 0) {
                    for (var [key, value] of Object.entries(responseText['data'])) {
                        toastr["error"](value);
                    }
                }
            } else {
                toastr["error"](responseText['msg']);
            }
        }
    }
</script>

@endsection