salix/modules/ticket/front/sale/index.html

<vn-crud-model auto-load="false"
    vn-id="model"
    url="Tickets/{{$ctrl.$params.id}}/getSales"
    data="$ctrl.sales">
</vn-crud-model>
<vn-watcher
    vn-id="watcher"
    data="$ctrl.sales">
</vn-watcher>
<div class="vn-w-xl">
    <vn-card class="vn-pa-lg">
        <vn-horizontal class="header">
            <vn-tool-bar class="vn-mb-md">
                <vn-button
                    disabled="!$ctrl.isEditable || $ctrl.ticketState == 'OK'"
                    label="Ok"
                    vn-http-click="$ctrl.changeState('OK')"
                    vn-tooltip="Change ticket state to 'Ok'">
                </vn-button>
                <vn-button-menu
                    disabled="!$ctrl.isEditable"
                    label="State"
                    value-field="code"
                    url="States/editableStates"
                    on-change="$ctrl.changeState(value)">
                </vn-button-menu>
                <vn-button icon="keyboard_arrow_down"
                    label="More"
                    ng-click="moreOptions.show($event)"
                    ng-show="$ctrl.hasSelectedSales()">
                </vn-button>
                <vn-button 
                    disabled="!$ctrl.hasSelectedSales() || !$ctrl.isEditable"
                    ng-click="deleteLines.show()"
                    vn-tooltip="Remove lines"
                    icon="delete">
                </vn-button>
                <vn-button
                    disabled="!$ctrl.hasSelectedSales() || !$ctrl.isEditable"
                    ng-click="$ctrl.showTransferPopover($event)"
                    vn-tooltip="Transfer lines"
                    icon="call_split">
                </vn-button>
            </vn-tool-bar>
            <vn-one class="taxes" ng-if="$ctrl.sales.length > 0">
                <p><vn-label translate>Subtotal</vn-label> {{$ctrl.ticket.totalWithoutVat | currency: 'EUR':2}}</p>
                <p><vn-label translate>VAT</vn-label> {{$ctrl.ticket.totalWithVat - $ctrl.ticket.totalWithoutVat | currency: 'EUR':2}}</p>
                <p><vn-label><strong>Total</strong></vn-label> <strong>{{$ctrl.ticket.totalWithVat | currency: 'EUR':2}}</strong></p>
            </vn-one>
        </vn-horizontal>
        <vn-table model="model">
            <vn-thead>
                <vn-tr>
                    <vn-th shrink>
                        <vn-multi-check model="model" 
                            on-change="$ctrl.resetChanges()">
                        </vn-multi-check>
                    </vn-th>
                    <vn-th shrink></vn-th>
                    <vn-th shrink></vn-th>
                    <vn-th shrink id="ticketId">Id</vn-th>
                    <vn-th shrink>Quantity</vn-th>
                    <vn-th>Item</vn-th>
                    <vn-th number>Price</vn-th>
                    <vn-th number>Disc</vn-th>
                    <vn-th number>Amount</vn-th>
                </vn-tr>
            </vn-thead>
            <vn-tbody>
                <vn-tr ng-repeat="sale in $ctrl.sales">
                    <vn-td shrink>
                        <vn-check tabindex="-1"
                            ng-model="sale.checked">
                        </vn-check>
                    </vn-td>
                    <vn-td shrink>
                        <a ui-sref="claim.card.basicData({id: sale.claim.claimFk})">
                            <vn-icon icon="icon-claims"
                                ng-show="sale.claim.claimFk"
                                vn-tooltip="{{::$ctrl.$t('Claim')}}: {{::sale.claim.claimFk}}">
                            </vn-icon>
                        </a>
                        <vn-icon 
                            ng-show="::(sale.visible < 0 || sale.available < 0)" 
                            color-main
                            icon="warning"
                            vn-tooltip="Visible: {{::sale.visible || 0}} <br> {{::$ctrl.$t('Available')}}: {{::sale.available || 0}}">
                        </vn-icon>
                        <vn-icon ng-show="sale.reserved" 
                            icon="icon-reserve"
                            vn-tooltip="{{::$ctrl.$t('Reserved')}}">
                        </vn-icon>
                    </vn-td>
                    <vn-td shrink>
                        <img 
                            ng-src="{{::$root.imagePath('catalog', '50x50', sale.itemFk)}}"
                            zoom-image="{{::$root.imagePath('catalog', '1600x900', sale.itemFk)}}"
                            on-error-src/>
                    </vn-td>
                    <vn-td shrink>
                        <span class="link" ng-if="sale.id"
                            ng-click="descriptor.show($event, sale.itemFk, sale.id)">
                            {{sale.itemFk}}
                        </span>
                        <vn-autocomplete ng-if="!sale.id" class="dense"
                            vn-focus
                            url="Items"
                            ng-model="sale.itemFk"
                            show-field="name"
                            value-field="id"
                            search-function="$ctrl.itemSearchFunc($search)"
                            on-change="$ctrl.changeQuantity(sale)"
                            order="id DESC"
                            tabindex="1">
                            <tpl-item>
                                {{::id}} - {{::name}}
                            </tpl-item>
                        </vn-autocomplete>
                    </vn-td>
                    <vn-td-editable disabled="!$ctrl.isEditable" shrink>
                        <text>{{sale.quantity}}</text>
                        <field>
                            <vn-input-number class="dense"
                                vn-focus
                                ng-model="sale.quantity"
                                on-change="$ctrl.changeQuantity(sale)">
                            </vn-input-number>
                        </field>
                    </vn-td-editable>
                    <vn-td-editable vn-fetched-tags wide disabled="!sale.id || !$ctrl.isEditable">
                        <text>
                            <vn-one title="{{sale.concept}}">{{sale.concept}}</vn-one>
                            <vn-one ng-if="::sale.subName">
                                <h3 title="{{::sale.subName}}">{{::sale.subName}}</h3>
                            </vn-one>
                            <vn-fetched-tags
                                max-length="6"
                                item="::sale.item"
                                tabindex="-1">
                            </vn-fetched-tags>
                        </text>
                        <field>
                            <vn-textfield class="dense" vn-focus
                                vn-id="concept"
                                ng-model="sale.concept"
                                on-change="$ctrl.updateConcept(sale)">
                            </vn-textfield>
                        </field>
                    </vn-td-editable>
                    <vn-td number>
                        <span ng-class="{'link': $ctrl.isEditable}"
                            translate-attr="{title: $ctrl.isEditable ? 'Edit price' : ''}"
                            ng-click="$ctrl.showEditPricePopover($event, sale)">
                            {{sale.price | currency: 'EUR':2}}
                        </span>
                    </vn-td>
                    <vn-td number>
                        <span ng-class="{'link': !$ctrl.isLocked}"
                            translate-attr="{title: !$ctrl.isLocked ? 'Edit discount' : ''}"
                            ng-click="$ctrl.showEditDiscountPopover($event, sale)"
                            ng-if="sale.id">
                            {{(sale.discount / 100) | percentage}} 
                        </span>
                    </vn-td>
                    <vn-td number>
                        {{$ctrl.getSaleTotal(sale) | currency: 'EUR':2}}
                    </vn-td>
                </vn-tr>
            </vn-tbody>
        </vn-table>
        <div>
            <vn-icon-button
                vn-none
                vn-tooltip="Add item"
                vn-bind="+"
                icon="add_circle"
                ng-click="$ctrl.add()"
                disabled="!$ctrl.isEditable">
            </vn-icon-button>
        </div>
    </vn-card>
</div>
<vn-float-button
    ng-show="$ctrl.isEditable"
    ng-click="$ctrl.newOrderFromTicket()"
    icon="add"
    vn-tooltip="Add item to basket"
    vn-bind="+"
    fixed-bottom-right>
</vn-float-button>
<vn-item-descriptor-popover
    vn-id="descriptor"
    warehouse-fk="$ctrl.ticket.warehouseFk",
    ticket-fk="$ctrl.ticket.id">
</vn-item-descriptor-popover>

<!-- Price Popover -->
<vn-popover
    vn-id="edit-price-popover"
    on-open="$ctrl.getMana()">
    <div class="edit-popover">
        <vn-spinner class="vn-pa-xs"
            ng-if="$ctrl.edit.mana == null"
            enable="true">
        </vn-spinner>
        <div ng-if="$ctrl.edit.mana != null">
            <section class="header vn-pa-md">
                <h5>MANÁ: {{::$ctrl.edit.mana | currency: 'EUR': 0}}</h5>
            </section>
            <div class="vn-pa-md">
                <vn-input-number
                    vn-focus
                    label="Price"
                    ng-model="$ctrl.edit.price"
                    step="0.01"
                    on-change="$ctrl.updatePrice()"
                    suffix="€">
                </vn-input-number>
                <div class="simulator">
                    <p class="simulatorTitle" translate>New price</p>
                    <p>
                        <strong>{{$ctrl.getNewPrice() | currency: 'EUR': 2}}</strong>
                    </p>
                </div>
            </div>
        </div>
    </div>
</vn-popover>

<!-- Discount popover -->
<vn-popover
    vn-id="editDiscount"
    on-open="$ctrl.getMana()">
    <div class="edit-popover">
        <vn-spinner class="vn-pa-xs"
            ng-if="$ctrl.edit.mana == null"
            enable="true">
        </vn-spinner>
        <div ng-if="$ctrl.edit.mana != null">
            <section class="header vn-pa-md">
                <h5>Mana: {{::$ctrl.edit.mana | currency: 'EUR':0}}</h5>
            </section>
            <div class="vn-pa-md">
                <vn-input-number
                    vn-focus
                    label="Discount"
                    ng-model="$ctrl.edit.discount"
                    on-change="$ctrl.changeDiscount()"
                    suffix="%">
                </vn-input-number>
                <div class="simulator">
                    <p class="simulatorTitle" translate>New price</p>
                    <p>
                        <strong>{{$ctrl.getNewPrice() | currency: 'EUR': 2}}</strong>
                    </p>
                </div>
            </div>
        </div>
    </div>
</vn-popover>

<!-- Multiple discount dialog -->
<vn-dialog vn-id="editDiscountDialog"
    on-open="$ctrl.getMana()"
    message="Edit discount">
    <tpl-body>
        <vn-spinner class="vn-pa-xs"
            ng-if="$ctrl.edit.mana == null"
            enable="true">
        </vn-spinner>
        <div ng-if="$ctrl.edit.mana != null">
            <div class="vn-pa-md">
                <vn-input-number vn-focus
                    label="Discount"
                    ng-model="$ctrl.edit.discount"
                    on-change="$ctrl.changeMultipleDiscount()"
                    suffix="%">
                </vn-input-number>
            </div>
            <section class="header vn-pa-md">
                <span>Mana: <strong>{{::$ctrl.edit.mana | currency: 'EUR': 0}}</strong></span>
            </section>
        </div>
    </tpl-body>
</vn-dialog>

<!-- Transfer Popover -->
<vn-popover vn-id="transfer">
    <div class="vn-pa-lg transfer">
    <vn-horizontal>
        <vn-one>
            <h4 translate>Sales to transfer</h4>
            <vn-table>
                <vn-thead>
                    <vn-tr>
                        <vn-th number shrink>Id</vn-th>
                        <vn-th>Item</vn-th>
                        <vn-th number shrink>Quantity</vn-th>
                    </vn-tr>
                </vn-thead>
                <vn-tbody>
                    <vn-tr ng-repeat="sale in $ctrl.transfer.sales">
                        <vn-td number shrink>{{::sale.itemFk | zeroFill:6}}</vn-td>
                        <vn-td>
                            <span title="{{::sale.concept}}">{{::sale.concept}}</span>
                        </vn-td>
                        <vn-td-editable number shrink>
                            <text>{{sale.quantity}}</text>
                            <field>
                                <vn-input-number
                                    vn-focus
                                    ng-model="sale.quantity">
                                </vn-input-number>
                            </field>
                        </vn-td-editable>
                    </vn-tr>
                </vn-tbody>
            </vn-table>
        </vn-one>
        <vn-one>
            <vn-horizontal>
                <h4 vn-one translate>Destination ticket</h4>
                <vn-icon vn-none
                    color-marginal
                    vn-tooltip="You have to allow pop-ups in your web browser to use this functionality"
                    icon="info">
                </vn-icon>
            </vn-horizontal>
            <table class="destinationTable vn-table">
                <thead>
                    <tr>
                        <th translate shrink>Id</th>
                        <th translate>Shipped</th>
                        <th translate shrink>Agency</th>
                        <th translate expand>Address</th>
                    </tr>
                </thead>
                <tbody>
                    <tr 
                        class="clickable" 
                        ng-repeat="ticket in $ctrl.transfer.lastActiveTickets track by ticket.id"
                        ng-click="$ctrl.transferSales(ticket.id)">
                        <td shrink>{{::ticket.id}}</td>
                        <td>{{::ticket.shipped | date: 'dd/MM/yyyy'}}</td>
                        <td shrink>{{::ticket.agencyName}}</td>
                        <td expand>{{::ticket.address}}
                            <span vn-tooltip="
                                {{::ticket.nickname}} 
                                {{::ticket.name}} 
                                {{::ticket.street}} 
                                {{::ticket.postalCode}} 
                                {{::ticket.city}}">
                                {{::ticket.nickname}} 
                                {{::ticket.name}} 
                                {{::ticket.street}} 
                                {{::ticket.postalCode}} 
                                {{::ticket.city}}
                            </span>
                        </td>
                    </tr>
                    <tr>
                        <td
                            ng-if="!$ctrl.transfer.lastActiveTickets.length" 
                            class="empty-rows"
                            colspan="4"
                            translate>
                            No results
                        </td>
                    </tr>
                </tbody>
            </table>
            <form name="form">
                <vn-horizontal class="vn-py-md">
                    <vn-input-number vn-one
                        label="Transfer to ticket"
                        ng-model="$ctrl.transfer.ticketId"
                        type="number">
                    </vn-input-number>
                    <vn-icon-button vn-none
                        icon="arrow_forward_ios"
                        ng-click="$ctrl.transferSales($ctrl.transfer.ticketId)">
                    </vn-icon-button>
                </vn-horizontal>
            </form>
            <vn-horizontal class="vn-py-md">
                <vn-button
                    label="New ticket"
                    ng-click="$ctrl.transferSales()">
                </vn-button>
            </vn-horizontal>
        </vn-one>
    </vn-horizontal>
    </div>
</vn-popover>

<!-- SMS Dialog -->
<vn-ticket-sms
    vn-id="sms"
    sms="$ctrl.newSMS">
</vn-ticket-sms>

<vn-confirm
    vn-id="delete-lines"
    question="You are going to delete lines of the ticket"
    message="Continue anyway?"
    on-accept="$ctrl.removeSales()">
</vn-confirm>

<vn-confirm
    vn-id="delete-ticket"
    question="Do you want to delete it?"
    message="This ticket is now empty"
    on-accept="$ctrl.transferSales($ctrl.transfer.ticketId)">
</vn-confirm>

<vn-menu vn-id="moreOptions">
    <vn-item translate
        name="sms"
        ng-click="$ctrl.showSMSDialog()">
        Send shortage SMS
    </vn-item>
    <vn-item translate
        name="calculatePrice"
        ng-click="$ctrl.calculateSalePrice()"
        ng-if="$ctrl.isEditable && $ctrl.hasOneSaleSelected()">
        Recalculate price
    </vn-item>
    <vn-item translate
        name="discount"
        ng-click="$ctrl.showEditDiscountDialog($event)">
        Update discount
    </vn-item>
    <vn-item translate
        name="claim"
        ng-click="$ctrl.createClaim()">
        Add claim
    </vn-item>
    <vn-item translate
        name="reserve"
        ng-click="$ctrl.markAsReserved()"
        ng-if="$ctrl.isEditable">
        Mark as reserved
    </vn-item>
    <vn-item translate
        name="unreserve"
        ng-click="$ctrl.unmarkAsReserved()"
        ng-if="$ctrl.isEditable && $ctrl.hasReserves()">
        Unmark as reserved
    </vn-item>
</vn-menu>