CPMS Ctrl

cpms.js

div
  loader(ng-if="!vm.ui.isDataLoaded")

  div(ng-if="vm.ui.isDataLoaded")
    .mb-md.clearfix
      h1.strong.pull-left Master CPMs

      .actions.ral-text(ng-if="vm.canEdit()")
        span(ng-if="vm.ui.isEditMode")
          button.btn.btn-default(type="button" ng-click="vm.cancel()" ng-disabled="vm.ui.loading.save") Cancel
          button.btn.btn-primary(type="button" ng-click="vm.save()" ng-disabled="vm.ui.loading.save || cpmForm.$invalid") Save
        span(ng-if="!vm.ui.isEditMode")
          button.btn.btn-primary(type="button" ng-click="vm.edit()") Edit Master CPMs

    .alert.alert-warning(ng-if="cpmForm.$invalid")
      .strong
        i.mr-xxs(fa="warning")
        | There is a problem.
      div Please verify the Master CPMs are actual numbers.

    form(name="cpmForm")
      div(ng-repeat="model in ['model_1', 'model_2']")
        h3.mb-xs.upcase.fs-subtitle Master CPMs For {{model === 'model_1' ? 'Network Spend': 'Targeted Placements'}}
        table.table.table-cpms.table-shadow.table-striped-inversed.table-columns-delimiter
          thead
            tr
              th.column-channel Channel
              th Vehicle power A
              th Vehicle power B
              th Vehicle power C
          tbody
            tr(ng-repeat="channel in vm.channels")
              td.column-channel {{ channel | formatChannel }}
              td.form-group(ng-repeat="vehiclePower in vm.vehiclePowers")
                span(ng-if="!vm.ui.isEditMode") {{ vm.cpms[model][channel][vehiclePower] | number:2 }}
                .input-group.p-none.pull-right(style="width: 100px;" ng-if="vm.ui.isEditMode")
                  span.input-group-addon $
                  input.form-control.ral-text(
                    type="text" ng-min="0"
                    ng-model-options="{updateOn: 'default blur'}"
                    ng-model="vm.cpms[model][channel][vehiclePower]" ng-pattern="/^\\d*[.]{0,1}\\d*$/" required
                  )

    .actions.ral-text(ng-if="vm.canEdit()")
      span(ng-if="vm.ui.isEditMode")
        button.btn.btn-default(type="button" ng-click="vm.cancel()" ng-disabled="vm.ui.loading.save") Cancel
        button.btn.btn-primary(type="button" ng-click="vm.save()" ng-disabled="vm.ui.loading.save || cpmForm.$invalid") Save
      span(ng-if="!vm.ui.isEditMode")
        button.btn.btn-primary(type="button" ng-click="vm.edit()") Edit Master CPMs

view.jade

// cpms-management.js
class CpmsManagementCtrl {

  constructor($q, $scope, VEHICLE_POWERS, CHANNELS, Settings, User) {

    this.$scope = $scope;
    this.User = User;

    this.ui = {
      isDataLoaded: false,
      isEditMode: false
    };
    this.Settings = Settings;
    this.channels = CHANNELS;
    this.vehiclePowers = VEHICLE_POWERS;


    this.scopeCPMValues = () => {
      this.cpms = [];
      this.Settings.all()
        .then((response) => {
          this.cpms = response.masterCPMs;
        });
    };

    $q.all([
      this.fetchAuthenticatedUser(),
      this.scopeCPMValues()
    ]).then((response) => {
      this.ui.isDataLoaded = true;
    });
  }

  fetchAuthenticatedUser() {
    return this.User.getCurrent().then((user) => {
      // console.log('u = ', user.getRole());
      return this.authenticatedUser = user;
    });
  }

  canEdit() {
    if (this.authenticatedUser) {
      console.log('Role > ', this.authenticatedUser.getRole());
      console.log(this.authenticatedUser.isInternal());
      // HACK! Loading problem for view?
        //  @Victor
      // if (_.contains(this.authenticatedUser.getRole(), ''))
      // {

      // }
      // return this.authenticatedUser.can('cpm.update', this.cpms);
    }
    return false;
  }

  edit() {
    this.ui.isEditMode = true;
  }

  save() {
    this.Settings.set('masterCPMs', this.cpms)
      .then((saveResponse) => {
        this.ui.isEditMode = false;
      });
  }

  cancel() {
    this.scopeCPMValues();
    this.ui.isEditMode = false;
  }

  isInvalid(cpm) {
    if (isNaN(cpm)) {
      return true;
    }
    return parseFloat(cpm) <= 0;
  }
}

CpmsManagementCtrl.$inject = ['$q', '$scope', 'VEHICLE_POWERS', 'CHANNELS', 'Settings', 'User'];

export default CpmsManagementCtrl;