Motion >> Repos - motion-next.git/blob

   1 <div
   2   id="ivrCampaigns"
   3   class="page-layout simple left-sidenav inner-sidenav motion-list"
   4 >
   5   <!-- HEADER -->
   6   <div
   7     class="header md-accent-bg"
   8     layout="row"
   9     layout-align="space-between center"
  10   >
  11     <!-- APP TITLE -->
  12     <div layout="row" layout-align="start center">
  13       <div class="logo" layout="row" layout-align="start center">
  14         <span class="logo-icon">
  15           <md-icon md-font-icon="icon-fire" class="s24"></md-icon>
  16         </span>
  17         <span class="logo-text" translate="MOTIONDIALER.IVRCAMPAIGNS"
  18           >IvrCampaigns</span
  19         >
  20       </div>
  21     </div>
  22     <!-- / APP TITLE -->
  23
  24     <div layout="row">
  25       <!-- SEARCH -->
  26       <div
  27         class="search-input-wrapper"
  28         layout="row"
  29         layout-align="start center"
  30       >
  31         <label for="search">
  32           <md-icon md-font-icon="icon-magnify"></md-icon>
  33         </label>
  34         <md-input-container md-no-float class="m-0">
  35           <input
  36             id="search"
  37             placeholder="Search for anyone"
  38             type="text"
  39             ng-model="vm.query.filter"
  40             ng-model-options="{ debounce: 1000 }"
  41             translate
  42             translate-attr-placeholder="MOTIONDIALER.SEARCH_FOR_ANYONE"
  43           />
  44         </md-input-container>
  45       </div>
  46       <!-- / SEARCH -->
  47     </div>
  48   </div>
  49   <!-- / HEADER -->
  50
  51   <!-- SELECTED BAR -->
  52   <div
  53     ng-show="vm.selectedIvrCampaigns.length > 0"
  54     class="selected-bar header animate-slide-down md-accent-bg"
  55     layout="row"
  56     layout-align="start center"
  57   >
  58     <div class="close-button-wrapper" ng-click="vm.selectedIvrCampaigns =[]">
  59       <md-button layout="row" layout-align="start center">
  60         <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
  61         <span translate="MOTIONDIALER.BACK">Back</span>
  62       </md-button>
  63     </div>
  64
  65     <div flex layout="row" layout-align="space-between center">
  66       <div>
  67         <span class="selected-ivrCampaigns-count">
  68           <span>{{vm.selectedIvrCampaigns.length}}</span>
  69           <span translate="MOTIONDIALER.SELECTED">selected</span>
  70         </span>
  71
  72         <md-menu class="select-menu" ng-if="!vm.currentThread">
  73           <md-button
  74             class="md-icon-button"
  75             ng-click="$mdMenu.open($event)"
  76             aria-label="multi select toggle"
  77             translate
  78             translate-attr-aria-label="MOTIONDIALER.MULTI_SELECT_TOGGLE"
  79           >
  80             <md-icon md-font-icon="icon-menu-down"></md-icon>
  81           </md-button>
  82           <md-menu-content width="3">
  83             <md-menu-item>
  84               <md-button
  85                 ng-click="vm.selectAllIvrCampaigns()"
  86                 translate="MOTIONDIALER.SELECT_ALL"
  87               >
  88                 Select all
  89               </md-button>
  90             </md-menu-item>
  91             <md-menu-item>
  92               <md-button
  93                 ng-click="vm.deselectIvrCampaigns()"
  94                 translate="MOTIONDIALER.SELECT_NONE"
  95               >
  96                 Select none
  97               </md-button>
  98             </md-menu-item>
  99           </md-menu-content>
 100         </md-menu>
 101       </div>
 102
 103       <div class="multi-select-actions">
 104         <button
 105           class="md-icon-button"
 106           ng-csv="vm.exportSelectedIvrCampaigns"
 107           csv-label="true"
 108           filename="ivrCampaigns.csv"
 109         >
 110           <md-icon md-font-icon="icon-file-excel"></md-icon>
 111         </button>
 112         <md-button
 113           class="md-icon-button"
 114           ng-if="vm.crudPermissions.canDelete"
 115           ng-click="vm.deleteSelectedIvrCampaigns($event)"
 116           aria-label="delete selected"
 117           translate
 118           translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
 119         >
 120           <md-icon md-font-icon="icon-delete"></md-icon>
 121         </md-button>
 122       </div>
 123     </div>
 124   </div>
 125   <!-- / SELECTED BAR -->
 126
 127   <!-- CONTENT -->
 128   <div class="content" md-background-bg layout="row" layout-align="start start">
 129     <!-- MAIN -->
 130     <div class="main scrollable" ms-scroll>
 131       <!-- IVRCAMPAIGN TABLE -->
 132       <md-card>
 133         <md-table-container>
 134           <table
 135             md-table
 136             md-row-select
 137             multiple
 138             ng-model="vm.selectedIvrCampaigns"
 139             md-progress="vm.promise"
 140           >
 141             <thead
 142               md-head
 143               md-order="vm.query.sort"
 144               md-on-reorder="vm.getIvrCampaigns"
 145             >
 146               <tr md-row>
 147                 <th
 148                   md-column
 149                   ng-if="vm.table == 'users' || vm.table == 'agents'"
 150                   width="20px"
 151                 ></th>
 152                 <th md-column md-order-by="id">
 153                   {{ 'MOTIONDIALER.ID' | translate }}
 154                 </th>
 155                 <th md-column md-order-by="name">
 156                   {{ 'MOTIONDIALER.NAME' | translate }}
 157                 </th>
 158                 <th md-column md-order-by="active">
 159                   {{ 'MOTIONDIALER.ACTIVE' | translate }}
 160                 </th>
 161                 <th md-column md-order-by="TrunkId">
 162                   {{ 'MOTIONDIALER.TRUNK' | translate }}
 163                 </th>
 164                 <th md-column md-order-by="SquareProjectId">
 165                   {{ 'MOTIONDIALER.CALLYSQUAREPROJECT' | translate }}
 166                 </th>
 167                 <th md-column width="10px"></th>
 168               </tr>
 169             </thead>
 170             <tbody md-body>
 171               <tr md-row ng-hide="vm.ivrCampaigns.rows.length">
 172                 <td md-cell colspan="6">
 173                   <div layout="row" layout-align="center center">
 174                     <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
 175                       >No Available Info</span
 176                     >
 177                   </div>
 178                 </td>
 179               </tr>
 180               <tr
 181                 md-row
 182                 md-select="ivrCampaign"
 183                 md-select-id="id"
 184                 ng-repeat="ivrCampaign in vm.ivrCampaigns.rows"
 185               >
 186                 <td md-cell ng-if="ivrCampaign.userpic">
 187                   <img
 188                     class="avatar"
 189                     alt="{{ivrCampaign.name}}"
 190                     ng-src="api/users/{{ivrCampaign.id}}/avatar"
 191                   />
 192                 </td>
 193                 <td
 194                   md-cell
 195                   ng-if="!ivrCampaign.userpic && (vm.table == 'users' || vm.table == 'agents')"
 196                 >
 197                   <img
 198                     class="avatar"
 199                     alt="{{ivrCampaign.name}}"
 200                     ng-src="assets/images/avatars/profile.png"
 201                   />
 202                 </td>
 203                 <td
 204                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
 205                   md-cell
 206                   class="id"
 207                 >
 208                   {{ivrCampaign.id}}
 209                 </td>
 210                 <td
 211                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
 212                   md-cell
 213                   class="name"
 214                 >
 215                   {{ivrCampaign.name}}
 216                 </td>
 217                 <td
 218                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
 219                   md-cell
 220                   class="active"
 221                 >
 222                   <md-icon
 223                     md-colors="{color: {{ivrCampaign.active ? '\'green\'' : '\'grey\''}}}"
 224                     md-font-icon="{{ivrCampaign.active ? 'icon-check' : 'icon-close'}}"
 225                   ></md-icon>
 226                 </td>
 227                 <td
 228                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
 229                   md-cell
 230                   class="TrunkId"
 231                 >
 232                   {{ (vm.trunks | filter : {'id':ivrCampaign.TrunkId} :
 233                   true)[0].name }}
 234                 </td>
 235                 <td
 236                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
 237                   md-cell
 238                   class="SquareProjectId"
 239                 >
 240                   {{ (vm.projects | filter : {'id':ivrCampaign.SquareProjectId}
 241                   : true)[0].name }}
 242                 </td>
 243
 244                 <td md-cell class="actions">
 245                   <md-menu>
 246                     <md-button
 247                       class="md-icon-button"
 248                       aria-label="More"
 249                       translate
 250                       translate-attr-aria-label="MOTIONDIALER.MORE"
 251                       ng-click="$mdMenu.open($event)"
 252                     >
 253                       <md-icon md-font-icon="icon-dots-vertical"></md-icon>
 254                     </md-button>
 255
 256                     <md-menu-content width="3">
 257                       <!-- SUBACTIONS -->
 258
 259                       <!-- ACTIONS -->
 260
 261                       <md-menu-item ng-if="vm.crudPermissions.canEdit">
 262                         <md-button
 263                           ng-click="vm.editstate(ivrCampaign, $event    )"
 264                           translate="MOTIONDIALER.EDIT_IVRCAMPAIGN"
 265                         >
 266                           Edit IvrCampaign
 267                         </md-button>
 268                       </md-menu-item>
 269
 270                       <!-- SUBACTIONS -->
 271
 272                       <!-- ACTIONS -->
 273
 274                       <md-menu-item ng-if="vm.crudPermissions.canEdit">
 275                         <md-button
 276                           ng-click="vm.clonedialog(ivrCampaign, $event    )"
 277                           translate="MOTIONDIALER.CLONE_IVRCAMPAIGN"
 278                         >
 279                           clone IvrCampaign
 280                         </md-button>
 281                       </md-menu-item>
 282
 283                       <!-- SUBACTIONS -->
 284
 285                       <!-- ACTIONS -->
 286
 287                       <md-menu-item>
 288                         <md-button
 289                           ng-click="vm.listadddialog(ivrCampaign, $event    )"
 290                           translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN"
 291                         >
 292                           listadd IvrCampaign
 293                         </md-button>
 294                       </md-menu-item>
 295
 296                       <!-- SUBACTIONS -->
 297
 298                       <!-- ACTIONS -->
 299
 300                       <md-menu-item>
 301                         <md-button
 302                           ng-click="vm.blacklistadddialog(ivrCampaign, $event    )"
 303                           translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN"
 304                         >
 305                           blacklistadd IvrCampaign
 306                         </md-button>
 307                       </md-menu-item>
 308
 309                       <!-- SUBACTIONS -->
 310
 311                       <!-- ACTIONS -->
 312
 313                       <md-menu-item ng-if="vm.crudPermissions.canDelete">
 314                         <md-button
 315                           ng-click="vm.deleteconfirm(ivrCampaign, $event    )"
 316                           translate="MOTIONDIALER.DELETE_IVRCAMPAIGN"
 317                         >
 318                           Delete IvrCampaign
 319                         </md-button>
 320                       </md-menu-item>
 321
 322                       <!-- SUBACTIONS -->
 323
 324                       <!-- ACTIONS -->
 325
 326                       <md-menu-item>
 327                         <md-button
 328                           ng-click="vm.gotorealtimegoto(ivrCampaign, $event    )"
 329                           translate="MOTIONDIALER.GOTOREALTIME_IVRCAMPAIGN"
 330                         >
 331                           goToRealtime IvrCampaign
 332                         </md-button>
 333                       </md-menu-item>
 334                     </md-menu-content>
 335                   </md-menu>
 336                 </td>
 337               </tr>
 338             </tbody>
 339           </table>
 340         </md-table-container>
 341
 342         <md-table-pagination
 343           md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
 344           md-limit="vm.query.limit"
 345           md-limit-options="[10, 15, 20, 50, 100, 250]"
 346           md-page="vm.query.page"
 347           md-total="{{vm.ivrCampaigns.count}}"
 348           md-on-paginate="vm.getIvrCampaigns"
 349           md-page-select
 350         ></md-table-pagination>
 351       </md-card>
 352       <!-- / IVRCAMPAIGN TABLE -->
 353       <!-- NO RESULTS -->
 354
 355       <!-- / NO RESULTS -->
 356     </div>
 357     <!-- / MAIN -->
 358   </div>
 359   <!-- / CONTENT -->
 360
 361   <!-- ADD IVRCAMPAIGN BUTTON -->
 362   <md-button
 363     ng-if="vm.crudPermissions.canEdit"
 364     class="md-fab md-accent add-item-button"
 365     id="add-ivrCampaign-button"
 366     ng-click="vm.createOrEditIvrCampaign($event)"
 367     aria-label="add ivrCampaign"
 368     translate
 369     translate-attr-aria-label="MOTIONDIALER.ADD_IVRCAMPAIGN"
 370   >
 371     <md-icon md-font-icon="icon-plus"></md-icon>
 372   </md-button>
 373   <!-- / ADD IVRCAMPAIGN BUTTON -->
 374 </div>