Vendaweb-portal/src/app/sales/components/create-address-modal/create-address-modal.component.html

<kendo-dialog *ngIf="openedDialog" [(width)]="windowWidth" [(height)]="windowHeight" (close)="closeDialog()"
  title="Novo endereço" autoFocusedElement="#zipCode">
  <!--kendo-window-titlebar
    style="background-color: rgb(34, 34, 61); color: white"
  >
    <div
      class="justify-content-center"
      style="font-size: 18px; line-height: 1.3em; color: white"
    >
      <span class="k-icon k-i-user d-inline"></span>
      <h5 class="d-inline ms-2">Novo cliente</h5>
    </div>
  </kendo-window-titlebar-->
  <div class="row align-items-start">
    <div class="col-12">
      <ng-container>
        <form class="k-form" [formGroup]="form" #formCustomer>
          <fieldset class="k-form-fieldset">
            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Cep</span>
                <input kendoTextBox id="zipCode" formControlName="zipCode" showSuccessIcon="initial"
                  showErrorIcon="initial" (blur)="consultaCep()">
              </label>
            </kendo-formfield>

            <kendo-formfield>
              <label>
                <span>Praça</span>
                <kendo-combobox [data]="places$ | async" formControlName="place"
                  [kendoDropDownFilter]="{ operator: 'contains' }" textField="name" valueField="id"
                  placeholder="Selecione a praça do cliente...">
                </kendo-combobox>
              </label>

            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Endereço</span>
                <kendo-textbox #address [maxlength]="40" formControlName="address" showSuccessIcon="initial"
                  showErrorIcon="initial" (blur)="removeCharacters('address')"></kendo-textbox>
              </label>
            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Número</span>
                <kendo-textbox #addressNumber formControlName="addressNumber" showSuccessIcon="initial"
                  showErrorIcon="initial"
                  onkeypress="return event.charCode >= 48 && event.charCode <= 57"></kendo-textbox>
              </label>
            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Complemento</span>
                <kendo-textbox #complement [maxlength]="40" formControlName="complement" showSuccessIcon="initial"
                  showErrorIcon="initial" (blur)="removeCharacters('complement')"></kendo-textbox>
              </label>
            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Bairro</span>
                <kendo-textbox #neighbourhood formControlName="neighborhood" showSuccessIcon="initial"
                  showErrorIcon="initial" (blur)="removeCharacters('neighborhood')"></kendo-textbox>
              </label>
            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Cidade</span>
                <kendo-textbox #city [maxlength]="15" formControlName="city" showSuccessIcon="initial"
                  showErrorIcon="initial" (blur)="removeCharacters('city')"></kendo-textbox>
              </label>
            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Estado</span>
                <kendo-textbox #state formControlName="state" showSuccessIcon="initial"
                  showErrorIcon="initial"></kendo-textbox>
              </label>
            </kendo-formfield>

            <kendo-formfield orientation="horizontal">
              <label>
                <span>TipoEndereco</span>
                <ul class="k-radio-list k-list-horizontal">
                  <li class="k-radio-item">
                    <label>
                      <input type="radio" #addressTypeNormal value="N" kendoRadioButton formControlName="addressType" />
                      <span class="ms-2">Normal</span>
                    </label>
                  </li>
                  <li class="k-radio-item">
                    <label>
                      <input type="radio" #addressTypeShopping value="S" kendoRadioButton
                        formControlName="addressType" />
                      <span class="ms-2">Shopping</span>
                    </label>
                  </li>
                  <li class="k-radio-item">
                    <label>
                      <input type="radio" #addressTypeCondominio value="C" kendoRadioButton
                        formControlName="addressType" />
                      <span class="ms-2">Condominio</span>
                    </label>
                  </li>
                </ul>
              </label>
              <kendo-formerror>Error: O tipo de endereço é</kendo-formerror>
            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Ponto de referencia</span>
                <kendo-textbox #state formControlName="referencePoint" showSuccessIcon="initial" showErrorIcon="initial"
                  (blur)="removeCharacters('referencePoint')"></kendo-textbox>
              </label>
            </kendo-formfield>

            <kendo-formfield showHints="initial" showErrors="always">
              <label>
                <span>Observações</span>
                <kendo-textbox #state formControlName="note" showSuccessIcon="initial" showErrorIcon="initial"
                  (blur)="removeCharacters('note')"></kendo-textbox>
              </label>
            </kendo-formfield>
          </fieldset>
        </form>
      </ng-container>

      <div *ngIf="isloading">
        <div class="k-loading-panel">
          <div class="k-loading-panel-mask"></div>
          <div class="k-loading-panel-wrapper">
            <kendo-loader [type]="'infinite-spinner'" [themeColor]="'primary'" [size]="'large'">
            </kendo-loader>
            <div class="k-loading-panel-text">Aguarde...</div>
          </div>
        </div>
      </div>
      <div kendoDialogContainer></div>
    </div>
  </div>

  <kendo-dialog-actions>
    <button (click)="showConfirmation()" class="btn-fill-blue text-btn-white" kendoButton [primary]="true"
      [disabled]="!form.valid">
      Gravar
    </button>
    <button class="btn-flat text-btn-flat" kendoButton look="flat" (click)="closeDialog()">
      Cancelar
    </button>

    <button class="btn-flat text-btn-flat" kendoButton look="flat" (click)="googleGeocode()">
      Mapa do Endereço
    </button>
  </kendo-dialog-actions>

  <app-confirmation *ngIf="isShowConfirmation" opened="isShowConfirmation" title="{{ titleMessage }}"
    message="{{ messageConfirmation }}" textButtonConfirmation="{{ textButtonConfirmation }}"
    textButtonCancel="{{ textButtonCancel }}" (resultEvent)="returnConfirmationSalve($event)"></app-confirmation>
</kendo-dialog>


<kendo-dialog *ngIf="showMap" [height]="600" [width]="800" title="Confirme a localização do endereço"
  (close)="MapCep(false)">
  <agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="zoom">
    <agm-marker [latitude]="latitude" [longitude]="longitude"></agm-marker>
  </agm-map>
</kendo-dialog>