build.html

<div class="hidden" data-form-builder-id="{{ id }}">
  <form v-if="isConfigured" v-on:submit.prevent="onSubmit" class="fl-form" v-bind:class="{ 'form-offline': isOffline, 'loading-form': isSending || isLoading && !blockScreen }">
    <template v-if="isSending">
      <div class="sending-form">
        <div class="spinner-holder animated">
          <div class="spinner-overlay" data-translate="widgets.form.loading">Loading...</div>
          <p v-html="isSendingMessage"></p>
        </div>
      </div>
    </template>
    <template v-if="isLoading && !blockScreen">
      <div class="sending-form">
        <div class="spinner-holder animated">
          <div class="spinner-overlay" data-translate="widgets.form.loading">Loading...</div>
          <p v-html="isLoadingMessage"></p>
        </div>
      </div>
    </template>
    <div v-if="!isSent" class="form-html">
      <div v-if="isOffline" class="text-danger w-full" v-bind:class="{ 'cover-form' : blockScreen }" v-html="isOfflineMessage"></div>
      <div v-if="hasRequiredFields" class="w-full required-info-label">\{{$t("widgets.form.sending.requiredFields")}}</div>
      <template v-for="field in fields">
        <component :is="field._type" v-bind="field" v-on:_input="onInput" v-on:_error="onError" v-on:_reset="reset" v-on:getDataSourceColumnValues="getDataSourceColumnValues" v-if="field.enabled"></component>
      </template>
      <div class="callout callout-danger w-full" v-if="error">
        <p>\{{ error }}</p>
      </div>
    </div>
    <transition name="fade">
      <div v-if="isSent && !redirect">{{{ resultHtml }}}</div>
    </transition>
  </form>
  <div v-else class="col-sm-12 loading-message">
    <!-- Show loading animation -->
    <div class="spinner-holder animated">
      <div class="spinner-overlay">Loading...</div>
    </div>
  </div>
</div>