<vn-watcher
    vn-id="watcher"
    data="$ctrl.dms">
</vn-watcher>
<form
    name="form"
    ng-submit="$ctrl.onSubmit()"
    class="vn-ma-md"
    enctype="multipart/form-data">
    <div class="vn-w-md">
        <vn-card class="vn-pa-lg">
            <vn-horizontal>
                <vn-autocomplete vn-one
                    label="Thermograph"
                    ng-model="$ctrl.thermograph.thermographId"
                    url="TravelThermographs"
                    show-field="thermographFk"
                    value-field="thermographFk"
                    disabled="true">
                </vn-autocomplete>
                <vn-textfield vn-one
                    label="State" 
                    ng-model="$ctrl.thermograph.state"
                    rule>
                </vn-textfield>
            </vn-horizontal>
            <vn-horizontal>
                <vn-textfield vn-one
                    label="Reference" 
                    ng-model="$ctrl.thermograph.reference"
                    rule>
                </vn-textfield>
                <vn-autocomplete vn-one
                    label="Type"
                    ng-model="$ctrl.thermograph.dmsTypeId"
                    url="DmsTypes"
                    show-field="name"
                    value-field="id">
                </vn-autocomplete>
            </vn-horizontal>
            <vn-horizontal>
                <vn-autocomplete vn-one
                    label="Company"
                    ng-model="$ctrl.thermograph.companyId"
                    url="Companies"
                    show-field="code"
                    value-field="id">
                </vn-autocomplete>
                <vn-autocomplete vn-one
                    label="Warehouse"
                    ng-model="$ctrl.thermograph.warehouseId"
                    url="Warehouses"
                    show-field="name"
                    value-field="id">
                </vn-autocomplete>
            </vn-horizontal>
            <vn-horizontal>
                <vn-textarea vn-one vn-focus
                    label="Description" 
                    ng-model="$ctrl.thermograph.description"
                    rule>
                </vn-textarea>
            </vn-horizontal>
            <vn-horizontal>
                <vn-input-file
                    vn-one 
                    label="File" 
                    ng-model="$ctrl.thermograph.files"
                    on-change="$ctrl.onFileChange($files)"
                    accept="{{$ctrl.allowedContentTypes}}"
                    multiple="true">
                    <append>
                        <vn-icon vn-none
                            color-marginal
                            title="{{$ctrl.contentTypesInfo}}"
                            icon="info">
                        </vn-icon>
                    </append>
                </vn-input-file>
            </vn-horizontal>
        </vn-card>
        <vn-button-bar>
            <vn-submit label="Save"></vn-submit>
            <vn-button ui-sref="travel.card.thermograph.index" label="Cancel"></vn-button>
        </vn-button-bar>
    </div>
</form>