fab-manager/app/frontend/templates/admin/pricing/credits.html

<div ng-show="$root.modules.trainings">
  <h2 class="m-t-lg" translate>{{ 'app.admin.pricing.trainings' }}</h2>
  <table class="table">
    <thead>
    <tr>
      <th style="width:20%" translate>{{ 'app.admin.pricing.subscription' }}</th>
      <th style="width:10%" translate>{{ 'app.admin.pricing.credits' }}</th>
      <th style="width:50%" translate>{{ 'app.admin.pricing.related_trainings' }}</th>
      <th style="width:20%"></th>
    </tr>
    </thead>
    <tbody>

    <tr ng-repeat="(planId, trainingIds) in trainingCreditsGroups" ng-init="plan = getPlanFromId(planId)" ng-hide="plan.disabled">
      <td>
        {{ plan | humanReadablePlanName: groups }}
      </td>
      <td>
                        <span editable-text="plan.training_credit_nb" e-form="rowform" e-name="training_credits" e-required>
                            {{ plan.training_credit_nb }}
                        </span>
      </td>
      <td>
                        <span editable-checklist="trainingIds" e-form="rowform" e-name="training_ids" e-ng-options="t.id as t.name for t in trainings" e-required>
                            {{ showTrainings(trainingIds) }}
                        </span>
      </td>
      <td>
        <form editable-form name="rowform" onbeforesave="saveTrainingCredits($data, planId)" ng-show="rowform.$visible" class="form-buttons form-inline" shown="inserted == trainingIds">
          <button type="submit" ng-disabled="rowform.$waiting" class="fab-button is-secondary">
            <i class="fa fa-check"></i>
          </button>
          <button type="button" ng-disabled="rowform.$waiting" ng-click="cancelTrainingCredit(rowform)" class="fab-button">
            <i class="fa fa-times"></i>
          </button>
        </form>
        <div class="buttons" ng-show="!rowform.$visible">
          <button class="fab-button" ng-click="rowform.$show()">
            <i class="fa fa-edit"></i> {{ 'app.shared.buttons.edit' | translate }}
          </button>
        </div>
      </td>
    </tr>
    </tbody>
  </table>
</div>

<div ng-show="$root.modules.machines">
  <h2 class="m-t-lg" translate>{{ 'app.admin.pricing.machines' }}</h2>
  <div class="btn-group m-t-md m-b-md">
    <button type="button" class="fab-button is-secondary" ng-click="addMachineCredit($event)" translate>{{ 'app.admin.pricing.add_a_machine_credit' }}</button>
  </div>

  <table class="table">
    <thead>
    <tr>
      <th style="width:20%" translate>{{ 'app.admin.pricing.machine' }}</th>
      <th style="width:10%">{{ 'app.admin.pricing.hours' | translate:{DURATION:slotDuration} }}</th>
      <th style="width:50%" translate>{{ 'app.admin.pricing.related_subscriptions' }}</th>
      <th style="width:20%"></th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="mc in machineCredits" ng-hide="getPlanFromId(mc.plan_id).disabled || getCreditable(mc).disabled">
      <td>
                    <span editable-select="mc.creditable_id" e-name="creditable_id" e-form="rowform" e-ng-options="m.id as m.name+' ( id. '+m.id+' )' for m in enabledMachines" e-required>
                      {{ showCreditableName(mc) }}
                    </span>
      </td>
      <td>
                    <span editable-number="mc.hours" e-name="hours" e-form="rowform" e-required>
                      {{ mc.hours }}
                    </span>
      </td>
      <td>
                    <span editable-select="mc.plan_id" e-ng-options="p.id as humanReadablePlanName(p, groups, 'short') for p in enabledPlans" e-name="plan_id" e-form="rowform">
                      {{ getPlanFromId(mc.plan_id) | humanReadablePlanName: groups: 'short' }}
                    </span>
      </td>
      <td>
        <form editable-form name="rowform" onbeforesave="saveMachineCredit($data, mc.id)" ng-show="rowform.$visible" class="form-buttons form-inline" shown="inserted == mc">
          <button type="submit" ng-disabled="rowform.$waiting" class="fab-button is-secondary">
            <i class="fa fa-check"></i>
          </button>
          <button type="button" ng-disabled="rowform.$waiting" ng-click="cancelMachineCredit(rowform, $index)" class="fab-button">
            <i class="fa fa-times"></i>
          </button>
        </form>
        <div class="buttons" ng-show="!rowform.$visible">
          <button class="fab-button" ng-click="rowform.$show()">
            <i class="fa fa-edit"></i> {{ 'app.shared.buttons.edit' | translate }}
          </button>
          <button class="fab-button is-alert" ng-click="removeMachineCredit($index)">
            <i class="fa fa-trash-o"></i> {{ 'app.shared.buttons.delete' | translate }}
          </button>
        </div>
      </td>
    </tr>
    </tbody>
  </table>
</div>

<div ng-show="$root.modules.spaces">
  <h2 class="m-t-lg" translate>{{ 'app.admin.pricing.spaces' }}</h2>
  <div class="btn-group m-t-md m-b-md">
    <button type="button" class="fab-button is-secondary" ng-click="addSpaceCredit($event)" translate>{{ 'app.admin.pricing.add_a_space_credit' }}</button>
  </div>
  <table class="table">
    <thead>
    <tr>
      <th style="width:20%" translate>{{ 'app.admin.pricing.space' }}</th>
      <th style="width:10%">{{ 'app.admin.pricing.hours' | translate:{DURATION:slotDuration} }}</th>
      <th style="width:50%" translate>{{ 'app.admin.pricing.related_subscriptions' }}</th>
      <th style="width:20%"></th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="sc in spaceCredits" ng-hide="getPlanFromId(sc.plan_id).disabled || getCreditable(sc).disabled">
      <td>
                    <span editable-select="sc.creditable_id" e-name="creditable_id" e-form="rowform" e-ng-options="s.id as s.name for s in enabledSpaces" e-required>
                      {{ showCreditableName(sc) }}
                    </span>
      </td>
      <td>
                    <span editable-number="sc.hours" e-name="hours" e-form="rowform" e-required>
                      {{ sc.hours }}
                    </span>
      </td>
      <td>
                    <span editable-select="sc.plan_id" e-ng-options="p.id as humanReadablePlanName(p, groups, 'short') for p in enabledPlans" e-name="plan_id" e-form="rowform">
                      {{ getPlanFromId(sc.plan_id) | humanReadablePlanName: groups: 'short' }}
                    </span>
      </td>
      <td>
        <form editable-form name="rowform" onbeforesave="saveSpaceCredit($data, sc.id)" ng-show="rowform.$visible" class="form-buttons form-inline" shown="inserted == sc">
          <button type="submit" ng-disabled="rowform.$waiting" class="fab-button is-secondary">
            <i class="fa fa-check"></i>
          </button>
          <button type="button" ng-disabled="rowform.$waiting" ng-click="cancelSpaceCredit(rowform, $index)" class="fab-button">
            <i class="fa fa-times"></i>
          </button>
        </form>
        <div class="buttons" ng-show="!rowform.$visible">
          <button class="fab-button" ng-click="rowform.$show()">
            <i class="fa fa-edit"></i> {{ 'app.shared.buttons.edit' | translate }}
          </button>
          <button class="fab-button is-alert" ng-click="removeSpaceCredit($index)">
            <i class="fa fa-trash-o"></i> {{ 'app.shared.buttons.delete' | translate }}
          </button>
        </div>
      </td>
    </tr>
    </tbody>
  </table>
</div>