<div class="panel-group">
    <!--ko if:$root.viewListFromServer().length > 0 -->
    <div class="panel-group">
        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-7 col-md-7 col-sm-7">
                        <span class=" total">Toplam</span>
                    </div>
                    <div class="col-xs-3 col-md-3 col-sm-3 text-center">
                        <span class=" total " data-bind="text:$root.TotalCountFromServer()+ ' Adet'"></span>
                    </div>
                    <div class="col-xs-2 col-sm-2 col-md-2 nopadding">
                        <span class=" total" data-bind="text:$root.totalPriceFromServer() +' TL'"></span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--/ko-->
    <div class="panel-group">
        <div class="panel panel-default">
            <div class="panel-heading">
                <!--ko foreach:$root.PaymentInputs-->
                <div class="row">
                    <div class="col-xs-12 col-md-12 col-sm-12">
                        <select class="form-control transferSelect"
                                data-bind="options:$root.PaymentTypes,optionsCaption:'Lütfen Seçiniz!',optionsText:'Name',optionsValue:'Id',value:$data.Type,event: { change: $root.selectionChangedType }"></select>
                    </div>
                    <hr />
                    <div class="col-xs-12 col-md-12 col-sm-12">
                        <!--ko if:$data.SubTypes().length > 0-->
                        <select class="form-control transferSelect"
                                data-bind="options:$data.SubTypes()[0].Options,optionsText:'Name',optionsValue:'Name',value:$data.SubType"></select>
                        <!--/ko-->
                    </div>
                    <!--ko if:$data.Type-->
                    <div class="col-xs-12 col-md-12 col-sm-12">
                        <input type="text" class="form-control defaultTextbox" data-bind="value:$data.Price,event:{ change: $root.PaymentInputsControl}" />
                    </div>
                    <!--/ko-->
                </div>
                <!--/ko-->

            </div>
        </div>
    </div>
    <div class="panel-group">
        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="col-xs-4 col-sm-4 col-md-4 nopadding  total">Kalan Tutar</div>
                        <div class="col-xs-4 col-sm-4 col-md-4"></div>
                        <div class="col-xs-4 col-sm-4 col-md-4 nopadding  total" style="text-align:right;"><span data-bind="text:$root.RemainingAmount() +' TL'"></span></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--ko if:$root.viewListFromServer().length > 0-->
<nav class="navbar navbar-default navbar-fixed-bottom navfooter" role="navigation">
    <div data-bind="visible:!$root.isMultiplePayment() && $root.user().RoleObject().Tahsilat">
        <!--ko foreach:$root.PaymentTypes-->
        <div class="col-xs-3 col-sm-3 col-md-3 navbar-footer-btn">
            <button type="button" class="btn btn-danger navbarBtn btn-block btnFooterHeight" data-bind="text:$data.Name,click:$root.Finish"></button>
        </div>
        <!--/ko-->
        <div class="col-xs-3 col-sm-3 col-md-3 navbar-footer-btn">
            <button type="button" class="btn btn-danger navbarBtn btn-block btnFooterHeight" data-bind="text:'Detay',click:$root.SelectedPaymetType.bind($root,'Multiple')"></button>
        </div>
    </div>
    <div data-bind="visible:$root.isEqual() && $root.PaymentType() == 'Multiple'">
        <button type="button" style="width:100%;font-size: 15px;font-weight: bold;letter-spacing: 2px;" class="btn btn-danger navbarBtn btnFooterHeight" data-bind="text:'Tamamla',click:$root.Finish.bind($root,{'Name':'Multiple','Id':'Multiple'})"></button>
    </div>
</nav>
<!--/ko-->