
<admin-page-header [title]="'Error 404'" ></admin-page-header>

<!-- Edit 404 page -->
<div class="col-xl-12 col-lg-12 col-md-12">
  <div class="card ">
    <div class="card-header border-0">
      <h4 class="card-title">{{'404 Error Page' | translate}}</h4>
    </div>
    <form #error404="ngForm" (ngSubmit)="editError404(error404, 'error404')">
      <div class="card-body">
        <div class="form-group">
          <label class="form-label">{{'Title' | translate}} <span class="text-red">*</span></label>
          <input required type="text" class="form-control" [value]="erroRes?.[0]?.['errorvalue']" [ngModel]="erroRes?.[0]?.['errorvalue']" name="404title">
        </div>
        <div class="form-group">
          <label class="form-label">{{'Subtitle' | translate}} </label>
          <angular-editor [config]="toolbar" #description="ngModel" [ngModel]="erroRes?.[1]?.['errorvalue']" [class.is-invalid]="description.invalid && description.touched" class="form-control" [placeholder]="'Enter text here' | translate" name="404subtitle"></angular-editor>
          @if (description.errors?.['maxLength']) {
            <div class="limit-error">
              {{ description.errors?.['maxLength'].actualLength }}/{{ description.errors?.['maxLength'].maxLength }} {{' exceeded the limit' | translate}}
            </div>
          }
        </div>
      </div>
      <div class="card-footer">
        <div class="form-group float-end ">
          <button type="submit" [disabled]="error404.invalid || sendingResponse['error404']" class="btn btn-secondary" >{{'Save Changes' | translate}}
            @if (sendingResponse['error404']) {
              <i class="fa fa-spinner fa-spin mx-1"></i>
            }
          </button>
        </div>
      </div>
    </form>
  </div>
</div>
<!-- End Edit 404 page -->