salix/modules/entry/front/basic-data/index.html

<mg-ajax path="Entries/{{patch.params.id}}" options="vnPatch"></mg-ajax>
<vn-watcher
    vn-id="watcher"
    data="$ctrl.entry"
    form="form"
    save="patch">
</vn-watcher>
<vn-crud-model
    auto-load="true" 
    url="Warehouses" 
    data="warehouses">
</vn-crud-model>
<form name="form" ng-submit="watcher.submit()" class="vn-w-md">
    <vn-card class="vn-pa-lg">
        <vn-horizontal>
            <vn-autocomplete
                vn-one
                ng-model="$ctrl.entry.supplierFk"
                url="Suppliers"
                show-field="nickname"
                search-function="{or: [{id: $search}, {nickname: {like: '%'+ $search +'%'}}]}"
                value-field="id"
                order="nickname"
                label="Supplier"
                required="true">
                <tpl-item>
                    <div>#{{::nickname}}</div>
                    <div class="text-secondary text-caption">#{{::id}}</div>
                </tpl-item>
            </vn-autocomplete>
            <vn-autocomplete
                vn-one
                ng-model="$ctrl.entry.travelFk"
                url="Travels/filter"
                search-function="$ctrl.searchFunction($search)"
                value-field="id"
                show-field="warehouseInName"
                order="id"
                label="Travel"
                required="true">
                <tpl-item>
                    <div>
                        {{::agencyModeName}} - {{::warehouseInName}} ({{::shipped | date: 'dd/MM/yyyy'}}) &#x2192;
                        {{::warehouseOutName}} ({{::landed | date: 'dd/MM/yyyy'}})
                    </div>
                    <div class="text-secondary text-caption">#{{::id}}</div>
                </tpl-item>
                <append>
                    <vn-icon-button
                        icon="filter_alt"
                        vn-click-stop="$ctrl.showFilterDialog($ctrl.entry.travelFk)"
                        vn-tooltip="Filter...">
                    </vn-icon-button>
                </append>
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal>
            <vn-textfield
                vn-one
                label="Reference"
                ng-model="$ctrl.entry.reference"
                rule
                vn-focus>
            </vn-textfield>
        </vn-horizontal>
        <vn-horizontal>
            <vn-textfield
                vn-one
                label="Invoice number"
                ng-model="$ctrl.entry.invoiceNumber"
                rule
                vn-focus>
            </vn-textfield>
            <vn-autocomplete
                url="Companies"
                label="Company"
                show-field="code"
                value-field="id"
                ng-model="$ctrl.entry.companyFk">
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal>
            <vn-autocomplete
            vn-one
            label="Currency"
                ng-model="$ctrl.entry.currencyFk"
                url="Currencies"
                show-field="code"
                value-field="id">
            </vn-autocomplete>
            <vn-input-number
                vn-one
                step="0.1"
                label="Commission"
                ng-model="$ctrl.entry.commission"
                rule>
            </vn-input-number>
        </vn-horizontal>
        <vn-horizontal>
            <vn-textarea
                vn-one
                label="Observation"
                ng-model="$ctrl.entry.observation"
                rule>
            </vn-textarea>
        </vn-horizontal>
        <vn-horizontal>
            <vn-check
                label="Ordered"
                ng-model="$ctrl.entry.isOrdered">
            </vn-check>
            <vn-check
                label="Confirmed"
                ng-model="$ctrl.entry.isConfirmed">
            </vn-check>
            <vn-check
                label="Inventory"
                ng-model="$ctrl.entry.isExcludedFromAvailable">
            </vn-check>
            <vn-check
                label="Raid"
                ng-model="$ctrl.entry.isRaid">
            </vn-check>
            <vn-check
                label="Booked"
                ng-model="$ctrl.entry.isBooked"
                vn-acl="administrative"
                >
            </vn-check>
        </vn-horizontal>
    </vn-card>
    <vn-button-bar>
        <vn-submit
            disabled="!watcher.dataChanged()"
            label="Save">
        </vn-submit>
        <vn-button
            class="cancel"
            label="Undo changes"
            disabled="!watcher.dataChanged()"
            ng-click="watcher.loadOriginalData()">
        </vn-button>
    </vn-button-bar>
</form>

<!-- Filter travel dialog -->
<vn-dialog
    vn-id="filterDialog"
    message="Filter travel">
    <tpl-body class="travelFilter">
        <vn-horizontal>
            <vn-autocomplete
                label="Agency"
                ng-model="$ctrl.travelFilterParams.agencyModeFk"
                url="AgencyModes"
                show-field="name"
                value-field="id">
            </vn-autocomplete>
            <vn-autocomplete
                label="Warehouse Out"
                ng-model="$ctrl.travelFilterParams.warehouseOutFk"
                data="warehouses"
                show-field="name"
                value-field="id">
            </vn-autocomplete>
            <vn-autocomplete
                label="Warehouse In"
                ng-model="$ctrl.travelFilterParams.warehouseInFk"
                data="warehouses"
                show-field="name"
                value-field="id">
            </vn-autocomplete>
            <vn-date-picker
                label="Shipped"
                ng-model="$ctrl.travelFilterParams.shipped">
            </vn-date-picker>
            <vn-date-picker
                label="Landed"
                ng-model="$ctrl.travelFilterParams.landed">
            </vn-date-picker>
        </vn-horizontal>
        <vn-horizontal class="vn-mb-md">
            <vn-button vn-none
                label="Search"
                ng-click="$ctrl.filter()">
            </vn-button>
        </vn-horizontal>
        <vn-crud-model
            vn-id="travelsModel"
            url="Travels"
            filter="$ctrl.travelFilter"
            data="travels"
            limit="10">
        </vn-crud-model>
        <vn-data-viewer
        model="travelsModel"
        class="vn-w-lg">
            <vn-table class="scrollable">
                <vn-thead>
                    <vn-tr>
                        <vn-th shrink>ID</vn-th>
                        <vn-th expand>Agency</vn-th>
                        <vn-th expand>Warehouse Out</vn-th>
                        <vn-th expand>Warehouse In</vn-th>
                        <vn-th expand>Shipped</vn-th>
                        <vn-th expand>Landed</vn-th>
                    </vn-tr>
                </vn-thead>
                <vn-tbody>
                    <a ng-repeat="travel in travels"
                    class="clickable vn-tr search-result"
                    ng-click="$ctrl.selectTravel(travel.id)">
                        <vn-td shrink>
                            <span
                                vn-click-stop="travelDescriptor.show($event, travel.id)"
                                class="link">
                                {{::travel.id}}
                            </span>
                        </vn-td>
                        <vn-td expand>{{::travel.agency.name}}</vn-td>
                        <vn-td expand>{{::travel.warehouseOut.name}}</vn-td>
                        <vn-td expand>{{::travel.warehouseIn.name}}</vn-td>
                        <vn-td expand>{{::travel.shipped | date: 'dd/MM/yyyy'}}</vn-td>
                        <vn-td expand>{{::travel.landed | date: 'dd/MM/yyyy'}}</vn-td>
                    </a>
                </vn-tbody>
            </vn-table>
        </vn-data-viewer>
        <vn-travel-descriptor-popover
            vn-id="travel-descriptor"
            warehouse-fk="$ctrl.vnConfig.warehouseFk">
        </vn-travel-descriptor-popover>
    </tpl-body>
</vn-dialog>