@extends('layout.header')
@section('title')
    ALIAN | Retail Orders
@endsection
@section('main')
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <div class="m-grid__item m-grid__item--fluid m-wrapper">
        <!-- BEGIN: Subheader -->
        <div class="m-subheader ">
            <div class="d-sm-flex align-items-center subheader_border_bottom">
                <div class="mr-auto">
                    <h3 class="m-subheader__title m-subheader__title--separator">
                        Retail Orders
                    </h3>
                    <ul class="m-subheader__breadcrumbs m-nav m-nav--inline">
                        <li class="m-nav__item m-nav__item--home">
                            <a href="#" 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="" class="m-nav__link">
                                            <span class="m-nav__link-text">
                                                Retail Orders
                                            </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">--}}
                        {{--Inventory--}}
                        {{--</span>--}}
                        {{--</a>--}}
                        {{--</li>--}}
                    </ul>
                </div>
            </div>
        </div>

        <!-- END: Sub header -->
        <!-- START :: main Content-->
        <div class="m-content">
            <div class="m-portlet m-portlet--mobile margin_bottom_30">
                <div class="m-portlet__head">
                    <div class="m-portlet__head-caption">
                        <div class="m-portlet__head-title">
                            <h3 class="m-portlet__head-text">
                                Retail Orders
                            </h3>
                        </div>
                    </div>
                </div>
                <div class="m-portlet__body admin_orders_table table_style_2">


                    <!--begin: Datatable -->
                    <div class="m_datatable m-datatable m-datatable--default m-datatable--loaded m-portlet__body m-datatable__body p-0">
                        <div id="m_table_1_wrapper" class="dataTables_wrapper container-fluid dt-bootstrap4 no-footer">
                            <div class="row m-0">
                                <div class="col-sm-12 p-0 table_style_2">
                                    <table id="Retail" class="table table-striped table-bordered" style="width:100%">
                                        <thead>
                                        <tr>
                                            <th>ID</th>
                                            <th>Product Name</th>
                                            <th>HS Code</th>
                                            <th>MRP</th>
                                            <th>Sales Rate</th>
                                            <th>Actions</th>

                                        </tr>
                                        </thead>




                                        <tbody>
                                        @foreach($product as $products)


                                            <tr>
                                                <td>{{$products->pk_productid}}</td>
                                                <td>{{$products->product_name}}</td>
                                                <td>{{$products->HS_code}}</td>
                                                <td><input type="text"id="mrp" value="{{$products->beta_product_mrp}}"  name="mrp" disabled></td>
                                                <td><input type="text"id="rate" value="{{$products->beta_product_price}}"  name="rate" disabled></td>

                                                <td data-title="Actions">

                                                    <span class="edit" style="cursor:default"><a class="fa fa-pencil"  onclick="edit()"></a></span>
                                                    <span class="save" style="cursor:default"><a onclick="save()">&#10003;</a></span>
                                                    <span class="cancel" style="cursor:default"><a onclick="cancel()">&#10008;</a></span>
                                                    {{--<button id="edit" onclick="edit()">Edit</button>--}}
                                                    {{--<input type="submit" id="save" onclick="save()" disa>Save</button>--}}
                                                    {{--<button id="cancel" onclick="cancel()">Cancel</button>--}}
                                                    {{--<span><a href="#">Cancel</a></span>--}}
                                                </td>
                                            </tr>


                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                    {{--</div>--}}
                    {{--</div>--}}
                    {{--</div>--}}
                    <!--  END: currently registered users table-->

                    </div>
                    <!--end: Datatable -->
                </div>
            </div>
            {{--<!-- END EXAMPLE TABLE PORTLET-->--}}
            {{--</div>--}}
        </div>
        <!-- END :: main Content-->
    </div>


    {{--<script>--}}

    {{--$(document).ready(function(){--}}
    {{--console.log("inside document");--}}
    {{----}}
    {{--});--}}
    {{--</script>--}}
    <script>
        $(".save").hide();
        $(".cancel").hide();
        var mrp;
        var rate;
        var product_name;
        var id;
        var hs_code;
        function edit()
        {
            console.log("inside edit");
            var edit=event.target.parentNode;
            var save=event.target.parentNode.parentNode.children[1];
            var cancel=event.target.parentNode.parentNode.children[2];

            save.style.display = "inline";
            cancel.style.display = "inline";
            edit.style.display = "none";

            console.log("save",save);
            console.log("edit",edit);
            console.log("cNCEL",cancel);


            // var try;
            // console.log("indide edit");
            var mrp_enable=event.target.parentNode.parentNode.parentNode.children[3].children[0];
            var rate_enable=event.target.parentNode.parentNode.parentNode.children[4].children[0];
            console.log("Mrp",mrp_enable);
            // console.log("Rate",rate_enable);
            mrp_enable.disabled=false;
            rate_enable.disabled=false;


        }
        function cancel()
        {
            console.log("indie cancel");
            var edit=event.target.parentNode.parentNode.children[0];
            var save=event.target.parentNode.parentNode.children[1];
            var cancel=event.target.parentNode.parentNode.children[2];
            edit.style.display = "inline";
            save.style.display = "none";
            cancel.style.display = "none";
            var mrp_enable=event.target.parentNode.parentNode.parentNode.children[3].children[0];
            var rate_enable=event.target.parentNode.parentNode.parentNode.children[4].children[0];

            mrp_enable.disabled=true;
            rate_enable.disabled=true;
        }
        function save()
        {
            // console.log("inside save");
            var mrp_enable=event.target.parentNode.parentNode.parentNode.children[3].children[0];
            var rate_enable=event.target.parentNode.parentNode.parentNode.children[4].children[0];
            var edit=event.target.parentNode.parentNode.children[0];
            var save=event.target.parentNode.parentNode.children[1];
            var cancel=event.target.parentNode.parentNode.children[2];
            edit.style.display = "inline";
            save.style.display = "none";
            cancel.style.display = "none";
            mrp_enable.disabled=true;
            rate_enable.disabled=true;

            console.log("Edit",edit);
            mrp = event.target.parentNode.parentNode.parentNode.children[3].children[0].value;
            rate = event.target.parentNode.parentNode.parentNode.children[4].children[0].value;
            product_name = event.target.parentNode.parentNode.parentNode.children[1].innerHTML;
            hs_code = event.target.parentNode.parentNode.parentNode.children[2].innerHTML;
            id = event.target.parentNode.parentNode.parentNode.children[0].innerHTML;
            console.log("Inside save");
            console.log("Mrp", mrp);
            console.log('Rate', rate);
            console.log('Product_name', product_name);
            console.log('HS CODE', hs_code);
            console.log('id', id);


            var _token = $('input[name="_token"]').val();
            // console.log("Product name in get_price",product_name);


            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                type: 'POST',
                url: './send_mrp',
                data: {

                    message:"sucess",product_name,id,hs_code,mrp,rate,
                    _token: _token
                }
            }).then(function (data) {
                console.log("response",data)


            })
        }

    </script>

@endsection
{{--@include('includes.scripts')--}}