<mg-ajax path="/client/api/Clients/createWithUser" options="vnPost"></mg-ajax>
<vn-watcher
    vn-id="watcher"
    data="$ctrl.client"
    form="form"
    save="post">
</vn-watcher>
<div class="content-block">
    <form name="form" vn-http-submit="$ctrl.onSubmit()" compact>
        <vn-card pad-large>
            <vn-horizontal>
                <vn-textfield vn-two label="Comercial Name" field="$ctrl.client.name" vn-focus></vn-textfield>
                <vn-autocomplete vn-one
                    field="$ctrl.client.salesPersonFk"
                    url="/client/api/Clients/activeWorkersWithRole"
                    search-function="{firstName: $search}"
                    show-field="firstName"
                    value-field="id"
                    where="{role: 'employee'}"
                    label="Salesperson">
                    <tpl-item>{{firstName}} {{name}}</tpl-item>
                </vn-autocomplete>
            </vn-horizontal>
            <vn-horizontal>
                <vn-textfield vn-two label="Business name" field="$ctrl.client.socialName"></vn-textfield>
                <vn-textfield vn-one label="Tax number" field="$ctrl.client.fi"></vn-textfield>
            </vn-horizontal>
            <vn-horizontal>
                <vn-textfield
                    vn-two
                    label="Street"
                    field="$ctrl.client.street">
                </vn-textfield>
            </vn-horizontal>
            <vn-horizontal>
                <vn-autocomplete vn-one
                    field="$ctrl.client.postcode"
                    selection="$ctrl.postcodeSelection"
                    search-function="{code: $search}"
                    url="/api/Postcodes/location"
                    fields="['code', 'townFk']"
                    show-field="code"
                    value-field="code"
                    label="Postcode">
                    <tpl-item>
                        {{code}}, {{town.name}} - {{town.province.name}} 
                        ({{town.province.country.country}})
                    </tpl-item>
                </vn-autocomplete>
                <vn-icon-button vn-auto margin-medium-v
                    icon="add_circle"
                    vn-tooltip="New postcode"
                    ng-click="postcode.open()">
                </vn-icon-button>
                <vn-autocomplete vn-one
                    label="City"
                    url="/api/Towns"
                    show-field="name"
                    value-field="name"
                    field="$ctrl.client.city">
                </vn-autocomplete>
            </vn-horizontal>
            <vn-horizontal>
                <vn-autocomplete vn-one
                    disabled="true"
                    field="$ctrl.client.provinceFk"
                    url="/api/Provinces"
                    show-field="name"
                    value-field="id"
                    label="Province">
                </vn-autocomplete>
                <vn-autocomplete vn-one
                    disabled="true"
                    field="$ctrl.client.countryFk"
                    url="/api/Countries"
                    show-field="country"
                    value-field="id"
                    label="Country">
                </vn-autocomplete>
            </vn-horizontal>
            <vn-horizontal>
                <vn-textfield
                    vn-one
                    label="Web user"
                    field="$ctrl.client.userName">
                </vn-textfield>
                <vn-textfield
                    vn-one
                    label="Email"
                    field="$ctrl.client.email"
                    info="You can save multiple emails">
                </vn-textfield>
            </vn-horizontal>
            <vn-horizontal pad-small-v>
                <vn-check
                    vn-one
                    label="Is equalizated"
                    field="$ctrl.client.isEqualizated">
                </vn-check>
            </vn-horizontal>
        </vn-card>
        <vn-button-bar>
            <vn-submit label="Create"></vn-submit>
            <vn-button ui-sref="client.index" label="Cancel"></vn-button>
        </vn-button-bar>
    </form>

    <!-- New postcode dialog -->
    <vn-client-postcode vn-id="postcode"
        on-response="$ctrl.onResponse(response)">
    </vn-client-postcode>
</div>