github.com/anth0d/nomad@v0.0.0-20221214183521-ae3a0a2cad06/ui/app/templates/components/drain-popover.hbs (about)

     1  {{! template-lint-disable require-input-label }}
     2  <PopoverMenu
     3    data-test-drain-popover
     4    @isDisabled={{this.isDisabled}}
     5    @label={{if this.client.isDraining "Update Drain" "Drain"}}
     6    @tooltip={{if this.isDisabled "Not allowed to drain clients"}}
     7    @triggerClass={{concat
     8      "is-small "
     9      (if this.drain.isRunning "is-loading ")
    10      (if this.isDisabled "tooltip is-right-aligned")
    11    }}
    12    as |m|
    13  >
    14    <form
    15      data-test-drain-popover-form
    16      onsubmit={{action
    17        (queue (action this.preventDefault) (perform this.drain m.actions.close))
    18      }}
    19      class="form is-small"
    20    >
    21      <h4 class="group-heading">Drain Options</h4>
    22      <div class="field">
    23        <label class="label is-interactive">
    24          <Toggle
    25            data-test-drain-deadline-toggle
    26            @isActive={{this.deadlineEnabled}}
    27            @onToggle={{action (mut this.deadlineEnabled) value="target.checked"}}
    28          >
    29            Deadline
    30          </Toggle>
    31          <span
    32            class="tooltip multiline"
    33            aria-label="The amount of time a drain must complete within."
    34          >
    35            {{x-icon "info-circle-outline" class="is-faded"}}
    36          </span>
    37        </label>
    38      </div>
    39      {{#if this.deadlineEnabled}}
    40        <div
    41          class="field is-sub-field"
    42          data-test-drain-deadline-option-select-parent
    43        >
    44          <PowerSelect
    45            data-test-drain-deadline-option-select
    46            @tagName="div"
    47            @options={{this.durationQuickOptions}}
    48            @selected={{this.selectedDurationQuickOption}}
    49            @onChange={{action (mut this.selectedDurationQuickOption)}}
    50            as |opt|
    51          >
    52            {{opt.label}}
    53          </PowerSelect>
    54        </div>
    55        {{#if this.durationIsCustom}}
    56          <div class="field is-sub-field">
    57            <label class="label">Deadline</label>
    58            <input
    59              data-test-drain-custom-deadline
    60              type="text"
    61              class="input {{if this.parseError 'is-danger'}}"
    62              placeholder="1h30m"
    63              value={{if (eq this.customDuration 0) "" this.customDuration}}
    64              oninput={{action
    65                (queue
    66                  (action (mut this.parseError) "")
    67                  (action (mut this.customDuration) value="target.value")
    68                )
    69              }}
    70            />
    71            {{#if this.parseError}}
    72              <em class="help is-danger">{{this.parseError}}</em>
    73            {{/if}}
    74          </div>
    75        {{/if}}
    76      {{/if}}
    77      <div class="field">
    78        <label class="label is-interactive">
    79          <Toggle
    80            data-test-force-drain-toggle
    81            @isActive={{this.forceDrain}}
    82            @onToggle={{action (mut this.forceDrain) value="target.checked"}}
    83          >
    84            Force Drain
    85          </Toggle>
    86          <span
    87            class="tooltip multiline"
    88            aria-label="Immediately remove allocations from the client."
    89          >
    90            {{x-icon "info-circle-outline" class="is-faded"}}
    91          </span>
    92        </label>
    93      </div>
    94      <div class="field">
    95        <label class="label is-interactive">
    96          <Toggle
    97            data-test-system-jobs-toggle
    98            @isActive={{this.drainSystemJobs}}
    99            @onToggle={{action (mut this.drainSystemJobs) value="target.checked"}}
   100          >
   101            Drain System Jobs
   102          </Toggle>
   103          <span
   104            class="tooltip multiline"
   105            aria-label="Stop allocations for system jobs."
   106          >
   107            {{x-icon "info-circle-outline" class="is-faded"}}
   108          </span>
   109        </label>
   110      </div>
   111      <div class="popover-actions">
   112        <button
   113          data-test-drain-submit
   114          type="button"
   115          class="popover-action is-primary"
   116          onclick={{perform this.drain m.actions.close}}
   117        >
   118          Drain
   119        </button>
   120        <button
   121          data-test-drain-cancel
   122          type="button"
   123          class="popover-action"
   124          onclick={{action m.actions.close}}
   125        >Cancel</button>
   126      </div>
   127    </form>
   128  </PopoverMenu>