div.row-fuid(align="center")
    h4(id="addVendorTitle", style="margin-left:8px") #{__("lblVendorInformation")}
    form(name="formAddVendor", id="formAddVendor", novalidate).formwrapper
        div(style="padding-bottom:20px; border-bottom: solid 1px #9e4198;")
            table.table-striped
                tr
                    td(valign="top", align="left")
                        label.cai-label(for="name", style="display:inline-block;") #{__('Name')}
                    td
                        input.pull-right(type="text", name="name", data-ng-model="vendor.name", placeholder="{{vendor.name}}", data-ng-duplicate, required, data-ng-minlength=3, data-ng-maxlength=30, maxlength=31)
                tr
                    td(valign="top", align="left")
                        label.cai-label(for="code", style="display:inline-block;") #{__('Code')}
                    td
                        input.pull-right(type="text", name="code", data-ng-blur="handleDuplicateVendorCode()", data-ng-disabled="vendorexists", data-ng-model="vendor.code", placeholder="{{vendor.code}}", data-ng-duplicate, required, data-ng-maxlength=40, maxlength=41)
                tr
                    td(valign="top", align="left")
                        label.cai-label(for="description", style="display:inline-block;") #{__('Description')}
                    td
                        input.pull-right(type="text", name="description", data-ng-model="vendor.description", placeholder="{{vendor.description}}", data-ng-duplicate, required, data-ng-minlength=3, data-ng-maxlength=100, maxlength=101)

            div
                ul(data-ng-show="formAddVendor.name.$invalid && formAddVendor.name.$dirty", class="alert alert-error")
                    li(ng-show="formAddVendor.name.$error.maxlength") #{__('lblvendorNameMaxLength')}
                    li(ng-show="formAddVendor.name.$error.minlength") #{__('lblvendorNameMinLength')}
                    li(ng-show="formAddVendor.name.$error.required") #{__('lblRequiredName')}
            div
                ul(data-ng-show="(formAddVendor.code.$invalid || formAddVendor.code.$error.duplicate) && formAddVendor.code.$dirty", class="alert alert-error")
                    li(ng-show="formAddVendor.code.$error.required") #{__('lblRequiredCode')}
                    li(ng-show="formAddVendor.code.$error.maxlength") #{__('lblvendorCodeMaxLength')}
                    li(ng-show="formAddVendor.code.$error.duplicate") #{__('lblvendorCodeExists')}
            div
                ul(data-ng-show="formAddVendor.description.$invalid && formAddVendor.description.$dirty",class="alert alert-error")
                    li(ng-show="formAddVendor.description.$error.required") #{__('lblRequiredDescription')}
                    li(ng-show="formAddVendor.description.$error.minlength") #{__('lblvendorDescriptionMinLength')}
                    li(ng-show="formAddVendor.description.$error.maxlength") #{__('lblvendorDescriptionMaxLength')}
        br
        div(style="width:100%;margin:0;float:left;border-bottom: solid 1px #9e4198;")
            div(style="width:50%;float:left;margin:0;padding:0;")
                h4(id="vendorContactTitle", style="margin-left:8px") #{__("lblVendorContact")}
                table
                    tr
                        td
                            label(class="control-label", for="firstname") #{__("lblFirstName")}
                        td
                            input(type="text", class="form-control", name="firstname", id="firstname", data-ng-model="vendor.contact.firstname")
                    tr
                        td
                            label(class="control-label", for="lastname") #{__("lblLastName")}
                        td
                            input(type="text", class="form-control", name="lastname", id="lastname", data-ng-model="vendor.contact.lastname")
                    tr
                        td
                            label(class="control-label", for="email") #{__("lblEmail")}
                        td
                            input(type="email", class="form-control", name="email",  id="email", data-ng-model="vendor.contact.email")

                    tr
                        td
                            label(class="control-label", for="phoneMobile") #{__("lblPhoneMobile")}
                        td
                            input(type="text", class="form-control", name="phoneMobile", id="phoneMobile", data-ng-model="vendor.contact.phoneMobile")
                    tr
                        td
                            label(class="control-label", for="phoneMain") #{__("lblPhonePrimary")}
                        td
                            input(type="text", class="form-control", name="phoneMain", id="phoneMain", data-ng-model="vendor.contact.phoneMain")
                    tr
                        td
                            label(class="control-label", for="phoneExt") #{__("lblPhoneExtension")}
                        td
                            input(type="text", class="form-control", name="phoneExt", id="phoneExt", data-ng-model="vendor.contact.phoneExt")

            div(style="width:50%;float:left;margin:0;padding:0;")
                h4(id="vendorDescTitle", style="margin-left:8px") #{__("lblVendorAddress")}
                table
                    tr
                        td
                            label(class="control-label", for="description1") #{__("lblAddress1")}
                        td
                            input(type="text", class="form-control", name="description1", id="description1", data-ng-model="vendor.address.description1")
                    tr
                        td
                            label(class="control-label", for="description2") #{__("lblAddress2")}
                        td
                            input(type="text", class="form-control", name="description2", id="description2", data-ng-model="vendor.address.description2")
                    tr
                        td
                            label(class="control-label", for="description3") #{__("lblAddress3")}
                        td
                            input(type="text", class="form-control", name="description3", id="description3", data-ng-model="vendor.address.description3")
                    tr
                        td
                            label(class="control-label", for="locality") #{__("lblLocality")}
                        td
                            input(type="text", class="form-control", name="locality", id="locality", data-ng-model="vendor.address.locality")
                    tr
                        td
                            label(class="control-label", for="region") #{__("lblRegion")}
                        td
                            input(type="text", class="form-control", name="region", id="region", data-ng-model="vendor.address.region")

                    tr
                        td
                            label(class="control-label", for="postalcode") #{__("lblPostalCode")}
                        td
                            input(type="text", class="form-control", name="postalcode", id="postalcode", data-ng-model="vendor.address.postalcode")
                    tr
                        td
                            label(class="control-label", for="country") #{__("lblCountry")}
                        td
                            input(type="text", class="form-control", name="country", id="country", data-ng-model="vendor.address.country")

        div.pull-left(style="width:100%;")
            ul(data-ng-show="formAddVendor.email.$invalid && formAddVendor.email.$dirty", class="alert alert-error")
                li(class="error", ng-show="formAddVendor.email.$error.email") #{__("lblemailValidation")}

        br
        div.row-fluid(align="center", style="float:left; padding:10px 0")
            button(id='btnCancel', class='btn btn-primary', data-ng-click="cancel()") #{__('Cancel')}
             
            input(id="btnSave", class="btn btn-primary", type="submit", data-ng-click="update()", ng-disabled="formAddVendor.$invalid || formAddVendor.code.$error.duplicate") #{__("btnSave")}