salix/modules/client/front/address/create/index.html

<vn-watcher
    vn-id="watcher"
    url="Clients/{{$ctrl.$params.id}}/createAddress"
    id-field="id"
    data="$ctrl.address"
    params="$ctrl.address"
    insert-mode="true"
    form="form">
</vn-watcher>
<vn-crud-model
    auto-load="true"
    url="Provinces/location"
    data="provincesLocation"
    order="id">
</vn-crud-model>
<vn-crud-model
    auto-load="true"
    url="Incoterms"
    data="incoterms"
    order="name">
</vn-crud-model>
<vn-crud-model
    auto-load="true"
    url="CustomsAgents"
    data="customsAgents"
    order="fiscalName">
</vn-crud-model>
<form name="form" ng-submit="$ctrl.onSubmit()" class="vn-w-md">
    <vn-card class="vn-pa-lg">
        <vn-horizontal>
            <vn-check
                vn-one
                label="Default" ng-model="$ctrl.address.isDefaultAddress">
            </vn-check> 
        </vn-horizontal>
        <vn-horizontal>
            <vn-textfield
                vn-one
                label="Consignee"
                ng-model="$ctrl.address.nickname"
                rule
                vn-focus>
            </vn-textfield>
            <vn-textfield
                vn-one
                label="Street address"
                ng-model="$ctrl.address.street"
                rule>
            </vn-textfield>
        </vn-horizontal>
        <vn-horizontal>
            <vn-datalist vn-one
                label="Postcode"
                ng-model="$ctrl.address.postalCode"
                selection="$ctrl.postcode"
                url="Postcodes/location"
                fields="['code','townFk']"
                order="code, townFk"
                value-field="code"
                show-field="code"
                rule>
                <tpl-item>
                    {{code}} - {{town.name}} ({{town.province.name}}, 
                    {{town.province.country.country}})
                </tpl-item>
                <append>
                    <vn-icon-button
                        icon="add_circle"
                        vn-tooltip="New postcode"
                        ng-click="postcode.open()"
                        vn-acl="deliveryBoss"
                        vn-acl-action="remove">
                    </vn-icon-button>
                </append>
            </vn-datalist>
            <vn-datalist vn-id="town" vn-one 
                label="City"
                ng-model="$ctrl.address.city"
                selection="$ctrl.town"
                url="Towns/location"
                fields="['id', 'name', 'provinceFk']"
                show-field="name"
                value-field="name">
                <tpl-item>
                    {{name}}, {{province.name}}
                    ({{province.country.country}})
                </tpl-item>
            </vn-datalist>
            <vn-autocomplete vn-id="province" vn-one
                label="Province"
                ng-model="$ctrl.address.provinceFk"
                data="provincesLocation"
                fields="['id', 'name', 'countryFk']"
                show-field="name"
                value-field="id"
                rule>
                <tpl-item>{{name}} ({{country.country}})</tpl-item>
            </vn-autocomplete>
        </vn-horizontal>
        <vn-horizontal>
            <vn-autocomplete
                vn-one
                ng-model="$ctrl.address.agencyModeFk"
                url="AgencyModes/isActive"
                show-field="name"
                value-field="id"
                label="Agency">
            </vn-autocomplete>
            <vn-textfield
                vn-one
                label="Phone"
                ng-model="$ctrl.address.phone"
                rule>
            </vn-textfield>
            <vn-textfield
                vn-one
                label="Mobile"
                ng-model="$ctrl.address.mobile"
                rule>
            </vn-textfield>
        </vn-horizontal>
        <vn-horizontal>
            <vn-autocomplete vn-one
                ng-model="$ctrl.address.incotermsFk"
                data="incoterms"
                show-field="name"
                value-field="code"
                label="Incoterms">
            </vn-autocomplete>
            <vn-autocomplete vn-one
                ng-model="$ctrl.address.customsAgentFk"
                data="customsAgents"
                show-field="fiscalName"
                value-field="id"
                label="Customs agent">
                <append>
                    <vn-icon-button
                        icon="add_circle"
                        vn-tooltip="New customs agent"
                        ng-click="$ctrl.showCustomAgent($event)">
                    </vn-icon-button>
                </append>
            </vn-autocomplete>
        </vn-horizontal>
    </vn-card>
    <vn-button-bar>
        <vn-submit label="Save"></vn-submit>
        <vn-button
            label="Cancel"
            ui-sref="client.card.address.index">
        </vn-button>
    </vn-button-bar>
</form>

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

<!-- Create custom agent dialog -->
<vn-dialog class="edit" 
    vn-id="customAgent"
    on-accept="$ctrl.onCustomAgentAccept()"
    message="New customs agent">
    <tpl-body>
        <vn-horizontal>
            <vn-textfield vn-one vn-focus
                label="NIF"
                ng-model="$ctrl.newCustomsAgent.nif"
                required="true">
            </vn-textfield>
            <vn-textfield vn-one
                label="Fiscal name"
                ng-model="$ctrl.newCustomsAgent.fiscalName"
                required="true">
            </vn-textfield>
        </vn-horizontal>
        <vn-horizontal>
            <vn-textfield vn-one
                label="Street"
                ng-model="$ctrl.newCustomsAgent.street">
            </vn-textfield>
            <vn-textfield vn-one
                label="Phone"
                ng-model="$ctrl.newCustomsAgent.phone">
            </vn-textfield>
        </vn-horizontal>
    </tpl-body>
    <tpl-buttons>
        <input type="button" response="cancel" translate-attr="{value: 'Cancel'}"/>
        <button response="accept" translate>Create</button>
    </tpl-buttons>
</vn-dialog>