@extends('base.base')
@section('base')

    <style>
        .input_val {
            width: 50%;
            float: left
        }

        .button_del {
            width: 50%;
            float: left;
            height: 56px;
            margin-top: 7px;
        }

        .table-striped tbody tr:nth-of-type(2n+1) {
            background-color: white;
        }
    </style>
    <button type="button" class="btn btn-sm btn-gradient-success btn-icon-text" onclick="add()">
        <i class="mdi mdi-plus btn-icon-prepend"></i>
        {{ __('auto.增加档位配置') }}
    </button>
    <br>
    <table class="table table-striped">
        {{--        @foreach($list as $key=>$val)--}}
        <div id="add_input">
            @foreach($list as $key=>$val)
                {{--                <input type="text" value="{{$val->Value}}"> <button class="btn btn-sm btn-gradient-dark">{{ __('auto.删除') }}</button>--}}
                <nav>
                    <div class="input_val">
                        <input type="text" value="{{$val->Value}}" class="form-control" name="Value">
                    </div>
                    <div class="button_del">
                        <button class="btn btn-sm btn-gradient-dark" onclick="delFunc(this)">{{ __('auto.删除') }}</button>
                    </div>
                </nav>

            @endforeach
        </div>
        {{--        @endforeach--}}

    </table>


@endsection

<script>
    function delFunc(obj) {
       del = $(obj).parents('nav').remove()
        console.log(del)
    }
    function add() {

        html = `<nav >
                    <div class="input_val">
                        <input type="text" value="0"  class="form-control" name="Value">
                    </div>
                    <div  class="button_del">
                        <button class="btn btn-sm btn-gradient-dark" onclick="delFunc(this)">{{ __('auto.删除') }}</button>
                    </div>
                </nav>`;
        $("#add_input").append(html)
    }

    function gearVal() {
        var arry = new Array();

        //循环所有选中的值
        $('input[name="Value"]').each(function (index, element) {

            //追加到数组中
            arry.push($(this).val());
        });
        //将数组元素连接起来转化为字符串
        var Value = arry.join(',');

        return Value
    }
</script>