@forelse($product->products_options as $product_option)
    <div class="row option-row mt-4">
        <div class="col-md-4">
            @if($loop->iteration === 1)
                <label for="option_id">Select Option Name</label>
            @endif
            <select id="option_id" name="option_id[]" class="form-control option_id">
                <option value="">Select Option</option>
                @foreach($options as $option)
                    <option value="{{$option->id}}"
                            @if(!empty($product_option) && ($product_option->option_id == $option->id)) selected @endif>{{$option->option_name}}</option>
                @endforeach
            </select>
        </div>
        <div class="col-md-3">
            @if($loop->iteration === 1)
                <label for="option_val_id">Select Option Value</label>
            @endif
                @php $optionValues = $product_option->option->load('optionValues') @endphp
            <select id="option_val_id" name="option_val_id[]" class="form-control option_val_id">
                @foreach($optionValues->optionValues as $optionValue)
                    <option
                        value="{{$optionValue->id}}" {{ $product_option->option_val->id === $optionValue->id ? 'selected' : null }}>{{ $optionValue->option_value }}</option>
                @endforeach
            </select>

        </div>
        <div class="col-md-2">
            @if($loop->iteration === 1)
                <label for="price">Price</label>
            @endif
            <input type="number" id="price" name="price[]" step=".001" class="form-control"
                   value="{{ $product_option->price }}">
        </div>
        <div class="col-md-2">
            @if($loop->iteration === 1)
                <label for="discount">Discount(%)</label>
            @endif
            <input type="number" id="discount" name="option_discount[]" step=".001" class="form-control"
                   value="{{ $product_option->discount }}">
        </div>
        <div class="col-md-1 {{ $loop->iteration === 1 ? 'mt-5' : 'mt-2' }}">
            <span class="add-field"><i class="fa fa-plus-circle" aria-hidden="true"></i></span>
            @if($loop->iteration !== 1)
                <span class="remove-field"><i class="fa fa-minus-circle" aria-hidden="true"></i></span>
            @endif
        </div>
    </div>
@empty
    <div class="row option-row mt-4">
        <div class="col-md-4">
            <label for="option_id">Select Option Name</label>
            <select id="option_id" name="option_id[]" class="form-control option_id">
                <option value="">Select Option</option>
                @foreach($options as $option)
                    <option value="{{$option->id}}"
                            @if(!empty($optionValue) && ($optionValue->option_id == $option->id)) selected @endif>{{$option->option_name}}</option>
                @endforeach
            </select>
        </div>
        <div class="col-md-3">
            <label for="option_val_id">Select Option Value</label>
            <select id="option_val_id" name="option_val_id[]" class="form-control option_val_id"></select>
        </div>
        <div class="col-md-2">
            <label for="price">Price</label>
            <input type="number" id="price" name="price[]" class="form-control">
        </div>
        <div class="col-md-2">
            <label for="discount">Discount(%)</label>
            <input type="number" id="discount" name="option_discount[]" class="form-control">
        </div>
        <div class="col-md-1 mt-4">
            <span class="add-field"><i class="fa fa-plus-circle" aria-hidden="true"></i></span>
        </div>
    </div>
@endforelse

<div id="dynamicOptions"></div>