<div class="jdrupes-vmoperator-vmconlet jdrupes-vmoperator-vmconlet-preview"
  data-conlet-grid-rows="5"
  data-jgwc-on-load="orgJDrupesVmOperatorVmConlet.initPreview"
  data-jgwc-on-unload="JGConsole.jgwc.unmountVueApps">
  
  <form>
    <fieldset>
      <legend>{{ localize("Period") }}:</legend>
      <ul>
        <li>
          <label>
            <input type="radio" name="period" v-model="period" value="day">
            <span>{{ localize("Last day") }}</span>
          </label>
        </li>
        <li>
          <label>
            <input type="radio" name="period" v-model="period" value="hour">
            <span>{{ localize("Last hour") }}</span>
          </label>
        </li>
      </ul>
    </fieldset>
  </form>  
  
  <table>
    <tbody>
      <tr>
        <td>{{ localize("VMsSummary") }}:</td>
        <td>{{ vmSummary.runningVms }} / {{ vmSummary.totalVms }}</td>
      </tr>
      <tr>
        <td>{{ localize("Used CPUs") }}:</td>
        <td>{{ vmSummary.usedCpus }}</td>
      </tr>
      <tr>
        <td>{{ localize("Used RAM") }}:</td>
        <td>{{ formatMemory(Number(vmSummary.usedRam)) }}</td>
      </tr>
    </tbody>
  </table>
  <div class="vmsChart-wrapper">
    <canvas class="vmsChart"></canvas>
  </div>
  
</div>
