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

<mg-ajax path="Tags" options="mgIndex as tags"></mg-ajax>
<div class="search-panel">
    <form ng-submit="$ctrl.onSearch()">
        <vn-horizontal>
            <vn-textfield
                vn-one
                label="General search"
                ng-model="filter.search"
                info="Search items by id, name or barcode"
                vn-focus>
            </vn-textfield>
        </vn-horizontal>
        <vn-horizontal>
            <vn-autocomplete
                vn-one
                vn-focus
                url="ItemCategories"
                label="Category"
                show-field="name"
                value-field="id"
                ng-model="filter.categoryFk">
            </vn-autocomplete>
            <vn-autocomplete vn-one
                url="ItemTypes"
                label="Type"
                where="{categoryFk: filter.categoryFk}"
                show-field="name"
                value-field="id"
                ng-model="filter.typeFk"
                fields="['categoryFk']"
                include="'category'">
                <tpl-item>
                    <div>{{name}}</div>
                    <div class="text-caption text-secondary">
                        {{category.name}}
                    </div>
                </tpl-item>>
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal>
            <vn-autocomplete 
                vn-one
                ng-model="filter.buyerFk"
                url="Items/activeBuyers"
                show-field="nickname"
                search-function="{nickname: {like: '%'+ $search +'%'}}"
                value-field="workerFk"
                label="Buyer">
            </vn-autocomplete>
            <vn-autocomplete
                vn-one
                label="Supplier"
                ng-model="filter.supplierFk"
                url="Suppliers"
                fields="['name','nickname']"
                search-function="{or: [{nickname: {like: '%'+ $search +'%'}}, {name: {like: '%'+ $search +'%'}}]}"
                show-field="name"
                value-field="id">
                <tpl-item>{{name}}: {{nickname}}</tpl-item>
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal class="vn-pt-sm">
            <vn-one class="text-subtitle1" translate>
                Tags
            </vn-one>
            <vn-icon-button
                vn-none
                vn-bind="+"
                vn-tooltip="Add tag"
                icon="add_circle"
                ng-click="filter.tags.push({})">
            </vn-icon-button>
        </vn-horizontal>
        <vn-horizontal ng-repeat="itemTag in filter.tags">
            <vn-autocomplete
                vn-id="tag"
                vn-one
                ng-model="itemTag.tagFk"
                data="tags.model"
                show-field="name"
                label="Tag"
                on-change="itemTag.value = null">
            </vn-autocomplete>
            <vn-textfield
                vn-one
                ng-show="tag.selection.isFree || tag.selection.isFree == undefined"
                vn-id="text"
                label="Value"
                ng-model="itemTag.value">
            </vn-textfield>
            <vn-autocomplete 
                vn-one
                ng-show="tag.selection.isFree === false"
                url="{{'Tags/' + itemTag.tagFk + '/filterValue'}}"
                search-function="{value: $search}"
                label="Value"
                ng-model="itemTag.value"
                show-field="value"
                value-field="value"
                rule>
            </vn-autocomplete>
            <vn-icon-button
                vn-none
                vn-tooltip="Remove tag"
                icon="delete"
                ng-click="filter.tags.splice($index, 1)"
                tabindex="-1">
            </vn-icon-button>
        </vn-horizontal>
        <vn-horizontal class="vn-pt-sm">
            <vn-one class="text-subtitle1" translate>
                More fields
            </vn-one>
            <vn-icon-button
                vn-none
                vn-bind="+"
                vn-tooltip="Add field"
                icon="add_circle"
                ng-click="$ctrl.fieldFilters.push({})">
            </vn-icon-button>
        </vn-horizontal>
        <vn-horizontal ng-repeat="fieldFilter in $ctrl.fieldFilters">
            <vn-autocomplete
                vn-one
                label="Field"
                ng-model="fieldFilter.name"
                data="$ctrl.moreFields"
                value-field="name"
                show-field="label"
                show-filter="false"
                translate-fields="['label']"
                selection="info"
                on-change="fieldFilter.value = null">
            </vn-autocomplete>
            <vn-one ng-switch="info.type">
                <div ng-switch-when="Number">
                    <vn-input-number
                        label="Value"
                        ng-model="fieldFilter.value">
                    </vn-input-number>
                </div>
                <div ng-switch-when="Boolean">
                    <vn-check
                        label="Value"
                        ng-model="fieldFilter.value">
                    </vn-check>
                </div>
                <div ng-switch-when="Date">
                    <vn-date-picker
                        label="Value"
                        ng-model="fieldFilter.value">
                    </vn-date-picker>
                </div>
                <div ng-switch-default>
                    <vn-textfield
                        label="Value"
                        ng-model="fieldFilter.value">
                    </vn-textfield>
                </div>
            </vn-one>
            <vn-icon-button
                vn-none
                vn-tooltip="Remove field"
                icon="delete"
                ng-click="$ctrl.removeField($index, fieldFilter.name)"
                tabindex="-1">
            </vn-icon-button>
        </vn-horizontal>
        <vn-horizontal>
            <vn-check 
                vn-one
                label="Floramondo"
                ng-model="filter.isFloramondo"
                triple-state="true">
            </vn-check>
        </vn-horizontal>
        <vn-horizontal class="vn-mt-lg">
            <vn-submit label="Search"></vn-submit>
        </vn-horizontal>
    </form>
</div>