public/app/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html

   1 <md-dialog class="inboundroute-dialog" aria-label="New Interval">
   2     <form name="intervalForm" class="md-inline-form" novalidate>
   3         <md-toolbar class="md-accent md-hue-2">
   4             <div class="md-toolbar-tools" layout="row" layout-align="space-between center">
   5                 <span class="title">{{ vm.title | translate }}</span>
   6                 <md-button class="md-icon-button" ng-click="vm.closeDialog()">
   7                     <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
   8                 </md-button>
   9             </div>
  10         </md-toolbar>
  11
  12         <md-dialog-content ms-scroll>
  13             <div class="error-list">
  14                 <div ng-repeat="error in vm.errors" class="error" layout="row" layout-align="space-between center">
  15                     <div>
  16                         <span class="message">{{error.message}}</span>
  17                         <span class="type">({{error.type}})</span>
  18                     </div>
  19                     <md-button class="md-icon-button">
  20                         <md-icon md-font-icon="icon-alert-box" aria-label="alert error" class="s16"></md-icon>
  21                     </md-button>
  22                 </div>
  23             </div>
  24
  25
  26             <md-input-container class="md-block">
  27                 <label translate="TOOLS.TYPE">Type</label>
  28                 <md-select ng-model="vm.type">
  29                     <md-option ng-value="type" ng-repeat='type in vm.types'>{{ type | ucfirst }}</md-option>
  30                 </md-select>
  31             </md-input-container>
  32
  33             <md-input-container class="md-block" ng-if="vm.type === 'list'">
  34                 <label translate="TOOLS.INTERVALS">Intervals</label>
  35                 <md-select ng-model="vm.interval.IntervalId">
  36                     <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals.rows">{{ interval.name }}</md-option>
  37                 </md-select>
  38             </md-input-container>
  39
  40             <!-- TIMERANGE START -->
  41             <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE">Time Range</label>
  42             <div layout=row ng-if="vm.type === 'custom'">
  43                 <div class="md-block" flex>
  44                     <mdp-time-picker name="timeRangeFrom" mdp-placeholder="FROM" ng-model="vm.timeRangeFrom" mdp-format="HH:mm" mdp-auto-switch="true">
  45                         <div ng-messages="intervalForm.timeRangeFrom.$error" ng-show="intervalForm.timeRangeFrom.$touched" role="alert">
  46                             <div ng-message="format">
  47                                 <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID">Time Range From field is invalid</span>
  48                             </div>
  49                         </div>
  50                     </mdp-time-picker>
  51                 </div>
  52                 <div class="md-block" flex>
  53                     <mdp-time-picker name="timeRangeTo" mdp-placeholder="TO" ng-model="vm.timeRangeTo" mdp-format="HH:mm" mdp-auto-switch="true">
  54                         <div ng-messages="intervalForm.timeRangeTo.$error" ng-show="intervalForm.timeRangeTo.$touched" role="alert">
  55                             <div ng-message="format">
  56                                 <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID">Time Range To field is invalid</span>
  57                             </div>
  58                         </div>
  59                     </mdp-time-picker>
  60                 </div>
  61             </div>
  62             <!-- TIMERANGE END -->
  63
  64             <!-- DAYSOFWEEK START -->
  65             <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS">Time Range</label>
  66             <div layout=row ng-if="vm.type === 'custom'">
  67                 <md-input-container flex class="md-block">
  68                     <label translate="TOOLS.FROM">From</label>
  69                     <md-select ng-model="vm.dayOfWeekFrom">
  70                         <md-option ng-value="null"><span translate="TOOLS.ALWAYS">Always</span></md-option>
  71                         <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"><span translate="TOOLS.{{day.value | uppercase}}">{{ day.value | ucfirst }}</span></md-option>
  72                     </md-select>
  73                 </md-input-container>
  74
  75                 <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
  76                     <label translate="TOOLS.TO">To</label>
  77                     <md-select ng-model="vm.dayOfWeekTo">
  78                         <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"><span translate="TOOLS.{{day.value | uppercase}}">{{ day.value | ucfirst }}</span></md-option>
  79                     </md-select>
  80                 </md-input-container>
  81             </div>
  82             <!-- DAYSOFWEEK END -->
  83
  84             <!-- MONTHDAY START -->
  85             <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS">Time Range</label>
  86             <div layout=row ng-if="vm.type === 'custom'">
  87                 <md-input-container flex layout="column" class="md-block">
  88                     <label translate="TOOLS.FROM">From</label>
  89                     <md-select ng-model="vm.monthDayFrom">
  90                         <md-option ng-value="null"><span translate="TOOLS.ALWAYS">Always</span></md-option>
  91                         <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth">{{ month }}</md-option>
  92                     </md-select>
  93                 </md-input-container>
  94
  95                 <md-input-container flex layout="column" class="md-block" ng-if="vm.monthDayFrom">
  96                     <label translate="TOOLS.TO">To</label>
  97                     <md-select ng-model="vm.monthDayTo">
  98                         <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth">{{ month }}</md-option>
  99                     </md-select>
 100                 </md-input-container>
 101             </div>
 102             <!-- MONTHDAY END -->
 103
 104             <!-- MONTH START -->
 105             <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS">Time Range</label>
 106             <div layout=row ng-if="vm.type === 'custom'">
 107                 <md-input-container flex layout="column" class="md-block">
 108                     <label translate="TOOLS.FROM">From</label>
 109                     <md-select ng-model="vm.monthFrom">
 110                         <md-option ng-value="null"><span translate="TOOLS.ALWAYS">Always</span></md-option>
 111                         <md-option ng-value="month.value" ng-repeat="month in vm.monthName"><span translate="TOOLS.{{month.value | uppercase}}">{{ month.value | ucfirst }}</span></md-option>
 112                     </md-select>
 113
 114                 </md-input-container>
 115
 116                 <md-input-container flex layout="column" class="md-block" ng-if="vm.monthFrom">
 117                     <label translate="TOOLS.TO">To</label>
 118                     <md-select ng-model="vm.monthTo">
 119                         <md-option ng-value="month.value" ng-repeat="month in vm.monthName"><span translate="TOOLS.{{month.value | uppercase}}">{{ month.value | ucfirst }}</span></md-option>
 120                     </md-select>
 121                 </md-input-container>
 122             </div>
 123             <!-- MONTH END -->
 124
 125             <div class="error-list">
 126                 <div ng-repeat="error in vm.errors" class="error" layout="row" layout-align="space-between center">
 127                     <div>
 128                         <span class="message">{{error.message}}</span>
 129                         <span class="type">({{error.type}})</span>
 130                     </div>
 131                     <md-button class="md-icon-button">
 132                         <md-icon md-font-icon="icon-alert-box" aria-label="alert error" class="s16"></md-icon>
 133                     </md-button>
 134                 </div>
 135             </div>
 136         </md-dialog-content>
 137
 138         <md-dialog-actions layout="row" layout-align="space-between center">
 139             <div layout="row" layout-align="start center">
 140                 <md-button type="submit" ng-if="!vm.newInterval" ng-click="vm.saveInterval()" class="send-button md-accent md-raised" ng-disabled="intervalForm.$invalid || intervalForm.$pristine" aria-label="SAVE" translate="TOOLS.SAVE" translate-attr-aria-label="TOOLS.SAVE">
 141                     SAVE
 142                 </md-button>
 143
 144                 <md-button type="submit" ng-if="vm.newInterval" ng-click="vm.addNewInterval()" class="send-button md-accent md-raised" ng-disabled="intervalForm.$invalid" aria-label="ADD" translate="TOOLS.ADD_INTERVAL" translate-attr-aria-label="TOOLS.ADD_INTERVAL">
 145                     ADD INTERVAL
 146                 </md-button>
 147             </div>
 148         </md-dialog-actions>
 149     </form>
 150 </md-dialog>