salix/modules/item/front/request-search-panel/index.html

<div class="search-panel">
    <vn-crud-model
        auto-load="true" 
        url="Warehouses" 
        data="warehouses">
    </vn-crud-model>
    <form id="manifold-form" ng-submit="$ctrl.onSearch()">
        <vn-horizontal class="vn-px-lg vn-pt-lg">
            <vn-textfield
                vn-one
                label="General search"
                ng-model="filter.search"
                vn-focus>
            </vn-textfield>
        </vn-horizontal>
        <vn-horizontal class="vn-px-lg">
            <vn-textfield
                vn-one
                label="Ticket id"
                ng-model="filter.ticketFk">
            </vn-textfield>
            <vn-autocomplete
                vn-one
                ng-model="filter.attenderFk"
                url="Workers/activeWithRole"
                search-function="{firstName: $search}"
                value-field="id"
                where="{role: {inq: ['logistic', 'buyer']}}"
                label="Atender">
                <tpl-item>{{nickname}}</tpl-item>
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal class="vn-px-lg">
            <vn-textfield
                vn-one
                label="Client id"
                ng-model="filter.clientFk">
            </vn-textfield>
            <vn-autocomplete
                vn-one
                label="Warehouse"
                ng-model="filter.warehouseFk"
                data="warehouses"
                show-field="name"
                value-field="id">
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal class="vn-px-lg">
            <vn-autocomplete
                vn-one
                ng-model="filter.requesterFk"
                url="Workers/activeWithInheritedRole"
                search-function="{firstName: $search}"
                value-field="id"
                where="{role: 'salesPerson'}"
                label="Comercial">
                <tpl-item>{{firstName}} {{lastName}}</tpl-item>
            </vn-autocomplete>
        </vn-horizontal>
       
    <section class="vn-px-md">
        <vn-horizontal class="manifold-panel vn-pa-md">
            <vn-date-picker
                vn-one
                label="From"
                ng-model="filter.from"
                on-change="$ctrl.from = value">
            </vn-date-picker>
            <vn-date-picker
                vn-one
                label="To"
                ng-model="filter.to"
                on-change="$ctrl.to = value">
            </vn-date-picker>
            <vn-none class="or vn-px-md" translate>Or</vn-none>
                <vn-input-number
                    vn-one
                    min="0"
                    step="1"
                    label="Days onward"
                    ng-model="filter.scopeDays"
                    on-change="$ctrl.scopeDays = value"
                    display-controls="true">
                </vn-input-number>
                <vn-icon color-marginal
                    icon="info"
                    vn-tooltip="Cannot choose a range of dates and days onward at the same time">
                </vn-icon>
        </vn-horizontal>
    </section>
        <vn-horizontal class="vn-px-lg">
            <vn-check vn-one 
                triple-state="true" 
                label="For me" 
                ng-model="filter.mine">
            </vn-check>
            <vn-autocomplete
                vn-one
                ng-model="filter.state"
                data="$ctrl.states"
                value-field="code"
                label="State">
                <tpl-item>{{name}}</tpl-item>
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal class="vn-px-lg vn-pb-lg vn-mt-lg">
            <vn-submit label="Search"></vn-submit>
        </vn-horizontal>
    </form>
</div>