<admin-page-header [title]="'Envato Settings'" ></admin-page-header>

<div class="row">
  <!-- Envato Expires follow this url -->
  <div class="col-xl-12 col-lg-12 col-md-12">
    <div class="card ">
      <div class="card-header border-bottom">
        <h4 class="card-title">{{'Envato Setting' | translate}}</h4>
      </div>
      <form #EnvatoSetting="ngForm" (ngSubmit)="updateEnvatoSetting(EnvatoSetting, 'envatoSett')">
        <div class="card-body pt-2 pb-2">
          <div class="row">
            <!--- Enable purchase code to employees --->
            <div class="border-bottom">
              <div class="col-sm-12 col-md-12 ps-0">
                <div class="form-group">
                  <div class="switch_section">
                    <div class="switch-toggle d-flex">
                      <span class="onoffswitch2">
                        <input type="checkbox" id="purchasecode_on" name="purchasecode_on"
                          value="on" class="toggle-class onoffswitch2-checkbox"
                          [checked]="setting?.purchasecode_on =='on' ? true: false" [ngModel]="setting?.purchasecode_on =='on' ? true: false">
                        <label for="purchasecode_on"
                        class="toggle-class onoffswitch2-label"></label>
                      </span>
                      <div class="ps-3">
                        <label class="form-label d-inline">{{'Enable purchase code to employees' | translate}}</label>
                        <small class="text-muted"><i>({{'If you enable this, employees can see the purchase code submitted by customer’s.' | translate}})</i></small>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!--- END Enable purchase code to employees --->

            <!--- Envato Expired On --->
            <div class="border-bottom">
              <div class="col-sm-12 col-md-12 pt-2 ps-0">
                <div class="form-group">
                  <div class="switch_section">
                    <div class="switch-toggle d-flex mt-4">
                      <span class="onoffswitch2">
                        <input type="checkbox" id="envato_expired_on"
                          name="ENVATO_EXPIRED_BLOCK" value="on"
                          class="toggle-class onoffswitch2-checkbox"
                          [checked]="setting?.ENVATO_EXPIRED_BLOCK=='on' ? true : false" [ngModel]="setting?.ENVATO_EXPIRED_BLOCK=='on' ? true : false" #envato_expired_on>
                        <label for="envato_expired_on"
                        class="toggle-class onoffswitch2-label"></label>
                      </span>
                      <div class="ps-3">
                        <label class="form-label d-inline">{{'Envato Expired On' | translate}}</label>
                        <small class="text-muted"><i>({{'If you enable this Envato Expired switch, customer’s and guest’s cannot create ticket with an expired license.' | translate}})</i></small>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!--- END Envato Expired On --->

            <div class="col-xl-12 col-lg-12 col-md-12 mt-4">
              <div class="form-group ">
                <label for="" class="form-label d-inline">{{'Support policy URL' | translate}}
                  @if (!!envato_expired_on?.checked) {
                    <span class="text-red">*</span>
                  }</label>
                  <small class="text-muted"><i>({{"When a customer tries to create a ticket with an expired license, an alert will be displayed to the customer with the below URL to redirect to your support policies page." | translate}})</i></small>
                  <input [required]="!!envato_expired_on?.checked" #supportpolicy="ngModel" [class.is-invalid]="supportpolicy.invalid && supportpolicy.touched"
                    class="form-control col-md-6 mt-3 pb-1"
                    placeholder="https://example.com" name="SUPPORT_POLICY_URL" type="url"
                    [value]="setting?.SUPPORT_POLICY_URL" [ngModel]="setting?.SUPPORT_POLICY_URL">
                  @if ((supportpolicy.invalid && supportpolicy.touched) || supportpolicy.dirty) {
                    <div>
                      @if (supportpolicy.errors?.['required']) {
                        <small class="text-danger">{{'Support Policy URL is required' | translate}}</small>
                      }
                    </div>
                  }
                </div>
              </div>
            </div>
          </div>
          <div class="col-md-12 card-footer ">
            <div class="form-group float-end ">
              <button [disabled]="EnvatoSetting.invalid || sendingResponse['envatoSett']" type="submit" class="btn btn-secondary" >{{'Save Changes' | translate}}@if (sendingResponse['envatoSett']) {
                <i class="fa fa-spinner fa-spin mx-1"></i>
              }
            </button>
          </div>
        </div>
      </form>
    </div>
  </div>
  <!-- End Envato Expires follow this url  -->
</div>