<mg-ajax 
    path="Items/{{patch.params.id}}" 
    options="vnPatch" 
    override="{filter: {include: [{relation: 'itemType'}, {relation: 'origin'}, {relation: 'ink'}, {relation: 'producer'}, {relation: 'expence'}]}}">
</mg-ajax>
<vn-watcher
    vn-id="watcher"
    data="$ctrl.item"
    form="form"
    save="patch">
</vn-watcher>
<form name="form" ng-submit="watcher.submit()" ng-cloak class="vn-w-md">
    <vn-card class="vn-pa-lg">
        <vn-horizontal>
            <vn-textfield
                vn-one
                label="Name"
                ng-model="$ctrl.item.name"
                rule
                vn-focus>
            </vn-textfield>
            <vn-textfield 
                vn-one label="Full name" 
                ng-model="$ctrl.item.longName"
                rule
                info="Full name calculates based on tags 1-3. Is not recommended to change it manually">
            </vn-textfield>
            <vn-autocomplete vn-one
                url="ItemTypes"
                label="Type"
                show-field="name"
                value-field="id"
                ng-model="$ctrl.item.typeFk"
                initial-data="$ctrl.item.itemType">
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal>
            <vn-autocomplete vn-one
                url="Intrastats"
                label="Intrastat"
                show-field="description"
                value-field="id"
                ng-model="$ctrl.item.intrastatFk"
                search-function="{or: [{id: {like: $search +'%'}}, {description: {like: '%'+ $search +'%'}}]}"
                initial-data="$ctrl.item.intrastat">
                <tpl-item style="display: flex;">
                    <div style="width: 6em; text-align: right; padding-right: 1em;">{{::id}}</div>
                    <div>{{::description}}</div>
                </tpl-item>
            </vn-autocomplete>
            <vn-autocomplete vn-one
                url="Expences"
                label="Expence"
                ng-model="$ctrl.item.expenceFk"
                initial-data="$ctrl.item.expence">
            </vn-autocomplete>
            <vn-autocomplete vn-one
                url="Origins"
                label="Origin"
                show-field="name"
                value-field="id"
                ng-model="$ctrl.item.originFk"
                initial-data="$ctrl.item.origin">
        </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal>
            <vn-textfield
                vn-one
                label="Reference"
                ng-model="$ctrl.item.comment"
                rule>
            </vn-textfield>
            <vn-input-number
                vn-one
                min="0"
                label="Size"
                ng-model="$ctrl.item.size"
                rule>
            </vn-input-number>
            <vn-input-number
                vn-one
                min="0" 
                label="stems" 
                ng-model="$ctrl.item.stems"
                rule>
            </vn-input-number>
        </vn-horizontal>
        <vn-horizontal>
            <vn-input-number
                vn-one
                min="0"
                step="0.01"
                label="Density" 
                ng-model="$ctrl.item.density"
                rule>
            </vn-input-number>
            <vn-input-number
                vn-one
                min="0"
                label="Relevancy" 
                ng-model="$ctrl.item.relevancy"
                rule>
            </vn-input-number>
        </vn-horizontal>
        <vn-horizontal>
            <vn-check
                vn-one
                label="Active"
                ng-model="$ctrl.item.isActive">
            </vn-check>
            <vn-check
            vn-one
            label="Price in kg"
            ng-model="$ctrl.item.hasKgPrice">
        </vn-check>
            <vn-textarea
                vn-one
                label="description"
                ng-model="$ctrl.item.description"
                rule>
            </vn-textarea>
        </vn-horizontal>
    </vn-card>
    <vn-button-bar>
            <vn-submit label="Save"></vn-submit>
            <vn-button label="Undo changes" ng-if="$ctrl.$scope.form.$dirty" ng-click="watcher.loadOriginalData()"></vn-button>
    </vn-button-bar>
</form>