JSFiddle - React, Tailwind, and code Playground

HTML

<textarea cols="60" rows="8" name="pricing" value="" data-bind="value: pricing"></textarea>
                    <div class="tab-pane fade" id="tab-price">
                        <div class="panel-body">
                            <div class="col-md-8">
          
                                
                                <div class="row">
                                    <div class="col-md-12 header-h4-line"><hr><h4>Скидки от количества дней</h4></div>
                                    
                                    <div data-bind="foreach: discounts">
                                        <div class="col-md-3">
                                            <span class="name-select-input-2">&nbsp;</span>
                                            <label for="" class="field prepend-icon noborder">
                                                <input disabled class="gui-input" value="" data-bind="value: ($index() + 1)">
                                                <label for="" class="field-icon"><i class="fa fa-bookmark"></i></label>
                                            </label>
                                        </div>
                                        <div class="col-md-3">
                                            <span class="name-select-input-2">Количество дней</span>
                                            <label for="" class="field prepend-icon">
                                                <input type="number" name="" id="" class="gui-input" placeholder="7..." value="" data-bind="value: minDays">
                                                <label for="" class="field-icon"><i class="fa fa-moon-o"></i></label>
                                            </label>
                                        </div>
                                        <div class="col-md-3">
                                            <span class="name-select-input-2">Скидка %</span>
                                         ...

JavaScript

function DiscountItem(minDays, percent) {
                var self = this;
                self.minDays = ko.observable(minDays);
                self.discount = ko.observable(percent);
            }
            
            function AppViewModel() {
                var self = this;
             
                self.discounts = ko.observableArray([
                    new DiscountItem(12, 4),
                    new DiscountItem(20, 6)
                ]);
                
                self.addDiscount = function() {
                    self.discounts.push(new DiscountItem(0, 0));
                }
             
                self.removeDiscount = function() {
                    self.discounts.remove(this);
                }
                
                self.pricing = ko.computed(function() {
                    return ko.toJSON({
                        durationDiscount : ko.utils.arrayMap(this.discounts(), function(item){ return new DiscountItem(ko.unwrap(item.discount), ko.unwrap(item.minDays)); })
                    })  
                }, self);
            }
            
            ko.applyBindings(new AppViewModel());