<vn-crud-model
    url="TicketUpdateActions"
    data="ticketUpdateActions"
    auto-load="true">
</vn-crud-model>
<vn-card class="vn-w-lg">
    <vn-table>
        <vn-thead>
            <vn-tr>
                <vn-th number>Item</vn-th>
                <vn-th class="align-center">Description</vn-th>
                <vn-th number>Quantity</vn-th>
                <vn-th number>Price (PPU)</vn-th>
                <vn-th number>New (PPU)</vn-th>
                <vn-th number>Difference</vn-th>
            </vn-tr>
        </vn-thead>
        <vn-tbody>
            <vn-tr ng-repeat="sale in $ctrl.ticket.sale.items track by sale.id">
                <vn-td number>{{("000000"+sale.itemFk).slice(-6)}}</vn-td>
                <vn-td vn-fetched-tags wide>
                    <vn-one title="{{::sale.item.name}}">{{::sale.item.name}}</vn-one>
                    <vn-one ng-if="::sale.item.subName">
                        <h3 title="{{::sale.item.subName}}">{{::sale.item.subName}}</h3>
                    </vn-one>
                    <vn-fetched-tags
                        max-length="6"
                        item="::sale.item"
                        tabindex="-1">
                    </vn-fetched-tags>
                </vn-td>
                <vn-td number>{{::sale.quantity}}</vn-td>
                <vn-td number>{{::sale.price | currency: 'EUR': 2}}</vn-td>
                <vn-td number>{{::sale.component.newPrice | currency: 'EUR': 2}}</vn-td>
                <vn-td number>{{::sale.component.difference | currency: 'EUR': 2}}</vn-td>
            </vn-tr>
        </vn-tbody>
        <vn-tfoot>
            <vn-tr>
                <vn-td></vn-td>
                <vn-td></vn-td>
                <vn-td></vn-td>
            </vn-tr>
        </vn-tfoot>
    </vn-table>
</vn-card>
<vn-side-menu side="right">
    <div class="vn-pa-md">
        <div class="totalBox align-left">
            <h6 class="align-center" translate>Total</h6> 
            <div> <vn-label translate>Price</vn-label> {{$ctrl.totalPrice | currency: 'EUR': 2}}  </div>
            <div> <vn-label translate>New price</vn-label> {{$ctrl.totalNewPrice | currency: 'EUR': 2}}  </div>
            <div> <vn-label translate>Difference</vn-label> {{$ctrl.totalPriceDifference | currency: 'EUR': 2}}  </div>
        </div>
        <vn-card ng-show="::$ctrl.totalPriceDifference">
            <div class="totalBox align-left" >
                <h6 class="align-center" translate>Charge difference to</h6> 
                <div ng-repeat="action in ticketUpdateActions">
                    <vn-radio
                        ng-model="$ctrl.ticket.option"
                        label="{{::action.description}}"
                        val={{::action.id}}>
                    </vn-radio>
                </div>
            </div>
        </vn-card>
    </div>
</vn-side-menu>