public/app/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html

   1 <div id="ivrCampaigns" class="page-layout simple left-sidenav inner-sidenav">
   2
   3     <!-- HEADER -->
   4     <div class="header md-accent-bg" layout="row" layout-align="space-between center">
   5
   6         <!-- APP TITLE -->
   7         <div layout="row" layout-align="start center">
   8             <div class="logo" layout="row" layout-align="start center">
   9                 <span class="logo-icon">
  10                     <md-icon md-font-icon="icon-fire" class="s24"></md-icon>
  11                 </span>
  12                 <span class="logo-text" translate="MOTIONDIALER.IVRCAMPAIGNS">IvrCampaigns</span>
  13             </div>
  14         </div>
  15         <!-- / APP TITLE -->
  16
  17         <!-- SEARCH -->
  18         <div class="search-input-wrapper" layout="row" layout-align="start center">
  19             <label for="search">
  20                 <md-icon md-font-icon="icon-magnify"></md-icon>
  21             </label>
  22             <md-input-container md-no-float class="m-0">
  23                 <input id="search" placeholder="Search for anyone" type="text" ng-model="vm.query.filter" ng-model-options="{ debounce: 300 }" translate translate-attr-placeholder="MOTIONDIALER.SEARCH_FOR_ANYONE">
  24             </md-input-container>
  25         </div>
  26         <!-- / SEARCH -->
  27
  28     </div>
  29     <!-- / HEADER -->
  30
  31     <!-- SELECTED BAR -->
  32     <div ng-show="vm.selectedIvrCampaigns.length > 0" class="selected-bar header animate-slide-down md-accent-bg" layout="row" layout-align="start center">
  33
  34         <div class="close-button-wrapper" ng-click="vm.selectedIvrCampaigns =[]">
  35             <md-button layout="row" layout-align="start center">
  36                 <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
  37                 <span translate="MOTIONDIALER.BACK">Back</span>
  38             </md-button>
  39         </div>
  40
  41         <div flex layout="row" layout-align="space-between center">
  42
  43             <div>
  44                 <span class="selected-ivrCampaigns-count">
  45                     <span>{{vm.selectedIvrCampaigns.length}}</span>
  46                 <span translate="MOTIONDIALER.SELECTED">selected</span>
  47                 </span>
  48
  49                 <md-menu class="select-menu" ng-if="!vm.currentThread">
  50                     <md-button class="md-icon-button" ng-click="$mdOpenMenu($event)" aria-label="multi select toggle" translate translate-attr-aria-label="IVRCAMPAIGNS.MULTI_SELECT_TOGGLE">
  51                         <md-icon md-font-icon="icon-menu-down"></md-icon>
  52                     </md-button>
  53                     <md-menu-content width="3">
  54                         <md-menu-item>
  55                             <md-button ng-click="vm.selectAllIvrCampaigns()" translate="MOTIONDIALER.SELECT_ALL">
  56                                 Select all
  57                             </md-button>
  58                         </md-menu-item>
  59                         <md-menu-item>
  60                             <md-button ng-click="vm.deselectIvrCampaigns()" translate="MOTIONDIALER.SELECT_NONE">
  61                                 Select none
  62                             </md-button>
  63                         </md-menu-item>
  64                     </md-menu-content>
  65                 </md-menu>
  66             </div>
  67
  68             <div class="multi-select-actions">
  69                 <button class="md-icon-button" ng-csv="vm.exportSelectedIvrCampaigns" filename="ivrCampaigns.csv">
  70                     <md-icon md-font-icon="icon-download"></md-icon>
  71                 </button>
  72                 <md-button class="md-icon-button" ng-click="vm.deleteSelectedIvrCampaigns($event)" aria-label="delete selected" translate translate-attr-label="IVRCAMPAIGNS.DELETE_SELECTED">
  73                     <md-icon md-font-icon="icon-delete"></md-icon>
  74                 </md-button>
  75             </div>
  76         </div>
  77     </div>
  78     <!-- / SELECTED BAR -->
  79
  80     <!-- CONTENT -->
  81     <div class="content" md-background-bg layout="row" layout-align="start start">
  82
  83         <!-- MAIN -->
  84         <div class="main scrollable" ms-scroll>
  85
  86             <!-- IVRCAMPAIGN TABLE -->
  87             <md-card>
  88                 <md-table-container>
  89                     <table md-table md-row-select multiple ng-model="vm.selectedIvrCampaigns" md-progress="vm.promise">
  90                         <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getIvrCampaigns">
  91                             <tr md-row>
  92                                 <th md-column ng-if="vm.table == 'users' || vm.table == 'agents'" width="20px"></th>
  93                                 <th md-column md-order-by="id">{{ 'MOTIONDIALER.ID' | translate }}</th>
  94                                 <th md-column md-order-by="name">{{ 'MOTIONDIALER.NAME' | translate }}</th>
  95                                 <th md-column md-order-by="active">{{ 'MOTIONDIALER.ACTIVE' | translate }}</th>
  96                                 <th md-column md-order-by="TrunkId">{{ 'MOTIONDIALER.TRUNK' | translate }}</th>
  97                                 <th md-column md-order-by="SquareProjectId">{{ 'MOTIONDIALER.CALLYSQUAREPROJECT' | translate }}</th>
  98                                 <th md-column width="10px"></th>
  99                             </tr>
 100                         </thead>
 101                         <tbody md-body>
 102                             <tr md-row ng-hide="vm.ivrCampaigns.rows.length">
 103                                 <td md-cell colspan="6">
 104                                     <div layout="row" layout-align="center center">
 105                                         <span tranlsate="MOTIONDIALER.NO_AVAILABLE_INFO">No Available Info</span>
 106                                     </div>
 107                                 </td>
 108                             </tr>
 109                             <tr md-row md-select="ivrCampaign" md-select-id="id" ng-repeat="ivrCampaign in vm.ivrCampaigns.rows">
 110                                 <td md-cell ng-if="ivrCampaign.userpic"><img class="avatar" alt="{{ivrCampaign.name}}" ng-src="api/users/{{ivrCampaign.id}}/avatar" /></td>
 111                                 <td md-cell ng-if="!ivrCampaign.userpic && (vm.table == 'users' || vm.table == 'agents')"><img class="avatar" alt="{{ivrCampaign.name}}" ng-src="assets/images/avatars/profile.jpg" /></td>
 112                                 <td ng-click="vm.createOrEditIvrCampaign($event, ivrCampaign)" md-cell class="id ">{{ivrCampaign.id}}</td>
 113                                 <td ng-click="vm.createOrEditIvrCampaign($event, ivrCampaign)" md-cell class="name ">{{ivrCampaign.name}}</td>
 114                                 <td ng-click="vm.createOrEditIvrCampaign($event, ivrCampaign)" md-cell class="active ">
 115                                     <md-icon md-colors="{color: {{ivrCampaign.active ? '\'green\'' : '\'red\''}}}" md-font-icon="{{ivrCampaign.active ? 'icon-check' : 'icon-close'}}"></md-icon>
 116                                 </td>
 117                                 <td ng-click="vm.createOrEditIvrCampaign($event, ivrCampaign)" md-cell class="TrunkId ">{{ TrunkId = vm.trunks[ivrCampaign.TrunkId]; TrunkId.name }}</td>
 118                                 <td ng-click="vm.createOrEditIvrCampaign($event, ivrCampaign)" md-cell class="SquareProjectId ">{{ SquareProjectId = vm.projects[ivrCampaign.SquareProjectId]; SquareProjectId.name }}</td>
 119                                 <td md-cell class="actions">
 120                                     <md-menu>
 121                                         <md-button class="md-icon-button" aria-label="More" translate translate-attr-aria-label="MOTIONDIALER.MORE">
 122                                             <md-icon md-font-icon="icon-dots-vertical" ng-click="$mdOpenMenu($event)"></md-icon>
 123                                         </md-button>
 124
 125                                         <md-menu-content width="3">
 126                                             <md-menu-item>
 127                                                 <md-button ng-click="vm.editstate(ivrCampaign, $event)" translate="MOTIONDIALER.EDIT_IVRCAMPAIGN">
 128                                                     Edit IvrCampaign
 129                                                 </md-button>
 130                                             </md-menu-item>
 131                                             <md-menu-item>
 132                                                 <md-button ng-click="vm.listadddialog(ivrCampaign, $event)" translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN">
 133                                                     listadd IvrCampaign
 134                                                 </md-button>
 135                                             </md-menu-item>
 136                                             <md-menu-item>
 137                                                 <md-button ng-click="vm.blacklistadddialog(ivrCampaign, $event)" translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN">
 138                                                     blacklistadd IvrCampaign
 139                                                 </md-button>
 140                                             </md-menu-item>
 141                                             <md-menu-item>
 142                                                 <md-button ng-click="vm.deleteconfirm(ivrCampaign, $event)" translate="MOTIONDIALER.DELETE_IVRCAMPAIGN">
 143                                                     Delete IvrCampaign
 144                                                 </md-button>
 145                                             </md-menu-item>
 146                                         </md-menu-content>
 147                                     </md-menu>
 148                                 </td>
 149                             </tr>
 150                         </tbody>
 151                     </table>
 152                 </md-table-container>
 153
 154                 <md-table-pagination md-limit="vm.query.limit" md-limit-options="[10, 15, 20]" md-page="vm.query.page" md-total="{{vm.ivrCampaigns.count}}" md-on-paginate="vm.getIvrCampaigns" md-page-select></md-table-pagination>
 155             </md-card>
 156             <!-- / IVRCAMPAIGN TABLE -->
 157             <!-- NO RESULTS -->
 158
 159             <!-- / NO RESULTS -->
 160         </div>
 161         <!-- / MAIN -->
 162
 163     </div>
 164     <!-- / CONTENT -->
 165
 166     <!-- ADD IVRCAMPAIGN BUTTON -->
 167     <md-button class="md-fab md-accent" id="add-ivrCampaign-button" ng-click="vm.createOrEditIvrCampaign($event)" aria-label="add ivrCampaign" translate translate-attr-aria-label="MOTIONDIALER.ADD_IVRCAMPAIGN">
 168         <md-icon md-font-icon="icon-plus"></md-icon>
 169     </md-button>
 170     <!-- / ADD IVRCAMPAIGN BUTTON -->
 171 </div>