<div class="blade-content __xxlarge-wide">
    <div class="blade-inner">
        <div class="inner-block">
            <form name="orderForm" novalidate></form>
            <div class="table-wrapper">
                <table class="table">
                    <thead>
                        <tr>
                            <th class="table-col __product-control">
                                <label class="form-control __checkbox">
                                    <input type="checkbox" ng-model="blade.selectedAll" ng-change="checkAll(blade.selectedAll)" />
                                    <span class="check"></span>
                                </label>
                            </th>
                            <th class="table-col __proudct-img">{{ 'orders.blades.customerOrder-items.labels.item' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.status' | translate }} <a href="" ng-click="blade.openStatusSettingManagement()" class="form-edit"><span class="form-ico fa fa-pencil"></span></a></th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.quantity' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.available' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.price' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.priceWithTax' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.discount' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.discountWithTax' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.tax' | translate }}</th>
                            <th class="table-col">{{ 'orders.blades.customerOrder-items.labels.total' | translate }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr class="table-item" ng-repeat-start="data in blade.currentEntity.items" ng-class="{'__selected': $index === blade.selectedNodeId}" ng-click="openLineItemDetail(data, $index)">
                            <td class="table-col">
                                <label class="form-control __checkbox" ng-click="$event.stopPropagation()">
                                    <input type="checkbox" ng-model="data.selected" ng-change="updateSelectedAll()">
                                    <span class="check"></span>
                                </label>
                            </td>
                            <td class="table-col">
                                <div class="product-img">
                                    <div class="image" style="background-image: url({{data.imageUrl}})" ng-if="data.imageUrl"></div>
                                    <i class="table-ico fas fa-image" ng-if="!data.imageUrl" />
                                </div>
                            </td>
                            <td class="table-col">
                                <div class="form-input __inline" ng-click="$event.stopPropagation()">
                                    <va-setting-value-select placeholder="'orders.blades.customerOrder-detail.placeholders.status' | translate"
                                                             setting="'OrderLineItem.Statuses'"
                                                             ng-model="data.status"
                                                             allow-clear="true"></va-setting-value-select>
                                </div>
                            </td>
                            <td class="table-col">
                                <div class="form-input __mini __inline">
                                    <div class="form-input __mini __number" ng-click="$event.stopPropagation()">
                                        <input smart-float num-type="integer" required ng-model="data.quantity" ng-model-options="{ updateOn: 'blur' }" ng-change="blade.recalculateFn()" id="quantity{{$index}}" focus-on="quantity{{$index}}">
                                    </div>
                                </div>
                            </td>
                            <td class="table-col">
                                <span ng-class="{'error': data.avail <= 0}">{{(data.avail || 0) | number:0}}</span>
                            </td>
                            <td class="table-col">
                                <div class="form-input __mini" ng-click="$event.stopPropagation()">
                                    <input money mask-money="!blade.isVisiblePrices" required ng-model="data.price" ng-model-options="{ updateOn: 'blur' }" ng-change="blade.recalculateFn()" id="price{{$index}}" focus-on="price{{$index}}">
                                </div>
                            </td>
                            <td class="table-col">
                                <span class="list-price">{{data.priceWithTax | currency:'' | showPrice:blade.isVisiblePrices}}</span>
                            </td>
                            <td class="table-col">
                                <div class="form-input __mini __inline" ng-click="$event.stopPropagation()">
                                    <input money mask-money="!blade.isVisiblePrices" required ng-model="data.discountAmount" ng-model-options="{ updateOn: 'blur' }" ng-change="blade.recalculateFn()" id="discountAmount{{$index}}" focus-on="discountAmount{{$index}}">
                                </div>
                            </td>
                            <td class="table-col">
                                <span class="list-price">{{data.discountAmountWithTax | currency:'' | showPrice:blade.isVisiblePrices}}</span>
                            </td>
                            <td class="table-col">
                                <span class="list-price">{{data.taxTotal | currency:'' | showPrice:blade.isVisiblePrices}}</span>
                            </td>
                            <td class="table-col __total">
                                <span class="list-price">{{data.extendedPriceWithTax | currency:'' | showPrice:blade.isVisiblePrices}}</span>
                            </td>
                        </tr>
                        <tr ng-repeat-end class="table-item" ng-class="{'__selected': $index === blade.selectedNodeId}" ng-click="openLineItemDetail(data, $index)">
                            <td class="table-head" colspan="{{ data.comment ? 6 : 11 }}">
                                {{data.name}}
                            </td>
                            <td class="table-head" colspan="5" ng-if="data.comment">
                                {{ data.comment }}
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="table-wrapper">
                <table class="table __collapsed __order-info">
                    <tr class="table-item">
                        <td class="table-col">{{ 'orders.blades.customerOrder-items.labels.sub-total' | translate }}</td>
                        <td class="table-col __price">{{blade.currentEntity.subTotal | currency:blade.currentEntity.currency | showPrice:blade.isVisiblePrices}}</td>
                    </tr>
                    <tr class="table-item">
                        <td class="table-col">{{ 'orders.blades.customerOrder-items.labels.discount-total' | translate }}</td>
                        <td class="table-col __price">{{blade.currentEntity.subTotalDiscount | currency:blade.currentEntity.currency | showPrice:blade.isVisiblePrices}}</td>
                    </tr>
                    <tr class="table-item">
                        <td class="table-col">{{ 'orders.blades.customerOrder-items.labels.tax-total' | translate }}</td>
                        <td class="table-col __price">{{ blade.currentEntity.subTotalTaxTotal | currency:blade.currentEntity.currency | showPrice:blade.isVisiblePrices}}</td>
                    </tr>
                    <tr class="table-item __total">
                        <td class="table-col">{{ 'orders.blades.customerOrder-items.labels.total' | translate }}</td>
                        <td class="table-col __price">{{ (blade.currentEntity.subTotalWithTax - blade.currentEntity.subTotalDiscountWithTax) | currency:blade.currentEntity.currency | showPrice:blade.isVisiblePrices}}</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>
