
<div>
    <!--ko if: $root.viewMessage-->
    <div class="col-xs-12 col-md-12 col-sm-12">
        <span class="viewMessage" data-bind="text:$root.viewMessage"></span>
    </div>
    <!--/ko-->
    <div class="col-xs-12 col-sm-12 col-md-12" data-bind="visible:!$root.isMultiplePayment()" style="padding:0px; height: 100vh;margin-bottom: 40px;margin-top:-1px">
        <!--ko foreach:$root.viewListFromServer-->
        <div class="panel-group" id="adisyonAccordion">
            <div class="panel panel-default" style="margin-bottom: 0px;">
                <div class="panel-heading groupTitle"
                     data-toggle="collapse" data-bind="attr:{'data-parent':'#adisyonAccordion','href':'#cartCollapse'+ $data.key()}">
                    <div>
                        <h4 class="panel-title adisyonTitle">
                            <span style="float:left;" data-bind="text:$data.key() == '0' ? 'Ortak Siparisler' : 'Kişi No:'+ $data.key()"></span>
                            <span style="float:right;" data-bind="text:$data.list().length + ' Ürün' "></span>
                        </h4>
                    </div>
                </div>
                <div data-bind="attr:{'id':'cartCollapse'+ $data.key()}" class="panel-collapse collapse in">
                    <div class="panel-body pl5">
                        <!--ko foreach:$data.list -->
                        <div class="row" data-bind="css: $data.Quantity() == -1 ? 'removed' :'' , click:$root.selectedForRemove.bind($root,$index(),$data)">
                            <div class="productLine">
                                <div class="row" style="padding-top: 10px;padding-bottom: 10px;">
                                    <div class="col-xs-1 col-sm-1 col-md-1 selectableDiv">
                                        <img height="10" data-bind="attr:{ 'src':$data.isSelected() ? icons.arrowDown : icons.arrowRight }" />
                                    </div>
                                    <div class="col-xs-6 col-md-7 col-sm-7 inline p0" data-bind="text:$data.Name">
                                        <!--<span class="" data-bind="text:$data.Name"></span>-->
                                    </div>
                                    <div class="col-xs-3 col-md-2 col-sm-2"
                                         data-bind="text:$data.Price() + ' x ' + $data.Quantity()">
                                    </div>
                                    <div class="col-xs-2 col-md-2 col-sm-2 nopadding"
                                         data-bind="text:($data.Quantity() * $data.Price())  + ' TL'">
                                    </div>
                                </div>
                                <!--ko if:$data.isSelected()-->
                                <div class="row" data-bind="click:function(e,ev) { ev.stopPropagation();}">
                                    <div class="col-xs-12 col-md-12 col-sm-12">
                                        <span style="text-transform:lowercase;color:#6f6f6f" data-bind="text:$data.Description()"></span>
                                    </div>
                                    <!--ko if:$data.DepNoFilter() == 'anotherDepno'-->
                                    <div class="col-xs-12 col-sm-4 col-md-4" data-bind="$root.user().RoleObject().uTransfer">
                                        <select style="margin: 3px;" class="form-control transferSelect"
                                                data-bind="options: $root.OtherDepartmentTables,
                                           optionsText: 'ADI',
                                           optionsValue:'KODU',
                                           value:$data.SelectedDepNo,
                                           optionsCaption: 'Departman Seçiniz...'"></select>
                                    </div>
                                    <!--/ko-->
                                    <!--ko if:$data.DepNoFilter() == 'anotherDepno'-->
                                    <div class="col-xs-12 col-sm-4 col-md-4" data-bind="visible:$root.user().RoleObject().uTransfer">
                                        <select style="margin: 3px;" class="form-control transferSelect"
                                                data-bind="options: $data.SelectedDepNo() ? $root.OtherDepartmentTables().filter(function(f){return f.KODU == $data.SelectedDepNo()})[0].MASALAR.MASA : [],
                                           optionsText: 'MASANO',
                                           optionsValue:'MASANO',
                                           value:$data.SelectedTableNo,
                                           optionsCaption: 'Masa Seçiniz...'"></select>
                                    </div>
                                    <!--/ko-->
                                    <!--ko if:$data.DepNoFilter() == 'currentDepNo'-->
                                    <div class="col-xs-12 col-sm-4 col-md-4" data-bind="visible:$root.user().RoleObject().uTransfer">
                                        <select style="margin: 3px;" class="form-control transferSelect"
                                                data-bind="options: $root.Desks().filter(function(f){return f.DOLU == true && f.MASANO != $root.DeskNo()}),
                                                                optionsText: 'MASANO',
                                                                value: $data.SelectedTableNo,
                                                                optionsValue:'MASANO' ,
                                                                optionsCaption: 'Masa Seçiniz...'"></select>
                                    </div>
                                    <!--/ko-->
                                    <div class="col-xs-12 col-sm-4 col-md-4" data-bind="visible:$root.user().RoleObject().uTransfer">
                                        <select style="margin: 3px;" class="form-control transferSelect"
                                                data-bind="options:Array.apply(null, Array(parseInt($data.Quantity()))).map(function (x, i) { return i+1; }),
                                           optionsText: $data,
                                           value:$data.TransferQuantity,
                                           optionsValue:$data,
                                           optionsCaption: 'Adet Seçiniz...'"></select>
                                    </div>
                                    <div class="col-xs-12 col-sm-4 col-md-4" data-bind="visible:$root.user().RoleObject().uTransfer">
                                        <button style="margin: 3px;" type="button" class="btn btn-block btn-default" data-bind="click:function(){ $root.ProductTransfer($data,$index(),$parentContext.$index())}">Transfer</button>
                                    </div>
                                </div>
                                <!--/ko-->
                            </div>
                        </div>

                        <!--/ko-->

                    </div>
                </div>
            </div>
        </div>
        <div class=" cartFooterTotalDiv">
            <span data-bind="text:'Toplam =' + $data.ListTotalPrice()+ ' TL'" class="col-xs-12 col-sm-12 col-md-12 cartFooterTotalText"></span>
        </div>
        <!--/ko-->
        <!--ko if:$root.viewListFromServer().length > 0 -->
        <div class="row" style="margin-top:10px">
            <div class="panel-group">
                <div class="panel panel-default">
                    <div class="panel-heading groupTitle">
                        <div class="row">
                            <div class="col-xs-7 col-md-7 col-sm-7">
                                <span class=" total" style="text-transform:capitalize;">Toplam Fiyat</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.viewListFromServer()[0].CartTotalPrice() +' TL'"></span>
                            </div>

                        </div>
                        <!--ko if:$root.viewListFromServer()[0].CartTotalPrice() != $root.viewListFromServer()[0].CartTotalWithDiscount() -->
                        <div class="row">
                            <div class="col-xs-7 col-md-7 col-sm-7">
                                <span class=" total" style="text-transform:capitalize;">İndirimli Fiyat</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.viewListFromServer()[0].CartTotalWithDiscount() +' TL'"></span>
                            </div>
                        </div>
                        <!--/ko-->

                    </div>
                </div>
            </div>
        </div>
        <!--/ko-->
        <!--ko if:$root.viewListFromServer().length > 0 -->
        <!--ko if: $root.UseBulkTransfer-->
        <div class="row" data-bind="visible:$root.user().RoleObject().Birlestir">
            <select class="form-control transferSelect"
                    data-bind="options:$root.Desks().filter(function(f){return f.DOLU == true && f.MASANO != view.DeskNo()}),
                       optionsText: 'MASANO',
                       value:$root.BulkTransferTableNo,
                       optionsValue:'MASANO',
                       optionsCaption: 'Masa Seçiniz...'"></select>
        </div>
        <!--/ko-->
        <div class="row">
            <!--ko if: !$root.UseBulkTransfer()-->
            <div class="col-xs-6 col-sm-6 col-md-6" data-bind="visible:$root.user().RoleObject().Yazdır">
                <button class="btn btn-default btn-block" style="letter-spacing: 2px;" data-bind="click:function(){ $root.Print()}">Yazdır</button>
            </div>
            <!--/ko-->
            <!--ko if: $root.UseBulkTransfer()-->
            <div class="col-xs-6 col-sm-6 col-md-6" data-bind="visible:$root.user().RoleObject().Birlestir">
                <button class="btn btn-default btn-block" style="letter-spacing: 2px;" data-bind="click:function(){$root.UseBulkTransfer(false)}">Vazgeç</button>
            </div>
            <!--/ko-->
            <!--ko if: $root.UseBulkTransfer()-->
            <div class="col-xs-6 col-sm-6 col-md-6" data-bind="visible:$root.user().RoleObject().Birlestir">
                <button class="btn btn-default btn-block" style="letter-spacing: 2px;" data-bind="click:$root.BulkTransfer">Tamamla</button>
            </div>
            <!--/ko-->
            <!--ko if: !$root.UseBulkTransfer()-->
            <div class="col-xs-6 col-sm-6 col-md-6" data-bind="visible:$root.user().RoleObject().Birlestir">
                <button class="btn btn-default btn-block" style="letter-spacing: 2px;" data-bind="click:function(){$root.UseBulkTransfer(true)}">Birleştir</button>
            </div>
            <!--/ko-->
            @*<div class="col-xs-4 col-sm-4 col-md-4">
                <div class="btn btn-default btn-block popup" style="letter-spacing: 2px; padding-left: inherit;" onclick="OpenPopup()">
                    ODA HESABI
                    <div class="popuptext" id="myPopup">
                        <span>A Simple Popup!</span>
                        <button>test</button>
                    </div>
                </div>
            </div>*@
        </div>
        <div class="row" data-bind="if:$root.AppConfig().Mode == '0'">
            @Html.Partial("_CustomerInformation")
        </div>
            <!--/ko-->
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div data-bind="visible:$root.isMultiplePayment">
                <div class="panel-group">
                    @*<button style="width:100%" class="btn btn-warning" data-bind="click:$root.PaymentType.bind($root,undefined)"><i class="material-icons">chevron_left</i>Sipariş Listesi</button>*@
                    <!--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="deskSelector" style="width:100%;"
                                                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="deskSelector" style="width:100%;"
                                                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" style="text-align: right;" 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>
            </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 paymet-btn" 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 paymet-btn" data-bind="text:'Detay',click:$root.SelectedPaymetType.bind($root,'Multiple')"></button>
        </div>
    </div>
</nav>
<!--/ko-->
